diff --git a/src/components/03_customer-management/CustomerInfoComponent.vue b/src/components/03_customer-management/CustomerInfoComponent.vue
index f17f9034..c8d5821e 100644
--- a/src/components/03_customer-management/CustomerInfoComponent.vue
+++ b/src/components/03_customer-management/CustomerInfoComponent.vue
@@ -2,17 +2,30 @@
 import { ref } from 'vue';
 import AppBox from 'components/app/AppBox.vue';
 import BranchCardCustomer from 'components/03_customer-management/BranchCardCustomer.vue';
+import { onMounted } from 'vue';
+import useCustomerStore from 'src/stores/customer';
+import { CustomerBranch } from 'src/stores/customer/types';
+
+const userCustomer = useCustomerStore();
+const { fetchListById } = userCustomer;
 
 const inputSearch = ref<string>('');
+const branch = ref<CustomerBranch[]>();
 
-withDefaults(
+const prop = withDefaults(
   defineProps<{
     color: 'purple' | 'green';
+    customerId: string;
   }>(),
   {
     color: 'green',
   },
 );
+
+onMounted(async () => {
+  const result = await fetchListById(prop.customerId);
+  if (result) branch.value = result.branch;
+});
 </script>
 
 <template>
@@ -110,10 +123,15 @@ withDefaults(
       </div>
     </div>
     <div class="row q-pa-lg q-col-gutter-xl">
+<<<<<<< HEAD
       <div v-for="i in 2" class="col-4">
         <BranchCardCustomer
           @view-detail="$emit('viewDetail')"
         ></BranchCardCustomer>
+=======
+      <div v-for="(br, i) in branch" class="col-4" :key="i">
+        <BranchCardCustomer :data="br"></BranchCardCustomer>
+>>>>>>> 10383c3 (feat: fetchListById และ byค่า)
       </div>
     </div>
   </AppBox>