diff --git a/src/pages/05_quotation/QuotationForm.vue b/src/pages/05_quotation/QuotationForm.vue
index 24d27bf1..1e788190 100644
--- a/src/pages/05_quotation/QuotationForm.vue
+++ b/src/pages/05_quotation/QuotationForm.vue
@@ -97,7 +97,6 @@ const { data: config } = storeToRefs(configStore);
 const refSelectZoneEmployee = ref<InstanceType<typeof SelectZone>>();
 const mrz = ref<Awaited<ReturnType<typeof parseResultMRZ>>>();
 const toggleWorker = ref(true);
-const branchId = ref('');
 const currentQuotationId = ref<string | undefined>(undefined);
 const date = ref();
 const preSelectedWorker = ref<Employee[]>([]);
@@ -212,6 +211,7 @@ async function assignToProductServiceList() {
     page: 1,
     pageSize: 9999,
   });
+
   if (ret) {
     productGroup.value = ret.result;
 
@@ -280,6 +280,7 @@ async function convertDataToFormSubmit() {
     productServiceList: quotationFormData.value.productServiceList,
     urgent: quotationFormData.value.urgent,
     customerBranchId: quotationFormData.value.customerBranchId,
+    registeredBranchId: quotationFormData.value.registeredBranchId,
     worker: quotationFormData.value.worker,
     payBillDate: quotationFormData.value.payBillDate,
     paySplit: quotationFormData.value.paySplit,
@@ -304,13 +305,14 @@ async function convertDataToFormSubmit() {
 
 async function getAllProduct(
   groupId: string,
-  opts?: { force?: false; page?: number; pageSize?: number },
+  opts?: { force?: false; page?: number; pageSize?: number; query?: string },
 ) {
   selectedGroupSub.value = 'product';
   if (!opts?.force && productList.value[groupId] !== undefined) return;
   const ret = await productServiceStore.fetchListProduct({
     page: opts?.page ?? 1,
     pageSize: opts?.pageSize ?? 9999,
+    query: opts?.query,
     productGroupId: groupId,
   });
   if (ret) productList.value[groupId] = ret.result;
@@ -338,7 +340,7 @@ function setDefaultFormEmployee() {
 
 async function getAllService(
   groupId: string,
-  opts?: { force?: false; page?: number; pageSize?: number },
+  opts?: { force?: false; page?: number; pageSize?: number; query?: string },
 ) {
   selectedGroupSub.value = 'service';
   if (!opts?.force && serviceList.value[groupId] !== undefined) return;
@@ -346,6 +348,8 @@ async function getAllService(
     page: opts?.page ?? 1,
     pageSize: opts?.pageSize ?? 9999,
     productGroupId: groupId,
+    query: opts?.query,
+
     fullDetail: true,
   });
   if (ret) serviceList.value[groupId] = ret.result;
@@ -374,7 +378,6 @@ function triggerProductServiceDialog() {
 
 function toggleDeleteProduct(index: number) {
   productServiceList.value.splice(index, 1);
-  console.log(productServiceList.value);
 }
 async function assignWorkerToSelectedWorker() {
   if (quotationFormData.value.customerBranchId) {
@@ -499,7 +502,6 @@ onMounted(async () => {
 
   // get query string
   const urlParams = new URLSearchParams(window.location.search);
-  branchId.value = urlParams.get('branchId') || '';
 
   const price = urlParams.get('agentPrice');
   agentPrice.value = price === 'true' ? true : false;
@@ -508,6 +510,8 @@ onMounted(async () => {
 
   currentQuotationId.value = urlParams.get('quotationId') || undefined;
 
+  quotationFormData.value.registeredBranchId = urlParams.get('branchId') || '';
+
   quotationFormData.value.customerBranchId =
     urlParams.get('customerBranchId') || '';
 
@@ -553,7 +557,7 @@ watch(
 );
 
 watch(
-  () => branchId.value,
+  () => quotationFormData.value.registeredBranchId,
   async (v) => {
     if (!pageState.isLoaded) return;
     const url = new URL(window.location.href);
@@ -562,7 +566,7 @@ watch(
   },
 );
 
-const productServiceNodes = ref<ProductTree>();
+const productServiceNodes = ref<ProductTree>([]);
 
 watch(
   () => productServiceList.value,
@@ -570,6 +574,25 @@ watch(
     productServiceNodes.value = quotationProductTree(productServiceList.value);
   },
 );
+
+async function searchEmployee(text: string) {
+  let query: string | undefined = text;
+  let pageSize = 50;
+
+  if (!text) {
+    query = undefined;
+    pageSize = 9999;
+  }
+
+  const retEmp = await customerStore.fetchBranchEmployee(
+    quotationFormData.value.customerBranchId,
+    {
+      query: query,
+      pageSize: pageSize,
+    },
+  );
+  if (retEmp) workerList.value = retEmp.data.result;
+}
 </script>
 
 <template>
@@ -600,7 +623,7 @@ watch(
       <FormAbout
         class="col-4"
         input-only
-        v-model:branch-id="branchId"
+        v-model:branch-id="quotationFormData.registeredBranchId"
         v-model:customer-branch-id="quotationFormData.customerBranchId"
         :readonly="readonly"
         @add-customer=""
@@ -874,6 +897,11 @@ watch(
         <SelectZone
           ref="refSelectZoneEmployee"
           v-model:selected-item="preSelectedWorker"
+          @search="
+            (v) => {
+              searchEmployee(v);
+            }
+          "
           :items="workerList"
           :new-items="newWorkerList"
         >
@@ -964,6 +992,16 @@ watch(
           await getAllProduct(id);
         }
       "
+      @search="
+        (id, text, mode) => {
+          if (mode === 'service') {
+            getAllService(id, { query: text, pageSize: 50 });
+          }
+          if (mode === 'product') {
+            getAllProduct(id, { query: text, pageSize: 50 });
+          }
+        }
+      "
     ></ProductServiceForm>
   </div>