feat: properties dialog

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

@@ -15,6 +15,8 @@ import PriceDataComponent from 'src/components/04_product-service/PriceDataCompo
 import ProfileUpload from 'src/components/ProfileUpload.vue';
 import TotalProductCardComponent from 'components/04_product-service/TotalProductCardComponent.vue';
 import FormServiceWork from 'src/components/04_product-service/FormServiceWork.vue';
+import ServiceProperties from 'src/components/04_product-service/ServiceProperties.vue';
+import useOptionStore from 'src/stores/options';
 
 import { Status } from 'src/stores/types';
 import NoData from 'components/NoData.vue';
@@ -33,6 +35,7 @@ import {
 } from 'src/stores/product-service/types';
 
 const productServiceStore = useProductServiceStore();
+const optionStore = useOptionStore();
 
 const {
   fetchStatsProductType,
@@ -143,6 +146,7 @@ const serviceTab = [
   },
 ];
 const currentServiceTab = ref('serviceInformation');
+const propertiesDialog = ref<boolean>(false);
 
 const currentId = ref<string>('');
 const currentIdType = ref<string>('');
@@ -1025,7 +1029,7 @@ watch(currentStatus, async () => {
     :title="'สร้างสินค้าและบริการ'"
     no-footer
     no-app-box
-    :max-width="80"
+    max-width="80%"
   >
     <template #body>
       <div class="row q-gutter-xl q-pa-sm">
@@ -1172,6 +1176,7 @@ watch(currentStatus, async () => {
     </AppBox>
   </FormDialog>
 
+  <!-- add service -->
   <FormDialog
     no-address
     :title="$t('addService')"
@@ -1194,6 +1199,7 @@ watch(currentStatus, async () => {
         v-if="currentServiceTab === 'serviceInformation'"
         dense
         service
+        @service-properties="propertiesDialog = true"
       />
       <FormServiceWork
         v-if="currentServiceTab === 'workInformation'"
@@ -1202,6 +1208,25 @@ watch(currentStatus, async () => {
       />
     </template>
   </FormDialog>
+
+  <!-- service properties -->
+  <FormDialog
+    no-address
+    no-footer
+    no-app-box
+    width="75%"
+    height="1000px"
+    title="Properties"
+    v-model:modal="propertiesDialog"
+  >
+    <ServiceProperties
+      v-model:properties-option="
+        optionStore.globalOption.tha.servicePropertiesField
+      "
+      v-model:form-service-properties="formDataProductService.attributes"
+      @add-properties="console.log('')"
+    />
+  </FormDialog>
 </template>
 
 <style scoped>