list Test result

resources/js/vue/config/urls.js

@@ -6,6 +6,7 @@ const urls = {
     logout : "/logout",
     storeMedicalCenter : "/MedicalCenters",
     storeTestResult : "/TestResults",
+    listTestResult : "/TestResults",
     listTestTypeName : "/TestTypes/ListNames",
     getInputs : `/GetInputs`,
     listOpertor : "/Users",

resources/js/vue/views/TestResult/List.vue

@@ -40,42 +40,38 @@
       </v-layout>
       <v-divider></v-divider>
       <v-layout align-center wrap class="my-3">
-        <v-flex xs1>
-          <v-card-title>
-            <div>
-              <div>
-                222
-              </div>
-              <div>
-                Test
-              </div>
-              <div class="">
-                1
-              </div>
-            </div>
-          </v-card-title>
-        </v-flex>
-        <v-flex xs6>
-          <v-card-text>
-            <p>
-                Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna
-            </p>
-          </v-card-text>
-        </v-flex>
-        <v-flex xs4>
-          <v-card-text>
-            <v-btn color="black" class="mr-2">
-              <v-icon class="white--text mr-1 caption">fas fa-folder</v-icon>
-              <span>Archive</span>
-            </v-btn>
-            <v-btn color="cyan" class="mr-2">
-              <v-icon class="white--text mr-1 caption">fas fa-pen</v-icon>
-              <span>Edit</span>
-            </v-btn>
-          </v-card-text>
+         <v-flex md12>
+          <v-data-table :headers="headers" :items="items" hide-actions>
+            <template slot="headerCell" slot-scope="{ header }">
+              <span
+                class="subheading font-weight-light text-white text--darken-3"
+                v-text="header.text"
+              />
+            </template>
+            <template slot="items" slot-scope="{ item }">
+              <td class="headline font-weight-light">{{ item.autoclave_id }}</td>
+              <td class="title font-weight-light">{{ item.user.medical_center.name }}</td>
+              <td class="title font-weight-light">{{ item.user.name }}</td>
+              <td class="title font-weight-light">{{ item.result }}</td>
+              <td class="title font-weight-light">{{ item.created_at }}</td>
+              <td class="text-xs-right">
+                <v-btn color="black" class="mr-2">
+                  <v-icon class="white--text mr-1 caption">fas fa-folder</v-icon>
+                  <span>Archive</span>
+                </v-btn>
+                <v-btn color="cyan" class="mr-2">
+                  <v-icon class="white--text mr-1 caption">fas fa-pen</v-icon>
+                  <span>Edit</span>
+                </v-btn>
+              </td>
+            </template>
+          </v-data-table>
         </v-flex>
       </v-layout>
       <v-divider></v-divider>
+      <div class="text-xs-center" v-if="lastPage > 1">
+        <v-pagination v-model="currentPage" :length="lastPage" :total-visible="6"></v-pagination>
+      </div>
       <v-layout row wrap align-center justify-center class="mt-3">
         <router-link to="/dashboard">
           <v-btn
@@ -91,7 +87,61 @@
 </template>
 
 <script>
+import { ApiService } from "@/services";
+import { urls } from "@/config/urls";
+
 export default {
+  data: () => ({
+    headers: [
+      {
+        sortable: false,
+        text: "AutoClaveId",
+        value: "name"
+      },
+      {
+        sortable: false,
+        text: "Hospital",
+        value: "Hospital"
+      },
+      {
+        sortable: false,
+        text: "User",
+        value: "Users"
+      },
+      {
+        sortable: false,
+        text: "Result",
+        value: "result"
+      },
+      {
+        sortable: false,
+        text: "Date",
+        value: "date"
+      },
+      {
+        sortable: false,
+        text: "Action",
+        value: "action",
+        align: "right"
+      }
+    ],
+    items:[],
+    currentPage:1,
+    lastPage:1,
+  }),
+    created() {
+    this.load();
+  },
+  methods: {
+    async load() {
+      const result = await ApiService.get(urls.listTestResult);
+      if (result && result.status == 200) {
+        this.items = result.data.data.data;
+        this.currentPage = result.data.data.current_page;
+        this.lastPage = result.data.data.last_page;
+      }
+    },
+  }
 }
 </script>
 

resources/js/vue/views/TestType/List.vue

@@ -117,9 +117,11 @@ export default {
   methods: {
     async getData(page = 1) {
       const result = await ApiService.get(urls.listTestType(page));
-      this.items = result.data.data.data;
-      this.currentPage = result.data.data.current_page;
-      this.lastPage = result.data.data.last_page;
+      if (result && result.status == 200) {
+        this.items = result.data.data.data;
+        this.currentPage = result.data.data.current_page;
+        this.lastPage = result.data.data.last_page;
+      }
     },
     async remove(id) {
       const result = await ApiService.delete(urls.deleteTestType(id));