feat(mes): 增加产品设计项目审批流程和批次追溯功能

云

2026-08-13 7dfbaba5930676252d8339f7d04861c1c2351d5b

 src/views/mes/qc/batchtrace/modules/trace-detail.vue

@@ -5,15 +5,24 @@

import { useVbenModal } from '@vben/common-ui';

import { Tabs } from 'ant-design-vue';
import { Tabs, Tooltip } from 'ant-design-vue';

import { useDescription } from '#/components/description';

import { useDetailSchema } from '../data';
import ProcessTraceList from './process-trace-list.vue';
import PurchaseSourceList from './purchase-source-list.vue';
import SalesTargetList from './sales-target-list.vue';
import TraceList from './trace-list.vue';

const detailData = ref<MesWmBatchApi.Batch>(); // 当前批次详情
const subTabsName = ref<'backward' | 'forward'>('forward'); // 当前激活的追溯方向
const subTabsName = ref<
  | 'backward'
  | 'forward'
  | 'purchase'
  | 'sales'
  | 'process'
>('forward'); // 当前激活的追溯页签

const [Descriptions] = useDescription({
  bordered: true,
@@ -47,12 +56,46 @@
      class="mx-4 mt-4"
      type="card"
    >
      <Tabs.TabPane key="forward" tab="向前追溯">
      <Tabs.TabPane key="forward">
        <template #tab>
          <Tooltip title="顺着生产流往下游查：该批次被哪些工单消耗后，产出成了哪些成品批次">
            <span>向前追溯</span>
          </Tooltip>
        </template>
        <TraceList :batch-code="detailData.code" direction="forward" />
      </Tabs.TabPane>
      <Tabs.TabPane key="backward" tab="向后追溯">
      <Tabs.TabPane key="backward">
        <template #tab>
          <Tooltip title="逆着生产流往上游查：生产该批次时，消耗了哪些原料批次">
            <span>向后追溯</span>
          </Tooltip>
        </template>
        <TraceList :batch-code="detailData.code" direction="backward" />
      </Tabs.TabPane>
      <Tabs.TabPane key="purchase">
        <template #tab>
          <Tooltip title="原料侧来源：该批次对应的采购入库单与 IQC 来料检验记录">
            <span>采购来源</span>
          </Tooltip>
        </template>
        <PurchaseSourceList :batch-code="detailData.code" />
      </Tabs.TabPane>
      <Tabs.TabPane key="sales">
        <template #tab>
          <Tooltip title="成品侧去向：该批次对应的销售出库单与 OQC 出厂检验记录">
            <span>销售去向</span>
          </Tooltip>
        </template>
        <SalesTargetList :batch-code="detailData.code" />
      </Tabs.TabPane>
      <Tabs.TabPane key="process">
        <template #tab>
          <Tooltip title="各工序的投入/产出事件：该批次在哪些工序被投入或产出，及数量和质量状态">
            <span>工序流转</span>
          </Tooltip>
        </template>
        <ProcessTraceList :batch-code="detailData.code" />
      </Tabs.TabPane>
    </Tabs>
  </Modal>
</template>