feat: search employee

src/pages/03_customer-management/MainPage.vue

@@ -637,6 +637,7 @@ async function onSubmitCustomerBranch() {
 }
 
 const resultSearch = ref<(Customer & { branch: CustomerBranch[] })[]>();
+const resultSearchEmployee = ref();
 
 async function searchCustomer() {
   const resultList = await fetchList({
@@ -649,6 +650,16 @@ async function searchCustomer() {
   }
 }
 
+async function searchEmployee() {
+  const resultList = await employeeStore.fetchList({
+    query: inputSearch.value,
+  });
+
+  if (resultList) {
+    resultSearchEmployee.value = resultList.result;
+  }
+}
+
 async function fetchListCustomer() {
   const resultList = await fetchList({
     includeBranch: true,
@@ -1129,7 +1140,9 @@ watch(fieldSelectedCustomer, async () => {
             :bg-color="$q.dark.isActive ? 'dark' : 'white'"
             v-model="inputSearch"
             debounce="500"
-            @update:model-value="searchCustomer()"
+            @update:model-value="
+              selectorLabel === 'EMPLOYEE' ? searchEmployee() : searchCustomer()
+            "
           />
 
           <q-btn
@@ -1266,7 +1279,8 @@ watch(fieldSelectedCustomer, async () => {
           <div>
             <PersonCard
               :list="
-                listEmployee.map((v: Employee) => ({
+                (!!inputSearch ? resultSearchEmployee : listEmployee).map(
+                  (v: Employee) => ({
                     img: v.profileImageUrl,
                     id: v.id,
                     name:
@@ -1286,7 +1300,8 @@ watch(fieldSelectedCustomer, async () => {
                         value: calculateAge(v.dateOfBirth),
                       },
                     ],
-                })) || []
+                  }),
+                ) || []
               "
               @update-card="openDialogInputForm"
               @enter-card="openDialogInputForm"