DeXun/klp-oa
9
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge remote-tracking branch 'origin/0.8.X' into 0.8.X

Browse Source
This commit is contained in:
Joshi
2025-07-19 10:49:54 +08:00
parent 0ad3f3f3c8 df2d9a3025
commit d28578d106
25 changed files with 1702 additions and 203 deletions
Download Patch File Download Diff File Expand all files Collapse all files

0
klp-ui/src/views/wms/index.vue → .vscode/settings.json vendored
View File

12
klp-ui/babel.config.js
View File

@@ -1,13 +1,13 @@
module.exports = {
presets: [
// https://github.com/vuejs/vue-cli/tree/master/packages/@vue/babel-preset-app
'@vue/cli-plugin-babel/preset'
],
'env': {
'development': {
// babel-plugin-dynamic-import-node plugin only does one thing by converting all import() to require().
// This plugin can significantly increase the speed of hot updates, when you have a large number of pages.
'plugins': ['dynamic-import-node']
plugins: [
'@babel/plugin-proposal-optional-chaining'
],
env: {
development: {
plugins: ['dynamic-import-node']
}
}
}

13
klp-ui/package.json
View File

@@ -38,6 +38,7 @@
"@babel/parser": "7.7.4",
"@riophae/vue-treeselect": "0.4.0",
"axios": "0.24.0",
"bpmn-js-token-simulation": "0.10.0",
"clipboard": "2.0.8",
"core-js": "3.25.3",
"echarts": "5.4.0",
@@ -59,15 +60,18 @@
"vue-router": "3.4.9",
"vuedraggable": "2.24.3",
"vuex": "3.6.0",
"xml-js": "1.6.11",
"bpmn-js-token-simulation": "0.10.0"
"xml-js": "1.6.11"
},
"devDependencies": {
"@babel/plugin-proposal-optional-chaining": "^7.21.0",
"@vue/cli-plugin-babel": "4.4.6",
"@vue/cli-plugin-eslint": "4.4.6",
"@vue/cli-service": "4.4.6",
"babel-eslint": "10.1.0",
"babel-plugin-dynamic-import-node": "2.3.3",
"bpmn-js": "7.5.0",
"bpmn-js-properties-panel": "0.37.2",
"camunda-bpmn-moddle": "4.4.1",
"chalk": "4.1.0",
"compression-webpack-plugin": "5.0.2",
"connect": "3.6.6",
@@ -79,10 +83,7 @@
"sass-loader": "10.1.1",
"script-ext-html-webpack-plugin": "2.1.5",
"svg-sprite-loader": "5.1.1",
"vue-template-compiler": "2.6.12",
"bpmn-js": "7.5.0",
"bpmn-js-properties-panel": "0.37.2",
"camunda-bpmn-moddle": "4.4.1"
"vue-template-compiler": "2.6.12"
},
"engines": {
"node": ">=8.9",

9
klp-ui/src/api/wms/productionLine.js
View File

@@ -42,3 +42,12 @@ export function delProductionLine(lineId) {
method: 'delete'
})
}
// 新增：产线甘特图接口
export function ganttProductionLine(params) {
return request({
url: '/wms/productionLine/gantt',
method: 'get',
params
});
}

17
klp-ui/src/api/wms/purchasePlan.js
View File

@@ -42,3 +42,20 @@ export function delPurchasePlan(planId) {
method: 'delete'
})
}
// 获取推荐的采购计划
export function recommendPurchasePlan(orderId) {
return request({
url: '/wms/purchasePlan/recommend/' + orderId,
method: 'get'
})
}
// 创建采购计划（含明细）
export function createPurchasePlan(data) {
return request({
url: '/wms/purchasePlan/addWithDetails',
method: 'post',
data
})
}

44
klp-ui/src/api/wms/schedulePlan.js Normal file
View File

@@ -0,0 +1,44 @@
import request from '@/utils/request'
// 查询排产计划列表
export function listSchedulePlan(query) {
return request({
url: '/wms/schedulePlan/list',
method: 'get',
params: query
})
}
// 查询排产计划详细
export function getSchedulePlan(planId) {
return request({
url: '/wms/schedulePlan/' + planId,
method: 'get'
})
}
// 新增排产计划
export function addSchedulePlan(data) {
return request({
url: '/wms/schedulePlan',
method: 'post',
data: data
})
}
// 修改排产计划
export function updateSchedulePlan(data) {
return request({
url: '/wms/schedulePlan',
method: 'put',
data: data
})
}
// 删除排产计划
export function delSchedulePlan(planId) {
return request({
url: '/wms/schedulePlan/' + planId,
method: 'delete'
})
}

44
klp-ui/src/api/wms/schedulePlanDetail.js Normal file
View File

@@ -0,0 +1,44 @@
import request from '@/utils/request'
// 查询排产计划明细列表
export function listSchedulePlanDetail(query) {
return request({
url: '/wms/schedulePlanDetail/list',
method: 'get',
params: query
})
}
// 查询排产计划明细详细
export function getSchedulePlanDetail(detailId) {
return request({
url: '/wms/schedulePlanDetail/' + detailId,
method: 'get'
})
}
// 新增排产计划明细
export function addSchedulePlanDetail(data) {
return request({
url: '/wms/schedulePlanDetail',
method: 'post',
data: data
})
}
// 修改排产计划明细
export function updateSchedulePlanDetail(data) {
return request({
url: '/wms/schedulePlanDetail',
method: 'put',
data: data
})
}
// 删除排产计划明细
export function delSchedulePlanDetail(detailId) {
return request({
url: '/wms/schedulePlanDetail/' + detailId,
method: 'delete'
})
}

2
klp-ui/src/views/wms/order/index.vue
View File

@@ -171,7 +171,7 @@ import ClacPanel from '../purchasePlan/panels/clac.vue';
export default {
name: "Order",
components: { OrderDetailPanel, ClacPanel },
dict: ['order_status'],
dicts: ['order_status'],
data() {
return {
// 按钮loading

181
klp-ui/src/views/wms/productionLine/GanttChartEcharts.vue Normal file
View File

@@ -0,0 +1,181 @@
<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;
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
};
});
// 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 => {
const d = Array.isArray(params.data) ? params.data[3] : params.data;
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;
const d = Array.isArray(params.data) ? params.data[3] : params.data;
// 调试：输出d
// console.log('renderItem d:', d);
let fillColor = api.style().fill;
if (d && d.itemStyle && d.itemStyle.color) {
fillColor = d.itemStyle.color;
} else if (d && d.name && d.name.indexOf('预览') !== -1) {
// 兜底：只要是预览条，强制绿色或红色
fillColor = '#67C23A';
}
return {
type: 'rect',
shape: {
x: start[0],
y: start[1] - barHeight / 2,
width: end[0] - start[0],
height: barHeight,
r: 6
},
style: {
...api.style(),
fill: fillColor
}
};
},
encode: {
x: [0, 1],
y: 2
},
data: taskData.map((d, i) => [d.value[0], d.value[1], i, d]),
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>

352
klp-ui/src/views/wms/productionLine/index.vue
View File

@@ -1,158 +1,182 @@
<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="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>
<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-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-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-table v-loading="loading" :data="productionLineList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="产线ID" align="center" prop="lineId" v-if="true"/>
<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" />
<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>
<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>
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<el-table v-loading="loading" :data="productionLineList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="产线ID" align="center" prop="lineId" v-if="true"/>
<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" />
<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>
<!-- 添加或修改产线对话框 -->
<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>
<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 { listProductionLine, getProductionLine, delProductionLine, addProductionLine, updateProductionLine } from "@/api/wms/productionLine";
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
@@ -204,11 +228,22 @@ export default {
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: {
/** 查询产线列表 */
@@ -341,7 +376,36 @@ export default {
.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>

204
klp-ui/src/views/wms/purchasePlan/index.vue
View File

@@ -70,6 +70,15 @@
@click="handleExport"
>导出</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="info"
plain
icon="el-icon-magic-stick"
size="mini"
@click="handleRecommend"
>推荐采购计划</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
@@ -83,6 +92,12 @@
<el-table-column label="备注" align="center" prop="remark" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-view"
@click="handleDetail(scope.row)"
>详情</el-button>
<el-button
size="mini"
type="text"
@@ -128,14 +143,124 @@
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
<!-- 订单选择弹窗 -->
<el-dialog title="选择订单" :visible.sync="orderSelectOpen" width="800px" append-to-body>
<el-form :model="orderQueryParams" ref="orderQueryForm" size="small" :inline="true" label-width="80px">
<el-form-item label="订单编号" prop="orderCode">
<el-input
v-model="orderQueryParams.orderCode"
placeholder="请输入订单编号"
clearable
@keyup.enter.native="handleOrderQuery"
/>
</el-form-item>
<el-form-item label="客户名称" prop="customerName">
<el-input
v-model="orderQueryParams.customerName"
placeholder="请输入客户名称"
clearable
@keyup.enter.native="handleOrderQuery"
/>
</el-form-item>
<el-form-item label="销售经理" prop="salesManager">
<el-input
v-model="orderQueryParams.salesManager"
placeholder="请输入销售经理"
clearable
@keyup.enter.native="handleOrderQuery"
/>
</el-form-item>
<el-form-item label="订单状态" prop="orderStatus">
<el-select v-model="orderQueryParams.orderStatus" placeholder="请选择订单状态" clearable>
<el-option
v-for="dict in dict.type.order_status"
:key="dict.value"
:label="dict.label"
:value="dict.value"
/>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleOrderQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetOrderQuery">重置</el-button>
</el-form-item>
</el-form>
<el-table v-loading="orderLoading" :data="orderList" @row-click="handleOrderSelect" style="cursor: pointer;">
<el-table-column label="订单编号" align="center" prop="orderCode" />
<el-table-column label="客户名称" align="center" prop="customerName" />
<el-table-column label="销售经理" align="center" prop="salesManager" />
<el-table-column label="订单状态" align="center" prop="orderStatus">
<template slot-scope="scope">
<dict-tag :options="dict.type.order_status" :value="scope.row.orderStatus"/>
</template>
</el-table-column>
<el-table-column label="备注" align="center" prop="remark" />
<el-table-column label="创建时间" align="center" prop="createTime" width="180" />
</el-table>
<pagination
v-show="orderTotal>0"
:total="orderTotal"
:page.sync="orderQueryParams.pageNum"
:limit.sync="orderQueryParams.pageSize"
@pagination="getOrderList"
/>
<div slot="footer" class="dialog-footer">
<el-button @click="orderSelectOpen = false">取 消</el-button>
</div>
</el-dialog>
<!-- 推荐采购计划弹窗 -->
<el-dialog title="推荐采购计划" :visible.sync="recommendOpen" width="1200px" append-to-body>
<div v-if="selectedOrderId">
<p style="margin-bottom: 20px; color: #666;">
当前选择订单ID: <strong>{{ selectedOrderId }}</strong>
<el-button type="text" @click="handleReSelectOrder" style="margin-left: 10px;">重新选择订单</el-button>
</p>
<PurchasePlanClac
:orderId="selectedOrderId"
@confirm="handleRecommendConfirm"
/>
</div>
<div slot="footer" class="dialog-footer">
<el-button @click="recommendOpen = false">取 消</el-button>
</div>
</el-dialog>
<!-- 采购计划详情弹窗 -->
<el-dialog title="采购计划详情" :visible.sync="detailOpen" width="1400px" append-to-body>
<div v-if="selectedPlanId">
<p style="margin-bottom: 20px; color: #666;">
当前采购计划ID: <strong>{{ selectedPlanId }}</strong>
</p>
<PurchasePlanDetail
ref="purchasePlanDetail"
:planId="selectedPlanId"
/>
</div>
<div slot="footer" class="dialog-footer">
<el-button @click="detailOpen = false">关 闭</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import { listPurchasePlan, getPurchasePlan, delPurchasePlan, addPurchasePlan, updatePurchasePlan } from "@/api/wms/purchasePlan";
import { listOrder } from "@/api/wms/order";
import PurchasePlanClac from "./panels/clac.vue";
import PurchasePlanDetail from "./panels/detail.vue";
export default {
name: "PurchasePlan",
components: {
PurchasePlanClac,
PurchasePlanDetail
},
dicts: ['order_status'],
data() {
return {
// 按钮loading
@@ -158,6 +283,22 @@ export default {
title: "",
// 是否显示弹出层
open: false,
// 订单选择弹窗
orderSelectOpen: false,
// 推荐采购计划弹窗
recommendOpen: false,
// 采购计划详情弹窗
detailOpen: false,
// 选中的订单ID
selectedOrderId: null,
// 选中的采购计划ID
selectedPlanId: null,
// 订单列表
orderList: [],
// 订单总数
orderTotal: 0,
// 订单加载状态
orderLoading: false,
// 查询参数
queryParams: {
pageNum: 1,
@@ -167,6 +308,15 @@ export default {
orderId: undefined,
status: undefined,
},
// 订单查询参数
orderQueryParams: {
pageNum: 1,
pageSize: 10,
orderCode: undefined,
customerName: undefined,
salesManager: undefined,
orderStatus: undefined,
},
// 表单参数
form: {},
// 表单校验
@@ -300,6 +450,60 @@ export default {
this.download('klp/purchasePlan/export', {
...this.queryParams
}, `purchasePlan_${new Date().getTime()}.xlsx`)
},
/** 推荐采购计划按钮操作 */
handleRecommend() {
this.orderSelectOpen = true;
this.getOrderList();
},
/** 获取订单列表 */
getOrderList() {
this.orderLoading = true;
listOrder(this.orderQueryParams).then(response => {
this.orderList = response.rows;
this.orderTotal = response.total;
this.orderLoading = false;
});
},
/** 订单查询 */
handleOrderQuery() {
this.orderQueryParams.pageNum = 1;
this.getOrderList();
},
/** 重置订单查询 */
resetOrderQuery() {
this.orderQueryParams = {
pageNum: 1,
pageSize: 10,
orderCode: undefined,
customerName: undefined,
salesManager: undefined,
orderStatus: undefined,
};
this.handleOrderQuery();
},
/** 选择订单 */
handleOrderSelect(row) {
this.selectedOrderId = row.orderId;
this.orderSelectOpen = false;
this.recommendOpen = true;
},
/** 重新选择订单 */
handleReSelectOrder() {
this.recommendOpen = false;
this.orderSelectOpen = true;
},
/** 推荐采购计划确认 */
handleRecommendConfirm(data) {
console.log('推荐采购计划数据:', data);
this.$modal.msgSuccess("推荐采购计划已生成");
this.recommendOpen = false;
this.getList(); // 刷新列表
},
/** 详情按钮操作 */
handleDetail(row) {
this.selectedPlanId = row.planId;
this.detailOpen = true;
}
}
};

205
klp-ui/src/views/wms/purchasePlan/panels/clac.vue
View File

@@ -1,14 +1,38 @@
<template>
<div>
<el-form :inline="true" @submit.native.prevent>
<el-form-item>
<el-button type="success" @click="addRow">新增</el-button>
<!-- 全局loading遮罩 -->
<div v-if="globalLoading" class="global-loading-overlay">
<el-loading-spinner></el-loading-spinner>
<p>正在加载推荐数据...</p>
</div>
<!-- 采购计划主数据表单 -->
<el-form :model="mainForm" :rules="mainFormRules" ref="mainFormRef" :inline="true" label-width="120px" style="margin-bottom: 20px;" v-loading="formLoading" element-loading-text="正在加载主数据...">
<el-form-item label="计划编号" prop="planCode">
<el-input v-model="mainForm.planCode" placeholder="请输入计划编号" style="width: 200px;" />
</el-form-item>
<el-form-item label="负责人" prop="owner">
<el-input v-model="mainForm.owner" placeholder="请输入负责人" style="width: 200px;" />
</el-form-item>
<el-form-item label="备注" prop="remark">
<el-input v-model="mainForm.remark" placeholder="请输入备注" style="width: 300px;" />
</el-form-item>
</el-form>
<el-table :data="tableData" style="width: 100%; margin-top: 20px" border>
<el-table-column prop="raw_material_id" label="原材料ID" width="120">
<el-form :inline="true" @submit.native.prevent>
</el-form>
<el-table
:data="tableData"
style="width: 100%; margin-top: 20px"
border
:loading="tableLoading"
element-loading-text="正在加载明细数据..."
element-loading-spinner="el-icon-loading"
:empty-text="tableLoading ? '正在加载数据...' : '暂无数据'"
>
<el-table-column prop="rawMaterialId" label="原材料ID" width="120">
<template #default="scope">
<el-input v-model="scope.row.raw_material_id" size="small" />
<RawMaterialSelect v-model="scope.row.rawMaterialId" size="small" :loading="selectLoading" />
</template>
</el-table-column>
<el-table-column prop="owner" label="负责人" width="120">
@@ -37,15 +61,21 @@
</template>
</el-table-column>
</el-table>
<div style="margin-top: 20px; text-align: right;">
<el-button type="primary" @click="confirm">确认</el-button>
<div style="margin-top: 20px; text-align: right;" v-loading="submitLoading" element-loading-text="正在提交数据...">
<el-button type="primary" @click="confirm" :loading="submitLoading" :disabled="globalLoading || tableLoading || formLoading">
{{ submitLoading ? '提交中...' : '确认' }}
</el-button>
</div>
</div>
</template>
<script>
import { recommendPurchasePlan, createPurchasePlan } from '@/api/wms/purchasePlan'
import RawMaterialSelect from '@/components/KLPService/RawMaterialSelect'
export default {
name: 'PurchasePlanClac',
components: { RawMaterialSelect },
props: {
orderId: {
type: [String, Number],
@@ -54,7 +84,26 @@ export default {
},
data() {
return {
tableData: []
tableData: [],
// 细化的loading状态
globalLoading: false, // 全局loading
formLoading: false, // 表单loading
tableLoading: false, // 表格loading
selectLoading: false, // 选择器loading
submitLoading: false, // 提交loading
mainForm: {
planCode: '',
owner: '',
remark: ''
},
mainFormRules: {
planCode: [
{ required: true, message: '请输入计划编号', trigger: 'blur' }
],
owner: [
{ required: true, message: '请输入负责人', trigger: 'blur' }
]
}
}
},
watch: {
@@ -63,49 +112,97 @@ export default {
handler(newVal) {
this.loadData(newVal)
}
},
tableData: {
handler() {
this.ensureEmptyRow();
},
deep: true
}
},
methods: {
loadData(orderId) {
// 模拟接口返回数据，根据orderId加载不同数据
// 实际开发中可根据orderId请求后端接口
// 设置全局loading
this.globalLoading = true;
this.formLoading = true;
this.tableLoading = true;
this.selectLoading = true;
if (!orderId) {
this.tableData = []
this.clearAllLoading();
this.ensureEmptyRow();
return
}
this.tableData = [
{
raw_material_id: 1,
owner: '张三',
quantity: 100,
unit: 'kg',
remark: '紧急采购'
},
{
raw_material_id: 2,
owner: '李四',
quantity: 50,
unit: '件',
remark: ''
}
]
},
addRow() {
this.tableData.push({
raw_material_id: '',
owner: '',
quantity: 0,
unit: '',
remark: ''
recommendPurchasePlan(orderId).then(res => {
console.log(res, '推荐数据')
this.tableData = res.data.detailList;
this.mainForm = res.data;
this.ensureEmptyRow();
}).finally(() => {
this.clearAllLoading();
})
},
clearAllLoading() {
this.globalLoading = false;
this.formLoading = false;
this.tableLoading = false;
this.selectLoading = false;
},
removeRow(index) {
this.tableData.splice(index, 1)
this.ensureEmptyRow();
},
confirm() {
this.$message.success('操作已确认');
console.log(this.tableData);
this.$emit('confirm', this.tableData);
this.submitLoading = true;
// 校验主数据表单
this.$refs.mainFormRef.validate((valid) => {
if (!valid) {
this.$message.error('请完整填写主数据信息');
this.submitLoading = false;
return;
}
// 校验表格数据（除remark外都不能为空）
const filtered = this.tableData.filter(row => row.rawMaterialId && row.rawMaterialId !== '');
const invalid = filtered.some(row => {
return !row.rawMaterialId || !row.owner || !row.unit || row.quantity === '' || row.quantity === null || row.quantity === undefined;
});
if (invalid) {
this.$message.error('请完整填写所有必填项');
this.submitLoading = false;
return;
}
// 合并主数据和明细数据
const submitData = {
...this.mainForm,
orderId: this.orderId,
detailList: filtered
};
createPurchasePlan(submitData);
this.$message.success('操作已确认');
console.log(submitData);
this.$emit('confirm', submitData);
this.submitLoading = false;
});
},
ensureEmptyRow() {
// 如果tableData为空，或最后一行已填写原材料，则补充一个空行
if (
this.tableData.length === 0 ||
(this.tableData[this.tableData.length - 1] && this.tableData[this.tableData.length - 1].rawMaterialId)
) {
this.tableData.push({
rawMaterialId: '',
owner: '',
quantity: 0,
unit: '',
remark: ''
});
}
}
}
}
@@ -115,4 +212,36 @@ export default {
.el-form {
margin-bottom: 20px;
}
.global-loading-overlay {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(255, 255, 255, 0.9);
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
z-index: 2000;
border-radius: 4px;
}
.global-loading-overlay p {
margin-top: 10px;
color: #409EFF;
font-size: 14px;
}
/* 表格loading样式优化 */
.el-table .el-loading-mask {
background-color: rgba(255, 255, 255, 0.8);
}
.el-table .el-loading-spinner .el-loading-text {
color: #409EFF;
font-size: 14px;
margin-top: 10px;
}
</style>

20
klp-ui/src/views/wms/purchasePlan/panels/detail.vue
View File

@@ -112,6 +112,12 @@ import { listPurchasePlanDetail, getPurchasePlanDetail, delPurchasePlanDetail, a
export default {
name: "PurchasePlanDetail",
props: {
planId: {
type: [String, Number],
default: null
}
},
data() {
return {
// 按钮loading
@@ -169,6 +175,17 @@ export default {
created() {
this.getList();
},
watch: {
planId: {
handler(newVal) {
if (newVal) {
this.queryParams.planId = newVal;
this.getList();
}
},
immediate: true
}
},
methods: {
/** 查询采购计划明细列表 */
getList() {
@@ -221,6 +238,9 @@ export default {
/** 新增按钮操作 */
handleAdd() {
this.reset();
if (this.planId) {
this.form.planId = this.planId;
}
this.open = true;
this.title = "添加采购计划明细";
},

268
klp-ui/src/views/wms/schedulePlan/detail.vue Normal file
View File

@@ -0,0 +1,268 @@
<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-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="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'}">
<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 { listProduct } from '@/api/wms/product';
import { listProductionLine } from '@/api/wms/productionLine';
import GanttChartEcharts from '../productionLine/GanttChartEcharts.vue';
import { ganttProductionLine } from '@/api/wms/productionLine';
export default {
name: 'SchedulePlanDetail',
components: { GanttChartEcharts },
data() {
return {
planId: null,
planInfo: {},
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 || {};
});
},
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>

357
klp-ui/src/views/wms/schedulePlan/index.vue Normal file
View File

@@ -0,0 +1,357 @@
<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="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"
v-hasPermi="['klp:schedulePlan:add']"
>新增</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="success"
plain
icon="el-icon-edit"
size="mini"
:disabled="single"
@click="handleUpdate"
v-hasPermi="['klp:schedulePlan:edit']"
>修改</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="danger"
plain
icon="el-icon-delete"
size="mini"
:disabled="multiple"
@click="handleDelete"
v-hasPermi="['klp:schedulePlan:remove']"
>删除</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="warning"
plain
icon="el-icon-download"
size="mini"
@click="handleExport"
v-hasPermi="['klp:schedulePlan:export']"
>导出</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="status">
<template slot-scope="scope">
<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" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-edit"
@click="handleUpdate(scope.row)"
v-hasPermi="['klp:schedulePlan:edit']"
>修改</el-button>
<el-button
size="mini"
type="text"
icon="el-icon-delete"
@click="handleDelete(scope.row)"
v-hasPermi="['klp:schedulePlan:remove']"
>删除</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="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",
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
};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
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('klp/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>

3
klp-ui/vue.config.js
View File

@@ -27,6 +27,9 @@ module.exports = {
lintOnSave: process.env.NODE_ENV === 'development',
// 如果你不需要生产环境的 source map，可以将其设置为 false 以加速生产环境构建。
productionSourceMap: false,
transpileDependencies: [
'frappe-gantt'
],
// webpack-dev-server 相关配置
devServer: {
host: '0.0.0.0',

91
klp-wms/src/main/java/com/klp/controller/WmsProductionLineController.java
View File

@@ -1,8 +1,11 @@
package com.klp.controller;
import java.util.List;
import java.util.Arrays;
import java.lang.reflect.Method;
import java.math.BigDecimal;
import java.util.*;
import com.klp.domain.bo.WmsSchedulePlanDetailBo;
import com.klp.domain.vo.*;
import lombok.RequiredArgsConstructor;
import javax.servlet.http.HttpServletResponse;
import javax.validation.constraints.*;
@@ -18,10 +21,14 @@ import com.klp.common.core.validate.AddGroup;
import com.klp.common.core.validate.EditGroup;
import com.klp.common.enums.BusinessType;
import com.klp.common.utils.poi.ExcelUtil;
import com.klp.domain.vo.WmsProductionLineVo;
import com.klp.domain.bo.WmsProductionLineBo;
import com.klp.service.IWmsProductionLineService;
import com.klp.common.core.page.TableDataInfo;
import com.klp.service.IWmsSchedulePlanDetailService;
import com.klp.service.IWmsOrderService;
import com.klp.service.IWmsOrderDetailService;
import com.klp.service.IWmsProductService;
import com.klp.service.IWmsSchedulePlanService;
/**
* 产线
@@ -36,6 +43,11 @@ import com.klp.common.core.page.TableDataInfo;
public class WmsProductionLineController extends BaseController {
private final IWmsProductionLineService iWmsProductionLineService;
private final IWmsSchedulePlanDetailService iWmsSchedulePlanDetailService;
private final IWmsOrderService iWmsOrderService;
private final IWmsOrderDetailService iWmsOrderDetailService;
private final IWmsProductService iWmsProductService;
private final IWmsSchedulePlanService iWmsSchedulePlanService;
/**
* 查询产线列表
@@ -97,4 +109,77 @@ public class WmsProductionLineController extends BaseController {
@PathVariable Long[] lineIds) {
return toAjax(iWmsProductionLineService.deleteWithValidByIds(Arrays.asList(lineIds), true));
}
/**
* 产线甘特图接口
* @param lineId 产线ID
* @return 甘特图数据
*/
@GetMapping("/gantt")
public R<?> gantt(@RequestParam Long lineId) {
// 查询排产计划明细（按产线过滤，返回所有订单的任务）
WmsSchedulePlanDetailBo detailBo = new WmsSchedulePlanDetailBo();
detailBo.setLineId(lineId);
List<WmsSchedulePlanDetailVo> allDetails = iWmsSchedulePlanDetailService.queryList(detailBo);
// 查询产品、订单信息，补充remark
Set<Long> orderIdSet = new HashSet<>();
for (WmsSchedulePlanDetailVo detail : allDetails) {
// 查询产品名和订单编号
String productName = null;
if (detail.getProductId() != null) {
WmsProductVo product = iWmsProductService.queryById(detail.getProductId());
if (product != null) {
productName = product.getProductName();
}
}
String orderCode = null;
Long orderId = null;
if (detail.getPlanId() != null) {
WmsSchedulePlanVo planVo = iWmsSchedulePlanService.queryById(detail.getPlanId());
if (planVo != null && planVo.getOrderId() != null) {
orderId = planVo.getOrderId();
WmsOrderVo orderVo = iWmsOrderService.queryById(orderId);
if (orderVo != null) {
orderCode = orderVo.getOrderCode();
}
}
}
// 设置remark为“订单编号-产品名”
String remark = (orderCode != null ? orderCode : "") + (productName != null ? ("-" + productName) : "");
detail.setRemark(remark);
// 查询产线日产能
BigDecimal capacity = null;
if (detail.getLineId() != null) {
WmsProductionLineVo lineVo = iWmsProductionLineService.queryById(detail.getLineId());
if (lineVo != null) {
capacity = lineVo.getCapacity();
}
}
// 计算天数和总产能
BigDecimal totalCapacity = null;
int days = 0;
if (detail.getStartDate() != null && detail.getEndDate() != null) {
long diff = detail.getEndDate().getTime() - detail.getStartDate().getTime();
days = (int) (diff / (1000 * 3600 * 24)) + 1;
if (capacity != null) {
totalCapacity = capacity.multiply(new BigDecimal(days));
}
}
// 计划生产数量
BigDecimal planQuantity = detail.getQuantity();
// 直接set字段，无需反射
detail.setCapacity(capacity);
detail.setTotalCapacity(totalCapacity);
detail.setDays(days);
detail.setPlanQuantity(planQuantity);
}
// 查询所有相关订单信息
List<WmsOrderVo> orderList = new ArrayList<>();
// 返回结构
return R.ok(new HashMap<String, Object>() {{
put("tasks", allDetails);
put("orders", orderList);
}});
}
}

7
klp-wms/src/main/java/com/klp/controller/WmsPurchasePlanController.java
View File

@@ -36,6 +36,13 @@ public class WmsPurchasePlanController extends BaseController {
private final IWmsPurchasePlanService iWmsPurchasePlanService;
/**
* 新增采购计划（含明细）
*/
@PostMapping("/addWithDetails")
public R<Void> addPurchasePlan(@RequestBody WmsPurchasePlanVo planVo) {
return toAjax(iWmsPurchasePlanService.insertWithDetails(planVo));
}
/**
* 根据订单ID生成推荐采购计划（只返回，不落库）
*/

5
klp-wms/src/main/java/com/klp/domain/bo/WmsSchedulePlanBo.java
View File

@@ -32,6 +32,11 @@ public class WmsSchedulePlanBo extends BaseEntity {
*/
private Long orderId;
/**
* 版本
*/
private String version;
/**
* 状态（0=新建，1=已排产，2=生产中，3=已完成）
*/

2
klp-wms/src/main/java/com/klp/domain/bo/WmsSchedulePlanDetailBo.java
View File

@@ -48,11 +48,13 @@ public class WmsSchedulePlanDetailBo extends BaseEntity {
/**
* 计划开始日期
*/
@JsonFormat(pattern = "yyyy-MM-dd'T'HH:mm:ss.SSSX", timezone = "GMT+8")
private Date startDate;
/**
* 计划结束日期
*/
@JsonFormat(pattern = "yyyy-MM-dd'T'HH:mm:ss.SSSX", timezone = "GMT+8")
private Date endDate;
/**

19
klp-wms/src/main/java/com/klp/domain/vo/WmsSchedulePlanDetailVo.java
View File

@@ -70,5 +70,24 @@ public class WmsSchedulePlanDetailVo {
@ExcelProperty(value = "备注")
private String remark;
/**
* 产线日产能
*/
private BigDecimal capacity;
/**
* 总产能
*/
private BigDecimal totalCapacity;
/**
* 目标生产数量
*/
private BigDecimal planQuantity;
/**
* 天数
*/
private Integer days;
}

6
klp-wms/src/main/java/com/klp/service/IWmsPurchasePlanService.java
View File

@@ -17,6 +17,11 @@ import java.util.List;
*/
public interface IWmsPurchasePlanService {
/**
* 新增采购计划（含明细）
*/
Boolean insertWithDetails(WmsPurchasePlanVo planVo);
/**
* 根据订单ID生成推荐采购计划（只返回，不落库）
*/
@@ -51,4 +56,5 @@ public interface IWmsPurchasePlanService {
* 校验并批量删除采购计划主信息
*/
Boolean deleteWithValidByIds(Collection<Long> ids, Boolean isValid);
}

1
klp-wms/src/main/java/com/klp/service/impl/WmsPurchasePlanDetailServiceImpl.java
View File

@@ -74,6 +74,7 @@ public class WmsPurchasePlanDetailServiceImpl implements IWmsPurchasePlanDetailS
*/
@Override
public Boolean insertByBo(WmsPurchasePlanDetailBo bo) {
WmsPurchasePlanDetail add = BeanUtil.toBean(bo, WmsPurchasePlanDetail.class);
validEntityBeforeSave(add);
boolean flag = baseMapper.insert(add) > 0;

33
klp-wms/src/main/java/com/klp/service/impl/WmsPurchasePlanServiceImpl.java
View File

@@ -7,21 +7,22 @@ import com.baomidou.mybatisplus.extension.plugins.pagination.Page;
import com.baomidou.mybatisplus.core.conditions.query.LambdaQueryWrapper;
import com.baomidou.mybatisplus.core.toolkit.Wrappers;
import com.klp.common.utils.StringUtils;
import com.klp.domain.WmsOrderDetail;
import com.klp.domain.WmsProductBom;
import com.klp.domain.WmsPurchasePlanDetail;
import com.klp.domain.vo.WmsOrderDetailVo;
import com.klp.domain.vo.WmsPurchasePlanDetailVo;
import com.klp.service.IWmsOrderDetailService;
import com.klp.service.IWmsProductBomService;
import com.klp.service.IWmsStockService;
import com.klp.mapper.WmsPurchasePlanDetailMapper;
import com.klp.service.*;
import lombok.RequiredArgsConstructor;
import org.springframework.beans.BeanUtils;
import org.springframework.stereotype.Service;
import com.klp.domain.bo.WmsPurchasePlanBo;
import com.klp.domain.vo.WmsPurchasePlanVo;
import com.klp.domain.WmsPurchasePlan;
import com.klp.mapper.WmsPurchasePlanMapper;
import com.klp.service.IWmsPurchasePlanService;
import org.springframework.transaction.annotation.Transactional;
import javax.annotation.Resource;
import java.math.BigDecimal;
import java.util.*;
@@ -43,6 +44,28 @@ public class WmsPurchasePlanServiceImpl implements IWmsPurchasePlanService {
private final IWmsStockService wmsStockService;
@Resource
private WmsPurchasePlanDetailMapper wmsPurchasePlanDetailMapper;
@Transactional
@Override
public Boolean insertWithDetails(WmsPurchasePlanVo planVo) {
// 1. 保存主表
WmsPurchasePlan plan = new WmsPurchasePlan();
BeanUtils.copyProperties(planVo, plan);
int flag = 0;
flag += baseMapper.insert(plan);
// 2. 保存明细表
for (WmsPurchasePlanDetailVo detailVo : planVo.getDetailList()) {
WmsPurchasePlanDetail detail = new WmsPurchasePlanDetail();
BeanUtils.copyProperties(detailVo, detail);
detail.setPlanId(plan.getPlanId()); // 关联主表ID
flag += wmsPurchasePlanDetailMapper.insert(detail);
}
return flag > 0;
}
@Override
public WmsPurchasePlanVo recommendPurchasePlanByOrder(Long orderId) {
// 1. 查询订单明细

10
klp-wms/src/main/java/com/klp/service/impl/WmsSchedulePlanDetailServiceImpl.java
View File

@@ -74,6 +74,16 @@ public class WmsSchedulePlanDetailServiceImpl implements IWmsSchedulePlanDetailS
*/
@Override
public Boolean insertByBo(WmsSchedulePlanDetailBo bo) {
// 校验产线时间段是否已排产
List<WmsSchedulePlanDetail> existList = baseMapper.selectList(
Wrappers.lambdaQuery(WmsSchedulePlanDetail.class)
.eq(WmsSchedulePlanDetail::getLineId, bo.getLineId())
.le(WmsSchedulePlanDetail::getStartDate, bo.getEndDate())
.ge(WmsSchedulePlanDetail::getEndDate, bo.getStartDate())
);
if (existList != null && !existList.isEmpty()) {
throw new RuntimeException("该产线该时间段已排产，请选择其他时间或产线！");
}
WmsSchedulePlanDetail add = BeanUtil.toBean(bo, WmsSchedulePlanDetail.class);
validEntityBeforeSave(add);
boolean flag = baseMapper.insert(add) > 0;