feat(wms): 新增多项功能并优化标签展示逻辑

1. 异常管理页面默认显示继承按钮，新增继承弹窗传参 2. 多标签页优化订货单位展示：移除"有限公司"后缀并自适应字体大小 3. 基础面板新增备注查询条件和表格列展示 4. 流程页面新增节点点击交互和悬停效果
2026-06-19 12:30:18 +08:00
parent d0afe5eaaf
commit c8c2523fe7
6 changed files with 79 additions and 23 deletions
--- a/klp-ui/src/views/wms/coil/abnormal/extend.vue
+++ b/klp-ui/src/views/wms/coil/abnormal/extend.vue
@@ -73,7 +73,7 @@
          <el-button type="text" size="mini" icon="el-icon-document" @click="handleOpenException(scope.row)">
            异常管理
          </el-button>
-          <el-button v-if="viewType === 'product'" type="text" size="mini" icon="el-icon-download"
+          <el-button type="text" size="mini" icon="el-icon-download"
            style="color: #e6a23c;" @click="handleInherit(scope.row)">
            继承
          </el-button>
@@ -95,7 +95,7 @@
      @pagination="getCoilList" />

    <el-dialog title="异常管理" :visible.sync="exceptionDialogVisible" fullscreen append-to-body>
-      <exception-manager :coilId="currentCoilId" />
+      <exception-manager :coilId="currentCoilId" :show-inherit-button="true"/>
    </el-dialog>

    <el-dialog title="异常继承" :visible.sync="inheritDialogVisible" width="1200px" append-to-body top="5vh"
--- a/klp-ui/src/views/wms/coil/panels/LabelRender/DuGeTag.vue
+++ b/klp-ui/src/views/wms/coil/panels/LabelRender/DuGeTag.vue
@@ -19,7 +19,7 @@
        <!-- 第一行：订货单位 + 合同号 -->
        <div class="info-grid-item label-cell">订货单位</div>
        <div class="info-grid-item value-cell">
-          <div class="nob" contenteditable :style="{ fontSize: orderUnitFontSize }">{{ content.orderUnit || '' }}</div>
+          <div class="nob" contenteditable :style="{ fontSize: orderUnitFontSize }">{{ orderUnitDisplay }}</div>
          <!-- <input type="text"  :value="content.orderUnit || ''" /> -->
        </div>
        <div class="info-grid-item label-cell">合同号</div>
@@ -181,13 +181,14 @@ export default {
    materialWithManufacturer() {
      return this.content.material
    },
+    orderUnitDisplay() {
+      return (this.content.orderUnit || '').replace(/有限公司/g, '')
+    },
    orderUnitFontSize() {
-      const len = (this.content.orderUnit || '').length
+      const len = this.orderUnitDisplay.length
      if (len < 10) return '1.2em'
-      if (len <= 14) return '1em'
-      if (len <= 18) return '0.88em'
-      if (len <= 24) return '0.78em'
-      return '0.68em'
+      const size = Math.max(0.55, 12 / len).toFixed(2)
+      return size + 'em'
    }
  },
  data() {
--- a/klp-ui/src/views/wms/coil/panels/LabelRender/GalvanizedTag.vue
+++ b/klp-ui/src/views/wms/coil/panels/LabelRender/GalvanizedTag.vue
@@ -20,7 +20,7 @@
        <div class="info-grid-item label-cell">订货单位</div>
        <div class="info-grid-item value-cell">
          <!-- <input type="text" class="nob" :value="content.orderUnit || ''" /> -->
-          <div class="nob" contenteditable :style="{ fontSize: orderUnitFontSize }">{{ content.orderUnit || '' }}</div>
+          <div class="nob" contenteditable :style="{ fontSize: orderUnitFontSize }">{{ orderUnitDisplay }}</div>
        </div>
        <div class="info-grid-item label-cell">合同号</div>
        <div class="info-grid-item value-cell">
@@ -182,13 +182,14 @@ export default {
    materialWithManufacturer() {
      return this.content.material
    },
+    orderUnitDisplay() {
+      return (this.content.orderUnit || '').replace(/有限公司/g, '')
+    },
    orderUnitFontSize() {
-      const len = (this.content.orderUnit || '').length
+      const len = this.orderUnitDisplay.length
      if (len < 10) return '1.2em'
-      if (len <= 14) return '1em'
-      if (len <= 18) return '0.88em'
-      if (len <= 24) return '0.78em'
-      return '0.68em'
+      const size = Math.max(0.55, 12 / len).toFixed(2)
+      return size + 'em'
    }
  },
  data() {
--- a/klp-ui/src/views/wms/coil/panels/LabelRender/OuterTagPreview.vue
+++ b/klp-ui/src/views/wms/coil/panels/LabelRender/OuterTagPreview.vue
@@ -19,7 +19,7 @@
        <!-- 第一行：订货单位 + 合同号 -->
        <div class="info-grid-item label-cell">订货单位</div>
        <div class="info-grid-item value-cell">
-          <div class="nob" contenteditable :style="{ fontSize: orderUnitFontSize }">{{ content.orderUnit || '' }}</div>
+          <div class="nob" contenteditable :style="{ fontSize: orderUnitFontSize }">{{ orderUnitDisplay }}</div>
          <!-- <input type="text" class="nob" :value="content.orderUnit || ''" /> -->
        </div>
        <div class="info-grid-item label-cell">合同号</div>
@@ -188,13 +188,14 @@ export default {
    materialWithManufacturer() {
      return this.content.material
    },
+    orderUnitDisplay() {
+      return (this.content.orderUnit || '').replace(/有限公司/g, '')
+    },
    orderUnitFontSize() {
-      const len = (this.content.orderUnit || '').length
+      const len = this.orderUnitDisplay.length
      if (len < 10) return '1.2em'
-      if (len <= 14) return '1em'
-      if (len <= 18) return '0.88em'
-      if (len <= 24) return '0.78em'
-      return '0.68em'
+      const size = Math.max(0.55, 12 / len).toFixed(2)
+      return size + 'em'
    }
  },
  data() {
--- a/klp-ui/src/views/wms/coil/panels/base.vue
+++ b/klp-ui/src/views/wms/coil/panels/base.vue
@@ -78,6 +78,11 @@
          clearable />
      </el-form-item>

+      <el-form-item label="备注">
+         <el-input v-model="queryParams.remark" placeholder="请输入备注" clearable
+          @keyup.enter.native="handleQuery" />
+      </el-form-item>
+
      <el-form-item v-if="showWaybill" label="发货状态">
        <el-radio-group v-model="queryParams.status" @change="handleQuery">
          <el-radio-button label="">全部</el-radio-button>
@@ -220,11 +225,11 @@
          <el-table-column v-if="moreColumn" label="厂家" prop="manufacturer"></el-table-column>
          <el-table-column v-if="moreColumn" label="表面处理" prop="surfaceTreatmentDesc"></el-table-column>
          <el-table-column v-if="moreColumn" label="品质" prop="qualityStatus"></el-table-column>
+          <el-table-column v-if="moreColumn" label="备注" prop="remark" show-overflow-tooltip></el-table-column>
          <el-table-column v-if="moreColumn" label="切边" prop="trimmingRequirement"></el-table-column>
          <el-table-column v-if="moreColumn" label="包装" prop="packagingRequirement"></el-table-column>
          <el-table-column v-if="moreColumn" label="镀层质量" prop="zincLayer"></el-table-column>
-          <el-table-column label="备注" align="center" prop="remark" show-overflow-tooltip />
-
+          
          <el-table-column v-if="hasTransferType" label="调拨类型" align="center" prop="transferType" />
          <el-table-column v-if="hasTransferType" label="改判原因" align="center" prop="rejudgeInfo.rejudgeReason" />

--- a/klp-ui/src/views/wms/post/flow.vue
+++ b/klp-ui/src/views/wms/post/flow.vue
@@ -14,7 +14,7 @@
    </div>

    <div v-loading="loading" class="flow-content">
-      <div class="flow-diagram" v-html="currentSvg"></div>
+      <div ref="diagram" class="flow-diagram" v-html="currentSvg" @click="onNodeClick"></div>
    </div>
  </div>
 </template>
@@ -120,8 +120,16 @@ export default {
        { key: 'afterSales', label: '售后处理流程', icon: 'el-icon-s-claim' },
      ],
      svgCache: {},
+      selectedNode: null,
    }
  },
+  watch: {
+    currentSvg() {
+      this.$nextTick(() => {
+        this.bindNodeEvents()
+      })
+    },
+  },
  computed: {
    currentSvg() {
      const code = diagrams[this.activeTab]
@@ -140,6 +148,38 @@ export default {
  methods: {
    switchTab(key) {
      this.activeTab = key
+      this.selectedNode = null
+    },
+    bindNodeEvents() {
+      const el = this.$refs.diagram
+      if (!el) return
+      const svg = el.querySelector('svg')
+      if (!svg) return
+      const groups = svg.querySelectorAll('g:not([class*="edge"])')
+      groups.forEach(g => {
+        const hasRect = g.querySelector('rect, path, ellipse, polygon')
+        const text = g.querySelector('text, span')
+        if (hasRect && text) {
+          g.style.cursor = 'pointer'
+        }
+      })
+    },
+    onNodeClick(e) {
+      let target = e.target
+      while (target && target !== e.currentTarget) {
+        if (target.tagName === 'g') {
+          const textEl = target.querySelector('text, span')
+          if (textEl) {
+            const label = textEl.textContent.replace(/\s+/g, ' ').trim()
+            if (label) {
+              this.selectedNode = label
+              this.$message({ message: label, type: 'info', duration: 1500 })
+              return
+            }
+          }
+        }
+        target = target.parentElement
+      }
    },
  },
 }
@@ -203,4 +243,12 @@ export default {
  max-width: 100%;
  height: auto;
 }
+
+.flow-diagram :deep(svg g) {
+  transition: opacity 0.15s ease;
+}
+
+.flow-diagram :deep(svg g:hover) {
+  opacity: 0.8;
+}
 </style>