feat(contract): 新增合同预览和列表组件

refactor(QRCode): 优化二维码组件并修复空值检查将QRCode组件从print目录移动到components目录，并添加空值检查防止错误 feat(crm): 在合同模型中添加交货日期字段在CrmContract、CrmContractVo、CrmContractBo及相关Mapper中添加deliveryDate字段 refactor(wms): 统一使用全局QRCode组件路径将多个文件中的QRCode引用路径从相对路径改为@/components/QRCode style(order): 调整订单页面标签顺序调整操作记录和发货配卷标签的顺序 chore: 删除废弃的打印相关文件移除print目录下不再使用的QRCode、CodeRenderer等组件和页面
2026-04-01 10:44:51 +08:00
parent 800cf0c8d1
commit f959f97099
26 changed files with 655 additions and 3244 deletions
--- a/klp-crm/src/main/java/com/klp/crm/domain/CrmContract.java
+++ b/klp-crm/src/main/java/com/klp/crm/domain/CrmContract.java
@@ -46,6 +46,10 @@ public class CrmContract extends BaseEntity {
     * 签订时间
     */
    private Date signTime;
+    /**
+     * 交货日期
+     */
+    private Date deliveryDate;
    /**
     * 签订地点
     */
--- a/klp-crm/src/main/java/com/klp/crm/domain/bo/CrmContractBo.java
+++ b/klp-crm/src/main/java/com/klp/crm/domain/bo/CrmContractBo.java
@@ -1,5 +1,6 @@
 package com.klp.crm.domain.bo;

+import org.springframework.format.annotation.DateTimeFormat;
 import com.klp.common.core.domain.BaseEntity;
 import lombok.Data;
 import lombok.EqualsAndHashCode;
@@ -49,6 +50,13 @@ public class CrmContractBo extends BaseEntity {
     */
    private Date signTime;

+    /**
+     * 交货日期
+     */
+    @JsonFormat(pattern = "yyyy-MM-dd")
+    @DateTimeFormat(pattern = "yyyy-MM-dd")
+    private Date deliveryDate;
+
    /**
     * 签订地点
     */
--- a/klp-crm/src/main/java/com/klp/crm/domain/vo/CrmContractVo.java
+++ b/klp-crm/src/main/java/com/klp/crm/domain/vo/CrmContractVo.java
@@ -57,6 +57,11 @@ public class CrmContractVo {
    @ExcelProperty(value = "签订时间")
    private Date signTime;

+        /**
+     * 交货日期
+     */
+    @ExcelProperty(value = "交货日期")
+    private Date deliveryDate;
    /**
     * 签订地点
     */
--- a/klp-crm/src/main/java/com/klp/crm/service/impl/CrmContractServiceImpl.java
+++ b/klp-crm/src/main/java/com/klp/crm/service/impl/CrmContractServiceImpl.java
@@ -66,6 +66,7 @@ public class CrmContractServiceImpl implements ICrmContractService {
        lqw.eq(StringUtils.isNotBlank(bo.getSupplier()), CrmContract::getSupplier, bo.getSupplier());
        lqw.eq(StringUtils.isNotBlank(bo.getCustomer()), CrmContract::getCustomer, bo.getCustomer());
        lqw.eq(bo.getSignTime() != null, CrmContract::getSignTime, bo.getSignTime());
+        lqw.eq(bo.getDeliveryDate() != null, CrmContract::getDeliveryDate, bo.getDeliveryDate());
        lqw.eq(StringUtils.isNotBlank(bo.getSignLocation()), CrmContract::getSignLocation, bo.getSignLocation());
        lqw.eq(StringUtils.isNotBlank(bo.getProductContent()), CrmContract::getProductContent, bo.getProductContent());
        lqw.eq(StringUtils.isNotBlank(bo.getContractContent()), CrmContract::getContractContent, bo.getContractContent());
--- a/klp-crm/src/main/resources/mapper/CrmContractMapper.xml
+++ b/klp-crm/src/main/resources/mapper/CrmContractMapper.xml
@@ -10,6 +10,7 @@
        <result property="contractNo" column="contract_no"/>
        <result property="supplier" column="supplier"/>
        <result property="customer" column="customer"/>
+        <result property="deliveryDate" column="delivery_date"/>
        <result property="signTime" column="sign_time"/>
        <result property="signLocation" column="sign_location"/>
        <result property="productContent" column="product_content"/>
--- a/klp-ui/src/components/Pagination/index.vue
+++ b/klp-ui/src/components/Pagination/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <div :class="{'hidden':hidden}" class="pagination-container">
+  <div :class="{'hidden':hidden}" class="pagination-container" :style="style">
    <el-pagination
      :background="background"
      :current-page.sync="currentPage"
@@ -60,6 +60,10 @@ export default {
    hidden: {
      type: Boolean,
      default: false
+    },
+    style: {
+      type: String,
+      default: ''
    }
  },
  data() {
--- a/klp-ui/src/components/QRCode/index.vue
+++ b/klp-ui/src/components/QRCode/index.vue
@@ -39,6 +39,7 @@ export default {
    generateQRCode() {
      const el = this.$refs.qrcode;
      const content = this.content;
+      if (!content || !el) return;
      QRCode.toCanvas(el, content, {
        width: this.size,
        height: this.size,
--- a/klp-ui/src/views/crm/components/ContractList.vue
+++ b/klp-ui/src/views/crm/components/ContractList.vue
--- a/klp-ui/src/views/crm/contract/components/ContractList.vue
+++ b/klp-ui/src/views/crm/contract/components/ContractList.vue
@@ -0,0 +1,240 @@
+<template>
+  <div class="contract-list">
+    <!-- 筛选区和按钮操作区合并 -->
+    <div class="filter-section" style="padding: 10px; border-bottom: 1px solid #e4e7ed;">
+      <div style="display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px;">
+        <div style="display: flex; align-items: center; gap: 10px;">
+          <el-input 
+            v-model="queryParams.contractName" 
+            placeholder="请输入合同名称" 
+            clearable
+            @keyup.enter.native="handleQuery"
+            style="width: 200px;"
+          />
+          <el-button 
+            icon="el-icon-search" 
+            size="mini" 
+            @click="toggleMoreFilter"
+            :type="showMoreFilter ? 'primary' : 'default'"
+          >
+            {{ showMoreFilter ? '收起' : '更多' }}
+          </el-button>
+          <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+          <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="$emit('add')">新增</el-button>
+        </div>
+      </div>
+      
+      <!-- 更多筛选条件 -->
+      <div v-show="showMoreFilter" class="more-filter" style="margin-top: 10px; padding-top: 10px; border-top: 1px dashed #e4e7ed;">
+        <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" label-width="80px">
+          <el-form-item label="合同编号" prop="contractNo">
+            <el-input v-model="queryParams.contractNo" placeholder="请输入合同编号" clearable @keyup.enter.native="handleQuery" />
+          </el-form-item>
+          <el-form-item label="供方" prop="supplier">
+            <el-input v-model="queryParams.supplier" placeholder="请输入供方" clearable @keyup.enter.native="handleQuery" />
+          </el-form-item>
+          <el-form-item label="需方" prop="customer">
+            <el-input v-model="queryParams.customer" placeholder="请输入需方" clearable @keyup.enter.native="handleQuery" />
+          </el-form-item>
+          <el-form-item label="签订时间" prop="signTime">
+            <el-date-picker clearable v-model="queryParams.signTime" type="date" value-format="yyyy-MM-dd"
+              placeholder="请选择签订时间">
+            </el-date-picker>
+          </el-form-item>
+          <el-form-item label="交货日期" prop="deliveryDate">
+            <el-date-picker clearable v-model="queryParams.deliveryDate" type="date" value-format="yyyy-MM-dd"
+              placeholder="请选择交货日期">
+            </el-date-picker>
+          </el-form-item>
+          <el-form-item label="签订地点" prop="signLocation">
+            <el-input v-model="queryParams.signLocation" placeholder="请输入签订地点" clearable
+              @keyup.enter.native="handleQuery" />
+          </el-form-item>
+          <el-form-item label="合同状态" prop="contractStatus">
+            <el-select v-model="queryParams.contractStatus" placeholder="请选择合同状态">
+              <el-option label="草稿" value="0" />
+              <el-option label="已生效" value="1" />
+              <el-option label="已作废" value="2" />
+              <el-option label="已完成" value="3" />
+            </el-select>
+          </el-form-item>
+          <el-form-item>
+            <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+          </el-form-item>
+        </el-form>
+      </div>
+    </div>
+
+    <div class="custom-list" v-loading="loading">
+      <div class="list-body">
+        <div 
+          v-for="row in contractList" 
+          :key="row.contractId"
+          class="list-item" 
+          style="padding: 10px; border-bottom: 2px solid #dddddd; cursor: pointer;"
+          :class="{ 'list-item-active': selectedRow === row }"
+          @click="handleRowClick(row)"
+        >
+          <!-- 合同名称和编号 -->
+          <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px;">
+            <div style="font-weight: bold;">{{ row.contractName }}</div>
+            <div style="font-size: 12px; color: #606266;">{{ row.contractNo }}</div>
+          </div>
+          
+          <!-- 供方和需方 -->
+          <div style="font-size: 12px; color: #909399; margin-bottom: 6px;">
+            <span>供方: {{ row.supplier }}</span>
+            <span style="margin-left: 20px;">需方: {{ row.customer }}</span>
+          </div>
+          
+          <!-- 签订时间和交货日期 -->
+          <div style="font-size: 12px; color: #909399; margin-bottom: 6px;">
+            <span>签订时间: {{ parseTime(row.signTime, '{y}-{m}-{d}') }}</span>
+            <span style="margin-left: 20px;">交货日期: {{ parseTime(row.deliveryDate, '{y}-{m}-{d}') }}</span>
+          </div>
+          
+          <!-- 签订地点和状态 -->
+          <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px;">
+            <div style="font-size: 12px; color: #909399;">
+              签订地点: {{ row.signLocation }}
+            </div>
+            <el-tag
+              :type="row.status == 0 ? 'info' : row.status == 1 ? 'success' : row.status == 2 ? 'danger' : 'primary'"
+              size="small">
+              {{ row.status == 0 ? '草稿' : row.status == 1 ? '已生效' : row.status == 2 ? '已作废' : '已完成' }}
+            </el-tag>
+          </div>
+          
+          <!-- 操作按钮独占一行 -->
+          <div style="display: flex; gap: 10px; padding-top: 8px; border-top: 1px dashed #f0f0f0;">
+            <el-button size="mini" type="text" icon="el-icon-download"
+              @click.stop="$emit('exportContract', row)">导出</el-button>
+            <el-button size="mini" type="text" icon="el-icon-edit" @click.stop="$emit('update', row)">修改</el-button>
+            <el-button size="mini" type="text" icon="el-icon-delete" @click.stop="$emit('delete', row)">删除</el-button>
+          </div>
+        </div>
+        <div v-if="contractList.length === 0" style="padding: 40px; text-align: center; color: #909399;">
+          暂无合同数据
+        </div>
+      </div>
+    </div>
+
+    <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
+      @pagination="getList" style="padding: 10px; margin-bottom: 10px !important;" />
+  </div>
+</template>
+
+<script>
+import { listContract, updateContract } from "@/api/crm/contract";
+
+export default {
+  name: "ContractList",
+  data() {
+    return {
+      // 合同信息表格数据
+      contractList: [],
+      // 遮罩层
+      loading: false,
+      // 总条数
+      total: 0,
+      // 选中的行
+      selectedRow: null,
+      // 是否显示更多筛选
+      showMoreFilter: false,
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        contractName: undefined,
+        contractNo: undefined,
+        supplier: undefined,
+        customer: undefined,
+        signTime: undefined,
+        deliveryDate: undefined,
+        signLocation: undefined,
+        status: undefined,
+      },
+    };
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+    /** 查询合同信息列表 */
+    getList() {
+      this.loading = true;
+      listContract(this.queryParams).then(response => {
+        this.contractList = response.rows;
+        this.total = response.total;
+        this.loading = false;
+      });
+    },
+    /** 状态变更 */
+    handleChangeStatus(row) {
+      updateContract(row).then(response => {
+        this.$message({
+          message: "状态变更成功",
+          type: "success"
+        });
+        this.getList();
+      })
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.$refs["queryForm"].resetFields();
+      this.handleQuery();
+    },
+
+    // 行点击事件
+    handleRowClick(row) {
+      this.selectedRow = row;
+      this.$emit('rowClick', row);
+    },
+    // 切换更多筛选显示/隐藏
+    toggleMoreFilter() {
+      this.showMoreFilter = !this.showMoreFilter;
+    }
+  }
+};
+</script>
+
+<style scoped>
+.contract-list {
+  height: 100%;
+  overflow-y: auto;
+}
+
+.custom-list {
+  border: 1px solid #e4e7ed;
+  border-radius: 4px;
+  overflow: hidden;
+}
+
+.list-item:hover {
+  background-color: #f5f7fa;
+}
+
+.list-item-active {
+  background-color: #ecf5ff;
+  border-left: 3px solid #409eff;
+}
+
+@media screen and (max-width: 1200px) {
+  .list-header {
+    font-size: 12px;
+  }
+  
+  .list-item {
+    font-size: 12px;
+  }
+  
+  .list-item .el-button {
+    font-size: 10px;
+  }
+}
+</style>
--- a/klp-ui/src/views/crm/contract/components/ContractPreview.vue
+++ b/klp-ui/src/views/crm/contract/components/ContractPreview.vue
@@ -0,0 +1,106 @@
+<template>
+  <div class="contract-preview">
+    <div v-if="contract" class="preview-content">
+      <h3 style="margin-bottom: 20px; color: #303133; display: flex; justify-content: space-between; align-items: center;">
+        {{ contract.contractName }}
+        <el-select v-hasPermi="['crm:contract:status']" v-model="contract.status" placeholder="请选择合同状态" style="width: 150px;" @change="handleStatusChange">
+          <el-option label="草稿" :value="0" />
+          <el-option label="已生效" :value="1" />
+          <el-option label="已作废" :value="2" />
+          <el-option label="已完成" :value="3" />
+        </el-select>
+      </h3>
+      <el-descriptions :column="2" border>
+        <el-descriptions-item label="合同编号">{{ contract.contractNo }}</el-descriptions-item>
+        <el-descriptions-item label="合同状态">
+          <el-tag :type="contract.status == 0 ? 'info' : contract.status == 1 ? 'success' : contract.status == 2 ? 'danger' : 'primary'">
+            {{ contract.status == 0 ? '草稿' : contract.status == 1 ? '已生效' : contract.status == 2 ? '已作废' : '已完成' }}
+          </el-tag>
+        </el-descriptions-item>
+        <el-descriptions-item label="供方">{{ contract.supplier }}</el-descriptions-item>
+        <el-descriptions-item label="需方">{{ contract.customer }}</el-descriptions-item>
+        <el-descriptions-item label="签订时间">{{ parseTime(contract.signTime, '{y}-{m}-{d}') }}</el-descriptions-item>
+        <el-descriptions-item label="交货日期">{{ parseTime(contract.deliveryDate, '{y}-{m}-{d}') }}</el-descriptions-item>
+        <el-descriptions-item label="签订地点">{{ contract.signLocation }}</el-descriptions-item>
+        <el-descriptions-item label="备注">{{ contract.remark }}</el-descriptions-item>
+      </el-descriptions>
+      
+      <div style="margin-top: 20px;">
+        <h4 style="margin-bottom: 10px; color: #606266;">产品内容</h4>
+        <div v-html="contract.productContent" style="border: 1px solid #e4e7ed; padding: 10px; border-radius: 4px;"></div>
+      </div>
+      
+      <div style="margin-top: 20px;">
+        <h4 style="margin-bottom: 10px; color: #606266;">合同内容</h4>
+        <div v-html="contract.contractContent" style="border: 1px solid #e4e7ed; padding: 10px; border-radius: 4px;"></div>
+      </div>
+    </div>
+    <div v-else class="no-selection" style="display: flex; align-items: center; justify-content: center; height: 100%;">
+      <el-empty description="请先选择合同" />
+    </div>
+  </div>
+</template>
+
+<script>
+import { updateContract } from '@/api/crm/contract';
+
+export default {
+  name: "ContractPreview",
+  props: {
+    contract: {
+      type: Object,
+      default: null
+    }
+  },
+  data() {
+    return {
+      statusOptions: [
+        { label: '草稿', value: '0' },
+        { label: '已生效', value: '1' },
+        { label: '已作废', value: '2' },
+        { label: '已完成', value: '3' }
+      ],
+    }
+  },
+  methods: {
+    // 解析时间
+    parseTime(time, pattern) {
+      if (!time) return '';
+      const d = new Date(time);
+      const year = d.getFullYear();
+      const month = (d.getMonth() + 1).toString().padStart(2, '0');
+      const day = d.getDate().toString().padStart(2, '0');
+      const hours = d.getHours().toString().padStart(2, '0');
+      const minutes = d.getMinutes().toString().padStart(2, '0');
+      const seconds = d.getSeconds().toString().padStart(2, '0');
+      return pattern
+        .replace('{y}', year)
+        .replace('{m}', month)
+        .replace('{d}', day)
+        .replace('{h}', hours)
+        .replace('{i}', minutes)
+        .replace('{s}', seconds);
+    },
+    handleStatusChange(value) {
+      this.$emit('updateStatus', value);
+    }
+  }
+};
+</script>
+
+<style scoped>
+.contract-preview {
+  height: 100%;
+  overflow-y: auto;
+  padding: 20px;
+}
+
+.preview-content {
+  height: 100%;
+  overflow-y: auto;
+}
+
+.no-selection {
+  height: 100%;
+}
+</style>
--- a/klp-ui/src/views/crm/contract/components/ContractTabs.vue
+++ b/klp-ui/src/views/crm/contract/components/ContractTabs.vue
@@ -0,0 +1,119 @@
+<template>
+  <div class="contract-tabs">
+    <div v-if="contractId" class="tabs-content">
+      <el-tabs v-model="activeTab" type="card" tab-position="top" v-loading="tabLoading">
+        <el-tab-pane label="下发订单" name="second">
+          <OrderPage v-if="activeTab === 'second'" :contractId="contractId" />
+        </el-tab-pane>
+        <el-tab-pane label="财务状态" name="third">
+          <KLPTable v-loading="loading" :data="financeList">
+            <el-table-column label="收款日期" align="center" prop="dueDate" width="180">
+              <template slot-scope="scope">
+                <span>{{ parseTime(scope.row.dueDate, '{y}-{m}-{d}') }}</span>
+              </template>
+            </el-table-column>
+            <el-table-column label="收款金额" align="center" prop="amount" />
+            <el-table-column label="备注" align="center" prop="remark" />
+          </KLPTable>
+        </el-tab-pane>
+        <el-tab-pane label="订单异议" name="fourth">
+          <el-table v-loading="loading" :data="objectionList">
+            <el-table-column label="编号" align="center" prop="objectionCode" />
+            <el-table-column label="状态" align="center" prop="objectionStatus">
+              <template slot-scope="scope">
+                <el-tag v-if="scope.row.objectionStatus === 0" type="danger">待处理</el-tag>
+                <el-tag v-else-if="scope.row.objectionStatus === 1" type="success">已处理</el-tag>
+                <el-tag v-else-if="scope.row.objectionStatus === 2" type="info">已关闭</el-tag>
+              </template>
+            </el-table-column>
+            <el-table-column label="处理人" align="center" prop="handleUser" />
+            <el-table-column label="处理时间" align="center" prop="handleTime" width="180">
+              <template slot-scope="scope">
+                <span>{{ parseTime(scope.row.handleTime, '{y}-{m}-{d}') }}</span>
+              </template>
+            </el-table-column>
+            <el-table-column label="备注" align="center" prop="remark" />
+          </el-table>
+        </el-tab-pane>
+        <el-tab-pane label="发货配卷" name="fifth">
+          <CoilTable :data="coilList" />
+        </el-tab-pane>
+      </el-tabs>
+    </div>
+    <div v-else class="no-selection" style="display: flex; align-items: center; justify-content: center; height: 100%;">
+      <el-empty description="请先选择合同" />
+    </div>
+  </div>
+</template>
+
+<script>
+import OrderPage from "@/views/crm/order/index.vue";
+import CoilTable from "../../components/CoilTable.vue";
+
+export default {
+  name: "ContractTabs",
+  components: {
+    OrderPage,
+    CoilTable
+  },
+  props: {
+    contractId: {
+      type: Number,
+      default: null
+    },
+    financeList: {
+      type: Array,
+      default: () => []
+    },
+    objectionList: {
+      type: Array,
+      default: () => []
+    },
+    coilList: {
+      type: Array,
+      default: () => []
+    },
+    loading: {
+      type: Boolean,
+      default: false
+    },
+    tabLoading: {
+      type: Boolean,
+      default: false
+    }
+  },
+  data() {
+    return {
+      // 活动tab
+      activeTab: "second"
+    };
+  },
+  methods: {
+    // 解析时间
+    parseTime(time, pattern) {
+      if (!time) return '';
+      const d = new Date(time);
+      const year = d.getFullYear();
+      const month = (d.getMonth() + 1).toString().padStart(2, '0');
+      const day = d.getDate().toString().padStart(2, '0');
+      const hours = d.getHours().toString().padStart(2, '0');
+      const minutes = d.getMinutes().toString().padStart(2, '0');
+      const seconds = d.getSeconds().toString().padStart(2, '0');
+      return pattern
+        .replace('{y}', year)
+        .replace('{m}', month)
+        .replace('{d}', day)
+        .replace('{h}', hours)
+        .replace('{i}', minutes)
+        .replace('{s}', seconds);
+    }
+  }
+};
+</script>
+
+<style scoped>
+.contract-tabs {
+  height: 100%;
+  overflow-y: auto;
+}
+</style>
--- a/klp-ui/src/views/crm/contract/index.vue
+++ b/klp-ui/src/views/crm/contract/index.vue
@@ -1,103 +1,36 @@
 <template>
-  <div class="app-container">
-    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
-      <el-form-item label="合同名称" prop="contractName">
-        <el-input v-model="queryParams.contractName" placeholder="请输入合同名称" clearable
-          @keyup.enter.native="handleQuery" />
-      </el-form-item>
-      <el-form-item label="合同编号" prop="contractNo">
-        <el-input v-model="queryParams.contractNo" placeholder="请输入合同编号" clearable @keyup.enter.native="handleQuery" />
-      </el-form-item>
-      <el-form-item label="供方" prop="supplier">
-        <el-input v-model="queryParams.supplier" placeholder="请输入供方" clearable @keyup.enter.native="handleQuery" />
-      </el-form-item>
-      <el-form-item label="需方" prop="customer">
-        <el-input v-model="queryParams.customer" placeholder="请输入需方" clearable @keyup.enter.native="handleQuery" />
-      </el-form-item>
-      <el-form-item label="签订时间" prop="signTime">
-        <el-date-picker clearable v-model="queryParams.signTime" type="date" value-format="yyyy-MM-dd"
-          placeholder="请选择签订时间">
-        </el-date-picker>
-      </el-form-item>
-      <el-form-item label="签订地点" prop="signLocation">
-        <el-input v-model="queryParams.signLocation" placeholder="请输入签订地点" clearable
-          @keyup.enter.native="handleQuery" />
-      </el-form-item>
-      <el-form-item label="合同状态" prop="contractStatus">
-        <el-select v-model="queryParams.contractStatus" placeholder="请选择合同状态">
-          <el-option label="草稿" value="0" />
-          <el-option label="已生效" value="1" />
-          <el-option label="已作废" value="2" />
-          <el-option label="已完成" value="3" />
-        </el-select>
-      </el-form-item>
-      <el-form-item>
-        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
-        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
-      </el-form-item>
-    </el-form>
+  <div class="app-container" style="height: calc(100vh - 84px); display: flex;">
+    <!-- 左侧合同列表 -->
+    <div class="left-panel" style="width: 30%; border-right: 1px solid #e4e7ed; overflow-y: auto;">
+      <ContractList ref="contractList"
+        @add="handleAdd" @update="handleUpdate" @delete="handleDelete" @export="handleExport"
+        @exportContract="handleExportContract" @rowClick="handleRowClick" />
+    </div>

-    <el-row :gutter="10" class="mb8">
-      <el-col :span="1.5">
-        <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd">新增</el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button type="success" plain icon="el-icon-edit" size="mini" :disabled="single"
-          @click="handleUpdate">修改</el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple"
-          @click="handleDelete">删除</el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport">导出</el-button>
-      </el-col>
-      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
-    </el-row>
+    <!-- 右侧内容区域 -->
+    <div class="right-panel" v-if="form.contractId" style="flex: 1; display: flex; flex-direction: column;">
+      <!-- 右侧上方：合同内容信息预览 -->
+      <div class="preview-panel" ref="previewPanel"
+        style="flex: 1; overflow-y: auto; border-bottom: 1px solid #e4e7ed;">
+        <ContractPreview :contract="form" @updateStatus="handleStatusChange" />
+      </div>

-    <el-table v-loading="loading" :data="contractList" @selection-change="handleSelectionChange"
-      @row-click="handleRowClick">
-      <el-table-column type="selection" width="55" align="center" />
-      <el-table-column label="合同名称" align="center" prop="contractName" />
-      <el-table-column label="合同编号" align="center" prop="contractNo" />
-      <el-table-column label="供方" align="center" prop="supplier" />
-      <el-table-column label="需方" align="center" prop="customer" />
-      <el-table-column label="签订时间" align="center" prop="signTime" width="180">
-        <template slot-scope="scope">
-          <span>{{ parseTime(scope.row.signTime, '{y}-{m}-{d}') }}</span>
-        </template>
-      </el-table-column>
-      <el-table-column label="签订地点" align="center" prop="signLocation" />
-      <el-table-column label="合同状态" align="center" prop="status">
-        <template slot-scope="scope">
-          <span-tag
-            :type="scope.row.status == 0 ? 'info' : scope.row.status == 1 ? 'success' : scope.row.status == 2 ? 'danger' : 'primary'">
-            {{ scope.row.status == 0 ? '草稿' : scope.row.status == 1 ? '已生效' : scope.row.status == 2 ? '已作废' : '已完成' }}
-          </span-tag>
-        </template>
-      </el-table-column>
-      <el-table-column label="状态变更" align="center" prop="status" v-hasPermi="['crm:contract:status']">
-        <template slot-scope="scope">
-          <el-select v-model="scope.row.status" placeholder="请选择状态变更" @change="handleChangeStatus(scope.row)">
-            <el-option label="草稿" :value="0" />
-            <el-option label="已生效" :value="1" />
-            <el-option label="已作废" :value="2" />
-            <el-option label="已完成" :value="3" />
-          </el-select>
-        </template>
-      </el-table-column>
-      <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-download" @click.stop="handleExportContract(scope.row)">导出</el-button>
-          <el-button size="mini" type="text" icon="el-icon-edit" @click.stop="handleUpdate(scope.row)">修改</el-button>
-          <el-button size="mini" type="text" icon="el-icon-delete" @click.stop="handleDelete(scope.row)">删除</el-button>
-        </template>
-      </el-table-column>
-    </el-table>
+      <!-- 拖拽调整条 -->
+      <div class="resize-handle" ref="resizeHandle"
+        style="height: 8px; background-color: #f5f7fa; cursor: row-resize; display: flex; align-items: center; justify-content: center;"
+        @mousedown="startResize">
+        <div style="width: 40px; height: 2px; background-color: #dcdfe6;"></div>
+      </div>

-    <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
-      @pagination="getList" />
+      <!-- 右侧下方：Tab标签页 -->
+      <div class="tab-panel" ref="tabPanel" style="flex: 1; overflow-y: auto;">
+        <ContractTabs :contractId="form.contractId" :financeList="financeList" :objectionList="objectionList"
+          :coilList="coilList" :tabLoading="tabLoading" />
+      </div>
+    </div>
+    <div v-else style="flex: 1; display: flex; flex-direction: column;">
+      <el-empty description="选择合同后查看内容" />
+    </div>

    <!-- 添加或修改合同信息对话框 -->
    <el-dialog :title="title" :visible.sync="open" width="1200px" append-to-body>
@@ -121,7 +54,14 @@
              </el-date-picker>
            </el-form-item>
          </el-col>
-          <el-col :span="6">
+          <el-col :span="12">
+            <el-form-item label="交货日期" prop="deliveryDate">
+              <el-date-picker clearable v-model="form.deliveryDate" type="date" value-format="yyyy-MM-dd"
+                placeholder="请选择交货日期">
+              </el-date-picker>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
            <el-form-item label="签订地点" prop="signLocation">
              <el-input v-model="form.signLocation" placeholder="请输入签订地点" />
            </el-form-item>
@@ -187,13 +127,14 @@
          <el-input v-model="form.remark" placeholder="请输入备注" />
        </el-form-item>
        <el-form-item label="技术附件" prop="techAnnex">
-          <file-upload v-model="form.techAnnex"></file-upload>
+          <file-upload v-model="form.techAnnex" :fileType="['pdf', 'jpeg', 'jpg', 'png', 'webp']"></file-upload>
        </el-form-item>
        <el-form-item label="商务附件" prop="businessAnnex">
-          <file-upload v-model="form.businessAnnex"></file-upload>
+          <file-upload v-model="form.businessAnnex" :fileType="['pdf', 'jpeg', 'jpg', 'png', 'webp']"></file-upload>
        </el-form-item>
        <el-form-item label="排产函" prop="productionSchedule">
-          <file-upload v-model="form.productionSchedule"></file-upload>
+          <file-upload v-model="form.productionSchedule"
+            :fileType="['pdf', 'jpeg', 'jpg', 'png', 'webp']"></file-upload>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
@@ -201,107 +142,35 @@
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>
-
-    <el-dialog title="合同详情" :visible.sync="dialogOpen" fullscreen>
-      <el-tabs v-model="activeTab" type="card">
-        <el-tab-pane label="合同信息" name="first">
-          合同信息
-        </el-tab-pane>
-        <el-tab-pane label="下发订单" name="second">
-          <OrderPage v-if="activeTab === 'second'" :contractId="form.contractId" />
-        </el-tab-pane>
-        <el-tab-pane label="收款记录" name="third">
-          <KLPTable v-loading="loading" :data="financeList">
-            <el-table-column label="应收ID" align="center" prop="receivableId" v-if="false" />
-            <!-- <el-table-column label="客户" align="center" prop="customerName" /> -->
-            <el-table-column label="收款日期" align="center" prop="dueDate" width="180">
-              <template slot-scope="scope">
-                <span>{{ parseTime(scope.row.dueDate, '{y}-{m}-{d}') }}</span>
-                <!-- <el-tag v-if="new Date(scope.row.dueDate) < new Date()" type="danger">过期</el-tag>
-          <el-tag v-else-if="new Date(scope.row.dueDate) > new Date()" type="success">还剩{{ parseInt((new Date(scope.row.dueDate) - new Date()) / (1000 * 60 * 60 * 24)) }}天</el-tag> -->
-              </template>
-            </el-table-column>
-            <el-table-column label="收款金额" align="center" prop="amount" />
-            <!-- <el-table-column label="已收金额" align="center" prop="paidAmount" /> -->
-            <!-- <el-table-column label="未收金额" align="center" prop="balanceAmount" /> -->
-            <!-- <el-table-column label="状态" align="center" prop="status" /> -->
-            <el-table-column label="备注" align="center" prop="remark" />
-          </KLPTable>
-        </el-tab-pane>
-        <el-tab-pane label="订单异议" name="fourth">
-          <el-table v-loading="loading" :data="objectionList">
-            <el-table-column label="编号" align="center" prop="objectionCode" />
-            <el-table-column label="状态" align="center" prop="objectionStatus">
-              <template slot-scope="scope">
-                <el-tag v-if="scope.row.objectionStatus === 0" type="danger">待处理</el-tag>
-                <el-tag v-else-if="scope.row.objectionStatus === 1" type="success">已处理</el-tag>
-                <el-tag v-else-if="scope.row.objectionStatus === 2" type="info">已关闭</el-tag>
-              </template>
-            </el-table-column>
-            <el-table-column label="处理人" align="center" prop="handleUser" />
-            <el-table-column label="处理时间" align="center" prop="handleTime" width="180">
-              <template slot-scope="scope">
-                <span>{{ parseTime(scope.row.handleTime, '{y}-{m}-{d}') }}</span>
-              </template>
-            </el-table-column>
-            <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-edit" @click="handleUpdate(scope.row)"></el-button>
-                <el-button size="mini" type="text" icon="el-icon-check" @click="handleDo(scope.row)"
-                  v-if="scope.row.objectionStatus == 0"></el-button>
-                <el-button size="mini" type="text" icon="el-icon-view" @click="handleView(scope.row)"
-                  v-if="scope.row.objectionStatus == 1"></el-button>
-                <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"></el-button>
-              </template>
-            </el-table-column> -->
-          </el-table>
-        </el-tab-pane>
-        <el-tab-pane label="发货配卷" name="fifth">
-          <CoilTable :data="coilList" />
-        </el-tab-pane>
-      </el-tabs>
-    </el-dialog>
  </div>
 </template>

 <script>
-import { listContract, getContract, delContract, addContract, updateContract, listContractOrderObjection, listContractPackaging } from "@/api/crm/contract";
-import OrderPage from "@/views/crm/order/index.vue";
-import CoilTable from "../components/CoilTable.vue";
+import { getContract, delContract, addContract, updateContract, listContractOrderObjection, listContractPackaging } from "@/api/crm/contract";
+import ContractList from "./components/ContractList.vue";
+import ContractPreview from "./components/ContractPreview.vue";
+import ContractTabs from "./components/ContractTabs.vue";

 export default {
  name: "Contract",
  components: {
-    OrderPage,
-    CoilTable,
+    ContractList,
+    ContractPreview,
+    ContractTabs
  },
  data() {
    return {
-      // 活动tab
-      activeTab: "first",
+      financeList: [],
+      objectionList: [],
+      coilList: [],
+      loading: false,
+      tabLoading: false,
      // 按钮loading
      buttonLoading: false,
-      // 遮罩层
-      loading: true,
-      // 选中数组
-      ids: [],
-      // 非单个禁用
-      single: true,
-      // 非多个禁用
-      multiple: true,
-      // 显示搜索条件
-      showSearch: true,
-      // 总条数
-      total: 0,
-      // 合同信息表格数据
-      contractList: [],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
-      // 是否显示详情弹出层
-      dialogOpen: false,
      // 查询参数
      queryParams: {
        pageNum: 1,
@@ -311,6 +180,7 @@ export default {
        supplier: undefined,
        customer: undefined,
        signTime: undefined,
+        deliveryDate: undefined,
        signLocation: undefined,
        status: undefined,
      },
@@ -336,6 +206,9 @@ export default {
        signTime: [
          { required: true, message: "签订时间不能为空", trigger: "blur" }
        ],
+        deliveryDate: [
+          { required: true, message: "交货日期不能为空", trigger: "blur" }
+        ],
        signLocation: [
          { required: true, message: "签订地点不能为空", trigger: "blur" }
        ],
@@ -378,33 +251,43 @@ export default {
        status: [
          { required: true, message: "合同状态不能为空", trigger: "change" }
        ],
-        financeList: [],
-        oobjectionList: [],
-        coilList: [],
      }
    };
  },
-  created() {
-    this.getList();
-  },
+
  methods: {
-    /** 查询合同信息列表 */
-    getList() {
-      this.loading = true;
-      listContract(this.queryParams).then(response => {
-        this.contractList = response.rows;
-        this.total = response.total;
-        this.loading = false;
-      });
+
+    /** 处理合同状态更新 */
+    handleStatusChange(status) {
+      this.form.status = status;
+      updateContract({
+        ...this.form,
+        status: status
+      }).then(res => {
+        if (res.code == 200) {
+          this.$message({
+            message: '合同状态更新成功',
+            type: 'success'
+          });
+        }
+      })
+      this.$refs.contractList.getList();
    },
-    /** 状态变更 */
-    handleChangeStatus(row) {
-      updateContract(row).then(response => {
-        this.$message({
-          message: "状态变更成功",
-          type: "success"
-        });
-        this.getList();
+    /** 取消按钮 */
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    /** 行点击事件 */
+    handleRowClick(row) {
+      this.form = row;
+      this.tabLoading = true;
+      this.getCoilList();
+      listContractOrderObjection(row.contractId).then(response => {
+        this.financeList = response.data.financeList || [];
+        this.objectionList = response.data.oobjectionList || [];
+      }).finally(() => {
+        this.tabLoading = false;
      })
    },
    /** 查询合同配卷列表 */
@@ -413,22 +296,7 @@ export default {
        this.coilList = response.data || [];
      })
    },
-    // 取消按钮
-    cancel() {
-      this.open = false;
-      this.reset();
-    },
-    // 行点击事件
-    handleRowClick(row) {
-      this.form = row;
-      this.dialogOpen = true;
-      this.getCoilList();
-      listContractOrderObjection(row.contractId).then(response => {
-        this.form.financeList = response.data.financeList || [];
-        this.form.oobjectionList = response.data.oobjectionList || [];
-      })
-    },
-    // 表单重置
+    /** 表单重置 */
    reset() {
      this.form = {
        contractId: undefined,
@@ -437,6 +305,7 @@ export default {
        supplier: undefined,
        customer: undefined,
        signTime: undefined,
+        deliveryDate: undefined,
        signLocation: undefined,
        productContent: undefined,
        contractContent: undefined,
@@ -463,17 +332,7 @@ export default {
      };
      this.resetForm("form");
    },
-    /** 搜索按钮操作 */
-    handleQuery() {
-      this.queryParams.pageNum = 1;
-      this.getList();
-    },
-    /** 重置按钮操作 */
-    resetQuery() {
-      this.resetForm("queryForm");
-      this.handleQuery();
-    },
-    // 多选框选中数据
+    /** 多选框选中数据 */
    handleSelectionChange(selection) {
      this.ids = selection.map(item => item.contractId)
      this.single = selection.length !== 1
@@ -506,7 +365,7 @@ export default {
            updateContract(this.form).then(response => {
              this.$modal.msgSuccess("修改成功");
              this.open = false;
-              this.getList();
+              this.$refs.contractList.getList();
            }).finally(() => {
              this.buttonLoading = false;
            });
@@ -514,7 +373,7 @@ export default {
            addContract(this.form).then(response => {
              this.$modal.msgSuccess("新增成功");
              this.open = false;
-              this.getList();
+              this.$refs.contractList.getList();
            }).finally(() => {
              this.buttonLoading = false;
            });
@@ -526,16 +385,11 @@ export default {
    handleDelete(row) {
      const contractIds = row.contractId || this.ids;
      this.$modal.confirm('是否确认删除合同信息编号为"' + contractIds + '"的数据项？').then(() => {
-        this.loading = true;
        return delContract(contractIds);
      }).then(() => {
-        this.loading = false;
-        this.getList();
+        this.$refs.contractList.getList();
        this.$modal.msgSuccess("删除成功");
-      }).catch(() => {
-      }).finally(() => {
-        this.loading = false;
-      });
+      })
    },
    /** 导出按钮操作 */
    handleExport() {
@@ -543,10 +397,64 @@ export default {
        ...this.queryParams
      }, `contract_${new Date().getTime()}.xlsx`)
    },
+    /** 导出合同操作 */
    handleExportContract(row) {
      // 合同导出
-      
+    },
+    /** 开始拖拽调整 */
+    startResize(e) {
+      e.preventDefault();
+      const previewPanel = this.$refs.previewPanel;
+      const tabPanel = this.$refs.tabPanel;
+      const startY = e.clientY;
+      const startPreviewHeight = previewPanel.offsetHeight;
+      const parentHeight = previewPanel.parentElement.offsetHeight;
+
+      const handleMouseMove = (event) => {
+        const deltaY = event.clientY - startY;
+        const newPreviewHeight = startPreviewHeight + deltaY;
+        const newTabHeight = parentHeight - newPreviewHeight - 8; // 8是拖拽条的高度
+
+        if (newPreviewHeight > 100 && newTabHeight > 100) { // 最小高度限制
+          previewPanel.style.flex = `0 0 ${newPreviewHeight}px`;
+          tabPanel.style.flex = `0 0 ${newTabHeight}px`;
+        }
+      };
+
+      const handleMouseUp = () => {
+        document.removeEventListener('mousemove', handleMouseMove);
+        document.removeEventListener('mouseup', handleMouseUp);
+      };
+
+      document.addEventListener('mousemove', handleMouseMove);
+      document.addEventListener('mouseup', handleMouseUp);
    }
  }
 };
 </script>
+
+<style scoped>
+.app-container {
+  overflow: hidden;
+  padding: 0;
+}
+
+.left-panel {
+  height: calc(100vh - 84px);
+  box-sizing: border-box;
+  overflow-y: auto;
+}
+
+.right-panel {
+  height: calc(100vh - 84px);
+  overflow: hidden;
+}
+
+.preview-panel {
+  overflow-y: auto;
+}
+
+.tab-panel {
+  overflow-y: auto;
+}
+</style>
--- a/klp-ui/src/views/crm/order/index.vue
+++ b/klp-ui/src/views/crm/order/index.vue
@@ -26,7 +26,7 @@
        <div>
          <!-- 列表区域 -->
          <KLPList :listData="orderList" listKey="orderId" :loading="orderLoading" field1="orderCode" field2="salesman"
-            field4="companyName" field5="contactPerson"  @item-click="handleOrderClick">
+            field4="companyName" field5="contactPerson" @item-click="handleOrderClick">
            <template slot="actions" slot-scope="{ item }">
              <el-button type="danger" size="mini" @click="handleDelete(item)" icon="el-icon-delete"
                v-hasPermi="['crm:order:add']"></el-button>
@@ -81,18 +81,18 @@
              <OrderObjection :order="currentOrder" />
            </div>
          </el-tab-pane>
-          <el-tab-pane label="操作记录" name="record" v-hasPermi="['crm:order:record']">
-            <div class="order-record" v-if="activeTab === 'record'">
-              <!-- 操作记录内容 -->
-              <OrderRecord :orderId="currentOrder.orderId" />
-            </div>
-          </el-tab-pane>
          <el-tab-pane label="发货配卷" name="coil">
            <div class="order-record" v-if="activeTab === 'coil'">
              <!-- 发货配卷内容 -->
              <CoilTable :data="coilList" />
            </div>
          </el-tab-pane>
+          <el-tab-pane label="操作记录" name="record" v-hasPermi="['crm:order:record']">
+            <div class="order-record" v-if="activeTab === 'record'">
+              <!-- 操作记录内容 -->
+              <OrderRecord :orderId="currentOrder.orderId" />
+            </div>
+          </el-tab-pane>
        </el-tabs>
      </el-col>
    </el-row>
@@ -245,7 +245,7 @@ export default {
      if (contract) {
        this.form.contractCode = contract.contractNo
      }
-      
+
    },
    /** 订单列表项点击事件 */
    handleOrderClick(order) {
--- a/klp-ui/src/views/wms/coil/panels/LabelRender/DuGeTag.vue
+++ b/klp-ui/src/views/wms/coil/panels/LabelRender/DuGeTag.vue
@@ -130,7 +130,7 @@

 <script>
 import logo from '@/assets/logo/logo.png'
-import QRCode from '../../../print/components/QRCode.vue';
+import QRCode from '@/components/QRCode';

 export default {
  name: 'MetalSheetLabel',
--- a/klp-ui/src/views/wms/coil/panels/LabelRender/GalvanizedTag.vue
+++ b/klp-ui/src/views/wms/coil/panels/LabelRender/GalvanizedTag.vue
@@ -131,7 +131,7 @@

 <script>
 import logo from '@/assets/logo/logo.png'
-import QRCode from '../../../print/components/QRCode.vue';
+import QRCode from '@/components/QRCode';

 export default {
  name: 'MetalSheetLabel',
--- a/klp-ui/src/views/wms/coil/panels/LabelRender/MaterialTag.vue
+++ b/klp-ui/src/views/wms/coil/panels/LabelRender/MaterialTag.vue
@@ -146,7 +146,7 @@
 </template>

 <script>
-import QRCode from '../../../print/components/QRCode.vue';
+import QRCode from '@/components/QRCode';

 export default {
  name: 'MaterialLabel',
--- a/klp-ui/src/views/wms/coil/panels/LabelRender/OuterTagPreview.vue
+++ b/klp-ui/src/views/wms/coil/panels/LabelRender/OuterTagPreview.vue
@@ -137,7 +137,7 @@

 <script>
 import logo from '@/assets/logo/logo.png'
-import QRCode from '../../../print/components/QRCode.vue';
+import QRCode from '@/components/QRCode';

 export default {
  name: 'MetalSheetLabel',
--- a/klp-ui/src/views/wms/coil/panels/base.vue
+++ b/klp-ui/src/views/wms/coil/panels/base.vue
@@ -488,7 +488,7 @@ import {
 import { listBoundCoil } from "@/api/wms/deliveryWaybillDetail";
 import { addPendingAction } from "@/api/wms/pendingAction";
 import WarehouseSelect from "@/components/KLPService/WarehouseSelect";
-import QRCode from "../../print/components/QRCode.vue";
+import QRCode from "@/components/QRCode";
 import * as XLSX from 'xlsx'
 import { saveAsImage } from '@/utils/klp';
 import ProductSelect from "@/components/KLPService/ProductSelect";
--- a/klp-ui/src/views/wms/print/components/CodeRenderer.vue
+++ b/klp-ui/src/views/wms/print/components/CodeRenderer.vue
@@ -1,295 +0,0 @@
-<template>
-  <div class="barcode-simple-layout">
-    <!-- 仅保留预览区 -->
-    <div class="barcode-preview-area">
-      <div class="iframe-wrapper">
-        <iframe ref="previewIframe" id="previewIframe" class="barcode-iframe" frameborder="0" :style="iframeStyle"></iframe>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script>
-import QRCode from 'qrcode';
-export default {
-  name: 'BarcodeRenderer',
-  props: {
-    barcodes: {
-      type: Array,
-      required: true
-    },
-    // 可通过props传入配置，保持一定灵活性
-    layoutConfig: {
-      type: Object,
-      default: () => ({
-        perRow: 3,
-        barcodeWidth: 180,
-        paperSize: 'A4',
-        paperOrientation: 'portrait',
-        customPaperWidth: 210,
-        customPaperHeight: 297
-      })
-    }
-  },
-  data() {
-    return {
-      barcodeConfigs: [], // 二维码配置数组 [{code, count, textTpl}]
-    };
-  },
-  computed: {
-    // 从传入的配置中获取参数
-    perRow() {
-      return this.layoutConfig.perRow || 3;
-    },
-    barcodeWidth() {
-      return this.layoutConfig.barcodeWidth || 180;
-    },
-    barcodeHeight() {
-      return this.layoutConfig.barcodeWidth || 180; // 保持宽高一致
-    },
-    paperSize() {
-      return this.layoutConfig.paperSize || 'A4';
-    },
-    paperOrientation() {
-      return this.layoutConfig.paperOrientation || 'portrait';
-    },
-    customPaperWidth() {
-      return this.layoutConfig.customPaperWidth || 210;
-    },
-    customPaperHeight() {
-      return this.layoutConfig.customPaperHeight || 297;
-    },
-    // 展开后的二维码列表（考虑生成数量）
-    expandedBarcodes() {
-      let arr = [];
-      this.barcodeConfigs.forEach(cfg => {
-        for (let i = 0; i < (cfg.count || 1); i++) {
-          arr.push(cfg.code);
-        }
-      });
-      return arr;
-    },
-    // 展开后的文字列表
-    expandedBarcodeTexts() {
-      let arr = [];
-      this.barcodeConfigs.forEach(cfg => {
-        for (let i = 0; i < (cfg.count || 1); i++) {
-          let text = cfg.textTpl || cfg.code;
-          text = text.replace(/\{\{n\}\}/g, i + 1); // 替换序号变量
-          arr.push(text);
-        }
-      });
-      return arr;
-    },
-    // 按行分组的二维码
-    barcodeRows() {
-      const rows = [];
-      const arr = this.expandedBarcodes;
-      for (let i = 0; i < arr.length; i += this.perRow) {
-        rows.push(arr.slice(i, i + this.perRow));
-      }
-      return rows;
-    },
-    // 按行分组的文字
-    barcodeTextRows() {
-      const rows = [];
-      const arr = this.expandedBarcodeTexts;
-      for (let i = 0; i < arr.length; i += this.perRow) {
-        rows.push(arr.slice(i, i + this.perRow));
-      }
-      return rows;
-    },
-    //  iframe样式
-    iframeStyle() {
-      const { width, height } = this.getPaperPx();
-      return {
-        width: width + 'px',
-        minHeight: height + 'px',
-        height: height + 'px',
-        background: '#fff',
-        border: 'none',
-        display: 'block',
-        margin: 0,
-        padding: 0
-      };
-    }
-  },
-  watch: {
-    // 监听barcodes变化，重新初始化和渲染
-    barcodes: {
-      handler(newVal) {
-        this.barcodeConfigs = newVal.map(b => ({
-          code: b.code || b,
-          count: b.count || 1,
-          textTpl: b.textTpl || (b.code || b)
-        }));
-        this.$nextTick(this.renderPreviewIframe);
-      },
-      immediate: true,
-      deep: true
-    },
-    // 监听配置变化，重新渲染
-    layoutConfig: {
-      handler() {
-        this.$nextTick(this.renderPreviewIframe);
-      },
-      deep: true
-    },
-    // 监听二维码配置变化，重新渲染
-    barcodeConfigs: {
-      handler() {
-        this.$nextTick(this.renderPreviewIframe);
-      },
-      deep: true
-    }
-  },
-  methods: {
-    // 生成二维码ID
-    getBarcodeId(row, col) {
-      return `barcode-canvas-${row}-${col}`;
-    },
-    // 获取二维码下方文字
-    getBarcodeText(row, col, code) {
-      if (
-        this.barcodeTextRows[row] &&
-        typeof this.barcodeTextRows[row][col] !== 'undefined' &&
-        this.barcodeTextRows[row][col] !== null &&
-        this.barcodeTextRows[row][col] !== ''
-      ) {
-        return this.barcodeTextRows[row][col];
-      }
-      return code;
-    },
-    // 将纸张尺寸从mm转换为px（1mm ≈ 3.78px）
-    getPaperPx() {
-      let width, height;
-      if (this.paperSize === 'A4') {
-        width = 210 * 3.78;
-        height = 297 * 3.78;
-      } else if (this.paperSize === 'A5') {
-        width = 148 * 3.78;
-        height = 210 * 3.78;
-      } else if (this.paperSize === 'A6') {
-        width = 105 * 3.78;
-        height = 148 * 3.78;
-      } else {
-        width = this.customPaperWidth * 3.78;
-        height = this.customPaperHeight * 3.78;
-      }
-      // 处理横向/纵向
-      if (this.paperOrientation === 'landscape') {
-        return { width: height, height: width };
-      }
-      return { width, height };
-    },
-    // 生成打印用的HTML
-    getPrintHtml() {
-      const { width, height } = this.getPaperPx();
-      let html = `
-        <html>
-          <head>
-            <title>二维码预览</title>
-            <style>
-              body { margin: 0; padding: 0; background: #fff; }
-              .barcode-list { width: ${width}px; min-height: ${height}px; margin: 0 auto; background: #fff; padding: 20px; box-sizing: border-box; }
-              .barcode-row { display: flex; margin-bottom: 24px; justify-content: space-around; }
-              .barcode-item { flex: 1; text-align: center; padding: 0 10px; box-sizing: border-box; }
-              .barcode-text { margin-top: 8px; font-size: 14px; word-break: break-all; }
-              html, body { overflow-x: hidden; }
-            </style>
-          </head>
-          <body>
-            <div class="barcode-list">
-      `;
-      // 生成二维码行
-      this.barcodeRows.forEach((row, rowIndex) => {
-        html += '<div class="barcode-row">';
-        row.forEach((code, colIndex) => {
-          const id = this.getBarcodeId(rowIndex, colIndex);
-          const text = this.getBarcodeText(rowIndex, colIndex, code);
-          html += `<div class="barcode-item">
-            <canvas id="${id}" width="${this.barcodeWidth}" height="${this.barcodeHeight}"></canvas>
-            <div class="barcode-text">${text}</div>
-          </div>`;
-        });
-        html += '</div>';
-      });
-      html += '</div></body></html>';
-      return html;
-    },
-    // 渲染预览iframe
-    async renderPreviewIframe() {
-      const iframe = this.$refs.previewIframe;
-      if (!iframe) return;
-      
-      const doc = iframe.contentDocument || iframe.contentWindow.document;
-      doc.open();
-      doc.write(this.getPrintHtml());
-      doc.close();
-      
-      // 绘制二维码
-      setTimeout(async () => {
-        for (let rowIndex = 0; rowIndex < this.barcodeRows.length; rowIndex++) {
-          const row = this.barcodeRows[rowIndex];
-          for (let colIndex = 0; colIndex < row.length; colIndex++) {
-            const code = row[colIndex];
-            const id = this.getBarcodeId(rowIndex, colIndex);
-            const el = doc.getElementById(id);
-            if (el) {
-              await QRCode.toCanvas(el, code, {
-                width: this.barcodeWidth,
-                height: this.barcodeHeight,
-                margin: 0
-              });
-            }
-          }
-        }
-      }, 50);
-    }
-  },
-  mounted() {
-    // 初始化二维码配置
-    this.barcodeConfigs = this.barcodes.map(b => ({
-      code: b.code || b,
-      count: b.count || 1,
-      textTpl: b.textTpl || (b.code || b)
-    }));
-    this.renderPreviewIframe();
-  }
-};
-</script>
-
-<style scoped>
-.barcode-simple-layout {
-  display: flex;
-  width: 100%;
-  min-height: 400px;
-}
-
-.barcode-preview-area {
-  flex: 1;
-  background: #fff;
-  padding: 24px;
-  display: flex;
-  flex-direction: column;
-  height: 100vh;
-  overflow: auto;
-}
-
-.iframe-wrapper {
-  width: 100%;
-  height: 100%;
-  display: flex;
-  justify-content: center;
-  align-items: flex-start;
-  background: #f8f8f8;
-  overflow: auto;
-  padding: 20px;
-  box-sizing: border-box;
-}
-
-.barcode-iframe {
-  border-radius: 4px;
-  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
-}
-</style>
--- a/klp-ui/src/views/wms/print/components/QRCode.vue
+++ b/klp-ui/src/views/wms/print/components/QRCode.vue
@@ -1,50 +0,0 @@
-<template>
-  <canvas ref="qrcode"></canvas>
-</template>
-
-<script>
-import QRCode from 'qrcode';
-
-export default {
-  name: 'QRCode',
-  props: {
-    content: {
-      type: String,
-      required: true
-    },
-    size: {
-      type: Number,
-      default: 90
-    }
-  },  
-  data() {
-    return {
-      qrcode: null
-    }
-  },
-  watch: {
-    content: {
-      handler(newVal, oldVal) {
-        if (newVal !== oldVal) {
-          this.generateQRCode();
-        }
-      },
-      immediate: true
-    }
-  },
-  mounted() {
-    this.generateQRCode();
-  },
-  methods: {
-    generateQRCode() {
-      const el = this.$refs.qrcode;
-      const content = this.content;
-      QRCode.toCanvas(el, content, {
-        width: this.size,
-        height: this.size,
-        margin: 0
-      });
-    }
-  }
-}
-</script>
--- a/klp-ui/src/views/wms/print/index.vue
+++ b/klp-ui/src/views/wms/print/index.vue
@@ -1,698 +0,0 @@
-<template>
-  <div class="print-page-container">
-    <!-- 页面标题栏 - 增加面包屑导航，提升页面定位感 -->
-    <div class="page-header">
-      <div class="header-actions">
-        <el-tooltip content="清空所有已添加的二维码配置" placement="top" :disabled="drawerBarcodeData.length === 0">
-          <el-button type="default" icon="el-icon-refresh" @click="handleResetAll"
-            :disabled="drawerBarcodeData.length === 0" class="btn-reset">
-            清空所有
-          </el-button>
-        </el-tooltip>
-        <el-tooltip content="仅对完整配置的二维码进行打印预览" placement="top"
-          :disabled="drawerBarcodeData.length === 0 || !isAllValid">
-          <el-button type="success" icon="el-icon-printer" @click="handlePrintPreview"
-            :disabled="drawerBarcodeData.length === 0 || !isAllValid" class="btn-print">
-            打印预览
-          </el-button>
-        </el-tooltip>
-        <el-button type="primary" icon="el-icon-plus" @click="handleAdd">
-          添加二维码
-        </el-button>
-      </div>
-    </div>
-
-    <!-- 主内容区 - 增加卡片外层容器，提升整体层次感 -->
-    <el-row :gutter="24" class="main-content">
-      <!-- 左侧配置区 - 增加操作提示 -->
-      <el-col :span="8" class="left-col">
-        <div class="card-container">
-          <div class="left-container card">
-            <!-- 空状态提示 - 增加插图、优化文案 -->
-            <div v-if="drawerBarcodeData.length === 0" class="empty-state">
-              <div class="empty-icon">
-                <i class="el-icon-qrcode"></i>
-              </div>
-              <div class="empty-text">暂无二维码配置</div>
-              <div class="empty-desc">点击"添加二维码"按钮，开始创建打印配置</div>
-              <el-button type="primary" size="small" @click="handleAdd" class="empty-action-btn">
-                立即添加
-              </el-button>
-            </div>
-
-            <!-- 二维码配置表单列表 - 优化卡片间距和hover效果 -->
-            <el-form label-width="80px" size="small" label-position="top" v-else class="config-form-list">
-              <div v-for="(cfg, idx) in drawerBarcodeData" :key="idx" class="config-card"
-                :class="{ 'invalid-card': !isConfigValid(cfg) && cfg.ioType }" @mouseenter="cfg.hovered = true"
-                @mouseleave="cfg.hovered = false">
-                <!-- 配置卡片头部 - 增加序号背景色、优化操作按钮显示逻辑 -->
-                <div class="config-card-header">
-                  <div class="card-title-wrap">
-                    <span class="card-index">{{ idx + 1 }}</span>
-                    <span class="card-title">二维码配置</span>
-                    <el-tag size="mini" type="success" v-if="isConfigValid(cfg)" class="card-status-tag">
-                      已完善
-                    </el-tag>
-                    <el-tag size="mini" type="warning" v-else-if="cfg.ioType" class="card-status-tag">
-                      待完善
-                    </el-tag>
-                  </div>
-                  <div class="card-actions">
-                    <el-tooltip content="另存为图片" placement="top">
-                      <el-button type="text" size="mini" @click="saveAsImage(idx)" icon="el-icon-download"
-                        :disabled="!isConfigValid(cfg)" class="action-btn"></el-button>
-                    </el-tooltip>
-                    <el-tooltip content="删除配置" placement="top">
-                      <el-button type="text" size="mini" @click="handleDelete(cfg, idx)" icon="el-icon-delete"
-                        class="action-btn delete-btn"></el-button>
-                    </el-tooltip>
-                  </div>
-                </div>
-
-                <!-- 配置表单内容 - 优化间距、增加字段分组 -->
-                <div class="config-form-content">
-                  <el-row :gutter="8">
-                    <el-col :span="12">
-                      <el-form-item label="操作类型" :error="getError(cfg, 'ioType')" class="form-item">
-                        <el-select 
-                          v-model="cfg.ioType" 
-                          placeholder="请选择操作类型" 
-                          class="form-select"
-                          @change="(value) => {
-                            const prefix = value == 'in' ? '入库' : value == 'out' ? '出库' : value == 'transfer' ? '移库' : ''
-                            cfg.text = prefix + '二维码' + new Date().getTime()
-                          }"
-                        >
-                          <el-option label="入库" value="in" />
-                          <el-option label="出库" value="out" />
-                          <el-option label="移库" value="transfer" />
-                        </el-select>
-                      </el-form-item>
-                    </el-col>
-                    <el-col :span="12">
-                      <el-form-item 
-                        :label="cfg.ioType == 'in' ? '入库单据号' : cfg.ioType == 'out' ? '出库单据号' : cfg.ioType == 'transfer' ? '移库单据号' : '单据号'" 
-                        :error="getError(cfg, 'stockIoId')" 
-                        class="form-item"
-                      >
-                        <el-select clearable filterable size="mini" v-model="cfg.stockIoId" placeholder="请选择挂载单据"
-                          class="form-select" :disabled="!cfg.ioType">
-                          <el-option v-for="item in masterList.filter(i => i.ioType === cfg.ioType)"
-                            :key="item.stockIoId" :label="item.stockIoCode" :value="item.stockIoId" />
-                        </el-select>
-                      </el-form-item>
-                    </el-col>
-                  </el-row>
-                  <el-row :gutter="8">
-                    <el-col :span="12">
-                      <el-form-item label="目标仓库" :error="getError(cfg, 'warehouseId')" class="form-item">
-                        <WarehouseSelect v-model="cfg.warehouseId" :disabled="!cfg.ioType" />
-                      </el-form-item>
-                    </el-col>
-                    <el-col :span="12" v-if="cfg.ioType === 'transfer'">
-                      <el-form-item label="源仓库" :error="getError(cfg, 'fromWarehouseId')" class="form-item">
-                        <WarehouseSelect v-model="cfg.fromWarehouseId" :disabled="!cfg.ioType" />
-                      </el-form-item>
-                    </el-col>
-                  </el-row>
-                  <el-row :gutter="8">
-                    <el-col :span="12">
-                      <el-form-item label="物料类型" :error="getError(cfg, 'itemType')" class="form-item">
-                        <el-select v-model="cfg.itemType" placeholder="请选择物料类型" class="form-select">
-                          <el-option v-for="dict in dict.type.stock_item_type" :key="dict.value" :label="dict.label"
-                            :value="dict.value" />
-                        </el-select>
-                      </el-form-item>
-                    </el-col>
-                    <el-col :span="12">
-                      <el-form-item label="物料信息" :error="getError(cfg, 'itemId')" class="form-item">
-                        <ProductSelect v-if="cfg.itemType === 'product'" v-model="cfg.itemId" placeholder="请选择产品"
-                          @change="onItemChange($event, idx)" :disabled="!cfg.itemType" />
-                        <SemiSelect v-else-if="cfg.itemType === 'semi'" v-model="cfg.itemId" placeholder="请选择半成品"
-                          @change="onItemChange($event, idx)" :disabled="!cfg.itemType" />
-                        <RawMaterialSelect v-else-if="cfg.itemType === 'raw_material'" v-model="cfg.itemId"
-                          placeholder="请选择原材料" @change="onItemChange($event, idx)" :disabled="!cfg.itemType" />
-                        <el-input v-else disabled v-model="cfg.itemId" placeholder="请先选择物料类型" style="width: 100%;" />
-                      </el-form-item>
-                    </el-col>
-                  </el-row>
-                  <el-row :gutter="8">
-                    <el-col :span="12">
-                      <el-form-item label="物料数量" :error="getError(cfg, 'count')" class="form-item">
-                        <el-input-number :controls=false controls-position="right" v-model="cfg.count" :min="1" :max="100" size="mini" placeholder="请输入数量" />
-                      </el-form-item>
-                    </el-col>
-                  </el-row>
-
-                  <el-row :gutter="8">
-                    <el-col :span="12">
-                      <el-form-item label="下方文字" class="form-item">
-                        <el-input v-model="cfg.text" size="mini" placeholder="例如：产品入库二维码" />
-                      </el-form-item>
-                    </el-col>
-                    <el-col :span="12">
-                      <el-form-item label="生成数量" class="form-item">
-                        <el-input v-model="cfg.totalCount" size="mini" placeholder="例如：产品入库二维码" />
-                      </el-form-item>
-                    </el-col>
-                  </el-row>
-
-                  <!-- 配置状态提示 - 优化背景色和图标 -->
-                  <div v-if="!isConfigValid(cfg) && cfg.ioType" class="config-warning">
-                    <i class="el-icon-warning-outline"></i>
-                    <span>请完善必填字段配置（标红项为未完成）</span>
-                  </div>
-                </div>
-              </div>
-            </el-form>
-          </div>
-        </div>
-      </el-col>
-
-      <!-- 右侧预览区 - 增加预览说明、优化加载状态 -->
-      <el-col :span="16" class="right-col">
-        <div class="card-container">
-          <div class="right-container card">
-            <div class="right-header">
-              <div class="preview-count">
-                共 {{ drawerBarcodeData.length }} 个二维码
-                <span v-if="drawerBarcodeData.length > 0">| 有效配置: {{ validConfigCount }} 个</span>
-              </div>
-            </div>
-
-            <!-- 预览区内容 - 增加预览容器边框、优化滚动体验 -->
-            <div class="preview-content">
-              <div v-loading="loading || !drawerBarcodeData.length" class="preview-loading"
-                :element-loading-text="drawerBarcodeData.length === 0 ? '暂无配置数据，无法预览' : '加载预览中...'"
-                element-loading-spinner="el-icon-loading" element-loading-background="rgba(255, 255, 255, 0.9)"
-                element-loading-offset="100">
-                <BarCode :barcodes="barCodeConfigs" v-if="drawerBarcodeData.length > 0" class="barcode-renderer" />
-              </div>
-
-              <!-- 预览为空提示 - 优化空状态样式 -->
-              <div v-if="drawerBarcodeData.length > 0 && validConfigCount === 0" class="preview-empty">
-                <div class="empty-icon">
-                  <i class="el-icon-info"></i>
-                </div>
-                <div class="empty-text">所有二维码配置均不完整</div>
-                <div class="empty-desc">请完善左侧标红的必填字段后，再查看预览</div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </el-col>
-    </el-row>
-  </div>
-</template>
-
-<script>
-// 保持原脚本逻辑不变，仅增加hover状态初始化
-import BarCode from './components/CodeRenderer.vue';
-import ProductSelect from '@/components/KLPService/ProductSelect/index.vue';
-import SemiSelect from '@/components/KLPService/SemiSelect/index.vue';
-import RawMaterialSelect from '@/components/KLPService/RawMaterialSelect/index.vue';
-import WarehouseSelect from '@/components/WarehouseSelect/index.vue';
-import { saveAsImage } from '@/utils/klp';
-import { listStockIo } from '@/api/wms/stockIo';
-
-export default {
-  name: 'Print',
-  components: {
-    BarCode,
-    ProductSelect,
-    SemiSelect,
-    RawMaterialSelect,
-    WarehouseSelect
-  },
-  dicts: ['stock_item_type', 'stock_io_type'],
-  data() {
-    return {
-      drawerBarcodeData: [], // 条码数据
-      loading: false, // 加载状态
-      masterList: [], // 单据列表
-    };
-  },
-  mounted() {
-    this.fetchMaster();
-  },
-  computed: {
-    // 有效的二维码配置数量
-    validConfigCount() {
-      return this.drawerBarcodeData.filter(cfg => this.isConfigValid(cfg)).length;
-    },
-    // 所有配置是否都有效
-    isAllValid() {
-      return this.drawerBarcodeData.length > 0 &&
-        this.drawerBarcodeData.every(cfg => this.isConfigValid(cfg));
-    },
-    // 二维码配置数据
-    barCodeConfigs() {
-      return this.drawerBarcodeData
-        .filter(cfg => this.isConfigValid(cfg))
-        .map(b => ({
-          code: JSON.stringify({
-            ioType: b.ioType,
-            stockIoId: b.stockIoId,
-            fromWarehouseId: b.fromWarehouseId,
-            warehouseId: b.warehouseId,
-            itemType: b.itemType,
-            itemId: b.itemId,
-            batchNo: b.batchNo || 'auto',
-            quantity: b.count || 1,
-            recordType: 1,
-          }),
-          count: b.totalCount,
-          textTpl: b.text || '二维码'
-        }));
-    }
-  },
-  methods: {
-    // 物料选择变更
-    onItemChange(item, idx) {
-      if (item && this.drawerBarcodeData[idx]) {
-        // this.drawerBarcodeData[idx].unit = item.unit;
-        // 如果未设置数量，默认设置为1
-        if (!this.drawerBarcodeData[idx].count) {
-          this.drawerBarcodeData[idx].count = 1;
-        }
-      }
-    },
-    // 获取单据列表
-    fetchMaster() {
-      this.loading = true;
-      listStockIo({ pageSize: 9999, pageNum: 1 })
-        .then(res => {
-          this.masterList = res.rows || [];
-          this.$message.success({
-            message: '单据列表加载成功',
-            duration: 1500
-          });
-        })
-        .catch(error => {
-          console.error("获取挂载单据失败", error);
-          this.$message.error("获取挂载单据失败，请稍后重试");
-        })
-        .finally(() => {
-          this.loading = false;
-        });
-    },
-    // 删除二维码配置
-    handleDelete(cfg, idx) {
-      this.$confirm('确定要删除这个二维码配置吗？', '确认删除', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {
-        this.drawerBarcodeData.splice(idx, 1);
-        this.$message.success({
-          message: '删除成功',
-          duration: 1500
-        });
-      }).catch(() => {
-        // 取消删除
-      });
-    },
-    // 添加二维码配置 - 增加hover状态初始化
-    handleAdd() {
-      const newConfig = {
-        ioType: undefined,
-        stockIoId: undefined,
-        fromWarehouseId: undefined,
-        warehouseId: undefined,
-        itemType: undefined,
-        itemId: undefined,
-        batchNo: 'auto',
-        count: 1, // 默认数量1
-        totalCount: 1, // 默认数量1
-        unit: '',
-        text: '二维码', // 默认文字
-        hovered: false // 新增hover状态，用于交互反馈
-      };
-
-      this.drawerBarcodeData.push(newConfig);
-
-      // 滚动到最新添加的配置
-      this.$nextTick(() => {
-        const container = document.querySelector('.left-container');
-        container.scrollTop = container.scrollHeight;
-      });
-    },
-    // 保存为图片
-    saveAsImage(index) {
-      const config = this.drawerBarcodeData[index];
-      if (!this.isConfigValid(config)) {
-        this.$message.warning('配置不完整，无法保存图片');
-        return;
-      }
-
-      try {
-        console.log(this.barCodeConfigs[index], index);
-       saveAsImage(
-          this.barCodeConfigs[index].code,
-          this.barCodeConfigs[index].textTpl,
-          index,
-          this
-        );
-        this.$message.success('图片保存成功');
-      } catch (error) {
-        console.error('保存图片失败', error);
-        this.$message.error('保存图片失败，请稍后重试');
-      }
-    },
-    // 清空所有配置
-    handleResetAll() {
-      this.$confirm('确定要清空所有二维码配置吗？此操作不可恢复', '确认清空', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {
-        this.drawerBarcodeData = [];
-        this.$message.success({
-          message: '已清空所有配置',
-          duration: 1500
-        });
-      }).catch(() => {
-        // 取消清空
-      });
-    },
-    // 打印预览 - 增加加载状态提示
-    handlePrintPreview() {
-      document.querySelector('#previewIframe').contentWindow.print();
-    },
-    // 验证单个配置是否有效
-    isConfigValid(cfg) {
-      if (!cfg) return false;
-
-      // 基础必填字段验证
-      const basicValid = !!cfg.ioType && !!cfg.stockIoId && !!cfg.warehouseId;
-      // 移库需要额外验证源仓库
-      const transferValid = cfg.ioType !== 'transfer' || !!cfg.fromWarehouseId;
-      // 物料相关验证
-      const itemValid = !!cfg.itemType && !!cfg.itemId && !!cfg.count && cfg.count >= 1;
-
-      return basicValid && transferValid && itemValid;
-    },
-    // 获取字段错误信息
-    getError(cfg, field) {
-      if (!cfg.ioType) return '';
-
-      switch (field) {
-        case 'ioType':
-          return !cfg.ioType ? '请选择操作类型' : '';
-        case 'stockIoId':
-          return !cfg.stockIoId ? '请选择挂载单据' : '';
-        case 'warehouseId':
-          return !cfg.warehouseId ? '请选择目标仓库' : '';
-        case 'fromWarehouseId':
-          return cfg.ioType === 'transfer' && !cfg.fromWarehouseId ? '请选择源仓库' : '';
-        case 'itemType':
-          return !cfg.itemType ? '请选择物料类型' : '';
-        case 'itemId':
-          return !cfg.itemId ? '请选择物料信息' : '';
-        case 'count':
-          return !cfg.count || cfg.count < 1 ? '请输入有效的数量（至少1）' : '';
-        default:
-          return '';
-      }
-    }
-  }
-};
-</script>
-
-<style scoped lang="scss">
-// 全局变量定义 - 便于统一维护
-$primary-color: #409eff;
-$success-color: #67c23a;
-$warning-color: #e6a23c;
-$danger-color: #f56c6c;
-$gray-light: #f5f7fa;
-$gray-mid: #e5e7eb;
-$gray-dark: #6b7280;
-$text-primary: #1f2329;
-$text-secondary: #6b7280;
-$card-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
-$card-hover-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
-
-// 页面整体容器 - 优化高度计算、增加内边距
-.print-page-container {
-  padding: 16px 20px; // Slightly reduced padding
-  height: calc(100vh - 100px);
-  box-sizing: border-box;
-  overflow: hidden;
-}
-
-// 页面标题栏 - 增加面包屑、优化布局
-.page-header {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  margin-bottom: 16px; // Reduced space between header and content
-  padding-bottom: 8px;
-  border-bottom: 1px solid $gray-mid;
-
-  .header-breadcrumb {
-    .el-breadcrumb {
-      margin-bottom: 4px;
-    }
-
-    .page-title {
-      font-size: 18px; // Slightly smaller title
-      font-weight: 600;
-      color: $text-primary;
-      margin: 0;
-    }
-  }
-
-  .header-actions {
-    display: flex;
-    gap: 12px; // Reduced gap between buttons
-
-    .btn-reset {
-      padding: 6px 12px; // Smaller padding
-      transition: all 0.2s ease;
-    }
-
-    .btn-print {
-      padding: 6px 12px; // Smaller padding
-      transition: all 0.2s ease;
-    }
-  }
-}
-
-// 主内容区 - 优化间距
-.main-content {
-  height: calc(100% - 80px);
-  display: flex;
-  gap: 16px; // Reduced gap between left and right content
-
-  .left-col,
-  .right-col {
-    height: 100%;
-    display: flex;
-    flex-direction: column;
-  }
-
-  .card-container {
-    padding: 1px;
-    flex: 1;
-    overflow: hidden;
-  }
-}
-
-// 左侧容器 - 优化滚动体验
-.left-container {
-  height: 100%;
-  overflow-y: auto;
-  overflow-x: hidden;
-  flex: 1;
-
-  &:hover {
-    ::-webkit-scrollbar {
-      width: 6px;
-      height: 6px;
-      display: block;
-    }
-
-    ::-webkit-scrollbar-track {
-      display: block;
-      border-radius: 3px;
-    }
-  }
-}
-
-// 配置卡片 - 优化阴影和间距
-.config-card {
-  border-radius: 8px;
-  transition: all 0.3s ease;
-  overflow: hidden;
-  border: 1px solid $gray-mid;
-}
-
-// 配置卡片头部 - 优化布局和样式
-.config-card-header {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  padding: 10px 12px; // Reduced padding
-
-  .card-title-wrap {
-    display: flex;
-    align-items: center;
-    gap: 6px; // Reduced gap between elements
-
-    .card-index {
-      width: 18px; // Smaller index
-      height: 18px; // Smaller index
-      font-size: 10px; // Smaller font size for index
-    }
-
-    .card-title {
-      font-size: 12px; // Smaller title
-    }
-
-    .card-status-tag {
-      margin-left: 6px; // Reduced margin
-    }
-  }
-
-  .card-actions {
-    display: flex;
-    gap: 6px; // Reduced gap between actions
-
-    .action-btn {
-      color: $text-secondary;
-      transition: color 0.2s ease;
-      font-size: 12px; // Reduced font size for actions
-
-      &:hover {
-        color: $primary-color;
-      }
-
-      &.delete-btn {
-        color: $danger-color;
-
-        &:hover {
-          color: #e53e3e;
-        }
-      }
-
-      &:disabled {
-        color: $gray-dark;
-        opacity: 0.5;
-        cursor: not-allowed;
-      }
-    }
-  }
-}
-
-// 配置表单内容 - 优化间距和分组
-.config-form-content {
-  padding: 12px; // Reduced padding
-
-  .form-group {
-    margin-bottom: 12px; // Reduced spacing between groups
-
-    .group-title {
-      font-size: 12px; // Smaller font size for group title
-      margin-bottom: 8px; // Reduced margin
-    }
-  }
-
-  .form-item {
-    margin-bottom: 8px !important; // Reduced spacing between form items
-  }
-
-  .form-select {
-    width: 100% !important;
-  }
-
-  .config-warning {
-    margin-top: 8px; // Reduced margin
-    padding: 8px 10px; // Reduced padding
-    font-size: 12px; // Smaller font size
-  }
-}
-
-// 空状态样式 - 优化间距和图标
-.empty-state,
-.preview-empty {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  padding: 40px 0; // Reduced padding
-  color: $text-secondary;
-  text-align: center;
-
-  .empty-icon {
-    font-size: 48px; // Slightly smaller icon
-    color: $gray-mid;
-    margin-bottom: 16px; // Reduced margin
-  }
-
-  .empty-text {
-    font-size: 14px; // Slightly smaller text
-    margin-bottom: 6px; // Reduced margin
-  }
-
-  .empty-desc {
-    font-size: 12px; // Smaller description text
-    margin-bottom: 16px;
-  }
-
-  .empty-action-btn {
-    padding: 4px 12px; // Smaller button padding
-    font-size: 12px; // Smaller font size
-  }
-}
-
-// 响应式调整 - 优化小屏幕体验
-@media (max-width: 1200px) {
-  .main-content {
-    flex-direction: column;
-    gap: 16px;
-  }
-
-  .left-col,
-  .right-col {
-    span: 24;
-  }
-
-  .print-page-container {
-    padding: 12px; // Reduced padding for smaller screens
-  }
-
-  .page-header {
-    flex-direction: column;
-    align-items: flex-start;
-    gap: 8px; // Reduced gap
-  }
-}
-
-@media print {
-
-  .page-header,
-  .left-col,
-  .preview-count {
-    display: none !important;
-  }
-
-  .print-page-container,
-  .main-content,
-  .right-col,
-  .card-container,
-  .right-container,
-  .preview-content {
-    height: auto !important;
-    padding: 0 !important;
-    margin: 0 !important;
-    box-shadow: none !important;
-    border: none !important;
-  }
-
-  .barcode-renderer {
-    gap: 20px; // Reduced gap for print
-    justify-content: center;
-  }
-}
-</style>
--- a/klp-ui/src/views/wms/print/pages/code/index.vue
+++ b/klp-ui/src/views/wms/print/pages/code/index.vue
@@ -1,318 +0,0 @@
-<template>
-  <div class="app-container">
-    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
-      <el-form-item label="编号" prop="serialNumber">
-        <el-input
-          v-model="queryParams.serialNumber"
-          placeholder="请输入编号"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <!-- <el-form-item label="二维码尺寸" prop="size">
-        <el-input
-          v-model="queryParams.size"
-          placeholder="请输入二维码尺寸"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item> -->
-      <el-form-item>
-        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
-        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
-      </el-form-item>
-    </el-form>
-
-    <el-row :gutter="10" class="mb8">
-      <el-col :span="1.5">
-        <el-button
-          type="primary"
-          plain
-          icon="el-icon-plus"
-          size="mini"
-          @click="handleAdd"
-        >新增</el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button
-          type="success"
-          plain
-          icon="el-icon-edit"
-          size="mini"
-          :disabled="single"
-          @click="handleUpdate"
-        >修改</el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button
-          type="danger"
-          plain
-          icon="el-icon-delete"
-          size="mini"
-          :disabled="multiple"
-          @click="handleDelete"
-        >删除</el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button
-          type="warning"
-          plain
-          icon="el-icon-download"
-          size="mini"
-          @click="handleExport"
-        >导出</el-button>
-        
-      </el-col>
-
-        <el-col :span="1.5">
-          二维码预览：<el-switch v-model="showQRCode" />
-        </el-col>
-      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
-    </el-row>
-
-    <el-table v-loading="loading" :data="generateRecordList" @selection-change="handleSelectionChange">
-      <el-table-column type="selection" width="55" align="center" />
-      <el-table-column label="主键" align="center" prop="recordId" v-if="false"/>
-      <!-- <el-table-column label="二维码类型" align="center" prop="qrcodeType" /> -->
-      <!-- <el-table-column label="二维码内容" align="center" prop="content" /> -->
-      <!-- <el-table-column label="是否启用" align="center" prop="isEnabled" /> -->
-      <el-table-column label="编号" align="center" prop="serialNumber" />
-      <el-table-column label="二维码尺寸" align="center" prop="size" />
-      <el-table-column label="状态" align="center" prop="status" />
-      <el-table-column v-if="showQRCode" label="二维码" align="center" prop="content">
-        <template slot-scope="scope">
-          <QRCode :content="scope.row.recordId" :size="scope.row.size"/>
-        </template>
-      </el-table-column>
-      <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-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>
-
-    <pagination
-      v-show="total>0"
-      :total="total"
-      :page.sync="queryParams.pageNum"
-      :limit.sync="queryParams.pageSize"
-      @pagination="getList"
-    />
-
-    <!-- 添加或修改二维码生成记录对话框 -->
-    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
-      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
-        <el-form-item label="二维码内容">
-          <textarea v-model="form.content" :min-height="192" style="width: 100%;height: 192px;background-color: #393e43;color: #fff;" />
-        </el-form-item>
-        <el-form-item label="是否启用" prop="isEnabled">
-          <!-- 单选框 -->
-          <el-radio-group v-model="form.isEnabled">
-            <el-radio :label="1">启用</el-radio>
-            <el-radio :label="0">禁用</el-radio>
-          </el-radio-group>
-        </el-form-item>
-        <el-form-item label="状态" prop="status">
-          <el-input v-model="form.status" placeholder="请输入状态" />
-        </el-form-item>
-        <el-form-item label="编号" prop="serialNumber">
-          <el-input v-model="form.serialNumber" placeholder="请输入编号" />
-        </el-form-item>
-        <el-form-item label="二维码尺寸" prop="size">
-          <el-input v-model="form.size" placeholder="请输入二维码尺寸" />
-        </el-form-item>
-        <el-form-item label="备注" prop="remark">
-          <el-input v-model="form.remark" placeholder="请输入备注" />
-        </el-form-item>
-      </el-form>
-      <div slot="footer" class="dialog-footer">
-        <el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
-        <el-button @click="cancel">取 消</el-button>
-      </div>
-    </el-dialog>
-  </div>
-</template>
-
-<script>
-import { listGenerateRecord, getGenerateRecord, delGenerateRecord, addGenerateRecord, updateGenerateRecord } from "@/api/wms/generateRecord";
-import QRCode from '../../components/QRCode.vue';
-
-export default {
-  name: "GenerateRecord",
-  components: {
-    QRCode
-  },
-  data() {
-    return {
-      // 是否显示二维码
-      showQRCode: false,
-      // 按钮loading
-      buttonLoading: false,
-      // 遮罩层
-      loading: true,
-      // 选中数组
-      ids: [],
-      // 非单个禁用
-      single: true,
-      // 非多个禁用
-      multiple: true,
-      // 显示搜索条件
-      showSearch: true,
-      // 总条数
-      total: 0,
-      // 二维码生成记录表格数据
-      generateRecordList: [],
-      // 弹出层标题
-      title: "",
-      // 是否显示弹出层
-      open: false,
-      // 查询参数
-      queryParams: {
-        pageNum: 1,
-        pageSize: 20,
-        qrcodeType: undefined,
-        content: undefined,
-        isEnabled: undefined,
-        serialNumber: undefined,
-        size: undefined,
-        status: undefined,
-      },
-      // 表单参数
-      form: {},
-      // 表单校验
-      rules: {
-      }
-    };
-  },
-  created() {
-    this.getList();
-  },
-  methods: {
-    /** 查询二维码生成记录列表 */
-    getList() {
-      this.loading = true;
-      listGenerateRecord(this.queryParams).then(response => {
-        this.generateRecordList = response.rows;
-        this.total = response.total;
-        this.loading = false;
-      });
-    },
-    // 取消按钮
-    cancel() {
-      this.open = false;
-      this.reset();
-    },
-    // 表单重置
-    reset() {
-      this.form = {
-        recordId: undefined,
-        qrcodeType: undefined,
-        content: undefined,
-        isEnabled: undefined,
-        serialNumber: undefined,
-        size: undefined,
-        delFlag: undefined,
-        remark: undefined,
-        createTime: undefined,
-        createBy: undefined,
-        updateTime: undefined,
-        updateBy: undefined,
-        status: undefined,
-      };
-      this.resetForm("form");
-    },
-    /** 搜索按钮操作 */
-    handleQuery() {
-      this.queryParams.pageNum = 1;
-      this.getList();
-    },
-    /** 重置按钮操作 */
-    resetQuery() {
-      this.resetForm("queryForm");
-      this.handleQuery();
-    },
-    // 多选框选中数据
-    handleSelectionChange(selection) {
-      this.ids = selection.map(item => item.recordId)
-      this.single = selection.length!==1
-      this.multiple = !selection.length
-    },
-    /** 新增按钮操作 */
-    handleAdd() {
-      this.reset();
-      this.open = true;
-      this.title = "添加二维码生成记录";
-    },
-    /** 修改按钮操作 */
-    handleUpdate(row) {
-      this.loading = true;
-      this.reset();
-      const recordId = row.recordId || this.ids
-      getGenerateRecord(recordId).then(response => {
-        this.loading = false;
-        this.form = response.data;
-        this.open = true;
-        this.title = "修改二维码生成记录";
-      });
-    },
-    /** 提交按钮 */
-    submitForm() {
-      this.$refs["form"].validate(valid => {
-        if (valid) {
-          this.buttonLoading = true;
-          if (this.form.recordId != null) {
-            updateGenerateRecord(this.form).then(response => {
-              this.$modal.msgSuccess("修改成功");
-              this.open = false;
-              this.getList();
-            }).finally(() => {
-              this.buttonLoading = false;
-            });
-          } else {
-            addGenerateRecord(this.form).then(response => {
-              this.$modal.msgSuccess("新增成功");
-              this.open = false;
-              this.getList();
-            }).finally(() => {
-              this.buttonLoading = false;
-            });
-          }
-        }
-      });
-    },
-    /** 删除按钮操作 */
-    handleDelete(row) {
-      const recordIds = row.recordId || this.ids;
-      this.$modal.confirm('是否确认删除二维码生成记录编号为"' + recordIds + '"的数据项？').then(() => {
-        this.loading = true;
-        return delGenerateRecord(recordIds);
-      }).then(() => {
-        this.loading = false;
-        this.getList();
-        this.$modal.msgSuccess("删除成功");
-      }).catch(() => {
-      }).finally(() => {
-        this.loading = false;
-      });
-    },
-    /** 导出按钮操作 */
-    handleExport() {
-      this.download('klp/generateRecord/export', {
-        ...this.queryParams
-      }, `generateRecord_${new Date().getTime()}.xlsx`)
-    }
-  }
-};
-</script>
--- a/klp-ui/src/views/wms/print/pages/gen/index.vue
+++ b/klp-ui/src/views/wms/print/pages/gen/index.vue
@@ -1,785 +0,0 @@
-<template>
-  <div class="print-page-container">
-    <!-- 页面标题栏 - 增加面包屑导航，提升页面定位感 -->
-    <div class="page-header">
-      <div class="header-actions">
-        <el-tooltip content="清空所有已添加的二维码配置" placement="top" :disabled="drawerBarcodeData.length === 0">
-          <el-button type="default" icon="el-icon-refresh" @click="handleResetAll"
-            :disabled="drawerBarcodeData.length === 0" class="btn-reset">
-            清空所有
-          </el-button>
-        </el-tooltip>
-        <el-tooltip content="仅对完整配置的二维码进行打印预览" placement="top"
-          :disabled="drawerBarcodeData.length === 0 || !isAllValid">
-          <el-button type="success" icon="el-icon-printer" @click="handlePrintPreview"
-            :disabled="drawerBarcodeData.length === 0 || !isAllValid" class="btn-print">
-            打印预览
-          </el-button>
-        </el-tooltip>
-        <el-button type="primary" icon="el-icon-plus" @click="handleAdd">
-          添加二维码
-        </el-button>
-      </div>
-    </div>
-    <!-- 主内容区 - 增加卡片外层容器，提升整体层次感 -->
-    <el-row :gutter="24" class="main-content">
-
-      <!-- 右侧预览区 - 增加预览说明、优化加载状态 -->
-      <el-col :span="16" class="right-col">
-        <div class="card-container">
-          <div class="right-container card">
-            <div class="right-header">
-              <div class="preview-count">
-                共 {{ drawerBarcodeData.length }} 个二维码
-                <span v-if="drawerBarcodeData.length > 0">| 有效配置: {{ validConfigCount }} 个</span>
-              </div>
-            </div>
-
-            <!-- 预览区内容 - 增加预览容器边框、优化滚动体验 -->
-            <div class="preview-content">
-              <div v-loading="loading || !drawerBarcodeData.length" class="preview-loading"
-                :element-loading-text="drawerBarcodeData.length === 0 ? '暂无配置数据，无法预览' : '加载预览中...'"
-                element-loading-spinner="el-icon-loading" element-loading-background="rgba(255, 255, 255, 0.9)"
-                element-loading-offset="100">
-                <BarCode :barcodes="barCodeConfigs" v-if="drawerBarcodeData.length > 0" class="barcode-renderer" />
-              </div>
-
-              <!-- 预览为空提示 - 优化空状态样式 -->
-              <div v-if="drawerBarcodeData.length > 0 && validConfigCount === 0" class="preview-empty">
-                <div class="empty-icon">
-                  <i class="el-icon-info"></i>
-                </div>
-                <div class="empty-text">所有二维码配置均不完整</div>
-                <div class="empty-desc">请完善左侧标红的必填字段后，再查看预览</div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </el-col>
-      <!-- 左侧配置区 - 增加操作提示 -->
-      <el-col :span="8" class="left-col">
-        <el-alert title="信息填写完成后需要点击生成按钮才会出现在预览区域" type="info" show-icon></el-alert>
-        <div class="card-container">
-          <div class="left-container card">
-            <!-- 空状态提示 - 增加插图、优化文案 -->
-            <div v-if="drawerBarcodeData.length === 0" class="empty-state">
-              <div class="empty-icon">
-                <i class="el-icon-qrcode"></i>
-              </div>
-              <div class="empty-text">暂无二维码配置</div>
-              <div class="empty-desc">点击"添加二维码"按钮，开始创建打印配置</div>
-              <el-button type="primary" size="small" @click="handleAdd" class="empty-action-btn">
-                立即添加
-              </el-button>
-            </div>
-
-            <!-- 二维码配置表单列表 - 优化卡片间距和hover效果 -->
-            <el-form label-width="80px" size="small" label-position="top" v-else class="config-form-list">
-              <div v-for="(cfg, idx) in drawerBarcodeData" :key="idx" class="config-card"
-                :class="{ 'invalid-card': !isConfigValid(cfg) && cfg.ioType }" @mouseenter="cfg.hovered = true"
-                @mouseleave="cfg.hovered = false">
-                <!-- 配置卡片头部 - 增加序号背景色、优化操作按钮显示逻辑 -->
-                <div class="config-card-header">
-                  <div class="card-title-wrap">
-                    <span class="card-index">{{ idx + 1 }}</span>
-                    <span class="card-title">二维码配置{{ cfg.recordId }}</span>
-                    <el-tag size="mini" type="success" v-if="isConfigValid(cfg)" class="card-status-tag">
-                      已完善
-                    </el-tag>
-                    <el-tag size="mini" type="warning" v-else-if="cfg.ioType" class="card-status-tag">
-                      待完善
-                    </el-tag>
-                    <el-tag size="mini" type="info" v-else class="card-status-tag">
-                      未填写
-                    </el-tag>
-                  </div>
-                  <div class="card-actions">
-                    <el-tooltip v-if="!cfg.gend" content="生成二维码" placement="top">
-                      <el-button v-loading="cfg.gening" type="text" size="mini" @click="handleGenerate(cfg, idx)"
-                        icon="el-icon-plus" :disabled="!isConfigValid(cfg)" class="action-btn">
-                      </el-button>
-                    </el-tooltip>
-                    <el-tooltip v-else content="变更内容" placement="top">
-                      <el-button type="text" size="mini" @click="handleEditContent(cfg, idx)" icon="el-icon-edit"
-                        class="action-btn"></el-button>
-                    </el-tooltip>
-                    <el-tooltip content="表单展示开关" placement="top">
-                      <el-button type="text" size="mini" @click="handleShowForm(cfg, idx)" icon="el-icon-setting"
-                        class="action-btn"></el-button>
-                    </el-tooltip>
-                    <el-tooltip content="另存为图片" placement="top">
-                      <el-button type="text" size="mini" @click="saveAsImage(idx)" icon="el-icon-download"
-                        :disabled="!isConfigValid(cfg) && cfg.gend" class="action-btn"></el-button>
-                    </el-tooltip>
-                    <el-tooltip content="删除配置" placement="top">
-                      <el-button type="text" size="mini" @click="handleDelete(cfg, idx)" icon="el-icon-delete"
-                        class="action-btn delete-btn"></el-button>
-                    </el-tooltip>
-                  </div>
-                </div>
-
-                <!-- 配置表单内容 - 优化间距、增加字段分组 -->
-                <div class="config-form-content" v-if="cfg.showForm">
-                  <el-row :gutter="8">
-                    <el-col :span="12">
-                      <el-form-item label="操作类型" :error="getError(cfg, 'ioType')" class="form-item">
-                        <el-select v-model="cfg.ioType" placeholder="请选择操作类型" class="form-select" @change="(value) => {
-                          const prefix = value == 'in' ? '入库' : value == 'out' ? '出库' : value == 'transfer' ? '移库' : ''
-                          cfg.text = prefix + '二维码' + new Date().getTime()
-                        }">
-                          <el-option label="入库" value="in" />
-                          <el-option label="出库" value="out" />
-                          <el-option label="移库" value="transfer" />
-                        </el-select>
-                      </el-form-item>
-                    </el-col>
-                    <el-col :span="12">
-                      <el-form-item
-                        :label="cfg.ioType == 'in' ? '入库单据号' : cfg.ioType == 'out' ? '出库单据号' : cfg.ioType == 'transfer' ? '移库单据号' : '单据号'"
-                        :error="getError(cfg, 'stockIoId')" class="form-item">
-                        <el-select clearable filterable size="mini" v-model="cfg.stockIoId" placeholder="请选择挂载单据"
-                          class="form-select" :disabled="!cfg.ioType">
-                          <el-option v-for="item in masterList.filter(i => i.ioType === cfg.ioType)"
-                            :key="item.stockIoId" :label="item.stockIoCode" :value="item.stockIoId" />
-                        </el-select>
-                      </el-form-item>
-                    </el-col>
-                  </el-row>
-                  <el-row :gutter="8">
-                    <el-col :span="12">
-                      <el-form-item label="目标仓库" :error="getError(cfg, 'warehouseId')" class="form-item">
-                        <WarehouseSelect v-model="cfg.warehouseId" :disabled="!cfg.ioType"
-                          @change="(warehouse) => onTargetWarehouseChange(cfg, idx, warehouse)" />
-                      </el-form-item>
-                    </el-col>
-                    <el-col :span="12" v-if="cfg.ioType === 'transfer'">
-                      <el-form-item label="源仓库" :error="getError(cfg, 'fromWarehouseId')" class="form-item">
-                        <WarehouseSelect v-model="cfg.fromWarehouseId" :disabled="!cfg.ioType"
-                          @change="(warehouse) => onFromWarehouseChange(cfg, idx, warehouse)" />
-                      </el-form-item>
-                    </el-col>
-                    <el-col :span="12" v-if="cfg.ioType === 'in'">
-                      <el-form-item label="备用单据" :error="getError(cfg, 'stockIoWaitId')" class="form-item">
-                        <el-select clearable filterable size="mini" v-model="cfg.stockIoWaitId" placeholder="请选择备用单据"
-                          class="form-select" :disabled="!cfg.ioType">
-                          <el-option v-for="item in masterList.filter(i => i.ioType === 'out')"
-                            :key="item.stockIoId" :label="item.stockIoCode" :value="item.stockIoId" />
-                        </el-select>
-                      </el-form-item>
-                    </el-col>
-                  </el-row>
-                  <el-row :gutter="8">
-                    <el-col :span="12">
-                      <el-form-item label="物料类型" :error="getError(cfg, 'itemType')" class="form-item">
-                        <el-select v-model="cfg.itemType" placeholder="请选择物料类型" class="form-select">
-                          <el-option v-for="dict in dict.type.stock_item_type" :key="dict.value" :label="dict.label"
-                            :value="dict.value" />
-                        </el-select>
-                      </el-form-item>
-                    </el-col>
-                    <el-col :span="12">
-                      <el-form-item label="物料信息" :error="getError(cfg, 'itemId')" class="form-item">
-                        <ProductSelect v-if="cfg.itemType === 'product'" v-model="cfg.itemId" placeholder="请选择产品"
-                          @change="onItemChange($event, idx)" :disabled="!cfg.itemType" />
-                        <SemiSelect v-else-if="cfg.itemType === 'semi'" v-model="cfg.itemId" placeholder="请选择半成品"
-                          @change="onItemChange($event, idx)" :disabled="!cfg.itemType" />
-                        <RawMaterialSelect v-else-if="cfg.itemType === 'raw_material'" v-model="cfg.itemId"
-                          placeholder="请选择原材料" @change="onItemChange($event, idx)" :disabled="!cfg.itemType" />
-                        <el-input v-else disabled v-model="cfg.itemId" placeholder="请先选择物料类型" style="width: 100%;" />
-                      </el-form-item>
-                    </el-col>
-                  </el-row>
-                  <el-row :gutter="8">
-                    <el-col :span="12">
-                      <el-form-item label="物料数量" :error="getError(cfg, 'quantity')" class="form-item">
-                        <el-input-number :controls=false controls-position="right" v-model="cfg.quantity" :min="1"
-                          :max="100" size="mini" placeholder="请输入数量" />
-                      </el-form-item>
-                    </el-col>
-                    <el-col :span="12">
-                      <el-form-item label="批次号" class="form-item">
-                        <el-input v-model="cfg.batchNo" size="mini" placeholder="请输入批次号" />
-                      </el-form-item>
-                    </el-col>
-                  </el-row>
-
-                  <el-row :gutter="8">
-                    <el-col :span="12">
-                      <el-form-item label="下方文字" class="form-item">
-                        <el-input v-model="cfg.text" size="mini" placeholder="例如：产品入库二维码" />
-                      </el-form-item>
-                    </el-col>
-                    <el-col :span="12">
-                      <el-form-item label="生成数量" class="form-item">
-                        <el-input v-model="cfg.totalCount" size="mini" placeholder="例如：产品入库二维码" />
-                      </el-form-item>
-                    </el-col>
-                  </el-row>
-
-                  <!-- 配置状态提示 - 优化背景色和图标 -->
-                  <div v-if="!isConfigValid(cfg) && cfg.ioType" class="config-warning">
-                    <i class="el-icon-warning-outline"></i>
-                    <span>请完善必填字段配置（标红项为未完成）</span>
-                  </div>
-                </div>
-              </div>
-            </el-form>
-          </div>
-        </div>
-      </el-col>
-    </el-row>
-  </div>
-</template>
-
-<script>
-// 保持原脚本逻辑不变，仅增加hover状态初始化
-import BarCode from '../../components/CodeRenderer.vue';
-import ProductSelect from '@/components/KLPService/ProductSelect/index.vue';
-import SemiSelect from '@/components/KLPService/SemiSelect/index.vue';
-import RawMaterialSelect from '@/components/KLPService/RawMaterialSelect/index.vue';
-import WarehouseSelect from '@/components/WarehouseSelect/index.vue';
-import { saveAsImage } from '@/utils/klp';
-import { listStockIo } from '@/api/wms/stockIo';
-import { addGenerateRecord, delGenerateRecord, updateGenerateRecord } from '@/api/wms/generateRecord';
-
-export default {
-  name: 'Print',
-  components: {
-    BarCode,
-    ProductSelect,
-    SemiSelect,
-    RawMaterialSelect,
-    WarehouseSelect
-  },
-  dicts: ['stock_item_type', 'stock_io_type'],
-  data() {
-    return {
-      drawerBarcodeData: [], // 条码数据
-      loading: false, // 加载状态
-      masterList: [], // 单据列表
-    };
-  },
-  mounted() {
-    this.fetchMaster();
-  },
-  computed: {
-    // 有效的二维码配置数量
-    validConfigCount() {
-      return this.drawerBarcodeData.filter(cfg => this.isConfigValid(cfg)).length;
-    },
-    // 所有配置是否都有效
-    isAllValid() {
-      return this.drawerBarcodeData.length > 0 &&
-        this.drawerBarcodeData.every(cfg => this.isConfigValid(cfg));
-    },
-    // 二维码配置数据
-    barCodeConfigs() {
-      return this.drawerBarcodeData
-        .filter(cfg => this.isConfigValid(cfg))
-        .map(b => ({
-          code: b.recordId,
-          count: b.totalCount,
-          textTpl: b.text || '二维码'
-        }));
-    }
-  },
-  methods: {
-    // 物料选择变更
-    onItemChange(item, idx) {
-      if (item && this.drawerBarcodeData[idx]) {
-        // 设置对应的物料名称
-        console.log(item, '物料信息');
-        const name = item.name || item.materialName || item.productName || item.rawMaterialName;
-        const code = item.code || item.materialCode || item.productCode || item.rawMaterialCode;
-        this.$set(this.drawerBarcodeData[idx], 'itemName', name);
-        this.$set(this.drawerBarcodeData[idx], 'itemCode', code);
-        // this.drawerBarcodeData[idx].unit = item.unit;
-        // 如果未设置数量，默认设置为1
-        if (!this.drawerBarcodeData[idx].count) {
-          this.drawerBarcodeData[idx].count = 1;
-        }
-      }
-    },
-    handleShowForm(cfg, idx) {
-      this.$set(this.drawerBarcodeData[idx], 'showForm', !this.drawerBarcodeData[idx].showForm);
-    },
-    handleEditContent(cfg, idx) {
-      updateGenerateRecord({
-        recordId: cfg.recordId,
-        content: JSON.stringify(this.drawerBarcodeData[idx])
-      }).then(res => {
-        this.$message.success('变更内容成功');
-      }).catch(err => {
-        this.$message.error('变更内容失败');
-      });
-    },
-    onTargetWarehouseChange(cfg, idx, warehouse) {
-      console.log(warehouse, '目标仓库');
-      this.$set(this.drawerBarcodeData[idx], 'warehouseName', warehouse.warehouseName);
-    },
-    onFromWarehouseChange(cfg, idx, warehouse) {
-      console.log(warehouse, '源仓库');
-      this.$set(this.drawerBarcodeData[idx], 'fromWarehouseName', warehouse.warehouseName);
-    },
-    // 获取单据列表
-    fetchMaster() {
-      this.loading = true;
-      listStockIo({ pageSize: 9999, pageNum: 1 })
-        .then(res => {
-          // 排除已完成的单据，因为已完成的但是不可以继续修改
-          this.masterList = res.rows.filter(item => item.status != 2) || [];
-        })
-        .catch(error => {
-          console.error("获取挂载单据失败", error);
-          this.$message.error("获取挂载单据失败，请稍后重试");
-        })
-        .finally(() => {
-          this.loading = false;
-        });
-    },
-    // 删除二维码配置
-    handleDelete(cfg, idx) {
-      this.$confirm('确定要删除这个二维码配置吗？', '确认删除', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {
-        const recordId = this.drawerBarcodeData[idx].recordId;
-        if (recordId) {
-          delGenerateRecord(recordId)
-        }
-        this.drawerBarcodeData.splice(idx, 1);
-        this.$message.success({
-          message: '删除成功',
-          duration: 1500
-        });
-      }).catch(() => {
-        // 取消删除
-      });
-    },
-    // 添加二维码配置 - 增加hover状态初始化
-    // randomBatchNo, 生成10位的批次号
-    randomBatchNo() {
-      const year = new Date().getFullYear();
-      const month = new Date().getMonth() + 1;
-      const day = new Date().getDate();
-      const hour = new Date().getHours();
-      const salt = Math.random().toString(36).substring(2, 4);
-
-      // 如果出现2月、3日，5点等需补全为02，03，05
-      function pad(num) {
-        return num < 10 ? '0' + num : num;
-      }
-      return year + pad(month) + pad(day) + pad(hour) + salt;
-    },
-    handleAdd() {
-      const newConfig = {
-        ioType: undefined,
-        stockIoId: undefined,
-        fromWarehouseId: undefined,
-        warehouseId: undefined,
-        itemType: undefined,
-        gend: false,
-        itemId: undefined,
-        // 年月日时 + 随机两个字符
-        batchNo: this.randomBatchNo(),
-        quantity: 1, // 默认数量1
-        totalCount: 1, // 默认数量1
-        unit: '',
-        text: '二维码', // 默认文字
-        hovered: false, // 新增hover状态，用于交互反馈,
-        showForm: true, // 新增表单展示开关
-        stockIoWaitId: undefined,
-      };
-
-      this.drawerBarcodeData.push(newConfig);
-
-      // 滚动到最新添加的配置
-      this.$nextTick(() => {
-        const container = document.querySelector('.left-container');
-        container.scrollTop = container.scrollHeight;
-      });
-    },
-    // 保存为图片
-    saveAsImage(index) {
-      const config = this.drawerBarcodeData[index];
-      if (!this.isConfigValid(config)) {
-        this.$message.warning('配置不完整，无法保存图片');
-        return;
-      }
-
-      try {
-        saveAsImage(
-          this.barCodeConfigs[index].code,
-          this.barCodeConfigs[index].textTpl,
-          index,
-          this
-        );
-        this.$message.success('图片保存成功');
-      } catch (error) {
-        console.error('保存图片失败', error);
-        this.$message.error('保存图片失败，请稍后重试');
-      }
-    },
-    // 清空所有配置
-    handleResetAll() {
-      this.$confirm('确定要清空所有二维码配置吗？此操作不可恢复', '确认清空', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {
-        this.drawerBarcodeData = [];
-        this.$message.success({
-          message: '已清空所有配置',
-          duration: 1500
-        });
-      }).catch(() => {
-        // 取消清空
-      });
-    },
-    // 打印预览 - 增加加载状态提示
-    handlePrintPreview() {
-      document.querySelector('#previewIframe').contentWindow.print();
-    },
-    handleGenerate(cfg, idx) {
-      // 乐观更新，直接隐藏按钮
-      // this.$set(this.drawerBarcodeData[idx], 'gend', true);
-      this.$set(this.drawerBarcodeData[idx], 'gening', true);
-      // 发送网络请求保存已经生成的二维码
-      addGenerateRecord({
-        content: JSON.stringify(this.drawerBarcodeData[idx]),
-        recordType: 1, // recordType为1的时候生成的是一次性的出入库记录码
-        size: 90,
-        serialNumber: new Date().getTime(),
-        remark: '',
-      }).then(res => {
-        console.log(res, '生成的二维码数据')
-        this.$message.success('生成二维码成功');
-        this.$set(this.drawerBarcodeData[idx], 'recordId', res.data.recordId);
-        this.$set(this.drawerBarcodeData[idx], 'gend', true);
-      }).catch(err => {
-        // 如果请求失败，则回滚乐观更新
-        this.$message.error('生成二维码失败');
-        // this.$set(this.drawerBarcodeData[idx], 'gend', false);
-      }).finally(() => {
-        this.$set(this.drawerBarcodeData[idx], 'gening', false);
-      });
-    },
-    // 验证单个配置是否有效
-    isConfigValid(cfg) {
-      if (!cfg) return false;
-
-      // 基础必填字段验证
-      const basicValid = !!cfg.ioType && !!cfg.stockIoId && !!cfg.warehouseId;
-      // 移库需要额外验证源仓库
-      const transferValid = cfg.ioType !== 'transfer' || !!cfg.fromWarehouseId;
-      // 物料相关验证
-      const itemValid = !!cfg.itemType && !!cfg.itemId && !!cfg.quantity && cfg.quantity >= 1;
-
-      return basicValid && transferValid && itemValid;
-    },
-    // 获取字段错误信息
-    getError(cfg, field) {
-      if (!cfg.ioType) return '';
-
-      switch (field) {
-        case 'ioType':
-          return !cfg.ioType ? '请选择操作类型' : '';
-        case 'stockIoId':
-          return !cfg.stockIoId ? '请选择挂载单据' : '';
-        case 'warehouseId':
-          return !cfg.warehouseId ? '请选择目标仓库' : '';
-        case 'fromWarehouseId':
-          return cfg.ioType === 'transfer' && !cfg.fromWarehouseId ? '请选择源仓库' : '';
-        case 'itemType':
-          return !cfg.itemType ? '请选择物料类型' : '';
-        case 'itemId':
-          return !cfg.itemId ? '请选择物料信息' : '';
-        case 'quantity':
-          return !cfg.quantity || cfg.quantity < 1 ? '请输入有效的数量（至少1）' : '';
-        default:
-          return '';
-      }
-    }
-  }
-};
-</script>
-
-<style scoped lang="scss">
-// 全局变量定义 - 便于统一维护
-$primary-color: #409eff;
-$success-color: #67c23a;
-$warning-color: #e6a23c;
-$danger-color: #f56c6c;
-$gray-light: #f5f7fa;
-$gray-mid: #e5e7eb;
-$gray-dark: #6b7280;
-$text-primary: #1f2329;
-$text-secondary: #6b7280;
-$card-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
-$card-hover-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
-
-// 页面整体容器 - 优化高度计算、增加内边距
-.print-page-container {
-  padding: 16px 20px; // Slightly reduced padding
-  height: calc(100vh - 100px);
-  box-sizing: border-box;
-  overflow: hidden;
-}
-
-// 页面标题栏 - 增加面包屑、优化布局
-.page-header {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  margin-bottom: 16px; // Reduced space between header and content
-  padding-bottom: 8px;
-  border-bottom: 1px solid $gray-mid;
-
-  .header-breadcrumb {
-    .el-breadcrumb {
-      margin-bottom: 4px;
-    }
-
-    .page-title {
-      font-size: 18px; // Slightly smaller title
-      font-weight: 600;
-      color: $text-primary;
-      margin: 0;
-    }
-  }
-
-  .header-actions {
-    display: flex;
-    gap: 12px; // Reduced gap between buttons
-
-    .btn-reset {
-      padding: 6px 12px; // Smaller padding
-      transition: all 0.2s ease;
-    }
-
-    .btn-print {
-      padding: 6px 12px; // Smaller padding
-      transition: all 0.2s ease;
-    }
-  }
-}
-
-// 主内容区 - 优化间距
-.main-content {
-  height: calc(100% - 80px);
-  display: flex;
-  gap: 16px; // Reduced gap between left and right content
-
-  .left-col,
-  .right-col {
-    height: 100%;
-    display: flex;
-    flex-direction: column;
-  }
-
-  .card-container {
-    padding: 1px;
-    flex: 1;
-    overflow: hidden;
-  }
-}
-
-// 左侧容器 - 优化滚动体验
-.left-container {
-  height: 100%;
-  overflow-y: auto;
-  overflow-x: hidden;
-  flex: 1;
-
-  &:hover {
-    ::-webkit-scrollbar {
-      width: 6px;
-      height: 6px;
-      display: block;
-    }
-
-    ::-webkit-scrollbar-track {
-      display: block;
-      border-radius: 3px;
-    }
-  }
-}
-
-// 配置卡片 - 优化阴影和间距
-.config-card {
-  border-radius: 8px;
-  transition: all 0.3s ease;
-  overflow: hidden;
-  border: 1px solid $gray-mid;
-}
-
-// 配置卡片头部 - 优化布局和样式
-.config-card-header {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  padding: 10px 12px; // Reduced padding
-
-  .card-title-wrap {
-    display: flex;
-    align-items: center;
-    gap: 6px; // Reduced gap between elements
-
-    .card-index {
-      width: 18px; // Smaller index
-      height: 18px; // Smaller index
-      font-size: 10px; // Smaller font size for index
-    }
-
-    .card-title {
-      font-size: 12px; // Smaller title
-      color: white
-    }
-
-    .card-status-tag {
-      margin-left: 6px; // Reduced margin
-    }
-  }
-
-  .card-actions {
-    display: flex;
-    gap: 0px; // Reduced gap between actions
-
-    .action-btn {
-      color: #2bf !important;
-      transition: color 0.2s ease;
-      font-size: 12px; // Reduced font size for actions
-
-      &:hover {
-        color: $primary-color;
-      }
-
-      &.delete-btn {
-        color: $danger-color;
-
-        &:hover {
-          color: #e53e3e !important;
-        }
-      }
-
-      &:disabled {
-        color: $gray-dark;
-        opacity: 0.5;
-        cursor: not-allowed;
-      }
-    }
-  }
-}
-
-// 配置表单内容 - 优化间距和分组
-.config-form-content {
-  padding: 12px; // Reduced padding
-
-  .form-group {
-    margin-bottom: 12px; // Reduced spacing between groups
-
-    .group-title {
-      font-size: 12px; // Smaller font size for group title
-      margin-bottom: 8px; // Reduced margin
-    }
-  }
-
-  .form-item {
-    margin-bottom: 8px !important; // Reduced spacing between form items
-  }
-
-  .form-select {
-    width: 100% !important;
-  }
-
-  .config-warning {
-    margin-top: 8px; // Reduced margin
-    padding: 8px 10px; // Reduced padding
-    font-size: 12px; // Smaller font size
-  }
-}
-
-// 空状态样式 - 优化间距和图标
-.empty-state,
-.preview-empty {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  padding: 40px 0; // Reduced padding
-  color: $text-secondary;
-  text-align: center;
-
-  .empty-icon {
-    font-size: 48px; // Slightly smaller icon
-    color: $gray-mid;
-    margin-bottom: 16px; // Reduced margin
-  }
-
-  .empty-text {
-    font-size: 14px; // Slightly smaller text
-    margin-bottom: 6px; // Reduced margin
-  }
-
-  .empty-desc {
-    font-size: 12px; // Smaller description text
-    margin-bottom: 16px;
-  }
-
-  .empty-action-btn {
-    padding: 4px 12px; // Smaller button padding
-    font-size: 12px; // Smaller font size
-  }
-}
-
-// 响应式调整 - 优化小屏幕体验
-@media (max-width: 1200px) {
-  .main-content {
-    flex-direction: column;
-    gap: 16px;
-  }
-
-  .left-col,
-  .right-col {
-    span: 24;
-  }
-
-  .print-page-container {
-    padding: 12px; // Reduced padding for smaller screens
-  }
-
-  .page-header {
-    flex-direction: column;
-    align-items: flex-start;
-    gap: 8px; // Reduced gap
-  }
-}
-
-@media print {
-
-  .page-header,
-  .left-col,
-  .preview-count {
-    display: none !important;
-  }
-
-  .print-page-container,
-  .main-content,
-  .right-col,
-  .card-container,
-  .right-container,
-  .preview-content {
-    height: auto !important;
-    padding: 0 !important;
-    margin: 0 !important;
-    box-shadow: none !important;
-    border: none !important;
-  }
-
-  .barcode-renderer {
-    gap: 20px; // Reduced gap for print
-    justify-content: center;
-  }
-}
-</style>
--- a/klp-ui/src/views/wms/print/read.vue
+++ b/klp-ui/src/views/wms/print/read.vue
@@ -1,360 +0,0 @@
-<template>
-  <div class="qr-parser-container">
-
-    <div class="card">
-      <el-alert title="请将当前输入法切换到英文输入后再进行扫码操作" type="warning"></el-alert>
-      <div class="card-header">
-        <h2 class="title">二维码解析器</h2>
-        <p class="subtitle">扫描或输入二维码内容进行解析</p>
-      </div>
-
-      <div class="input-section">
-        <el-input v-model="text" @input="handleInput" @blur="handleBlur" ref="textarea"
-          placeholder="请扫描二维码或粘贴二维码文本内容..." :rows="3" type="textarea"
-          :class="{ 'invalid-input': !isValid && text.length > 0 }" />
-        <div class="input-hint">
-          <i class="el-icon-info-circle"></i>
-          <span>{{ inputHint }}</span>
-        </div>
-      </div>
-
-      <!-- 加载状态 -->
-      <el-loading v-if="isLoading" text="正在解析数据..." class="loading-overlay"></el-loading>
-
-      <!-- 二维码解析结果 - 只有数据有效时才显示 -->
-      <div v-if="isValid" class="result-section fade-in">
-        <div class="result-header">
-          <h3>解析结果</h3>
-          <el-tag :type="result.ioType === 'in' ? 'success' : 'warning'" size="small">
-            {{ result.ioType === 'in' ? '入库' : '出库' }}
-          </el-tag>
-        </div>
-
-        <el-descriptions :column="1" border class="result-table">
-          <el-descriptions-item label="出入库类型" :span="1">
-            {{ result.ioType === 'in' ? '入库' : '出库' }}
-          </el-descriptions-item>
-          <el-descriptions-item label="物料类型" :span="1">
-            {{ formatItemType(result.itemType) }}
-          </el-descriptions-item>
-          <el-descriptions-item label="物料信息" :span="1">
-            <ProductInfo v-if="result.itemType === 'product' || result.itemType === 'semi'"
-              :productId="result.itemId" />
-            <RawMaterialInfo v-else-if="result.itemType === 'raw_material'" :materialId="result.itemId" />
-            <el-input v-else disabled v-model="result.itemId" placeholder="未知物料" :disabled="true"
-              style="width: 100%;" />
-          </el-descriptions-item>
-          <el-descriptions-item label="数量" :span="1">
-            {{ result.quantity }}
-          </el-descriptions-item>
-        </el-descriptions>
-
-        <div class="action-buttons">
-          <el-button type="primary" @click="handleSubmit" :loading="isSubmitting" icon="el-icon-check">
-            确认执行
-          </el-button>
-          <el-button type="default" @click="handleReset" icon="el-icon-refresh-right">
-            重置
-          </el-button>
-        </div>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script>
-import ProductInfo from '@/components/KLPService/Renderer/ProductInfo';
-import RawMaterialInfo from '@/components/KLPService/Renderer/RawMaterialInfo';
-import { getGenerateRecord } from '@/api/wms/generateRecord';
-import { addStockIoDetail } from '@/api/wms/stockIoDetail';
-
-// 通用防抖高阶函数（可放在工具类中全局复用）
-function debounce(fn, delay = 300) {
-  let debounceTimer = null; // 闭包保存定时器，避免重复创建
-
-  // 返回被包装后的函数（支持传递参数给业务函数）
-  return function (...args) {
-    // 1. 清除上一次未执行的定时器（核心：避免短时间内重复触发）
-    if (debounceTimer) {
-      clearTimeout(debounceTimer);
-    }
-
-    // 2. 延迟执行业务函数，this 绑定到调用者（适配 Vue 组件上下文）
-    debounceTimer = setTimeout(() => {
-      fn.apply(this, args); // 传递参数+保持this指向（Vue组件实例）
-    }, delay);
-  };
-}
-
-export default {
-  data() {
-    return {
-      text: '',
-      isLoading: false,
-      isSubmitting: false,
-      inputHint: '请输入二维码内容，系统将自动解析',
-    };
-  },
-  components: {
-    ProductInfo,
-    RawMaterialInfo,
-  },
-  created() {
-     // 包装“输入解析+提交”的业务函数，生成带防抖的版本
-     this.debouncedHandleInput = debounce(
-      this.actualParseAndSubmit, // 实际的业务逻辑函数
-      500       // 防抖延迟时间
-    );
-  },
-  computed: {
-    result() {
-      try {
-        const text = JSON.parse(this.text)
-        return text;
-      } catch (error) {
-        return {};
-      }
-    },
-    // 验证数据是否有效
-    isValid() {
-      const requiredFields = ['ioType', 'itemType', 'itemId', 'quantity'];
-      // 检查是否包含所有必要字段
-      const hasAllFields = requiredFields.every(field => this.result.hasOwnProperty(field));
-      // 检查出入库类型是否有效
-      const isIoTypeValid = this.result.ioType === 'in' || this.result.ioType === 'out';
-      // 检查物料类型是否有效
-      const isItemTypeValid = ['product', 'semi', 'raw_material'].includes(this.result.itemType);
-      // 检查数量是否为有效数字
-      const isQuantityValid = !isNaN(Number(this.result.quantity)) && Number(this.result.quantity) > 0;
-
-      return hasAllFields && isIoTypeValid && isItemTypeValid && isQuantityValid;
-    }
-  },
-  methods: {
-    handleInput(value) {
-      const trimmedValue = value.trim();
-
-      // 空值场景：立即反馈，不触发防抖逻辑
-      if (!trimmedValue) {
-        this.inputHint = "请输入二维码内容，系统将自动解析";
-        return;
-      }
-
-      // 基础校验不通过：立即反馈，不触发防抖逻辑
-      if (!this.isValid) {
-        this.inputHint = "输入内容不符合基础格式要求，请检查";
-        return;
-      }
-
-      // 触发防抖后的业务逻辑（此时已自动防抖）
-      this.debouncedHandleInput(trimmedValue);
-    },
-
-    // 5. 实际的“JSON解析+提交”业务逻辑（纯业务，无防抖代码）
-    async actualParseAndSubmit(validValue) {
-      this.isLoading = true;
-      try {
-        // 1. 解析JSON
-        const res = await getGenerateRecord(validValue);
-        const parsedData = JSON.stringify(res.data.content);
-
-        this.result = parsedData;
-        // 3. 解析成功：反馈+提交
-        this.inputHint = "数据解析成功，可以提交操作";
-        this.$message.success({
-          message: "数据解析成功",
-          duration: 1500,
-        });
-        this.handleSubmit(parsedData); // 调用提交接口
-      } catch (error) {
-        // 6. 解析失败：错误处理
-        this.inputHint = "无法解析数据，请确保输入的是有效的二维码内容";
-        this.$message.error({
-          message: "解析失败，请检查输入内容",
-          duration: 2000,
-        });
-      } finally {
-        // 7. 无论成功/失败，结束加载状态
-        this.isLoading = false;
-      }
-    },
-
-    handleBlur() {
-      // 自动重新聚焦，方便连续扫描
-      this.$nextTick(() => {
-        this.$refs.textarea.focus();
-      });
-    },
-    handleSubmit() {
-      if (!this.isValid) return;
-
-      this.isSubmitting = true;
-
-      addStockIoDetail({
-        ...this.result,
-        recordType: 1, // recordType为1标识扫码录入
-      })
-        .then(res => {
-          this.$message.success({
-            message: '操作成功',
-            duration: 2000
-          });
-        })
-        .catch(err => {
-          this.$message.error({
-            message: '操作失败: ' + (err.message || '未知错误'),
-            duration: 3000
-          });
-        })
-        .finally(() => {
-          this.isSubmitting = false;
-          // 提交成功后重置表单，方便下一次操作
-          this.handleReset();
-        });
-    },
-    handleReset() {
-      this.text = '';
-      this.inputHint = '请输入二维码内容，系统将自动解析';
-      // 重置后重新聚焦
-      this.$nextTick(() => {
-        this.$refs.textarea.focus();
-      });
-    },
-    // 格式化物料类型显示文本
-    formatItemType(type) {
-      const typeMap = {
-        'product': '成品',
-        'semi': '半成品',
-        'raw_material': '原材料'
-      };
-      return typeMap[type] || '未知类型';
-    }
-  },
-  mounted() {
-    // 确保组件挂载后自动聚焦
-    this.$nextTick(() => {
-      this.$refs.textarea.focus();
-    });
-  }
-}
-</script>
-
-<style scoped>
-.qr-parser-container {
-  display: flex;
-  justify-content: center;
-  padding: 20px;
-  background-color: #f5f7fa;
-  min-height: 100vh;
-}
-
-.card {
-  width: 100%;
-  background: #fff;
-  border-radius: 10px;
-  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
-  overflow: hidden;
-}
-
-.card-header {
-  padding: 20px 24px;
-  border-bottom: 1px solid #e8e8e8;
-}
-
-.title {
-  margin: 0;
-  font-size: 20px;
-  color: #1f2329;
-  font-weight: 600;
-}
-
-.subtitle {
-  margin: 5px 0 0;
-  font-size: 14px;
-  color: #6b7280;
-}
-
-.input-section {
-  padding: 24px;
-}
-
-.el-input {
-  transition: all 0.3s ease;
-}
-
-.el-input.invalid-input .el-textarea__inner {
-  border-color: #f56c6c;
-  box-shadow: 0 0 0 2px rgba(245, 108, 108, 0.2);
-}
-
-.input-hint {
-  margin-top: 8px;
-  font-size: 12px;
-  color: #6b7280;
-  display: flex;
-  align-items: center;
-}
-
-.input-hint i {
-  margin-right: 4px;
-  font-size: 14px;
-}
-
-.result-section {
-  padding: 0 24px 24px;
-}
-
-.result-header {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  margin-bottom: 16px;
-}
-
-.result-header h3 {
-  margin: 0;
-  font-size: 16px;
-  color: #1f2329;
-  font-weight: 500;
-}
-
-.result-table {
-  margin-bottom: 24px;
-}
-
-.action-buttons {
-  display: flex;
-  gap: 12px;
-  justify-content: flex-end;
-}
-
-.loading-overlay {
-  position: absolute;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-  background-color: rgba(255, 255, 255, 0.7);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  z-index: 10;
-}
-
-/* 淡入动画 */
-.fade-in {
-  animation: fadeIn 0.5s ease-in-out;
-}
-
-@keyframes fadeIn {
-  from {
-    opacity: 0;
-    transform: translateY(10px);
-  }
-
-  to {
-    opacity: 1;
-    transform: translateY(0);
-  }
-}
-</style>
--- a/klp-ui/src/views/wms/print/scaner.vue
+++ b/klp-ui/src/views/wms/print/scaner.vue
@@ -1,480 +0,0 @@
-<template>
-  <el-row class="container" :gutter="20">
-    <el-col :span="4" class="device-panel">
-      <div class="panel-header">
-        <h3>设备列表</h3>
-        <el-button size="mini" type="primary" @click="refreshDevices">刷新</el-button>
-      </div>
-      <div class="device-stats">
-        <span>总设备: {{ deviceStats.totalCount || 0 }}</span>
-        <span>活跃设备: {{ deviceStats.activeCount || 0 }}</span>
-      </div>
-      <ul class="device-list">
-        <li v-for="item in deviceList" :key="item.id" class="device-item" :class="{ active: item.isActive }">
-          <div class="device-status" :class="{ online: item.isActive }"></div>
-          <div class="device-info">
-            <span class="device-name">{{ item.name }}</span>
-            <span class="device-id">{{ item.id }}</span>
-            <span class="device-ip">{{ item.ip }}</span>
-          </div>
-        </li>
-      </ul>
-    </el-col>
-    <!-- <el-col :span="20" class="main-panel">
-      <div class="form-panel">
-        <el-form inline>
-          <el-form-item label="目标库位" class="form-item">
-            <WarehouseSelect size="mini" style="width: 200px;" v-model="defaultForm.warehouseId" />
-          </el-form-item>
-          <el-form-item label="挂载单据" class="form-item">
-            <el-select size="mini" filterable v-model="defaultForm.stockIoId" placeholder="请选择挂载单据" clearable class="form-input">
-              <el-option
-                v-for="item in masterList"
-                :key="item.stockIoId"
-                :label="item.stockIoCode"
-                :value="item.stockIoId"
-              />
-            </el-select>
-          </el-form-item>
-          <el-form-item label="数量" class="form-item">
-            <el-input size="mini" v-model="defaultForm.quantity" class="form-input" />
-          </el-form-item>
-          <el-form-item label="记录类型" class="form-item">
-            <el-select size="mini" v-model="defaultForm.ioType" placeholder="请选择操作类型" clearable class="form-input">
-              <el-option label="入库" value="in" />
-              <el-option label="出库" value="out" />
-            </el-select>
-          </el-form-item>
-          <el-form-item label="批次号" class="form-item">
-            <el-input size="mini" v-model="defaultForm.batchNo" class="form-input" />
-          </el-form-item>
-          <el-button type="primary" :disabled="selectedList.length === 0" @click="handleBatchConfirm">批量确认</el-button>
-        </el-form>
-      </div>
-      <div class="table-panel">
-        <KLPTable height="100%" :data="messageList" style="width: 100%" class="message-table" stripe @selection-change="handleSelectionChange">
-          <el-table-column type="selection" width="55" align="center" />
-          <el-table-column prop="time" label="时间" width="150" align="center" />
-          <el-table-column prop="itemId" label="物料" align="center">
-            <template #default="scope">
-              <ProductInfo v-if="scope.row.itemType == 'product' || scope.row.itemType == 'semi'" :productId="scope.row.itemId" />
-              <RawMaterialInfo v-else :materialId="scope.row.itemId" />
-            </template>
-          </el-table-column>
-          <el-table-column label="存储位置" align="center">
-            <template #default="scope">
-              <ELWarehouseSelect v-model="scope.row.warehouseId" />
-            </template>
-          </el-table-column>
-          <el-table-column prop="stockIoId" label="挂载单据" align="center">
-            <template #default="scope">
-              <el-select v-model="scope.row.stockIoId" filterable placeholder="请选择挂载单据" clearable class="table-select">
-                  <el-option
-                    v-for="item in masterList"
-                    :key="item.stockIoId"
-                    :label="item.stockIoCode"
-                    :value="item.stockIoId"
-                />
-              </el-select>
-            </template>
-          </el-table-column>
-          <el-table-column prop="quantity" label="数量" align="center">
-            <template #default="scope">
-              <el-input v-model="scope.row.quantity" class="table-input" />
-            </template>
-          </el-table-column>
-          <el-table-column prop="ioType" label="操作类型" align="center">
-            <template #default="scope">
-              <el-select v-model="scope.row.ioType" placeholder="请选择操作类型" clearable class="table-select">
-                <el-option
-                  v-for="dict in dict.type.stock_io_type"
-                  :key="dict.value"
-                  :label="dict.label"
-                  :value="dict.value"
-                />
-              </el-select>
-            </template>
-          </el-table-column>
-          <el-table-column prop="batchNo" label="批次号" align="center">
-            <template #default="scope">
-              <el-input v-model="scope.row.batchNo" class="table-input" />
-            </template>
-          </el-table-column>
-          <el-table-column label="操作" align="center" width="140" fixed="right">
-            <template #default="scope">
-              <el-button size="mini" type="text" @click="handleDelete(scope.row)">删除</el-button>
-              <el-button size="mini" type="text" @click="handleConfirm(scope.row)">确认</el-button>
-            </template>
-          </el-table-column>
-        </KLPTable>
-      </div>
-    </el-col> -->
-  </el-row>
-</template>
-
-<script>
-import { listStockIo, scanInStock, scanOutStock } from '@/api/wms/stockIo';
-import { addStockIoDetail } from '@/api/wms/stockIoDetail';
-import WarehouseSelect from '@/components/WarehouseSelect/index.vue';
-import ELWarehouseSelect from '@/components/KLPService/WarehouseSelect/index.vue';
-import ProductInfo from '@/components/KLPService/Renderer/ProductInfo.vue';
-import RawMaterialInfo from '@/components/KLPService/Renderer/RawMaterialInfo.vue';
-
-export default {
-  components: {
-    WarehouseSelect,
-    ELWarehouseSelect,
-    ProductInfo,
-    RawMaterialInfo,
-  },
-  data() {
-    return {
-      deviceList: [],
-      deviceStats: {
-        totalCount: 0,
-        activeCount: 0
-      },
-      messageList: [],
-      socket: null,
-      defaultForm: {
-        ioType: '',
-        stockIoId: '',
-        quantity: 1,
-        warehouseId: '',
-        batchNo: '',
-      },
-      masterList: [],
-      selectedList: [],
-    };
-  },
-  dicts: ['stock_io_type'],
-  mounted() {
-    this.initSocket();
-    this.fetchMaster();
-  },
-  beforeDestroy() {
-    // 组件销毁时关闭WebSocket连接
-    if (this.socket) {
-      this.socket.close();
-    }
-  },
-  methods: {
-    initSocket() {
-      // 处理WebSocket连接
-      this.socket = new WebSocket("ws://localhost:9000/ws");
-
-      this.socket.onopen = () => {
-        console.log("Socket 连接已建立");
-      };
-
-      this.socket.onmessage = (event) => {
-        try {
-          const data = JSON.parse(event.data);
-
-          // 处理设备列表数据
-          if (data.type === "allDevices") {
-            console.log("获取设备列表", data);
-            this.deviceList = data.devices || [];
-            this.deviceStats = {
-              totalCount: data.totalCount || 0,
-              activeCount: data.activeCount || 0
-            };
-          }
-          // 处理扫描消息
-          else if (data.type === "scanMessage") {
-            console.log("获取扫描消息", data);
-            this.messageList.push({
-              time: new Date().toLocaleString(),
-              itemId: data.itemId,
-              itemType: data.itemType,
-              stockIoId: this.defaultForm.stockIoId,
-              quantity: this.defaultForm.quantity,
-              ioType: this.defaultForm.ioType,
-              warehouseId: this.defaultForm.warehouseId,
-              batchNo: this.defaultForm.batchNo,
-              unit: '个'
-            });
-          }
-        } catch (error) {
-          console.error("解析WebSocket消息失败", error);
-        }
-      };
-
-      this.socket.onclose = () => {
-        console.log("Socket 连接已关闭");
-        // 连接关闭后尝试重连
-        setTimeout(() => {
-          this.initSocket();
-        }, 5000);
-      };
-
-      this.socket.onerror = (error) => {
-        console.error("Socket 错误", error);
-      };
-    },
-
-    // 刷新设备列表
-    refreshDevices() {
-      if (this.socket && this.socket.readyState === WebSocket.OPEN) {
-        this.socket.send(JSON.stringify({ type: "refreshDevices" }));
-      } else {
-        this.$message.warning("WebSocket连接未建立，无法刷新设备列表");
-        // 尝试重新连接
-        this.initSocket();
-      }
-    },
-
-    fetchMaster() {
-      listStockIo({ pageSize: 9999, pageNum: 1 }).then(res => {
-        console.log("获取挂载单据", res);
-        this.masterList = res.rows || [];
-      }).catch(error => {
-        console.error("获取挂载单据失败", error);
-        this.$message.error("获取挂载单据失败");
-      });
-    },
-
-    handleDeviceChange(item) {
-      this.socket.send(
-        JSON.stringify({
-          type: "toggleDevice",
-          deviceId: item.id,
-        })
-      );
-    },
-
-    handleBatchConfirm() {
-      // 汇总会导致的库存变更，需要确认
-      console.log("批量确认", this.selectedList);
-      if (this.selectedList.length === 0) {
-        this.$message.warning("请选择需要确认的记录");
-        return;
-      }
-
-      // 批量处理逻辑
-      Promise.all(this.selectedList.map(item => this.processRecord(item)))
-        .then(() => {
-          this.$message.success("批量确认成功");
-          // 从列表中移除已确认的项
-          this.messageList = this.messageList.filter(
-            item => !this.selectedList.some(selected => selected.time === item.time)
-          );
-          this.selectedList = [];
-        })
-        .catch(error => {
-          console.error("批量确认失败", error);
-          this.$message.error("批量确认失败");
-        });
-    },
-
-    handleSelectionChange(selection) {
-      this.selectedList = selection;
-    },
-
-    handleDelete(row) {
-      this.messageList = this.messageList.filter(item => item.time !== row.time);
-    },
-
-    async handleConfirm(row) {
-      try {
-        await this.processRecord(row);
-        this.handleDelete(row);
-        this.$message.success('确认成功');
-      } catch (error) {
-        console.error("确认失败", error);
-        this.$message.error('确认失败');
-      }
-    },
-
-    // 处理单条记录的确认逻辑
-    async processRecord(row) {
-      // 插入记录
-      await this.insertRecord({...row, recordType: 1});
-      // 更新库存
-      await this.updateStock(row);
-    },
-
-    insertRecord(row) {
-      return addStockIoDetail(row);
-    },
-
-    updateStock(row) {
-      if (row.ioType === 'in') {
-        return scanInStock(row);
-      } else {
-        return scanOutStock(row);
-      }
-    }
-  },
-};
-</script>
-
-<style scoped>
-.container {
-  height: calc(100vh - 100px);
-  padding: 20px;
-  background-color: #f5f7fa;
-}
-
-.device-panel {
-  background-color: #fff;
-  border-radius: 8px;
-  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
-  padding: 0 !important;
-  height: calc(100vh - 40px);
-  display: flex;
-  flex-direction: column;
-}
-
-.panel-header {
-  padding: 15px 20px;
-  border-bottom: 1px solid #ebeef5;
-  background-color: #f8fafc;
-  border-radius: 8px 8px 0 0;
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-}
-
-.panel-header h3 {
-  margin: 0;
-  font-size: 16px;
-  color: #303133;
-  font-weight: 500;
-}
-
-/* 设备统计信息 */
-.device-stats {
-  padding: 10px 20px;
-  border-bottom: 1px solid #ebeef5;
-  display: flex;
-  justify-content: space-between;
-  font-size: 13px;
-  color: #606266;
-}
-
-.device-list {
-  flex: 1;
-  overflow-y: auto;
-  margin: 0;
-  padding: 0;
-}
-
-.device-item {
-  display: flex;
-  align-items: center;
-  padding: 12px 20px;
-  border-bottom: 1px solid #ebeef5;
-  transition: background-color 0.3s;
-  cursor: pointer;
-}
-
-.device-item:hover {
-  background-color: #f5f7fa;
-}
-
-/* 设备状态指示器 */
-.device-status {
-  width: 10px;
-  height: 10px;
-  border-radius: 50%;
-  background-color: #ccc;
-  margin-right: 12px;
-}
-
-.device-status.online {
-  background-color: #42b983; /* 绿色表示在线 */
-}
-
-.device-info {
-  flex: 1;
-}
-
-.device-name {
-  display: block;
-  font-weight: 500;
-  color: #303133;
-  margin-bottom: 4px;
-}
-
-.device-id {
-  display: block;
-  font-size: 12px;
-  color: #606266;
-  margin-bottom: 2px;
-}
-
-.device-ip {
-  display: block;
-  font-size: 12px;
-  color: #909399;
-}
-
-/* 活跃设备高亮 */
-.device-item.active {
-  background-color: #f0f9eb;
-}
-
-.form-panel {
-  background-color: #fff;
-  border-radius: 8px;
-  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
-  padding: 15px 20px;
-  margin-bottom: 20px;
-  display: flex;
-  flex-wrap: wrap;
-}
-
-.filter-form {
-  display: flex;
-  align-items: center;
-}
-
-.form-item {
-  margin-bottom: 0 !important;
-  margin-right: 15px;
-}
-
-.form-input {
-  width: 180px;
-}
-
-.table-panel {
-  flex: 1;
-  height: calc(100vh - 220px);
-  background-color: #fff;
-  border-radius: 8px;
-  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
-  overflow: hidden;
-  display: flex;
-  flex-direction: column;
-}
-
-.message-table {
-  flex: 1;
-  border-radius: 8px;
-  overflow: hidden;
-}
-
-.table-select {
-  width: 100%;
-}
-
-.table-input {
-  width: 100%;
-}
-
-.el-table::before {
-  height: 0;
-}
-
-.el-table th {
-  background-color: #f8fafc !important;
-  color: #606266;
-  font-weight: 500;
-}
-
-.el-table td, .el-table th {
-  padding: 12px 0;
-}
-</style>
--- a/klp-ui/src/views/wms/warehouse/real.vue
+++ b/klp-ui/src/views/wms/warehouse/real.vue
@@ -337,7 +337,7 @@ import {
  importActualWarehouse,
  treeActualWarehouseTwoLevel
 } from "@/api/wms/actualWarehouse";
-import QRCode from "../print/components/QRCode.vue";
+import QRCode from "@/components/QRCode";
 import ActualWarehouseSelect from "@/components/KLPService/ActualWarehouseSelect";
 import { listActualWarehouse } from "../../../api/wms/actualWarehouse";