feat: auto select current branch

src/components/03_customer-management/BasicInformation.vue

@@ -39,27 +39,13 @@ const props = defineProps<{
 defineEmits<{
   (e: 'filterOwnerBranch', val: string, update: void): void;
 }>();
-
-onMounted(async () => {
-
-
-
-  if(!!props.optionsBranch) {
-
-    registeredBranchId.value = props.optionsBranch[0].id ;
-  }
-
-});
 </script>
 
 <template>
-
-  
   <div class="col-3 app-text-muted">
     • {{ $t(`formDialogTitleInformation`) }}
   </div>
   <div v-if="!employee" class="col-9 row q-col-gutter-md">
-
     <q-select
       id="input-source-nationality"
       :dense="dense"
@@ -76,15 +62,16 @@ onMounted(async () => {
       option-value="id"
       v-model="registeredBranchId"
       :options="optionsBranch"
-:rules="[
+      :rules="[
-  (val) => {
+        (val) => {
-    const roles = getRole() || [];
+          const roles = getRole() || [];
-    const isSpecialRole = ['admin', 'system', 'head_of_admin'].some(role => roles.includes(role));
+          const isSpecialRole = ['admin', 'system', 'head_of_admin'].some(
-    return isSpecialRole || !!val || 'กรุณากรอกข้อมูล';
+            (role) => roles.includes(role),
-  }
+          );
-]"
+          return isSpecialRole || !!val || 'กรุณากรอกข้อมูล';
-
+        },
-clearable 
+      ]"
+      clearable
     />
 
     <q-input
@@ -110,7 +97,7 @@ clearable
       class="col-6"
       :label="$t('taxNo')"
       v-model="taxNo"
-        :rules="[
+      :rules="[
         (val) =>
           (val && val.length === 13 && /[0-9]+/.test(val)) ||
           $t('formDialogInputTaxNoValidate'),

src/components/04_product-service/BasicInformation.vue

@@ -24,23 +24,6 @@ const props = defineProps<{
   service?: boolean;
   optionsBranch?: { id: string; name: string }[];
 }>();
-
-onMounted(  async() => {
-
-
- 
-  
-
-  
-     setTimeout(() => {
-  if(!!props.optionsBranch ){ 
-       registeredBranchId.value = props.optionsBranch[0].id ;
-       
-      }
-  }, 100);
-});
-
-
 </script>
 
 <template>

src/components/DrawerComponent.vue

@@ -1,13 +1,32 @@
 <script setup lang="ts">
-import { computed, ref } from 'vue';
+import { computed, ref, onMounted } from 'vue';
 import { useRouter } from 'vue-router';
+import { storeToRefs } from 'pinia';
 import { Icon } from '@iconify/vue';
+import useMyBranch from 'stores/my-branch';
+import { getUserId, getRole } from 'src/services/keycloak';
 
 defineProps<{
   mini?: boolean;
 }>();
 
+onMounted(async () => {
+  const uid = getUserId();
+  const role = getRole();
+
+  if (!uid) return;
+
+  if (role?.includes('system')) {
+    const result = await userBranch.fetchListOptionBranch();
+    if (result && result.total > 0) currentMyBranch.value = result.result[0];
+  }
+  const result = await userBranch.fetchListMyBranch(uid);
+  if (result && result.total > 0) currentMyBranch.value = result.result[0];
+});
+
 const router = useRouter();
+const userBranch = useMyBranch();
+const { currentMyBranch } = storeToRefs(userBranch);
 
 const currentRoute = ref<string>('');
 const currentPath = computed(() => {
@@ -175,10 +194,14 @@ function branchSetting() {}
         style="white-space: nowrap"
       >
         <span class="text-weight-bold">
-          {{ 'ชื่อสาขาที่ 1' }}
+          {{
+            ($i18n.locale === 'en-US'
+              ? currentMyBranch?.nameEN
+              : currentMyBranch?.name) ?? '-'
+          }}
         </span>
         <span>
-          {{ 'BR1001' }}
+          {{ currentMyBranch?.code ?? '-' }}
         </span>
       </div>
 

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

@@ -1,6 +1,8 @@
 <script setup lang="ts">
 import { computed, ref, watch, toRaw } from 'vue';
 import type { QTableProps } from 'quasar';
+import { storeToRefs } from 'pinia';
+import { getUserId, getRole } from 'src/services/keycloak';
 import { Status } from 'src/stores/types';
 
 import useCustomerStore from 'src/stores/customer';
@@ -64,10 +66,10 @@ import useFlowStore from 'src/stores/flow';
 const { t, locale } = useI18n();
 const utilsStore = useUtilsStore();
 const userCustomer = useCustomerStore();
-const useMyBranch = useMyBranchStore();
+const userBranchStore = useMyBranchStore();
 const userStore = useUserStore();
 
-const { fetchListOptionBranch } = useMyBranch;
+const { currentMyBranch } = storeToRefs(userBranchStore);
 
 const columnsEmployee = [
   {
@@ -170,7 +172,7 @@ const formData = ref<CustomerCreate>({
   customerName: '',
   customerNameEN: '',
   taxNo: '',
-  registeredBranchId: '',
+  registeredBranchId: currentMyBranch.value?.id || '',
   customerBranch: [
     {
       code: '',
@@ -675,7 +677,7 @@ function clearForm() {
     customerNameEN: '',
     personName: '',
     taxNo: '',
-    registeredBranchId: '',
+    registeredBranchId: currentMyBranch.value?.id || '',
     customerBranch: [
       {
         code: '',
@@ -896,9 +898,20 @@ async function onSubmitCustomerBranch() {
 }
 
 async function fetchListOfOptionBranch() {
-  const res = await fetchListOptionBranch({ pageSize: 999 });
+  const uid = getUserId();
+  const role = getRole();
 
-  if (res) branchOption.value = res.result;
+  if (!uid) return;
+
+  if (role?.includes('system')) {
+    const result = await userBranchStore.fetchListOptionBranch();
+    if (result && result.total > 0) branchOption.value = result.result;
+  } else {
+    const result = await userBranchStore.fetchListMyBranch(uid);
+    if (result && result.total > 0) branchOption.value = result.result;
+  }
+
+  formData.value.registeredBranchId = currentMyBranch.value?.id || '';
 }
 
 async function fetchListCustomer() {
@@ -1773,11 +1786,10 @@ watch([inputSearch, currentStatus], async () => {
             <div class="column q-pa-md" style="gap: var(--size-1)">
               <template v-if="selectorLabel === 'EMPLOYER'">
                 <q-item
-                   v-close-popup
+                  v-close-popup
-                                    clickable
+                  clickable
                   v-for="v in fieldCustomer"
                   :key="v"
-                
                   dense
                   class="no-padding flex items-center rounded"
                   active-class="employer-active"
@@ -1793,11 +1805,10 @@ watch([inputSearch, currentStatus], async () => {
                 <q-item
                   active
                   dense
-                
                   active-class="employer-active"
                   class="no-padding flex items-center rounded"
-                     v-close-popup
+                  v-close-popup
-                                    clickable
+                  clickable
                 >
                   <span class="q-px-md">
                     {{ $t('totalEmployee') }}
@@ -1988,7 +1999,7 @@ watch([inputSearch, currentStatus], async () => {
                                         );
                                       }
                                     "
-                                      v-close-popup
+                                    v-close-popup
                                     clickable
                                     dense
                                     class="row q-py-sm"
@@ -2009,7 +2020,7 @@ watch([inputSearch, currentStatus], async () => {
 
                                   <q-item
                                     :id="`view-detail-btn-${props.row.name}-edit`"
-                                       v-close-popup
+                                    v-close-popup
                                     clickable
                                     dense
                                     class="row q-py-sm"
@@ -2050,8 +2061,7 @@ watch([inputSearch, currentStatus], async () => {
                                   <q-item
                                     :id="`view-detail-btn-${props.row.name}-delete`"
                                     dense
-                                       v-close-popup
+                                    v-close-popup
-                                   
                                     :clickable="props.row.status === 'CREATED'"
                                     class="row"
                                     :class="{

src/pages/04_product-service/MainPage.vue

@@ -2,6 +2,7 @@
 import { ref, watch, reactive } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { onMounted } from 'vue';
+import { getUserId, getRole } from 'src/services/keycloak';
 import { storeToRefs } from 'pinia';
 import type { QTableProps } from 'quasar';
 import ItemCard from 'components/ItemCard.vue';
@@ -33,9 +34,9 @@ import useMyBranchStore from 'src/stores/my-branch';
 import { dateFormat } from 'src/utils/datetime';
 import { formatNumberDecimal } from 'src/stores/utils';
 
-const useMyBranch = useMyBranchStore();
+const userBranchStore = useMyBranchStore();
 
-const { fetchListOptionBranch } = useMyBranch;
+const { currentMyBranch } = storeToRefs(userBranchStore);
 
 import { Status } from 'src/stores/types';
 
@@ -403,9 +404,22 @@ async function featchStatsService() {
 }
 
 async function fetchListOfOptionBranch() {
-  const res = await fetchListOptionBranch({ pageSize: 999 });
+  const uid = getUserId();
+  const role = getRole();
 
-  if (res) branchOption.value = res.result;
+  if (!uid) return;
+
+  if (role?.includes('system')) {
+    const result = await userBranchStore.fetchListOptionBranch();
+    if (result && result.total > 0) branchOption.value = result.result;
+  } else {
+    const result = await userBranchStore.fetchListMyBranch(uid);
+    if (result && result.total > 0) branchOption.value = result.result;
+  }
+
+  formDataProduct.value.registeredBranchId = currentMyBranch.value?.id || '';
+  formDataProductService.value.registeredBranchId =
+    currentMyBranch.value?.id || '';
 }
 
 async function featchStatsProduct() {
@@ -3093,8 +3107,6 @@ watch(inputSearchProductAndService, async () => {
       class="col-md-10 col-sm-12"
     >
       <div class="surface-1 rounded bordered q-pa-lg full-width row">
-        
-    
         <BasicInformation
           dense
           service