生产工序

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>

klp-ui/src/views/wms/work/productionLine/GanttChartEcharts.vue

@@ -0,0 +1,196 @@
+<template>
+  <div ref="ganttChart" class="echarts-gantt-wrapper" style="width:100%;height:320px;"></div>
+</template>
+
+<script>
+import * as echarts from 'echarts';
+const colorList = [
+  '#409EFF', '#67C23A', '#E6A23C', '#F56C6C', '#909399',
+  '#13C2C2', '#B37FEB', '#FF85C0', '#36CBCB', '#FFC53D'
+];
+function getColor(lineId, orderId, idx) {
+  if (!lineId) return colorList[idx % colorList.length];
+  const base = Math.abs(Number(lineId)) % colorList.length;
+  if (!orderId) return colorList[base];
+  return colorList[(base + Math.abs(Number(orderId)) % colorList.length) % colorList.length];
+}
+export default {
+  name: 'GanttChartEcharts',
+  props: {
+    tasks: {
+      type: Array,
+      default: () => []
+    }
+  },
+  data() {
+    return {
+      chart: null
+    };
+  },
+  watch: {
+    tasks: {
+      handler() {
+        this.renderChart();
+      },
+      deep: true
+    }
+  },
+  mounted() {
+    this.renderChart();
+    window.addEventListener('resize', this.resizeChart);
+  },
+  beforeDestroy() {
+    if (this.chart) this.chart.dispose();
+    window.removeEventListener('resize', this.resizeChart);
+  },
+  methods: {
+    renderChart() {
+      if (!this.$refs.ganttChart) return;
+      if (this.chart) this.chart.dispose();
+      this.chart = echarts.init(this.$refs.ganttChart);
+      if (!this.tasks || this.tasks.length === 0) {
+        this.chart.clear();
+        return;
+      }
+      // 处理数据，兼容多种字段名，保证任务名唯一
+      const taskData = this.tasks.map((item, idx) => {
+        const name = (item.remark || item.taskName || item.productName || item.name || `任务${idx+1}`) + (item.productName ? `-${item.productName}` : '');
+        const start = item.startDate || item.start_time || item.start || item.start_date;
+        const end = item.endDate || item.end_time || item.end || item.end_date;
+        console.log(item.lineId, item.orderId, idx, '颜色取值依据')
+        return {
+          name,
+          value: [start, end],
+          itemStyle: {
+            color: getColor(item.lineId, item.orderId, idx),
+            borderRadius: 6
+          },
+          lineId: item.lineId,
+          orderId: item.orderId,
+          productId: item.productId,
+          quantity: item.quantity,
+          startDate: start,
+          endDate: end
+        };
+      });
+      // 先全部用 getColor 分配基础色
+      taskData.forEach((item, idx) => {
+        item._color = getColor(item.lineId, item.orderId, idx);
+      });
+      // 检查冲突（同产线时间重叠），有冲突的都标红
+      for (let i = 0; i < taskData.length; i++) {
+        for (let j = i + 1; j < taskData.length; j++) {
+          if (
+            taskData[i].lineId &&
+            taskData[i].lineId === taskData[j].lineId &&
+            new Date(taskData[i].value[0]) < new Date(taskData[j].value[1]) &&
+            new Date(taskData[i].value[1]) > new Date(taskData[j].value[0])
+          ) {
+            taskData[i]._color = '#F56C6C';
+            taskData[j]._color = '#F56C6C';
+          }
+        }
+      }
+      // 颜色映射
+      const colorMap = taskData.map(d => d._color);
+      // Y轴任务名
+      const yData = taskData.map(d => d.name);
+      // X轴时间范围
+      const minDate = Math.min(...taskData.map(d => new Date(d.value[0]).getTime()));
+      const maxDate = Math.max(...taskData.map(d => new Date(d.value[1]).getTime()));
+      // 自动调整时间轴范围，避免跨度过大导致任务条重叠
+      const oneMonth = 30 * 24 * 3600 * 1000;
+      let xMin = minDate - oneMonth;
+      let xMax = maxDate + oneMonth;
+      // 如果跨度大于一年，仍然只扩展一个月
+      // 如果跨度小于一个月，最小跨度为两个月
+      if (xMax - xMin < 2 * oneMonth) {
+        xMax = xMin + 2 * oneMonth;
+      }
+      console.log(taskData);
+      
+      // 配置
+      const option = {
+        tooltip: {
+          confine: true,
+          formatter: params => {
+            // 用 params.data[2] 作为索引查找 taskData
+            const idx = params.data && params.data[2];
+            const d = (typeof idx === 'number' && taskData[idx]) ? taskData[idx] : {};
+            return `任务：${d.name || ''}` +
+              `<br/>开始：${d.startDate || ''}` +
+              `<br/>结束：${d.endDate || ''}` +
+              `<br/>日产能：${d.capacity != null ? d.capacity : d.capacity || ''}` +
+              `<br/>总产能：${d.totalCapacity != null ? d.totalCapacity : d.total_capacity || ''}` +
+              `<br/>目标生产：${d.planQuantity != null ? d.planQuantity : d.plan_quantity || ''}` +
+              `<br/>天数：${d.days != null ? d.days : d.day || ''}` +
+              `<br/>数量：${d.quantity != null ? d.quantity : ''}`;
+          }
+        },
+        grid: { left: 120, right: 40, top: 30, bottom: 80 },
+        xAxis: {
+          type: 'time',
+          min: xMin,
+          max: xMax,
+          axisLabel: {
+            formatter: v => echarts.format.formatTime('yyyy-MM-dd', v),
+            rotate: 45 // 关键：倾斜45度
+          }
+        },
+        yAxis: {
+          type: 'category',
+          data: yData,
+          axisTick: { show: false },
+          axisLine: { show: false },
+          axisLabel: { fontWeight: 'bold' }
+        },
+        series: [{
+          type: 'custom',
+          renderItem: (params, api) => {
+            const categoryIndex = api.value(2);
+            const start = api.coord([api.value(0), categoryIndex]);
+            const end = api.coord([api.value(1), categoryIndex]);
+            const barHeight = 18;
+            // 颜色从 colorMap 查
+            const idx = params.dataIndex;
+            let fillColor = colorMap[idx] || '#409EFF';
+            return {
+              type: 'rect',
+              shape: {
+                x: start[0],
+                y: start[1] - barHeight / 2,
+                width: end[0] - start[0],
+                height: barHeight,
+                r: 6
+              },
+              style: {
+                fill: fillColor
+              }
+            };
+          },
+          encode: {
+            x: [0, 1],
+            y: 2
+          },
+          data: taskData.map((d, i) => [d.value[0], d.value[1], i]),
+          itemStyle: {
+            borderRadius: 6
+          }
+        }]
+      };
+      this.chart.setOption(option);
+    },
+    resizeChart() {
+      if (this.chart) this.chart.resize();
+    }
+  }
+};
+</script>
+
+<style>
+.echarts-gantt-wrapper {
+  width: 100%;
+  min-height: 220px;
+  background: #fff;
+}
+</style> 

klp-ui/src/views/wms/work/productionLine/index.vue

@@ -0,0 +1,416 @@
+<template>
+  <div class="production-line-page">
+    <el-tabs v-model="activeTab">
+      <el-tab-pane label="列表" name="list">
+        <!-- 原有列表内容 -->
+        <div v-show="activeTab === 'list'">
+          <!-- 保持原有内容不变 -->
+          <div class="list-content">
+            <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
+              <el-form-item label="产线编号" prop="lineCode">
+                <el-input
+                  v-model="queryParams.lineCode"
+                  placeholder="请输入产线编号"
+                  clearable
+                  @keyup.enter.native="handleQuery"
+                />
+              </el-form-item>
+              <el-form-item label="产线名称" prop="lineName">
+                <el-input
+                  v-model="queryParams.lineName"
+                  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="productionLineList" @selection-change="handleSelectionChange">
+              <el-table-column type="selection" width="55" align="center" />
+              <el-table-column label="产线编号" align="center" prop="lineCode" />
+              <el-table-column label="产线名称" align="center" prop="lineName" />
+              <el-table-column label="日产能" align="center" prop="capacity" />
+              <el-table-column label="负载任务数/预计耗时" align="center" prop="unit">
+                <template slot-scope="scope">
+                  <span>{{ scope.row.planDetailCount }}</span> / 
+                  <span>{{ scope.row.totalPlanDays }}天</span>
+                </template>
+              </el-table-column>
+              <el-table-column label="产能单位" align="center" prop="unit" />
+              <el-table-column label="是否启用" align="center" prop="isEnabled">
+                <template slot-scope="scope">
+                  <el-switch
+                    v-model="scope.row.isEnabled"
+                    :active-value="1"
+                    :inactive-value="0"
+                    active-text="启用"
+                    inactive-text="禁用"
+                    @change="handleEnabledChange(scope.row)"
+                  />
+                </template>
+              </el-table-column>
+              <el-table-column label="备注" align="center" prop="remark" />
+              <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+                <template slot-scope="scope">
+                  <el-button
+                    size="mini"
+                    type="text"
+                    icon="el-icon-edit"
+                    @click="handleUpdate(scope.row)"
+                  >修改</el-button>
+                  <el-button
+                    size="mini"
+                    type="text"
+                    icon="el-icon-delete"
+                    @click="handleDelete(scope.row)"
+                  >删除</el-button>
+                </template>
+              </el-table-column>
+            </el-table>
+
+            <pagination
+              v-show="total>0"
+              :total="total"
+              :page.sync="queryParams.pageNum"
+              :limit.sync="queryParams.pageSize"
+              @pagination="getList"
+            />
+
+            <!-- 添加或修改产线对话框 -->
+            <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
+              <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+                <el-form-item label="产线编号" prop="lineCode">
+                  <el-input v-model="form.lineCode" placeholder="请输入产线编号" />
+                </el-form-item>
+                <el-form-item label="产线名称" prop="lineName">
+                  <el-input v-model="form.lineName" placeholder="请输入产线名称" />
+                </el-form-item>
+                <el-form-item label="日产能" prop="capacity">
+                  <el-input v-model="form.capacity" placeholder="请输入日产能" />
+                </el-form-item>
+                <el-form-item label="产能单位" prop="unit">
+                  <el-input v-model="form.unit" placeholder="请输入产能单位" />
+                </el-form-item>
+                <el-form-item label="是否启用" prop="isEnabled">
+                  <el-switch
+                    v-model="form.isEnabled"
+                    :active-value="1"
+                    :inactive-value="0"
+                    active-text="启用"
+                    inactive-text="禁用"
+                  />
+                </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>
+        </div>
+      </el-tab-pane>
+      <el-tab-pane label="甘特图" name="gantt">
+        <div v-show="activeTab === 'gantt'">
+          <div style="margin-bottom: 16px; display: flex; gap: 16px; align-items: center;">
+            <el-select v-model="selectedLineId" placeholder="选择产线" style="width: 180px" @change="fetchGanttData">
+              <el-option v-for="item in lineList" :key="item.lineId" :label="item.lineName" :value="item.lineId" />
+            </el-select>
+          </div>
+          <GanttChartEcharts :tasks="ganttTasks" v-if="ganttTasks.length > 0" />
+          <el-empty v-else description="暂无甘特图数据" />
+        </div>
+      </el-tab-pane>
+    </el-tabs>
+  </div>
+</template>
+
+<script>
+import GanttChartEcharts from './GanttChartEcharts.vue';
+import { listProductionLine, getProductionLine, delProductionLine, addProductionLine, updateProductionLine, ganttProductionLine } from "@/api/wms/productionLine";
+import { listOrder } from '@/api/wms/order';
+
+export default {
+  name: "ProductionLine",
+  components: { GanttChartEcharts },
+  data() {
+    return {
+      // 按钮loading
+      buttonLoading: false,
+      // 遮罩层
+      loading: true,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 产线表格数据
+      productionLineList: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        lineCode: undefined,
+        lineName: undefined,
+        capacity: undefined,
+        unit: undefined,
+        isEnabled: undefined,
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {
+        lineCode: [
+          { required: true, message: "产线编号不能为空", trigger: "blur" }
+        ],
+        lineName: [
+          { required: true, message: "产线名称不能为空", trigger: "blur" }
+        ],
+        capacity: [
+          { required: true, message: "日产能不能为空", trigger: "blur" }
+        ],
+        unit: [
+          { required: true, message: "产能单位不能为空", trigger: "blur" }
+        ],
+        isEnabled: [
+          { required: true, message: "是否启用不能为空", trigger: "blur" }
+        ],
+      },
+      activeTab: 'list',
+      lineList: [],
+      orderList: [],
+      selectedLineId: null,
+      selectedOrderId: null,
+      ganttTasks: [],
+      ganttOrders: [],
+      ganttOrder: {},
+      ganttOrderDetails: []
+    };
+  },
+  created() {
+    this.getList();
+    this.loadLines();
+    this.loadOrders();
+  },
+  methods: {
+    /** 查询产线列表 */
+    getList() {
+      this.loading = true;
+      listProductionLine(this.queryParams).then(response => {
+        this.productionLineList = response.rows;
+        this.total = response.total;
+        this.loading = false;
+      });
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        lineId: undefined,
+        lineCode: undefined,
+        lineName: undefined,
+        capacity: undefined,
+        unit: undefined,
+        isEnabled: 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.lineId)
+      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 lineId = row.lineId || this.ids
+      getProductionLine(lineId).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.lineId != null) {
+            updateProductionLine(this.form).then(response => {
+              this.$modal.msgSuccess("修改成功");
+              this.open = false;
+              this.getList();
+            }).finally(() => {
+              this.buttonLoading = false;
+            });
+          } else {
+            addProductionLine(this.form).then(response => {
+              this.$modal.msgSuccess("新增成功");
+              this.open = false;
+              this.getList();
+            }).finally(() => {
+              this.buttonLoading = false;
+            });
+          }
+        }
+      });
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      const lineIds = row.lineId || this.ids;
+      this.$modal.confirm('是否确认删除产线编号为"' + lineIds + '"的数据项？').then(() => {
+        this.loading = true;
+        return delProductionLine(lineIds);
+      }).then(() => {
+        this.loading = false;
+        this.getList();
+        this.$modal.msgSuccess("删除成功");
+      }).catch(() => {
+      }).finally(() => {
+        this.loading = false;
+      });
+    },
+    /** 导出按钮操作 */
+    handleExport() {
+      this.download('wms/productionLine/export', {
+        ...this.queryParams
+      }, `productionLine_${new Date().getTime()}.xlsx`)
+    },
+    handleEnabledChange(row) {
+      // 只更新isEnabled字段
+      const updateData = {
+        lineId: row.lineId,
+        isEnabled: row.isEnabled
+      };
+      this.loading = true;
+      updateProductionLine(updateData)
+        .then(() => {
+          this.$modal.msgSuccess("状态更新成功");
+        })
+        .catch(() => {
+          this.$modal.msgError("状态更新失败");
+          // 回滚状态
+          row.isEnabled = row.isEnabled === 1 ? 0 : 1;
+        })
+        .finally(() => {
+          this.loading = false;
+        });
+    },
+    loadLines() {
+      listProductionLine({}).then(res => {
+        this.lineList = res.rows || [];
+      });
+    },
+    loadOrders() {
+      listOrder({}).then(res => {
+        this.orderList = res.rows || [];
+      });
+    },
+    fetchGanttData() {
+      if (!this.selectedLineId) {
+        this.ganttTasks = [];
+        this.ganttOrders = [];
+        return;
+      }
+      ganttProductionLine({
+        lineId: this.selectedLineId
+      }).then(res => {
+        this.ganttTasks = res.data.tasks || [];
+        this.ganttOrders = res.data.orders || [];
+      });
+    }
+  }
+};
+</script>
+
+<style scoped>
+.production-line-page {
+  padding: 16px;
+}
+</style>

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

@@ -0,0 +1,297 @@
+<template>
+  <div class="app-container">
+    <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>
+        <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-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-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-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;" />
+          <el-empty v-else description="请选择产线以查看排产情况" />
+        </div>
+      </div>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="detailDialogVisible = false">取 消</el-button>
+        <el-button type="primary" @click="submitDetailForm">确 定</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<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, TargetPanel, CraftTaskPanel, BatchPanel },
+  data() {
+    return {
+      planId: null,
+      planInfo: {},
+      orderDetailList: [],
+      detailList: [],
+      loading: false,
+      detailDialogVisible: false,
+      detailDialogTitle: '',
+      detailForm: {
+        detailId: undefined,
+        planId: undefined,
+        lineId: undefined,
+        productId: undefined,
+        quantity: 1,
+        dateRange: [],
+        startDate: '',
+        endDate: '',
+        remark: ''
+      },
+      detailRules: {
+        productId: [{ required: true, message: '请选择产品', trigger: 'change' }],
+        lineId: [{ required: true, message: '请选择产线', trigger: 'change' }],
+        quantity: [{ required: true, message: '请输入排产数量', trigger: 'blur' }],
+        dateRange: [{ required: true, type: 'array', len: 2, message: '请选择计划日期区间', trigger: 'change' }]
+      },
+      productList: [],
+      productionLineList: [],
+      lineGanttTasks: [],
+      previewTask: null
+    };
+  },
+  created() {
+    this.planId = this.$route.query.planId;
+    if (this.planId) {
+      this.fetchPlanInfo();
+      this.fetchDetailList();
+      this.fetchProductList();
+      this.fetchProductionLineList();
+    }
+  },
+  methods: {
+    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() {
+      this.loading = true;
+      listSchedulePlanDetail({ planId: this.planId }).then(res => {
+        this.detailList = res.rows || [];
+      }).finally(() => {
+        this.loading = false;
+      });
+    },
+    fetchProductList() {
+      listProduct({ pageNum: 1, pageSize: 1000 }).then(res => {
+        this.productList = res.rows || [];
+      });
+    },
+    fetchProductionLineList() {
+      listProductionLine({ pageNum: 1, pageSize: 1000 }).then(res => {
+        this.productionLineList = res.rows || [];
+      });
+    },
+    openDetailDialog(row) {
+      if (row) {
+        this.detailDialogTitle = '编辑明细';
+        this.detailForm = Object.assign({}, row);
+        this.detailForm.dateRange = row.startDate && row.endDate ? [row.startDate, row.endDate] : [];
+      } else {
+        this.detailDialogTitle = '新增明细';
+        this.detailForm = {
+          detailId: undefined,
+          planId: this.planId,
+          lineId: undefined,
+          productId: undefined,
+          quantity: 1,
+          dateRange: [],
+          startDate: '',
+          endDate: '',
+          remark: ''
+        };
+      }
+      this.lineGanttTasks = [];
+      this.detailDialogVisible = true;
+    },
+    resetDetailForm() {
+      this.$refs.detailForm && this.$refs.detailForm.resetFields();
+    },
+    onLineChange(lineId) {
+      if (!lineId) {
+        this.lineGanttTasks = [];
+        return;
+      }
+      ganttProductionLine({ lineId }).then(res => {
+        this.lineGanttTasks = res.data.tasks || [];
+        this.updatePreviewTask();
+      });
+    },
+    // 监听日期区间变化，生成预览任务条
+    updatePreviewTask() {
+      const { lineId, productId, dateRange, quantity } = this.detailForm;
+      if (!lineId || !dateRange || dateRange.length !== 2) {
+        this.previewTask = null;
+        return;
+      }
+      const startDate = dateRange[0];
+      const endDate = dateRange[1];
+      // 判断是否与已有任务冲突（只要有一天重合就算冲突）
+      let hasConflict = false;
+      console.log(this.lineGanttTasks);
+
+      for (const t of this.lineGanttTasks) {
+        if (!t.startDate || !t.endDate) continue;
+        const s1 = new Date(startDate).getTime();
+        const e1 = new Date(endDate).getTime();
+        const s2 = new Date(t.startDate).getTime();
+        const e2 = new Date(t.endDate).getTime();
+        // 只要有一天重合就算冲突
+        if (!(e1 < s2 || s1 > e2)) {
+          hasConflict = true;
+          break;
+        }
+
+
+      }
+
+      this.previewTask = {
+        name: '新任务(预览)',
+        startDate,
+        endDate,
+        quantity,
+        lineId,
+        productId,
+        itemStyle: { color: hasConflict ? '#F56C6C' : '#67C23A', borderRadius: 6 },
+      };
+    },
+    submitDetailForm() {
+      this.$refs.detailForm.validate(valid => {
+        if (!valid) return;
+        if (this.detailForm.dateRange && this.detailForm.dateRange.length === 2) {
+          this.detailForm.startDate = this.detailForm.dateRange[0];
+          this.detailForm.endDate = this.detailForm.dateRange[1];
+        } else {
+          this.detailForm.startDate = '';
+          this.detailForm.endDate = '';
+        }
+        const api = this.detailForm.detailId ? updateSchedulePlanDetail : addSchedulePlanDetail;
+        const data = Object.assign({}, this.detailForm, { planId: this.planId });
+        api(data).then(() => {
+          this.$message.success(this.detailForm.detailId ? '修改成功' : '新增成功');
+          this.detailDialogVisible = false;
+          this.fetchDetailList();
+        });
+      });
+    }
+  },
+  watch: {
+    'detailForm.dateRange': {
+      handler() {
+        this.updatePreviewTask();
+      },
+      deep: true
+    },
+    'detailForm.lineId': function () {
+      this.updatePreviewTask();
+    },
+    'detailForm.productId': function () {
+      this.updatePreviewTask();
+    },
+    'detailForm.quantity': function () {
+      this.updatePreviewTask();
+    }
+  }
+};
+</script>
+
+<style scoped>
+.mt20 {
+  margin-top: 20px;
+}
+</style>

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

@@ -0,0 +1,415 @@
+<template>
+    <div class="app-container">
+      <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="100px">
+        <el-form-item label="排产计划编号" prop="planCode">
+          <el-input
+            v-model="queryParams.planCode"
+            placeholder="请输入排产计划编号"
+            clearable
+            @keyup.enter.native="handleQuery"
+          />
+        </el-form-item>
+        <el-form-item label="关联订单ID" prop="orderId">
+          <el-input
+            v-model="queryParams.orderId"
+            placeholder="请输入关联订单ID"
+            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="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="排产计划编号" 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="startDate">
+          <template slot-scope="scope">
+            {{ scope.row.startDate ? scope.row.startDate.substr(0, 10) : '' }}
+          </template>
+        </el-table-column>
+        <el-table-column label="结束时间" align="center" prop="endDate">
+          <template slot-scope="scope">
+            {{ scope.row.endDate ? scope.row.endDate.substr(0, 10) : '' }}
+          </template>
+        </el-table-column>
+        <el-table-column label="优先级" align="center" prop="priority">
+          <template slot-scope="scope">
+            <dict-tag :options="dict.type.schedule_plan_priority" :value="scope.row.priority" />
+          </template>
+        </el-table-column>
+        <el-table-column label="状态" align="center" prop="status">
+          <template slot-scope="scope">
+            <el-select v-model="scope.row.status" @change="handleStatusChange(scope.row)">
+              <el-option key="1" :value="0" label="新建">
+                <el-tag type="info">新建</el-tag>
+              </el-option>
+              <el-option key="2" :value="1" label="已排产">
+                <el-tag type="warning">已排产</el-tag>
+              </el-option>
+              <el-option key="3" :value="2" label="生产中">
+                <el-tag type="primary">生产中</el-tag>
+              </el-option>
+              <el-option key="4" :value="3" label="已完成">
+                <el-tag type="success">已完成</el-tag>
+              </el-option>
+            </el-select>
+            <!-- <el-tag :type="statusTagType(scope.row.status)" disable-transitions>
+              {{ statusText(scope.row.status) }}
+            </el-tag> -->
+          </template>
+        </el-table-column>
+        <el-table-column label="备注" align="center" prop="remark" />
+        <el-table-column label="创建时间" align="center" prop="createTime" width="200">
+          <template slot-scope="scope">
+            <span>{{ parseTime(scope.row.createTime) }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="创建人" align="center" prop="createBy" />
+        <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="handleDetail(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="120px">
+          <el-form-item label="计划编号" prop="planCode">
+            <el-input v-model="form.planCode" placeholder="请输入排产计划编号" />
+          </el-form-item>
+          <el-form-item label="计划版本" prop="version">
+            <el-input v-model="form.version" placeholder="请输入计划版本" />
+          </el-form-item>
+          <el-form-item label="关联订单" prop="orderId">
+            <el-select v-model="form.orderId" placeholder="请选择关联订单" filterable clearable>
+              <el-option v-for="item in orderList" :key="item.orderId" :label="item.orderCode || item.orderId" :value="item.orderId" />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="优先级" prop="priority">
+            <el-select v-model="form.priority" placeholder="请选择优先级">
+              <el-option
+                v-for="dict in dict.type.schedule_plan_priority"
+                :key="dict.value"
+                :label="dict.label"
+                :value="parseInt(dict.value)"
+              ></el-option>
+            </el-select>
+          </el-form-item>
+          <!-- <el-form-item label="工艺路线" prop="processRoute">
+            <el-input v-model="form.processRoute" 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 { listSchedulePlan, getSchedulePlan, delSchedulePlan, addSchedulePlan, updateSchedulePlan } from "@/api/wms/schedulePlan";
+  import { listOrder } from "@/api/wms/order";
+
+  export default {
+    name: "SchedulePlan",
+    dicts: ['schedule_plan_priority'],
+    data() {
+      return {
+        // 按钮loading
+        buttonLoading: false,
+        // 遮罩层
+        loading: true,
+        // 选中数组
+        ids: [],
+        // 非单个禁用
+        single: true,
+        // 非多个禁用
+        multiple: true,
+        // 显示搜索条件
+        showSearch: true,
+        // 总条数
+        total: 0,
+        // 排产计划表格数据
+        schedulePlanList: [],
+        // 弹出层标题
+        title: "",
+        // 是否显示弹出层
+        open: false,
+        // 查询参数
+        queryParams: {
+          pageNum: 1,
+          pageSize: 10,
+          planCode: undefined,
+          orderId: undefined,
+          status: undefined,
+        },
+        // 表单参数
+        form: {},
+        // 表单校验
+        rules: {
+        },
+        orderList: [], // 新增：订单列表
+      };
+    },
+    created() {
+      this.getList();
+      this.getOrderList(); // 新增：获取订单列表
+    },
+    methods: {
+      /** 查询排产计划列表 */
+      getList() {
+        this.loading = true;
+        listSchedulePlan(this.queryParams).then(response => {
+          this.schedulePlanList = response.rows;
+          this.total = response.total;
+          this.loading = false;
+        });
+      },
+      // 取消按钮
+      cancel() {
+        this.open = false;
+        this.reset();
+      },
+      // 表单重置
+      reset() {
+        this.form = {
+          planId: undefined,
+          planCode: undefined,
+          version: undefined,
+          orderId: undefined,
+          status: undefined,
+          remark: undefined,
+          delFlag: undefined,
+          createTime: undefined,
+          createBy: undefined,
+          updateTime: undefined,
+          updateBy: undefined,
+          priority: undefined,
+          // processRoute: undefined,
+          startDate: undefined,
+          endDate: undefined,
+        };
+        this.resetForm("form");
+      },
+      /** 搜索按钮操作 */
+      handleQuery() {
+        this.queryParams.pageNum = 1;
+        this.getList();
+      },
+      handleStatusChange(row) {
+        console.log(row);
+        updateSchedulePlan(row).then(response => {
+          this.$modal.msgSuccess("修改成功");
+          this.getList();
+        });
+      },
+      /** 重置按钮操作 */
+      resetQuery() {
+        this.resetForm("queryForm");
+        this.handleQuery();
+      },
+      // 多选框选中数据
+      handleSelectionChange(selection) {
+        this.ids = selection.map(item => item.planId)
+        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 planId = row.planId || this.ids
+        getSchedulePlan(planId).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.planId != null) {
+              updateSchedulePlan(this.form).then(response => {
+                this.$modal.msgSuccess("修改成功");
+                this.open = false;
+                this.getList();
+              }).finally(() => {
+                this.buttonLoading = false;
+              });
+            } else {
+              addSchedulePlan(this.form).then(response => {
+                this.$modal.msgSuccess("新增成功");
+                this.open = false;
+                this.getList();
+              }).finally(() => {
+                this.buttonLoading = false;
+              });
+            }
+          }
+        });
+      },
+      /** 删除按钮操作 */
+      handleDelete(row) {
+        const planIds = row.planId || this.ids;
+        this.$modal.confirm('是否确认删除排产计划编号为"' + planIds + '"的数据项？').then(() => {
+          this.loading = true;
+          return delSchedulePlan(planIds);
+        }).then(() => {
+          this.loading = false;
+          this.getList();
+          this.$modal.msgSuccess("删除成功");
+        }).catch(() => {
+        }).finally(() => {
+          this.loading = false;
+        });
+      },
+      /** 导出按钮操作 */
+      handleExport() {
+        this.download('wms/schedulePlan/export', {
+          ...this.queryParams
+        }, `schedulePlan_${new Date().getTime()}.xlsx`)
+      },
+      /** 获取订单列表 */
+      getOrderList() {
+        listOrder({ pageNum: 1, pageSize: 1000 }).then(res => {
+          this.orderList = res.rows || [];
+        });
+      },
+      /** 详情按钮操作 */
+      handleDetail(row) {
+        this.$router.push({
+          path: '/production/schedulePlan/detail',
+          query: { planId: row.planId }
+        });
+      },
+      statusText(val) {
+        switch (val) {
+          case 0:
+          case '0':
+            return '新建';
+          case 1:
+          case '1':
+            return '已排产';
+          case 2:
+          case '2':
+            return '生产中';
+          case 3:
+          case '3':
+            return '已完成';
+          default:
+            return val;
+        }
+      },
+      statusTagType(val) {
+        switch (val) {
+          case 0:
+          case '0':
+            return 'info'; // 新建-灰色
+          case 1:
+          case '1':
+            return 'warning'; // 已排产-橙色
+          case 2:
+          case '2':
+            return 'primary'; // 生产中-蓝色
+          case 3:
+          case '3':
+            return 'success'; // 已完成-绿色
+          default:
+            return '';
+        }
+      }
+    }
+  };
+  </script>

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>

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>

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>