From 32898366256ac7a99c4ecdd094e05e54f8a7e621 Mon Sep 17 00:00:00 2001
From: heshaofeng <heshaofeng@hnkhzn.com>
Date: 星期五, 26 十二月 2025 09:28:58 +0800
Subject: [PATCH] Merge branch 'htq20251215' of http://115.159.85.185:8098/r/ZhongRui/ALDbanyunxiangmu into htq20251215
---
项目代码/WIDESEA_WMSClient/src/views/charts/wms-dashboard.vue | 415 ++++++++++++++++++++++++----------------------------------
1 files changed, 173 insertions(+), 242 deletions(-)
diff --git "a/\351\241\271\347\233\256\344\273\243\347\240\201/WIDESEA_WMSClient/src/views/charts/wms-dashboard.vue" "b/\351\241\271\347\233\256\344\273\243\347\240\201/WIDESEA_WMSClient/src/views/charts/wms-dashboard.vue"
index 5271c53..1126002 100644
--- "a/\351\241\271\347\233\256\344\273\243\347\240\201/WIDESEA_WMSClient/src/views/charts/wms-dashboard.vue"
+++ "b/\351\241\271\347\233\256\344\273\243\347\240\201/WIDESEA_WMSClient/src/views/charts/wms-dashboard.vue"
@@ -1,7 +1,7 @@
<template>
<div class="wms-dashboard">
<!-- 椤堕儴鏍囬鏍� -->
- <div class="header">
+ <!-- <div class="header">
<h1>WMS浠撳偍鍙鍖栧浘琛ㄧ湅鏉�</h1>
<div class="header-right">
<span>2025-12-24 16:11:44</span>
@@ -11,36 +11,36 @@
</el-select>
<el-button type="primary" style="margin-left: 10px;" @click="refreshCharts">鍒锋柊</el-button>
</div>
- </div>
+ </div> -->
- <!-- 缁熻鍗＄墖鍖哄煙 -->
+ <!-- 缁熻鍗＄墖鍖哄煙 - 缁戝畾鍝嶅簲寮忔暟鎹� -->
<el-row :gutter="20" class="stats-card-row">
<el-col :span="6">
<el-card class="stats-card">
<div class="card-title">鎬诲簱瀛橈紙浠讹級</div>
- <div class="card-value">269,225</div>
- <div class="card-change"><el-tag type="success">鈫� 2.1% 杈冩槰鏃�</el-tag></div>
+ <div class="card-value">{{ formatNumber(bigscreendata.totalStockQuantity) }}</div>
+ <!-- <div class="card-change"><el-tag type="success">鈫� 2.1% 杈冩槰鏃�</el-tag></div> -->
</el-card>
</el-col>
<el-col :span="6">
<el-card class="stats-card">
<div class="card-title">寰呭嚭搴撹鍗�</div>
- <div class="card-value">425</div>
- <div class="card-change"><el-tag type="warning">鈫� 5.3% 杈�1灏忔椂鍓�</el-tag></div>
+ <div class="card-value">{{ bigscreendata.unOutBoundOrderCount }}</div>
+ <!-- <div class="card-change"><el-tag type="warning">鈫� 5.3% 杈�1灏忔椂鍓�</el-tag></div> -->
</el-card>
</el-col>
<el-col :span="6">
<el-card class="stats-card">
<div class="card-title">浠婃棩浣滀笟瀹屾垚鐜�</div>
- <div class="card-value">93.9%</div>
- <div class="card-change"><el-tag type="success">鈫� 1.8% 杈冩槰鏃�</el-tag></div>
+ <div class="card-value">{{ bigscreendata.dailyCompletionRate ? `${bigscreendata.dailyCompletionRate}%` : '0%' }}</div>
+ <!-- <div class="card-change"><el-tag type="success">鈫� 1.8% 杈冩槰鏃�</el-tag></div> -->
</el-card>
</el-col>
<el-col :span="6">
<el-card class="stats-card">
<div class="card-title">鏈鐞嗗紓甯�</div>
- <div class="card-value">7</div>
- <div class="card-change"><el-tag type="danger">鈫� 1 杈�30鍒嗛挓鍓�</el-tag></div>
+ <div class="card-value">{{ bigscreendata.unhandledExceptionCount || 0 }}</div>
+ <!-- <div class="card-change"><el-tag type="danger">鈫� 1 杈�30鍒嗛挓鍓�</el-tag></div> -->
</el-card>
</el-col>
</el-row>
@@ -49,18 +49,18 @@
<el-row :gutter="20" class="chart-row">
<el-col :span="12">
<el-card class="chart-card">
- <div class="chart-title">搴撳瓨搴撲綅鍒嗗竷锛堝浘鍍忓寲鍗犳瘮锛�<el-button type="text" class="view-btn">鍒囨崲瑙嗗浘</el-button></div>
+ <div class="chart-title">搴撳瓨搴撲綅鍒嗗竷锛堝浘鍍忓寲鍗犳瘮锛�</div>
<div ref="inventoryPieRef" class="chart-container"></div>
</el-card>
</el-col>
<el-col :span="12">
<el-card class="chart-card">
<div class="chart-title">杩�7鏃ュ嚭鍏ュ簱瓒嬪娍锛堝浘鍍忓寲璧板娍锛�
- <el-button-group class="btn-group">
+ <!-- <el-button-group class="btn-group">
<el-button type="primary" size="small">鍏ㄩ儴</el-button>
<el-button type="default" size="small">鍏ュ簱</el-button>
<el-button type="default" size="small">鍑哄簱</el-button>
- </el-button-group>
+ </el-button-group> -->
</div>
<div ref="stockTrendRef" class="chart-container"></div>
</el-card>
@@ -69,19 +69,13 @@
<!-- 鍥捐〃鍖哄煙锛堢浜岃锛� -->
<el-row :gutter="20" class="chart-row">
- <el-col :span="8">
+ <el-col :span="12">
<el-card class="chart-card">
<div class="chart-title">搴撲綅鍒╃敤鐜�</div>
<div ref="locationRateRef" class="chart-container"></div>
</el-card>
</el-col>
- <el-col :span="8">
- <el-card class="chart-card">
- <div class="chart-title">浣滀笟绫诲瀷鍒嗗竷<el-button type="text" class="view-btn">鏌ョ湅璇︽儏</el-button></div>
- <div ref="operationRadarRef" class="chart-container"></div>
- </el-card>
- </el-col>
- <el-col :span="8">
+ <el-col :span="12">
<el-card class="chart-card">
<div class="chart-title">寮傚父绫诲瀷缁熻瓒嬪娍<el-button type="text" class="view-btn">绛涢��</el-button></div>
<div ref="exceptionTrendRef" class="chart-container"></div>
@@ -89,39 +83,9 @@
</el-col>
</el-row>
- <!-- 琛ㄦ牸鍖哄煙 -->
- <el-row :gutter="20" class="table-row">
- <el-col :span="12">
- <el-card class="table-card">
- <div class="table-title">璁㈠崟澶勭悊杩涘害<el-select v-model="orderType" placeholder="閫�璐у叆搴�"
- style="width: 100px; margin-left: 10px;">
- <el-option label="閫�璐у叆搴�" value="return"></el-option>
- <el-option label="鏅�氬嚭搴�" value="normal"></el-option>
- </el-select></div>
- <el-table :data="orderList" border style="width: 100%;">
- <el-table-column prop="orderNo" label="璁㈠崟鍙�" />
- <el-table-column prop="type" label="绫诲瀷" />
- <el-table-column prop="priority" label="浼樺厛绾�">
- <template #default="scope">
- <el-tag
- :type="scope.row.priority === '绱ф��' ? 'danger' : scope.row.priority === '鍔犳��' ? 'warning' : 'success'">
- {{ scope.row.priority }}
- </el-tag>
- </template>
- </el-table-column>
- <el-table-column prop="progress" label="杩涘害">
- <template #default="scope">
- <el-progress :percentage="scope.row.progress" :color="scope.row.progressColor" />
- </template>
- </el-table-column>
- </el-table>
- <div class="table-pagination">
- <el-button type="text">鍔犺浇鏇村璁㈠崟</el-button>
- <el-pagination layout="prev, pager, next, jumper" :current-page="1" :total="50" />
- </div>
- </el-card>
- </el-col>
- <el-col :span="12">
+ <!-- 琛ㄦ牸鍖哄煙 - 缁戝畾鍚庣浣滀笟鏁版嵁 -->
+ <el-row :gutter="20" class="table-row" width="100%">
+ <el-col :span="24">
<el-card class="table-card">
<div class="table-title">瀹炴椂浣滀笟鐩戞帶
<el-button-group class="btn-group">
@@ -131,7 +95,7 @@
<el-button type="default" size="small">鐩樼偣</el-button>
</el-button-group>
</div>
- <el-table :data="operationList" border style="width: 100%;">
+ <el-table :data="bigscreendata.taskList.length ? bigscreendata.taskList : operationList" border style="width: 100%;">
<el-table-column prop="opNo" label="浣滀笟鍗曞彿" />
<el-table-column prop="opType" label="浣滀笟绫诲瀷" />
<el-table-column prop="operator" label="鎿嶄綔浜哄憳" />
@@ -157,18 +121,52 @@
<script setup>
import { ref, onMounted, onUnmounted, nextTick } from 'vue';
import * as echarts from 'echarts';
+import http from "@/api/http.js";
// 鍝嶅簲寮忔暟鎹�
const month = ref('month');
const orderType = ref('return');
-// 妯℃嫙鏁版嵁
-const orderList = ref([
- { orderNo: 'OD20251224001', type: '鏅�氬嚭搴�', priority: '绱ф��', progress: 60, progressColor: '#ff4d4f' },
- { orderNo: 'OD20251224002', type: '閫�璐у叆搴�', priority: '鏅��', progress: 80, progressColor: '#1890ff' },
- { orderNo: 'OD20251224003', type: '璋冩嫧璁㈠崟', priority: '鍔犳��', progress: 40, progressColor: '#faad14' },
- { orderNo: 'OD20251224004', type: '鏅�氬嚭搴�', priority: '甯歌', progress: 100, progressColor: '#52c41a' }
-]);
+// 鍚庣杩斿洖鏁版嵁锛堝搷搴斿紡锛�
+const bigscreendata = ref({
+ totalStockQuantity: 0,
+ unOutBoundOrderCount: 0,
+ dailyCompletionRate: 0,
+ unhandledExceptionCount: 0,
+ locationUtilizationRate: 0,
+ dailyInOutBoundList: [],
+ taskList: [],
+ inventoryLocationDist: [], // 搴撳瓨搴撲綅鍒嗗竷鏁版嵁
+ exceptionTypeTrend: [] // 寮傚父绫诲瀷瓒嬪娍鏁版嵁
+});
+
+// 鏁板瓧鏍煎紡鍖栵紙鍗冨垎浣嶅垎闅旓級
+const formatNumber = (num) => {
+ if (!num) return '0';
+ return num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',');
+};
+
+// 鑾峰彇鍚庣澶у睆鏁版嵁
+const fetchBigGreenData = async () => {
+ try {
+ // 淇锛氫唬鐞嗗凡閰嶇疆锛岀Щ闄ゅ浣欑殑/api鍓嶇紑
+ const res = await http.get('/api/BigScreen/GetBigGreenData');
+ console.log('澶у睆鏁版嵁', res);
+ // 璧嬪�煎搷搴斿紡鏁版嵁锛堝吋瀹瑰悗绔粺涓�杩斿洖鏍煎紡锛�
+ bigscreendata.value = res.data || res;
+ // 鏁版嵁鏇存柊鍚庡埛鏂板浘琛�
+ nextTick(() => {
+ refreshCharts();
+ });
+ } catch (error) {
+ console.error('鑾峰彇澶у睆鏁版嵁澶辫触锛�', error);
+ ElMessage.error('鏁版嵁鑾峰彇澶辫触锛岃妫�鏌ュ悗绔帴鍙ｆ槸鍚︽甯�'); // 鏇挎崲涓篍lement Plus娑堟伅鎻愮ず
+ }
+};
+
+console.log('澶у睆鏁版嵁111', bigscreendata.value);
+
+// 澶囩敤妯℃嫙鏁版嵁
const operationList = ref([
{ opNo: 'JW251224001', opType: '鍏ュ簱', operator: '寮犱笁', startTime: '15:30:22', status: '澶勭悊涓�' },
{ opNo: 'CK251224002', opType: '鍑哄簱', operator: '鏉庡洓', startTime: '15:25:10', status: '宸插畬鎴�' },
@@ -176,29 +174,38 @@
{ opNo: 'SC251224005', opType: '涓婃灦', operator: '瀛欎竷', startTime: '15:10:18', status: '寮傚父' }
]);
-// 鍥捐〃瀹瑰櫒
+// 鍥捐〃瀹瑰櫒Ref
const inventoryPieRef = ref(null);
const stockTrendRef = ref(null);
const locationRateRef = ref(null);
-const operationRadarRef = ref(null);
const exceptionTrendRef = ref(null);
-// 鍥捐〃瀹炰緥
+// 鍥捐〃瀹炰緥锛堝叏灞�绠＄悊锛岀敤浜庨攢姣佸拰resize锛�
let inventoryPieChart = null;
let stockTrendChart = null;
let locationRateChart = null;
-let operationRadarChart = null;
let exceptionTrendChart = null;
-// 鍒濆鍖栧簱瀛樺簱浣嶅垎甯冮ゼ鍥�
+// 鍒濆鍖栧簱瀛樺簱浣嶅垎甯冮ゼ鍥撅紙鍏宠仈鍚庣鏁版嵁锛�
const initInventoryPie = () => {
if (!inventoryPieRef.value) return;
+ // 閿�姣佹棫瀹炰緥锛岄槻姝㈠唴瀛樻硠婕�
if (inventoryPieChart) {
inventoryPieChart.dispose();
}
inventoryPieChart = echarts.init(inventoryPieRef.value);
+ // 浼樺厛浣跨敤鍚庣鏁版嵁锛屾棤鏁版嵁鍒欑敤榛樿鍊�
+ const locationData = bigscreendata.value.inventoryLocationDist.length
+ ? bigscreendata.value.inventoryLocationDist
+ : [
+ { value: 48.7, name: '甯告俯鍖篈鍖�', itemStyle: { color: '#5470c6' } },
+ { value: 29.2, name: '鍐疯棌鍖築鍖�', itemStyle: { color: '#91cc75' } },
+ { value: 21.9, name: '淇濈◣鍖篊鍖�', itemStyle: { color: '#fac858' } },
+ { value: 2.2, name: '娈嬫鍝佸尯D鍖�', itemStyle: { color: '#ee6666' } }
+ ];
+
const option = {
tooltip: {
trigger: 'item',
@@ -207,7 +214,7 @@
legend: {
bottom: 0,
left: 'center',
- data: ['甯告俯鍖篈鍖�', '鍐疯棌鍖築鍖�', '淇濈◣鍖篊鍖�', '娈嬫鍝佸尯D鍖�']
+ data: locationData.map(item => item.name)
},
series: [{
name: '搴撳瓨搴撲綅鍒嗗竷',
@@ -234,12 +241,7 @@
labelLine: {
show: false
},
- data: [
- { value: 48.7, name: '甯告俯鍖篈鍖�', itemStyle: { color: '#5470c6' } },
- { value: 29.2, name: '鍐疯棌鍖築鍖�', itemStyle: { color: '#91cc75' } },
- { value: 21.9, name: '淇濈◣鍖篊鍖�', itemStyle: { color: '#fac858' } },
- { value: 2.2, name: '娈嬫鍝佸尯D鍖�', itemStyle: { color: '#ee6666' } }
- ]
+ data: locationData
}]
};
@@ -247,7 +249,7 @@
return inventoryPieChart;
};
-// 鍒濆鍖栬繎7鏃ュ嚭鍏ュ簱瓒嬪娍鍥�
+// 鍒濆鍖栬繎7鏃ュ嚭鍏ュ簱瓒嬪娍鍥撅紙鍏宠仈鍚庣鏁版嵁锛�
const initStockTrend = () => {
if (!stockTrendRef.value) return;
@@ -256,6 +258,19 @@
}
stockTrendChart = echarts.init(stockTrendRef.value);
+ // 浼樺厛浣跨敤鍚庣鏁版嵁
+ const trendData = bigscreendata.value.dailyInOutBoundList.length
+ ? bigscreendata.value.dailyInOutBoundList
+ : [
+ { date: '12-18', inNum: 10, outNum: 16 },
+ { date: '12-19', inNum: 12, outNum: 18 },
+ { date: '12-20', inNum: 10, outNum: 14 },
+ { date: '12-21', inNum: 12, outNum: 18 },
+ { date: '12-22', inNum: 10, outNum: 16 },
+ { date: '12-23', inNum: 12, outNum: 18 },
+ { date: '12-24', inNum: 12, outNum: 20 }
+ ];
+
const option = {
tooltip: {
trigger: 'axis',
@@ -277,7 +292,7 @@
xAxis: {
type: 'category',
boundaryGap: true,
- data: ['12-18', '12-19', '12-20', '12-21', '12-22', '12-23', '12-24']
+ data: trendData.map(item => item.date)
},
yAxis: {
type: 'value',
@@ -289,14 +304,14 @@
name: '鍏ュ簱閲�',
type: 'bar',
barWidth: '30%',
- data: [10, 12, 10, 12, 10, 12, 12],
+ data: trendData.map(item => item.inNum),
itemStyle: { color: '#52c41a' }
},
{
name: '鍑哄簱閲�',
type: 'bar',
barWidth: '30%',
- data: [16, 18, 14, 18, 16, 18, 20],
+ data: trendData.map(item => item.outNum),
itemStyle: { color: '#1890ff' }
}
]
@@ -306,161 +321,76 @@
return stockTrendChart;
};
-// 鍒濆鍖栧簱浣嶅埄鐢ㄧ巼鐜舰鍥�
+// 鍒濆鍖栧簱浣嶅埄鐢ㄧ巼鐜舰鍥撅紙淇锛氱粺涓�瀹炰緥绠＄悊锛屽叧鑱斿悗绔暟鎹級
const initLocationRate = () => {
if (!locationRateRef.value) return;
+ // 閿�姣佹棫瀹炰緥
if (locationRateChart) {
locationRateChart.dispose();
}
locationRateChart = echarts.init(locationRateRef.value);
+ // 浼樺厛浣跨敤鍚庣鏁版嵁锛屾棤鏁版嵁鍒欑敤榛樿鍊�
+ console.log('搴撲綅鍒╃敤鐜囨暟鎹�', bigscreendata.value.locationUtilizationRate);
+ const utilizationRate = bigscreendata.value.locationUtilizationRate || 86.2;
+ const freeRate = 100 - utilizationRate;
+
const option = {
tooltip: {
- formatter: '{a} <br/>{b} : {c}%'
+ trigger: 'item',
+ formatter: '{b}: {c}%'
},
- series: [{
- name: '搴撲綅鍒╃敤鐜�',
- type: 'gauge',
- min: 0,
- max: 100,
- splitNumber: 10,
- radius: '90%',
- center: ['50%', '55%'],
- startAngle: 180,
- endAngle: 0,
- progress: {
- show: true,
- width: 20,
- itemStyle: {
- color: '#1890ff'
+ legend: {
+ bottom: 0,
+ left: 'center',
+ data: ['宸插崰鐢ㄥ簱浣�', '绌洪棽搴撲綅'],
+ textStyle: { fontSize: 12, color: '#666' }
+ },
+ graphic: [
+ {
+ type: 'text',
+ left: 'right',
+ top: '10%',
+ style: {
+ text: `${utilizationRate}%`,
+ fontSize: 24,
+ fontWeight: 'bold',
+ fill: '#333'
}
},
- axisLine: {
- lineStyle: {
- width: 20,
- color: [[1, 'rgba(200,200,200,0.3)']]
+ {
+ type: 'text',
+ left: 'right',
+ top: '25%',
+ style: {
+ text: '搴撲綅鍒╃敤鐜�',
+ fontSize: 14,
+ fill: '#666'
}
- },
- axisTick: {
- distance: -30,
- splitNumber: 5,
- lineStyle: {
- width: 2,
- color: '#999'
- }
- },
- splitLine: {
- distance: -30,
- length: 14,
- lineStyle: {
- width: 3,
- color: '#999'
- }
- },
- axisLabel: {
- distance: -20,
- color: '#999',
- fontSize: 12
- },
- anchor: {
- show: false
- },
- title: {
- show: true,
- offsetCenter: [0, '30%'],
- fontSize: 16,
- fontWeight: 'bold'
- },
- detail: {
- valueAnimation: true,
- formatter: '{value}%',
- fontSize: 20,
- fontWeight: 'bold',
- offsetCenter: [0, '70%']
- },
- data: [{
- value: 86.2,
- name: '搴撲綅鍒╃敤鐜�'
- }]
- }]
+ }
+ ],
+ series: [
+ {
+ type: 'pie',
+ radius: ['50%', '70%'],
+ center: ['40%', '50%'],
+ avoidLabelOverlap: false,
+ label: { show: false },
+ labelLine: { show: false },
+ data: [
+ { value: utilizationRate, name: '宸插崰鐢ㄥ簱浣�', itemStyle: { color: '#1890ff' } },
+ { value: freeRate, name: '绌洪棽搴撲綅', itemStyle: { color: '#e5e9f2' } }
+ ]
+ }
+ ]
};
locationRateChart.setOption(option);
return locationRateChart;
};
-// 鍒濆鍖栦綔涓氱被鍨嬮浄杈惧浘
-const initOperationRadar = () => {
- if (!operationRadarRef.value) return;
-
- if (operationRadarChart) {
- operationRadarChart.dispose();
- }
-
- operationRadarChart = echarts.init(operationRadarRef.value);
- const option = {
- tooltip: {
- trigger: 'item'
- },
- legend: {
- show: false
- },
- radar: {
- indicator: [
- { name: '鍑哄簱浣滀笟', max: 100 },
- { name: '鍏ュ簱浣滀笟', max: 100 },
- { name: '璋冩嫧浣滀笟', max: 100 },
- { name: '鐩樼偣浣滀笟', max: 100 }
- ],
- shape: 'circle',
- splitNumber: 5,
- axisName: {
- color: '#666'
- },
- splitLine: {
- lineStyle: {
- color: 'rgba(0,0,0,0.1)'
- }
- },
- splitArea: {
- show: true,
- areaStyle: {
- color: ['rgba(255,255,255,0.8)', 'rgba(200,200,200,0.2)']
- }
- }
- },
- series: [{
- name: '浣滀笟绫诲瀷鍒嗗竷',
- type: 'radar',
- symbolSize: 8,
- areaStyle: {
- color: 'rgba(24,144,255,0.3)'
- },
- lineStyle: {
- width: 2
- },
- itemStyle: {
- color: '#1890ff'
- },
- data: [{
- value: [45, 30, 15, 10],
- name: '浣滀笟鍗犳瘮',
- label: {
- show: true,
- formatter: function (params) {
- return params.value + '%';
- }
- }
- }]
- }]
- };
-
- operationRadarChart.setOption(option);
- return operationRadarChart;
-};
-
-// 鍒濆鍖栧紓甯歌秼鍔挎姌绾垮浘
+// 鍒濆鍖栧紓甯哥被鍨嬬粺璁¤秼鍔垮浘锛堝叧鑱斿悗绔暟鎹級
const initExceptionTrend = () => {
if (!exceptionTrendRef.value) return;
@@ -469,6 +399,17 @@
}
exceptionTrendChart = echarts.init(exceptionTrendRef.value);
+ // 浼樺厛浣跨敤鍚庣鏁版嵁
+ const exceptionData = bigscreendata.value.exceptionTypeTrend.length
+ ? bigscreendata.value.exceptionTypeTrend
+ : {
+ dates: ['12-18', '12-19', '12-20', '12-21', '12-22', '12-23', '12-24'],
+ stockShort: [10, 11, 9, 12, 10, 13, 12],
+ orderTimeout: [8, 9, 7, 8, 7, 9, 8],
+ locationException: [4, 5, 2, 4, 3, 5, 4],
+ checkDiff: [2, 3, 1, 2, 1, 3, 2]
+ };
+
const option = {
tooltip: {
trigger: 'axis',
@@ -490,7 +431,7 @@
xAxis: {
type: 'category',
boundaryGap: false,
- data: ['12-18', '12-19', '12-20', '12-21', '12-22', '12-23', '12-24']
+ data: exceptionData.dates
},
yAxis: {
type: 'value',
@@ -503,11 +444,9 @@
smooth: true,
symbol: 'circle',
symbolSize: 8,
- data: [10, 11, 9, 12, 10, 13, 12],
+ data: exceptionData.stockShort,
itemStyle: { color: '#ff4d4f' },
- lineStyle: {
- width: 3
- }
+ lineStyle: { width: 3 }
},
{
name: '璁㈠崟瓒呮椂',
@@ -515,11 +454,9 @@
smooth: true,
symbol: 'circle',
symbolSize: 8,
- data: [8, 9, 7, 8, 7, 9, 8],
+ data: exceptionData.orderTimeout,
itemStyle: { color: '#faad14' },
- lineStyle: {
- width: 3
- }
+ lineStyle: { width: 3 }
},
{
name: '搴撲綅寮傚父',
@@ -527,11 +464,9 @@
smooth: true,
symbol: 'circle',
symbolSize: 8,
- data: [4, 5, 2, 4, 3, 5, 4],
+ data: exceptionData.locationException,
itemStyle: { color: '#722ed1' },
- lineStyle: {
- width: 3
- }
+ lineStyle: { width: 3 }
},
{
name: '鐩樼偣宸紓',
@@ -539,11 +474,9 @@
smooth: true,
symbol: 'circle',
symbolSize: 8,
- data: [2, 3, 1, 2, 1, 3, 2],
+ data: exceptionData.checkDiff,
itemStyle: { color: '#13c2c2' },
- lineStyle: {
- width: 3
- }
+ lineStyle: { width: 3 }
}
]
};
@@ -552,13 +485,12 @@
return exceptionTrendChart;
};
-// 鍒锋柊鎵�鏈夊浘琛�
+// 鍒锋柊鎵�鏈夊浘琛紙绉婚櫎鏃犳晥闆疯揪鍥鹃�昏緫锛�
const refreshCharts = () => {
const charts = [
initInventoryPie,
initStockTrend,
initLocationRate,
- initOperationRadar,
initExceptionTrend
];
@@ -570,13 +502,12 @@
});
};
-// 鐩戝惉绐楀彛澶у皬鍙樺寲
+// 绐楀彛澶у皬鍙樺寲鐩戝惉
const handleResize = () => {
const charts = [
inventoryPieChart,
stockTrendChart,
locationRateChart,
- operationRadarChart,
exceptionTrendChart
];
@@ -587,26 +518,26 @@
});
};
-// 鎸傝浇鍚庡垵濮嬪寲鍥捐〃
+// 缁勪欢鎸傝浇鏃讹細鍏堣姹傛暟鎹紝鍐嶅垵濮嬪寲鍥捐〃
onMounted(() => {
+ // 鍏堣幏鍙栧悗绔暟鎹�
+ fetchBigGreenData();
+ // 鍒濆鍖栧浘琛紙纭繚DOM宸叉覆鏌擄級
nextTick(() => {
initInventoryPie();
initStockTrend();
initLocationRate();
- initOperationRadar();
initExceptionTrend();
-
window.addEventListener('resize', handleResize);
});
});
-// 缁勪欢鍗歌浇鏃舵竻鐞�
+// 缁勪欢鍗歌浇鏃讹細閿�姣佸浘琛ㄥ疄渚嬶紝绉婚櫎浜嬩欢鐩戝惉
onUnmounted(() => {
const charts = [
inventoryPieChart,
stockTrendChart,
locationRateChart,
- operationRadarChart,
exceptionTrendChart
];
@@ -677,7 +608,7 @@
}
.chart-card {
- height: 320px;
+ height: 350px;
padding: 15px;
display: flex;
flex-direction: column;
@@ -686,7 +617,7 @@
.chart-container {
width: 100%;
height: 100%;
- min-height: 250px;
+ min-height: 240px;
flex: 1;
}
--
Gitblit v1.9.3