feat(wms/coil): 新增异常继承功能并优化钢卷列表页面

1. 为异常管理弹窗添加继承异常按钮和继承弹窗 2. 新增罩式退火原料库选项 3. 优化钢卷列表表格样式与列配置，新增标签预览、打印、数字钢卷、追溯功能 4. 复用生产工序配置常量统一维护
2026-06-10 17:11:05 +08:00
parent fd50118161
commit 7bf7d24f29
4 changed files with 367 additions and 33 deletions
--- a/klp-ui/src/views/wms/coil/abnormal/extend.vue
+++ b/klp-ui/src/views/wms/coil/abnormal/extend.vue
@@ -26,31 +26,49 @@
      </div>
    </div>

-    <KLPTable :data="coilList" v-loading="loading" border stripe style="width: 100%">
-      <el-table-column label="当前钢卷号" prop="currentCoilNo" width="160" show-overflow-tooltip fixed />
-      <el-table-column label="入场钢卷号" prop="enterCoilNo" width="160" show-overflow-tooltip />
-      <el-table-column label="厂家卷号" prop="supplierCoilNo" width="140" show-overflow-tooltip />
-      <el-table-column label="物料类型" prop="materialType" width="80" />
-      <el-table-column label="品名" prop="itemName" width="120" show-overflow-tooltip />
-      <el-table-column label="规格" prop="specification" width="130" show-overflow-tooltip />
-      <el-table-column label="材质" prop="material" width="100" show-overflow-tooltip />
-      <el-table-column label="厂家" prop="manufacturer" width="100" show-overflow-tooltip />
-      <el-table-column label="毛重" prop="grossWeight" width="80" />
-      <el-table-column label="净重" prop="netWeight" width="80" />
-      <el-table-column label="实测厚度" prop="actualThickness" width="90" />
-      <el-table-column label="实测宽度" prop="actualWidth" width="90" />
-      <el-table-column label="实测长度" prop="actualLength" width="90" />
-      <el-table-column label="逻辑库区" prop="warehouseName" width="120" />
-      <el-table-column label="质量状态" prop="qualityStatus" width="80" />
-      <el-table-column label="班组" prop="team" width="80" />
-      <el-table-column label="异常数" width="70">
+    <KLPTable :data="coilList" v-loading="loading" border stripe height="calc(100vh - 200px)" style="width: 100%">
+      <el-table-column label="当前钢卷号" prop="currentCoilNo" width="140" show-overflow-tooltip />
+      <el-table-column label="入场钢卷号" prop="enterCoilNo" width="100" show-overflow-tooltip />
+      <el-table-column label="物料类型" prop="materialType" width="80">
+        <template slot-scope="scope">
+          <el-tag :type="scope.row.materialType === '成品' ? 'success' : 'info'" size="mini" effect="plain">
+            {{ scope.row.materialType }}
+          </el-tag>
+        </template>
+      </el-table-column>
+      <el-table-column label="数据类型" prop="dataType" width="90">
+        <template slot-scope="scope">
+          <el-tag :type="dataTypeTagType(scope.row.dataType)" size="mini" effect="plain">
+            {{ scope.row.dataType === 0 ? '历史' : scope.row.dataType === 1 ? '当前' : '未入库' }}
+          </el-tag>
+        </template>
+      </el-table-column>
+      <el-table-column label="异常数" width="70" align="center" prop="abnormalCount">
        <template slot-scope="scope">
          <el-tag :type="scope.row.abnormalCount > 0 ? 'danger' : 'info'" size="mini">
            {{ scope.row.abnormalCount || 0 }}
          </el-tag>
        </template>
      </el-table-column>
-      <el-table-column label="操作" width="180" fixed="right">
+      <el-table-column label="品名" prop="itemName" width="120" show-overflow-tooltip />
+      <el-table-column label="规格" prop="specification" width="130" show-overflow-tooltip />
+      <el-table-column label="材质" prop="material" width="100" show-overflow-tooltip />
+      <el-table-column label="厂家" prop="manufacturer" width="100" show-overflow-tooltip />
+      <el-table-column label="毛重" prop="grossWeight" width="80" />
+      <el-table-column label="净重" prop="netWeight" width="80" />
+
+      <el-table-column label="逻辑库区" prop="warehouseName" width="120" />
+      <el-table-column label="质量状态" prop="qualityStatus" width="80">
+        <template slot-scope="scope">
+          <dict-tag :options="dict.type.coil_quality_status" :value="scope.row.qualityStatus" />
+        </template>
+      </el-table-column>
+      <el-table-column label="班组" prop="team" width="80" />
+
+      <el-table-column label="实测厚度" prop="actualThickness" width="90" />
+      <el-table-column label="实测宽度" prop="actualWidth" width="90" />
+      <el-table-column label="实测长度" prop="actualLength" width="90" />
+      <el-table-column label="操作" width="100" fixed="right">
        <template slot-scope="scope">
          <el-button type="text" size="mini" icon="el-icon-document" @click="handleOpenException(scope.row)">
            异常管理
@@ -59,12 +77,22 @@
            style="color: #e6a23c;" @click="handleInherit(scope.row)">
            继承
          </el-button>
+          <el-button size="mini" type="text" icon="el-icon-view" @click="handlePreviewLabel(scope.row)">
+            预览标签
+          </el-button>
+          <el-button size="mini" type="text" icon="el-icon-printer" @click="handlePrintLabel(scope.row)">
+            打印标签
+          </el-button>
+          <el-button size="mini" type="text" icon="el-icon-view" @click="handleNumberCoilClick(scope.row)">
+            数字钢卷
+          </el-button>
+          <el-button size="mini" type="text" icon="el-icon-search" @click="handleTrace(scope.row)">追溯</el-button>
        </template>
      </el-table-column>
    </KLPTable>

-    <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum"
-      :limit.sync="queryParams.pageSize" @pagination="getCoilList" />
+    <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
+      @pagination="getCoilList" />

    <el-dialog title="异常管理" :visible.sync="exceptionDialogVisible" fullscreen append-to-body>
      <exception-manager :coilId="currentCoilId" />
@@ -74,22 +102,21 @@
      :close-on-click-modal="false">
      <div v-loading="inheritLoading">
        <template v-if="parentCoils.length > 0">
-          <el-alert title="以下为加工前钢卷的异常记录，请选择要继承的异常" type="info" :closable="false" show-icon style="margin-bottom: 16px;" />
+          <el-alert title="以下为加工前钢卷的异常记录，请选择要继承的异常" type="info" :closable="false" show-icon
+            style="margin-bottom: 16px;" />
          <div v-for="(parent, pIdx) in parentCoils" :key="parent.coilId" class="parent-coil-section">
            <div class="parent-header">
-              <span class="parent-title">加工前钢卷 #{{ pIdx + 1 }}：{{ parent.currentCoilNo || parent.coilId }}</span>
+              <span class="parent-title">加工前钢卷 #{{ pIdx + 1 }}：入场{{ parent.coil.enterCoilNo }} / 当前{{ parent.coil.currentCoilNo }}</span>
              <el-button type="text" size="mini" @click="handleViewParentCoil(parent)">查看钢卷信息</el-button>
            </div>
            <el-table :data="parent.abnormalList" border stripe size="small" style="width: 100%">
              <el-table-column width="50">
                <template slot="header">
-                  <el-checkbox :indeterminate="parent.isIndeterminate"
-                    :value="parent.checkedAll"
+                  <el-checkbox :indeterminate="parent.isIndeterminate" :value="parent.checkedAll"
                    @change="val => handleParentSelectAll(parent, val)" />
                </template>
                <template slot-scope="scope">
-                  <el-checkbox v-model="scope.row._selected"
-                    @change="() => recalcParentCheckState(parent)" />
+                  <el-checkbox v-model="scope.row._selected" @change="() => recalcParentCheckState(parent)" />
                </template>
              </el-table-column>
              <el-table-column label="缺陷描述" prop="remark" show-overflow-tooltip />
@@ -125,13 +152,23 @@
        <el-button @click="parentCoilDialogVisible = false">关闭</el-button>
      </span>
    </el-dialog>
+
+    <!-- 标签预览弹窗 -->
+    <el-dialog title="标签预览" :visible.sync="labelRender.visible" append-to-body>
+      <label-render :content="labelRender.data" :labelType="labelRender.type" />
+    </el-dialog>
+
+    <label-render ref="labelRender" v-show="false" :content="labelRender.data" :labelType="labelRender.type" />
  </div>
 </template>

 <script>
-import { listMaterialCoil, getMaterialCoil } from '@/api/wms/coil'
+import { listMaterialCoil, getMaterialCoil, getMaterialCoilTrace, } from '@/api/wms/coil'
 import { listCoilAbnormal, addCoilAbnormal } from '@/api/wms/coilAbnormal'
 import ExceptionManager from '../components/ExceptionManager'
+import { getCoilTagPrintType } from '@/views/wms/coil/js/coilPrint';
+import CoilTraceResult from "../panels/CoilTraceResult.vue";
+import LabelRender from '../panels/LabelRender/index.vue'

 const PRODUCTION_LINES = [
  { label: '酸连轧工序', warehouseIds: { raw_material: '1988150044862377986', product: '1988150099140866050' } },
@@ -145,10 +182,13 @@ const PRODUCTION_LINES = [

 export default {
  name: 'CoilAbnormalExtend',
-  dicts: [],
+  dicts: ['product_coil_status', 'coil_material', 'coil_itemname', 'coil_manufacturer', 'coil_quality_status',],
  components: {
-    ExceptionManager
+    ExceptionManager,
+    CoilTraceResult,
+    LabelRender
  },
+
  data() {
    return {
      productionLines: PRODUCTION_LINES,
@@ -157,10 +197,17 @@ export default {
      loading: false,
      coilList: [],
      total: 0,
+      dataTypeFilters: [
+        { text: '历史', value: 0 },
+        { text: '当前', value: 1 },
+        { text: '未入库', value: 2 },
+      ],
      queryParams: {
        pageNum: 1,
        pageSize: 20,
-        dataType: 1,
+        orderByAbnormal: true,
+        dataType: undefined,
+        qualityStatusCsv: undefined,
        currentCoilNo: undefined,
        enterCoilNo: undefined,
        warehouseIds: undefined,
@@ -207,7 +254,12 @@ export default {
      parentCoils: [],
      currentInheritCoil: null,
      parentCoilDialogVisible: false,
-      parentViewCoil: null
+      parentViewCoil: null,
+      labelRender: {
+        visible: false,
+        type: '',
+        data: {}
+      },
    }
  },
  computed: {
@@ -229,6 +281,54 @@ export default {
      const line = this.productionLines.find(l => l.label === this.currentLine)
      return line?.warehouseIds?.[this.viewType]
    },
+    /** 预览标签 */
+    handlePreviewLabel(row) {
+      this.labelRender.visible = true;
+      const itemName = row.itemName || '';
+
+      this.labelRender.type = row.itemType === 'product' ? '3' : '2';
+      this.labelRender.data = {
+        ...row,
+        itemName: itemName,
+        updateTime: row.updateTime?.split(' ')[0] || '',
+      };
+    },
+    /** 追溯按钮操作 */
+    handleTrace(row) {
+      this.traceOpen = true;
+      this.traceLoading = true;
+      this.traceResult = null; // 清空历史数据
+      getMaterialCoilTrace({
+        coilId: row.coilId,
+        currentCoilNo: row.currentCoilNo,
+      }).then(res => {
+        this.traceResult = res.data; // 将结果传递给组件
+      }).catch(err => {
+        console.error('溯源查询失败：', err);
+        this.$message.error('溯源查询失败，请重试');
+      }).finally(() => {
+        this.traceLoading = false;
+      });
+    },
+    // 打印标签
+    handlePrintLabel(row) {
+      const type = getCoilTagPrintType(row);
+      this.labelRender.type = type;
+
+      this.labelRender.data = {
+        ...row,
+        updateTime: row.updateTime?.split(' ')[0] || '',
+      };
+      this.$nextTick(() => {
+        this.$refs.labelRender.printLabel();
+      })
+    },
+    // 进入数字钢卷页面
+    handleNumberCoilClick(row) {
+      this.$router.push({
+        path: '/wms/coil/' + row.coilId,
+      });
+    },
    doSearch() {
      this.queryParams.warehouseIds = this.getWarehouseIdsByLine()
      this.queryParams.pageNum = 1
@@ -247,6 +347,8 @@ export default {
    resetSearch() {
      this.queryParams.currentCoilNo = undefined
      this.queryParams.enterCoilNo = undefined
+      this.queryParams.dataType = undefined
+      this.queryParams.qualityStatusCsv = undefined
      this.doSearch()
    },
    getCoilList() {
@@ -258,6 +360,14 @@ export default {
        this.loading = false
      })
    },
+    filterDataType(value, row) {
+      return row.dataType === value
+    },
+    dataTypeTagType(dataType) {
+      if (dataType === 0) return 'warning'
+      if (dataType === 1) return 'success'
+      return 'info'
+    },
    handleOpenException(row) {
      this.currentCoilId = row.coilId
      this.exceptionDialogVisible = true
@@ -358,6 +468,7 @@ export default {
  gap: 16px;
  overflow-x: auto;
 }
+
 .top-bar {
  display: flex;
  align-items: center;
@@ -368,19 +479,27 @@ export default {
  border: 1px solid #e4e7ed;
  border-radius: 4px;
 }
+
+.el-table .el-button+.el-button {
+  margin-left: 0 !important;
+}
+
 .bar-group {
  display: flex;
  align-items: center;
  gap: 8px;
 }
+
 .bar-label {
  font-size: 13px;
  color: #606266;
  white-space: nowrap;
 }
+
 .bar-search {
  margin-left: auto;
 }
+
 .parent-coil-section {
  margin-bottom: 20px;
  padding: 12px;
@@ -388,6 +507,7 @@ export default {
  border: 1px solid #e4e7ed;
  border-radius: 4px;
 }
+
 .parent-header {
  display: flex;
  justify-content: space-between;
@@ -396,6 +516,7 @@ export default {
  padding-bottom: 8px;
  border-bottom: 1px solid #e4e7ed;
 }
+
 .parent-title {
  font-size: 14px;
  font-weight: 600;