lhq/FT501-WMS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

KPI入库分析、出库分析、巷道均匀分析、货位分析

Browse Source
This commit is contained in:
猫猫guowen
2025-05-22 16:47:38 +08:00
parent 75529855d1
commit 6bf81f9c40
19 changed files with 27563 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
ruoyi-ui/src/api/kpi/inAnalysis.js Normal file
View File

@@ -0,0 +1,9 @@
import request from '@/utils/request'
export function getInAnalysisList(query) {
return request({
url: '/kpi/inAnalysis',
method: 'get',
params: query
})
}

9
ruoyi-ui/src/api/kpi/outAnalysis.js Normal file
View File

@@ -0,0 +1,9 @@
import request from '@/utils/request'
export function getOutAnalysisList(query) {
return request({
url: '/kpi/outAnalysis',
method: 'get',
params: query
})
}

9
ruoyi-ui/src/api/kpi/roadwayAnalysis.js Normal file
View File

@@ -0,0 +1,9 @@
import request from '@/utils/request'
export function getRoadwayAnalysisList(query) {
return request({
url: '/kpi/roadwayAnalysis',
method: 'get',
params: query
})
}

9
ruoyi-ui/src/api/kpi/spaceAnalysis.js Normal file
View File

@@ -0,0 +1,9 @@
import request from '@/utils/request'
export function getSpaceAnalysisList(query) {
return request({
url: '/kpi/spaceAnalysis',
method: 'get',
params: query
})
}

25224
ruoyi-ui/src/plugins/echarts.min.js vendored Normal file
View File

File diff suppressed because it is too large Load Diff

155
ruoyi-ui/src/views/kpi/inAnalysis/index.vue Normal file
View File

@@ -0,0 +1,155 @@
<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="warehouseId">
<el-select v-model="queryParams.warehouseId" placeholder="请选择仓库" clearable>
<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="yearMonth">
<el-date-picker
v-model="queryParams.yearMonth"
type="month"
placeholder="选择年月"
value-format="yyyy-MM"
format="yyyy-MM"
clearable
/>
</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="tunnelChart" style="width: 100%; height: 100%"></div>
</div>
</div>
</template>
<script>
import * as echarts from '@/plugins/echarts.min.js'
import { getInAnalysisList } from "@/api/kpi/inAnalysis"
export default {
name: "inAnalysis",
data() {
return {
// 遮罩层
loading: true,
// 显示搜索条件
showSearch: true,
// 仓库选项
warehouseOptions: [],
// 查询参数
queryParams: {
warehouseId: "01", // 默认选择仓库1
yearMonth: null
},
// 图表实例
chart: null,
// 模拟数据
chartData: {
tunnels: [],
counts: []
}
}
},
created() {
this.getWarehouseList();
this.handleQuery();
},
mounted() {
this.initChart();
},
beforeDestroy() {
if (this.chart) {
this.chart.dispose();
this.chart = null;
}
},
methods: {
/** 查询仓库列表 */
getWarehouseList() {
// TODO: 调用获取仓库列表接口
this.warehouseOptions = [{warehouseId: "01", warehouseName: "仓库1"}, {warehouseId: "02", warehouseName: "仓库2"}];
},
/** 搜索按钮操作 */
handleQuery() {
getInAnalysisList(this.queryParams).then(response => {
this.chartData = response.data;
this.updateChart();
});
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.queryParams.warehouseId = "01"; // 重置时仍选择仓库1
this.handleQuery();
},
/** 初始化图表 */
initChart() {
this.chart = echarts.init(this.$refs.tunnelChart);
this.updateChart();
},
/** 更新图表数据 */
updateChart() {
const option = {
title: {
text: '入库均匀分析',
left: 'center'
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow'
}
},
xAxis: {
type: 'category',
data: this.chartData.tunnels,
axisLabel: {
interval: 0,
rotate: 0
}
},
yAxis: {
type: 'value',
name: '数量'
},
series: [{
data: this.chartData.counts,
type: 'bar',
barWidth: '40%',
itemStyle: {
color: '#1890ff'
},
label: {
show: true,
position: 'top'
}
}]
};
this.chart.setOption(option);
}
}
}
</script>
<style scoped>
.chart-container {
margin-top: 20px;
padding: 20px;
background: #fff;
border-radius: 4px;
box-shadow: 0 2px 12px 0 rgba(0,0,0,0.1);
}
</style>

155
ruoyi-ui/src/views/kpi/outAnalysis/index.vue Normal file
View File

@@ -0,0 +1,155 @@
<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="warehouseId">
<el-select v-model="queryParams.warehouseId" placeholder="请选择仓库" clearable>
<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="yearMonth">
<el-date-picker
v-model="queryParams.yearMonth"
type="month"
placeholder="选择年月"
value-format="yyyy-MM"
format="yyyy-MM"
clearable
/>
</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="tunnelChart" style="width: 100%; height: 100%"></div>
</div>
</div>
</template>
<script>
import * as echarts from '@/plugins/echarts.min.js'
import { getOutAnalysisList } from "@/api/kpi/outAnalysis"
export default {
name: "inAnalysis",
data() {
return {
// 遮罩层
loading: true,
// 显示搜索条件
showSearch: true,
// 仓库选项
warehouseOptions: [],
// 查询参数
queryParams: {
warehouseId: "01", // 默认选择仓库1
yearMonth: null
},
// 图表实例
chart: null,
// 模拟数据
chartData: {
tunnels: [],
counts: []
}
}
},
created() {
this.getWarehouseList();
this.handleQuery();
},
mounted() {
this.initChart();
},
beforeDestroy() {
if (this.chart) {
this.chart.dispose();
this.chart = null;
}
},
methods: {
/** 查询仓库列表 */
getWarehouseList() {
// TODO: 调用获取仓库列表接口
this.warehouseOptions = [{warehouseId: "01", warehouseName: "仓库1"}, {warehouseId: "02", warehouseName: "仓库2"}];
},
/** 搜索按钮操作 */
handleQuery() {
getOutAnalysisList(this.queryParams).then(response => {
this.chartData = response.data;
this.updateChart();
});
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.queryParams.warehouseId = "01"; // 重置时仍选择仓库1
this.handleQuery();
},
/** 初始化图表 */
initChart() {
this.chart = echarts.init(this.$refs.tunnelChart);
this.updateChart();
},
/** 更新图表数据 */
updateChart() {
const option = {
title: {
text: '出库均匀分析',
left: 'center'
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow'
}
},
xAxis: {
type: 'category',
data: this.chartData.tunnels,
axisLabel: {
interval: 0,
rotate: 0
}
},
yAxis: {
type: 'value',
name: '数量'
},
series: [{
data: this.chartData.counts,
type: 'bar',
barWidth: '40%',
itemStyle: {
color: '#1890ff'
},
label: {
show: true,
position: 'top'
}
}]
};
this.chart.setOption(option);
}
}
}
</script>
<style scoped>
.chart-container {
margin-top: 20px;
padding: 20px;
background: #fff;
border-radius: 4px;
box-shadow: 0 2px 12px 0 rgba(0,0,0,0.1);
}
</style>

186
ruoyi-ui/src/views/kpi/roadwayAnalysis/index.vue Normal file
View File

@@ -0,0 +1,186 @@
<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="warehouseId">
<el-select v-model="queryParams.warehouseId" placeholder="请选择仓库" clearable>
<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="startTime">
<el-date-picker
v-model="queryParams.startTime"
type="datetime"
placeholder="选择开始时间"
value-format="yyyy-MM-dd HH:mm:ss"
format="yyyy-MM-dd HH:mm:ss"
clearable
/>
</el-form-item>
<el-form-item label="结束时间" prop="endTime">
<el-date-picker
v-model="queryParams.endTime"
type="datetime"
placeholder="选择结束时间"
value-format="yyyy-MM-dd HH:mm:ss"
format="yyyy-MM-dd HH:mm:ss"
clearable
/>
</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="tunnelChart" style="width: 100%; height: 100%"></div>
</div>
</div>
</template>
<script>
import * as echarts from '@/plugins/echarts.min.js'
import { getRoadwayAnalysisList } from "@/api/kpi/roadwayAnalysis"
export default {
name: "roadwayAnalysis",
data() {
return {
// 遮罩层
loading: true,
// 显示搜索条件
showSearch: true,
// 仓库选项
warehouseOptions: [],
// 查询参数
queryParams: {
warehouseId: "01", // 默认选择仓库1
startTime: null,
endTime: null
},
// 图表实例
chart: null,
// 图表数据
chartData: {
tunnels: [],
inCounts: [],
outCounts: []
}
}
},
created() {
this.getWarehouseList();
this.handleQuery();
},
mounted() {
this.initChart();
},
beforeDestroy() {
if (this.chart) {
this.chart.dispose();
this.chart = null;
}
},
methods: {
/** 查询仓库列表 */
getWarehouseList() {
// TODO: 调用获取仓库列表接口
this.warehouseOptions = [{warehouseId: "01", warehouseName: "仓库1"}, {warehouseId: "02", warehouseName: "仓库2"}];
},
/** 搜索按钮操作 */
handleQuery() {
getRoadwayAnalysisList(this.queryParams).then(response => {
this.chartData = response.data;
this.updateChart();
});
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.queryParams.warehouseId = "01"; // 重置时仍选择仓库1
this.handleQuery();
},
/** 初始化图表 */
initChart() {
this.chart = echarts.init(this.$refs.tunnelChart);
this.updateChart();
},
/** 更新图表数据 */
updateChart() {
const option = {
title: {
text: '巷道均匀分析',
left: 'center'
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow'
}
},
legend: {
data: ['入库数量', '出库数量'],
top: '30px'
},
xAxis: {
type: 'category',
data: this.chartData.tunnels,
axisLabel: {
interval: 0,
rotate: 0
}
},
yAxis: {
type: 'value',
name: '数量'
},
series: [
{
name: '入库数量',
data: this.chartData.inCounts,
type: 'bar',
barWidth: '30%',
itemStyle: {
color: '#1890ff'
},
label: {
show: true,
position: 'top'
}
},
{
name: '出库数量',
data: this.chartData.outCounts,
type: 'bar',
barWidth: '30%',
itemStyle: {
color: '#52c41a'
},
label: {
show: true,
position: 'top'
}
}
]
};
this.chart.setOption(option);
}
}
}
</script>
<style scoped>
.chart-container {
margin-top: 20px;
padding: 20px;
background: #fff;
border-radius: 4px;
box-shadow: 0 2px 12px 0 rgba(0,0,0,0.1);
}
</style>

177
ruoyi-ui/src/views/kpi/spaceAnalysis/index.vue Normal file
View File

@@ -0,0 +1,177 @@
<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="warehouseId">
<el-select v-model="queryParams.warehouseId" placeholder="请选择仓库" clearable>
<el-option
v-for="dict in warehouseOptions"
:key="dict.warehouseId"
:label="dict.warehouseName"
:value="dict.warehouseId"
/>
</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>
</div>
</template>
<script>
import * as echarts from '@/plugins/echarts.min.js'
import { getSpaceAnalysisList } from "@/api/kpi/spaceAnalysis"
export default {
name: "spaceAnalysis",
data() {
return {
// 遮罩层
loading: true,
// 显示搜索条件
showSearch: true,
// 仓库选项
warehouseOptions: [],
// 查询参数
queryParams: {
warehouseId: "01", // 默认选择仓库1
},
// 图表实例
chart: null,
// 图表数据（模拟数据，注意删除后echarts图初始化会报一下错）
chartData:[
{
"巷道2": 1,
"巷道1": 0,
"status": "出库分配"
}
]
}
}
,
created() {
this.getWarehouseList();
this.handleQuery();
}
,
mounted() {
this.initChart();
}
,
beforeDestroy() {
if (this.chart) {
this.chart.dispose();
this.chart = null;
}
}
,
methods: {
/** 查询仓库列表 */
getWarehouseList() {
// TODO: 调用获取仓库列表接口
this.warehouseOptions = [{warehouseId: "01", warehouseName: "仓库1"}, {warehouseId: "02", warehouseName: "仓库2"}];
}
,
/** 搜索按钮操作 */
handleQuery() {
// TODO: 调用后端接口获取数据
getSpaceAnalysisList(this.queryParams).then(response => {
this.chartData = response.data.data;
this.updateChart();
});
}
,
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.queryParams.warehouseId = "01"; // 重置时仍选择仓库1
this.handleQuery();
}
,
/** 初始化图表 */
initChart() {
this.chart = echarts.init(this.$refs.spaceChart);
this.updateChart();
}
,
/** 更新图表数据 */
updateChart() {
const option = {
title: {
text: '货位状态分析',
left: 'center'
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow'
}
},
legend: {
top: "5%",
textStyle: {
fontSize: 15,
color: "#292c2c"
}
},
dataset: {
dimensions: ['status', '巷道1', '巷道2'],
source: this.chartData
},
xAxis: {
type: 'category',
axisLabel: {
interval: 0,
rotate: 0
}
},
yAxis: {
type: 'value',
name: '数量'
},
series: [
{
type: 'bar',
barWidth: '30%',
itemStyle: {
color: '#1890ff'
},
label: {
show: true,
position: 'top'
}
},
{
type: 'bar',
barWidth: '30%',
itemStyle: {
color: '#52c41a'
},
label: {
show: true,
position: 'top'
}
}
]
};
this.chart.setOption(option);
}
}
}
</script>
<style scoped>
.chart-container {
margin-top: 20px;
padding: 20px;
background: #fff;
border-radius: 4px;
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
}
</style>