From 1d5f77f3a6e017ec247dd2683d46e0a479faa485 Mon Sep 17 00:00:00 2001
From: Thanaphon Frappet <thanaphon@frappet.com>
Date: Fri, 11 Apr 2025 17:59:40 +0700
Subject: [PATCH] feat: copy goodbey

---
 src/components/button/index.ts            |  1 +
 src/components/shared/KebabAction.vue     | 23 +++++++
 src/i18n/eng.ts                           |  6 ++
 src/i18n/tha.ts                           |  5 ++
 src/pages/04_product-service/MainPage.vue | 84 ++++++++++++++++++++++-
 5 files changed, 118 insertions(+), 1 deletion(-)

diff --git a/src/components/button/index.ts b/src/components/button/index.ts
index d9b59582..9f3367ef 100644
--- a/src/components/button/index.ts
+++ b/src/components/button/index.ts
@@ -14,3 +14,4 @@ export { default as PrintButton } from './PrintButton.vue';
 export { default as StateButton } from './StateButton.vue';
 export { default as NextButton } from './NextButton.vue';
 export { default as ImportButton } from './ImportButton.vue';
+export { default as PasteButton } from './PasteButton.vue';
diff --git a/src/components/shared/KebabAction.vue b/src/components/shared/KebabAction.vue
index 4dd095db..7bea6b36 100644
--- a/src/components/shared/KebabAction.vue
+++ b/src/components/shared/KebabAction.vue
@@ -16,6 +16,7 @@ const props = withDefaults(
     useUpload?: boolean;
     useCancel?: boolean;
     useRejectCancel?: boolean;
+    useCopy?: boolean;
     disableCancel?: boolean;
     disableDelete?: boolean;
   }>(),
@@ -31,6 +32,7 @@ defineEmits<{
   (e: 'link'): void;
   (e: 'upload'): void;
   (e: 'delete'): void;
+  (e: 'copy'): void;
   (e: 'cancel'): void;
   (e: 'rejectCancel'): void;
   (e: 'changeStatus'): void;
@@ -172,6 +174,27 @@ watch(
           </span>
         </q-item>
 
+        <q-item
+          v-if="useCopy"
+          v-close-popup
+          dense
+          clickable
+          class="row q-py-sm"
+          style="white-space: nowrap"
+          :id="`btn-kebab-copy-${idName}`"
+          @click.stop="() => $emit('copy')"
+        >
+          <q-icon
+            size="xs"
+            class="col-3"
+            name="mdi-content-copy"
+            style="color: hsl(var(--teal-5-hsl))"
+          />
+          <span class="col-9 q-px-md flex items-center">
+            {{ $t('general.copy') }}
+          </span>
+        </q-item>
+
         <q-item
           v-if="useCancel"
           v-close-popup
diff --git a/src/i18n/eng.ts b/src/i18n/eng.ts
index 49950acd..e0278ea0 100644
--- a/src/i18n/eng.ts
+++ b/src/i18n/eng.ts
@@ -154,6 +154,8 @@ export default {
     draw: 'Draw',
     newUpload: 'New Upload',
     nativeLanguage: '{msg} Native Language',
+    copy: 'Copy',
+    paste: 'Paste',
   },
 
   menu: {
@@ -1060,6 +1062,10 @@ export default {
       confirmDebitNoteAccept: 'Confirm acceptance of the debit note.',
     },
     message: {
+      copy: 'Copy',
+      warningPaste:
+        'Do you want to replace the data with the newly copied information?',
+      warningCopyEmpty: 'You have not copied any data yet',
       quotationAccept: 'Once accepted, no further modifications can be made',
       beingUse: '"{msg}" is being used.',
       incompleteDataEntry: 'Incomplete data entry on {tap} page',
diff --git a/src/i18n/tha.ts b/src/i18n/tha.ts
index de4bebbd..53c3aac2 100644
--- a/src/i18n/tha.ts
+++ b/src/i18n/tha.ts
@@ -154,6 +154,8 @@ export default {
     draw: 'วาด',
     newUpload: 'อัปโหลดใหม่',
     nativeLanguage: '{msg} ภาษาต้นทาง',
+    copy: 'คัดลอก',
+    paste: 'วาง',
   },
 
   menu: {
@@ -1051,6 +1053,9 @@ export default {
       confirmDebitNoteAccept: 'ยืนยันการตอบรับใบเพิ่มหนี้',
     },
     message: {
+      copy: 'คัดลอก',
+      warningPaste: 'คุณต้องการที่จะเเทนที่ข้อมูลที่คัดลอกมาใหม่ใช่หรือไม่',
+      warningCopyEmpty: 'คุณยังไม่ได้คัดลอกข้อมูล',
       quotationAccept: 'เมื่อตอบรับเเล้วจะไม่สามารถแก้ไขได้อีก',
       beingUse: '"{msg}" มีการใช้งานอยู่',
       incompleteDataEntry: 'กรอกข้อมูลไม่ครบในหน้า {tap}',
diff --git a/src/pages/04_product-service/MainPage.vue b/src/pages/04_product-service/MainPage.vue
index 462e7476..687e2883 100644
--- a/src/pages/04_product-service/MainPage.vue
+++ b/src/pages/04_product-service/MainPage.vue
@@ -33,6 +33,7 @@ import {
   SaveButton,
   UndoButton,
   ToggleButton,
+  PasteButton,
 } from 'components/button';
 import TableProduct from 'src/components/04_product-service/TableProduct.vue';
 import PaginationPageSize from 'src/components/PaginationPageSize.vue';
@@ -40,7 +41,7 @@ import PaginationPageSize from 'src/components/PaginationPageSize.vue';
 import useFlowStore from 'stores/flow';
 
 import { dateFormat } from 'src/utils/datetime';
-import { formatNumberDecimal, isRoleInclude } from 'stores/utils';
+import { formatNumberDecimal, isRoleInclude, notify } from 'stores/utils';
 const { getWorkflowTemplate } = useWorkflowTemplate();
 
 import { Status } from 'stores/types';
@@ -67,6 +68,7 @@ import {
 } from 'src/stores/workflow-template/types';
 import { useWorkflowTemplate } from 'src/stores/workflow-template';
 import { deepEquals } from 'src/utils/arr';
+import { toRaw } from 'vue';
 
 const flowStore = useFlowStore();
 const navigatorStore = useNavigator();
@@ -98,6 +100,10 @@ const {
   deleteWork,
 } = productServiceStore;
 
+const currentCopy = ref<{
+  id: string | undefined;
+  type: 'service' | 'product';
+}>();
 const { workNameItems } = storeToRefs(productServiceStore);
 const allStat = ref<{ mode: string; count: number }[]>([]);
 const stat = ref<
@@ -1831,6 +1837,67 @@ function handleSubmitSameWorkflow() {
   );
 }
 
+async function paste() {
+  if (
+    !!currentCopy.value &&
+    currentCopy.value.type === 'service' &&
+    !!currentCopy.value.id
+  )
+    dialogWarningClose(t, {
+      message: t('dialog.message.warningPaste'),
+      action: async () => {
+        const res = await fetchListServiceById(currentCopy.value.id);
+        if (res) {
+          formService.value = {
+            code: res.code,
+            name: res.name,
+            detail: res.detail,
+            attributes: res.attributes,
+            work: res.work.map((v) => ({
+              id: v.id,
+              name: v.name,
+              attributes: v.attributes,
+              product: v.productOnWork.map((productOnWorkItem) => ({
+                id: productOnWorkItem.product.id,
+                installmentNo: productOnWorkItem.installmentNo,
+                stepCount: productOnWorkItem.stepCount,
+              })),
+            })),
+            status: res.status,
+            productGroupId: res.productGroupId,
+            selectedImage: res.selectedImage,
+            installments: res.installments,
+          };
+
+          workItems.value = res.work.map((item) => {
+            return {
+              id: item.id,
+              name: item.name,
+              attributes: item.attributes,
+              product: item.productOnWork.map((productOnWorkItem) => {
+                return {
+                  ...productOnWorkItem.product,
+                  nameEn: productOnWorkItem.product.name,
+                  installmentNo: productOnWorkItem.installmentNo,
+                };
+              }),
+            };
+          });
+        }
+      },
+    });
+  else {
+    dialog({
+      color: 'warning',
+      icon: 'mdi-alert',
+      title: t('form.warning.title'),
+      actionText: t('dialog.action.ok'),
+      message: t('dialog.message.warningCopyEmpty'),
+      action: async () => {},
+    });
+  }
+}
+
 watch(
   () => formService.value.attributes.workflowId,
   async (a, b) => {
@@ -3127,8 +3194,18 @@ watch(
                               "
                             />
                             <KebabAction
+                              :use-copy="productAndServiceTab === 'service'"
                               :status="props.row.status"
                               :id-name="props.row.name"
+                              @copy="
+                                () => {
+                                  notify('create', $t('dialog.message.copy'));
+                                  currentCopy = {
+                                    id: props.row.id,
+                                    type: productAndServiceTab,
+                                  };
+                                }
+                              "
                               @view="
                                 async () => {
                                   if (props.row.type === 'product') {
@@ -4422,6 +4499,11 @@ watch(
               @click="serviceTreeView = false"
             />
           </div>
+          <PasteButton
+            id="btn-info-basic-paste"
+            icon-only
+            @click="() => paste()"
+          />
           <SaveButton id="btn-info-basic-save" icon-only type="submit" />
         </div>