From 4c03db2f0d6b4320e670b770f4c1e252809303a3 Mon Sep 17 00:00:00 2001
From: fuliqi <fuliqi@qq.com>
Date: 星期三, 18 九月 2024 01:00:51 +0800
Subject: [PATCH] 大屏数据对接2

---
 src/api/newpage.js                         |    8 +
 src/views/screen/components/lineChart.vue  |  103 +++++++++-----------
 src/views/screen/components/subheading.vue |   12 ++
 src/views/login.vue                        |    2 
 src/views/screen/components/map.vue        |   96 ++++++++++---------
 src/views/screen/index.vue                 |   60 +++++++++++
 6 files changed, 176 insertions(+), 105 deletions(-)

diff --git a/src/api/newpage.js b/src/api/newpage.js
index 37db17d..732bafd 100644
--- a/src/api/newpage.js
+++ b/src/api/newpage.js
@@ -63,3 +63,11 @@
     method: "get",
   });
 }
+
+// 鑰冩牳绉垎鏁版嵁
+export function checkScore(dataScope, deptId) {
+  return request({
+    url: "/dashboard/check/score?dataScope=" + dataScope + "&deptId=" + deptId,
+    method: "get",
+  });
+}
diff --git a/src/views/login.vue b/src/views/login.vue
index 38204ec..82cadab 100644
--- a/src/views/login.vue
+++ b/src/views/login.vue
@@ -191,7 +191,7 @@
               if (this.loginInfo.firstLogin == 1) {
                 // this.$router.push({ path: "/" }).catch(() => { });
                 // return;
-                if (this.roles .includes("admin") || this.roles .includes("city_leader") || this.roles .includes("county_leader")) {
+                if (this.roles .includes("admin") || this.roles .includes("city_leader")) {
                   this.$router.push({
                     path: '/screen'
                   })
diff --git a/src/views/screen/components/lineChart.vue b/src/views/screen/components/lineChart.vue
index f2335f6..ea1bd1f 100644
--- a/src/views/screen/components/lineChart.vue
+++ b/src/views/screen/components/lineChart.vue
@@ -13,21 +13,26 @@
       default: null,
     },
   },
-  data () {
+  data() {
     return {
-      dataList: {
-        name: [],
-        data1: [],
-        data2: [],
-      },
-      // 閰嶇疆
-      option: {
+      name: [],
+      data1: [],
+      data2: [],
+
+      myDrawLine: null
+    }
+  },
+
+  methods: {
+    initDrawLine() {
+      const that = this
+      let option = {
         grid: {
           width: '100%'
         },
         tooltip: {
           trigger: 'item',
-          formatter: function (params) {
+              formatter: function (params) {
             let str = '<div><p>' + params.name + '</p></div>'
             str += params.marker + params.seriesName + '锛�' + params.data
             return str
@@ -40,9 +45,9 @@
         // 鍥句緥缁勪欢
         legend: {
           type: 'plain',
-          top: 20,
-          data: ['宸插鐞嗗伐鍗曟暟', '鏈鐞嗗伐鍗曟暟'],
-          textStyle: {
+              top: 20,
+              data: ['宸插鐞嗗伐鍗曟暟', '鏈鐞嗗伐鍗曟暟'],
+              textStyle: {
             color: '#A0AEC0'
           }
         },
@@ -50,41 +55,41 @@
         // X杞撮厤缃�
         xAxis: {
           type: 'category',
-          boundaryGap: false,
-          axisTick: {
+              boundaryGap: false,
+              axisTick: {
             show: true
           },
           axisLine: {
             lineStyle: {
               color: '#A0AEC0',
-              type: 'solid'
+                  type: 'solid'
             }
           },
           axisLabel: {
             color: '#A0AEC0',
-            fontSize: 12,
-            margin: 20,
-            rotate: 30
+                fontSize: 12,
+                margin: 20,
+                rotate: 30
           },
-          data: this.dataList.name,
+          data: that.name,
         },
         // Y杞撮厤缃�
         yAxis: {
           type: 'value',
-          splitLine: {
+              splitLine: {
             lineStyle: {
               color: '#A0AEC0',
-              type: 'dashed'
+                  type: 'dashed'
             }
           },
           splitNumber: 5,
-          axisLine: {
+              axisLine: {
             show: false
           },
           axisLabel: {
             color: '#A0AEC0',
-            fontSize: 12,
-            margin: 15
+                fontSize: 12,
+                margin: 15
           }
         },
         // 绯诲垪鍒楄〃锛堝涓姌绾垮浘锛�
@@ -92,13 +97,13 @@
           {
             name: '宸插鐞嗗伐鍗曟暟',
             type: 'line',
-            data: this.dataList.data1,
+            data: that.data1,
             smooth: true,
             areaStyle: {
               color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
-                { offset: 0, color: '#00a2ff' },
-                { offset: 0.5, color: 'rgba(0,162,255,0.1)' },
-                { offset: 1, color: 'rgba(0,162,255,0.1)' }
+                {offset: 0, color: '#00a2ff'},
+                {offset: 0.5, color: 'rgba(0,162,255,0.1)'},
+                {offset: 1, color: 'rgba(0,162,255,0.1)'}
               ])
             },
 
@@ -113,13 +118,13 @@
           {
             name: '鏈鐞嗗伐鍗曟暟',
             type: 'line',
-            data: this.dataList.data2,
+            data: that.data2,
             smooth: true,
             areaStyle: {
               color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
-                { offset: 0, color: '#e4b54f' },
-                { offset: 0.5, color: 'rgba(228,181,79,0.1)' },
-                { offset: 1, color: 'rgba(228,181,79,0.1)' }
+                {offset: 0, color: '#e4b54f'},
+                {offset: 0.5, color: 'rgba(228,181,79,0.1)'},
+                {offset: 1, color: 'rgba(228,181,79,0.1)'}
               ])
             },
 
@@ -132,17 +137,9 @@
             }
           }
         ]
-      },
-
-      myDrawLine: null
-    }
-  },
-
-  methods: {
-    initDrawLine () {
-      const that = this
+      }
       that.myDrawLine = this.$echarts.init(this.$refs.lineChart)
-      that.myDrawLine.setOption(that.option)
+      that.myDrawLine.setOption(option)
       window.addEventListener('resize', function () {
         that.myDrawLine.resize()
       })
@@ -152,26 +149,20 @@
   watch: {
     workOrderRegion: {
       handler(newV, oldV) {
-        let name = [];
-        let data1 = [];
-        let data2 =  [];
-        this.workOrderRegion.map((item) => {
-          name.push(item.area);
-          data1.push(item.doneNum);
-          data2.push(item.todoNum);
+        this.name =[]
+        this.data1=[]
+        this.data2=[]
+        newV.map((item) => {
+          this.name.push(item.area);
+          this.data1.push(item.doneNum);
+          this.data2.push(item.todoNum);
         })
-        console.log(this, "ddddd")
-        console.log(this.dataList, "ddddd")
-        this.dataList.name = name;
-        console.log(name)
-        this.dataList.data1 = data1;
-        this.dataList.data2 = data2;
         this.initDrawLine()
       },
       deep: true
     }
   },
-  mounted () {
+  mounted() {
     this.$nextTick(() => {
       setTimeout(() => {
         this.initDrawLine()
diff --git a/src/views/screen/components/map.vue b/src/views/screen/components/map.vue
index 9766007..5e29c18 100644
--- a/src/views/screen/components/map.vue
+++ b/src/views/screen/components/map.vue
@@ -12,52 +12,58 @@
 import ZGSJson from '@/assets/map/zigong.json' // JOSN鍦板浘鏂囦欢
 export default {
   name: 'mapApp',
+  props: {
+    geoCoordinates: {
+      type: Object,
+      default: {},
+    },
+  },
   data () {
     return {
-      geoCoordinates: {
-        鑷祦浜曞尯: [
-          {
-            value: 12312,
-            name: 'XXX'
-          }
-        ],
-        楂樻柊鍖�: [
-          {
-            value: 12312,
-            name: 'XXX'
-          }
-        ],
-        澶у畨鍖�: [
-          {
-            value: 12312,
-            name: 'XXX'
-          }
-        ],
-        娌挎哗鍖�: [
-          {
-            value: 12312,
-            name: 'XXX'
-          }
-        ],
-        璐′簳鍖�: [
-          {
-            value: 12312,
-            name: 'XXX'
-          }
-        ],
-        鑽e幙: [
-          {
-            value: 12312,
-            name: 'XXX'
-          }
-        ],
-        瀵岄『鍘�: [
-          {
-            value: 12312,
-            name: 'XXX'
-          }
-        ]
-      },
+      // geoCoordinates: {
+      //   鑷祦浜曞尯: [
+      //     {
+      //       value: 12312,
+      //       name: '寰楀垎'
+      //     }
+      //   ],
+      //   楂樻柊鍖�: [
+      //     {
+      //       value: 12312,
+      //       name: '寰楀垎'
+      //     }
+      //   ],
+      //   澶у畨鍖�: [
+      //     {
+      //       value: 12312,
+      //       name: '寰楀垎'
+      //     }
+      //   ],
+      //   娌挎哗鍖�: [
+      //     {
+      //       value: 12312,
+      //       name: '寰楀垎'
+      //     }
+      //   ],
+      //   璐′簳鍖�: [
+      //     {
+      //       value: 12312,
+      //       name: '寰楀垎'
+      //     }
+      //   ],
+      //   鑽e幙: [
+      //     {
+      //       value: 12312,
+      //       name: '寰楀垎'
+      //     }
+      //   ],
+      //   瀵岄『鍘�: [
+      //     {
+      //       value: 12312,
+      //       name: '寰楀垎'
+      //     }
+      //   ]
+      // },
 
       // 鍦板浘閰嶇疆
       // option: {
@@ -357,7 +363,7 @@
       that.map.setOption(option)
       that.map.on('click', function (params) {
         if (params.seriesType === 'map3D') {
-          console.log('Clicked adcode:', params)
+          that.$emit('clickMap', params.name);
         }
       })
     },
diff --git a/src/views/screen/components/subheading.vue b/src/views/screen/components/subheading.vue
index 3af62bf..d387fd1 100644
--- a/src/views/screen/components/subheading.vue
+++ b/src/views/screen/components/subheading.vue
@@ -107,6 +107,18 @@
         this.isData.color
       )
     })
+  },
+  watch: {
+    isData(){
+      this.getW()
+      this.$nextTick(() => {
+        this.initChart(
+          this.isData.value1,
+          this.isData.value2,
+          this.isData.color
+        )
+      })
+    }
   }
 }
 </script>
diff --git a/src/views/screen/index.vue b/src/views/screen/index.vue
index de0e889..a36e321 100644
--- a/src/views/screen/index.vue
+++ b/src/views/screen/index.vue
@@ -36,7 +36,7 @@
             <div class="statistics-container">
               <div class="DrawLine-content">
                 <!-- <div style="width: 100%; height: 100%" ref="myDrawLine"></div> -->
-                <lineChart :workOrderRegion = workOrderRegion></lineChart>
+                <lineChart :workOrderRegion=workOrderRegion></lineChart>
               </div>
             </div>
           </div>
@@ -44,7 +44,7 @@
       </div>
 
       <div class="map-container" ref="isMap">
-        <mapApp></mapApp>
+        <mapApp @clickMap="getDeptId" :geoCoordinates=scoreData></mapApp>
         <div class="btn-container">
           <img src="@/assets/images/btn-bg.png" class="bg-img"/>
           <div class="btn-list" v-model="activerBtnType">
@@ -192,7 +192,8 @@
   getNormalRate,
   checkFace,
   checkCar,
-  checkVideo
+  checkVideo,
+  checkScore
 } from "@/api/newpage";
 
 export default {
@@ -207,6 +208,50 @@
       faceList: [],
       workOrderData: [],
       workOrderRegion: [],
+      scoreData: {
+          鑷祦浜曞尯: [
+            {
+              value: 0,
+              name: '寰楀垎'
+            }
+          ],
+          楂樻柊鍖�: [
+            {
+              value: 0,
+              name: '寰楀垎'
+            }
+          ],
+          澶у畨鍖�: [
+            {
+              value: 0,
+              name: '寰楀垎'
+            }
+          ],
+          娌挎哗鍖�: [
+            {
+              value: 0,
+              name: '寰楀垎'
+            }
+          ],
+          璐′簳鍖�: [
+            {
+              value: 0,
+              name: '寰楀垎'
+            }
+          ],
+          鑽e幙: [
+            {
+              value: 0,
+              name: '寰楀垎'
+            }
+          ],
+          瀵岄『鍘�: [
+            {
+              value: 0,
+              name: '寰楀垎'
+            }
+          ]
+        },
       // 璁惧鏁版嵁
       facilityData: {
         video: [],
@@ -308,6 +353,14 @@
         })
         .catch((err) => {
         });
+      checkScore(this.activerBtnType, this.deptId)
+        .then((res) => {
+          if(res.data && Object.keys(res.data).length > 0){
+            this.scoreData = res.data;
+          }
+        })
+        .catch((err) => {
+        });
     },
     returnPath() {
       this.$router.push("/index");
@@ -340,6 +393,7 @@
       item2.color = '#ff7b72'
       item2.title = '鏈鐞嗗伐鍗曟暟'
       this.statistics.push(item2)
+      console.log( this.statistics)
     },
 
     videoData() {

--
Gitblit v1.8.0