封装 Hold 按钮/模态框组件

src/components/traceOrderManage/holdTraceOrder.vue

@@ -0,0 +1,82 @@
+<template>
+  <a-button class="action-btn" @click="handleHold">Hold</a-button>
+
+  <!-- Hold Modal -->
+  <a-modal v-model:open="openHoldModal" title="Hold 操作" @cancel="handleCloseHold" @ok="handleSubmitHold">
+    <a-form :colon="false" :label-col="{ span: 6 }" :wrapper-col="{ span: 18 }">
+      <a-form-item label="工单编码">
+        <a-input v-model:value="traceOrderStore.traceOrderInfo.code" readonly />
+      </a-form-item>
+      <a-form-item label="目标产品编码">
+        <a-input v-model:value="traceOrderStore.traceOrderInfo.tarMaterialCode" readonly />
+      </a-form-item>
+      <a-form-item label="目标产品名称">
+        <a-input v-model:value="traceOrderStore.traceOrderInfo.tarMaterialName" readonly />
+      </a-form-item>
+      <a-form-item label="发起工序名称">
+        <a-input v-model:value="traceOrderStore.stationInfo.operationTitle" readonly />
+      </a-form-item>
+      <a-form-item label="产品规格">
+        <a-input readonly />
+      </a-form-item>
+      <a-form-item label="计划完成日期">
+        <a-date-picker v-model:value="planFinishDate" placeholder="选择计划完成日期" valueFormat="YYYY-MM-DD HH:mm:ss" show-time
+          style="width: 100%" />
+      </a-form-item>
+    </a-form>
+  </a-modal>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue';
+import { useDialog } from '@/utils/useDialog';
+import { useTraceOrderStore } from '@/store/traceOrderManage/traceOrder';
+import { message } from 'ant-design-vue';
+import { addQualityAbnormalContact } from '@/api/pwoManage';
+
+const traceOrderStore = useTraceOrderStore();
+
+// useDialog 管理弹窗状态
+const { visible: openHoldModal, show, hide } = useDialog();
+
+const planFinishDate = ref('');
+
+const handleHold = () => {
+  if (!traceOrderStore.currentTraceOrderCode) {
+    message.error('请先选择工单！');
+    return;
+  }
+  show();
+};
+
+const handleCloseHold = () => {
+  planFinishDate.value = '';
+  hide();
+};
+
+const handleSubmitHold = async () => {
+  const tmpPlanFinishDate = planFinishDate.value;
+  // 修改随工单状态
+  try {
+    message.success('Hold 成功！')
+    planFinishDate.value = '';
+    openHoldModal.value = false;
+  } catch (error: any) {
+    message.error(error.message || 'Hold 失败');
+    return;
+  }
+
+  // 添加修改记录
+  try {
+    addQualityAbnormalContact({
+      materialCode: traceOrderStore.traceOrderInfo.tarMaterialCode,
+      abnormalOperation: traceOrderStore.stationInfo.operationCode,
+      planFinishDate: tmpPlanFinishDate,
+      status: "Hold",
+    })
+  } catch (error: any) {
+    message.error(error.message || '添加记录异常');
+    return;
+  }
+};
+</script>