From 5ee4df018cc2eae0f867dcc7b5af2a2e2bed2a1c Mon Sep 17 00:00:00 2001
From: GGJ <357021191@qq.com>
Date: Sat, 1 Jun 2024 14:49:30 +0800
Subject: [PATCH] =?UTF-8?q?=E5=90=8C=E6=AD=A5=E7=8E=B0=E5=9C=BA=E4=BB=A3?=
 =?UTF-8?q?=E7=A0=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../panorama/components/map.vue               | 40 ++++++++---
 .../panorama/components/mapR.vue              | 68 +++++++++++++++++--
 2 files changed, 91 insertions(+), 17 deletions(-)

diff --git a/src/views/pqs/qualityInspeection/panorama/components/map.vue b/src/views/pqs/qualityInspeection/panorama/components/map.vue
index f45da682..2172c349 100644
--- a/src/views/pqs/qualityInspeection/panorama/components/map.vue
+++ b/src/views/pqs/qualityInspeection/panorama/components/map.vue
@@ -129,7 +129,7 @@ import { getAssessOverview } from '@/api/device-boot/panorama'
 
 narimap.Require(['PSRMap', 'Thematic', 'Components.Query', 'Components.RegionSelector'], () => {
     if (narimap.Config.examples.notlogin) {
-        initMap(narimap.Config.styles.sjDark)
+        initMap(narimap.Config.styles.sjRaster)
     } else {
         //电网GIS地图服务登录
         narimap.SGAuth.login()
@@ -139,13 +139,17 @@ narimap.Require(['PSRMap', 'Thematic', 'Components.Query', 'Components.RegionSel
                 } else {
                     console.log('登录失败', result)
                 }
+
                 //默认打开电网GIS影像图
-                initMap(narimap.Config.styles.sjDark)
+                initMap(narimap.Config.styles.sjRaster)
             })
             .catch((err: any) => {
                 console.log('错误', err)
             })
     }
+    setTimeout(() => {
+        console.log('🚀 ~ .then ~ narimap.Config.style:', narimap.Config)
+    }, 0)
 })
 function initMap(styleurl: any) {
     map.value = new narimap.Map({
@@ -309,6 +313,7 @@ const grids = (row: any) => {
     // 综合评估
     getAssessOverview(form.value).then(res => {
         assessList.value = res.data?.children
+
         getGridDiagramAreaData({ ...form.value, deptIndex: deptIndex.value }).then((res: any) => {
             AreaData.value = res.data
             GridDiagramArea()
@@ -324,32 +329,47 @@ const powerLoad = () => {
     let colors: any = [
         {
             orgIds: [],
+            outline: {
+                color: '#fff'
+            },
             fill: {
-                color: '#339966'
+                color: '#00b07d'
             }
         },
         {
             orgIds: [],
+            outline: {
+                color: '#fff'
+            },
             fill: {
                 color: '#3399ff'
             }
         },
         {
             orgIds: [],
+            outline: {
+                color: '#fff'
+            },
             fill: {
                 color: '#ffcc33'
             }
         },
         {
             orgIds: [],
+            outline: {
+                color: '#fff'
+            },
             fill: {
-                color: '#ff9900'
+                color: '#db0887'
             }
         },
         {
             orgIds: [],
+            outline: {
+                color: '#fff'
+            },
             fill: {
-                color: '#cc0000'
+                color: '#ff0000'
             }
         }
     ]
@@ -727,15 +747,15 @@ const GridDiagramArea = () => {
             if (item.name == y.name) {
                 if (y.score == 3.14159) {
                 } else if (y.score > 4.5) {
-                    item.background = '#33996696'
+                    item.background = '#33996699'
                 } else if (y.score > 4) {
-                    item.background = '#3399ff96'
+                    item.background = '#3399ff99'
                 } else if (y.score > 3) {
-                    item.background = '#ffcc3396'
+                    item.background = '#ffcc3399'
                 } else if (y.score > 2) {
-                    item.background = '#ff990096'
+                    item.background = '#db088799'
                 } else if (y.score > 0) {
-                    item.background = '#cc000096'
+                    item.background = '#ff000099'
                 }
             }
         })
diff --git a/src/views/pqs/qualityInspeection/panorama/components/mapR.vue b/src/views/pqs/qualityInspeection/panorama/components/mapR.vue
index 51ec937f..88c9892e 100644
--- a/src/views/pqs/qualityInspeection/panorama/components/mapR.vue
+++ b/src/views/pqs/qualityInspeection/panorama/components/mapR.vue
@@ -13,11 +13,11 @@
                             <div class="text">
                                 <span style="color: #00b07d">优质：(4.5 , 5]</span>
                                 <br />
-                                <span style="color: #3399ff">良好：(4 , 4.5]</span>
+                                <span style="color: #2b7fd3">良好：(4 , 4.5]</span>
                                 <br />
                                 <span style="color: #ffcc33">合格：(3 , 4]</span>
                                 <br />
-                                <span style="color: #ff9900">较差：(2 , 3]</span>
+                                <span style="color: #97017e">较差：(2 , 3]</span>
                                 <br />
                                 <span style="color: #cc0000">极差：[1 , 2]</span>
                             </div>
@@ -42,11 +42,11 @@
                                     : assessList.score > 4.5
                                     ? '#339966'
                                     : assessList.score > 4
-                                    ? '#3399ff'
+                                    ? '#2b7fd3'
                                     : assessList.score > 3
                                     ? '#ffcc33'
                                     : assessList.score > 2
-                                    ? '#ff9900'
+                                    ? '#97017e'
                                     : assessList.score > 0
                                     ? '#cc0000'
                                     : ''
@@ -70,11 +70,11 @@
                                         : item.score > 4.5
                                         ? '#339966'
                                         : item.score > 4
-                                        ? '#3399ff'
+                                        ? '#2b7fd3'
                                         : item.score > 3
                                         ? '#ffcc33'
                                         : item.score > 2
-                                        ? '#ff9900'
+                                        ? '#97017e'
                                         : item.score > 0
                                         ? '#cc0000'
                                         : ''
@@ -228,6 +228,12 @@
             @click="show = !show"
             src="@/assets/img/QH.png"
         />
+        <div class="legeng">
+            <div v-for="item in legengList">
+                <span :style="`background-color: ${item.color};`"></span>
+                <span>{{ item.title }}</span>
+            </div>
+        </div>
         <!-- 评估 -->
         <Evaluate ref="evaluateRef" />
         <!-- 稳态 -->
@@ -295,6 +301,28 @@ const options1: any = dictData.getBasicData('Event_Statis').filter(item => {
         return item
     }
 })
+const legengList = [
+    {
+        color: '#00b07d',
+        title: '优质'
+    },
+    {
+        color: '#3399ff',
+        title: '良好'
+    },
+    {
+        color: '#ffcc33',
+        title: '合格'
+    },
+    {
+        color: '#db0887',
+        title: '较差'
+    },
+    {
+        color: '#ff0000',
+        title: '极差'
+    }
+]
 const assessList: any = ref([])
 const JDlist = ref([
     {
@@ -463,7 +491,7 @@ defineExpose({ info, show })
         .progress {
             display: flex;
             align-items: center;
- 
+
             .text {
                 width: 50px;
                 font-size: 12px;
@@ -494,6 +522,32 @@ defineExpose({ info, show })
     height: 200px;
     cursor: pointer;
 }
+.legeng {
+    position: absolute;
+    padding: 5px;
+    bottom: 0;
+    left: -75px;
+    width: 70px;
+    font-size: 12px;
+    height: 120px;
+    background: #fff;
+    border-radius: 5px;
+    display: grid;
+    line-height: 22px;
+    grid-template-rows: auto;
+    div {
+        display: flex;
+        align-items: center;
+       justify-content: center;
+        span:nth-child(1) {
+            display: inline-block;
+            height: 10px;
+            border-radius: 2px;
+            width: 15px;
+            margin-right: 5px;
+        }
+    }
+}
 .show {
     width: 0px;
     transition: all 0.3s ease;