From f68fa3bc5fc0a286c88d82ee6eb95e8ad6be0d16 Mon Sep 17 00:00:00 2001
From: qinxianzhangyao <11053546+qinxianzhangyao@user.noreply.gitee.com>
Date: 星期四, 27 六月 2024 15:21:55 +0800
Subject: [PATCH] qxtj
---
src/views/index.vue | 246 ++++++++++++++++++++++++++++--------------------
1 files changed, 143 insertions(+), 103 deletions(-)
diff --git a/src/views/index.vue b/src/views/index.vue
index a59b0e9..a31432c 100644
--- a/src/views/index.vue
+++ b/src/views/index.vue
@@ -72,10 +72,18 @@
created() {
this.getList();
+
},
+ watch: {
+ $route(to, from) {
+ window.location.reload(); //鐩戞祴鍒拌矾鐢卞彂鐢熻烦杞椂鍒锋柊涓�娆￠〉闈�
+ // this.$router.go(0);
+ },
+ },
+
methods: {
-
+
getList() {
this.loading = true;
// 鏌ヨ浠婃棩鐧昏
@@ -179,119 +187,149 @@
// 楗肩姸鍥�
getPieChart().then((response) => {
- this.PieChart = response.data.tjdj
- this.PieChart.forEach(item => {
- item.value = item.count
- })
- this.PieChart.reverse()
- this.PieChart.push(this.PieChart[0])
- this.PieChart.splice(0, 1)
- this.PieChart2 = response.data.tjyc
- if (this.PieChart2 == 0) {
- this.PieChart2 = [
-
-
-
- {
- "name": "40-60宀�",
- "count": 1,
- "value": 1
+ if (response.data) {
+
+ if(response.data.tjdj == 0){
+ this.PieChart = []
+ this.PieChart = [
+ {
+ "name": "浣撴鐧昏浜烘暟鍒嗗竷",
+ "count": 1,
+ "value": 10
+ },
+
+ ]
+ }else if (response.data.tjdj.length === 0) {
+
+ this.PieChart = []
+ this.PieChart = [
+ {
+ "name": "浣撴鐧昏浜烘暟鍒嗗竷",
+ "count": 1,
+ "value": 10
+ },
+
+ ]
+ } else {
+ this.PieChart = response.data.tjdj
+ this.PieChart.forEach(item => {
+ item.value = item.count
+ })
+ this.PieChart.reverse()
+ this.PieChart.push(this.PieChart[0])
+ this.PieChart.splice(0, 1)
+
+ }
+
+ let myChart2 = this.$echarts.init(document.getElementById('main2'));
+ myChart2.setOption({
+ title: {
+ text: '浣撴鐧昏浜烘暟鍒嗗竷',
+ top: '5'
+
},
- {
- "name": "16-40宀�",
- "count": 1,
- "value": 1
+
+ tooltip: {
+ trigger: 'item'
},
- {
- "name": "3-16宀�",
- "count": 1,
- "value": 1
+ legend: {
+ top: '80%',
+ left: 'center'
},
- {
- "name": "0-3宀�",
- "count": 1,
- "value": 1
+ series: [
+ {
+ // name: 'Access From',
+ type: 'pie',
+ radius: ['16%', '54%'],
+ center: ["50%", "43%"],
+ avoidLabelOveralap:false,
+ startAngle:180,
+ minAngle:10,
+ data: this.PieChart,
+ emphasis: {
+ itemStyle: {
+ shadowBlur: 10,
+ shadowOffsetX: 0,
+ shadowColor: 'rgba(0, 0, 0, 0.5)'
+ }
+ }
+ }]
+ })
+
+ if(response.data.tjyc == 0){
+ this.PieChart2 = []
+ this.PieChart2 = [
+ {
+ "name": "浣撴缁撴灉寮傚父浜烘暟鍒嗗竷",
+ "count": 1,
+ "value": 10
+ },
+
+ ]
+ }else if (response.data.tjyc.length === 0) {
+ this.PieChart2 = []
+ this.PieChart2 = [
+ {
+ "name": "浣撴缁撴灉寮傚父浜烘暟鍒嗗竷",
+ "count": 1,
+ "value": 10
+ },
+
+ ]
+ } else {
+ this.PieChart2 = response.data.tjyc
+ this.PieChart2.reverse()
+ this.PieChart2.push(this.PieChart2[0])
+ this.PieChart2.splice(0, 1)
+ this.PieChart2.forEach(item => {
+ item.value = item.count
+ })
+ // this.TobeToday = response
+ }
+ let myChart3 = this.$echarts.init(document.getElementById('main3'));
+
+ myChart3.setOption({
+ title: {
+ text: '浣撴缁撴灉寮傚父浜烘暟鍒嗗竷',
+ top: '5'
+
},
- {
- "name": "60宀佷互涓�",
- "count": 1,
- "value": 1
- }
- ]
+ tooltip: {
+ trigger: 'item'
+ },
+ legend: {
+ top: '80%',
+ left: 'center'
+ },
+ series: [
+ {
+ // name: 'Access From',
+ type: 'pie',
+ radius: ['16%', '54%'],
+ center: ["50%", "43%"],
+ avoidLabelOveralap:false,
+ startAngle:180,
+ minAngle:10,
+ data: this.PieChart2,
+ emphasis: {
+ itemStyle: {
+ shadowBlur: 10,
+ shadowOffsetX: 0,
+ shadowColor: 'rgba(0, 0, 0, 0.5)'
+ }
+ }
+ }]
+ })
}
- this.PieChart2.reverse()
- this.PieChart2.push(this.PieChart2[0])
- this.PieChart2.splice(0, 1)
- this.PieChart2.forEach(item => {
- item.value = item.count
- })
- // this.TobeToday = response
- let myChart2 = this.$echarts.init(document.getElementById('main2'));
- let myChart3 = this.$echarts.init(document.getElementById('main3'));
- myChart2.setOption({
- title: {
- text: '浣撴鐧昏浜烘暟鍒嗗竷',
- top: '5'
- },
- tooltip: {
- trigger: 'item'
- },
- legend: {
- top: '78%',
- left: 'center'
- },
- series: [
- {
- // name: 'Access From',
- type: 'pie',
- radius: ['16%', '54%'],
- center: ["50%", "43%"],
- data: this.PieChart,
- emphasis: {
- itemStyle: {
- shadowBlur: 10,
- shadowOffsetX: 0,
- shadowColor: 'rgba(0, 0, 0, 0.5)'
- }
- }
- }]
- })
- myChart3.setOption({
- title: {
- text: '浣撴缁撴灉寮傚父浜烘暟鍒嗗竷',
- top: '5'
- },
- tooltip: {
- trigger: 'item'
- },
- legend: {
- top: '78%',
- left: 'center'
- },
- series: [
- {
- // name: 'Access From',
- type: 'pie',
- radius: ['16%', '54%'],
- center: ["50%", "43%"],
- data: this.PieChart2,
- emphasis: {
- itemStyle: {
- shadowBlur: 10,
- shadowOffsetX: 0,
- shadowColor: 'rgba(0, 0, 0, 0.5)'
- }
- }
- }]
- })
window.onresize = function () {
myChart2.resize()
myChart3.resize()
}
this.loading = false;
});
+
}
},
@@ -329,7 +367,7 @@
}
.img {
- width: 150px;
+ width: 60%;
height: 100%;
display: flex;
justify-content: center;
@@ -354,7 +392,8 @@
}
.data-view {
- margin: 5px 15px;
+ margin: 0 15px;
+ height: 323px !important
}
#main {
@@ -363,6 +402,7 @@
.view {
margin: 0px 15px;
+ padding-top: 15px;
height: 350px;
display: flex;
}
--
Gitblit v1.8.0