✨ feat: 生产管理初步重构

klp-ui/src/views/wms/category/index.vue

@@ -3,30 +3,18 @@
     <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
       <el-form-item label="分类类型" prop="categoryType">
         <el-select v-model="queryParams.categoryType" placeholder="请选择分类类型" clearable>
-          <el-option
-            v-for="dict in dict.type.category_type"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
+          <el-option v-for="dict in dict.type.category_type" :key="dict.value" :label="dict.label"
+            :value="dict.value" />
         </el-select>
       </el-form-item>
       <el-form-item label="分类名称" prop="categoryName">
-        <el-input
-          v-model="queryParams.categoryName"
-          placeholder="请输入分类名称"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
+        <el-input v-model="queryParams.categoryName" placeholder="请输入分类名称" clearable
+          @keyup.enter.native="handleQuery" />
       </el-form-item>
       <el-form-item label="是否启用" prop="isEnabled">
         <el-select v-model="queryParams.isEnabled" placeholder="请选择是否启用" clearable>
-          <el-option
-            v-for="dict in dict.type.common_swicth"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
+          <el-option v-for="dict in dict.type.common_swicth" :key="dict.value" :label="dict.label"
+            :value="dict.value" />
         </el-select>
       </el-form-item>
       <el-form-item>
@@ -37,42 +25,18 @@
 
     <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-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-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-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-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>
@@ -81,7 +45,7 @@
       <el-table-column type="selection" width="55" align="center" />
       <el-table-column label="分类类型" align="center" prop="categoryType">
         <template slot-scope="scope">
-          <dict-tag :options="dict.type.category_type" :value="scope.row.categoryType"/>
+          <dict-tag :options="dict.type.category_type" :value="scope.row.categoryType" />
         </template>
       </el-table-column>
       <el-table-column label="分类编码" align="center" prop="categoryCode" />
@@ -90,46 +54,27 @@
       <el-table-column label="备注" align="center" prop="remark" />
       <el-table-column label="是否启用" align="center" prop="isEnabled">
         <template slot-scope="scope">
-          <dict-tag :options="dict.type.common_swicth" :value="scope.row.isEnabled"/>
+          <dict-tag :options="dict.type.common_swicth" :value="scope.row.isEnabled" />
         </template>
       </el-table-column>
       <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>
+          <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"
-    />
+    <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="分类类型" prop="categoryType">
           <el-select v-model="form.categoryType" placeholder="请选择分类类型">
-            <el-option
-              v-for="dict in dict.type.category_type"
-              :key="dict.value"
-              :label="dict.label"
-              :value="dict.value"
-            ></el-option>
+            <el-option v-for="dict in dict.type.category_type" :key="dict.value" :label="dict.label"
+              :value="dict.value"></el-option>
           </el-select>
         </el-form-item>
         <el-form-item label="分类编码" prop="categoryCode">
@@ -146,12 +91,8 @@
         </el-form-item>
         <el-form-item label="是否启用" prop="isEnabled">
           <el-select v-model="form.isEnabled" placeholder="请选择是否启用">
-            <el-option
-              v-for="dict in dict.type.common_swicth"
-              :key="dict.value"
-              :label="dict.label"
-              :value="parseInt(dict.value)"
-            ></el-option>
+            <el-option v-for="dict in dict.type.common_swicth" :key="dict.value" :label="dict.label"
+              :value="parseInt(dict.value)"></el-option>
           </el-select>
         </el-form-item>
       </el-form>
@@ -266,7 +207,7 @@ export default {
     // 多选框选中数据
     handleSelectionChange(selection) {
       this.ids = selection.map(item => item.categoryId)
-      this.single = selection.length!==1
+      this.single = selection.length !== 1
       this.multiple = !selection.length
     },
     /** 新增按钮操作 */

klp-ui/src/views/wms/order/components/PSpecSelect.vue

@@ -0,0 +1,138 @@
+<template>
+  <el-select
+    v-model="innerValue"
+    placeholder="请选择或搜索制造规范"
+    clearable
+    filterable
+    remote
+    :remote-method="handleRemoteSearch"
+    :loading="loading"
+    @change="handleSelectChange"
+    style="width: 100%"
+  >
+    <!-- 下拉选项：循环制造规范列表 -->
+    <el-option
+      v-for="item in mSpecList"
+      :key="item.specId"
+      :label="item.specName"
+      :value="item.specId"
+    />
+
+    <!-- 无数据提示 -->
+    <el-option
+      v-if="mSpecList.length === 0 && !loading"
+      value=""
+      disabled
+    >
+      暂无匹配制造规范
+    </el-option>
+  </el-select>
+</template>
+
+<script>
+import { listManufacturingSpec } from '@/api/work/manufacturingSpec'
+import { debounce } from 'lodash' // 防抖：避免频繁触发接口请求
+
+export default {
+  name: 'MSpecSelect',
+  // 1. 接收外部传入的v-model值（必加，双向绑定的入口）
+  props: {
+    value: {
+      type: [String, Number, undefined], // 支持字符串/数字ID（兼容不同后端返回类型）
+      default: undefined // 初始值默认undefined（未选择状态）
+    },
+    // 可选：允许外部自定义搜索参数的字段名（增强组件复用性）
+    searchKey: {
+      type: String,
+      default: 'specName' // 默认为“规范名称”搜索（对应接口的mSpecName参数）
+    },
+    // 可选：每页加载数量（外部可配置）
+    pageSize: {
+      type: Number,
+      default: 20
+    }
+  },
+  data() {
+    return {
+      mSpecList: [], // 制造规范列表数据
+      loading: false, // 远程请求加载状态
+      queryParams: {
+        // 搜索参数：默认用specName（可通过searchKey自定义）
+        specName: undefined,
+        pageNum: 1, // 分页：当前页码
+        pageSize: this.pageSize // 分页：每页条数（关联props的pageSize）
+      }
+    }
+  },
+  computed: {
+    // 2. 核心：内部值与外部value的双向同步桥梁
+    innerValue: {
+      get() {
+        // 外部传入的value -> 内部el-select的v-model值（初始回显）
+        return this.value
+      },
+      set(newVal) {
+        // 内部el-select值变化时 -> 触发input事件，同步给外部v-model
+        this.$emit('input', newVal)
+      }
+    }
+  },
+  watch: {
+    // 3. 监听外部value变化（如父组件直接修改v-model值），同步更新内部选择状态
+    value(newVal) {
+      // 仅当外部值与内部值不一致时更新（避免死循环）
+      if (newVal !== this.innerValue) {
+        this.innerValue = newVal
+      }
+    },
+    // 监听searchKey变化（外部修改搜索字段时，重置搜索参数）
+    searchKey(newKey) {
+      // 清空原搜索字段的值（避免残留旧字段的搜索条件）
+      this.queryParams[this.searchKey] = undefined
+    }
+  },
+  created() {
+    // 初始化：加载默认制造规范列表
+    this.getList()
+    // 初始化防抖函数（300ms延迟，可根据需求调整）
+    this.debouncedSearch = debounce(this.getList, 300)
+  },
+  methods: {
+    // 4. 远程搜索逻辑（输入时触发）
+    handleRemoteSearch(query) {
+      // 根据searchKey设置搜索参数（如：specName=query）
+      this.queryParams[this.searchKey] = query.trim() // 去除首尾空格，避免无效搜索
+      this.queryParams.pageNum = 1 // 重置页码为1（新搜索从第一页开始）
+      this.debouncedSearch() // 防抖后执行搜索
+    },
+
+    // 5. 获取制造规范列表（远程接口请求）
+    getList() {
+      this.loading = true // 开始加载：显示加载动画
+      listManufacturingSpec(this.queryParams)
+        .then(res => {
+          // 接口成功：赋值列表数据（兼容res.rows或res.data.rows，避免接口返回格式差异）
+          this.mSpecList = res.rows || res.data?.rows || []
+        })
+        .catch(() => {
+          // 接口失败：清空列表，避免旧数据残留
+          this.mSpecList = []
+          this.$message.error('获取制造规范列表失败，请重试') // 错误提示（优化用户体验）
+        })
+        .finally(() => {
+          this.loading = false // 结束加载：隐藏加载动画
+        })
+    },
+
+    // 6. 选择变化时触发（返回完整订单项，方便父组件使用）
+    handleSelectChange(mSpecId) {
+      // 根据选中的ID，找到对应的完整制造规范对象
+      const selectedItem = this.mSpecList.find(item => item.specId === mSpecId)
+      // 触发change事件：返回完整项（父组件可通过@change接收）
+      this.$emit('change', selectedItem)
+      // 可选：触发input事件后，额外触发change事件（符合常规组件使用习惯）
+      this.$emit('update:value', selectedItem)
+    }
+  }
+}
+</script>

klp-ui/src/views/wms/order/index.vue

@@ -1,397 +1,16 @@
 <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="orderCode">
-        <el-input
-          v-model="queryParams.orderCode"
-          placeholder="请输入订单编号"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="客户名称" prop="customerId">
-        <customer-select v-model="queryParams.customerId" />
-      </el-form-item>
-      <el-form-item label="销售经理" prop="salesManager">
-        <el-input
-          v-model="queryParams.salesManager"
-          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-button
-          type="warning"
-          plain
-          size="mini"
-          @click="goDashboard"
-          
-        >订单分析</el-button>
-      </el-col> -->
-      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
-    </el-row>
-
-    <el-table v-loading="loading" :data="orderList" @selection-change="handleSelectionChange">
-      <el-table-column type="selection" width="55" align="center" />
-      <el-table-column label="订单ID" align="center" prop="orderId" v-if="false" />
-      <el-table-column label="订单编号" align="center" prop="orderCode" />
-      <el-table-column label="客户名称" align="center" prop="customerName" />
-      <el-table-column label="销售经理" align="center" prop="salesManager" />
-      <el-table-column label="含税金额" align="center" prop="taxAmount" />
-      <el-table-column label="无税金额" align="center" prop="noTaxAmount" />
-      <el-table-column label="订单状态" align="center" prop="orderStatus">
-        <template slot-scope="scope">
-          <el-select v-model="scope.row.orderStatus" @change="handleOrderStatusChange(scope.row)">
-            <el-option v-for="item in dict.type.order_status" :key="item.value" :label="item.label" :value="parseInt(item.value)" />
-          </el-select>
-          <!-- <dict-tag :options="dict.type.order_status" :value="scope.row.orderStatus"/> -->
-        </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>
-          <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-document"
-            @click="showDetail(scope.row)"
-          >明细</el-button>
-          <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-document"
-            @click="copyOrderId(scope.row)"
-          >复制订单ID</el-button>
-          <!-- <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-s-operation"
-            @click="showClac(scope.row)"
-            v-if="scope.row.orderStatus === EOrderStatus.NEW"
-          >初次采购推荐</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-alert title="创建订单后默认为预订单，需要到预订单管理中查看" type="warning" style="margin-bottom: 10px;"/>
-      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
-        <el-form-item label="订单编号" prop="orderCode">
-          <el-input v-model="form.orderCode" placeholder="请输入订单编号" />
-        </el-form-item>
-        <el-form-item label="客户名称" prop="customerId">
-          <customer-select v-model="form.customerId" />
-        </el-form-item>
-        <el-form-item label="销售经理" prop="salesManager">
-          <el-input v-model="form.salesManager" placeholder="请输入销售经理" />
-        </el-form-item>
-        <el-form-item label="含税金额" prop="taxAmount">
-          <el-input-number :controls=false controls-position="right" v-model="form.taxAmount" placeholder="请输入含税金额" />
-        </el-form-item>
-        <el-form-item label="无税金额" prop="noTaxAmount">
-          <el-input-number :controls=false controls-position="right" v-model="form.noTaxAmount" 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>
-
-    <!-- 订单明细弹窗 -->
-    <el-dialog title="订单明细" :visible.sync="detailDialogVisible" width="900px" append-to-body>
-      <OrderDetailPanel :orderId="detailOrderId" />
-    </el-dialog>
-
-    <!-- 智能采购单弹窗, 底部弹出 -->
-    <!-- <el-drawer :title="`智能采购单（订单ID：${clacOrderId}）`" direction="btt" :visible.sync="clacDialogVisible"  width="100%" size="90%" append-to-body>
-      <clac-panel :orderId="clacOrderId" @confirm="handleRecommendConfirm" />
-    </el-drawer> -->
+  <div>
+    <OrderPage :isPre="false" />  
   </div>
 </template>
 
 <script>
-import { getOrder, delOrder, addOrder, updateOrder, listByStatus } from "@/api/wms/order";
-import OrderDetailPanel from './panels/detail.vue';
-import { EOrderStatus } from "@/utils/enums";
-import CustomerSelect from '@/components/KLPService/CustomerSelect/index.vue';
+import OrderPage from './panels/orderPage.vue';
 
 export default {
-  name: "Order",
-  components: { OrderDetailPanel, CustomerSelect },
-  dicts: ['order_status'],
-  data() {
-    return {
-      // 订单状态枚举
-      EOrderStatus,
-      // 按钮loading
-      buttonLoading: false,
-      // 遮罩层
-      loading: true,
-      // 选中数组
-      ids: [],
-      // 非单个禁用
-      single: true,
-      // 非多个禁用
-      multiple: true,
-      // 显示搜索条件
-      showSearch: true,
-      // 总条数
-      total: 0,
-      // 订单主表格数据
-      orderList: [],
-      // 弹出层标题
-      title: "",
-      // 是否显示弹出层
-      open: false,
-      // 查询参数
-      queryParams: {
-        pageNum: 1,
-        pageSize: 20,
-        orderCode: undefined,
-        customerId: undefined,
-        salesManager: undefined,
-        orderStatus: -1,
-      },
-      // 表单参数
-      form: {},
-      // 表单校验
-      rules: {
-      },
-      detailDialogVisible: false,
-      detailOrderId: null,
-      clacDialogVisible: false,
-      clacOrderId: null,
-    };
-  },
-  created() {
-    this.getList();
-  },
-  methods: {
-    /** 查询订单主列表 */
-    getList() {
-      this.loading = true;
-      listByStatus(this.queryParams).then(response => {
-        this.orderList = response.rows;
-        this.total = response.total;
-        this.loading = false;
-      });
-    },
-    goDashboard() {
-      this.$router.push('/shop/order/dashboard');
-    },
-    /** 推荐采购计划确认 */
-    // handleRecommendConfirm(data) {
-    //   console.log('推荐采购计划数据:', data);
-    //   this.$modal.msgSuccess("推荐采购计划已生成");
-    //   this.clacDialogVisible = false;
-    //   this.getList();
-    // },
-    handleOrderStatusChange(row) {
-      // console.log(row);
-      updateOrder(row).then(response => {
-        this.$modal.msgSuccess("修改成功");
-        this.getList();
-      });
-    },
-    // 取消按钮
-    cancel() {
-      this.open = false;
-      this.reset();
-    },
-    // 表单重置
-    reset() {
-      this.form = {
-        orderId: undefined,
-        orderCode: undefined,
-        customerId: undefined,
-        salesManager: undefined,
-        orderStatus: undefined,
-        remark: undefined,
-        delFlag: undefined,
-        createTime: undefined,
-        createBy: undefined,
-        updateTime: undefined,
-        updateBy: undefined,
-        taxAmount: undefined,
-        noTaxAmount: 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.orderId)
-      this.single = selection.length!==1
-      this.multiple = !selection.length
-    },
-    copyOrderId(row) {
-      // 获取浏览器剪切板对象并复制row.orderId
-      // 先检查是否支持
-      if (navigator.clipboard) {
-        navigator.clipboard.writeText(row.orderId);
-        this.$modal.msgSuccess("复制成功");
-      } else {
-        this.$modal.msgError("浏览器不支持复制功能");
-      }
-    },
-    /** 新增按钮操作 */
-    handleAdd() {
-      this.reset();
-      this.open = true;
-      this.title = "添加订单主";
-    },
-    /** 修改按钮操作 */
-    handleUpdate(row) {
-      this.loading = true;
-      this.reset();
-      const orderId = row.orderId || this.ids
-      getOrder(orderId).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.orderId != null) {
-            updateOrder(this.form).then(response => {
-              this.$modal.msgSuccess("修改成功");
-              this.open = false;
-              this.getList();
-            }).finally(() => {
-              this.buttonLoading = false;
-            });
-          } else {
-            addOrder(this.form).then(response => {
-              this.$modal.msgSuccess("新增成功");
-              this.open = false;
-              this.getList();
-            }).finally(() => {
-              this.buttonLoading = false;
-            });
-          }
-        }
-      });
-    },
-    /** 删除按钮操作 */
-    handleDelete(row) {
-      const orderIds = row.orderId || this.ids;
-      this.$modal.confirm('是否确认删除订单主编号为"' + orderIds + '"的数据项？').then(() => {
-        this.loading = true;
-        return delOrder(orderIds);
-      }).then(() => {
-        this.loading = false;
-        this.getList();
-        this.$modal.msgSuccess("删除成功");
-      }).catch(() => {
-      }).finally(() => {
-        this.loading = false;
-      });
-    },
-    /** 导出按钮操作 */
-    handleExport() {
-      this.download('wms/order/export', {
-        ...this.queryParams
-      }, `order_${new Date().getTime()}.xlsx`)
-    },
-    showDetail(row) {
-      this.detailOrderId = row.orderId;
-      this.detailDialogVisible = true;
-    },
-    showClac(row) {
-      this.clacOrderId = row.orderId;
-      this.clacDialogVisible = true;
-    },
+  name: 'Order',
+  components: {
+    OrderPage
   }
-};
-</script>
+}
+</script>

klp-ui/src/views/wms/order/panels/detail.vue

@@ -87,6 +87,12 @@
             :disabled="!canEdit"
             @click="handleUpdate(scope.row)"
           >修改</el-button>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-document"
+            @click="handleSpec(scope.row)"
+          >产品规范</el-button>
           <el-button
             size="mini"
             type="text"
@@ -136,16 +142,34 @@
         <el-button @click="cancel">取 消</el-button>
       </div>
     </el-dialog>
+
+    <el-dialog title="产品规范" :visible.sync="specDialogVisible" width="500px" append-to-body>
+      <ProductSpec v-if="form.groupId" :groupId="form.groupId" :readonly="!canEdit"/>
+      <div v-else-if="canEdit">
+        <el-select placeholder="请选择产品规范" @change="handleChangeSpec">
+          <el-option v-for="item in productSpecList" :key="item.groupId" :label="item.specName" :value="item.groupId" />
+
+          <template #empty>
+            <el-button type="primary" @click="handleAddSpec">新增产品规范</el-button>
+          </template>
+        </el-select>
+      </div>
+      <div v-else>
+        暂无产品规范
+      </div>
+    </el-dialog>
   </div>
 </template>
 
 <script>
 import { listOrderDetail, getOrderDetail, delOrderDetail, addOrderDetail, updateOrderDetail } from "@/api/wms/orderDetail";
+import { listProductSpecGroup } from "@/api/work/productSpecGroup";
 import { getOrder } from "@/api/wms/order";
 import ProductSelect from '@/components/KLPService/ProductSelect';
 import { EOrderStatus } from "@/utils/enums";
 import { ProductInfo } from '@/components/KLPService';
 import BomInfoMini from '@/components/KLPService/Renderer/BomInfoMini.vue';
+import ProductSpec from './spec.vue';
 
 export default {
   name: "OrderDetailPanel",
@@ -159,7 +183,8 @@ export default {
   components: {
     ProductSelect,
     ProductInfo,
-    BomInfoMini
+    BomInfoMini,
+    ProductSpec
   },
   data() {
     return {
@@ -200,7 +225,9 @@ export default {
         unit: [
           { required: true, message: "单位不能为空", trigger: "blur" }
         ],
-      }
+      },
+      specDialogVisible: false,
+      productSpecList: [],
     };
   },
   computed: {
@@ -219,6 +246,9 @@ export default {
   },
   created() {
     this.getOrderInfo();
+    listProductSpecGroup().then(response => {
+      this.productSpecList = response.rows;
+    });
     this.getList();
   },
   methods: {
@@ -344,6 +374,22 @@ export default {
       this.download && this.download('wms/orderDetail/export', {
         ...this.queryParams
       }, `orderDetail_${new Date().getTime()}.xlsx`)
+    },
+    handleSpec(row) {
+      this.specDialogVisible = true;
+      this.form = row;
+    },
+    handleChangeSpec(groupId) {
+      // 确认更换
+      this.$modal && this.$modal.confirm('是否确认更换产品规范？').then(() => {
+        this.form.groupId = groupId;
+        this.submitForm();
+      });
+    },
+    handleAddSpec() {
+      this.$router.push({
+        path: '/production/pspec',
+      });
     }
   },
 };

klp-ui/src/views/wms/order/panels/orderPage.vue

@@ -0,0 +1,391 @@
+<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="orderCode">
+        <el-input
+          v-model="queryParams.orderCode"
+          placeholder="请输入订单编号"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="客户名称" prop="customerId">
+        <customer-select v-model="queryParams.customerId" />
+      </el-form-item>
+      <el-form-item label="销售经理" prop="salesManager">
+        <el-input
+          v-model="queryParams.salesManager"
+          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>
+      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
+
+    <el-table v-loading="loading" :data="orderList" @selection-change="handleSelectionChange">
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column label="订单ID" align="center" prop="orderId" v-if="false"/>
+      <el-table-column label="订单编号" align="center" prop="orderCode" />
+      <el-table-column label="客户名称" align="center" prop="customerName" />
+      <el-table-column label="销售经理" align="center" prop="salesManager" />
+      <el-table-column label="含税金额" align="center" prop="taxAmount" />
+      <el-table-column label="无税金额" align="center" prop="noTaxAmount" />
+      <el-table-column label="订单状态" align="center" prop="orderStatus" v-if="!isPre">
+        <template slot-scope="scope">
+          <el-select v-model="scope.row.orderStatus" @change="handleOrderStatusChange(scope.row)">
+            <el-option v-for="item in dict.type.order_status" :key="item.value" :label="item.label" :value="parseInt(item.value)" />
+          </el-select>
+          <!-- <dict-tag :options="dict.type.order_status" :value="scope.row.orderStatus"/> -->
+        </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>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-document"
+            @click="showDetail(scope.row)"
+          >明细</el-button>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-document"
+            @click="copyOrderId(scope.row)"
+          >复制订单ID</el-button>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-s-operation"
+            @click="handleStartProduction(scope.row)"
+            v-if="!isPre"
+          >
+            确认订单
+          </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="订单编号" prop="orderCode">
+          <el-input v-model="form.orderCode" placeholder="请输入订单编号" />
+        </el-form-item>
+        <el-form-item label="客户名称" prop="customerId">
+          <customer-select v-model="form.customerId" />
+        </el-form-item>
+        <el-form-item label="销售经理" prop="salesManager">
+          <el-input v-model="form.salesManager" placeholder="请输入销售经理" />
+        </el-form-item>
+        <el-form-item label="含税金额" prop="taxAmount">
+          <el-input-number :controls=false controls-position="right" v-model="form.taxAmount" placeholder="请输入含税金额" />
+        </el-form-item>
+        <el-form-item label="无税金额" prop="noTaxAmount">
+          <el-input-number :controls=false controls-position="right" v-model="form.noTaxAmount" 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>
+
+    <!-- 订单明细弹窗 -->
+    <el-dialog title="订单明细" :visible.sync="detailDialogVisible" width="1200px" append-to-body>
+      <OrderDetailPanel :orderId="detailOrderId" />
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { getOrder, delOrder, addOrder, updateOrder, listByStatus } from "@/api/wms/order";
+import OrderDetailPanel from './detail.vue';
+import { EOrderStatus } from "@/utils/enums";
+import CustomerSelect from '@/components/KLPService/CustomerSelect/index.vue';
+
+export default {
+  name: "Order",
+  components: { OrderDetailPanel, CustomerSelect },
+  dicts: ['order_status'],
+  props: {
+    isPre: {
+      type: Boolean,
+      required: true
+    }
+  },
+  computed: {
+    orderQueryStatus() {
+      return this.isPre ? 0 : -1;
+    }
+  },
+  data() {
+    return {
+      // 订单状态枚举
+      EOrderStatus,
+      // 按钮loading
+      buttonLoading: false,
+      // 遮罩层
+      loading: true,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 订单主表格数据
+      orderList: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 20,
+        orderCode: undefined,
+        customerId: undefined,
+        salesManager: undefined,
+        orderStatus: this.orderQueryStatus,
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {
+      },
+      detailDialogVisible: false,
+      detailOrderId: null,
+      clacDialogVisible: false,
+      clacOrderId: null,
+    };
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+    /** 查询订单主列表 */
+    getList() {
+      this.loading = true;
+      listByStatus(this.queryParams).then(response => {
+        this.orderList = response.rows;
+        this.total = response.total;
+        this.loading = false;
+      });
+    },
+    goDashboard() {
+      this.$router.push('/shop/order/dashboard');
+    },
+    handleOrderStatusChange(row) {
+      // console.log(row);
+      updateOrder(row).then(response => {
+        this.$modal.msgSuccess("修改成功");
+        this.getList();
+      });
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        orderId: undefined,
+        orderCode: undefined,
+        customerId: undefined,
+        salesManager: undefined,
+        orderStatus: undefined,
+        remark: undefined,
+        delFlag: undefined,
+        createTime: undefined,
+        createBy: undefined,
+        updateTime: undefined,
+        updateBy: undefined,
+        taxAmount: undefined,
+        noTaxAmount: 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.orderId)
+      this.single = selection.length!==1
+      this.multiple = !selection.length
+    },
+    copyOrderId(row) {
+      // 获取浏览器剪切板对象并复制row.orderId
+      // 先检查是否支持
+      if (navigator.clipboard) {
+        navigator.clipboard.writeText(row.orderId);
+        this.$modal.msgSuccess("复制成功");
+      } else {
+        this.$modal.msgError("浏览器不支持复制功能");
+      }
+    },
+    /** 新增按钮操作 */
+    handleAdd() {
+      this.reset();
+      this.open = true;
+      this.title = "添加订单主";
+    },
+    /** 修改按钮操作 */
+    handleUpdate(row) {
+      this.loading = true;
+      this.reset();
+      const orderId = row.orderId || this.ids
+      getOrder(orderId).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.orderId != null) {
+            updateOrder(this.form).then(response => {
+              this.$modal.msgSuccess("修改成功");
+              this.open = false;
+              this.getList();
+            }).finally(() => {
+              this.buttonLoading = false;
+            });
+          } else {
+            addOrder(this.form).then(response => {
+              this.$modal.msgSuccess("新增成功");
+              this.open = false;
+              this.getList();
+            }).finally(() => {
+              this.buttonLoading = false;
+            });
+          }
+        }
+      });
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      const orderIds = row.orderId || this.ids;
+      this.$modal.confirm('是否确认删除订单主编号为"' + orderIds + '"的数据项？').then(() => {
+        this.loading = true;
+        return delOrder(orderIds);
+      }).then(() => {
+        this.loading = false;
+        this.getList();
+        this.$modal.msgSuccess("删除成功");
+      }).catch(() => {
+      }).finally(() => {
+        this.loading = false;
+      });
+    },
+    /** 导出按钮操作 */
+    handleExport() {
+      this.download('wms/order/export', {
+        ...this.queryParams
+      }, `order_${new Date().getTime()}.xlsx`)
+    },
+    showDetail(row) {
+      this.detailOrderId = row.orderId;
+      this.detailDialogVisible = true;
+    },
+    showClac(row) {
+      this.clacOrderId = row.orderId;
+      this.clacDialogVisible = true;
+    },
+    handleStartProduction(row) {
+      updateOrder({
+        orderId: row.orderId,
+        orderStatus: 1
+      }).then(response => {
+        this.$modal.msgSuccess("已转化为正式订单");
+        this.getList();
+      });
+    }
+  }
+};
+</script>

klp-ui/src/views/wms/order/panels/spec.vue

@@ -0,0 +1,287 @@
+<template>
+  <div class="app-container">
+    <el-row :gutter="10" class="mb8" v-if="!readonly">
+      <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>
+
+    <el-table v-loading="loading" :data="productSpecList" @selection-change="handleSelectionChange">
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column label="主键" align="center" prop="specId" v-if="false"/>
+      <el-table-column label="所属产品规范组ID" align="center" prop="groupId" />
+      <el-table-column label="规范名称" align="center" prop="specKey" />
+      <el-table-column label="规范值" align="center" prop="specValue" />
+      <el-table-column label="备注" align="center" prop="remark" />
+      <el-table-column label="操作" v-if="!readonly" 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="所属产品规范组ID" prop="groupId">
+          <el-input v-model="form.groupId" placeholder="请输入所属产品规范组ID" />
+        </el-form-item> -->
+        <el-form-item label="规范键" prop="specKey">
+          <el-input v-model="form.specKey" placeholder="请输入规范键" />
+        </el-form-item>
+        <el-form-item label="规范值" prop="specValue">
+          <el-input v-model="form.specValue" type="textarea" placeholder="请输入内容" />
+        </el-form-item>
+        <el-form-item label="备注" prop="remark">
+          <el-input v-model="form.remark" type="textarea" 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 { listProductSpec, getProductSpec, delProductSpec, addProductSpec, updateProductSpec } from "@/api/work/productSpec";
+
+export default {
+  name: "ProductSpec",
+  props: {
+    groupId: {
+      type: String,
+      default: ""
+    },
+    readonly: {
+      type: Boolean,
+      default: false
+    }
+  },
+  data() {
+    return {
+      // 按钮loading
+      buttonLoading: false,
+      // 遮罩层
+      loading: true,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 产品规范（键值对模式）表格数据
+      productSpecList: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        groupId: undefined,
+        specKey: undefined,
+        specValue: undefined,
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {
+        groupId: [
+          { required: true, message: "所属产品规范组ID不能为空", trigger: "blur" }
+        ],
+        specKey: [
+          { required: true, message: "规范键不能为空", trigger: "blur" }
+        ],
+        specValue: [
+          { required: true, message: "规范值不能为空", trigger: "blur" }
+        ],
+      }
+    };
+  },
+  watch: {
+    groupId: {
+      handler(newVal) {
+        // if (newVal) {
+          this.queryParams.groupId = newVal;
+          this.getList();
+        // }
+      }, 
+      immediate: true
+    },
+  },
+  methods: {
+    /** 查询产品规范（键值对模式）列表 */
+    getList() {
+      this.loading = true;
+      listProductSpec(this.queryParams).then(response => {
+        this.productSpecList = response.rows;
+        this.total = response.total;
+        this.loading = false;
+      });
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        specId: undefined,
+        groupId: this.groupId,
+        specKey: undefined,
+        specValue: undefined,
+        remark: undefined,
+        createBy: undefined,
+        createTime: undefined,
+        updateBy: undefined,
+        updateTime: undefined,
+        delFlag: 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.specId)
+      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 specId = row.specId || this.ids
+      getProductSpec(specId).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.specId != null) {
+            updateProductSpec(this.form).then(response => {
+              this.$modal.msgSuccess("修改成功");
+              this.open = false;
+              this.getList();
+            }).finally(() => {
+              this.buttonLoading = false;
+            });
+          } else {
+            addProductSpec(this.form).then(response => {
+              this.$modal.msgSuccess("新增成功");
+              this.open = false;
+              this.getList();
+            }).finally(() => {
+              this.buttonLoading = false;
+            });
+          }
+        }
+      });
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      const specIds = row.specId || this.ids;
+      this.$modal.confirm('是否确认删除产品规范（键值对模式）编号为"' + specIds + '"的数据项？').then(() => {
+        this.loading = true;
+        return delProductSpec(specIds);
+      }).then(() => {
+        this.loading = false;
+        this.getList();
+        this.$modal.msgSuccess("删除成功");
+      }).catch(() => {
+      }).finally(() => {
+        this.loading = false;
+      });
+    },
+    /** 导出按钮操作 */
+    handleExport() {
+      this.download('klp/productSpec/export', {
+        ...this.queryParams
+      }, `productSpec_${new Date().getTime()}.xlsx`)
+    }
+  }
+};
+</script>

klp-ui/src/views/wms/order/pre.vue

@@ -1,398 +1,16 @@
 <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="orderCode">
-        <el-input
-          v-model="queryParams.orderCode"
-          placeholder="请输入订单编号"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="客户名称" prop="customerId">
-        <customer-select v-model="queryParams.customerId" />
-      </el-form-item>
-      <el-form-item label="销售经理" prop="salesManager">
-        <el-input
-          v-model="queryParams.salesManager"
-          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-button
-          type="warning"
-          plain
-          size="mini"
-          @click="goDashboard"
-          
-        >订单分析</el-button>
-      </el-col> -->
-      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
-    </el-row>
-
-    <el-table v-loading="loading" :data="orderList" @selection-change="handleSelectionChange">
-      <el-table-column type="selection" width="55" align="center" />
-      <el-table-column label="订单ID" align="center" prop="orderId" v-if="false"/>
-      <el-table-column label="订单编号" align="center" prop="orderCode" />
-      <el-table-column label="客户名称" align="center" prop="customerName" />
-      <el-table-column label="销售经理" align="center" prop="salesManager" />
-      <el-table-column label="含税金额" align="center" prop="taxAmount" />
-      <el-table-column label="无税金额" align="center" prop="noTaxAmount" />
-      <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>
-          <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-document"
-            @click="showDetail(scope.row)"
-          >明细</el-button>
-          <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-document"
-            @click="copyOrderId(scope.row)"
-          >复制订单ID</el-button>
-          <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-s-operation"
-            @click="handleStartProduction(scope.row)"
-          >
-            开始生产
-          </el-button>
-          <!-- <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-s-operation"
-            @click="showClac(scope.row)"
-            v-if="scope.row.orderStatus === EOrderStatus.NEW"
-          >初次采购推荐</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="订单编号" prop="orderCode">
-          <el-input v-model="form.orderCode" placeholder="请输入订单编号" />
-        </el-form-item>
-        <el-form-item label="客户名称" prop="customerId">
-          <customer-select v-model="form.customerId" />
-        </el-form-item>
-        <el-form-item label="销售经理" prop="salesManager">
-          <el-input v-model="form.salesManager" placeholder="请输入销售经理" />
-        </el-form-item>
-        <el-form-item label="含税金额" prop="taxAmount">
-          <el-input-number :controls=false controls-position="right" v-model="form.taxAmount" placeholder="请输入含税金额" />
-        </el-form-item>
-        <el-form-item label="无税金额" prop="noTaxAmount">
-          <el-input-number :controls=false controls-position="right" v-model="form.noTaxAmount" 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>
-
-    <!-- 订单明细弹窗 -->
-    <el-dialog title="订单明细" :visible.sync="detailDialogVisible" width="900px" append-to-body>
-      <OrderDetailPanel :orderId="detailOrderId" />
-    </el-dialog>
+  <div>
+    <OrderPage :isPre="true" />
   </div>
 </template>
 
 <script>
-import { getOrder, delOrder, addOrder, updateOrder, listByStatus } from "@/api/wms/order";
-import OrderDetailPanel from './panels/detail.vue';
-import { EOrderStatus } from "@/utils/enums";
-import CustomerSelect from '@/components/KLPService/CustomerSelect/index.vue';
+import OrderPage from './panels/orderPage.vue';
 
 export default {
-  name: "Order",
-  components: { OrderDetailPanel, CustomerSelect },
-  dicts: ['order_status'],
-  data() {
-    return {
-      // 订单状态枚举
-      EOrderStatus,
-      // 按钮loading
-      buttonLoading: false,
-      // 遮罩层
-      loading: true,
-      // 选中数组
-      ids: [],
-      // 非单个禁用
-      single: true,
-      // 非多个禁用
-      multiple: true,
-      // 显示搜索条件
-      showSearch: true,
-      // 总条数
-      total: 0,
-      // 订单主表格数据
-      orderList: [],
-      // 弹出层标题
-      title: "",
-      // 是否显示弹出层
-      open: false,
-      // 查询参数
-      queryParams: {
-        pageNum: 1,
-        pageSize: 20,
-        orderCode: undefined,
-        customerId: undefined,
-        salesManager: undefined,
-        orderStatus: 0,
-      },
-      // 表单参数
-      form: {},
-      // 表单校验
-      rules: {
-      },
-      detailDialogVisible: false,
-      detailOrderId: null,
-      clacDialogVisible: false,
-      clacOrderId: null,
-    };
-  },
-  created() {
-    this.getList();
-  },
-  methods: {
-    /** 查询订单主列表 */
-    getList() {
-      this.loading = true;
-      listByStatus(this.queryParams).then(response => {
-        this.orderList = response.rows;
-        this.total = response.total;
-        this.loading = false;
-      });
-    },
-    goDashboard() {
-      this.$router.push('/shop/order/dashboard');
-    },
-    /** 推荐采购计划确认 */
-    // handleRecommendConfirm(data) {
-    //   console.log('推荐采购计划数据:', data);
-    //   this.$modal.msgSuccess("推荐采购计划已生成");
-    //   this.clacDialogVisible = false;
-    //   this.getList();
-    // },
-    handleOrderStatusChange(row) {
-      // console.log(row);
-      updateOrder(row).then(response => {
-        this.$modal.msgSuccess("修改成功");
-        this.getList();
-      });
-    },
-    // 取消按钮
-    cancel() {
-      this.open = false;
-      this.reset();
-    },
-    // 表单重置
-    reset() {
-      this.form = {
-        orderId: undefined,
-        orderCode: undefined,
-        customerId: undefined,
-        salesManager: undefined,
-        orderStatus: undefined,
-        remark: undefined,
-        delFlag: undefined,
-        createTime: undefined,
-        createBy: undefined,
-        updateTime: undefined,
-        updateBy: undefined,
-        taxAmount: undefined,
-        noTaxAmount: 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.orderId)
-      this.single = selection.length!==1
-      this.multiple = !selection.length
-    },
-    copyOrderId(row) {
-      // 获取浏览器剪切板对象并复制row.orderId
-      // 先检查是否支持
-      if (navigator.clipboard) {
-        navigator.clipboard.writeText(row.orderId);
-        this.$modal.msgSuccess("复制成功");
-      } else {
-        this.$modal.msgError("浏览器不支持复制功能");
-      }
-    },
-    /** 新增按钮操作 */
-    handleAdd() {
-      this.reset();
-      this.open = true;
-      this.title = "添加订单主";
-    },
-    /** 修改按钮操作 */
-    handleUpdate(row) {
-      this.loading = true;
-      this.reset();
-      const orderId = row.orderId || this.ids
-      getOrder(orderId).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.orderId != null) {
-            updateOrder(this.form).then(response => {
-              this.$modal.msgSuccess("修改成功");
-              this.open = false;
-              this.getList();
-            }).finally(() => {
-              this.buttonLoading = false;
-            });
-          } else {
-            addOrder(this.form).then(response => {
-              this.$modal.msgSuccess("新增成功");
-              this.open = false;
-              this.getList();
-            }).finally(() => {
-              this.buttonLoading = false;
-            });
-          }
-        }
-      });
-    },
-    /** 删除按钮操作 */
-    handleDelete(row) {
-      const orderIds = row.orderId || this.ids;
-      this.$modal.confirm('是否确认删除订单主编号为"' + orderIds + '"的数据项？').then(() => {
-        this.loading = true;
-        return delOrder(orderIds);
-      }).then(() => {
-        this.loading = false;
-        this.getList();
-        this.$modal.msgSuccess("删除成功");
-      }).catch(() => {
-      }).finally(() => {
-        this.loading = false;
-      });
-    },
-    /** 导出按钮操作 */
-    handleExport() {
-      this.download('wms/order/export', {
-        ...this.queryParams
-      }, `order_${new Date().getTime()}.xlsx`)
-    },
-    showDetail(row) {
-      this.detailOrderId = row.orderId;
-      this.detailDialogVisible = true;
-    },
-    showClac(row) {
-      this.clacOrderId = row.orderId;
-      this.clacDialogVisible = true;
-    },
-    handleStartProduction(row) {
-      updateOrder({
-        orderId: row.orderId,
-        orderStatus: 1
-      }).then(response => {
-        this.$modal.msgSuccess("已转化为正式订单");
-        this.getList();
-      });
-    }
+  name: 'OrderPre',
+  components: {
+    OrderPage
   }
-};
-</script>
+}
+</script>

klp-ui/src/views/wms/product/index.vue

@@ -66,8 +66,7 @@
           icon="el-icon-edit"
           size="mini"
           :disabled="single"
-          @click="handleUpdate"
-          
+          @click="handleUpdate"  
         >修改</el-button>
       </el-col>
       <el-col :span="1.5">
@@ -77,8 +76,7 @@
           icon="el-icon-delete"
           size="mini"
           :disabled="multiple"
-          @click="handleDelete"
-          
+          @click="handleDelete" 
         >删除</el-button>
       </el-col>
       <el-col :span="1.5">
@@ -87,8 +85,7 @@
           plain
           icon="el-icon-download"
           size="mini"
-          @click="handleExport"
-          
+          @click="handleExport"   
         >导出</el-button>
       </el-col>
       <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
@@ -133,7 +130,7 @@
           <BomInfoMini :bomId="scope.row.bomId" />
         </template>
       </el-table-column>
-      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+      <el-table-column label="操作" align="center">
         <template slot-scope="scope">
           <el-button
             size="mini"

klp-ui/src/views/wms/stock/box.vue

@@ -7,21 +7,6 @@
     </div>
     <!-- 右侧图表 -->
     <div style="flex: 1; height: calc(100vh - 100px); overflow-y: scroll; overflow-x: hidden;">
-      <el-row>
-        <el-col :span="24">
-          <el-card>
-            <template #header>
-              仓库库存
-            </template>
-            <div style="height: 600px;">
-              <ChartWrapper>
-                <rea-tree ref="reaTree" :stock-data="stockData" :warehouse-tree-data="warehouseTreeData" height="600px" />
-              </ChartWrapper>
-            </div>
-          </el-card>
-        </el-col>
-      </el-row>
-
       <el-row :gutter="10">
         <el-col :span="12">
           <el-card>
@@ -55,6 +40,20 @@
           </el-card>
         </el-col>
       </el-row>
+      <el-row>
+        <el-col :span="24">
+          <el-card>
+            <template #header>
+              仓库库存
+            </template>
+            <div style="height: 600px;">
+              <ChartWrapper>
+                <rea-tree ref="reaTree" :stock-data="stockData" :warehouse-tree-data="warehouseTreeData" height="600px" />
+              </ChartWrapper>
+            </div>
+          </el-card>
+        </el-col>
+      </el-row>
     </div>
   </div>
 </template>

klp-ui/src/views/wms/stock/index.vue

@@ -16,8 +16,8 @@
           <el-input v-model="queryParams.unit" 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-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button>
+          <el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
         </el-form-item>
       </el-form>
 

klp-ui/src/views/wms/work/schedulePlan/detail.vue

@@ -19,24 +19,6 @@
       <el-tab-pane label="生产任务管理" name="batch">
         <BatchPanel :planId="planId" v-if="activeTab === 'batch'" />
       </el-tab-pane>
-
-      <!-- <el-tab-pane label="计划明细" name="detail">
-        <el-button type="primary" size="mini" style="float:right" @click="openDetailDialog()">新增明细</el-button>
-        <el-table :data="detailList" v-loading="loading" style="width: 100%" v-if="activeTab === 'detail'">
-          <el-table-column prop="detailId" label="明细ID" align="center" />
-          <el-table-column prop="lineName" label="产线名称" align="center" />
-          <el-table-column prop="batchNo" label="批次号" align="center" />
-          <el-table-column prop="quantity" label="排产数量" align="center" />
-          <el-table-column prop="startDate" label="开始日期" align="center" />
-          <el-table-column prop="endDate" label="结束日期" align="center" />
-          <el-table-column prop="remark" label="备注" align="center" />
-          <el-table-column label="操作" align="center" width="120">
-            <template slot-scope="scope">
-              <el-button size="mini" type="text" @click="openDetailDialog(scope.row)">编辑</el-button>
-            </template>
-          </el-table-column>
-        </el-table>
-      </el-tab-pane> -->
     </el-tabs>
     
     <el-dialog :title="detailDialogTitle" :visible.sync="detailDialogVisible" width="700px"

klp-ui/src/views/wms/work/schedulePlan/panes/batch.vue

@@ -1,34 +1,29 @@
 <template>
   <div class="app-container">
-    <el-row style="margin-bottom: 20px; padding: 0 10px;">
-  <!-- 任务列表容器 -->
-  <div class="task-list-container">
-    <!-- 单个任务项 -->
-    <div v-for="(item, index) in taskList" 
-         :key="index" 
-         class="task-item"
-         :style="{marginBottom: index === taskList.length - 1 ? '0' : '20px'}">
-      
-      <!-- 产品信息区域 -->
-      <div class="product-info-wrapper">
-        <ProductInfo :productId="item && item[0] && item[0].productId" />
-      </div>
-      
-      <!-- 工艺流程区域 -->
-      <div class="process-flow-container">
-        <div v-for="(process, pIndex) in item" 
-             :key="process.processId" 
-             class="process-item"
-             :style="{
-               marginRight: pIndex !== item.length - 1 ? '15px' : '0',
-               // 最后一个工艺项不加右侧间距
-             }">
-          <CraftInfo :craftId="process.processId" />
+    <el-row>
+      <!-- 任务列表容器 -->
+      <div class="task-list-container">
+        <!-- 单个任务项 -->
+        <div v-for="(item, index) in taskList" :key="index" class="task-item"
+          :style="{ marginBottom: index === taskList.length - 1 ? '0' : '20px' }">
+
+          <!-- 产品信息区域 -->
+          <div class="product-info-wrapper">
+            <ProductInfo :productId="item && item[0] && item[0].productId" />
+          </div>
+
+          <!-- 工艺流程区域 -->
+          <div class="process-flow-container">
+            <div v-for="(process, pIndex) in item" :key="process.processId" class="process-item" :style="{
+              marginRight: pIndex !== item.length - 1 ? '15px' : '0',
+              // 最后一个工艺项不加右侧间距
+            }">
+              <CraftInfo :craftId="process.processId" />
+            </div>
+          </div>
         </div>
       </div>
-    </div>
-  </div>
-</el-row>
+    </el-row>
 
     <el-row :gutter="10" class="mb8">
       <el-col :span="1.5">
@@ -63,7 +58,8 @@
       <el-table-column label="生产任务总数量" align="center" prop="totalQuantity" />
       <el-table-column label="合并来源" align="center" prop="mergeSource">
         <template slot-scope="scope">
-          <div v-for="item in scope.row.mergeSource.split(',')" style="display: flex; align-items: center; justify-content: center; gap: 10px;" :key="item">
+          <div v-for="item in scope.row.mergeSource.split(',')"
+            style="display: flex; align-items: center; justify-content: center; gap: 10px;" :key="item">
             <ProductInfo :productId="getTaskInfo(item).productId" />
             <CraftInfo :craftId="getTaskInfo(item).processId" />
           </div>
@@ -106,12 +102,8 @@
           <el-input v-model="form.totalQuantity" placeholder="请输入批次总数量" />
         </el-form-item> -->
         <el-form-item label="合并来源" prop="mergeSource">
-          <merge-source-selector 
-            v-model="form.mergeSource"
-            :unmerged-tasks="unmergedTaskList"
-            :all-tasks="allTasks"
-            @change="handleMergeSourceChange"
-          />
+          <merge-source-selector v-model="form.mergeSource" :unmerged-tasks="unmergedTaskList" :all-tasks="allTasks"
+            @change="handleMergeSourceChange" />
           <!-- <el-input v-model="form.mergeSource" type="textarea" placeholder="请输入内容" /> -->
         </el-form-item>
         <el-form-item label="预计开始时间" prop="estimatedStartTime">
@@ -457,9 +449,11 @@ export default {
 
 /* 产品信息容器 */
 .product-info-wrapper {
-  min-width: 180px; /* 固定产品信息宽度，保证对齐 */
+  min-width: 180px;
+  /* 固定产品信息宽度，保证对齐 */
   padding: 8px 0;
-  border-right: 1px dashed #e5e7eb; /* 分隔线 */
+  border-right: 1px dashed #e5e7eb;
+  /* 分隔线 */
   margin-right: 15px;
 }
 
@@ -467,23 +461,22 @@ export default {
 .process-flow-container {
   display: flex;
   flex-wrap: wrap;
-  gap: 12px; /* 工艺项之间的间距 */
+  gap: 12px;
+  /* 工艺项之间的间距 */
   padding: 8px 0;
-  flex: 1; /* 占满剩余空间 */
+  flex: 1;
+  /* 占满剩余空间 */
 }
 
 /* 单个工艺项样式 */
 .process-item {
-  flex: 0 0 auto; /* 不自动拉伸 */
-  padding: 8px 12px;
-  border-radius: 4px;
+  flex: 0 0 auto;
   background-color: #fff;
   border: 1px solid #eee;
-  transition: border-color 0.2s ease;
 }
 
 .process-item:hover {
-  border-color: #409eff; /* 高亮边框 */
+  border-color: #409eff;
+  /* 高亮边框 */
 }
-
 </style>