refactor: set data ability

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

@@ -2,7 +2,11 @@
 import { ref } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { Option } from 'src/stores/options/types';
-import { AdditionalType, Attributes } from 'src/stores/product-service/types';
+import {
+  AdditionalType,
+  Attributes,
+  Ability,
+} from 'src/stores/product-service/types';
 import { moveItemUp, moveItemDown, deleteItem, dialog } from 'src/stores/utils';
 
 import NoData from '../NoData.vue';
@@ -47,6 +51,13 @@ const typeOption = ref([
   },
 ]);
 
+const abilitys = ref<Record<AdditionalType, Ability[AdditionalType]>>({
+  string: { phoneNumber: { length: 10 } },
+  number: { comma: true, decimal: { point: 2 } },
+  date: '2024-07-25',
+  array: ['item1', 'item2'],
+});
+
 function manageProperties(properties?: string, type?: string | AdditionalType) {
   if (properties === 'all' && propertiesOption.value) {
     if (
@@ -64,7 +75,17 @@ function manageProperties(properties?: string, type?: string | AdditionalType) {
         formServiceProperties.value?.additional.push({
           fieldName: ops.value,
           type: ops.type as AdditionalType,
+          ability: {
+            string:
+              ops.type === 'string' ? abilitys.value['string'] : undefined,
+            number:
+              ops.type === 'number' ? abilitys.value['number'] : undefined,
+            date: ops.type === 'date' ? abilitys.value['date'] : undefined,
+            array: ops.type === 'array' ? abilitys.value['array'] : undefined,
+          },
         });
+
+        console.log(abilitys.value['number']);
       }
     });
     return;
@@ -81,6 +102,12 @@ function manageProperties(properties?: string, type?: string | AdditionalType) {
       formServiceProperties.value.additional.push({
         fieldName: properties ?? null,
         type: type as AdditionalType,
+        ability: {
+          string: type === 'string' ? abilitys.value['string'] : undefined,
+          number: type === 'number' ? abilitys.value['number'] : undefined,
+          date: type === 'date' ? abilitys.value['date'] : undefined,
+          array: type === 'array' ? abilitys.value['array'] : undefined,
+        },
       });
     }
   }
@@ -136,6 +163,7 @@ function confirmDelete(items: unknown[], index: number) {
         menu-anchor="bottom end"
       >
         <q-list dense v-if="formServiceProperties && propertiesOption">
+          asdas
           <q-item clickable @click="manageProperties('all')">
             <div class="full-width flex items-center">
               <q-icon
@@ -159,6 +187,7 @@ function confirmDelete(items: unknown[], index: number) {
             </div>
           </q-item>
           <q-separator />
+          dasdsad
           <q-item
             v-for="(ops, index) in propertiesOption"
             clickable