优化系统全局状态管理结构

components.d.ts

@@ -40,8 +40,11 @@ declare module 'vue' {
     ATypographyText: typeof import('ant-design-vue/es')['TypographyText']
     DictTag: typeof import('./src/components/common/DictTag/index.vue')['default']
     Header: typeof import('./src/components/common/Header/index.vue')['default']
+    HoldTraceOrder: typeof import('./src/components/traceOrderManage/holdTraceOrder.vue')['default']
     ILucideBuilding: typeof import('~icons/lucide/building')['default']
     ILucideChevronDown: typeof import('~icons/lucide/chevron-down')['default']
+    ILucideChevronLeft: typeof import('~icons/lucide/chevron-left')['default']
+    ILucideChevronUp: typeof import('~icons/lucide/chevron-up')['default']
     ILucideCopy: typeof import('~icons/lucide/copy')['default']
     ILucideCpu: typeof import('~icons/lucide/cpu')['default']
     ILucideLoader: typeof import('~icons/lucide/loader')['default']

src/components/traceOrderManage/holdTraceOrder.vue

@@ -30,7 +30,7 @@
 <script setup lang="ts">
 import { ref } from 'vue';
 import { useDialog } from '@/utils/useDialog';
-import { useTraceOrderStore } from '@/store/traceOrderManage/traceOrder';
+import { useTraceOrderStore } from '@/store';
 import { message } from 'ant-design-vue';
 import { addQualityAbnormalContact } from '@/api/pwoManage';
 

src/store/index.ts

@@ -1,5 +1,7 @@
-export * from './auth';
+// 系统管理
-export * from './user';
+export * from './system/auth';
-export * from './pwo';
+export * from './system/dict';
-export * from './job';
+export * from './system/user';
-export * from './dict';
+
+// 工单管理
+export * from './traceOrderManage/traceOrder';

src/store/job.ts

@@ -1,36 +0,0 @@
-import { defineStore } from "pinia";
-import { ref, reactive } from "vue";
-import { getStation } from "@/api/pwoManage/station";
-
-export const useJobStore = defineStore("job", () => {
-  const jobInfo = reactive<any>({});
-  const loadingJobInfo = ref(false);
-
-  function setInfo(job: any) {
-    Object.assign(jobInfo, job);
-  }
-
-  function resetInfo() {
-    Object.assign(jobInfo, {});
-  }
-
-  async function refresh() {
-    loadingJobInfo.value = true;
-    try {
-      const { data } = await getStation(jobInfo.id);
-      Object.assign(jobInfo, data);
-    } catch (error: any) {
-      console.log(error.message);
-    } finally {
-      loadingJobInfo.value = false;
-    }
-  }
-
-  return {
-    jobInfo,
-    loadingJobInfo,
-    setInfo,
-    resetInfo,
-    refresh,
-  };
-});

src/store/pwo.ts

@@ -1,31 +0,0 @@
-import { defineStore } from "pinia";
-import { reactive } from "vue";
-
-export interface PwoInfo {
-  code: string;
-  id: string | number;
-  orderType: string;
-  [key: string]: any;
-}
-
-export const usePwoStore = defineStore("pwo", () => {
-  const pwoInfo = reactive<PwoInfo>({
-    code: "",
-    id: "",
-    orderType: "",
-  });
-
-  function setInfo(info: PwoInfo) {
-    Object.assign(pwoInfo, info);
-  }
-
-  function resetInfo() {
-    Object.assign(pwoInfo, {});
-  }
-
-  return {
-    pwoInfo,
-    setInfo,
-    resetInfo,
-  };
-});

src/store/traceOrderManage/traceOrder.ts

@@ -0,0 +1,147 @@
+import { defineStore } from "pinia";
+import { ref } from "vue";
+import { message } from "ant-design-vue";
+import { debounce } from 'lodash';
+
+import { listStation, getStation } from "@/api/pwoManage/station";
+import {
+  listLotTraceOrder,
+  getLotTraceOrder,
+} from "@/api/pwoManage";
+
+export const useTraceOrderStore = defineStore("traceOrder", () => {
+  /* ========= 核心业务状态 ========= */
+  const currentTraceOrderId = ref<string | number>('');
+  const currentTraceOrderCode = ref<string>('');
+  const currentStationId = ref<string | number>('');
+  const currentStationCode = ref<string>('');
+
+  const traceOrderOptions = ref<any[]>([]);
+  const traceOrderInfo = ref<any>({});
+  const stationInfo = ref<any>({});
+  const stationList = ref<any[]>([]);
+
+  /* ========= actions ========= */
+
+  // 加载工单列表
+  const fetchTraceOrderOption = debounce(async (code: string) => {
+    if (!code) return;
+    try {
+      const { rows } = await listLotTraceOrder({
+        code,
+        pageSize: 10,
+        pageNum: 1,
+      });
+      traceOrderOptions.value = rows.map((item) => {
+        return {
+          id: item.id,
+          label: item.code,
+          value: item.code,
+        };
+      });
+    } catch (error: any) {
+      message.error(error.message || "获取工单列表失败");
+    }
+  }, 500);
+
+  // 选择工单
+  async function selectTraceOrder(value: string, option: any) {
+    currentTraceOrderId.value = option.id;
+    currentTraceOrderCode.value = value;
+
+    try {
+      loadingTraceOrderInfo.value = true;
+      if (!option.id) throw new Error();
+      const { data } = await getLotTraceOrder(option.id);
+      traceOrderInfo.value = data;
+      await fetchStationList();
+    } catch (error: any) {
+      message.error(error.message || "获取工单信息失败");
+    } finally {
+      loadingTraceOrderInfo.value = false;
+    }
+  }
+
+  // 获取工单信息
+  const loadingTraceOrderInfo = ref(false);
+  async function fetchTraceOrderInfo() {
+    if (!currentTraceOrderId.value) return;
+    try {
+      loadingTraceOrderInfo.value = true;
+      const { data } = await getLotTraceOrder(currentTraceOrderId.value);
+      traceOrderInfo.value = data;
+      fetchStationList();
+    } catch (error: any) {
+      message.error(error.message || '刷新工单信息失败');
+    } finally {
+      loadingTraceOrderInfo.value = false;
+    }
+  }
+  
+  // 获取站点列表
+  const loadingStations = ref(false);
+  async function fetchStationList() {
+    if (!currentTraceOrderCode.value) return;
+    try {
+      loadingStations.value = true;
+      const res = await listStation({ traceOrderCode: currentTraceOrderCode.value });
+      stationList.value = (res.rows || []).map((item: any, idx: number) => {
+        return {
+          key: String(item.id ?? idx),
+          index: item.seqNo ?? idx + 1,
+          ...item,
+        };
+      });
+    } catch (error: any) {
+      message.error(error?.msg || error?.message || "查询站点失败");
+    } finally {
+      loadingStations.value = false;
+    }
+  };
+
+  // 获取站点信息
+  const loadingStationInfo = ref(false);
+  async function fetchStationInfo() {
+    if (!currentTraceOrderId.value) return;
+    try {
+      loadingStationInfo.value = true;
+      const { data } = await getStation(currentStationId.value);
+      stationInfo.value = data;
+    } catch (error: any) {
+      console.log(error.message || '获取站点信息失败');
+    } finally {
+      loadingStationInfo.value = false;
+    }
+  }
+
+  // 选择站点
+  async function selectStation(stationId: string) {
+    currentStationId.value = stationId;
+    stationInfo.value = stationList.value.find((s: any) => s.id === stationId) ?? {};
+  }
+
+  async function refreshAll() {
+    await Promise.all([fetchTraceOrderInfo(), fetchStationList()]);
+  }
+
+  return {
+    currentTraceOrderId,
+    currentTraceOrderCode,
+    currentStationId,
+    currentStationCode,
+    traceOrderOptions,
+    traceOrderInfo,
+    stationInfo,
+    stationList,
+    loadingTraceOrderInfo,
+    loadingStations,
+    loadingStationInfo,
+    selectTraceOrder,
+    selectStation,
+    refreshAll,
+    fetchTraceOrderOption,
+    fetchTraceOrderInfo,
+    fetchStationList,
+    fetchStationInfo,
+  };
+});

src/views/pwoManage/index.vue

@@ -1,10 +1,8 @@
 <script setup lang="ts">
-import { ref, getCurrentInstance } from 'vue';
+import { getCurrentInstance } from 'vue';
 import { useRouter } from 'vue-router';
-import { message } from 'ant-design-vue';
 import type { ColumnsType } from 'ant-design-vue/es/table/interface';
-import { listStation } from '@/api/pwoManage/station';
+import {  useTraceOrderStore } from '@/store';
-import { usePwoStore, useJobStore } from '@/store';
 
 const { proxy } = getCurrentInstance() as any
 const { mes_station_status } = proxy.useDict("mes_station_status", "lot_trace_order_status")
@@ -21,9 +19,7 @@ interface TableItem {
 }
 
 const router = useRouter();
-const pwoStore = usePwoStore();
+const traceOrderStore = useTraceOrderStore();
-const jobStore = useJobStore();
-const tableData = ref<TableItem[]>([]);
 
 const columns = [
   { title: '序号', dataIndex: 'index', key: 'index', align: 'center', width: 80 },
@@ -35,55 +31,30 @@ const columns = [
   { title: '操作', key: 'action', align: 'center' },
 ];
 
-const loadingStations = ref(false);
-const fetchStations = async () => {
-  try {
-    loadingStations.value = true;
-    const res = await listStation({ traceOrderCode: pwoStore.pwoInfo.code });
-    tableData.value = (res.rows || []).map((item: any, idx: number) => {
-      return {
-        key: String(item.id ?? idx),
-        index: item.seqNo ?? idx + 1,
-        ...item,
-      } as TableItem;
-    });
-  } catch (error: any) {
-    message.error(error?.msg || error?.message || '查询站点失败');
-  } finally {
-    loadingStations.value = false;
-  }
-};
-
 const handleInfeed = (record: any) => {
-  jobStore.setInfo(record);
   router.push({ name: 'Infeed' });
 };
 
 const handleOutfeed = (record: any) => {
-  jobStore.setInfo(record);
   router.push({ name: 'Outfeed' });
 };
 
 function rowClick(record: TableItem) {
   return {
     onClick: () => {
-      jobStore.setInfo(record);
+      traceOrderStore.selectStation(record.id);
     },
   };
 }
-
-defineExpose({
-  fetchStations
-});
 </script>
 
 <template>
   <div class="table-wrapper">
     <a-table 
-      :dataSource="tableData"
+      :dataSource="traceOrderStore.stationList"
       :columns="columns as ColumnsType<TableItem>"
       :pagination="false"
-      :loading="loadingStations"
+      :loading="traceOrderStore.loadingStations"
       bordered
       sticky
       rowKey="key"
@@ -96,7 +67,7 @@ defineExpose({
         </template>
         <template v-if="column.key === 'action'">
           <a-space>
-            <a-button size="large" type="primary" @click="handleInfeed(record)">进站</a-button>
+            <a-button size="large" @click="handleInfeed(record)">进站</a-button>
             <a-button size="large" type="primary" danger @click="handleOutfeed(record)">出站</a-button>
           </a-space>
         </template>
@@ -112,12 +83,13 @@ defineExpose({
 
   .custom-table {
     :deep(.ant-table-thead > tr > th) {
-      background-color: #e6f7ff;
       font-weight: bold;
+      font-size: clamp(14px, 1.2vw, 20px);
     }
     
     :deep(.ant-table-tbody > tr > td) {
       padding: 12px 8px;
+      font-size: clamp(14px, 1vw, 20px);
     }
   }
 }

src/views/pwoManage/infeed/equipment/index.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { ref, onMounted, reactive } from 'vue';
 import { message } from 'ant-design-vue';
-import { useJobStore } from '@/store';
+import { useTraceOrderStore } from '@/store';
 import type { ColumnsType } from 'ant-design-vue/es/table/interface';
 import {
   getEquipmentByCode,
@@ -10,7 +10,7 @@ import {
   delEquipmentEntry,
 } from '@/api/pwoManage/equipment';
 
-const jobStore = useJobStore();
+const traceOrderStore = useTraceOrderStore();
 
 interface EquipmentTableItem {
   key: string;
@@ -50,7 +50,7 @@ const handleBind = async () => {
   try {
     await addEquipmentEntry({
       equipmentCode: equipmentInput.value,
-      stationCode: jobStore.jobInfo.code,
+      stationCode: traceOrderStore.currentStationCode,
     });
     message.success('绑定成功');
     equipmentInput.value = '';
@@ -73,7 +73,7 @@ const handleUnbind = async (id: number) => {
 // 获取已绑定的设备列表
 const loadingEquipmentTableData = ref(false);
 const fetchBoundEquipmentList = async () => {
-  const stationId = jobStore.jobInfo.id;
+  const stationId = traceOrderStore.currentStationCode;
   if (!stationId) return;
   loadingEquipmentTableData.value = true;
   try {

src/views/pwoManage/infeed/layout.vue

@@ -1,14 +1,14 @@
 <script setup lang="ts">
-import { ref, computed } from 'vue';
+import { ref, computed, inject } from 'vue';
 import { useRouter, useRoute } from 'vue-router';
 import { startStation } from '@/api/pwoManage/station';
-import { useJobStore } from '@/store/job';
+import { useTraceOrderStore } from '@/store';
 import { message } from 'ant-design-vue';
 
 const router = useRouter();
 const route = useRoute();
 
-const jobStore = useJobStore();
+const traceOrderStore = useTraceOrderStore();
 
 const menuItems = [
   { label: '主材', key: 'PrimaryMaterial', progress: 30 },
@@ -27,7 +27,8 @@ const infeeding = ref(false);
 const handleInfeed = async () => {
   infeeding.value = true;
   try {
-    await startStation(jobStore.jobInfo.id);
+    await startStation(traceOrderStore.currentStationId);
+    message.success('进站成功');
     router.push({ name: 'PwoManage' });
   } catch (error: any) {
     message.error(error.message || '进站失败'); 

src/views/pwoManage/infeed/mask/index.vue

@@ -4,9 +4,9 @@ import { message } from 'ant-design-vue';
 import type { ColumnsType } from 'ant-design-vue/es/table/interface';
 import { listMaskCombination } from "@/api/pwoManage/maskCombination";
 import { listStationBindMask, bindMaskCombinationToStations, unbindStationMask } from "@/api/pwoManage/mask";
-import { usePwoStore } from '@/store';
+import { useTraceOrderStore } from '@/store';
 
-const pwoStore = usePwoStore();
+const traceOrderStore = useTraceOrderStore();
 
 interface MaskTableItem {
   key: string;
@@ -61,7 +61,7 @@ const fetchCombinationList = async () => {
 const handleBind = async (id: number) => {
   try {
     await bindMaskCombinationToStations({
-      lotTraceOrderId: pwoStore.pwoInfo.id,
+      lotTraceOrderId: traceOrderStore.currentTraceOrderId,
       maskCombinationId: id
     });
     message.success('绑定成功');
@@ -86,7 +86,7 @@ const handleUnbind = async (id: number) => {
 // 获取已绑定的治具列表
 const loadingMask = ref(false);
 const fetchBoundMaskList = async () => {
-  const traceOrderId = pwoStore.pwoInfo.id;
+  const traceOrderId = traceOrderStore.currentTraceOrderId;
   if (!traceOrderId) return;
   loadingMask.value = true;
   try {

src/views/pwoManage/infeed/primaryMaterial/index.vue

@@ -1,12 +1,11 @@
 <script setup lang="ts">
 import { ref, onMounted } from 'vue';
-import { usePwoStore, useJobStore } from '@/store'
+import { useTraceOrderStore } from '@/store'
 import type { ColumnsType } from 'ant-design-vue/es/table/interface';
 import { message } from 'ant-design-vue'
 import { listMainMaterialEntryLog, addWaferEntryLogByCarrier, addDieEntryLogByCarrier, addWaferEntryLog, addDieEntryLog, delMainMaterialEntryLog } from '@/api/pwoManage/primaryMaterial'
 
-const pwoStore = usePwoStore();
+const traceOrderStore = useTraceOrderStore();
-const jobStore = useJobStore();
 
 interface MaterialTableItem {
   key: string;
@@ -29,7 +28,7 @@ const materialColumns = [
 // 查询站点下主材信息
 const loadingMaterialTableData = ref(false);
 const fetchPrimaryMaterialList = async () => {
-  const stationId = jobStore.jobInfo.id;
+  const stationId = traceOrderStore.currentStationId;
   if (!stationId) return;
   loadingMaterialTableData.value = true;
   try {
@@ -48,7 +47,7 @@ const insertCarrier = async () => {
   if (!carrierInput.value) return;
   const form = {
     carrierCode: carrierInput.value,
-    stationCode: jobStore.jobInfo.code
+    stationCode: traceOrderStore.currentStationCode,
   };
   try {
     if (materialType.value === "Wafer") {
@@ -73,7 +72,7 @@ const insertMaterial = async () => {
   if (!materialInput.value) return;
   const form = {
     mainMaterialCodes: [materialInput.value],
-    stationCode: jobStore.jobInfo.code
+    stationCode: traceOrderStore.currentStationCode,
   };
   try {
     if (materialType.value === "Wafer") {
@@ -126,8 +125,8 @@ defineExpose({
 
 // 初始化主材类型
 const materialType = ref()
-if (pwoStore.pwoInfo.orderType) {
+if (traceOrderStore.traceOrderInfo.orderType) {
-  const num = parseInt(pwoStore.pwoInfo.orderType)
+  const num = parseInt(traceOrderStore.traceOrderInfo.orderType)
   materialType.value = num % 4 === 0 ? 'Die' : 'Wafer'
 } else {
   materialType.value = '主材类型异常'

src/views/pwoManage/layout.vue

@@ -1,151 +1,43 @@
 <script setup lang="ts">
-import { ref, reactive, nextTick, onUnmounted, getCurrentInstance } from 'vue';
+import { ref, nextTick, getCurrentInstance } from 'vue';
 import { useRoute, useRouter } from 'vue-router';
-import { message } from 'ant-design-vue';
+import { useTraceOrderStore } from '@/store';
-import { debounce } from 'lodash';
-import { usePwoStore, useJobStore } from '@/store';
-import { listLotTraceOrder, getLotTraceOrder, addQualityAbnormalContact } from '@/api/pwoManage';
 import type { LotTraceOrderData } from '@/api/pwoManage/model';
+import { handleCopy } from '@/utils/copyToClipboard';
 
 const { proxy } = getCurrentInstance() as any
 const { mes_station_status, lot_trace_order_status } = proxy.useDict("mes_station_status", "lot_trace_order_status")
 
 const route = useRoute();
 const router = useRouter();
+const traceOrderStore = useTraceOrderStore();
 
-const pwoStore = usePwoStore();
+const redirectTo = (routeName: string) => {
-const jobStore = useJobStore();
+  router.push({ name: routeName });
-
+}
-const workOrderInfo = reactive<LotTraceOrderData>({});
-const processInfo = jobStore.jobInfo;
 
 // 孙组件
 const infeedRef = ref<any>(null);
 const collapsed = ref(false);
+// 折叠
 const toggleCollapse = async () => {
   collapsed.value = !collapsed.value;
   await nextTick();
   infeedRef.value?.renderTableHeight();
 }
-
-const redirectTo = (routeName: string) => {
-  router.push({ name: routeName });
-  if (routeName === 'PwoManage') {
-    handleRefresh();
-  }
-}
-
-const openHoldModal = ref(false);
-const planFinishDate = ref('');
-const handleHold = () => {
-  if (!workOrderInfo.code) {
-    message.error('请先选择工单！');
-    return;
-  }
-  openHoldModal.value = true;
-};
-const handleCloseHold = () => {
-  planFinishDate.value = '';
-  openHoldModal.value = false;
-};
-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: workOrderInfo.tarMaterialCode,
-      abnormalOperation: processInfo.operationCode,
-      planFinishDate: tmpPlanFinishDate,
-      status: "Hold",
-    })
-  } catch (error: any) {
-    message.error(error.message || '添加记录异常');
-    return;
-  }
-};
-
-const handleCopy = async (text: string | number | undefined) => {
-  if (!text) return;
-  await navigator.clipboard.writeText(String(text));
-  message.success(`已复制: ${ text }`);
-}
-
-const pwoCodeOptions = ref<LotTraceOrderData[]>([])
-const handleSearch = debounce(async (code: string) => {
-  if (!code) return;
-  try {
-    const { rows } = await listLotTraceOrder({
-      code,
-      pageSize: 10,
-      pageNum: 1,
-    });
-    pwoCodeOptions.value = rows.map(item => {
-      return {
-        id: item.id,
-        label: item.code,
-        value: item.code,
-      }
-    });
-  } catch (error: any) {
-    message.error(error.message || '获取工单信息失败');
-  }
-}, 500)
-
-const loadingPwoInfo = ref(false);
-const handleChange = async (value: string, option: LotTraceOrderData) => {
-  workOrderInfo.code = value;
-  try {
-    loadingPwoInfo.value = true;
-    if (!option.id) throw new Error();
-    const { data } = await getLotTraceOrder(option.id)
-    Object.assign(workOrderInfo, data);
-    pwoStore.setInfo(data);
-    jobStore.resetInfo();
-    infeedRef.value?.fetchStations();
-  } catch (error: any) {
-    message.error(error.message || '获取工单信息失败');
-  } finally {
-    loadingPwoInfo.value = false;
-  }
-}
-
-// 刷新工单信息
-const handleRefresh = async () => {
-  if (!workOrderInfo.id) return;
-  try {
-    loadingPwoInfo.value = true;
-    const { data } = await getLotTraceOrder(workOrderInfo.id)
-    Object.assign(workOrderInfo, data);
-    pwoStore.setInfo(data);
-    infeedRef.value?.fetchStations();
-  } catch (error: any) {
-    message.error(error.message || '刷新工单信息失败');
-  } finally {
-    loadingPwoInfo.value = false;
-  }
-}
-
-onUnmounted(() => {
-  pwoStore.resetInfo();
-  jobStore.resetInfo();
-})
 </script>
 
 <template>
   <div class="page-container">
-    <Header title="过站工控机" showHome showLogout>
+    <Header title="MES 过站平台" showHome showLogout>
       <template #right-opts>
-        <a-button @click="toggleCollapse">{{ collapsed ? '展开' : '折叠' }}</a-button>
+        <a-button @click="toggleCollapse">
+          <template #icon>
+            <i-lucide-chevron-up v-if="!collapsed" />
+            <i-lucide-chevron-down v-else />
+          </template>
+          {{ collapsed ? '展开' : '折叠' }}
+        </a-button>
       </template>
     </Header>
 
@@ -153,17 +45,16 @@ onUnmounted(() => {
       <!-- Top Section -->
       <div class="top-section">
         <a-row :gutter="16" class="full-height-row">
-          <!-- Work Order Info -->
           <a-col :span="13">
-            <a-spin :spinning="loadingPwoInfo">
+            <a-spin :spinning="traceOrderStore.loadingTraceOrderInfo">
               <a-card title="工单信息" class="info-card" :bordered="false">
-                <a-form :model="workOrderInfo" :colon="false" v-show="!collapsed">
+                <a-form :model="traceOrderStore.traceOrderInfo" :colon="false" v-show="!collapsed">
                   <a-row :gutter="36">
                     <a-col :span="12">
                       <a-form-item label="工单批次">
-                        <a-input v-model:value="workOrderInfo.batchNo" readonly>
+                        <a-input v-model:value="traceOrderStore.traceOrderInfo.batchNo" readonly>
                           <template #suffix>
-                            <a-button @click="handleCopy(workOrderInfo.batchNo)" size="small">
+                            <a-button @click="handleCopy(traceOrderStore.traceOrderInfo.batchNo)" size="small">
                               <template #icon><i-lucide-copy /></template>
                             </a-button>
                           </template>
@@ -172,14 +63,14 @@ onUnmounted(() => {
                       <a-form-item label="工单状态">
                         <a-input readonly>
                           <template #prefix>
-                            <DictTag :options="lot_trace_order_status" :value="workOrderInfo.status" size="medium" />
+                            <DictTag :options="lot_trace_order_status" :value="traceOrderStore.traceOrderInfo.status" size="medium" />
                           </template>
                         </a-input>
                       </a-form-item>
                       <a-form-item label="总计数量">
-                        <a-input v-model:value="workOrderInfo.planQty" readonly>
+                        <a-input v-model:value="traceOrderStore.traceOrderInfo.planQty" readonly>
                           <template #suffix>
-                            <a-button @click="handleCopy(workOrderInfo.planQty)" size="small">
+                            <a-button @click="handleCopy(traceOrderStore.traceOrderInfo.planQty)" size="small">
                               <template #icon><i-lucide-copy /></template>
                             </a-button>
                           </template>
@@ -188,18 +79,18 @@ onUnmounted(() => {
                     </a-col>
                     <a-col :span="12">
                       <a-form-item label="产品编码">
-                        <a-input v-model:value="workOrderInfo.tarMaterialCode" readonly>
+                        <a-input v-model:value="traceOrderStore.traceOrderInfo.tarMaterialCode" readonly>
                           <template #suffix>
-                            <a-button @click="handleCopy(workOrderInfo.tarMaterialCode)" size="small">
+                            <a-button @click="handleCopy(traceOrderStore.traceOrderInfo.tarMaterialCode)" size="small">
                               <template #icon><i-lucide-copy /></template>
                             </a-button>
                           </template>
                         </a-input>
                       </a-form-item>
                       <a-form-item label="产品名称">
-                        <a-input v-model:value="workOrderInfo.tarMaterialName" readonly>
+                        <a-input v-model:value="traceOrderStore.traceOrderInfo.tarMaterialName" readonly>
                           <template #suffix>
-                            <a-button @click="handleCopy(workOrderInfo.tarMaterialName)" size="small">
+                            <a-button @click="handleCopy(traceOrderStore.traceOrderInfo.tarMaterialName)" size="small">
                               <template #icon><i-lucide-copy /></template>
                             </a-button>
                           </template>
@@ -220,25 +111,24 @@ onUnmounted(() => {
                 <template #extra>
                   <a-space>
                     工单编码  
-                    <a-select v-model:value="workOrderInfo.code" show-search placeholder="输入工单编码" style="width: 300px"
+                    <a-select v-model:value="traceOrderStore.currentTraceOrderCode" show-search placeholder="输入工单编码" style="width: 300px"
-                      :show-arrow="false" :options="pwoCodeOptions" @search="handleSearch" :disabled="route.name !== 'PwoManageIndex'"
+                      :show-arrow="false" :options="traceOrderStore.traceOrderOptions" @search="traceOrderStore.fetchTraceOrderOption" :disabled="route.name !== 'PwoManageIndex'"
-                      @change="(val, option) => handleChange(val as string, option as LotTraceOrderData)" />
+                      @change="(val, option) => traceOrderStore.selectTraceOrder(val as string, option as LotTraceOrderData)" />
-                    <a-button @click="handleRefresh"><template #icon><i-lucide-rotate-cw /></template></a-button>
+                    <a-button @click="traceOrderStore.fetchTraceOrderInfo"><template #icon><i-lucide-rotate-cw /></template></a-button>
                   </a-space>
                 </template>
               </a-card>
             </a-spin>
           </a-col>
 
-          <!-- Process Info -->
           <a-col :span="8">
-            <a-spin :spinning="jobStore.loadingJobInfo">
+            <a-spin :spinning="traceOrderStore.loadingStationInfo">
               <a-card title="工序信息" class="info-card" :bordered="false">
-                <a-form :model="processInfo" :colon="false" v-show="!collapsed">
+                <a-form :model="traceOrderStore.stationInfo" :colon="false" v-show="!collapsed">
                   <a-form-item label="工序名称">
-                    <a-input v-model:value="processInfo.operationTitle" readonly>
+                    <a-input v-model:value="traceOrderStore.stationInfo.operationTitle" readonly>
                       <template #suffix>
-                        <a-button @click="handleCopy(processInfo.operationTitle)" size="small">
+                        <a-button @click="handleCopy(traceOrderStore.stationInfo.operationTitle)" size="small">
                           <template #icon><i-lucide-copy /></template>
                         </a-button>
                       </template>
@@ -247,14 +137,14 @@ onUnmounted(() => {
                   <a-form-item label="工序状态">
                     <a-input readonly>
                       <template #prefix>
-                        <DictTag :options="mes_station_status" :value="processInfo.status" size="medium" />
+                        <DictTag :options="mes_station_status" :value="traceOrderStore.stationInfo.status" size="medium" />
                       </template>
                     </a-input>
                   </a-form-item>
                   <a-form-item label="作业编码">
-                    <a-input v-model:value="processInfo.code" readonly>
+                    <a-input v-model:value="traceOrderStore.stationInfo.code" readonly>
                       <template #suffix>
-                        <a-button @click="handleCopy(processInfo.code)" size="small">
+                        <a-button @click="handleCopy(traceOrderStore.stationInfo.code)" size="small">
                           <template #icon><i-lucide-copy /></template>
                         </a-button>
                       </template>
@@ -262,7 +152,7 @@ onUnmounted(() => {
                   </a-form-item>
                 </a-form>
                 <template #extra>
-                  <a-button @click="jobStore.refresh"><template #icon><i-lucide-rotate-cw /></template></a-button>
+                  <a-button @click="traceOrderStore.fetchStationInfo"><template #icon><i-lucide-rotate-cw /></template></a-button>
                 </template>
               </a-card>
             </a-spin>
@@ -271,9 +161,9 @@ onUnmounted(() => {
           <!-- Action Buttons -->
           <a-col :span="3" class="action-buttons-col">
             <div class="action-buttons" v-show="!collapsed">
-              <a-button class="action-btn green-btn" @click="redirectTo('PwoManage')">工单管理</a-button>
+              <a-button class="action-btn" @click="redirectTo('PwoManage')" :disabled="route.name == 'PwoManageIndex'">工单管理</a-button>
-              <a-button class="action-btn orange-btn" @click="redirectTo('PrimaryMaterial')">主材清单</a-button>
+              <a-button class="action-btn" @click="redirectTo('PrimaryMaterial')">主材清单</a-button>
-              <a-button class="action-btn red-btn" @click="handleHold">Hold</a-button>
+              <HoldTraceOrder />
             </div>
             <a-card title="操作" class="info-card" :bordered="false" v-show="collapsed">
               <template #extra>
@@ -282,7 +172,6 @@ onUnmounted(() => {
                     <a-menu>
                       <a-menu-item key="1" @click="redirectTo('PwoManage')">工单管理</a-menu-item>
                       <a-menu-item key="2" @click="redirectTo('PrimaryMaterial')">主材清单</a-menu-item>
-                      <a-menu-item key="4" @click="handleHold">Hold</a-menu-item>
                     </a-menu>
                   </template>
                   <a-button>
@@ -303,36 +192,6 @@ onUnmounted(() => {
         </router-view>
       </main>
     </div>
-
-    <!-- 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="workOrderInfo.code" readonly />
-        </a-form-item>
-        <a-form-item label="目标产品编码">
-          <a-input v-model:value="workOrderInfo.tarMaterialCode" readonly />
-        </a-form-item>
-        <a-form-item label="目标产品名称">
-          <a-input v-model:value="workOrderInfo.tarMaterialName" readonly />
-        </a-form-item>
-        <a-form-item label="发起工序名称">
-          <a-input v-model:value="processInfo.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>
   </div>
 </template>
 
@@ -388,7 +247,8 @@ onUnmounted(() => {
   flex-direction: column;
 }
 
-.action-buttons {
+// 传递给子组件的样式
+:deep(.action-buttons) {
   display: flex;
   flex-direction: column;
   gap: 6px;
@@ -396,10 +256,8 @@ onUnmounted(() => {
 
   .action-btn {
     height: 48px;
-    font-size: 16px;
+    font-size: 20px;
-    color: #fff;
+    font-weight: 500;
-    border: none;
-    border-radius: 4px;
   }
 }
 

src/views/pwoManage/outfeed/jobReport/index.vue

@@ -1,14 +1,14 @@
 <script setup lang="ts">
 import { ref, reactive, onMounted, computed, getCurrentInstance } from 'vue';
 import { message } from 'ant-design-vue';
-import { useJobStore } from '@/store';
+import { useTraceOrderStore } from '@/store';
 import type { ColumnsType } from 'ant-design-vue/es/table/interface';
 import { listMainMaterialEntryLog, listMainMaterialOutboundLog, batchAddMainMaterialOutboundLog, getMainMaterialOutboundLog, updateMainMaterialOutboundLog, delMainMaterialOutboundLog } from "@/api/pwoManage/primaryMaterial";
 
 const { proxy } = getCurrentInstance() as any
 const { main_material_ok_level, main_material_ng_level } = proxy.useDict("main_material_ok_level", "main_material_ng_level")
 
-const jobStore = useJobStore();
+const traceOrderStore = useTraceOrderStore();
 
 interface PrimaryMaterialTableItem {
   key: string;
@@ -55,7 +55,7 @@ const primaryMaterialTableData = ref<PrimaryMaterialTableItem[]>([]);
 
 const loadingPrimaryMaterialList = ref(false);
 const fetchPrimaryMaterialList = async () => {
-  const stationId = jobStore.jobInfo.id;
+  const stationId = traceOrderStore.currentStationId;
   if (!stationId) return;
   loadingPrimaryMaterialList.value = true;
   try {
@@ -88,7 +88,7 @@ const infeedMaterialTableData = ref<InfeedMaterialTableItem[]>([]);
 
 // 挑选主材
 const handlePickPrimaryMaterial = async () => {
-  const stationId = jobStore.jobInfo.id;
+  const stationId = traceOrderStore.currentStationId;
   if (!stationId) return;
   try {
     const { rows } = await listMainMaterialEntryLog({ stationId });
@@ -149,11 +149,11 @@ const handleChangeSelection = (selectedRowKeys: any, selectedRows: InfeedMateria
 
 // 提交主材出站
 const submitOutfeed = async () => {
-  const stationCode = jobStore.jobInfo.code;
+  const stationCode = traceOrderStore.currentStationCode;
 
   try {
     await batchAddMainMaterialOutboundLog({ stationCode, outbounds: rowSelection.value });
-    message.success("出站成功");
+    message.success("提交成功");
     handleCancel();
     fetchPrimaryMaterialList();
   } catch (err: any) {
@@ -187,6 +187,7 @@ onMounted(() => {
 })
 
 defineExpose({
+  totals,
   renderTableHeight
 });
 

src/views/pwoManage/outfeed/layout.vue

@@ -4,12 +4,12 @@ import { useRouter, useRoute } from 'vue-router';
 import { message } from 'ant-design-vue';
 import { listStorageLocation } from '@/api/pwoManage/location';
 import { completeStation } from '@/api/pwoManage/station';
-import { useJobStore } from '@/store';
+import { useTraceOrderStore } from '@/store';
 
 const router = useRouter();
 const route = useRoute();
 
-const jobStore = useJobStore();
+const traceOrderStore = useTraceOrderStore();
 
 const menuItems = [
   { label: '主材报工', key: 'JobReport', progress: 30 },
@@ -49,7 +49,7 @@ const outfeeding = ref(false);
 const handleOutfeed = async () => {
   outfeeding.value = true;
   try {
-    await completeStation(jobStore.jobInfo.id, storage);
+    await completeStation(traceOrderStore.currentStationId, storage);
     openSelectLocation.value = false;
     message.success('出站成功');
     router.push({ name: 'PwoManage' });