From 0f279eaeec420883453a088a69d932905a9442da Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=A0=82=E7=B3=96?= <qq2178503051@163.com>
Date: Thu, 14 Aug 2025 16:30:13 +0800
Subject: [PATCH] =?UTF-8?q?=E7=94=9F=E4=BA=A7=E5=B7=A5=E5=BA=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 klp-ui/src/App.vue                            |   1 +
 klp-ui/src/api/wms/batch.js                   |  44 +++
 klp-ui/src/api/wms/craft.js                   |  44 +++
 klp-ui/src/api/wms/processTask.js             |  44 +++
 .../KLPService/CraftSelect/index.vue          |  45 +++
 klp-ui/src/store/getters.js                   |   1 +
 klp-ui/src/store/index.js                     |   4 +-
 klp-ui/src/store/modules/craft.js             |  26 ++
 klp-ui/src/store/modules/finance.js           |   4 +-
 klp-ui/src/views/finance/order/index.vue      |   2 +-
 klp-ui/src/views/login.vue                    |   1 +
 klp-ui/src/views/wms/work/craft.vue           | 319 ++++++++++++++++++
 .../productionLine/GanttChartEcharts.vue      |   0
 .../wms/{ => work}/productionLine/index.vue   |   0
 .../wms/{ => work}/schedulePlan/detail.vue    | 131 ++++---
 .../wms/{ => work}/schedulePlan/index.vue     |  10 +-
 .../wms/work/schedulePlan/panes/batch.vue     | 292 ++++++++++++++++
 .../wms/work/schedulePlan/panes/craftTask.vue |  53 +++
 .../wms/work/schedulePlan/panes/target.vue    | 310 +++++++++++++++++
 19 files changed, 1268 insertions(+), 63 deletions(-)
 create mode 100644 klp-ui/src/api/wms/batch.js
 create mode 100644 klp-ui/src/api/wms/craft.js
 create mode 100644 klp-ui/src/api/wms/processTask.js
 create mode 100644 klp-ui/src/components/KLPService/CraftSelect/index.vue
 create mode 100644 klp-ui/src/store/modules/craft.js
 create mode 100644 klp-ui/src/views/wms/work/craft.vue
 rename klp-ui/src/views/wms/{ => work}/productionLine/GanttChartEcharts.vue (100%)
 rename klp-ui/src/views/wms/{ => work}/productionLine/index.vue (100%)
 rename klp-ui/src/views/wms/{ => work}/schedulePlan/detail.vue (68%)
 rename klp-ui/src/views/wms/{ => work}/schedulePlan/index.vue (97%)
 create mode 100644 klp-ui/src/views/wms/work/schedulePlan/panes/batch.vue
 create mode 100644 klp-ui/src/views/wms/work/schedulePlan/panes/craftTask.vue
 create mode 100644 klp-ui/src/views/wms/work/schedulePlan/panes/target.vue

diff --git a/klp-ui/src/App.vue b/klp-ui/src/App.vue
index 4804eb47..b6a18560 100644
--- a/klp-ui/src/App.vue
+++ b/klp-ui/src/App.vue
@@ -19,6 +19,7 @@ export default {
       this.$store.dispatch('category/getRawMaterialMap');
       this.$store.dispatch('category/getBomMap');
       this.$store.dispatch('finance/getFinancialAccounts');
+      this.$store.dispatch('craft/getProcessList');
     }
   },
     metaInfo() {
diff --git a/klp-ui/src/api/wms/batch.js b/klp-ui/src/api/wms/batch.js
new file mode 100644
index 00000000..b9036fea
--- /dev/null
+++ b/klp-ui/src/api/wms/batch.js
@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 查询批次（合并相同工艺的任务）列表
+export function listBatch(query) {
+  return request({
+    url: '/klp/batch/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询批次（合并相同工艺的任务）详细
+export function getBatch(batchId) {
+  return request({
+    url: '/klp/batch/' + batchId,
+    method: 'get'
+  })
+}
+
+// 新增批次（合并相同工艺的任务）
+export function addBatch(data) {
+  return request({
+    url: '/klp/batch',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改批次（合并相同工艺的任务）
+export function updateBatch(data) {
+  return request({
+    url: '/klp/batch',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除批次（合并相同工艺的任务）
+export function delBatch(batchId) {
+  return request({
+    url: '/klp/batch/' + batchId,
+    method: 'delete'
+  })
+}
diff --git a/klp-ui/src/api/wms/craft.js b/klp-ui/src/api/wms/craft.js
new file mode 100644
index 00000000..9fe12f8b
--- /dev/null
+++ b/klp-ui/src/api/wms/craft.js
@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 查询工艺列表
+export function listProcesse(query) {
+  return request({
+    url: '/klp/processe/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询工艺详细
+export function getProcesse(processId) {
+  return request({
+    url: '/klp/processe/' + processId,
+    method: 'get'
+  })
+}
+
+// 新增工艺
+export function addProcesse(data) {
+  return request({
+    url: '/klp/processe',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改工艺
+export function updateProcesse(data) {
+  return request({
+    url: '/klp/processe',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除工艺
+export function delProcesse(processId) {
+  return request({
+    url: '/klp/processe/' + processId,
+    method: 'delete'
+  })
+}
diff --git a/klp-ui/src/api/wms/processTask.js b/klp-ui/src/api/wms/processTask.js
new file mode 100644
index 00000000..e0ec3456
--- /dev/null
+++ b/klp-ui/src/api/wms/processTask.js
@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 查询工艺任务（生产计划所需工艺任务）列表
+export function listProcessTask(query) {
+  return request({
+    url: '/klp/processTask/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询工艺任务（生产计划所需工艺任务）详细
+export function getProcessTask(taskId) {
+  return request({
+    url: '/klp/processTask/' + taskId,
+    method: 'get'
+  })
+}
+
+// 新增工艺任务（生产计划所需工艺任务）
+export function addProcessTask(data) {
+  return request({
+    url: '/klp/processTask',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改工艺任务（生产计划所需工艺任务）
+export function updateProcessTask(data) {
+  return request({
+    url: '/klp/processTask',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除工艺任务（生产计划所需工艺任务）
+export function delProcessTask(taskId) {
+  return request({
+    url: '/klp/processTask/' + taskId,
+    method: 'delete'
+  })
+}
diff --git a/klp-ui/src/components/KLPService/CraftSelect/index.vue b/klp-ui/src/components/KLPService/CraftSelect/index.vue
new file mode 100644
index 00000000..91ecf0f7
--- /dev/null
+++ b/klp-ui/src/components/KLPService/CraftSelect/index.vue
@@ -0,0 +1,45 @@
+<template>
+  <el-select v-model="processId" placeholder="请选择工艺">
+    <el-option v-for="item in craftList" :key="item.processId" :label="item.processName" :value="item.processId" />
+  </el-select>
+</template>
+
+<script>
+import { mapGetters } from 'vuex';
+
+export default {
+  name: 'CraftSelect',
+  props: {
+    value: {
+      type: [String, Number, undefined],
+      required: false
+    }
+  },
+  data() {
+    return {
+      craftList: []
+    }
+  },
+  mounted() {
+    this.getCraftList();
+  },
+  computed: {
+    ...mapGetters(['processList']),
+    processId: {
+      get() {
+        return this.$props.value;
+      },
+      set(value) {
+        this.$emit('input', value);
+        this.$emit('change', value);
+      }
+    }
+  },
+  methods: {
+    getCraftList() {
+      console.log(this.processList)
+      this.craftList = this.processList;
+    }
+  }
+}
+</script>
\ No newline at end of file
diff --git a/klp-ui/src/store/getters.js b/klp-ui/src/store/getters.js
index ee1a9b21..7af8f383 100644
--- a/klp-ui/src/store/getters.js
+++ b/klp-ui/src/store/getters.js
@@ -20,5 +20,6 @@ const getters = {
   rawMaterialList: state => state.category.rawMaterialList,
   bomMap: state => state.category.bomMap,
   financialAccounts: state => state.finance.financialAccounts,
+  processList: state => state.craft.processList,
 }
 export default getters
diff --git a/klp-ui/src/store/index.js b/klp-ui/src/store/index.js
index ea914faf..e8554aad 100644
--- a/klp-ui/src/store/index.js
+++ b/klp-ui/src/store/index.js
@@ -8,6 +8,7 @@ import permission from './modules/permission'
 import settings from './modules/settings'
 import category from './modules/category'
 import finance from './modules/finance'
+import craft from './modules/craft'
 import getters from './getters'
 
 Vue.use(Vuex)
@@ -21,7 +22,8 @@ const store = new Vuex.Store({
     permission,
     settings,
     category,
-    finance
+    finance,
+    craft
   },
   getters
 })
diff --git a/klp-ui/src/store/modules/craft.js b/klp-ui/src/store/modules/craft.js
new file mode 100644
index 00000000..5b6c5f64
--- /dev/null
+++ b/klp-ui/src/store/modules/craft.js
@@ -0,0 +1,26 @@
+import { listProcesse } from "@/api/wms/craft";
+
+const state = {
+  processList: [],
+}
+
+const mutations = {
+  SET_PROCESS_LIST(state, processList) {
+    state.processList = processList;
+  },
+}
+
+const actions = {
+  getProcessList({ commit }) {
+    listProcesse({ pageSize: 1000 }).then(response => {
+      commit('SET_PROCESS_LIST', response.rows);
+    });
+  }
+}
+
+export default {
+  namespaced: true,
+  state,
+  mutations,
+  actions
+}
\ No newline at end of file
diff --git a/klp-ui/src/store/modules/finance.js b/klp-ui/src/store/modules/finance.js
index 1174f9f3..2129f5dc 100644
--- a/klp-ui/src/store/modules/finance.js
+++ b/klp-ui/src/store/modules/finance.js
@@ -12,8 +12,8 @@ const mutations = {
 
 const actions = {
   getFinancialAccounts({ commit }) {
-    listAccount().then(response => {
-      commit('SET_FINANCIAL_ACCOUNTS', response.data);
+    listAccount({ pageSize: 1000 }).then(response => {
+      commit('SET_FINANCIAL_ACCOUNTS', response.rows);
     });
   }
 }
diff --git a/klp-ui/src/views/finance/order/index.vue b/klp-ui/src/views/finance/order/index.vue
index 50ff073b..0bd4aae6 100644
--- a/klp-ui/src/views/finance/order/index.vue
+++ b/klp-ui/src/views/finance/order/index.vue
@@ -120,7 +120,7 @@ export default {
       currentOrder: null,
       queryParams: {
         pageNum: 1,
-        pageSize: 10,
+        pageSize: 20,
         orderCode: undefined
       },
       orderListLoading: false,
diff --git a/klp-ui/src/views/login.vue b/klp-ui/src/views/login.vue
index 5338e651..bd3cf0b0 100644
--- a/klp-ui/src/views/login.vue
+++ b/klp-ui/src/views/login.vue
@@ -137,6 +137,7 @@ export default {
             this.$store.dispatch('category/getRawMaterialMap');
             this.$store.dispatch('category/getBomMap');
             this.$store.dispatch('finance/getFinancialAccounts');
+            this.$store.dispatch('craft/getProcessList');
             this.$router.push({ path: this.redirect || "/" }).catch(() => { });
           }).catch(() => {
             this.loading = false;
diff --git a/klp-ui/src/views/wms/work/craft.vue b/klp-ui/src/views/wms/work/craft.vue
new file mode 100644
index 00000000..6d2ccb3f
--- /dev/null
+++ b/klp-ui/src/views/wms/work/craft.vue
@@ -0,0 +1,319 @@
+<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="processCode">
+        <el-input
+          v-model="queryParams.processCode"
+          placeholder="请输入工艺编码"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="工艺名称" prop="processName">
+        <el-input
+          v-model="queryParams.processName"
+          placeholder="请输入工艺名称"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <!-- <el-form-item label="产出产品" prop="outputProductId">
+        <el-input
+          v-model="queryParams.outputProductId"
+          placeholder="请输入产出产品"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item> -->
+      <el-form-item label="工艺描述" prop="processDesc">
+        <el-input
+          v-model="queryParams.processDesc"
+          placeholder="请输入工艺描述"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="标准工时" prop="standardTime">
+        <el-input
+          v-model="queryParams.standardTime"
+          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="processeList" @selection-change="handleSelectionChange">
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column label="工艺ID" align="center" prop="processId" v-if="false"/>
+      <el-table-column label="工艺编码" align="center" prop="processCode" />
+      <el-table-column label="工艺名称" align="center" prop="processName" />
+      <!-- <el-table-column label="产出产品" align="center" prop="outputProductId" /> -->
+      <el-table-column label="工艺描述" align="center" prop="processDesc" />
+      <el-table-column label="标准工时" align="center" prop="standardTime" />
+      <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="工艺编码" prop="processCode">
+          <el-input v-model="form.processCode" placeholder="请输入工艺编码" />
+        </el-form-item>
+        <el-form-item label="工艺名称" prop="processName">
+          <el-input v-model="form.processName" placeholder="请输入工艺名称" />
+        </el-form-item>
+        <!-- <el-form-item label="产出产品" prop="outputProductId">
+          <el-input v-model="form.outputProductId" placeholder="请输入产出产品" />
+        </el-form-item> -->
+        <el-form-item label="工艺描述" prop="processDesc">
+          <el-input v-model="form.processDesc" type="textarea" placeholder="请输入内容" />
+        </el-form-item>
+        <el-form-item label="标准工时" prop="standardTime">
+          <el-input v-model="form.standardTime" 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 { listProcesse, getProcesse, delProcesse, addProcesse, updateProcesse } from "@/api/wms/craft";
+
+export default {
+  name: "Processe",
+  data() {
+    return {
+      // 按钮loading
+      buttonLoading: false,
+      // 遮罩层
+      loading: true,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 工艺表格数据
+      processeList: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        processCode: undefined,
+        processName: undefined,
+        outputProductId: undefined,
+        processDesc: undefined,
+        standardTime: undefined,
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {
+      }
+    };
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+    /** 查询工艺列表 */
+    getList() {
+      this.loading = true;
+      listProcesse(this.queryParams).then(response => {
+        this.processeList = response.rows;
+        this.total = response.total;
+        this.loading = false;
+      });
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        processId: undefined,
+        processCode: undefined,
+        processName: undefined,
+        outputProductId: undefined,
+        processDesc: undefined,
+        standardTime: undefined,
+        delFlag: undefined,
+        remark: undefined,
+        createTime: undefined,
+        createBy: undefined,
+        updateTime: undefined,
+        updateBy: 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.processId)
+      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 processId = row.processId || this.ids
+      getProcesse(processId).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.processId != null) {
+            updateProcesse(this.form).then(response => {
+              this.$modal.msgSuccess("修改成功");
+              this.open = false;
+              this.getList();
+            }).finally(() => {
+              this.buttonLoading = false;
+            });
+          } else {
+            addProcesse(this.form).then(response => {
+              this.$modal.msgSuccess("新增成功");
+              this.open = false;
+              this.getList();
+            }).finally(() => {
+              this.buttonLoading = false;
+            });
+          }
+        }
+      });
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      const processIds = row.processId || this.ids;
+      this.$modal.confirm('是否确认删除工艺编号为"' + processIds + '"的数据项？').then(() => {
+        this.loading = true;
+        return delProcesse(processIds);
+      }).then(() => {
+        this.loading = false;
+        this.getList();
+        this.$modal.msgSuccess("删除成功");
+      }).catch(() => {
+      }).finally(() => {
+        this.loading = false;
+      });
+    },
+    /** 导出按钮操作 */
+    handleExport() {
+      this.download('klp/processe/export', {
+        ...this.queryParams
+      }, `processe_${new Date().getTime()}.xlsx`)
+    }
+  }
+};
+</script>
diff --git a/klp-ui/src/views/wms/productionLine/GanttChartEcharts.vue b/klp-ui/src/views/wms/work/productionLine/GanttChartEcharts.vue
similarity index 100%
rename from klp-ui/src/views/wms/productionLine/GanttChartEcharts.vue
rename to klp-ui/src/views/wms/work/productionLine/GanttChartEcharts.vue
diff --git a/klp-ui/src/views/wms/productionLine/index.vue b/klp-ui/src/views/wms/work/productionLine/index.vue
similarity index 100%
rename from klp-ui/src/views/wms/productionLine/index.vue
rename to klp-ui/src/views/wms/work/productionLine/index.vue
diff --git a/klp-ui/src/views/wms/schedulePlan/detail.vue b/klp-ui/src/views/wms/work/schedulePlan/detail.vue
similarity index 68%
rename from klp-ui/src/views/wms/schedulePlan/detail.vue
rename to klp-ui/src/views/wms/work/schedulePlan/detail.vue
index b48a9e86..15bb0d6d 100644
--- a/klp-ui/src/views/wms/schedulePlan/detail.vue
+++ b/klp-ui/src/views/wms/work/schedulePlan/detail.vue
@@ -1,79 +1,89 @@
 <template>
   <div class="app-container">
-    <el-card>
-      <div slot="header">
-        <span>排产计划详情</span>
-        <el-button style="float: right;" @click="$router.back()" size="mini">返回</el-button>
-      </div>
-      <el-descriptions :title="'排产计划编号：' + (planInfo.planCode || '-')" :column="2" border>
-        <el-descriptions-item label="计划ID">{{ planInfo.planId }}</el-descriptions-item>
-        <el-descriptions-item label="关联订单ID">{{ planInfo.orderId }}</el-descriptions-item>
-        <el-descriptions-item label="状态">{{ planInfo.status }}</el-descriptions-item>
-        <el-descriptions-item label="备注">{{ planInfo.remark }}</el-descriptions-item>
-      </el-descriptions>
-    </el-card>
-    <el-card class="mt20">
-      <div slot="header">
-        <span>排产计划明细</span>
+    <el-page-header @back="$router.back()" :content="'排产计划编号：' + (planInfo.planCode || '-')" />
+
+    <el-tabs>
+      <el-tab-pane label="排产计划详情">
+        <el-descriptions :column="1" border>
+          <el-descriptions-item label="计划ID">{{ planInfo.planId }}</el-descriptions-item>
+          <el-descriptions-item label="关联订单ID">{{ planInfo.orderId }}</el-descriptions-item>
+          <el-descriptions-item label="状态">{{ planInfo.status }}</el-descriptions-item>
+          <el-descriptions-item label="备注">{{ planInfo.remark }}</el-descriptions-item>
+        </el-descriptions>
+      </el-tab-pane>
+
+      <el-tab-pane label="生产目标">
+        <TargetPanel :list="orderDetailList" :planId="planId" />
+      </el-tab-pane>
+
+      <el-tab-pane label="批次管理">
+        <BatchPanel />
+      </el-tab-pane>
+
+      <!-- <el-tab-pane label="工艺任务">
+        <CraftTaskPanel :list="orderDetailList" />
+      </el-tab-pane> -->
+
+      <el-tab-pane label="计划明细">
         <el-button type="primary" size="mini" style="float:right" @click="openDetailDialog()">新增明细</el-button>
-      </div>
-      <el-table :data="detailList" v-loading="loading" style="width: 100%">
-        <el-table-column prop="detailId" label="明细ID" align="center" />
-        <el-table-column prop="lineName" label="产线名称" align="center" />
-        <!-- <el-table-column prop="productName" label="产品名称" align="center" /> -->
-        <el-table-column prop="productCode" label="产品信息" align="center">
-          <template slot-scope="scope">
-            <ProductInfo :productId="scope.row.productId" />
-          </template>
-        </el-table-column>
-        <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-card>
-    <el-dialog :title="detailDialogTitle" :visible.sync="detailDialogVisible" width="700px" :modal-append-to-body="false" @close="resetDetailForm" :style="{maxHeight: '80vh'}">
+        <el-table :data="detailList" v-loading="loading" style="width: 100%">
+          <el-table-column prop="detailId" label="明细ID" align="center" />
+          <el-table-column prop="lineName" label="产线名称" align="center" />
+          <!-- <el-table-column prop="productName" label="产品名称" align="center" /> -->
+          <el-table-column prop="productCode" label="产品信息" align="center">
+            <template slot-scope="scope">
+              <ProductInfo :productId="scope.row.productId" />
+            </template>
+          </el-table-column>
+          <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"
+      :modal-append-to-body="false" @close="resetDetailForm">
       <div style="max-height:60vh;overflow:auto;padding-right:8px;">
         <el-form :model="detailForm" :rules="detailRules" ref="detailForm" label-width="80px" style="overflow:visible;">
           <el-form-item label="产线" prop="lineId">
             <el-select v-model="detailForm.lineId" placeholder="请选择产线" filterable @change="onLineChange">
-              <el-option v-for="item in productionLineList" :key="item.lineId" :label="item.lineName" :value="item.lineId" />
+              <el-option v-for="item in productionLineList" :key="item.lineId" :label="item.lineName"
+                :value="item.lineId" />
             </el-select>
           </el-form-item>
           <el-form-item label="产品" prop="productId">
             <el-select v-model="detailForm.productId" placeholder="请选择产品" filterable>
-              <el-option v-for="item in productList" :key="item.productId" :label="item.productName" :value="item.productId" />
+              <el-option v-for="item in productList" :key="item.productId" :label="item.productName"
+                :value="item.productId" />
             </el-select>
           </el-form-item>
           <el-form-item label="排产数量" prop="quantity">
             <el-input-number v-model="detailForm.quantity" :min="0.01" :step="0.01" style="width:100%" />
           </el-form-item>
           <el-form-item label="计划日期" prop="dateRange">
-            <el-date-picker
-              v-model="detailForm.dateRange"
-              type="daterange"
-              range-separator="至"
-              start-placeholder="开始日期"
-              end-placeholder="结束日期"
-              style="width:100%"
-            />
+            <el-date-picker v-model="detailForm.dateRange" type="daterange" range-separator="至" start-placeholder="开始日期"
+              end-placeholder="结束日期" style="width:100%" />
           </el-form-item>
           <el-form-item label="备注" prop="remark">
             <el-input v-model="detailForm.remark" placeholder="请输入备注" />
           </el-form-item>
         </el-form>
         <div style="margin: 12px 0; max-width:100%; min-width:600px; height:220px; overflow-x:auto; overflow-y:hidden;">
-          <GanttChartEcharts v-if="lineGanttTasks.length > 0 || previewTask" :tasks="previewTask ? [...lineGanttTasks, previewTask] : lineGanttTasks" style="height:220px; min-width:600px;" />
+          <GanttChartEcharts v-if="lineGanttTasks.length > 0 || previewTask"
+            :tasks="previewTask ? [...lineGanttTasks, previewTask] : lineGanttTasks"
+            style="height:220px; min-width:600px;" />
           <el-empty v-else description="请选择产线以查看排产情况" />
         </div>
       </div>
       <div slot="footer" class="dialog-footer">
-        <el-button @click="detailDialogVisible=false">取 消</el-button>
+        <el-button @click="detailDialogVisible = false">取 消</el-button>
         <el-button type="primary" @click="submitDetailForm">确 定</el-button>
       </div>
     </el-dialog>
@@ -83,19 +93,24 @@
 <script>
 import { getSchedulePlan } from '@/api/wms/schedulePlan';
 import { listSchedulePlanDetail, addSchedulePlanDetail, updateSchedulePlanDetail } from '@/api/wms/schedulePlanDetail';
+import { listOrderDetail } from '@/api/wms/orderDetail';
 import { listProduct } from '@/api/wms/product';
 import { listProductionLine } from '@/api/wms/productionLine';
 import GanttChartEcharts from '../productionLine/GanttChartEcharts.vue';
 import { ganttProductionLine } from '@/api/wms/productionLine';
 import ProductInfo from '@/components/KLPService/Renderer/ProductInfo.vue';
+import TargetPanel from './panes/target.vue';
+import CraftTaskPanel from './panes/craftTask.vue';
+import BatchPanel from './panes/batch.vue';
 
 export default {
   name: 'SchedulePlanDetail',
-  components: { GanttChartEcharts, ProductInfo },
+  components: { GanttChartEcharts, ProductInfo, TargetPanel, CraftTaskPanel, BatchPanel },
   data() {
     return {
       planId: null,
       planInfo: {},
+      orderDetailList: [],
       detailList: [],
       loading: false,
       detailDialogVisible: false,
@@ -136,6 +151,12 @@ export default {
     fetchPlanInfo() {
       getSchedulePlan(this.planId).then(res => {
         this.planInfo = res.data || {};
+        this.fetchOrderDetailList();
+      });
+    },
+    fetchOrderDetailList() {
+      listOrderDetail({ orderId: this.planInfo.orderId }).then(res => {
+        this.orderDetailList = res.rows || [];
       });
     },
     fetchDetailList() {
@@ -256,13 +277,13 @@ export default {
       },
       deep: true
     },
-    'detailForm.lineId': function() {
+    'detailForm.lineId': function () {
       this.updatePreviewTask();
     },
-    'detailForm.productId': function() {
+    'detailForm.productId': function () {
       this.updatePreviewTask();
     },
-    'detailForm.quantity': function() {
+    'detailForm.quantity': function () {
       this.updatePreviewTask();
     }
   }
@@ -270,5 +291,7 @@ export default {
 </script>
 
 <style scoped>
-.mt20 { margin-top: 20px; }
+.mt20 {
+  margin-top: 20px;
+}
 </style>
diff --git a/klp-ui/src/views/wms/schedulePlan/index.vue b/klp-ui/src/views/wms/work/schedulePlan/index.vue
similarity index 97%
rename from klp-ui/src/views/wms/schedulePlan/index.vue
rename to klp-ui/src/views/wms/work/schedulePlan/index.vue
index e673a703..653be4cc 100644
--- a/klp-ui/src/views/wms/schedulePlan/index.vue
+++ b/klp-ui/src/views/wms/work/schedulePlan/index.vue
@@ -71,10 +71,10 @@
 
       <el-table v-loading="loading" :data="schedulePlanList" @selection-change="handleSelectionChange">
         <el-table-column type="selection" width="55" align="center" />
-<!--        <el-table-column label="排产计划ID" align="center" prop="planId" v-if="true"/>-->
+        <!-- <el-table-column label="排产计划ID" align="center" prop="planId" v-if="true"/> -->
         <el-table-column label="排产计划编号" align="center" prop="planCode" />
         <el-table-column label="关联订单ID" align="center" prop="orderId" />
-        <el-table-column label="工艺路线" align="center" prop="processRoute" />
+        <!-- <el-table-column label="工艺路线" align="center" prop="processRoute" /> -->
         <el-table-column label="开始时间" align="center" prop="startDate">
           <template slot-scope="scope">
             {{ scope.row.startDate ? scope.row.startDate.substr(0, 10) : '' }}
@@ -174,9 +174,9 @@
               ></el-option>
             </el-select>
           </el-form-item>
-          <el-form-item label="工艺路线" prop="processRoute">
+          <!-- <el-form-item label="工艺路线" prop="processRoute">
             <el-input v-model="form.processRoute" placeholder="请输入工艺路线" />
-          </el-form-item>
+          </el-form-item> -->
           <el-form-item label="备注" prop="remark">
             <el-input v-model="form.remark" placeholder="请输入备注" />
           </el-form-item>
@@ -268,7 +268,7 @@
           updateTime: undefined,
           updateBy: undefined,
           priority: undefined,
-          processRoute: undefined,
+          // processRoute: undefined,
           startDate: undefined,
           endDate: undefined,
         };
diff --git a/klp-ui/src/views/wms/work/schedulePlan/panes/batch.vue b/klp-ui/src/views/wms/work/schedulePlan/panes/batch.vue
new file mode 100644
index 00000000..a0f583ca
--- /dev/null
+++ b/klp-ui/src/views/wms/work/schedulePlan/panes/batch.vue
@@ -0,0 +1,292 @@
+<template>
+  <div class="app-container">
+    <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="batchList" @selection-change="handleSelectionChange">
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column label="批次ID" align="center" prop="batchId" v-if="true"/>
+      <el-table-column label="批次编号" align="center" prop="batchNo" />
+      <el-table-column label="关联工艺ID" align="center" prop="processId" />
+      <el-table-column label="批次总数量" align="center" prop="totalQuantity" />
+      <el-table-column label="合并来源" align="center" prop="mergeSource" />
+      <el-table-column label="预计开始时间" align="center" prop="estimatedStartTime" width="180">
+        <template slot-scope="scope">
+          <span>{{ parseTime(scope.row.estimatedStartTime, '{y}-{m}-{d}') }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="预计结束时间" align="center" prop="estimatedEndTime" width="180">
+        <template slot-scope="scope">
+          <span>{{ parseTime(scope.row.estimatedEndTime, '{y}-{m}-{d}') }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="批次状态" align="center" prop="batchStatus" />
+      <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>
+
+    <!-- 添加或修改批次（合并相同工艺的任务）对话框 -->
+    <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="batchNo">
+          <el-input v-model="form.batchNo" placeholder="请输入批次编号" />
+        </el-form-item>
+        <!-- <el-form-item label="关联工艺ID" prop="processId">
+          <el-input v-model="form.processId" placeholder="请输入关联工艺ID" />
+        </el-form-item> -->
+        <el-form-item label="批次总数量" prop="totalQuantity">
+          <el-input v-model="form.totalQuantity" placeholder="请输入批次总数量" />
+        </el-form-item>
+        <el-form-item label="合并来源" prop="mergeSource">
+          <el-input v-model="form.mergeSource" type="textarea" placeholder="请输入内容" />
+        </el-form-item>
+        <el-form-item label="预计开始时间" prop="estimatedStartTime">
+          <el-date-picker clearable
+            v-model="form.estimatedStartTime"
+            type="datetime"
+            value-format="yyyy-MM-dd HH:mm:ss"
+            placeholder="请选择预计开始时间">
+          </el-date-picker>
+        </el-form-item>
+        <el-form-item label="预计结束时间" prop="estimatedEndTime">
+          <el-date-picker clearable
+            v-model="form.estimatedEndTime"
+            type="datetime"
+            value-format="yyyy-MM-dd HH:mm:ss"
+            placeholder="请选择预计结束时间">
+          </el-date-picker>
+        </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 { listBatch, getBatch, delBatch, addBatch, updateBatch } from "@/api/wms/batch";
+
+export default {
+  name: "Batch",
+  data() {
+    return {
+      // 按钮loading
+      buttonLoading: false,
+      // 遮罩层
+      loading: true,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 批次（合并相同工艺的任务）表格数据
+      batchList: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 999,
+        planId: this.planId,
+        batchNo: undefined,
+        processId: undefined,
+        totalQuantity: undefined,
+        mergeSource: undefined,
+        estimatedStartTime: undefined,
+        estimatedEndTime: undefined,
+        batchStatus: undefined,
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {
+      }
+    };
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+    /** 查询批次（合并相同工艺的任务）列表 */
+    getList() {
+      this.loading = true;
+      listBatch(this.queryParams).then(response => {
+        this.batchList = response.rows;
+        this.total = response.total;
+        this.loading = false;
+      });
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        batchId: undefined,
+        batchNo: undefined,
+        processId: undefined,
+        totalQuantity: undefined,
+        mergeSource: undefined,
+        estimatedStartTime: undefined,
+        estimatedEndTime: undefined,
+        batchStatus: undefined,
+        delFlag: undefined,
+        remark: undefined,
+        createTime: undefined,
+        createBy: undefined,
+        updateTime: undefined,
+        updateBy: 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.batchId)
+      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 batchId = row.batchId || this.ids
+      getBatch(batchId).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.batchId != null) {
+            updateBatch(this.form).then(response => {
+              this.$modal.msgSuccess("修改成功");
+              this.open = false;
+              this.getList();
+            }).finally(() => {
+              this.buttonLoading = false;
+            });
+          } else {
+            addBatch(this.form).then(response => {
+              this.$modal.msgSuccess("新增成功");
+              this.open = false;
+              this.getList();
+            }).finally(() => {
+              this.buttonLoading = false;
+            });
+          }
+        }
+      });
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      const batchIds = row.batchId || this.ids;
+      this.$modal.confirm('是否确认删除批次（合并相同工艺的任务）编号为"' + batchIds + '"的数据项？').then(() => {
+        this.loading = true;
+        return delBatch(batchIds);
+      }).then(() => {
+        this.loading = false;
+        this.getList();
+        this.$modal.msgSuccess("删除成功");
+      }).catch(() => {
+      }).finally(() => {
+        this.loading = false;
+      });
+    },
+    /** 导出按钮操作 */
+    handleExport() {
+      this.download('klp/batch/export', {
+        ...this.queryParams
+      }, `batch_${new Date().getTime()}.xlsx`)
+    }
+  }
+};
+</script>
diff --git a/klp-ui/src/views/wms/work/schedulePlan/panes/craftTask.vue b/klp-ui/src/views/wms/work/schedulePlan/panes/craftTask.vue
new file mode 100644
index 00000000..686ac6ad
--- /dev/null
+++ b/klp-ui/src/views/wms/work/schedulePlan/panes/craftTask.vue
@@ -0,0 +1,53 @@
+<template>
+  <div>
+    <el-collapse>
+      <el-collapse-item v-for="detail in list" :key="detail.detailId" :title="detail.productName">
+        <el-descriptions>
+          <el-descriptions-item label="产品名称">{{ detail.productName }}</el-descriptions-item>
+          <el-descriptions-item label="产品编码">{{ detail.productCode }}</el-descriptions-item>
+          <el-descriptions-item label="产品数量">{{ detail.quantity }}</el-descriptions-item>
+          <el-descriptions-item label="单位">{{ detail.unit }}</el-descriptions-item>
+          <el-descriptions-item label="备注">{{ detail.remark }}</el-descriptions-item>
+        </el-descriptions>
+      </el-collapse-item>
+    </el-collapse>
+  </div>
+</template>
+
+<script>
+import ProductSelect from '@/components/KLPService/ProductSelect';
+import { ProductInfo } from '@/components/KLPService';
+import BomInfoMini from '@/components/KLPService/Renderer/BomInfoMini.vue';
+
+export default {
+  name: "OrderDetailPanel",
+  dicts: ['order_status'],
+  props: {
+    list: {
+      type: Array,
+      required: true
+    }
+  },
+  components: {
+    ProductSelect,
+    ProductInfo,
+    BomInfoMini
+  },
+  data() {
+    return {
+      orderDetailList: [],
+      queryParams: {
+        pageNum: 1,
+        pageSize: 9999,
+        orderId: this.orderId,
+        productId: undefined,
+        quantity: undefined,
+        unit: undefined,
+      },
+    };
+  },
+};
+</script>
+
+<style scoped>
+</style>
diff --git a/klp-ui/src/views/wms/work/schedulePlan/panes/target.vue b/klp-ui/src/views/wms/work/schedulePlan/panes/target.vue
new file mode 100644
index 00000000..b8244433
--- /dev/null
+++ b/klp-ui/src/views/wms/work/schedulePlan/panes/target.vue
@@ -0,0 +1,310 @@
+<template>
+  <div>
+    <el-table 
+      v-loading="loading" 
+      :data="list"
+      border
+      style="width: 100%; margin-bottom: 20px;"
+    >
+      <el-table-column label="产品" align="center">
+        <template slot-scope="scope">
+          <ProductInfo :product-id="scope.row.productId">
+            <template #default="{ product }">
+              {{ product.productName }}<span v-if="product.productCode">({{ product.productCode }})</span>
+            </template>
+          </ProductInfo>
+        </template>
+      </el-table-column>
+      <el-table-column label="BOM" align="center">
+        <template slot-scope="scope">
+          <BomInfoMini item-type="product" :item-id="scope.row.productId" />
+        </template>
+      </el-table-column>
+      <el-table-column label="产品数量" align="center" prop="quantity" />
+      <el-table-column label="单位" align="center" prop="unit" />
+      <el-table-column label="备注" align="center" prop="remark" />
+      <el-table-column label="操作">
+        <template slot-scope="scope">
+          <el-button type="text" @click="handleProcessTask(scope.row)">工序</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <el-dialog title="工序" :visible.sync="processTaskDialogVisible" width="80%">
+      <el-table 
+        :data="processTaskList" 
+        border
+        style="width: 100%"
+        @sort-change="handleSortChange"
+      >
+        <el-table-column label="序号" type="index" width="60" align="center" />
+        
+        <el-table-column 
+          label="工序顺序" 
+          prop="sequence" 
+          align="center"
+        >
+          <template slot-scope="scope">
+            <el-input 
+              v-model="scope.row.sequence" 
+              size="mini" 
+              type="number"
+              style="width: 80px;"
+            />
+          </template>
+        </el-table-column>
+        
+        <el-table-column 
+          label="工艺" 
+          prop="processId" 
+          align="center"
+        >
+          <template slot-scope="scope">
+            <CraftSelect v-model="scope.row.processId" />
+          </template>
+        </el-table-column>
+        
+        <el-table-column 
+          label="任务数量" 
+          prop="taskQuantity" 
+          align="center"
+        >
+          <template slot-scope="scope">
+            <el-input 
+              v-model="scope.row.taskQuantity" 
+              size="mini" 
+              type="number"
+              style="width: 100px;"
+            />
+          </template>
+        </el-table-column>
+        
+        <el-table-column 
+          label="任务状态" 
+          prop="taskStatus" 
+          align="center"
+        >
+          <template slot-scope="scope">
+            <el-select v-model="scope.row.taskStatus" placeholder="请选择任务状态" size="mini">
+              <el-option v-for="item in dict.type.process_task_status" :key="item.value" :label="item.label" :value="item.value" />
+            </el-select>
+          </template>
+        </el-table-column>
+        
+        <el-table-column label="操作" align="center" width="120">
+          <template slot-scope="scope">
+            <el-button type="text" size="small" @click="handleDelete(scope.$index)">删除</el-button>
+            <el-button type="text" size="small" @click="handleSave(scope.row)">保存</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      
+      <!-- 新增按钮区域 -->
+      <div style="margin-top: 15px; text-align: right;">
+        <el-button 
+          type="primary" 
+          icon="el-icon-plus" 
+          @click="handleAddProcessTask"
+        >
+          新增工序
+        </el-button>
+        <!-- <el-button 
+          type="success" 
+          style="margin-left: 10px;"
+          @click="handleSaveProcessTasks"
+        >
+          保存所有工序
+        </el-button> -->
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import ProductSelect from '@/components/KLPService/ProductSelect';
+import { ProductInfo } from '@/components/KLPService';
+import BomInfoMini from '@/components/KLPService/Renderer/BomInfoMini.vue';
+import { listProcessTask, addProcessTask, updateProcessTask } from '@/api/wms/processTask';
+import CraftSelect from '@/components/KLPService/CraftSelect';
+
+export default {
+  name: "OrderDetailPanel",
+  dicts: ['order_status', 'process_task_status'],
+  props: {
+    list: {
+      type: Array,
+      required: true
+    },
+    planId: {
+      type: [String, Number, undefined],
+      required: true
+    }
+  },
+  components: {
+    ProductSelect,
+    ProductInfo,
+    BomInfoMini,
+    CraftSelect
+  },
+  data() {
+    return {
+      loading: false,
+      orderDetailList: [],
+      queryParams: {
+        pageNum: 1,
+        pageSize: 9999,
+        orderId: this.orderId,
+        productId: undefined,
+        quantity: undefined,
+        unit: undefined,
+        // 排序参数
+        orderByColumn: '',
+        isAsc: 'asc'
+      },
+      processTaskDialogVisible: false,
+      processTaskList: [],
+      form: {},
+      currentProductId: null,
+      currentProductCount: 0,
+    };
+  },
+  methods: {
+    handleProcessTask(row) {
+      this.processTaskDialogVisible = true;
+      this.currentProductId = row.productId;
+      this.currentProductCount = row.quantity;
+      this.form = {
+        productId: row.productId,
+        planId: this.planId,
+        // 重置排序参数
+        orderByColumn: '',
+        isAsc: 'asc'
+      };
+      this.getProcessTaskList();
+    },
+    
+    // 获取工序任务列表
+    getProcessTaskList() {
+      this.loading = true;
+      // 将排序参数添加到请求中
+      const params = {
+        ...this.form,
+        orderByColumn: this.queryParams.orderByColumn,
+        isAsc: this.queryParams.isAsc
+      };
+      
+      listProcessTask(params).then(res => {
+        this.processTaskList = res.rows || [];
+        this.loading = false;
+      }).catch(() => {
+        this.loading = false;
+      });
+    },
+    
+    // 处理排序变化
+    handleSortChange({ column, prop, order }) {
+      if (order) {
+        this.queryParams.orderByColumn = prop;
+        this.queryParams.isAsc = order === 'ascending' ? 'asc' : 'desc';
+      } else {
+        this.queryParams.orderByColumn = '';
+        this.queryParams.isAsc = 'asc';
+      }
+      // 重新获取数据
+      this.getProcessTaskList();
+    },
+    
+    // 新增工序
+    handleAddProcessTask() {
+      const newSequence = 
+      this.processTaskList.length >= 1 ?
+        Math.max(...this.processTaskList.map(item => item.sequence || 0)) + 1 
+        : 1;
+      // 添加新的工序行
+      this.processTaskList.push({
+        id: null, // 新记录ID为空
+        productId: this.currentProductId,
+        planId: this.planId,
+        processId: '',
+        taskQuantity: this.currentProductCount,
+        taskStatus: 'pending',
+        sequence: newSequence
+      });
+    },
+    
+    // 删除工序
+    handleDelete(index) {
+      this.$confirm('确定要删除这条工序吗？', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        this.processTaskList.splice(index, 1);
+        this.$message.success('删除成功');
+      }).catch(() => {
+        // 取消删除
+      });
+    },
+    
+    // 保存所有工序
+    handleSaveProcessTasks() {
+      // 验证数据
+      const invalidItems = this.processTaskList.filter(item => 
+        !item.processId || !item.quantity || !item.taskStatus
+      );
+      
+      if (invalidItems.length > 0) {
+        this.$message.error('请完善所有工序的工艺、数量和状态信息');
+        return;
+      }
+      
+      this.loading = true;
+      saveProcessTasks({
+        productId: this.currentProductId,
+        planId: this.planId,
+        tasks: this.processTaskList
+      }).then(res => {
+        this.$message.success('保存成功');
+        this.getProcessTaskList(); // 重新加载数据
+        this.loading = false;
+      }).catch(() => {
+        this.loading = false;
+      });
+    },
+    
+    // 查看工序详情
+    handleSave(row) {
+      if (row.taskId) {
+        updateProcessTask(row).then(_ => {
+          this.$message.success('保存成功')
+        })
+      } else {
+        addProcessTask(row).then(_ => {
+          this.$message.success('保存成功')
+        })
+      }
+    }
+  }
+};
+</script>
+
+<style scoped>
+::v-deep .el-table__header-wrapper th {
+  background-color: #f5f7fa;
+  font-weight: 500;
+}
+
+::v-deep .el-table-column--sortable .el-table-header__sort {
+  color: #606266;
+}
+
+::v-deep .el-dialog__body {
+  padding: 20px;
+  max-height: 60vh;
+  overflow-y: auto;
+}
+
+::v-deep .el-input--mini {
+  width: 100px;
+}
+</style>