refactor: add remark

src/pages/09_task-order/document_view/MainPage.vue

@@ -23,6 +23,7 @@ import {
 import { useRoute } from 'vue-router';
 import { useTaskOrderStore } from 'src/stores/task-order';
 import { RequestWork } from 'src/stores/request-list';
+import { convertTemplate } from 'src/utils/string-template';
 
 const route = useRoute();
 const taskOrder = useTaskOrderStore();
@@ -414,7 +415,25 @@ function print() {
         }"
       />
 
-      <article style="height: 5.8in"></article>
+      <span
+        class="q-mb-sm q-mt-md"
+        style="
+          font-weight: 800;
+          font-size: 16px;
+          color: var(--main);
+          display: block;
+          border-bottom: 2px solid var(--main);
+        "
+      >
+        {{ $t('general.remark') }}
+      </span>
+
+      <div
+        class="border-5 surface-0 detail-note q-mb-md"
+        style="width: 100%; padding: 8px 16px; white-space: pre-wrap"
+      >
+        <div v-html="convertTemplate(data?.remark || '', {}) || '-'"></div>
+      </div>
 
       <ViewFooter
         :data="{

src/pages/09_task-order/form.ts

@@ -24,6 +24,7 @@ export const useTaskOrderForm = defineStore('task-order-form', () => {
     contactTel: '',
     contactName: '',
     taskName: '',
+    remark: '#[order-detail]',
   };
 
   const state = ref<{
@@ -103,13 +104,9 @@ export const useTaskOrderForm = defineStore('task-order-form', () => {
     }
 
     if (state.value.mode === 'edit' && !!currentFormData.value.id) {
-      const taskProduct = opt?.taskProduct?.map((p) => ({
-        productId: p.productId,
-        discount: p.discount,
-      }));
       const res = await taskOrderStore.editTaskOrder({
         ...currentFormData.value,
-        taskProduct: taskProduct,
+        taskProduct: opt?.taskProduct,
       });
       if (res) {
         succeed = true;

src/pages/09_task-order/order_view/MainPage.vue

@@ -968,6 +968,7 @@ watch([currentFormData.value.taskStatus], () => {
               view === TaskOrderStatus.Pending ||
               view === TaskOrderStatus.Complete
             "
+            v-model:remark="currentFormData.remark"
             :readonly="!['create', 'edit'].includes(state.mode || '')"
           />
 

src/stores/task-order/index.ts

@@ -104,6 +104,10 @@ export const useTaskOrderStore = defineStore('taskorder-store', () => {
 
   async function editTaskOrder(body: TaskOrderPayload) {
     const res = await api.put<TaskOrder>(`/task-order/${body.id}`, {
+      taskProduct: body.taskProduct?.map((v) => ({
+        productId: v.productId,
+        discount: v.discount,
+      })),
       taskList: body.taskList.map((v) => ({
         step: v.step,
         requestWorkId: v.requestWorkId,
@@ -113,7 +117,7 @@ export const useTaskOrderStore = defineStore('taskorder-store', () => {
       contactName: body.contactName,
       taskStatus: body.taskStatus,
       taskName: body.taskName,
-      taskProduct: body.taskProduct,
+      remark: body.remark,
     });
 
     if (res.status < 400) {

src/stores/task-order/types.ts

@@ -56,6 +56,7 @@ export interface TaskOrder {
   code: string;
   id: string;
   userTask: UserTask[];
+  remark?: string;
 }
 
 export interface UserTask {
@@ -176,6 +177,7 @@ export interface TaskOrderPayload {
   registeredBranchId?: string;
   id?: string;
   code?: string;
+  remark?: string;
 }
 
 export interface ProductService {