Flatten nested repos

test/vuex/lama/t01/components/listPatientComponent.js

@@ -0,0 +1,138 @@
+var listPatientComponent = {
+  template: `
+  <v-card class="xs12 md12" >
+    <v-card-title>
+      <v-layout>
+        <v-flex xs12 sm8>
+          <v-toolbar-title>Patient Listing</v-toolbar-title>
+        </v-flex>
+        <v-flex xs12 sm4>
+          <v-spacer></v-spacer>
+          <v-text-field
+            v-model="query"
+            append-icon="search"
+            @click:clear="clearSearch"
+            @keydown.enter="doSearch"
+            @click:append="doSearch"
+            label="Search"
+            single-line
+            hide-details
+            clearable
+            class="xs12 md3"
+          ></v-text-field>
+        </v-flex>
+      </v-layout>
+    </v-card-title>
+    <v-data-table :headers="headers" :items="patients" 
+    :loading="isLoading"
+    hide-actions class="elevation-1">
+      <template slot="items" slot-scope="props">
+        <td>{{ props.item.M_PatientNoReg }}</td>
+        <td>{{ props.item.M_PatientName }}</td>
+        <td class="text-xs-center">{{ props.item.M_PatientDOB }}</td>
+        <td>{{ props.item.M_PatientHP }}</td>
+        <td>{{ props.item.M_PatientAddress }}</td>
+      </template>
+      <template slot="no-data">
+        <v-alert :value="isError" color="error" icon="warning">
+          {{errorMessage}}
+        </v-alert>
+        <v-spacer></v-spacer>
+      </template>
+      <template slot="footer">
+        <td colspan="2" class="text-xs-left">
+          Total Records : {{totalRecord}}, page {{page}} of {{totalPage}}.
+        </td>
+        <td colspan="3" class="text-xs-right">
+            <v-pagination :length="totalPage" :value="page" :total-visible="10" 
+            @next="nextPage" @prev="prevPage" 
+            @input="gotoPage" >
+            </v-pagination>
+        </td>
+      </template>
+    </v-data-table>
+  </v-card>
+  `,
+  mounted() {
+    this.doSearch();
+  },
+  data() {
+    return {
+      query: "",
+      headers: [
+        {
+          text: "No. Reg",
+          align: "left",
+          sortable: false,
+          value: "M_PatientNoReg"
+        },
+        {
+          text: "Name",
+          align: "left",
+          sortable: false,
+          value: "M_PatientName"
+        },
+        {
+          text: "DOB",
+          align: "center",
+          sortable: false,
+          value: "M_PatientDOB"
+        },
+        {
+          text: "HP",
+          value: "M_PatientHP",
+          sortable: false,
+          align: "left"
+        },
+        {
+          text: "Address",
+          value: "M_PatientAddress",
+          sortable: false,
+          align: "left"
+        }
+      ]
+    };
+  },
+  methods: {
+    clearSearch() {
+      this.query = "";
+      this.doSearch();
+    },
+    doSearch(page = 1, rowPerPage = 8) {
+      if (this.query == null) this.query = "";
+      this.$store.dispatch("searchPatient", {
+        query: this.query,
+        page,
+        rowPerPage
+      });
+    },
+    prevPage() {
+      let c_page = this.page - 1;
+      this.doSearch(c_page);
+    },
+    nextPage() {
+      let c_page = this.page + 1;
+      this.doSearch(c_page);
+    },
+    gotoPage(e) {
+      let c_page = e;
+      this.doSearch(c_page);
+    }
+  },
+  computed: {
+    ...Vuex.mapState({
+      isLoading: state => state.isLoading,
+      isError: state => state.isError,
+      errorMessage: state => state.errorMessage,
+      patients: state => state.rows,
+      totalRecord: state => state.totalRecord,
+      page: state => state.page,
+      totalPage: state => state.totalPage
+    })
+  },
+  updated() {
+    console.log("Component Updated");
+  }
+};
+
+export { listPatientComponent };

test/vuex/lama/t01/components/smartNavbarComponent.js

@@ -0,0 +1,38 @@
+var smartNavbarComponent = {
+  template: `
+  <span>
+  <v-navigation-drawer v-model="drawer" fixed app>
+    <v-list dense>
+      <v-list-tile>
+        <v-list-tile-action>
+          <v-icon>home</v-icon>
+        </v-list-tile-action>
+        <v-list-tile-content>
+          <v-list-tile-title>Home</v-list-tile-title>
+        </v-list-tile-content>
+      </v-list-tile>
+      <v-list-tile>
+        <v-list-tile-action>
+          <v-icon>contact_mail</v-icon>
+        </v-list-tile-action>
+        <v-list-tile-content>
+          <v-list-tile-title>Contact</v-list-tile-title>
+        </v-list-tile-content>
+      </v-list-tile>
+    </v-list>
+  </v-navigation-drawer>
+  <v-toolbar color="indigo" dark fixed app>
+    <v-toolbar-side-icon @click.stop="drawer = !drawer"></v-toolbar-side-icon>
+    <v-toolbar-title>Application</v-toolbar-title>
+  </v-toolbar>
+  </span>
+  `,
+  data: function() {
+    return {
+      drawer: false
+    };
+  },
+  methods: {}
+};
+
+export { smartNavbarComponent };