zyr/FT546MWS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

KPI

Browse Source
This commit is contained in:
猫猫guowen
2025-12-29 16:35:26 +08:00
parent bec185c139
commit dc8f2d329a
8 changed files with 379 additions and 284 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
ruoyi-admin/src/main/java/com/ruoyi/kpi/controller/KpiController.java
View File

@@ -120,15 +120,13 @@ public class KpiController extends BaseController {
* 获取库存平面图
*
* @param warehouseId 仓库ID
* @param roadwayId 巷道ID
* @param thePlatoon 排
* @param theFloor 层
* @return 库存平面图数据
*/
@GetMapping("/getChartData")
public AjaxResult getChartData(@RequestParam("warehouseId") String warehouseId,
@RequestParam("roadwayId") String roadwayId,
@RequestParam("thePlatoon") String thePlatoon){
return success(kpiService.getChartData(warehouseId,roadwayId,thePlatoon));
@RequestParam("theFloor") String theFloor){
return success(kpiService.getChartData(warehouseId,theFloor));
}
/**
@@ -147,5 +145,15 @@ public class KpiController extends BaseController {
@RequestParam("thePlatoon") String thePlatoon){
return success(kpiService.getChartMag(warehouseId,theColumn,theFloor,thePlatoon));
}
/**
* 获取货位楼层数据
*
* @param warehouseId 仓库ID
* @return 货位楼层数据
*/
@GetMapping("/getFloors")
public AjaxResult getFloors(@RequestParam("warehouseId") String warehouseId){
return success(kpiService.getFloors(warehouseId));
}
}

4
ruoyi-admin/src/main/java/com/ruoyi/kpi/service/KpiService.java
View File

@@ -42,10 +42,12 @@ public interface KpiService {
Map<String, Object> getPlatoons(String warehouseId, String roadwayId);
Map<String,Object> getChartData(String warehouseId, String roadwayId, String thePlatoon);
Map<String,Object> getChartData(String warehouseId, String theFloor);
Map<String,Object> getChartMag(String warehouseId, String theColumn, String theFloor, String thePlatoon);
AjaxResult getInAnalysisByData(String warehouseId, String startTime, String endTime,String inOut);
Map<String, Object> getFloors(String warehouseId);
}

133
ruoyi-admin/src/main/java/com/ruoyi/kpi/service/impl/KpiServiceImpl.java
View File

@@ -317,6 +317,35 @@ public class KpiServiceImpl implements KpiService
}
@Override
public Map<String, Object> getFloors(String warehouseId) {
Map<String, Object> response = new HashMap<>();
// 查询指定仓库和巷道的排号信息
BasCargoSpace queryParams = new BasCargoSpace();
queryParams.setWarehouseId(warehouseId);
List<BasCargoSpace> list = basCargoSpaceMapper.selectBasCargoSpaceList(queryParams);
// 使用TreeSet去重并排序排号
Set<Long> platoonSet = new TreeSet<>();
for (BasCargoSpace space : list) {
if (space.getTheFloor() != null) {
platoonSet.add(space.getTheFloor());
}
}
// 转换为前端下拉框所需的格式
List<Map<String, String>> platoons = new ArrayList<>();
for (Long platoon : platoonSet) {
Map<String, String> platoonMap = new HashMap<>();
platoonMap.put("value", platoon.toString());
platoonMap.put("label", platoon + "层");
platoons.add(platoonMap);
}
response.put("data", platoons);
return response;
}
@Override
public Map<String, Object> getRoadways(String warehouseId){
@@ -380,14 +409,11 @@ public class KpiServiceImpl implements KpiService
}
@Override
public Map<String,Object> getChartData(String warehouseId, String roadwayId, String thePlatoon) {
public Map<String,Object> getChartData(String warehouseId, String theFloor) {
// 查询指定仓库、巷道和排号的货位信息
BasCargoSpace queryParams = new BasCargoSpace();
queryParams.setWarehouseId(warehouseId);
queryParams.setRoadwayId(roadwayId);
if (thePlatoon != null) {
queryParams.setThePlatoon(Long.parseLong(thePlatoon));
}
queryParams.setTheFloor(Long.valueOf(theFloor));
List<BasCargoSpace> list = basCargoSpaceMapper.selectBasCargoSpaceList(queryParams);
// 用于存储不同状态的货位坐标
@@ -406,11 +432,11 @@ public class KpiServiceImpl implements KpiService
for (BasCargoSpace space : list) {
// 收集列和层信息
columnSet.add(space.getTheColumn());
floorSet.add(space.getTheFloor());
floorSet.add(space.getThePlatoon());
// 根据状态分类处理
if (space.getStatus() != null) {
String coordinate = "[" + space.getTheColumn() + "," + space.getTheFloor() + "," + space.getStatus() + "],";
String coordinate = "[" + space.getTheColumn() + "," + space.getThePlatoon() + "," + space.getStatus() + "],";
switch (Integer.parseInt(space.getStatus())) {
case 1: empty += coordinate; break;
case 2: full += coordinate; break;
@@ -425,15 +451,15 @@ public class KpiServiceImpl implements KpiService
// 构建列和层的标签
StringBuilder columnLabels = new StringBuilder();
for (Long col : columnSet) {
columnLabels.append("'").append(col).append(MessageUtils.message("kpi.spacePlan.column")).append("',");
columnLabels.append("'").append(col).append("列").append("',");
}
String column = "[" + columnLabels.toString() + "]";
String column = "[" + columnLabels + "]";
StringBuilder floorLabels = new StringBuilder();
for (Long floor : floorSet) {
floorLabels.append("'").append(floor).append(MessageUtils.message("kpi.spacePlan.floor")).append("',");
floorLabels.append("'").append(floor).append("排").append("',");
}
String floor = "[" + floorLabels.toString() + "]";
String floor = "[" + floorLabels + "]";
// 返回结果
Map<String, Object> map = new HashMap<>();
@@ -498,43 +524,86 @@ public class KpiServiceImpl implements KpiService
mydoJobParam.setCreateLeftTime(startTime);
mydoJobParam.setCreateRightTime(endTime);
mydoJobParam.setInOut(inOut);
List<DateTime> datesBetween = DateUtil.rangeToList(DateUtil.parseDate(startTime), DateUtil.parseDate(endTime), DateField.DAY_OF_MONTH);
List<MydoJob> list = mydoJobFinishMapper.selectMydoJobFinishListByMydoJob(mydoJobParam);
// 获取所有巷道ID（1和2）
List<String> roadwayIds = Arrays.asList("1", "2");
// 收集所有涉及的楼层
Set<Long> floorSet = new HashSet<>();
Map<String, BasCargoSpace> cargoSpaceCache = new HashMap<>();
// 遍历作业记录，收集涉及的货位ID并查询对应楼层
for (MydoJob job : list) {
if (job.getCargoSpaceId() != null) {
// 检查缓存中是否有该货位信息
if (!cargoSpaceCache.containsKey(job.getCargoSpaceId())) {
// 使用现有的查询方法查询货位信息
BasCargoSpace queryParam = new BasCargoSpace();
queryParam.setCargoSpaceId(job.getCargoSpaceId());
List<BasCargoSpace> cargoSpaces = basCargoSpaceMapper.selectBasCargoSpaceList(queryParam);
if (!cargoSpaces.isEmpty()) {
BasCargoSpace cargoSpace = cargoSpaces.get(0);
cargoSpaceCache.put(job.getCargoSpaceId(), cargoSpace);
if (cargoSpace.getTheFloor() != null) {
floorSet.add(cargoSpace.getTheFloor());
}
}
} else {
BasCargoSpace cachedSpace = cargoSpaceCache.get(job.getCargoSpaceId());
if (cachedSpace.getTheFloor() != null) {
floorSet.add(cachedSpace.getTheFloor());
}
}
}
}
// 将楼层排序
List<Long> floors = new ArrayList<>(floorSet);
Collections.sort(floors);
// 生成日期范围
List<DateTime> datesBetween = DateUtil.rangeToList(DateUtil.parseDate(startTime), DateUtil.parseDate(endTime), DateField.DAY_OF_MONTH);
List<String> xAxis = new ArrayList<>();
List<Map<String, Object>> series = new ArrayList<>();
// 为每个巷道创建一个系列
for (String roadwayId : roadwayIds) {
// 为每个楼层创建一个系列
for (Long floor : floors) {
Map<String, Object> seriesItem = new HashMap<>();
seriesItem.put("name", roadwayId + "号巷道");
seriesItem.put("name", floor + "层");
seriesItem.put("type", "line");
List<Long> data = new ArrayList<>();
seriesItem.put("data", data);
series.add(seriesItem);
}
// 按日期统计每个巷道的数量
// 按日期统计每个楼层的数量
for (DateTime dateTime : datesBetween) {
xAxis.add(DateUtil.format(dateTime, "yyyy-MM-dd"));
// 统计每个巷道在当天的数量
for (int i = 0; i < roadwayIds.size(); i++) {
String roadwayId = roadwayIds.get(i);
long count = list.stream()
.filter(mydoJob -> roadwayId.equals(mydoJob.getRoadwayId())
&& DateUtil.isIn(mydoJob.getCreateTime(), DateUtil.beginOfDay(dateTime), DateUtil.endOfDay(dateTime)))
.count();
// 统计每个楼层在当天的数量
for (int i = 0; i < floors.size(); i++) {
Long floor = floors.get(i);
long count = 0;
// 遍历作业记录，统计该楼层在当天的作业数量
for (MydoJob job : list) {
if (DateUtil.isIn(job.getCreateTime(), DateUtil.beginOfDay(dateTime), DateUtil.endOfDay(dateTime))) {
// 查找该作业对应的货位是否属于当前楼层
if (job.getCargoSpaceId() != null && cargoSpaceCache.containsKey(job.getCargoSpaceId())) {
BasCargoSpace space = cargoSpaceCache.get(job.getCargoSpaceId());
if (space.getTheFloor() != null && space.getTheFloor().equals(floor)) {
count++;
}
}
}
}
@SuppressWarnings("unchecked")
List<Long> data = (List<Long>) series.get(i).get("data");
data.add(count);
}
}
res.put("xAxis", xAxis);
res.put("series", series);
return AjaxResult.success(res);

7
ruoyi-ui/src/api/kpi/spacePlan.js
View File

@@ -9,6 +9,13 @@ export function getRoadways(query) {
params: query
})
}
export function getFloors(query) {
return request({
url: '/kpi/getFloors',
method: 'get',
params: query
})
}
//获取排列表
export function getPlatoons(query) {
return request({

128
ruoyi-ui/src/views/kpi/inAnalysis/indexByTime.vue
View File

@@ -1,20 +1,21 @@
<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" :inline="true">
<!-- <el-form-item label="仓库" prop="warehouseId"> &lt;!&ndash; 仓库 &ndash;&gt;-->
<!-- <el-select v-model="queryParams.warehouseId" placeholder="请选择仓库" clearable> &lt;!&ndash; 请选择仓库 &ndash;&gt;-->
<!-- <el-option-->
<!-- v-for="item in warehouseOptions"-->
<!-- :key="item.warehouseId"-->
<!-- :label="item.warehouseName"-->
<!-- :value="item.warehouseId"-->
<!-- />-->
<!-- </el-select>-->
<!-- </el-form-item>-->
<!-- <el-form-item label="仓库" prop="warehouseId"> &lt;!&ndash; 仓库 &ndash;&gt;-->
<!-- <el-select v-model="queryParams.warehouseId" placeholder="请选择仓库" clearable> &lt;!&ndash; 请选择仓库 &ndash;&gt;-->
<!-- <el-option-->
<!-- v-for="item in warehouseOptions"-->
<!-- :key="item.warehouseId"-->
<!-- :label="item.warehouseName"-->
<!-- :value="item.warehouseId"-->
<!-- />-->
<!-- </el-select>-->
<!-- </el-form-item>-->
<el-form-item label="时间范围" prop="dateRange"> <!-- 时间范围 -->
<el-date-picker
v-model="dateRange"
type="daterange"
unlink-panels
range-separator="-"
start-placeholder="开始日期"
end-placeholder="结束日期"
@@ -46,7 +47,7 @@ export default {
return {
// 查询参数
queryParams: {
warehouseId: undefined,
warehouseId: null,
startTime: '',
endTime: '',
inOut:'1'
@@ -67,7 +68,7 @@ export default {
queryWarehouseParam:{
pageNum: 1,
pageSize: 99,
typeData:[1,2]
typeData:[1]
}
}
},
@@ -115,56 +116,63 @@ export default {
},
/** 更新图表数据 */
updateChart() {
const option = {
title: {
text: '入库数量统计' // 入库数量统计（按巷道）
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'cross'
}
},
legend: {
data: this.chartData.series.map(item => item.name),
top: 25
},
grid: {
top: 80,
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
xAxis: {
type: 'category',
boundaryGap: false,
data: this.chartData.xAxis,
axisLabel: {
rotate: 0
}
},
yAxis: {
type: 'value',
name: '入库数量', // 入库数量
minInterval: 1
},
series: this.chartData.series.map((item, index) => ({
name: item.name,
type: 'line',
data: item.data,
smooth: true,
symbol: 'circle',
symbolSize: 6,
itemStyle: {
color: this.chartColors[index % this.chartColors.length]
// 在调用setOption前检查chart实例是否存在
if (this.chart && typeof this.chart.setOption === 'function') {
const option = {
title: {
text: '入库数量统计' // 入库数量统计（按巷道）
},
lineStyle: {
width: 2
}
}))
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'cross'
}
},
legend: {
data: this.chartData.series.map(item => item.name),
top: 25
},
grid: {
top: 80,
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
xAxis: {
type: 'category',
boundaryGap: false,
data: this.chartData.xAxis,
axisLabel: {
rotate: 0
}
},
yAxis: {
type: 'value',
name: '入库数量', // 入库数量
minInterval: 1
},
series: this.chartData.series.map((item, index) => ({
name: item.name,
type: 'line',
data: item.data,
smooth: true,
symbol: 'circle',
symbolSize: 6,
itemStyle: {
color: this.chartColors[index % this.chartColors.length]
},
lineStyle: {
width: 2
}
}))
}
this.chart.setOption(option, true)
} else {
console.warn('Chart instance is not ready yet');
}
this.chart.setOption(option, true)
},
/** 处理日期范围变化 */
handleDateRangeChange(val) {

120
ruoyi-ui/src/views/kpi/outAnalysis/indexByTime.vue
View File

@@ -1,20 +1,21 @@
<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" :inline="true">
<!-- <el-form-item label="仓库" prop="warehouseId"> &lt;!&ndash; 仓库 &ndash;&gt;-->
<!-- <el-select v-model="queryParams.warehouseId" placeholder="请选择仓库" clearable> &lt;!&ndash; 请选择仓库 &ndash;&gt;-->
<!-- <el-option-->
<!-- v-for="item in warehouseOptions"-->
<!-- :key="item.warehouseId"-->
<!-- :label="item.warehouseName"-->
<!-- :value="item.warehouseId"-->
<!-- />-->
<!-- </el-select>-->
<!-- </el-form-item>-->
<!-- <el-form-item label="仓库" prop="warehouseId"> &lt;!&ndash; 仓库 &ndash;&gt;-->
<!-- <el-select v-model="queryParams.warehouseId" placeholder="请选择仓库" clearable> &lt;!&ndash; 请选择仓库 &ndash;&gt;-->
<!-- <el-option-->
<!-- v-for="item in warehouseOptions"-->
<!-- :key="item.warehouseId"-->
<!-- :label="item.warehouseName"-->
<!-- :value="item.warehouseId"-->
<!-- />-->
<!-- </el-select>-->
<!-- </el-form-item>-->
<el-form-item label="时间范围" prop="dateRange"> <!-- 时间范围 -->
<el-date-picker
v-model="dateRange"
type="daterange"
unlink-panels
range-separator="-"
start-placeholder="开始日期"
end-placeholder="结束日期"
@@ -46,7 +47,7 @@ export default {
return {
// 查询参数
queryParams: {
warehouseId: undefined,
warehouseId: null,
startTime: '',
endTime: '',
inOut:'2'
@@ -67,7 +68,7 @@ export default {
queryWarehouseParam:{
pageNum: 1,
pageSize: 99,
typeData:[1,2]
typeData:[1]
}
}
},
@@ -115,53 +116,58 @@ export default {
},
/** 更新图表数据 */
updateChart() {
const option = {
title: {
text: '出库数量统计' // 出库数量统计（按巷道）
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'cross'
}
},
legend: {
data: this.chartData.series.map(item => item.name),
top: 25
},
grid: {
top: 80,
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
xAxis: {
type: 'category',
boundaryGap: false,
data: this.chartData.xAxis
},
yAxis: {
type: 'value',
name: '出库数量', // 出库数量
minInterval: 1
},
series: this.chartData.series.map((item, index) => ({
name: item.name,
type: 'line',
data: item.data,
smooth: true,
symbol: 'circle',
symbolSize: 6,
itemStyle: {
color: this.chartColors[index % this.chartColors.length]
// 在调用setOption前检查chart实例是否存在
if (this.chart && typeof this.chart.setOption === 'function') {
const option = {
title: {
text: '出库数量统计' // 出库数量统计（按巷道）
},
lineStyle: {
width: 2
}
}))
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'cross'
}
},
legend: {
data: this.chartData.series.map(item => item.name),
top: 25
},
grid: {
top: 80,
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
xAxis: {
type: 'category',
boundaryGap: false,
data: this.chartData.xAxis
},
yAxis: {
type: 'value',
name: '出库数量', // 出库数量
minInterval: 1
},
series: this.chartData.series.map((item, index) => ({
name: item.name,
type: 'line',
data: item.data,
smooth: true,
symbol: 'circle',
symbolSize: 6,
itemStyle: {
color: this.chartColors[index % this.chartColors.length]
},
lineStyle: {
width: 2
}
}))
}
this.chart.setOption(option, true)
} else {
console.warn('Chart instance is not ready yet');
}
this.chart.setOption(option, true)
},
/** 处理日期范围变化 */
handleDateRangeChange(val) {

135
ruoyi-ui/src/views/kpi/spaceAnalysis/index.vue
View File

@@ -2,33 +2,33 @@
<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="warehouseId">-->
<!-- <el-select v-model="queryParams.warehouseId" placeholder="请选择仓库" clearable @change="onWarehouseChange">-->
<!-- <el-option-->
<!-- v-for="dict in warehouseOptions"-->
<!-- :key="dict.warehouseId"-->
<!-- :label="dict.warehouseName"-->
<!-- :value="dict.warehouseId"-->
<!-- />-->
<!-- </el-select>-->
<!-- </el-form-item>-->
<!-- <el-form-item label="仓库" prop="warehouseId">-->
<!-- <el-select v-model="queryParams.warehouseId" placeholder="请选择仓库" clearable @change="onWarehouseChange">-->
<!-- <el-option-->
<!-- v-for="dict in warehouseOptions"-->
<!-- :key="dict.warehouseId"-->
<!-- :label="dict.warehouseName"-->
<!-- :value="dict.warehouseId"-->
<!-- />-->
<!-- </el-select>-->
<!-- </el-form-item>-->
<!-- 巷道 -->
<el-form-item label="巷道" prop="roadwayId">
<el-select v-model="queryParams.roadwayId" placeholder="请选择巷道" clearable @change="handleQuery">
<el-option
v-for="item in roadwayOptions"
:key="item.value"
:label="item.name"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item>
<!-- 【搜索】按钮 -->
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<!-- 【重置】按钮 -->
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
<!-- <el-form-item label="巷道" prop="roadwayId">
<el-select v-model="queryParams.roadwayId" placeholder="请选择巷道" clearable @change="handleQuery">
<el-option
v-for="item in roadwayOptions"
:key="item.value"
:label="item.name"
:value="item.value"
/>
</el-select>
</el-form-item>-->
<!-- <el-form-item>-->
<!-- &lt;!&ndash; 【搜索】按钮 &ndash;&gt;-->
<!-- <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>-->
<!-- &lt;!&ndash; 【重置】按钮 &ndash;&gt;-->
<!-- <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>-->
<!-- </el-form-item>-->
</el-form>
<!-- 饼状图容器 -->
@@ -54,19 +54,10 @@ export default {
// 仓库选项
warehouseOptions: [],
// 巷道选项
roadwayOptions: [
{
value: "1",
name: "一巷道"
},
{
value: "2",
name: "二巷道"
}
],
roadwayOptions: [],
// 查询参数
queryParams: {
// warehouseId: null,
warehouseId: null,
roadwayId: null
},
// 图表实例
@@ -82,7 +73,7 @@ export default {
}
,
created() {
// this.getWarehouseList();
this.getWarehouseList();
this.handleQuery();
}
,
@@ -99,37 +90,37 @@ export default {
,
methods: {
/** 查询仓库列表 */
// getWarehouseList() {
// listWarehouse(this.queryWarehouseParam).then(response => {
// this.warehouseOptions = response.rows;
// // 默认选择第一个仓库并加载巷道
// // if (!this.queryParams.warehouseId && this.warehouseOptions.length) {
// // this.queryParams.warehouseId = this.warehouseOptions[0].warehouseId;
// // }
// this.getRoadwayList();
// });
// }
// ,
getWarehouseList() {
listWarehouse(this.queryWarehouseParam).then(response => {
this.warehouseOptions = response.rows;
// 默认选择第一个仓库并加载巷道
// if (!this.queryParams.warehouseId && this.warehouseOptions.length) {
// this.queryParams.warehouseId = this.warehouseOptions[0].warehouseId;
// }
this.getRoadwayList();
});
}
,
/** 仓库切换 */
// onWarehouseChange() {
// this.queryParams.roadwayId = null;
// this.getRoadwayList();
// }
// ,
onWarehouseChange() {
this.queryParams.roadwayId = null;
this.getRoadwayList();
}
,
/** 查询巷道列表 */
// getRoadwayList() {
// // if (!this.queryParams.warehouseId) return;
// getRoadways({ warehouseId: this.queryParams.warehouseId }).then(res => {
// this.roadwayOptions = (res.data && res.data.data) || [];
// // 默认选择第一个巷道
// // if (!this.queryParams.roadwayId && this.roadwayOptions.length) {
// // this.queryParams.roadwayId = this.roadwayOptions[0].value;
// // }
//
// this.handleQuery();
// });
// }
// ,
getRoadwayList() {
if (!this.queryParams.warehouseId) return;
getRoadways({ warehouseId: this.queryParams.warehouseId }).then(res => {
this.roadwayOptions = (res.data && res.data.data) || [];
// 默认选择第一个巷道
// if (!this.queryParams.roadwayId && this.roadwayOptions.length) {
// this.queryParams.roadwayId = this.roadwayOptions[0].value;
// }
this.handleQuery();
});
}
,
/** 搜索按钮操作 */
handleQuery() {
// if (!this.queryParams.warehouseId || !this.queryParams.roadwayId) return;
@@ -149,9 +140,12 @@ export default {
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.handleQuery();
// 保持默认仓库，重新加载巷道并刷新
if (this.warehouseOptions.length) {
this.queryParams.warehouseId = this.warehouseOptions[0].warehouseId;
}
this.queryParams.roadwayId = null;
this.getRoadwayList();
}
,
/** 初始化图表 */
@@ -198,6 +192,7 @@ export default {
color: "#292c2c"
},
},
color: ['#25abd9', '#fac858', '#91cc75', '#ee6666', '#73c0de', '#3ba272'], // 添加六个自定义颜色
series: [{
name: '货位状态',
type: 'pie',

118
ruoyi-ui/src/views/kpi/spacePlan/index.vue
View File

@@ -3,28 +3,28 @@
<div class="search-box">
<el-form :model="queryParams" ref="queryForm" :inline="true">
<!-- 仓库 -->
<!-- <el-form-item label="仓库" prop="warehouseId">-->
<!-- <el-select v-model="queryParams.warehouseId" placeholder="请选择仓库" @change="handleWarehouseChange">-->
<!-- <el-option-->
<!-- v-for="dict in warehouseOptions"-->
<!-- :key="dict.warehouseId"-->
<!-- :label="dict.warehouseName"-->
<!-- :value="dict.warehouseId"-->
<!-- />-->
<!-- </el-select>-->
<!-- </el-form-item>-->
<!-- 巷道 -->
<el-form-item label="巷道">
<el-select v-model="queryParams.roadwayId" style="width: 150px" @change="handleRoadwayChange">
<el-option v-for="item in roadwayOptions" :key="item.value" :label="item.label" :value="item.value"/>
<!-- <el-form-item label="仓库" prop="warehouseId">-->
<!-- <el-select v-model="queryParams.warehouseId" placeholder="请选择仓库" @change="handleWarehouseChange">-->
<!-- <el-option-->
<!-- v-for="dict in warehouseOptions"-->
<!-- :key="dict.warehouseId"-->
<!-- :label="dict.warehouseName"-->
<!-- :value="dict.warehouseId"-->
<!-- />-->
<!-- </el-select>-->
<!-- </el-form-item>-->
<!-- 层数 -->
<el-form-item label="层数">
<el-select v-model="queryParams.theFloor" style="width: 150px" @change="handleFloorChange">
<el-option v-for="item in floorOptions" :key="item.value" :label="item.label" :value="item.value"/>
</el-select>
</el-form-item>
<!-- 排 -->
<el-form-item label="排">
<el-select v-model="queryParams.thePlatoon" style="width: 150px" @change="handlePlatoonChange">
<el-option v-for="item in platoonOptions" :key="item.value" :label="item.label" :value="item.value"/>
</el-select>
</el-form-item>
<!-- <el-form-item label="排">
<el-select v-model="queryParams.thePlatoon" style="width: 150px" @change="handlePlatoonChange">
<el-option v-for="item in platoonOptions" :key="item.value" :label="item.label" :value="item.value"/>
</el-select>
</el-form-item>-->
</el-form>
</div>
@@ -36,7 +36,7 @@
<script>
import * as echarts from 'echarts'
import {getRoadways, getPlatoons, getChartData, getChartMag} from "@/api/kpi/spacePlan"
import {getRoadways, getPlatoons, getChartData, getChartMag, getFloors} from "@/api/kpi/spacePlan"
import {listWarehouse} from "@/api/bas/warehouse";
import VueI18n from 'vue-i18n';
@@ -49,6 +49,7 @@ export default {
warehouseId: '01',
roadwayId: '1',
thePlatoon: '',
theFloor: '1',
platoon: '1',
specifications: '',
quantity_x: '',
@@ -65,6 +66,7 @@ export default {
warehouseOptions: [],
// 巷道选项
roadwayOptions: [],
floorOptions: [],
// 排号选项
platoonOptions: [],
// 图表实例
@@ -89,12 +91,12 @@ export default {
queryWarehouseParam:{
pageNum: 1,
pageSize: 99,
typeData:[1,2]
typeData:[1]
}
}
},
mounted() {
this.getWarehouseList()
this.getWarehouseList()
this.initCharts()
this.handleWarehouseChange()
},
@@ -116,34 +118,28 @@ this.getWarehouseList()
// 重置巷道和排号
this.queryParams.roadwayId = ''
this.queryParams.thePlatoon = ''
this.roadwayOptions = []
this.floorOptions = []
this.platoonOptions = []
// 获取巷道列表
getRoadways(this.queryParams).then(response => {
const roadways = response.data.data
if (roadways && roadways.length > 0) {
this.roadwayOptions = roadways
this.queryParams.roadwayId = roadways[0].value
this.handleRoadwayChange()
// 获取层数列表
getFloors({ warehouseId: this.queryParams.warehouseId }).then(response => {
const floors = response.data.data || []
if (floors && floors.length > 0) {
this.floorOptions = floors.map(f => {
const lbl = f.label != null ? f.label : (f.name != null ? f.name : (f.title != null ? f.title : (f.value != null ? (String(f.value) + '排') : '')))
const val = f.value != null ? String(f.value) : String((lbl || '').replace(/[^\d]/g, ''))
return { label: lbl, value: val }
})
this.queryParams.theFloor = this.floorOptions[0].value
this.loadChartData()
} else {
this.floorOptions = []
this.queryParams.theFloor = null
}
})
},
// 巷道变化处理
handleRoadwayChange() {
// 重置排号
this.queryParams.thePlatoon = ''
this.platoonOptions = []
// 获取排号列表
getPlatoons(this.queryParams).then(response => {
const platoons = response.data.data
if (platoons && platoons.length > 0) {
this.platoonOptions = platoons
this.queryParams.thePlatoon = platoons[0].value
this.loadChartData()
}
})
},
handlePlatoonChange() {
handleFloorChange() {
console.log( this.queryParams.theFloor)
this.loadChartData()
},
// 加载普通仓库图表数据
@@ -178,10 +174,11 @@ this.getWarehouseList()
}
},
title: {
// 标题：库位分布平面图
text: '库位分布平面图',
// 子标题：排
subtext: this.queryParams.thePlatoon + '排'
subtext: (() => {
const sel = this.floorOptions.find(o => String(o.value) === String(this.queryParams.theFloor))
return sel && sel.label ? sel.label : ''
})()
},
grid: {
width: '90%',
@@ -230,7 +227,7 @@ this.getWarehouseList()
{
// 图例：出库分配
name: '出库分配',
itemStyle: { color: '#FF0000' }
itemStyle: { color: '#00cc00' }
},
{
// 图例：入库需盘点
@@ -327,35 +324,39 @@ this.getWarehouseList()
if (params.seriesName !== '满位') {
// 排
if (this.$i18n.locale ==='zh-cn') {
return params.seriesName + '<br>排' + this.queryParams.thePlatoon + '列' + (params.data[0] + 1) + '层' + (params.data[1] + 1);
return params.seriesName + '<br>' + (params.data[1] + 1) + '排' + (params.data[0] + 1) + '列' + this.queryParams.theFloor+ '层';
}
else{
return params.seriesName + '<br>' + this.queryParams.thePlatoon + '排 ' + (params.data[0] + 1) + '列 ' + (params.data[1] + 1) + '层';
return params.seriesName + '<br>' + (params.data[1] + 1) + '排' + (params.data[0] + 1) + '列' + this.queryParams.theFloor+ '层';
}
}
const returnData = {
"thePlatoon": this.queryParams.thePlatoon,
"thePlatoon": params.data[1] + 1,
"theColumn": params.data[0] + 1,
"theFloor": params.data[1] + 1,
"theFloor": this.queryParams.theFloor,
"warehouseId": this.queryParams.warehouseId
};
// 生成唯一标识
const key = `${params.seriesName}-${params.data[0]}-${params.data[1]}`;
// 如果已经在加载中，返回基本信息
if (this.loadingKeys && this.loadingKeys[key]) {
if (this.$i18n.locale === 'zh-cn') {
return `${params.seriesName}<br>${this.queryParams.thePlatoon}排${params.data[0] + 1}列${params.data[1] + 1}层<br>加载中...`;
return params.seriesName + '<br>' + (params.data[1] + 1) + '排' + (params.data[0] + 1) + '列' + this.queryParams.theFloor + '层';
} else {
return `${params.seriesName}<br>${this.queryParams.thePlatoon}排 ${params.data[0] + 1}列 ${params.data[1] + 1}层<br>加载中...`;
return params.seriesName + '<br>' + (params.data[1] + 1) + '排' + (params.data[0] + 1) + '列' + this.queryParams.theFloor+ '层';
}
}
// 返回基本信息
const baseStr = `${params.seriesName}<br>${this.queryParams.thePlatoon}排${params.data[0] + 1}列${params.data[1] + 1}层`;
const baseStr = `${params.seriesName}<br>${(params.data[1] + 1)}排${params.data[0] + 1}列${this.queryParams.theFloor}层`;
// 设置加载状态
if (!this.loadingKeys) this.loadingKeys = {};
@@ -371,8 +372,8 @@ this.getWarehouseList()
tooltip: {
formatter: (p) => {
if (p.seriesName === params.seriesName &&
p.data[0] === params.data[0] &&
p.data[1] === params.data[1]) {
p.data[0] === params.data[0] &&
p.data[1] === params.data[1]) {
return str;
}
return this.formatTooltip(p);
@@ -417,4 +418,3 @@ this.getWarehouseList()
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
}
</style>