KPI分析

This commit is contained in:
猫猫guowen
2025-09-18 10:55:41 +08:00
parent 0a0d4c44db
commit 0361c5846f
5 changed files with 175 additions and 83 deletions

View File

@@ -15,6 +15,7 @@ import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service; import org.springframework.stereotype.Service;
import java.util.*; import java.util.*;
import java.util.stream.Collectors;
/** /**
* KPI 统计分析 服务实现类 * KPI 统计分析 服务实现类
@@ -457,15 +458,51 @@ public class KpiServiceImpl implements KpiService
mydoJobParam.setInOut(inOut); mydoJobParam.setInOut(inOut);
List<DateTime> datesBetween = DateUtil.rangeToList(DateUtil.parseDate(mydoJobParam.getCreateLeftTime()), DateUtil.parseDate(mydoJobParam.getCreateRightTime()), DateField.DAY_OF_MONTH); List<DateTime> datesBetween = DateUtil.rangeToList(DateUtil.parseDate(mydoJobParam.getCreateLeftTime()), DateUtil.parseDate(mydoJobParam.getCreateRightTime()), DateField.DAY_OF_MONTH);
List<MydoJob> list = mydoJobFinishMapper.selectMydoJobFinishListByMydoJob(mydoJobParam); List<MydoJob> list = mydoJobFinishMapper.selectMydoJobFinishListByMydoJob(mydoJobParam);
List<String> x = new ArrayList<>();
List<Long> y = new ArrayList<>(); // 根据inOut过滤数据
for (DateTime dateTime : datesBetween) { list = list.stream()
//筛选每一日的数量 .filter(job -> {
x.add(DateUtil.format(dateTime, "yyyy-MM-dd")); int inOrOut = Integer.parseInt(job.getInOrOut());
y.add(list.stream().filter(mydoJob -> DateUtil.isIn(mydoJob.getCreateTime(), DateUtil.beginOfDay(dateTime),DateUtil.endOfDay(dateTime))).count()); return "1".equals(mydoJobParam.getInOut()) ? inOrOut < 20 : inOrOut >= 20;
})
.collect(Collectors.toList());
// 获取所有巷道ID(1和2)
List<String> roadwayIds = Arrays.asList("1", "2");
List<String> xAxis = new ArrayList<>();
List<Map<String, Object>> series = new ArrayList<>();
// 为每个巷道创建一个系列
for (String roadwayId : roadwayIds) {
Map<String, Object> seriesItem = new HashMap<>();
seriesItem.put("name", roadwayId + "号巷道");
seriesItem.put("type", "line");
List<Long> data = new ArrayList<>();
seriesItem.put("data", data);
series.add(seriesItem);
} }
res.put("xAxis",x);
res.put("series",y); // 按日期统计每个巷道的数量
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();
@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); return AjaxResult.success(res);
} }

View File

@@ -1,16 +1,16 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<el-form :model="queryParams" ref="queryForm" :inline="true"> <el-form :model="queryParams" ref="queryForm" :inline="true">
<el-form-item label="仓库" prop="warehouseId"> <!-- 仓库 --> <!-- <el-form-item label="仓库" prop="warehouseId"> &lt;!&ndash; 仓库 &ndash;&gt;-->
<el-select v-model="queryParams.warehouseId" placeholder="请选择仓库" clearable> <!-- 请选择仓库 --> <!-- <el-select v-model="queryParams.warehouseId" placeholder="请选择仓库" clearable> &lt;!&ndash; 请选择仓库 &ndash;&gt;-->
<el-option <!-- <el-option-->
v-for="item in warehouseOptions" <!-- v-for="item in warehouseOptions"-->
:key="item.warehouseId" <!-- :key="item.warehouseId"-->
:label="item.warehouseName" <!-- :label="item.warehouseName"-->
:value="item.warehouseId" <!-- :value="item.warehouseId"-->
/> <!-- />-->
</el-select> <!-- </el-select>-->
</el-form-item> <!-- </el-form-item>-->
<el-form-item label="时间范围" prop="dateRange"> <!-- 时间范围 --> <el-form-item label="时间范围" prop="dateRange"> <!-- 时间范围 -->
<el-date-picker <el-date-picker
v-model="dateRange" v-model="dateRange"
@@ -62,6 +62,8 @@ export default {
xAxis: [], xAxis: [],
series: [] series: []
}, },
// 图表颜色
chartColors: ['#409EFF', '#67C23A'],
queryWarehouseParam:{ queryWarehouseParam:{
pageNum: 1, pageNum: 1,
pageSize: 99, pageSize: 99,
@@ -115,27 +117,54 @@ export default {
updateChart() { updateChart() {
const option = { const option = {
title: { title: {
text: '入库数量统计' // 入库数量统计 text: '入库数量统计' // 入库数量统计(按巷道)
}, },
tooltip: { tooltip: {
trigger: 'axis' 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: { xAxis: {
type: 'category', type: 'category',
data: this.chartData.xAxis boundaryGap: false,
data: this.chartData.xAxis,
axisLabel: {
rotate: 0
}
}, },
yAxis: { yAxis: {
type: 'value', type: 'value',
name: '入库数量' // 入库数量
},
series: [{
name: '入库数量', // 入库数量 name: '入库数量', // 入库数量
minInterval: 1
},
series: this.chartData.series.map((item, index) => ({
name: item.name,
type: 'line', type: 'line',
data: this.chartData.series, data: item.data,
smooth: true smooth: true,
}] symbol: 'circle',
symbolSize: 6,
itemStyle: {
color: this.chartColors[index % this.chartColors.length]
},
lineStyle: {
width: 2
} }
this.chart.setOption(option) }))
}
this.chart.setOption(option, true)
}, },
/** 处理日期范围变化 */ /** 处理日期范围变化 */
handleDateRangeChange(val) { handleDateRangeChange(val) {

View File

@@ -1,16 +1,16 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<el-form :model="queryParams" ref="queryForm" :inline="true"> <el-form :model="queryParams" ref="queryForm" :inline="true">
<el-form-item label="仓库" prop="warehouseId"> <!-- 仓库 --> <!-- <el-form-item label="仓库" prop="warehouseId"> &lt;!&ndash; 仓库 &ndash;&gt;-->
<el-select v-model="queryParams.warehouseId" placeholder="请选择仓库" clearable> <!-- 请选择仓库 --> <!-- <el-select v-model="queryParams.warehouseId" placeholder="请选择仓库" clearable> &lt;!&ndash; 请选择仓库 &ndash;&gt;-->
<el-option <!-- <el-option-->
v-for="item in warehouseOptions" <!-- v-for="item in warehouseOptions"-->
:key="item.warehouseId" <!-- :key="item.warehouseId"-->
:label="item.warehouseName" <!-- :label="item.warehouseName"-->
:value="item.warehouseId" <!-- :value="item.warehouseId"-->
/> <!-- />-->
</el-select> <!-- </el-select>-->
</el-form-item> <!-- </el-form-item>-->
<el-form-item label="时间范围" prop="dateRange"> <!-- 时间范围 --> <el-form-item label="时间范围" prop="dateRange"> <!-- 时间范围 -->
<el-date-picker <el-date-picker
v-model="dateRange" v-model="dateRange"
@@ -62,6 +62,8 @@ export default {
xAxis: [], xAxis: [],
series: [] series: []
}, },
// 图表颜色
chartColors: ['#409EFF', '#67C23A'],
queryWarehouseParam:{ queryWarehouseParam:{
pageNum: 1, pageNum: 1,
pageSize: 99, pageSize: 99,
@@ -115,27 +117,51 @@ export default {
updateChart() { updateChart() {
const option = { const option = {
title: { title: {
text: '出库数量统计' // 出库数量统计 text: '出库数量统计' // 出库数量统计(按巷道)
}, },
tooltip: { tooltip: {
trigger: 'axis' 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: { xAxis: {
type: 'category', type: 'category',
boundaryGap: false,
data: this.chartData.xAxis data: this.chartData.xAxis
}, },
yAxis: { yAxis: {
type: 'value', type: 'value',
name: '出库数量' // 出库数量
},
series: [{
name: '出库数量', // 出库数量 name: '出库数量', // 出库数量
minInterval: 1
},
series: this.chartData.series.map((item, index) => ({
name: item.name,
type: 'line', type: 'line',
data: this.chartData.series, data: item.data,
smooth: true smooth: true,
}] symbol: 'circle',
symbolSize: 6,
itemStyle: {
color: this.chartColors[index % this.chartColors.length]
},
lineStyle: {
width: 2
} }
this.chart.setOption(option) }))
}
this.chart.setOption(option, true)
}, },
/** 处理日期范围变化 */ /** 处理日期范围变化 */
handleDateRangeChange(val) { handleDateRangeChange(val) {

View File

@@ -1,24 +1,24 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="100px"> <!-- <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="100px">-->
<!-- 仓库 --> <!-- &lt;!&ndash; 仓库 &ndash;&gt;-->
<el-form-item label="仓库" prop="warehouseId"> <!-- <el-form-item label="仓库" prop="warehouseId">-->
<el-select v-model="queryParams.warehouseId" placeholder="请选择仓库" clearable> <!-- <el-select v-model="queryParams.warehouseId" placeholder="请选择仓库" clearable>-->
<el-option <!-- <el-option-->
v-for="dict in warehouseOptions" <!-- v-for="dict in warehouseOptions"-->
:key="dict.warehouseId" <!-- :key="dict.warehouseId"-->
:label="dict.warehouseName" <!-- :label="dict.warehouseName"-->
:value="dict.warehouseId" <!-- :value="dict.warehouseId"-->
/> <!-- />-->
</el-select> <!-- </el-select>-->
</el-form-item> <!-- </el-form-item>-->
<el-form-item> <!-- <el-form-item>-->
<!-- 【搜索】按钮 --> <!-- &lt;!&ndash; 【搜索】按钮 &ndash;&gt;-->
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button> <!-- <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-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>-->
</el-form-item> <!-- </el-form-item>-->
</el-form> <!-- </el-form>-->
<!-- 柱状图容器 --> <!-- 柱状图容器 -->
<div class="chart-container" style="height: 700px"> <div class="chart-container" style="height: 700px">

View File

@@ -3,16 +3,16 @@
<div class="search-box"> <div class="search-box">
<el-form :model="queryParams" ref="queryForm" :inline="true"> <el-form :model="queryParams" ref="queryForm" :inline="true">
<!-- 仓库 --> <!-- 仓库 -->
<el-form-item label="仓库" prop="warehouseId"> <!-- <el-form-item label="仓库" prop="warehouseId">-->
<el-select v-model="queryParams.warehouseId" placeholder="请选择仓库" @change="handleWarehouseChange"> <!-- <el-select v-model="queryParams.warehouseId" placeholder="请选择仓库" @change="handleWarehouseChange">-->
<el-option <!-- <el-option-->
v-for="dict in warehouseOptions" <!-- v-for="dict in warehouseOptions"-->
:key="dict.warehouseId" <!-- :key="dict.warehouseId"-->
:label="dict.warehouseName" <!-- :label="dict.warehouseName"-->
:value="dict.warehouseId" <!-- :value="dict.warehouseId"-->
/> <!-- />-->
</el-select> <!-- </el-select>-->
</el-form-item> <!-- </el-form-item>-->
<!-- 巷道 --> <!-- 巷道 -->
<el-form-item label="巷道"> <el-form-item label="巷道">
<el-select v-model="queryParams.roadwayId" style="width: 150px" @change="handleRoadwayChange"> <el-select v-model="queryParams.roadwayId" style="width: 150px" @change="handleRoadwayChange">
@@ -250,7 +250,7 @@ this.getWarehouseList()
series: [ series: [
{ {
// 空位 // 空位
name: this.$t('KPIAnalysis_CargoPlan.legendEmpty'), name: '空位',
type: 'heatmap', type: 'heatmap',
data: this.chartData.empty, data: this.chartData.empty,
itemStyle: { itemStyle: {
@@ -260,7 +260,7 @@ this.getWarehouseList()
}, },
{ {
// 满位 // 满位
name: this.$t('KPIAnalysis_CargoPlan.legendOccupied'), name: '满位',
type: 'heatmap', type: 'heatmap',
data: this.chartData.full, data: this.chartData.full,
itemStyle: { itemStyle: {
@@ -270,7 +270,7 @@ this.getWarehouseList()
}, },
{ {
// 入库分配 // 入库分配
name: this.$t('KPIAnalysis_CargoPlan.legendStockInAssigned'), name: '入库分配',
type: 'heatmap', type: 'heatmap',
data: this.chartData.inAllot, data: this.chartData.inAllot,
itemStyle: { itemStyle: {
@@ -280,7 +280,7 @@ this.getWarehouseList()
}, },
{ {
// 出库分配 // 出库分配
name: this.$t('KPIAnalysis_CargoPlan.legendStockOutAssigned'), name: '出库分配',
type: 'heatmap', type: 'heatmap',
data: this.chartData.outAllot, data: this.chartData.outAllot,
itemStyle: { itemStyle: {
@@ -290,7 +290,7 @@ this.getWarehouseList()
}, },
{ {
// 入库需盘点 // 入库需盘点
name: this.$t('KPIAnalysis_CargoPlan.legendStockInException'), name: '入库需盘点',
type: 'heatmap', type: 'heatmap',
data: this.chartData.inCheck, data: this.chartData.inCheck,
itemStyle: { itemStyle: {
@@ -300,7 +300,7 @@ this.getWarehouseList()
}, },
{ {
// 出库需盘点 // 出库需盘点
name: this.$t('KPIAnalysis_CargoPlan.legendStockOutException'), name: '出库需盘点',
type: 'heatmap', type: 'heatmap',
data: this.chartData.outCheck, data: this.chartData.outCheck,
itemStyle: { itemStyle: {
@@ -355,7 +355,7 @@ this.getWarehouseList()
} }
// 返回基本信息 // 返回基本信息
const baseStr = `${params.seriesName}<br>${this.queryParams.thePlatoon}${this.$t('KPIAnalysis_CargoPlan.row')}${params.data[0] + 1}${this.$t('KPIAnalysis_CargoPlan.column')}${params.data[1] + 1}${this.$t('KPIAnalysis_CargoPlan.floor')}`; const baseStr = `${params.seriesName}<br>${this.queryParams.thePlatoon}排${params.data[0] + 1}列${params.data[1] + 1}层`;
// 设置加载状态 // 设置加载状态
if (!this.loadingKeys) this.loadingKeys = {}; if (!this.loadingKeys) this.loadingKeys = {};