手持机

This commit is contained in:
张怡蓉
2025-12-18 11:05:17 +08:00
parent 9c0a5c0d3e
commit 48b1b590a7
5 changed files with 148 additions and 85 deletions

View File

@@ -87,6 +87,12 @@ public class KpiController extends BaseController {
return success(kpiService.getSpaceAnalysis(warehouseId));
}
@GetMapping("/spaceStatusCounts")
public AjaxResult getSpaceStatusCounts(String warehouseId,
String roadwayId) {
return success(kpiService.getSpaceStatusCounts(warehouseId, roadwayId));
}
/**
* 获取货位巷道数据
*

View File

@@ -32,6 +32,7 @@ public interface KpiService {
*/
Map<String, Object> getRoadwayAnalysis(String warehouseId, String startTime, String endTime);
Map<String, Object> getSpaceStatusCounts(String warehouseId, String roadwayId);
Map<String, Object> getSpaceAnalysis(String warehouseId);

View File

@@ -289,6 +289,35 @@ public class KpiServiceImpl implements KpiService
return response;
}
@Override
public Map<String, Object> getSpaceStatusCounts(String warehouseId, String roadwayId) {
BasCargoSpace query = new BasCargoSpace();
query.setWarehouseId(warehouseId);
query.setRoadwayId(roadwayId);
List<BasCargoSpace> list = basCargoSpaceMapper.selectBasCargoSpaceList(query);
Map<String, Integer> counts = new HashMap<>();
counts.put("1", 0); // 空闲
counts.put("2", 0); // 占用
counts.put("3", 0); // 入库分配
counts.put("4", 0); // 出库分配
counts.put("5", 0); // 入库待检
counts.put("6", 0); // 出库待检
for (BasCargoSpace space : list) {
String status = space.getStatus();
if (status != null && counts.containsKey(status)) {
counts.put(status, counts.get(status) + 1);
}
}
Map<String, Object> res = new HashMap<>();
res.put("data", counts);
return res;
}
@Override
public Map<String, Object> getRoadways(String warehouseId){
Map<String, Object> response = new HashMap<>();

View File

@@ -7,3 +7,10 @@ export function getSpaceAnalysisList(query) {
params: query
})
}
export function getSpaceStatusCounts(query) {
return request({
url: '/kpi/spaceStatusCounts',
method: 'get',
params: query
})
}

View File

@@ -1,9 +1,9 @@
<template>
<div class="app-container">
<!-- <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="100px">-->
<!-- &lt;!&ndash; 仓库 &ndash;&gt;-->
<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>-->
<!-- <el-select v-model="queryParams.warehouseId" placeholder="请选择仓库" clearable @change="onWarehouseChange">-->
<!-- <el-option-->
<!-- v-for="dict in warehouseOptions"-->
<!-- :key="dict.warehouseId"-->
@@ -12,15 +12,26 @@
<!-- />-->
<!-- </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>-->
<!-- 巷道 -->
<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>
<!-- 柱状图容器 -->
<!-- 饼状图容器 -->
<div class="chart-container" style="height: 700px">
<div ref="spaceChart" style="width: 100%; height: 100%"></div>
</div>
@@ -29,8 +40,9 @@
<script>
import * as echarts from '@/plugins/echarts.min.js'
import { getSpaceAnalysisList } from "@/api/kpi/spaceAnalysis"
import {listWarehouse} from "@/api/bas/warehouse";
import { getSpaceStatusCounts } from "@/api/kpi/spaceAnalysis"
import { listWarehouse } from "@/api/bas/warehouse";
import { getRoadways } from "@/api/kpi/spacePlan";
export default {
name: "spaceAnalysis",
data() {
@@ -41,24 +53,36 @@ export default {
showSearch: true,
// 仓库选项
warehouseOptions: [],
// 巷道选项
roadwayOptions: [
{
value: "1",
name: "一巷道"
},
{
value: "2",
name: "二巷道"
}
],
// 查询参数
queryParams: {
warehouseId: null // 默认选择仓库1
// warehouseId: null,
roadwayId: null
},
// 图表实例
chart: null,
// 图表数据(模拟数据)
chartData:[],
// 图表数据(状态计数)
chartData: {},
queryWarehouseParam:{
pageNum: 1,
pageSize: 99,
typeData:[1,2]
typeData:[1]
}
}
}
,
created() {
this.getWarehouseList();
// this.getWarehouseList();
this.handleQuery();
}
,
@@ -75,34 +99,59 @@ export default {
,
methods: {
/** 查询仓库列表 */
getWarehouseList() {
listWarehouse(this.queryWarehouseParam).then(response => {
this.warehouseOptions = response.rows;
});
// this.warehouseOptions = [{warehouseId: "01", warehouseName: "仓库1"}, {warehouseId: "02", warehouseName: "仓库2"}];
}
,
// 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();
// }
// ,
/** 查询巷道列表 */
// 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() {
getSpaceAnalysisList(this.queryParams).then(response => {
// if (!this.queryParams.warehouseId || !this.queryParams.roadwayId) return;
getSpaceStatusCounts(this.queryParams).then(response => {
if (response.code === 200) {
this.chartData = response.data;
this.chartData = response.data.data || {};
this.updateChart();
} else {
this.$message.error(response.msg);
}
}).catch(error => {
// 提示:获取数据失败
console.error('获取数据失败:', error);
this.$message.error('获取数据失败');
});
},
}
,
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.queryParams.warehouseId = "01"; // 重置时仍选择仓库1
this.handleQuery();
}
,
/** 初始化图表 */
@@ -118,57 +167,29 @@ export default {
'2': '占用',
'3': '入库分配',
'4': '出库分配',
'5': '入库待检',
'6': '出库待检'
'5': '入库需盘点',
'6': '出库需盘点'
};
return statusMap[statusCode] || statusCode;
},
/** 更新图表数据 */
}
,
/** 更新图表数据为饼图 */
updateChart() {
console.log('chartData:', this.chartData);
if (!this.chartData || !this.chartData.data || this.chartData.data.length === 0) {
// 提示:无效的图表数据
console.warn('无效的图表数据');
return;
}
// 获取数据中所有的巷道字段
const firstItem = this.chartData.data[0];
// 巷道
const roadwayFields = Object.keys(firstItem).filter(key => key.startsWith('巷道'));
// 准备系列配置
const series = roadwayFields.map(roadway => ({
name: roadway,
type: 'bar',
data: this.chartData.data.map(item => item[roadway]),
barWidth: '30%',
itemStyle: {
// 巷道1-4
color: roadway === '巷道1' ? '#1890ff' :
roadway === '巷道2' ? '#52c41a' :
roadway === '巷道3' ? '#1890ff' :
roadway === '巷道4' ? '#52c41a' : '#1890ff'
},
label: {
show: true,
position: 'top'
}
const counts = this.chartData || {};
const statusCodes = ['1','2','3','4','5','6'];
const pieData = statusCodes.map(code => ({
name: this.getStatusText(code),
value: counts[code] || 0
}));
// 提示:生成的系列配置
console.log('系列配置:', series);
const option = {
title: {
// 货位状态分析
text: '货位状态分析',
left: 'center'
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow'
}
trigger: 'item',
formatter: '{b}: {c} ({d}%)'
},
legend: {
top: "5%",
@@ -177,22 +198,21 @@ export default {
color: "#292c2c"
},
},
xAxis: {
type: 'category',
data: this.chartData.data.map(item => this.getStatusText(item.status)),
axisLabel: {
interval: 0,
rotate: 0
series: [{
name: '货位状态',
type: 'pie',
radius: '60%',
center: ['50%', '60%'],
data: pieData,
label: {
show: true,
formatter: '{b}: {c}'
}
},
yAxis: {
type: 'value',
// 数量
name: '数量'
},
series: series
}]
};
this.chart.setOption(option);
if (this.chart) {
this.chart.setOption(option);
}
},
}
}