feat: add select product service function to form

src/pages/05_quotation/QuotationForm.vue

@@ -97,6 +97,10 @@ const selectedGroup = ref<ProductGroup | null>(null);
 const selectedGroupSub = ref<'product' | 'service' | null>(null);
 const selectedProductServiceId = ref('');
 
+const productServiceList = ref<
+  Required<QuotationPayload['productServiceList'][number]>[]
+>([]);
+
 async function getAllProduct(
   groupId: string,
   opts?: { force?: false; page?: number; pageSize?: number },
@@ -141,7 +145,12 @@ function toggleDeleteProduct(index: number) {
 }
 
 function convertToTable(nodes: Node[]) {
-  console.log(nodes);
+  const _recursive = (v: Node): Node | Node[] => {
+    if (v.checked && v.children) return v.children.flatMap(_recursive);
+    if (v.checked) return v;
+    return [];
+  };
+  productServiceList.value = nodes.flatMap(_recursive).map((v) => v.value);
 }
 
 function changeMode(mode: string) {
@@ -343,7 +352,10 @@ onMounted(async () => {
               </section>
             </template>
             <div class="surface-1 q-pa-md full-width">
-              <ProductItem @delete="toggleDeleteProduct" :rows="[]" />
+              <ProductItem
+                @delete="toggleDeleteProduct"
+                v-model:rows="productServiceList"
+              />
             </div>
           </q-expansion-item>
 
@@ -502,12 +514,7 @@ onMounted(async () => {
       v-model:product-group="productGroup"
       v-model:product-list="productList"
       v-model:service-list="serviceList"
-      @submit="
-        (nodes) => {
-          convertToTable(nodes);
-          // pageState.productServiceModal = false;
-        }
-      "
+      @submit="convertToTable"
       @select-group="
         async (id) => {
           await getAllService(id);