From 7930991eb86155c10f850060040132a10b4cdeb6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=A0=82=E7=B3=96?= <qq2178503051@163.com>
Date: Wed, 8 Apr 2026 17:40:30 +0800
Subject: [PATCH] =?UTF-8?q?feat(=E5=91=98=E5=B7=A5=E4=BF=A1=E6=81=AF):=20?=
 =?UTF-8?q?=E6=96=B0=E5=A2=9E=E6=9F=A5=E7=9C=8B=E5=8A=9F=E8=83=BD=E5=B9=B6?=
 =?UTF-8?q?=E4=BC=98=E5=8C=96=E9=99=84=E4=BB=B6=E5=B1=95=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

refactor(异常管理): 重构异常记录表格布局和保存逻辑

feat(库存管理): 新增CRM卷材库存视图和分组筛选功能
---
 klp-ui/src/views/crm/coil/index.vue           | 686 ++++++++++++++++++
 .../wms/coil/components/ExceptionManager.vue  | 261 ++++---
 klp-ui/src/views/wms/coil/views/typeError.vue |  11 +-
 .../src/views/wms/hrm/employeeInfo/entry.vue  |  48 +-
 .../src/views/wms/hrm/employeeInfo/formal.vue |   6 +-
 .../src/views/wms/hrm/employeeInfo/leave.vue  |  48 +-
 .../views/wms/hrm/employeeInfo/transfer.vue   |  59 ++
 7 files changed, 1024 insertions(+), 95 deletions(-)
 create mode 100644 klp-ui/src/views/crm/coil/index.vue

diff --git a/klp-ui/src/views/crm/coil/index.vue b/klp-ui/src/views/crm/coil/index.vue
new file mode 100644
index 00000000..0f9bd997
--- /dev/null
+++ b/klp-ui/src/views/crm/coil/index.vue
@@ -0,0 +1,686 @@
+<template>
+  <div class="app-container stock-layout">
+    <!-- 左侧树结构 -->
+    <div class="stock-tree-col">
+      <el-card shadow="never" class="stock-tree-card">
+        <div slot="header" class="stock-tree-title">
+          <div style="display: flex; align-items: center; justify-content: space-between;">
+            <span>
+              仓库结构
+            </span>
+
+            <el-select v-model="warehouseType" placeholder="请选择仓库类别" style="width: 50%;">
+              <el-option label="真实库区" value="real" />
+              <el-option label="逻辑库位" value="virtual" />
+            </el-select>
+          </div>
+        </div>
+        <WarehouseTree @node-click="handleTreeSelect" :warehouseType="warehouseType" :showEmpty="true" />
+      </el-card>
+    </div>
+    <!-- 右侧内容 -->
+    <div class="stock-main-col">
+      <!-- <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
+        <MaterialSelect :itemType.sync="queryParams.itemType" :itemId.sync="queryParams.itemId" @change="getList" />
+        <el-form-item>
+          <el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button>
+          <el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
+          <el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport">导出</el-button>
+        </el-form-item>
+      </el-form> -->
+      <!-- 上方增加分组信息会影响下面的表格显示, 可以添加多级分组，例如按照itemType，按照itemName, 按照材质material, 按照规格specification, 按照厂家manufacturer -->
+      <div class="group-controls">
+        <el-form :model="groupForm" size="small" :inline="true">
+          <el-form-item label="分组维度">
+            <el-select v-model="groupForm.groupingCriteria" multiple placeholder="请选择分组维度" style="width: 300px;">
+              <el-option label="物料类型" value="itemType" />
+              <el-option label="物料名称" value="itemName" />
+              <el-option label="材质" value="material" />
+              <el-option label="规格" value="specification" />
+              <el-option label="宽度" value="width" />
+              <el-option label="厚度" value="thickness" />
+              <el-option label="厂家" value="manufacturer" />
+              <el-option label="镀层质量" value="zincLayer" />
+            </el-select>
+          </el-form-item>
+          <el-form-item>
+            <el-button type="primary" @click="getList">应用分组</el-button>
+            <el-button @click="resetGroup">重置分组</el-button>
+          </el-form-item>
+        </el-form>
+      </div>
+
+      <vxe-toolbar :refresh="{query: reload}" export custom>
+        <template v-slot:buttons>
+          <!-- 统计数据；共{{ total }}卷 -->
+          <span style="margin-left: 10px; font-weight: bold;">统计数据：共{{ total }}卷，总重量{{ totalWeight.toFixed(2) }}吨</span>
+          
+          <!-- <vxe-input v-model.lazy="filterName" type="search" placeholder="全表搜索" style="width: 200px; margin-left: 10px;"></vxe-input> -->
+          <!-- <vxe-button @click="$refs.xTree.setAllTreeExpand(true)">展开所有</vxe-button>
+          <vxe-button @click="$refs.xTree.clearTreeExpand()">关闭所有</vxe-button> -->
+          <vxe-button @click="clearFilterEvent">清除所有筛选</vxe-button>
+        </template>
+      </vxe-toolbar>
+
+      <div style="height: calc(100vh - 260px);">
+        <vxe-table ref="xTree" :loading="loading" :data="list" size="mini" :tree-config="effectiveTreeConfig"
+          max-height="100%" @row-click="handleTableRowClick" :export-config="{}" :scroll-y="{ enabled: true }">
+          <vxe-table-column field="itemType" title="物料类型" align="center" :formatter="formatterItemType" tree-node sortable :filters="[{label: '产品', value: 'product'}, {label: '原料', value: 'raw_material'}]" :filter-method="filterItemTypeMethod">
+            <template v-slot="{ row }">
+              <span v-if="row.itemType">{{ formatterItemType(row.itemType) }}</span>
+              <span v-else>{{ row.itemType || row.itemName || row.material || row.specification || row.manufacturer || row.zincLayer || 
+                row.width ? ('宽度：' + row.width) : undefined || 
+                row.thickness ? ('厚度：' + row.thickness) : undefined
+                }}</span>
+            </template>
+          </vxe-table-column>
+          <vxe-table-column sortable field="itemName" title="物料名称" align="center" :filters="itemNameOptions" :filter-method="filterItemNameMethod">
+          </vxe-table-column>
+          <vxe-table-column sortable field="material" title="材质" align="center" :filters="materialOptions" :filter-method="filterMaterialMethod">
+          </vxe-table-column>
+          <vxe-table-column sortable field="specification" title="规格" align="center" :filters="specificationOptions" :filter-method="filterSpecificationMethod">  
+          </vxe-table-column>
+          <vxe-table-column sortable field="thickness" title="厚度" align="center" :filters="thicknessOptions" :filter-method="filterThicknessMethod">
+          </vxe-table-column>
+          <vxe-table-column sortable field="width" title="宽度" align="center" :filters="widthOptions" :filter-method="filterWidthMethod">
+          </vxe-table-column>
+          <vxe-table-column sortable field="manufacturer" title="厂家" align="center" :filters="manufacturerOptions" :filter-method="filterManufacturerMethod">
+          </vxe-table-column>
+          <vxe-table-column sortable field="zincLayer" title="镀层质量" align="center" :filters="zincLayerOptions" :filter-method="filterZincLayerMethod">  
+          </vxe-table-column>
+          <!-- <vxe-table-column sortable field="totalQuantity" title="库存数量" align="center">
+          </vxe-table-column> -->
+          <vxe-table-column sortable field="netWeight" title="重量" align="center">
+          </vxe-table-column>
+           <vxe-table-column sortable field="quantity" title="数量" align="center">
+          </vxe-table-column>
+          <!-- <vxe-table-column field="remark" title="备注" align="center" /> -->
+
+        </vxe-table>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { listMaterialCoil } from "@/api/wms/coil";
+import WarehouseSelect from "@/components/WarehouseSelect";
+import RawMaterialInfo from "@/components/KLPService/Renderer/RawMaterialInfo";
+import ProductInfo from "@/components/KLPService/Renderer/ProductInfo";
+import WarehouseTree from "@/components/KLPService/WarehouseTree/index.vue";
+import MaterialSelect from "@/components/KLPService/MaterialSelect";
+
+export default {
+  name: "Stock",
+  dicts: ['stock_item_type'],
+  components: {
+    WarehouseSelect,
+    RawMaterialInfo,
+    ProductInfo,
+    WarehouseTree,
+    MaterialSelect,
+  },
+  data() {
+    return {
+      // 库存分析对话框显示状态
+      stockBoxVisible: false,
+      // 按钮loading
+      buttonLoading: false,
+      // 遮罩层
+      loading: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      totalQuantity: 0,
+      totalWeight: 0,
+      // 宽度和厚度汇总
+      widths: [],
+      thicknesses: [],
+      // 库存：原材料/产品与库区/库位的存放关系表格数据
+      stockList: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 99,
+        status: 0,
+        dateType: 1,
+        warehouseId: undefined,
+      },
+      warehouseType: 'virtual',
+      // 表单参数
+      form: {},
+
+      // 分组相关数据
+      groupForm: {
+        groupingCriteria: []
+      },
+      // vxe-table树配置
+      tableTreeConfig: {
+        children: 'children',
+        accordion: true,
+        expandAll: false,
+        line: true,
+      },
+      // 搜索关键字
+      filterName: '',
+      // 筛选选项数组
+      itemNameOptions: [],
+      materialOptions: [],
+      specificationOptions: [],
+      manufacturerOptions: [],
+      zincLayerOptions: [],
+      thicknessOptions: [],
+      widthOptions: []
+    };
+  },
+  computed: {
+    list() {
+      const filterName = this.filterName.trim().toLowerCase();
+      if (!filterName) {
+        return this.stockList;
+      }
+      
+      const searchProps = ['itemType', 'itemName', 'material', 'specification', 'manufacturer', 'totalQuantity', 'remark'];
+      
+      const filterData = (data) => {
+        return data.filter(item => {
+          if (item.children) {
+            item.children = filterData(item.children);
+            return item.children.length > 0 || searchProps.some(key => {
+              return String(item[key] || '').toLowerCase().includes(filterName);
+            });
+          }
+          return searchProps.some(key => {
+            return String(item[key] || '').toLowerCase().includes(filterName);
+          });
+        });
+      };
+      
+      return filterData([...this.stockList]);
+    },
+    // 控制是否启用树形数据配置
+    effectiveTreeConfig() {
+      // 当没有分组条件时，不启用树形数据
+      return this.groupForm.groupingCriteria && this.groupForm.groupingCriteria.length > 0 ? this.tableTreeConfig : undefined;
+    }
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+    /** 查询库存列表 */
+    getList() {
+      this.loading = true;
+      if (this.warehouseType === 'real') {
+        listMaterialCoil(this.queryParams).then(res => {
+          let list = res.rows
+          // 处理数据，添加宽度、厚度和数量字段
+          list = list.map(item => {
+            const parts = item.specification ? item.specification.split('*') : [];
+            return {
+              ...item,
+              thickness: parts[0] || '',
+              width: parts[1] || '',
+              quantity: 1 // 数量字段设为1
+            };
+          });
+          this.stockList = this.groupData(list, this.groupForm.groupingCriteria);
+          this.extractOptions(list);
+          // 计算总数量和总重量
+          this.calculateTotals(list);
+          this.loading = false;
+        })
+      } else {
+        listMaterialCoil(this.queryParams).then(res => {
+          let list = res.rows
+          // 处理数据，添加宽度、厚度和数量字段
+          list = list.map(item => {
+            const parts = item.specification ? item.specification.split('*') : [];
+            return {
+              ...item,
+              thickness: parts[0] || '',
+              width: parts[1] || '',
+              quantity: 1 // 数量字段设为1
+            };
+          });
+          this.stockList = this.groupData(list, this.groupForm.groupingCriteria);
+          this.extractOptions(list);
+          // 计算总数量和总重量
+          this.calculateTotals(list);
+          this.loading = false;
+        })
+      }
+    },
+    /** 提取筛选选项值 */
+    extractOptions(data) {
+      // 提取唯一值
+      const itemNames = new Set();
+      const materials = new Set();
+      const specifications = new Set();
+      const manufacturers = new Set();
+      const zincLayers = new Set();
+      const thicknesses = new Set();
+      const widths = new Set();
+      
+      data.forEach(item => {
+        if (item.itemName) itemNames.add(item.itemName);
+        if (item.material) materials.add(item.material);
+        if (item.specification) specifications.add(item.specification);
+        if (item.manufacturer) manufacturers.add(item.manufacturer);
+        if (item.zincLayer) zincLayers.add(item.zincLayer);
+        if (item.thickness) thicknesses.add(item.thickness);
+        if (item.width) widths.add(item.width);
+      });
+      
+      // 转换为数组并排序
+      this.itemNameOptions = Array.from(itemNames).sort();
+      this.materialOptions = Array.from(materials).sort();
+      this.specificationOptions = Array.from(specifications).sort();
+      this.manufacturerOptions = Array.from(manufacturers).sort();
+      this.zincLayerOptions = Array.from(zincLayers).sort();
+      this.thicknessOptions = Array.from(thicknesses).sort();
+      this.widthOptions = Array.from(widths).sort();
+
+      this.updateManufacturerFilterEvent();
+      this.updateZincLayerFilterEvent();
+      this.updateSpecificationFilterEvent();
+      this.updateMaterialFilterEvent();
+      this.updateNameFilterEvent();
+      this.updateThicknessFilterEvent();
+      this.updateWidthFilterEvent();
+
+      console.log(this.itemNameOptions, itemNames, data);
+    },
+    formatterItemType(itemType) {
+      return itemType === 'raw_material' ? '原材料' : '产品';
+    },
+    /** 格式化厚度 */
+    formatterThickness(row) {
+      if (!row.specification) return '';
+      const parts = row.specification.split('*');
+      return parts[0] || '';
+    },
+    /** 格式化宽度 */
+    formatterWidth(row) {
+      if (!row.specification) return '';
+      const parts = row.specification.split('*');
+      return parts[1] || '';
+    },
+    /** 计算总数量和总重量 */
+    calculateTotals(data) {
+      // 计算总数量（求和）
+      this.total = data.length;
+      
+      // 计算总重量（求和并保留两位小数）
+      this.totalWeight = parseFloat(data.reduce((sum, item) => {
+        return sum + (parseFloat(item.netWeight) || 0);
+      }, 0).toFixed(2));
+      
+      // 汇总宽度和厚度（提取唯一值）
+      this.widths = [...new Set(data.map(item => item.width).filter(w => w))].sort();
+      this.thicknesses = [...new Set(data.map(item => item.thickness).filter(t => t))].sort();
+    },
+    // 树节点点击
+    handleTreeSelect(node) {
+      if (this.warehouseType === 'real') {
+        this.queryParams.actualWarehouseId = node.actualWarehouseId;
+        this.queryParams.warehouseId = '';
+      } else {
+        this.queryParams.warehouseId = node.warehouseId;
+        this.queryParams.actualWarehouseId = '';
+      }
+      
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+    /** 导出按钮操作 */
+    handleExport() {
+      this.download('wms/stock/export', {
+        ...this.queryParams
+      }, `stock_${new Date().getTime()}.xlsx`)
+    },
+
+    /** 重置分组 */
+    resetGroup() {
+      this.groupForm.groupingCriteria = [];
+      this.getList();
+    },
+    /** 分组数据处理 */
+    groupData(data, criteria) {
+      if (!criteria || criteria.length === 0) {
+        return data;
+      }
+      
+      const groupBy = (arr, key) => {
+        return arr.reduce((groups, item) => {
+          const value = item[key] || '未知';
+          if (!groups[value]) {
+            groups[value] = [];
+          }
+          groups[value].push(item);
+          return groups;
+        }, {});
+      };
+      
+      const buildTree = (items, level) => {
+        if (level >= criteria.length) {
+          return items;
+        }
+        
+        const currentCriteria = criteria[level];
+        const grouped = groupBy(items, currentCriteria);
+        
+        return Object.keys(grouped).map(key => {
+          const children = buildTree(grouped[key], level + 1);
+          const totalQuantity = children.reduce((sum, child) => {
+            return sum + (parseInt(child.quantity) || 0);
+          }, 0);
+          
+          const totalWeight = parseFloat(children.reduce((sum, child) => {
+            return sum + (parseFloat(child.netWeight) || 0);
+          }, 0).toFixed(2));
+          
+          return {
+            [currentCriteria]: key,
+            quantity: totalQuantity,
+            netWeight: totalWeight,
+            children,
+            hasChildren: children.length > 0
+          };
+        });
+      };
+      
+      return buildTree(data, 0);
+    },
+    /** 物料类型筛选 */
+    filterItemTypeMethod({ cellValue, option }) {
+      return cellValue === option.value;
+    },
+    /** 物料名称筛选 */
+    filterItemNameMethod({ cellValue, option }) {
+      return option.value ? cellValue === option.value : true;
+    },
+    /** 材质筛选 */
+    filterMaterialMethod({ cellValue, option }) {
+      return option.value ? cellValue === option.value : true;
+    },
+    /** 规格筛选 */
+    filterSpecificationMethod({ cellValue, option }) {
+      return option.value ? cellValue === option.value : true;
+    },
+    /** 厂家筛选 */
+    filterManufacturerMethod({ cellValue, option }) {
+      return option.value ? cellValue === option.value : true;
+    },
+    /** 镀层质量筛选 */
+    filterZincLayerMethod({ cellValue, option }) {
+      return option.value ? cellValue === option.value : true;
+    },
+    /** 厚度筛选 */
+    filterThicknessMethod({ cellValue, option }) {
+      return option.value ? cellValue === option.value : true;
+    },
+    /** 宽度筛选 */
+    filterWidthMethod({ cellValue, option }) {
+      return option.value ? cellValue === option.value : true;
+    },
+    /** 库存数量筛选 */
+    filterTotalQuantityMethod({ cellValue, option }) {
+      const value = Number(cellValue || 0);
+      const filterValue = Number(option.value || 0);
+      
+      switch (option.operator || option.value) {
+        case 'gt':
+          return value > filterValue;
+        case 'gte':
+          return value >= filterValue;
+        case 'lt':
+          return value < filterValue;
+        case 'lte':
+          return value <= filterValue;
+        case 'eq':
+          return value === filterValue;
+        default:
+          return true;
+      }
+    },
+    /** 更改物料名称筛选条件 */
+    updateNameFilterEvent() {
+      const xTable = this.$refs.xTree;
+      const column = xTable.getColumnByField('itemName');
+      // 使用从数据中汇总的实际选项
+      const options = this.itemNameOptions.map(item => ({
+        label: item,
+        value: item
+      }));
+      // 修改筛选列表
+      xTable.setFilter(column, options);
+      // 修改条件之后，需要手动调用 updateData 处理表格数据
+      xTable.updateData();
+    },
+    /** 更改材质筛选条件 */
+    updateMaterialFilterEvent() {
+      const xTable = this.$refs.xTree;
+      const column = xTable.getColumnByField('material');
+      // 使用从数据中汇总的实际选项
+      const options = this.materialOptions.map(item => ({
+        label: item,
+        value: item
+      }));
+      // 修改筛选列表
+      xTable.setFilter(column, options);
+      // 修改条件之后，需要手动调用 updateData 处理表格数据
+      xTable.updateData();
+    },
+    /** 更改规格筛选条件 */
+    updateSpecificationFilterEvent() {
+      const xTable = this.$refs.xTree;
+      const column = xTable.getColumnByField('specification');
+      // 使用从数据中汇总的实际选项
+      const options = this.specificationOptions.map(item => ({
+        label: item,
+        value: item
+      }));
+      // 修改筛选列表
+      xTable.setFilter(column, options);
+      // 修改条件之后，需要手动调用 updateData 处理表格数据
+      xTable.updateData();
+    },
+    /** 更改厂家筛选条件 */
+    updateManufacturerFilterEvent() {
+      const xTable = this.$refs.xTree;
+      const column = xTable.getColumnByField('manufacturer');
+      // 使用从数据中汇总的实际选项
+      const options = this.manufacturerOptions.map(item => ({
+        label: item,
+        value: item
+      }));
+      // 修改筛选列表
+      xTable.setFilter(column, options);
+      // 修改条件之后，需要手动调用 updateData 处理表格数据
+      xTable.updateData();
+    },
+    /** 更改镀层质量筛选条件 */
+    updateZincLayerFilterEvent() {
+      const xTable = this.$refs.xTree;
+      const column = xTable.getColumnByField('zincLayer');
+      // 使用从数据中汇总的实际选项
+      const options = this.zincLayerOptions.map(item => ({
+        label: item,
+        value: item
+      }));
+      // 修改筛选列表
+      xTable.setFilter(column, options);
+      // 修改条件之后，需要手动调用 updateData 处理表格数据
+      xTable.updateData();
+    },
+    /** 更改厚度筛选条件 */
+    updateThicknessFilterEvent() {
+      const xTable = this.$refs.xTree;
+      const column = xTable.getColumnByField('thickness');
+      // 使用从数据中汇总的实际选项
+      const options = this.thicknessOptions.map(item => ({
+        label: item,
+        value: item
+      }));
+      // 修改筛选列表
+      xTable.setFilter(column, options);
+      // 修改条件之后，需要手动调用 updateData 处理表格数据
+      xTable.updateData();
+    },
+    /** 更改宽度筛选条件 */
+    updateWidthFilterEvent() {
+      const xTable = this.$refs.xTree;
+      const column = xTable.getColumnByField('width');
+      // 使用从数据中汇总的实际选项
+      const options = this.widthOptions.map(item => ({
+        label: item,
+        value: item
+      }));
+      // 修改筛选列表
+      xTable.setFilter(column, options);
+      // 修改条件之后，需要手动调用 updateData 处理表格数据
+      xTable.updateData();
+    },
+    /** 清除筛选条件 */
+    clearFilterEvent() {
+      const xTable = this.$refs.xTree;
+      xTable.clearFilter();
+      xTable.updateData();
+    },
+    /** 刷新数据 */
+    reload() {
+      this.getList();
+    }
+  }
+};
+</script>
+
+<style scoped>
+.stock-layout {
+  height: 100%;
+  display: flex;
+  flex-direction: row;
+}
+
+.stock-tree-col {
+  width: 260px;
+  max-width: 300px;
+  background: #fff;
+  border-right: 1px solid #f0f0f0;
+  height: 100%;
+  padding-right: 0;
+  box-sizing: border-box;
+  display: flex;
+  flex-direction: column;
+}
+
+.stock-tree-card {
+  height: 100%;
+  border: none;
+  box-shadow: none;
+}
+
+.stock-tree-title {
+  font-weight: bold;
+  font-size: 16px;
+  padding: 8px 0;
+}
+
+.stock-tree {
+  min-height: 500px;
+  max-height: 80vh;
+  overflow-y: auto;
+}
+
+.stock-main-col {
+  flex: 1;
+  padding-left: 24px;
+  min-width: 0;
+  display: flex;
+  flex-direction: column;
+}
+
+.group-controls {
+  margin-bottom: 16px;
+  padding: 12px;
+  background-color: #f9f9f9;
+  border-radius: 4px;
+  border: 1px solid #eaeaea;
+}
+
+.group-controls .el-form {
+  margin-bottom: 0;
+}
+
+/* 分组行样式 */
+.el-table__row.group-row {
+  background-color: #f5f7fa;
+}
+
+/* 叶子节点样式 */
+.el-table__row.leaf-row {
+  background-color: #ffffff;
+}
+
+/* 筛选输入框样式 */
+.my-input {
+  width: 100%;
+  padding: 4px 8px;
+  border: 1px solid #dcdfe6;
+  border-radius: 4px;
+  font-size: 12px;
+  outline: none;
+  transition: border-color 0.3s;
+}
+
+.my-input:focus {
+  border-color: #409eff;
+}
+
+/* 筛选下拉选择框样式 */
+.my-select {
+  width: 100%;
+  padding: 4px 8px;
+  border: 1px solid #dcdfe6;
+  border-radius: 4px;
+  font-size: 12px;
+  outline: none;
+  transition: border-color 0.3s;
+  background-color: #fff;
+}
+
+.my-select:focus {
+  border-color: #409eff;
+}
+
+/* 库存数量筛选样式 */
+.quantity-filter {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+}
+
+.quantity-filter .my-select {
+  width: 100%;
+}
+
+.quantity-filter .my-input {
+  width: 100%;
+}
+</style>
\ No newline at end of file
diff --git a/klp-ui/src/views/wms/coil/components/ExceptionManager.vue b/klp-ui/src/views/wms/coil/components/ExceptionManager.vue
index fb935c46..3a611be7 100644
--- a/klp-ui/src/views/wms/coil/components/ExceptionManager.vue
+++ b/klp-ui/src/views/wms/coil/components/ExceptionManager.vue
@@ -55,28 +55,37 @@
     <div class="exception-section">
       <div class="section-header">
         <h4 class="section-title">异常记录</h4>
-        <el-button type="default" icon="el-icon-refresh" plain size="mini" @click="refreshAbnormalList"
-          :loading="abnormalLoading">
-          刷新
-        </el-button>
+        <div>
+          <el-button type="primary" size="mini" @click="handleSave">保存</el-button>
+          <el-button type="default" icon="el-icon-refresh" plain size="mini" @click="refreshAbnormalList"
+            :loading="abnormalLoading">
+            刷新
+          </el-button>
+        </div>
       </div>
-      <el-table :data="abnormalList" style="width: 100%" border>
-        <el-table-column label="开始位置" prop="startPosition" width="80">
+      <el-table :data="abnormalList" style="width: 100%" border stripe>
+        <el-table-column label="序号" type="index" width="50" />
+        <el-table-column label="缺陷描述" prop="remark">
+          <template slot-scope="scope">
+            <el-input v-model="scope.row.remark" placeholder="请输入缺陷描述" />
+          </template>
+        </el-table-column>
+        <el-table-column label="开始位置" prop="startPosition" width="100">
           <template slot-scope="scope">
             <el-input :controls="false" v-model="scope.row.startPosition" placeholder="请输入开始位置" />
           </template>
         </el-table-column>
-        <el-table-column label="结束位置" prop="endPosition" width="80">
+        <el-table-column label="结束位置" prop="endPosition" width="100">
           <template slot-scope="scope">
             <el-input :controls="false" v-model="scope.row.endPosition" placeholder="请输入结束位置" />
           </template>
         </el-table-column>
-        <el-table-column label="长度" prop="length" width="80">
+        <el-table-column label="长度" prop="length" width="100">
           <template slot-scope="scope">
             {{ scope.row.endPosition - scope.row.startPosition }}
           </template>
         </el-table-column>
-        <el-table-column label="上下版面" prop="plateSurface">
+        <el-table-column label="上下版面" prop="plateSurface" width="180">
           <template slot-scope="scope">
             <muti-select v-model="scope.row.plateSurface" :options="[
               { label: '上板面', value: '上' },
@@ -88,7 +97,7 @@
             </el-checkbox-group> -->
           </template>
         </el-table-column>
-        <el-table-column label="断面位置" prop="position">
+        <el-table-column label="断面位置" prop="position" width="240">
           <template slot-scope="scope">
             <muti-select v-model="scope.row.position" :options="dict.type.coil_abnormal_position" type="checkbox">
             </muti-select>
@@ -97,41 +106,53 @@
             </el-checkbox-group> -->
           </template>
         </el-table-column>
+
+        <el-table-column label="缺陷代码" prop="defectCode">
+          <template slot-scope="scope">
+            <div class="radio-single">
+              <el-radio-group v-model="scope.row.defectCode">
+                <el-radio v-for="dict in dict.type.coil_abnormal_code" :key="dict.value" :label="dict.value" @click.native="handleRadioClick(scope.row.defectCode, dict.value, 'defectCode', scope.row)">
+                  {{ dict.label }}
+                </el-radio>
+              </el-radio-group>
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column label="程度" prop="degree">
+          <template slot-scope="scope">
+            <div class="radio-single">
+              <el-radio-group v-model="scope.row.degree">
+                <el-radio v-for="dict in dict.type.coil_abnormal_degree" :key="dict.value" :label="dict.value" @click.native="handleRadioClick(scope.row.degree, dict.value, 'degree', scope.row)">
+                  {{ dict.label }}
+                </el-radio>
+              </el-radio-group>
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column label="操作" width="80">
+          <template slot-scope="scope">
+            <el-button v-if="scope.row.abnormalId" type="text" size="mini" @click="handleDelete(scope.row)" style="color: #f56c6c;">
+              删除
+            </el-button>
+            <el-button v-else type="text" size="mini" @click="clearRowData(scope.row)">
+              清空
+            </el-button>
+          </template>
+        </el-table-column>
         <el-table-column label="主缺陷" prop="mainMark" width="60">
           <template slot-scope="scope">
             <el-checkbox v-model="scope.row.mainMark" :true-label="1" :false-label="0"></el-checkbox>
           </template>
         </el-table-column>
-        <el-table-column label="缺陷代码" prop="defectCode">
-          <template slot-scope="scope">
-            <el-select v-model="scope.row.defectCode" placeholder="请选择缺陷代码">
-              <el-option v-for="dict in dict.type.coil_abnormal_code" :key="dict.value" :label="dict.label"
-                :value="dict.value"></el-option>
-            </el-select>
-          </template>
-        </el-table-column>
-        <el-table-column label="程度" prop="degree">
-          <template slot-scope="scope">
-            <el-select v-model="scope.row.degree" placeholder="请选择程度">
-              <el-option v-for="dict in dict.type.coil_abnormal_degree" :key="dict.value" :label="dict.label"
-                :value="dict.value"></el-option>
-            </el-select>
-          </template>
-        </el-table-column>
-        <el-table-column label="产线" prop="productionLine">
+        <!-- <el-table-column label="产线" prop="productionLine">
           <template slot-scope="scope">
             <el-select v-model="scope.row.productionLine" placeholder="请选择产线">
               <el-option v-for="dict in dict.type.sys_lines" :key="dict.value" :label="dict.label"
                 :value="dict.value"></el-option>
             </el-select>
           </template>
-        </el-table-column>
-        <el-table-column label="备注" prop="remark">
-          <template slot-scope="scope">
-            <el-input v-model="scope.row.remark" placeholder="请输入备注" />
-          </template>
-        </el-table-column>
-        <el-table-column label="操作" width="180">
+        </el-table-column> -->
+        <!-- <el-table-column label="操作" width="180">
           <template slot-scope="scope">
             <el-button v-if="!scope.row.abnormalId" type="primary" plain size="mini" :loading="buttonLoading"
               @click="handleSave(scope.row)">新增</el-button>
@@ -142,7 +163,7 @@
                 @click="handleDelete(scope.row)">删除</el-button>
             </template>
           </template>
-        </el-table-column>
+        </el-table-column> -->
       </el-table>
     </div>
 
@@ -285,63 +306,77 @@ export default {
       }
       return emptyRows
     },
-    handleSave(row) {
-      // 验证数据
-      if (!row.startPosition || !row.endPosition) {
-        this.$message.error('请填写开始位置和结束位置')
-        return
+    handleSave() {
+      // 过滤出非空行
+      const nonEmptyRows = this.abnormalList.filter(row => {
+        return row.startPosition || row.endPosition || row.position || row.plateSurface || row.defectCode || row.degree || row.remark
+      })
+
+      // 批量校验
+      for (let i = 0; i < nonEmptyRows.length; i++) {
+        const row = nonEmptyRows[i]
+        const rowIndex = this.abnormalList.indexOf(row) + 1 // 行号从1开始
+
+        if (!row.startPosition || !row.endPosition) {
+          this.$message.error(`第${rowIndex}行：请填写开始位置和结束位置`)
+          return
+        }
+        if (row.startPosition > row.endPosition) {
+          this.$message.error(`第${rowIndex}行：开始位置必须小于结束位置`)
+          return
+        }
+        if (!row.position || row.position.length === 0) {
+          this.$message.error(`第${rowIndex}行：请选择断面位置`)
+          return
+        }
+        if (!row.plateSurface || row.plateSurface.length === 0) {
+          this.$message.error(`第${rowIndex}行：请选择上下板面`)
+          return
+        }
+        if (!row.defectCode) {
+          this.$message.error(`第${rowIndex}行：请选择缺陷代码`)
+          return
+        }
+        if (!row.degree) {
+          this.$message.error(`第${rowIndex}行：请选择程度`)
+          return
+        }
       }
-      if (row.startPosition > row.endPosition) {
-        this.$message.error('开始位置必须小于结束位置')
-        return
-      }
-      if (!row.position || row.position.length === 0) {
-        this.$message.error('请选择断面位置')
-        return
-      }
-      if (!row.plateSurface || row.plateSurface.length === 0) {
-        this.$message.error('请选择上下板面')
-        return
-      }
-      if (!row.defectCode) {
-        this.$message.error('请选择缺陷代码')
-        return
-      }
-      if (!row.degree) {
-        this.$message.error('请选择程度')
+
+      if (nonEmptyRows.length === 0) {
+        this.$message.info('没有需要保存的数据')
         return
       }
 
       this.buttonLoading = true
-      const saveData = {
-        ...row,
-        // length: row.endPosition - row.startPosition,
-        coilId: this.coilId
-      }
 
-      if (row.abnormalId) {
-        // 调用修改接口
-        updateCoilAbnormal(saveData).then(response => {
-          this.$message.success('异常记录更新成功')
-        }).catch(error => {
-          console.error('异常记录更新失败:', error)
-          this.$message.error('异常记录更新失败: ' + (error.message || error))
-        }).finally(() => {
-          this.buttonLoading = false
-        })
-      } else {
-        // 调用新增接口
-        addCoilAbnormal(saveData).then(response => {
-          this.$message.success('异常记录添加成功')
-          // 重新加载列表以获取新的 abnormalId
-          this.loadAbnormalList()
-        }).catch(error => {
-          console.error('异常记录添加失败:', error)
-          this.$message.error('异常记录添加失败: ' + (error.message || error))
-        }).finally(() => {
-          this.buttonLoading = false
-        })
-      }
+      // 批量请求
+      const requests = nonEmptyRows.map(row => {
+        const saveData = {
+          ...row,
+          coilId: this.coilId
+        }
+
+        if (row.abnormalId) {
+          // 更新操作
+          return updateCoilAbnormal(saveData)
+        } else {
+          // 新增操作
+          return addCoilAbnormal(saveData)
+        }
+      })
+
+      // 执行所有请求
+      Promise.all(requests).then(responses => {
+        this.$message.success('批量保存成功')
+        // 刷新列表
+        this.loadAbnormalList()
+      }).catch(error => {
+        console.error('批量保存失败:', error)
+        this.$message.error('批量保存失败: ' + (error.message || error))
+      }).finally(() => {
+        this.buttonLoading = false
+      })
     },
     handleDelete(row) {
       if (!row.abnormalId) {
@@ -394,6 +429,45 @@ export default {
       }).finally(() => {
         this.coilInfoLoading = false
       })
+    },
+    handleSingleCheckboxChange(val, value, field, row) {
+      if (val) {
+        // 选中状态，设置值
+        row[field] = value
+      } else {
+        // 取消选中状态，清空值
+        if (row[field] === value) {
+          row[field] = null
+        }
+      }
+    },
+    handleSingleCheckboxClick(value, field, row) {
+      // 实现排他单选：如果点击的是当前选中的值，则取消选中；否则选中新值
+      if (row[field] === value) {
+        row[field] = null
+      } else {
+        row[field] = value
+      }
+    },
+    handleRadioClick(currentValue, value, field, row) {
+      // 实现 radio 的取消选择功能：如果点击的是当前选中的值，则取消选中
+      if (currentValue === value) {
+        // 使用 $nextTick 确保在 radio 组件更新后再清空值
+        this.$nextTick(() => {
+          row[field] = null
+        })
+      }
+    },
+    clearRowData(row) {
+      // 清空一行的所有数据
+      row.remark = null
+      row.startPosition = 0
+      row.endPosition = 0
+      row.position = ''
+      row.plateSurface = ''
+      row.mainMark = 0
+      row.defectCode = null
+      row.degree = null
     }
   }
 }
@@ -458,4 +532,19 @@ export default {
   margin-right: -16px;
   margin-bottom: -16px;
 }
+
+.radio-single {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 10px;
+  align-items: center;
+}
+
+.radio-single .el-radio {
+  margin-right: 10px;
+}
+
+.radio-single .el-button {
+  margin-left: 10px;
+}
 </style>
\ No newline at end of file
diff --git a/klp-ui/src/views/wms/coil/views/typeError.vue b/klp-ui/src/views/wms/coil/views/typeError.vue
index ccd098aa..c95c2153 100644
--- a/klp-ui/src/views/wms/coil/views/typeError.vue
+++ b/klp-ui/src/views/wms/coil/views/typeError.vue
@@ -23,17 +23,20 @@
           <current-coil-no :current-coil-no="scope.row.currentCoilNo"></current-coil-no>
         </template>
       </el-table-column>
-      <el-table-column label="逻辑库位" align="center" prop="warehouseName" />
-      <el-table-column label="实际库区" align="center" prop="actualWarehouseName" />
+
+      <!-- <el-table-column label="逻辑库位" align="center" prop="warehouseName" />
+      <el-table-column label="实际库区" align="center" prop="actualWarehouseName" /> -->
       <el-table-column label="产品类型" align="center" width="180">
         <template slot-scope="scope">
           <ProductInfo v-if="scope.row.itemType == 'product'" :product="scope.row" />
           <RawMaterialInfo v-else-if="scope.row.itemType === 'raw_material'" :material="scope.row" />
         </template>
       </el-table-column>
-      <el-table-column label="异常数量" align="center" prop="abnormalCount"></el-table-column>
+      <!-- <el-table-column label="异常数量" align="center" prop="abnormalCount"></el-table-column> -->
+      <el-table-column label="净重" align="center" prop="netWeight" />
+
       <el-table-column label="更新时间" align="center" prop="updateTime" />
-      <el-table-column label="更新人" align="center" prop="updateByName" />
+      <el-table-column label="更新人" align="center" prop="updateBy" />
       <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
         <template slot-scope="scope">
           <el-button size="mini" type="text" icon="el-icon-edit" @click="handleCheck(scope.row)">修正</el-button>
diff --git a/klp-ui/src/views/wms/hrm/employeeInfo/entry.vue b/klp-ui/src/views/wms/hrm/employeeInfo/entry.vue
index f35d045b..a1210bd2 100644
--- a/klp-ui/src/views/wms/hrm/employeeInfo/entry.vue
+++ b/klp-ui/src/views/wms/hrm/employeeInfo/entry.vue
@@ -67,6 +67,7 @@
       <el-table-column label="备注" align="center" prop="remark" />
       <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
         <template slot-scope="scope">
+          <el-button size="mini" type="text" icon="el-icon-view" @click="handleView(scope.row)">查看</el-button>
           <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>
@@ -244,6 +245,30 @@
         <el-button @click="cancelSupplement">取 消</el-button>
       </div>
     </el-dialog>
+
+    <!-- 查看员工入职记录对话框 -->
+    <el-dialog title="查看员工入职记录" :visible.sync="viewOpen" width="500px" append-to-body>
+      <el-descriptions :column="1" border>
+        <el-descriptions-item label="员工姓名">
+          {{ viewRecord.wmsEmployeeInfo && viewRecord.wmsEmployeeInfo.name }}
+        </el-descriptions-item>
+        <el-descriptions-item label="入职时间">
+          {{ parseTime(viewRecord.changeTime, '{y}-{m}-{d} {h}:{i}:{s}') }}
+        </el-descriptions-item>
+        <el-descriptions-item label="入职原因">
+          {{ viewRecord.changeReason }}
+        </el-descriptions-item>
+        <el-descriptions-item label="负责人">
+          {{ viewRecord.changeHandler }}
+        </el-descriptions-item>
+        <el-descriptions-item label="附件">
+          <file-list :oss-ids="viewRecord.attachment"></file-list>
+        </el-descriptions-item>
+        <el-descriptions-item label="备注">
+          {{ viewRecord.remark }}
+        </el-descriptions-item>
+      </el-descriptions>
+    </el-dialog>
   </div>
 </template>
 
@@ -251,11 +276,13 @@
 import { listEmployeeChange, getEmployeeChange, delEmployeeChange, updateEmployeeChange, addEmployeeChange, employeeEntry } from "@/api/wms/employeeChange";
 import { listDept } from "@/api/wms/dept";
 import EmployeeSelector from "@/components/EmployeeSelector";
+import FileList from "@/components/FileList";
 
 export default {
   name: "EmployeeEntry",
   components: {
-    EmployeeSelector
+    EmployeeSelector,
+    FileList
   },
   data() {
     return {
@@ -317,7 +344,19 @@ export default {
       },
       supplementRules: {
       },
-      supplementAttachment: undefined
+      supplementAttachment: undefined,
+      // 查看记录对话框相关
+      viewOpen: false,
+      viewRecord: {
+        changeId: undefined,
+        infoId: undefined,
+        changeType: undefined,
+        changeTime: undefined,
+        changeReason: undefined,
+        changeHandler: undefined,
+        attachment: undefined,
+        remark: undefined
+      }
     };
   },
   dicts: ['hrm_employee_education'],
@@ -522,6 +561,11 @@ export default {
       this.download('system/employeeChange/export', {
         ...this.queryParams
       }, `employeeChange_${new Date().getTime()}.xlsx`)
+    },
+    /** 查看按钮操作 */
+    handleView(row) {
+      this.viewRecord = row;
+      this.viewOpen = true;
     }
   }
 };
diff --git a/klp-ui/src/views/wms/hrm/employeeInfo/formal.vue b/klp-ui/src/views/wms/hrm/employeeInfo/formal.vue
index 498ba5e1..53847e71 100644
--- a/klp-ui/src/views/wms/hrm/employeeInfo/formal.vue
+++ b/klp-ui/src/views/wms/hrm/employeeInfo/formal.vue
@@ -296,7 +296,7 @@
           {{ regularRecord.changeHandler }}
         </el-descriptions-item>
         <el-descriptions-item label="附件">
-          <file-upload v-model="regularRecord.attachment"></file-upload>
+          <file-list :oss-ids="regularRecord.attachment"></file-list>
         </el-descriptions-item>
         <el-descriptions-item label="备注">
           {{ regularRecord.remark }}
@@ -310,9 +310,13 @@
 import { listEmployeeInfo, getEmployeeInfo, delEmployeeInfo, updateEmployeeInfo } from "@/api/wms/employeeInfo";
 import { listDept } from "@/api/wms/dept";
 import { employeeEntry, employeeRegular, listEmployeeChange } from '@/api/wms/employeeChange'
+import FileList from "@/components/FileList";
 
 export default {
   name: "EmployeeInfo",
+  components: {
+    FileList
+  },
   data() {
     return {
       // 按钮loading
diff --git a/klp-ui/src/views/wms/hrm/employeeInfo/leave.vue b/klp-ui/src/views/wms/hrm/employeeInfo/leave.vue
index eecaf729..edcfd5cb 100644
--- a/klp-ui/src/views/wms/hrm/employeeInfo/leave.vue
+++ b/klp-ui/src/views/wms/hrm/employeeInfo/leave.vue
@@ -64,6 +64,7 @@
       <el-table-column label="备注" align="center" prop="remark" />
       <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
         <template slot-scope="scope">
+          <el-button size="mini" type="text" icon="el-icon-view" @click="handleView(scope.row)">查看</el-button>
           <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>
@@ -102,6 +103,30 @@
         <el-button @click="cancelSupplement">取 消</el-button>
       </div>
     </el-dialog>
+
+    <!-- 查看员工离职记录对话框 -->
+    <el-dialog title="查看员工离职记录" :visible.sync="viewOpen" width="500px" append-to-body>
+      <el-descriptions :column="1" border>
+        <el-descriptions-item label="员工姓名">
+          {{ viewRecord.wmsEmployeeInfo && viewRecord.wmsEmployeeInfo.name }}
+        </el-descriptions-item>
+        <el-descriptions-item label="离职时间">
+          {{ parseTime(viewRecord.changeTime, '{y}-{m}-{d} {h}:{i}:{s}') }}
+        </el-descriptions-item>
+        <el-descriptions-item label="离职原因">
+          {{ viewRecord.changeReason }}
+        </el-descriptions-item>
+        <el-descriptions-item label="负责人">
+          {{ viewRecord.changeHandler }}
+        </el-descriptions-item>
+        <el-descriptions-item label="附件">
+          <file-list :oss-ids="viewRecord.attachment"></file-list>
+        </el-descriptions-item>
+        <el-descriptions-item label="备注">
+          {{ viewRecord.remark }}
+        </el-descriptions-item>
+      </el-descriptions>
+    </el-dialog>
   </div>
 </template>
 
@@ -109,11 +134,13 @@
 import { listEmployeeChange, getEmployeeChange, delEmployeeChange, updateEmployeeChange, addEmployeeChange, employeeEntry, employeeLeave } from "@/api/wms/employeeChange";
 import { listDept } from "@/api/wms/dept";
 import EmployeeSelector from "@/components/EmployeeSelector";
+import FileList from "@/components/FileList";
 
 export default {
   name: "EmployeeLeave",
   components: {
-    EmployeeSelector
+    EmployeeSelector,
+    FileList
   },
   data() {
     return {
@@ -175,7 +202,19 @@ export default {
       },
       supplementRules: {
       },
-      supplementAttachment: undefined
+      supplementAttachment: undefined,
+      // 查看记录对话框相关
+      viewOpen: false,
+      viewRecord: {
+        changeId: undefined,
+        infoId: undefined,
+        changeType: undefined,
+        changeTime: undefined,
+        changeReason: undefined,
+        changeHandler: undefined,
+        attachment: undefined,
+        remark: undefined
+      }
     };
   },
   dicts: ['hrm_employee_education'],
@@ -359,6 +398,11 @@ export default {
       this.download('system/employeeChange/export', {
         ...this.queryParams
       }, `employeeChange_${new Date().getTime()}.xlsx`)
+    },
+    /** 查看按钮操作 */
+    handleView(row) {
+      this.viewRecord = row;
+      this.viewOpen = true;
     }
   }
 };
diff --git a/klp-ui/src/views/wms/hrm/employeeInfo/transfer.vue b/klp-ui/src/views/wms/hrm/employeeInfo/transfer.vue
index 632f4122..96e1f4e6 100644
--- a/klp-ui/src/views/wms/hrm/employeeInfo/transfer.vue
+++ b/klp-ui/src/views/wms/hrm/employeeInfo/transfer.vue
@@ -66,6 +66,7 @@
       <el-table-column label="备注" align="center" prop="remark" />
       <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
         <template slot-scope="scope">
+          <el-button size="mini" type="text" icon="el-icon-view" @click="handleView(scope.row)">查看</el-button>
           <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>
@@ -112,6 +113,42 @@
         <el-button @click="cancel">取 消</el-button>
       </div>
     </el-dialog>
+
+    <!-- 查看员工调岗记录对话框 -->
+    <el-dialog title="查看员工调岗记录" :visible.sync="viewOpen" width="500px" append-to-body>
+      <el-descriptions :column="1" border>
+        <el-descriptions-item label="员工姓名">
+          {{ viewRecord.wmsEmployeeInfo && viewRecord.wmsEmployeeInfo.name }}
+        </el-descriptions-item>
+        <el-descriptions-item label="原部门">
+          {{ viewRecord.oldDept }}
+        </el-descriptions-item>
+        <el-descriptions-item label="原岗位工种">
+          {{ viewRecord.oldJobType }}
+        </el-descriptions-item>
+        <el-descriptions-item label="新部门">
+          {{ viewRecord.newDept }}
+        </el-descriptions-item>
+        <el-descriptions-item label="新岗位工种">
+          {{ viewRecord.newJobType }}
+        </el-descriptions-item>
+        <el-descriptions-item label="转岗生效时间">
+          {{ parseTime(viewRecord.transferTime, '{y}-{m}-{d} {h}:{i}:{s}') }}
+        </el-descriptions-item>
+        <el-descriptions-item label="转岗原因">
+          {{ viewRecord.transferReason }}
+        </el-descriptions-item>
+        <el-descriptions-item label="转岗经办人">
+          {{ viewRecord.transferHandler }}
+        </el-descriptions-item>
+        <el-descriptions-item label="附件">
+          <file-list :oss-ids="viewRecord.attachment"></file-list>
+        </el-descriptions-item>
+        <el-descriptions-item label="备注">
+          {{ viewRecord.remark }}
+        </el-descriptions-item>
+      </el-descriptions>
+    </el-dialog>
   </div>
 </template>
 
@@ -119,11 +156,13 @@
 import { listEmployeeTransfer, getEmployeeTransfer, delEmployeeTransfer, updateEmployeeTransfer, transferEmployee } from "@/api/wms/employeeTransfer";
 import EmployeeSelector from "@/components/EmployeeSelector";
 import { listDept } from "@/api/wms/dept";
+import FileList from "@/components/FileList";
 
 export default {
   name: "EmployeeTransfer",
   components: {
     EmployeeSelector,
+    FileList
   },
   data() {
     return {
@@ -194,6 +233,21 @@ export default {
         transferHandler: [
           { required: true, message: "转岗经办人不能为空", trigger: "blur" }
         ],
+      },
+      // 查看记录对话框相关
+      viewOpen: false,
+      viewRecord: {
+        transferId: undefined,
+        infoId: undefined,
+        oldDept: undefined,
+        oldJobType: undefined,
+        newDept: undefined,
+        newJobType: undefined,
+        transferTime: undefined,
+        transferReason: undefined,
+        transferHandler: undefined,
+        attachment: undefined,
+        remark: undefined
       }
     };
   },
@@ -335,6 +389,11 @@ export default {
       this.download('wms/employeeTransfer/export', {
         ...this.queryParams
       }, `employeeTransfer_${new Date().getTime()}.xlsx`)
+    },
+    /** 查看按钮操作 */
+    handleView(row) {
+      this.viewRecord = row;
+      this.viewOpen = true;
     }
   }
 };