feat: by ค่า

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

@@ -33,6 +33,8 @@ import {
   ServiceCreate,
   Service,
   ServiceById,
+  WorkItems,
+  Attributes,
 } from 'src/stores/product-service/types';
 
 const productServiceStore = useProductServiceStore();
@@ -81,6 +83,7 @@ const stat = ref<
 
 import { useI18n } from 'vue-i18n';
 import { onMounted } from 'vue';
+import { time } from 'console';
 
 const { t } = useI18n();
 
@@ -100,7 +103,9 @@ const infoProductEdit = ref<boolean>(false);
 const imageProduct = ref<File | undefined>(undefined);
 const profileUrl = ref<string | null>('');
 
-const groupName = ref<string>('งาน MOU');
+const pathGroupName = ref<string>('');
+const pathTypeName = ref<string>('');
+
 const dialogProductServiceType = ref<boolean>(false);
 const dialogTotalProduct = ref<boolean>(false);
 const productMode = ref<'group' | 'type' | 'service' | 'product'>('group');
@@ -156,11 +161,16 @@ const serviceTab = [
     label: 'workInformation',
   },
 ];
+
+const workItems = ref<WorkItems[]>([]);
+
 const currentServiceTab = ref('serviceInformation');
 const propertiesDialog = ref<boolean>(false);
 
 const selectProduct = ref<ProductList[]>([]);
 
+const currentWorkIndex = ref<number>(0);
+
 const currentId = ref<string>('');
 const currentIdType = ref<string>('');
 const currentIdService = ref<string>('');
@@ -532,6 +542,11 @@ async function submitGroup() {
   clearFormGroup();
 }
 
+const tempValueProperties = ref<Attributes>({
+  additional: [],
+});
+const currentPropertiesMode = ref<'service' | 'work'>('service');
+
 function openPropertiesDialog(type: 'service' | 'work') {
   if (type === 'service') {
     propertiesOption.value =
@@ -541,6 +556,8 @@ function openPropertiesDialog(type: 'service' | 'work') {
   if (type === 'work') {
     propertiesOption.value = optionStore.globalOption.tha.workPropertiesField;
   }
+
+  currentPropertiesMode.value = type;
   propertiesDialog.value = true;
 }
 
@@ -676,7 +693,7 @@ watch(currentStatus, async () => {
           class="q-mr-md"
         />
         <div class="text-h6 app-text-muted q-mr-sm hover-underline">
-          {{ groupName }}
+          {{ pathGroupName }}
         </div>
         <div class="text-h6 app-text-muted q-mx-sm">/</div>
         <div class="text-h6 text-weight-bold">
@@ -696,11 +713,11 @@ watch(currentStatus, async () => {
           class="q-mr-md"
         />
         <div class="text-h6 app-text-muted q-mr-sm hover-underline">
-          {{ groupName }}
+          {{ pathGroupName }}
         </div>
         <div class="text-h6 app-text-muted q-mx-sm">/</div>
         <div class="text-h6 app-text-muted q-mr-sm hover-underline">
-          {{ 'บริการพิสูจน์สัญชาติ' }}
+          {{ pathTypeName }}
         </div>
         <div class="text-h6 app-text-muted q-mx-sm">/</div>
         <div class="text-h6 text-weight-bold">
@@ -843,6 +860,7 @@ watch(currentStatus, async () => {
               "
               @on-click="
                 async () => {
+                  pathTypeName = v.name;
                   currentIdType = v.id;
                   productMode = 'service';
                   await fetchListOfProduct(currentIdType);
@@ -885,6 +903,7 @@ watch(currentStatus, async () => {
               "
               @on-click="
                 async () => {
+                  pathGroupName = v.name;
                   currentId = v.id;
                   productMode = 'type';
                   await fetchListType();
@@ -917,7 +936,7 @@ watch(currentStatus, async () => {
                     : 'app-text-muted'
                 "
               >
-                ทั้งหมด
+                {{ $t('all') }}
                 <q-badge
                   class="rounded q-ml-sm"
                   :class="
@@ -939,7 +958,7 @@ watch(currentStatus, async () => {
                     : 'app-text-muted'
                 "
               >
-                บริการ
+                {{ $t('service') }}
                 <q-badge
                   class="rounded q-ml-sm"
                   :class="
@@ -960,7 +979,7 @@ watch(currentStatus, async () => {
                     : 'app-text-muted'
                 "
               >
-                สินค้า
+                {{ $t('product') }}
                 <q-badge
                   class="rounded q-ml-sm"
                   :class="
@@ -1161,7 +1180,15 @@ watch(currentStatus, async () => {
     title="สินค้าทั้งหมด"
     :submit="
       () => {
-        console.log('submit');
+        selectProduct.forEach((i) => {
+          workItems[currentWorkIndex].product.push({
+            ...i,
+            nameEn: '',
+          });
+        });
+
+        dialogTotalProduct = false;
+        selectProduct = [];
       }
     "
     :close="() => {}"
@@ -1394,14 +1421,31 @@ watch(currentStatus, async () => {
         v-if="currentServiceTab === 'serviceInformation'"
         dense
         service
-        @service-properties="openPropertiesDialog('service')"
+        @service-properties="
+          () => {
+            tempValueProperties = formDataProductService.attributes;
+            openPropertiesDialog('service');
+          }
+        "
       />
       <FormServiceWork
+        v-model:work-items="workItems"
         v-if="currentServiceTab === 'workInformation'"
         dense
-        @addProduct="dialogTotalProduct = true"
+        @addProduct="
+          (index) => {
+            currentWorkIndex = index;
+            dialogTotalProduct = true;
+          }
+        "
         @manage-work-name="manageWorkNameDialog = true"
-        @work-properties="openPropertiesDialog('work')"
+        @work-properties="
+          (index) => {
+            currentWorkIndex = index;
+            tempValueProperties = workItems[index].attributes;
+            openPropertiesDialog('work');
+          }
+        "
       />
     </template>
   </FormDialog>
@@ -1409,15 +1453,31 @@ watch(currentStatus, async () => {
   <!-- service properties -->
   <FormDialog
     no-address
-    no-footer
     no-app-box
     width="75%"
     title="Properties"
     v-model:modal="propertiesDialog"
+    :submit="
+      () => {
+        if (currentPropertiesMode === 'service') {
+          formDataProductService.attributes = tempValueProperties;
+        }
+        if (currentPropertiesMode === 'work') {
+          workItems[currentWorkIndex].attributes = tempValueProperties;
+        }
+
+        propertiesDialog = false;
+      }
+    "
+    :close="
+      () => {
+        propertiesDialog = false;
+      }
+    "
   >
     <ServiceProperties
       v-model:properties-option="propertiesOption"
-      v-model:form-service-properties="formDataProductService.attributes"
+      v-model:form-service-properties="tempValueProperties"
       @add-properties="console.log('')"
     />
   </FormDialog>