From fd067b408ae97f16c13b0e25b9c870d23f4d0ba3 Mon Sep 17 00:00:00 2001
From: liuying <1427574514@qq.com>
Date: 周二, 10 12月 2024 22:52:08 +0800
Subject: [PATCH] 首页

---
 LA24030_LuLiPackageLine_Web/src/views/home/index.vue |  139 ++++++++++++++++++++++++++++++++--------------
 1 files changed, 97 insertions(+), 42 deletions(-)

diff --git a/LA24030_LuLiPackageLine_Web/src/views/home/index.vue b/LA24030_LuLiPackageLine_Web/src/views/home/index.vue
index 0571968..fc304d0 100644
--- a/LA24030_LuLiPackageLine_Web/src/views/home/index.vue
+++ b/LA24030_LuLiPackageLine_Web/src/views/home/index.vue
@@ -86,15 +86,38 @@
 import { wmsStockPassMap, wmsHomePageQuery, wmsHomePlaceQuery, wmsTransitionDiagramQuery } from '/@/api/main/inventoryWarning/inventoryWarning';
 import type { TabsPaneContext } from 'element-plus';
 import { useRoute, useRouter } from 'vue-router';
+import { getStorageView } from '/@/api/main/ReportCenter/storageView';
 const router = useRouter();
 // 鎺ュ彛鏁版嵁
 const loadingwms = ref(false);
 const pieChartRef = ref(null);
 let myChart = null;
+let countList = ref([
+	{
+		type: 0,
+		name: '鎬诲簱浣�',
+		value: 0,
+	},
+	{
+		type: 1,
+		name: '鏈夎揣搴撲綅',
+		value: 0,
+	},
+	{
+		type: 2,
+		name: '鏃犺揣搴撲綅',
+		value: 0,
+	},
+	{
+		type: 3,
+		name: '閿佸畾搴撲綅',
+		value: 0,
+	},
+]);
 const optionPie = {
 	title: {
-		text: '缂撳瓨宀涚粺璁�',
-		left: 'center',
+		text: '缂撳瓨宀涘簱瀛�',
+		// left: 'center',
 		textStyle: {
 			color: '#333',
 		},
@@ -104,19 +127,20 @@
 	},
 	legend: {
 		orient: 'vertical',
-		left: 'left',
+		left: 'right',
 	},
 	series: [
 		{
 			name: '搴撲綅鐘舵��',
 			type: 'pie',
-			radius: ['50%', '70%'],
-			data: [
-				{ name: '鎬诲簱浣�360', value: 120 },
-				{ name: '鏈夎揣搴撲綅', value: 90 },
-				{ name: '鏃犺揣搴撲綅', value: 60 },
-				{ name: '閿佸畾搴撲綅', value: 30 },
-			],
+			radius: ['35%', '55%'],
+			data: [],
+			// data: [
+			// 	{ name: '鎬诲簱浣�360', value: 120 },
+			// 	{ name: '鏈夎揣搴撲綅', value: 90 },
+			// 	{ name: '鏃犺揣搴撲綅', value: 60 },
+			// 	{ name: '閿佸畾搴撲綅', value: 30 },
+			// ],
 			emphasis: {
 				itemStyle: {
 					shadowBlur: 10,
@@ -125,22 +149,53 @@
 				},
 			},
 			label: {
-				formatter: '{b}: {c} ({d}%)',
+				// formatter: '{b}: {c} ({d}%)',
+				formatter: '{b}: {c}',
 			},
 		},
 	],
 };
 
 onMounted(() => {
-	nextTick(() => {
+	nextTick(async () => {
+
+
+		var res = await getStorageView();
+		debugger
+		if (res.data.code == 200) {
+			const { data } = res;
+			const result = data.result;
+			// 缁熻
+			var hasMaterialCount = result.filter((item: any) => item.stockStatus == 1).length || 0;
+			var noMaterialCount = result.length - hasMaterialCount;
+			countList.value = [
+				{
+					type: '',
+					name: '鎬诲簱浣�',
+					value: result.length || 0,
+				},
+				{
+					type: 1,
+					name: '鏈夎揣搴撲綅',
+					value: hasMaterialCount || 0,
+				},
+				{
+					type: 18,
+					name: '鏃犺揣搴撲綅',
+					value: noMaterialCount || 0,
+				},
+				{
+					type: 2,
+					name: '閿佸畾搴撲綅',
+					value: result.filter((item: any) => item.stockStatus == 2).length || 0,
+				},
+			];
+		optionPie.series[0].data = countList.value;
 		myChart = echarts.init(document.getElementById('homePieChart') as HTMLDivElement);
-		const data = [
-			{ name: '鎬诲簱浣�360', value: 120 },
-			{ name: '鏈夎揣搴撲綅', value: 90 },
-			{ name: '鏃犺揣搴撲綅', value: 60 },
-			{ name: '閿佸畾搴撲綅', value: 30 },
-		];
 		myChart.setOption(optionPie);
+
+	
+		}
 	});
 });
 
@@ -678,30 +733,30 @@
 		initEchartsResizeFun();
 	}
 );
-// 鐩戝惉 pinia 涓槸鍚﹀紑鍚繁鑹蹭富棰�
-watch(
-	() => themeConfig.value.isIsDark,
-	(isIsDark) => {
-		nextTick(() => {
-			state.charts.theme = isIsDark ? 'dark' : '';
-			state.charts.bgColor = isIsDark ? 'transparent' : '';
-			state.charts.color = isIsDark ? '#dadada' : '#303133';
-			setTimeout(() => {
-				initLineChart(null, null, null);
-			}, 500);
-			setTimeout(() => {
-				initPieChart(null);
-			}, 700);
-			// setTimeout(() => {
-			// 	initBarChart(null,null,null,null);
-			// }, 1000);
-		});
-	},
-	{
-		deep: true,
-		immediate: true,
-	}
-);
+// // 鐩戝惉 pinia 涓槸鍚﹀紑鍚繁鑹蹭富棰�
+// watch(
+// 	() => themeConfig.value.isIsDark,
+// 	(isIsDark) => {
+// 		nextTick(() => {
+// 			state.charts.theme = isIsDark ? 'dark' : '';
+// 			state.charts.bgColor = isIsDark ? 'transparent' : '';
+// 			state.charts.color = isIsDark ? '#dadada' : '#303133';
+// 			setTimeout(() => {
+// 				initLineChart(null, null, null);
+// 			}, 500);
+// 			setTimeout(() => {
+// 				initPieChart(null);
+// 			}, 700);
+// 			// setTimeout(() => {
+// 			// 	initBarChart(null,null,null,null);
+// 			// }, 1000);
+// 		});
+// 	},
+// 	{
+// 		deep: true,
+// 		immediate: true,
+// 	}
+// );
 </script>
 
 <style scoped lang="scss">

--
Gitblit v1.9.3