new update

resources/js/vue/views/Package/List.vue

@@ -21,15 +21,19 @@
                             color="black"
                         ></v-text-field>
                     </v-flex>
-                    <v-flex xs12 md3 sm3 class="WM-FlexCenter pl-3">
-                        <v-icon class="fas fa-sort-numeric-up mr-2 WM-Margin-B-8"></v-icon>
-                        <v-text-field
-                            class="py-3 pr-3"
-                            v-model="filter.unique_id"
-                            label="uniqueID"
-                            color="black"
-                        ></v-text-field>
+                    <v-flex xs12 md3 sm3 class="WM-FlexCenter pl-3" v-if="$hasRole('Admin')">
+                      <v-icon class="fa fa-hospital-o mr-2 WM-Margin-B-8"></v-icon>
+                      <v-autocomplete
+                        class="py-3 pr-3"
+                        v-model="filter.medical_center_id"
+                        item-text="name"
+                        item-value="id"
+                        label="Hospital"
+                        color="black"
+                        :items="medicalCenters"
+                      ></v-autocomplete>
                     </v-flex>
+
                     <v-flex class xs12 md2 sm3>
                         <v-btn class="WM-CyanBlueGradient-BG" style="padding:10px 60px" @click="load()">
                             <v-icon class="white--text mr-2 caption">fas fa-search</v-icon>
@@ -151,14 +155,15 @@ export default {
             }
         ],
         filter: {
-            unique_id: '',
             name: '',
-            package_id : ''
+            package_id : '',
+            medical_center_id : ''
         },
         result: ['Pass', 'Fail'],
         items: [],
         currentPage: 1,
         lastPage: 1,
+        medicalCenters: []
     }),
     created() {
         this.load();
@@ -181,6 +186,7 @@ export default {
                 this.currentPage = result.data.data.current_page;
                 this.lastPage = result.data.data.last_page;
             }
+            this.loadMedicalCenters();
         },
         async show(testResultId) {
             const result = await ApiService.get(
@@ -216,7 +222,13 @@ export default {
                     properties: { result }
                 });
             }
-        }
+        },
+        async loadMedicalCenters() {
+          const result = await ApiService.get(urls.listFilterItemsTestResult);
+          if (result && result.status == 200) {
+            this.medicalCenters = result.data.data.MedicalCenters;
+          }
+        },
     },
     computed: {
         ...mapGetters("modal", ["getModalResult"])