refactor(wms): 提取异常钢卷表格为公共组件 AbnormalTable

将多个页面中重复的异常钢卷表格逻辑提取为公共组件 AbnormalTable，提高代码复用性和维护性

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

@@ -0,0 +1,82 @@
+<template>
+  <el-table :data="list">
+    <el-table-column label="异常钢卷" align="center" prop="coilId" v-if="showCoil">
+      <template slot-scope="scope">
+        <coil-no :coilId="scope.row.coilId">
+          {{ scope.row.coilNo }}
+        </coil-no>
+      </template>
+    </el-table-column>
+    <el-table-column label="缺陷描述" align="center" prop="remark" show-overflow-tooltip />
+    <el-table-column label="上下板面" align="center" prop="plateSurface"></el-table-column>
+    <el-table-column label="缺陷位置" align="center" prop="position">
+      <template slot-scope="scope">
+        <dict-tag :options="dict.type.coil_abnormal_position" :value="scope.row.position" />
+      </template>
+    </el-table-column>
+
+    <el-table-column label="开始位置" align="center" prop="startPosition" />
+    <el-table-column label="结束位置" align="center" prop="endPosition" />
+    <el-table-column label="缺陷长度" align="center" prop="length" />
+    <el-table-column label="缺陷代码" align="center" prop="defectCode">
+      <template slot-scope="scope">
+        <dict-tag :options="dict.type.coil_abnormal_code" :value="scope.row.defectCode" />
+      </template>
+    </el-table-column>
+    <el-table-column label="是否为主缺陷" prop="mainMark">
+      <template slot-scope="scope">
+        <el-tag v-if="scope.row.mainMark" type="success">是</el-tag>
+        <el-tag v-else type="danger">否</el-tag>
+      </template>
+    </el-table-column>
+    <el-table-column label="程度" align="center" prop="degree">
+      <template slot-scope="scope">
+        <dict-tag :options="dict.type.coil_abnormal_degree" :value="scope.row.degree" />
+      </template>
+    </el-table-column>
+
+    <el-table-column label="操作" align="center" class-name="small-padding fixed-width" v-if="editable">
+      <template slot-scope="scope">
+        <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)">修改</el-button>
+        <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)">删除</el-button>
+      </template>
+    </el-table-column>
+  </el-table>
+</template>
+
+<script>
+import CoilNo from '@/components/KLPService/Renderer/CoilNo'
+
+export default {
+  props: {
+    list: {
+      type: Array,
+      default: () => []
+    },
+    editable: {
+      type: Boolean,
+      default: false
+    },
+    showCoil: {
+      type: Boolean,
+      default: false
+    }
+  },
+  components: {
+    CoilNo
+  },
+  dicts: ['coil_abnormal_position', 'coil_abnormal_code', 'coil_abnormal_degree'],
+  methods: {
+    handleDelete(row) {
+      if (this.editable) {
+        this.$emit('delete', row);
+      }
+    },
+    handleUpdate(row) {
+      if (this.editable) {
+        this.$emit('update', row);
+      }
+    }
+  }
+}
+</script>