refactor(wms/coil): 抽象排产单组件，复用排产单展示逻辑

1.  新增PlanSheetViewer通用排产单展示组件，支持图片、excel、普通文件预览和空状态
2.  改造TimeInput组件，修复绑定属性写法
3.  替换typing.vue、stepSplit.vue、split.vue、merge.vue中的旧排产单代码，统一使用新组件
4.  删除冗余的排产单相关API调用和本地数据逻辑

klp-ui/src/components/TimeInput.vue

@@ -2,9 +2,9 @@
   <div class="time-input-group">
     <el-date-picker v-model="dateValue" type="date" value-format="yyyy-MM-dd" placeholder="选择日期" style="width: 140px;" @change="updateDateTime" />
     <span class="time-separator">@</span>
-    <el-input-number :controls="false" v-model="hourValue" placeholder="时" min="0" max="23" style="width: 60px;" @change="updateDateTime" />
+    <el-input-number :controls="false" v-model="hourValue" placeholder="时" :min="0" :max="23" style="width: 60px;" @change="updateDateTime" />
     <span class="time-separator">:</span>
-    <el-input-number :controls="false" v-model="minuteValue" placeholder="分" min="0" max="59" style="width: 60px;" @change="updateDateTime" />
+    <el-input-number :controls="false" v-model="minuteValue" placeholder="分" :min="0" :max="59" style="width: 60px;" @change="updateDateTime" />
     <span class="time-separator">:00</span>
     <el-button v-if="showNowButton" type="text" size="small" @click="setToNow" style="margin-left: 8px;">此刻</el-button>
   </div>

klp-ui/src/views/wms/coil/components/PlanSheetViewer.vue

@@ -0,0 +1,162 @@
+<template>
+  <div v-if="lineName">
+    <div v-if="planSheetList.length > 0">
+      <el-descriptions v-if="showHeader" :column="1" border :title="'最近排产单（' + lineName + '）'" size="small" />
+      <el-tabs v-model="activePlanSheetId" type="card" size="mini">
+        <el-tab-pane
+          v-for="sheet in planSheetList"
+          :key="sheet.planSheetId"
+          :name="sheet.planSheetId"
+          :label="sheet.planCode || ('排产单' + sheet.planSheetId)"
+        />
+      </el-tabs>
+      <div v-if="activePlanSheet" class="preview-container">
+        <div v-if="!activePlanSheet.apsUrl" class="no-file">
+          <el-empty description="暂无排产文件" :image-size="60" />
+        </div>
+        <div v-else class="preview-panel">
+          <div v-if="isImage" class="image-preview">
+            <div class="image-wrapper">
+              <el-image :src="activePlanSheet.apsUrl" fit="scale-down" :preview-src-list="[activePlanSheet.apsUrl]" />
+            </div>
+          </div>
+          <div v-else-if="isExcel" class="excel-preview">
+            <xlsx-preview :src="activePlanSheet.apsUrl" height="420px" />
+          </div>
+          <div v-else class="file-link">
+            <a :href="activePlanSheet.apsUrl" target="_blank">
+              <i class="el-icon-document"></i> {{ getFileName(activePlanSheet.apsUrl) }}
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div v-else-if="!loading && showHeader">
+      <el-descriptions :column="1" border :title="'最近排产单（' + lineName + '）'" size="small" />
+      <el-empty description="今天暂无排产单" :image-size="60" />
+    </div>
+  </div>
+</template>
+
+<script>
+import { listPlanSheet, getPlanSheet } from '@/api/aps/planSheet'
+import XlsxPreview from '@/components/FilePreview/preview/xlsx/index.vue'
+
+export default {
+  name: 'PlanSheetViewer',
+  components: {
+    XlsxPreview
+  },
+  props: {
+    lineName: {
+      type: String,
+      default: ''
+    },
+    showHeader: {
+      type: Boolean,
+      default: true
+    },
+    tableMaxHeight: {
+      type: [Number, String],
+      default: 300
+    }
+  },
+  data() {
+    return {
+      planSheetList: [],
+      planSheetMap: {},
+      loading: false,
+      activePlanSheetId: null
+    }
+  },
+  computed: {
+    activePlanSheet() {
+      return this.planSheetMap[this.activePlanSheetId] || null
+    },
+    isImage() {
+      const url = (this.activePlanSheet && this.activePlanSheet.apsUrl) || ''
+      return /\.(jpg|jpeg|png|gif|bmp|webp)(\?|$)/i.test(url)
+    },
+    isExcel() {
+      const url = (this.activePlanSheet && this.activePlanSheet.apsUrl) || ''
+      return /\.(xlsx|xls)(\?|$)/i.test(url)
+    }
+  },
+  watch: {
+    lineName: {
+      immediate: true,
+      handler(val) {
+        if (val) {
+          this.fetchPlanSheets()
+        }
+      }
+    }
+  },
+  methods: {
+    async fetchPlanSheets() {
+      this.loading = true
+      try {
+        const res = await listPlanSheet({
+          lineName: this.lineName,
+          pageSize: 3,
+          pageNum: 1
+        })
+        this.planSheetList = res.rows || []
+        this.planSheetMap = {}
+        if (this.planSheetList.length > 0) {
+          this.activePlanSheetId = this.planSheetList[0].planSheetId
+          for (const sheet of this.planSheetList) {
+            this.fetchPlanSheetInfo(sheet.planSheetId)
+          }
+        }
+      } catch (e) {
+        console.error('查询排产单失败', e)
+      } finally {
+        this.loading = false
+      }
+    },
+    async fetchPlanSheetInfo(planSheetId) {
+      try {
+        const res = await getPlanSheet(planSheetId)
+        this.$set(this.planSheetMap, planSheetId, res.data)
+      } catch (e) {
+        console.error('查询排产单详情失败', e)
+      }
+    },
+    getFileName(url) {
+      if (!url) return ''
+      const parts = url.split('/')
+      return parts[parts.length - 1] || '文件'
+    }
+  }
+}
+</script>
+
+<style scoped>
+.preview-container {
+  min-height: 200px;
+}
+.no-file {
+  padding: 20px 0;
+}
+.image-preview {
+  text-align: center;
+}
+.image-wrapper {
+  max-height: 600px;
+  max-width: 100%;
+  overflow: auto;
+}
+.image-wrapper /deep/ .el-image__inner {
+  max-height: 600px;
+  max-width: 100%;
+}
+.file-link a {
+  font-size: 14px;
+  color: #409eff;
+  text-decoration: none;
+}
+.file-link a:hover {
+  text-decoration: underline;
+}
+</style>

klp-ui/src/views/wms/coil/merge.vue

@@ -15,42 +15,8 @@
 
     <!-- 最近排产单 -->
     <div class="plan-sheet-container">
-      <div v-if="planSheetList.length > 0" class="plan-sheet-section">
+      <div class="plan-sheet-section">
-        <el-descriptions :column="1" border :title="'最近排产单（' + planSheetLineName + '）'" size="small" />
+        <PlanSheetViewer :line-name="planSheetLineName" />
-        <el-tabs v-model="activePlanSheetId" type="card" size="mini">
-          <el-tab-pane v-for="sheet in planSheetList" :key="sheet.planSheetId" :name="sheet.planSheetId"
-            :label="sheet.planCode || ('排产单' + sheet.planSheetId)" />
-        </el-tabs>
-        <el-table v-loading="planSheetLoading" :data="activePlanSheetDetails" border stripe size="mini"
-          max-height="300">
-          <el-table-column type="index" label="序号" width="50" />
-          <el-table-column label="订单信息" header-align="center">
-            <el-table-column prop="contractCode" label="合同号" width="140" show-overflow-tooltip />
-            <el-table-column prop="customerName" label="客户" width="120" show-overflow-tooltip />
-            <el-table-column prop="salesman" label="业务员" width="100" show-overflow-tooltip />
-          </el-table-column>
-          <el-table-column label="成品信息" header-align="center">
-            <el-table-column prop="productName" label="成品名称" width="140" show-overflow-tooltip />
-            <el-table-column prop="productMaterial" label="材质" width="100" />
-            <el-table-column prop="coatingG" label="镀层g" width="80" />
-            <el-table-column prop="productWidth" label="成品宽度" width="100" />
-            <el-table-column prop="rollingThick" label="轧制厚度" width="100" />
-            <el-table-column prop="markCoatThick" label="标丝厚度" width="100" />
-            <el-table-column prop="tonSteelLengthRange" label="长度区间(m)" width="120" />
-            <el-table-column prop="planQty" label="数量" width="80" />
-            <el-table-column prop="planWeight" label="重量" width="100" />
-            <el-table-column prop="surfaceTreatment" label="表面处理" width="110" show-overflow-tooltip />
-            <el-table-column prop="widthReq" label="切边要求" width="110" show-overflow-tooltip />
-            <el-table-column prop="productPackaging" label="包装要求" width="100" show-overflow-tooltip />
-            <el-table-column prop="productEdgeReq" label="宽度要求" width="100" show-overflow-tooltip />
-            <el-table-column prop="usageReq" label="用途" width="100" show-overflow-tooltip />
-          </el-table-column>
-          <el-table-column prop="remark" label="备注" width="140" show-overflow-tooltip />
-        </el-table>
-      </div>
-      <div v-else-if="planSheetLineName && !planSheetLoading" class="plan-sheet-section">
-        <el-descriptions :column="1" border :title="'最近排产单（' + planSheetLineName + '）'" size="small" />
-        <el-empty description="今天暂无排产单" :image-size="60" />
       </div>
     </div>
 
@@ -210,13 +176,13 @@
 
               <div class="form-row">
                 <el-form-item label="毛重(t)" prop="grossWeight" class="form-item-half">
-                  <el-input-number precision="3" :controls="false" v-model="targetCoil.grossWeight" placeholder="请输入毛重"
+                  <el-input-number :precision="3" :controls="false" v-model="targetCoil.grossWeight" placeholder="请输入毛重"
                     type="number" :step="0.01" :disabled="readonly">
                     <template slot="append">吨</template>
                   </el-input-number>
                 </el-form-item>
                 <el-form-item label="净重(t)" prop="netWeight" class="form-item-half">
-                  <el-input-number precision="3" :controls="false" v-model="targetCoil.netWeight" placeholder="请输入净重"
+                  <el-input-number :precision="3" :controls="false" v-model="targetCoil.netWeight" placeholder="请输入净重"
                     type="number" :step="0.01" :disabled="readonly">
                     <template slot="append">吨</template>
                   </el-input-number>
@@ -400,8 +366,6 @@
 import { getMaterialCoil, mergeMaterialCoil } from '@/api/wms/coil';
 import { listCoilAbnormal } from '@/api/wms/coilAbnormal';
 import { listPendingAction, getPendingAction } from '@/api/wms/pendingAction';
-import { listPlanSheet } from '@/api/aps/planSheet'
-import { listPlanDetail } from '@/api/aps/planDetail'
 import CoilSelector from '@/components/CoilSelector';
 import ActualWarehouseSelect from "@/components/KLPService/ActualWarehouseSelect";
 import RawMaterialSelector from "@/components/KLPService/RawMaterialSelect";
@@ -409,6 +373,7 @@ import ProductSelector from "@/components/KLPService/ProductSelect";
 import WarehouseSelect from "@/components/KLPService/WarehouseSelect";
 import TimeInput from "@/components/TimeInput";
 import AbnormalForm from './components/AbnormalForm';
+import PlanSheetViewer from './components/PlanSheetViewer.vue';
 import { generateCoilNoPrefix } from "@/utils/coil/coilNo";
 import ContractSelect from "@/components/KLPService/ContractSelect";
 import { addCoilContractRel } from "@/api/wms/coilContractRel";
@@ -423,7 +388,8 @@ export default {
     WarehouseSelect,
     TimeInput,
     AbnormalForm,
-    ContractSelect
+    ContractSelect,
+    PlanSheetViewer,
   },
   dicts: ['coil_quality_status', 'coil_abnormal_position', 'coil_abnormal_code', 'coil_abnormal_degree', 'coil_business_purpose'],
   data() {
@@ -516,11 +482,6 @@ export default {
         degree: null,
         remark: null
       },
-      // 排产单相关
-      planSheetList: [],
-      planSheetDetailMap: {},
-      planSheetLoading: false,
-      activePlanSheetId: null,
       // 异常继承
       inheritDialogVisible: false,
       inheritLoading: false,
@@ -556,12 +517,12 @@ export default {
     },
     planSheetLineName() {
       const mapping = {
-        11: '酸轧线', 200: '酸轧线', 520: '酸轧线',
+        '11': '酸轧线', '200': '酸轧线', '520': '酸轧线', '201': '酸轧线',
-        501: '镀锌线', 521: '镀锌线',
+        '501': '镀锌线', '521': '镀锌线', '202': '镀锌线',
-        203: '脱脂线', 502: '脱脂线', 522: '脱脂线',
+        '203': '脱脂线', '502': '脱脂线', '522': '脱脂线',
-        204: '拉矫线', 503: '拉矫线', 523: '拉矫线',
+        '204': '拉矫线', '503': '拉矫线', '523': '拉矫线',
-        205: '双机架', 504: '双机架', 524: '双机架',
+        '205': '双机架', '504': '双机架', '524': '双机架',
-        505: '镀铬线', 525: '镀铬线',
+        '505': '镀铬线', '525': '镀铬线', '206': '镀铬线',
       }
       return mapping[parseInt(this.actionTypeCode)] || ''
     },
@@ -569,9 +530,6 @@ export default {
       const d = new Date()
       return `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}-${String(d.getDate()).padStart(2, '0')}`
     },
-    activePlanSheetDetails() {
-      return this.planSheetDetailMap[this.activePlanSheetId] || []
-    },
     selectedInheritCount() {
       let count = 0
       for (const parent of this.parentCoils) {
@@ -610,7 +568,6 @@ export default {
     // 保存当前页面的待操作类型
     if (actionTypeCode) {
       this.actionTypeCode = actionTypeCode;
-      this.fetchPlanSheets();
     }
 
     // 设置只读模式
@@ -1007,33 +964,6 @@ export default {
       this.$router.back();
     },
 
-    async fetchPlanSheets() {
-      if (!this.planSheetLineName) return
-      this.planSheetLoading = true
-      try {
-        const res = await listPlanSheet({
-          lineName: this.planSheetLineName,
-          pageSize: 3, pageNum: 1,
-        })
-        this.planSheetList = res.rows || []
-        this.planSheetDetailMap = {}
-        if (this.planSheetList.length > 0) {
-          this.activePlanSheetId = this.planSheetList[0].planSheetId
-          for (const sheet of this.planSheetList) {
-            this.fetchPlanSheetDetail(sheet.planSheetId)
-          }
-        }
-      } catch (e) { console.error('查询排产单失败', e) }
-      finally { this.planSheetLoading = false }
-    },
-    async fetchPlanSheetDetail(planSheetId) {
-      try {
-        const res = await listPlanDetail({ planSheetId, pageSize: 100, pageNum: 1 })
-        const details = (res.rows || []).sort((a, b) => (parseInt(a.bizSeqNo) || 0) - (parseInt(b.bizSeqNo) || 0))
-        this.$set(this.planSheetDetailMap, planSheetId, details)
-      } catch (e) { console.error('查询排产单明细失败', e) }
-    },
-
     // 新增异常
     addAbnormal() {
       this.currentAbnormalIndex = -1;

klp-ui/src/views/wms/coil/panels/stepSplit.vue

@@ -109,56 +109,12 @@
             </el-table-column>
           </el-table>
 
-          <!-- 今日排产单 -->
+          <!-- 最近排产单 -->
-          <div v-if="planSheetList.length > 0" class="plan-sheet-section">
+          <template v-if="planSheetLineName">
-            <el-descriptions :column="1" border :title="'最近排产单（' + planSheetLineName + '）'" />
+            <div class="plan-sheet-section">
-            <el-tabs v-model="activePlanSheetId" type="card">
+              <PlanSheetViewer :line-name="planSheetLineName" :table-max-height="400" />
-              <el-tab-pane
+            </div>
-                v-for="sheet in planSheetList"
+          </template>
-                :key="sheet.planSheetId"
-                :name="sheet.planSheetId"
-                :label="sheet.planCode || ('排产单' + sheet.planSheetId)"
-              />
-            </el-tabs>
-            <el-table
-              v-loading="planSheetLoading"
-              :data="activePlanSheetDetails"
-              border
-              stripe
-              size="mini"
-              max-height="400"
-            >
-              <el-table-column type="index" label="序号" width="50" />
-              <el-table-column label="订单信息" header-align="center">
-                <el-table-column prop="contractCode" label="合同号" width="140" show-overflow-tooltip />
-                <el-table-column prop="customerName" label="客户" width="120" show-overflow-tooltip />
-                <el-table-column prop="salesman" label="业务员" width="100" show-overflow-tooltip />
-              </el-table-column>
-              <el-table-column label="成品信息" header-align="center">
-                <el-table-column prop="productName" label="成品名称" width="140" show-overflow-tooltip />
-                <el-table-column prop="productMaterial" label="材质" width="100" />
-                <el-table-column prop="coatingG" label="镀层g" width="80" />
-                <el-table-column prop="productWidth" label="成品宽度" width="100" />
-                <el-table-column prop="rollingThick" label="轧制厚度" width="100" />
-                <el-table-column prop="markCoatThick" label="标丝厚度" width="100" />
-                <el-table-column prop="tonSteelLengthRange" label="长度区间(m)" width="120" />
-                <el-table-column prop="planQty" label="数量" width="80" />
-                <el-table-column prop="planWeight" label="重量" width="100" />
-                <el-table-column prop="surfaceTreatment" label="表面处理" width="110" show-overflow-tooltip />
-                <el-table-column prop="widthReq" label="切边要求" width="110" show-overflow-tooltip />
-                <el-table-column prop="productPackaging" label="包装要求" width="100" show-overflow-tooltip />
-                <el-table-column prop="productEdgeReq" label="宽度要求" width="100" show-overflow-tooltip />
-                <el-table-column prop="usageReq" label="用途" width="100" show-overflow-tooltip />
-              </el-table-column>
-              <el-table-column prop="remark" label="备注" width="140" show-overflow-tooltip />
-            </el-table>
-          </div>
-
-          <!-- 今日排产单空状态 -->
-          <div v-if="planSheetList.length === 0 && planSheetLineName && !planSheetLoading" class="plan-sheet-section">
-            <el-descriptions :column="1" border :title="'最近排产单（' + planSheetLineName + '）'" />
-            <el-empty description="今天暂无排产单" :image-size="80" />
-          </div>
         </div>
       </el-col>
 
@@ -505,14 +461,13 @@ import { listCoilAbnormal } from '@/api/wms/coilAbnormal'
 import { completeAction, getPendingAction, updatePendingAction } from '@/api/wms/pendingAction'
 import { saveCoilCache, getCoilCacheByCoilId, delCoilCache } from '@/api/wms/coilCache'
 import { getGalvanize1TypingPrefill } from '@/api/pocket/acidTyping'
-import { listPlanSheet } from '@/api/aps/planSheet'
-import { listPlanDetail } from '@/api/aps/planDetail'
 import ProductSelect from '@/components/KLPService/ProductSelect'
 import RawMaterialSelect from '@/components/KLPService/RawMaterialSelect'
 import WarehouseSelect from '@/components/KLPService/WarehouseSelect'
 import ActualWarehouseSelect from '@/components/KLPService/ActualWarehouseSelect'
 import TimeInput from '@/components/TimeInput'
 import AbnormalForm from '../components/AbnormalForm'
+import PlanSheetViewer from '../components/PlanSheetViewer.vue'
 import { generateCoilNoPrefix } from '@/utils/coil/coilNo'
 import ProductInfo from '@/components/KLPService/Renderer/ProductInfo'
 import RawMaterialInfo from '@/components/KLPService/Renderer/RawMaterialInfo'
@@ -530,7 +485,8 @@ export default {
     AbnormalForm,
     ProductInfo,
     RawMaterialInfo,
-    ContractSelect
+    ContractSelect,
+    PlanSheetViewer,
   },
   props: {
     actionId: {
@@ -644,11 +600,6 @@ export default {
       parsedCacheData: null,
       // 最早的热轧卷板材质
       firstHeatMaterial: '',
-      // 排产单相关
-      planSheetList: [],
-      planSheetDetailMap: {},
-      planSheetLoading: false,
-      activePlanSheetId: null,
       // 异常继承
       inheritDialogVisible: false,
       inheritLoading: false,
@@ -668,7 +619,7 @@ export default {
         200: '酸轧线',
         520: '酸轧线',
 
-        206: '镀锌线',
+        202: '镀锌线',
         501: '镀锌线',
         521: '镀锌线',
 
@@ -697,10 +648,13 @@ export default {
       const day = String(d.getDate()).padStart(2, '0')
       return `${y}-${m}-${day}`
     },
-    activePlanSheetDetails() {
+    todayDateStr() {
-      return this.planSheetDetailMap[this.activePlanSheetId] || []
+      const d = new Date()
+      const y = d.getFullYear()
+      const m = String(d.getMonth() + 1).padStart(2, '0')
+      const day = String(d.getDate()).padStart(2, '0')
+      return `${y}-${m}-${day}`
     },
-    // 是否是镀铬操作
     isGrindAction() {
       return this.actionType == 505 || this.actionType == 525 || this.actionType == 206
     },
@@ -746,56 +700,10 @@ export default {
           // 获取镀锌线二级系统数据
           this.getZincList()
         }
-        if (this.planSheetLineName) {
-          this.fetchPlanSheets()
-        }
       }
     }
   },
   methods: {
-    // 查询最近排产单及明细
-    async fetchPlanSheets() {
-      if (!this.planSheetLineName) return
-      this.planSheetLoading = true
-      try {
-        const res = await listPlanSheet({
-          lineName: this.planSheetLineName,
-          pageSize: 3,
-          pageNum: 1
-        })
-        this.planSheetList = res.rows || []
-        this.planSheetDetailMap = {}
-        if (this.planSheetList.length > 0) {
-          this.activePlanSheetId = this.planSheetList[0].planSheetId
-          for (const sheet of this.planSheetList) {
-            this.fetchPlanSheetDetail(sheet.planSheetId)
-          }
-        }
-      } catch (e) {
-        console.error('查询排产单失败', e)
-      } finally {
-        this.planSheetLoading = false
-      }
-    },
-    async fetchPlanSheetDetail(planSheetId) {
-      try {
-        const res = await listPlanDetail({
-          planSheetId,
-          pageSize: 100,
-          pageNum: 1
-        })
-        const details = res.rows || []
-        details.sort((a, b) => {
-          const na = parseInt(a.bizSeqNo) || 0
-          const nb = parseInt(b.bizSeqNo) || 0
-          return na - nb
-        })
-        this.$set(this.planSheetDetailMap, planSheetId, details)
-      } catch (e) {
-        console.error('查询排产单明细失败', e)
-      }
-    },
-
     // 查询待分条的钢卷信息
     async getCoilInfo() {
       try {

klp-ui/src/views/wms/coil/split.vue

@@ -14,42 +14,8 @@
 
     <!-- 最近排产单 -->
     <div class="plan-sheet-container">
-      <div v-if="planSheetList.length > 0" class="plan-sheet-section">
+      <div class="plan-sheet-section">
-        <el-descriptions :column="1" border title="最近排产单（酸轧线）" size="small" />
+        <PlanSheetViewer :line-name="planSheetLineName" />
-        <el-tabs v-model="activePlanSheetId" type="card" size="mini">
-          <el-tab-pane v-for="sheet in planSheetList" :key="sheet.planSheetId" :name="sheet.planSheetId"
-            :label="sheet.planCode || ('排产单' + sheet.planSheetId)" />
-        </el-tabs>
-        <el-table v-loading="planSheetLoading" :data="activePlanSheetDetails" border stripe size="mini"
-          max-height="300">
-          <el-table-column type="index" label="序号" width="50" />
-          <el-table-column label="订单信息" header-align="center">
-            <el-table-column prop="contractCode" label="合同号" width="140" show-overflow-tooltip />
-            <el-table-column prop="customerName" label="客户" width="120" show-overflow-tooltip />
-            <el-table-column prop="salesman" label="业务员" width="100" show-overflow-tooltip />
-          </el-table-column>
-          <el-table-column label="成品信息" header-align="center">
-            <el-table-column prop="productName" label="成品名称" width="140" show-overflow-tooltip />
-            <el-table-column prop="productMaterial" label="材质" width="100" />
-            <el-table-column prop="coatingG" label="镀层g" width="80" />
-            <el-table-column prop="productWidth" label="成品宽度" width="100" />
-            <el-table-column prop="rollingThick" label="轧制厚度" width="100" />
-            <el-table-column prop="markCoatThick" label="标丝厚度" width="100" />
-            <el-table-column prop="tonSteelLengthRange" label="长度区间(m)" width="120" />
-            <el-table-column prop="planQty" label="数量" width="80" />
-            <el-table-column prop="planWeight" label="重量" width="100" />
-            <el-table-column prop="surfaceTreatment" label="表面处理" width="110" show-overflow-tooltip />
-            <el-table-column prop="widthReq" label="切边要求" width="110" show-overflow-tooltip />
-            <el-table-column prop="productPackaging" label="包装要求" width="100" show-overflow-tooltip />
-            <el-table-column prop="productEdgeReq" label="宽度要求" width="100" show-overflow-tooltip />
-            <el-table-column prop="usageReq" label="用途" width="100" show-overflow-tooltip />
-          </el-table-column>
-          <el-table-column prop="remark" label="备注" width="140" show-overflow-tooltip />
-        </el-table>
-      </div>
-      <div v-else-if="!planSheetLoading" class="plan-sheet-section">
-        <el-descriptions :column="1" border title="最近排产单（酸轧线）" size="small" />
-        <el-empty description="今天暂无排产单" :image-size="60" />
       </div>
     </div>
 
@@ -211,13 +177,13 @@
 
                 <div class="form-row">
                   <el-form-item label="毛重(t)" required class="form-item-half">
-                    <el-input-number precision="3" :controls="false" v-model="item.grossWeight" placeholder="请输入毛重"
+                    <el-input-number :precision="3" :controls="false" v-model="item.grossWeight" placeholder="请输入毛重"
                       :step="0.01" :disabled="readonly">
                       <template slot="append">吨</template>
                     </el-input-number>
                   </el-form-item>
                   <el-form-item label="净重(t)" required class="form-item-half">
-                    <el-input-number precision="3" :controls="false" v-model="item.netWeight" placeholder="请输入净重"
+                    <el-input-number :precision="3" :controls="false" v-model="item.netWeight" placeholder="请输入净重"
                       :step="0.01" :disabled="readonly">
                       <template slot="append">吨</template>
                     </el-input-number>
@@ -404,14 +370,13 @@ import { getMaterialCoil, splitMaterialCoil, getFirstHeatCoilMaterial } from '@/
 import { listCoilAbnormal } from '@/api/wms/coilAbnormal';
 import { listWarehouse } from '@/api/wms/warehouse';
 import { completeAction, getPendingAction } from '@/api/wms/pendingAction';
-import { listPlanSheet } from '@/api/aps/planSheet'
-import { listPlanDetail } from '@/api/aps/planDetail'
 import ActualWarehouseSelect from "@/components/KLPService/ActualWarehouseSelect";
 import RawMaterialSelect from "@/components/KLPService/RawMaterialSelect";
 import ProductSelect from "@/components/KLPService/ProductSelect";
 import WarehouseSelect from "@/components/KLPService/WarehouseSelect";
 import TimeInput from "@/components/TimeInput";
 import AbnormalForm from './components/AbnormalForm';
+import PlanSheetViewer from './components/PlanSheetViewer.vue';
 import { generateCoilNoPrefix } from "@/utils/coil/coilNo";
 import ContractSelect from "@/components/KLPService/ContractSelect";
 import { addCoilContractRel } from "@/api/wms/coilContractRel";
@@ -425,7 +390,8 @@ export default {
     WarehouseSelect,
     TimeInput,
     AbnormalForm,
-    ContractSelect
+    ContractSelect,
+    PlanSheetViewer,
   },
   dicts: ['coil_quality_status', 'coil_abnormal_position', 'coil_abnormal_code', 'coil_abnormal_degree', 'coil_business_purpose'],
   data() {
@@ -508,12 +474,6 @@ export default {
       },
       // 最早热轧卷板材质
       firstHeatMaterial: null,
-      // 排产单相关
-      actionTypeCode: '',
-      planSheetList: [],
-      planSheetDetailMap: {},
-      planSheetLoading: false,
-      activePlanSheetId: null,
       // 异常继承
       inheritDialogVisible: false,
       inheritLoading: false,
@@ -530,9 +490,6 @@ export default {
       const d = new Date()
       return `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}-${String(d.getDate()).padStart(2, '0')}`
     },
-    activePlanSheetDetails() {
-      return this.planSheetDetailMap[this.activePlanSheetId] || []
-    },
     selectedInheritCount() {
       let count = 0
       for (const parent of this.parentCoils) {
@@ -554,12 +511,6 @@ export default {
     const coilId = this.$route.query.coilId;
     const actionId = this.$route.query.actionId;
     const readonly = this.$route.query.readonly;
-    const actionTypeCode = this.$route.query.actionTypeCode;
-
-    if (actionTypeCode) {
-      this.actionTypeCode = actionTypeCode;
-    }
-    this.fetchPlanSheets();
 
     // 获取待操作详情
     getPendingAction(actionId).then(res => {
@@ -1012,33 +963,6 @@ export default {
       return item ? item.label : code;
     },
 
-    // 查询最近排产单（酸轧线）
-    async fetchPlanSheets() {
-      this.planSheetLoading = true
-      try {
-        const res = await listPlanSheet({
-          lineName: '酸轧线',
-          pageSize: 3, pageNum: 1,
-        })
-        this.planSheetList = res.rows || []
-        this.planSheetDetailMap = {}
-        if (this.planSheetList.length > 0) {
-          this.activePlanSheetId = this.planSheetList[0].planSheetId
-          for (const sheet of this.planSheetList) {
-            this.fetchPlanSheetDetail(sheet.planSheetId)
-          }
-        }
-      } catch (e) { console.error('查询排产单失败', e) }
-      finally { this.planSheetLoading = false }
-    },
-    async fetchPlanSheetDetail(planSheetId) {
-      try {
-        const res = await listPlanDetail({ planSheetId, pageSize: 100, pageNum: 1 })
-        const details = (res.rows || []).sort((a, b) => (parseInt(a.bizSeqNo) || 0) - (parseInt(b.bizSeqNo) || 0))
-        this.$set(this.planSheetDetailMap, planSheetId, details)
-      } catch (e) { console.error('查询排产单明细失败', e) }
-    },
-
     // 异常继承
     handleInheritAbnormal(subCoilIndex) {
       const parentId = this.motherCoil.coilId

klp-ui/src/views/wms/coil/typing.vue

@@ -10,42 +10,11 @@
       </CoilInfoRender>
     </div>
 
-    <!-- 排产计划 -->
+    <el-card class="plan-card" v-if="currentLineName" style="margin-bottom: 20px;">
-    <el-card class="plan-card" v-if="planSheetList.length > 0" style="margin-bottom: 20px;">
       <div slot="header" class="card-header">
         <span><i class="el-icon-s-order"></i> {{ currentLineName }}排产计划</span>
       </div>
-      <el-tabs v-model="activePlanSheetId" type="card" size="mini">
+      <PlanSheetViewer :line-name="currentLineName" :show-header="false" />
-        <el-tab-pane v-for="sheet in planSheetList" :key="sheet.planSheetId" :name="sheet.planSheetId"
-          :label="sheet.planCode || ('排产单' + sheet.planSheetId)" />
-      </el-tabs>
-      <div style="overflow-x: auto;">
-        <el-table :data="activePlanSheetDetails" size="small" max-height="300" stripe border>
-          <el-table-column type="index" label="序号" width="50" />
-          <el-table-column label="订单信息" header-align="center">
-            <el-table-column prop="contractCode" label="合同号" width="140" show-overflow-tooltip />
-            <el-table-column prop="customerName" label="客户" width="120" show-overflow-tooltip />
-            <el-table-column prop="salesman" label="业务员" width="100" show-overflow-tooltip />
-          </el-table-column>
-          <el-table-column label="成品信息" header-align="center">
-            <el-table-column prop="productName" label="成品名称" width="140" show-overflow-tooltip />
-            <el-table-column prop="productMaterial" label="材质" width="100" />
-            <el-table-column prop="coatingG" label="镀层g" width="80" />
-            <el-table-column prop="productWidth" label="成品宽度" width="100" />
-            <el-table-column prop="rollingThick" label="轧制厚度" width="100" />
-            <el-table-column prop="markCoatThick" label="标丝厚度" width="100" />
-            <el-table-column prop="tonSteelLengthRange" label="长度区间(m)" width="120" />
-            <el-table-column prop="planQty" label="数量" width="80" />
-            <el-table-column prop="planWeight" label="重量" width="100" />
-            <el-table-column prop="surfaceTreatment" label="表面处理" width="110" show-overflow-tooltip />
-            <el-table-column prop="widthReq" label="切边要求" width="110" show-overflow-tooltip />
-            <el-table-column prop="productPackaging" label="包装要求" width="100" show-overflow-tooltip />
-            <el-table-column prop="productEdgeReq" label="宽度要求" width="100" show-overflow-tooltip />
-            <el-table-column prop="usageReq" label="用途" width="100" show-overflow-tooltip />
-          </el-table-column>
-          <el-table-column prop="remark" label="备注" width="140" show-overflow-tooltip />
-        </el-table>
-      </div>
     </el-card>
 
     <el-alert v-if="acidPrefill.visible" :title="acidPrefill.title" :type="acidPrefill.type" :closable="false" show-icon
@@ -416,8 +385,6 @@ import { getMaterialCoil, updateMaterialCoil, getFirstHeatCoilMaterial } from '@
 import { listCoilAbnormal } from '@/api/wms/coilAbnormal';
 import { matchBestSpecVersion } from '@/api/wms/processSpecVersion';
 import { completeAction, getPendingAction } from '@/api/wms/pendingAction';
-import { listPlanSheet } from '@/api/aps/planSheet';
-import { listPlanDetail } from '@/api/aps/planDetail';
 import { saveCoilCache, getCoilCacheByCoilId, delCoilCache } from '@/api/wms/coilCache';
 import ActualWarehouseSelect from "@/components/KLPService/ActualWarehouseSelect";
 import RawMaterialSelect from "@/components/KLPService/RawMaterialSelect";
@@ -430,6 +397,7 @@ import { addCoilContractRel } from "@/api/wms/coilContractRel";
 import ContractSelect from "@/components/KLPService/ContractSelect";
 import L2MatchPanel from './panels/L2MatchPanel.vue'
 import DrMatchPanel from './panels/DrMatchPanel.vue';
+import PlanSheetViewer from './components/PlanSheetViewer.vue';
 
 
 // actionType -> 产线名称映射
@@ -455,6 +423,7 @@ export default {
     ContractSelect,
     L2MatchPanel,
     DrMatchPanel,
+    PlanSheetViewer,
   },
   dicts: ['coil_quality_status', 'coil_abnormal_position', 'coil_abnormal_code', 'coil_abnormal_degree', 'coil_business_purpose'],
   data() {
@@ -576,11 +545,7 @@ export default {
       currentCache: null,
       parsedCacheData: null,
       itemSelectorQueryParams: {},
-      // 排产计划
+
-      planSheetList: [],
-      planSheetDetailMap: {},
-      activePlanSheetId: null,
-      currentLineName: '',
       // 异常继承
       inheritDialogVisible: false,
       inheritLoading: false,
@@ -592,8 +557,8 @@ export default {
     l2HotCoilId() {
       return (this.currentInfo && this.currentInfo.enterCoilNo) || ''
     },
-    activePlanSheetDetails() {
+    currentLineName() {
-      return this.planSheetDetailMap[this.activePlanSheetId] || []
+      return actionTypeToLineName[this.actionType] || ''
     },
     /** 是否双机架工序（actionType 504=正常 / 524=修复） */
     isDrAction() {
@@ -677,8 +642,6 @@ export default {
       }
     }
 
-    // 加载排产计划
-    await this.loadPlanDetails();
   },
   methods: {
     /** 双机架计划/道次快捷写入 */
@@ -802,43 +765,6 @@ export default {
       }
     },
 
-    // 根据当前actionType加载对应产线的最近3个排产计划
-    async loadPlanDetails() {
-      const lineName = actionTypeToLineName[this.actionType]
-      if (!lineName) return
-      this.currentLineName = lineName
-      try {
-        const sheetRes = await listPlanSheet({
-          lineName,
-          pageNum: 1,
-          pageSize: 3,
-        })
-        this.planSheetList = sheetRes.rows || []
-        this.planSheetDetailMap = {}
-        if (this.planSheetList.length > 0) {
-          this.activePlanSheetId = this.planSheetList[0].planSheetId
-          for (const sheet of this.planSheetList) {
-            this.fetchPlanSheetDetail(sheet.planSheetId)
-          }
-        }
-      } catch (error) {
-        console.error('加载排产计划失败', error)
-      }
-    },
-    async fetchPlanSheetDetail(planSheetId) {
-      try {
-        const detailRes = await listPlanDetail({
-          planSheetId,
-          pageNum: 1,
-          pageSize: 50,
-        })
-        if (detailRes.rows) {
-          const details = detailRes.rows.sort((a, b) => (parseInt(a.bizSeqNo) || 0) - (parseInt(b.bizSeqNo) || 0))
-          this.$set(this.planSheetDetailMap, planSheetId, details)
-        }
-      } catch (e) { console.error('查询排产单明细失败', e) }
-    },
-
     // 复制当前信息到更新表单
     copyFromCurrent() {
       // 复制除了指定字段之外的其他字段