Basic Vue function for search

js/components/forms/members_list.js

@@ -0,0 +1,29 @@
+
+export default {
+  name: 'members-list',
+
+  template: '#search-template',
+
+  props: {
+    members: Array,
+  },
+
+  data: function () {
+    return {
+      searchValue: '',
+      searchedList: [],
+    }
+  },
+
+  mounted: function () {
+    // console.log(this.members)
+  },
+
+  methods: {
+    search: function () {
+      console.log(this.members)
+      this.searchedList = this.members.filter(member => member.name.includes(this.searchValue))
+      console.log(this.searchedList)
+    },
+  },
+}

js/index.js

@@ -20,6 +20,7 @@ import selector from './components/selector'
 import BudgetChart from './components/charts/budget_chart'
 import SpendTable from './components/tables/spend_table'
 import CcpoApproval from './components/forms/ccpo_approval'
+import MembersList from './components/forms/members_list'
 import LocalDatetime from './components/local_datetime'
 
 Vue.use(VTooltip)
@@ -41,6 +42,7 @@ const app = new Vue({
     BudgetChart,
     SpendTable,
     CcpoApproval,
+    MembersList,
     LocalDatetime,
     EditEnvironmentRole,
     EditProjectRoles,