+++

src/layout/components/Sidebar/Logo.vue

@@ -175,9 +175,15 @@ const expandFold = () => {
   }
   appStore.getExpandFold(foldType);
 }
+const intervalId = ref(null)
 onMounted(() => {
+  let totalSeconds  = 1000 * 60 * 10
+  intervalId.value = setInterval(getIPCity, totalSeconds);
   getIPCity()
 })
+onUnmounted(() => {
+  clearInterval(intervalId.value);
+})
 </script>
 
 <style lang="scss" scoped>

src/views/login.vue

@@ -148,54 +148,7 @@ function getCookie() {
 onMounted(() => {
   getCode();
   getCookie();
-  nextTick(() => {
-    init();
-  })
 });
-var renderer, scene, camera;
-const init = () => {
-  renderer = new THREE.WebGLRenderer({ antialias: true, alpha: true });
-  renderer.setSize(window.innerWidth, window.innerHeight);
-  document.getElementById('canvas').appendChild(renderer.domElement);
-  scene = new THREE.Scene();
-  camera = new THREE.PerspectiveCamera(100, window.innerWidth / window.innerHeight, 1, 1000);
-  camera.position.z = 500;
-  scene.add(camera);
-  var geom = new THREE.IcosahedronGeometry(7, 1);
-  var geom2 = new THREE.IcosahedronGeometry(15, 1);
-  var mat = new THREE.MeshPhongMaterial({
-    color: 0xffffff,
-    shading: THREE.FlatShading
-  });
-  var mat2 = new THREE.MeshPhongMaterial({
-    color: 0xffffff,
-    wireframe: true,
-    side: THREE.DoubleSide
-  });
-  var planet = new THREE.Mesh(geom, mat);
-  planet.scale.x = planet.scale.y = planet.scale.z = 16;
-  var center = new THREE.Object3D();
-  center.add(planet);
-  scene.add(center);
-  renderer.render(scene, camera)
-  var planet2 = new THREE.Mesh(geom2, mat2);
-  planet2.scale.x = planet2.scale.y = planet2.scale.z = 10;
-  outside = new THREE.Object3D();
-  outside.add(planet2);
-  scene.add(outside);
-  var ambientLight = new THREE.AmbientLight(0x999999);
-  scene.add(ambientLight);
-  var lights1 = new THREE.DirectionalLight(0xffffff, 1);
-  lights1.position.set(1, 0, 0);
-  var lights2 = new THREE.DirectionalLight(0x11E8BB, 1);
-  lights2.position.set(0.75, 1, 0.5);
-  var lights3 = new THREE.DirectionalLight(0x8200C9, 1);
-  lights3.position.set(-0.75, -1, 0.5);
-  scene.add(lights1);
-  scene.add(lights2);
-  scene.add(lights3);
-
-};
 </script>
 
 <style lang='scss' scoped>
@@ -238,9 +191,10 @@ const init = () => {
   border-radius: 6px;
   // background: #ffffff;
   width: 400px;
-  padding: 25px 25px 5px 25px;
+  padding: 30px 25px 10px 25px;
   box-shadow: var(--el-box-shadow-light);
   z-index: 1;
+  background-color: rgba(15, 48, 98, 0.4);
 
   .el-input {
     height: 40px;
@@ -257,6 +211,19 @@ const init = () => {
   }
 }
 
+.login-form :deep(.el-input__wrapper) {
+  background-color: unset;
+  box-shadow: 0 0 0 1px rgb(41 78 111) inset;
+}
+
+.login-form :deep(.el-input__wrapper.is-focus) {
+  box-shadow: 0 0 0 1px #409eff inset;
+}
+
+.login-form :deep(.el-input__inner) {
+  color: #fff;
+}
+
 .login-tip {
   font-size: 13px;
   text-align: center;

src/views/system/broadcast/modules/tiring.vue

@@ -54,7 +54,13 @@ onMounted(() => {
                     crossStyle: {
                         color: '#999'
                     }
-                }
+                },
+                textStyle: {
+                    color: '#fafafa',
+                },
+                borderColor: 'transparent',
+                backgroundColor: 'rgba(0, 0, 0, 0.5)',
+                extraCssText: 'backdrop-filter: blur(6px);',
             },
             grid: {
                 top: '10%',

src/views/system/building/equipment.vue

@@ -135,8 +135,9 @@ onUnmounted(() => {
     overflow: hidden;
     display: flex;
     flex-direction: column;
-
+    height: calc(100% - 42px);
     &_mains {
+        height: calc(100% - 20px);
         margin: 10px 30px;
         overflow: hidden; // 隐藏溢出内容
         // 鼠标移入时改变手势

src/views/system/elevator/modules/carbonEmission.vue

@@ -53,7 +53,13 @@ onMounted(() => {
                     crossStyle: {
                         color: '#999'
                     }
-                }
+                },
+                textStyle: {
+                    color: '#fafafa',
+                },
+                borderColor: 'transparent',
+                backgroundColor: 'rgba(0, 0, 0, 0.5)',
+                extraCssText: 'backdrop-filter: blur(6px);',
             },
             grid: {
                 top: '10%',

src/views/system/elevator/modules/eventList.vue

@@ -53,7 +53,13 @@ onMounted(() => {
                     crossStyle: {
                         color: '#999'
                     }
-                }
+                },
+                textStyle: {
+                    color: '#fafafa',
+                },
+                borderColor: 'transparent',
+                backgroundColor: 'rgba(0, 0, 0, 0.5)',
+                extraCssText: 'backdrop-filter: blur(6px);',
             },
             grid: {
                 top: '10%',

src/views/system/elevator/modules/sameDay.vue

@@ -52,7 +52,13 @@ onMounted(() => {
                     crossStyle: {
                         color: '#999'
                     }
-                }
+                },
+                textStyle: {
+                    color: '#fafafa',
+                },
+                borderColor: 'transparent',
+                backgroundColor: 'rgba(0, 0, 0, 0.5)',
+                extraCssText: 'backdrop-filter: blur(6px);',
             },
             grid: {
                 top: '10%',

src/views/system/elevator/modules/tiring.vue

@@ -52,7 +52,13 @@ onMounted(() => {
                     crossStyle: {
                         color: '#999'
                     }
-                }
+                },
+                textStyle: {
+                    color: '#fafafa',
+                },
+                borderColor: 'transparent',
+                backgroundColor: 'rgba(0, 0, 0, 0.5)',
+                extraCssText: 'backdrop-filter: blur(6px);',
             },
             grid: {
                 top: '10%',

src/views/system/energy/modules/carbonEmission.vue

@@ -51,7 +51,13 @@ onMounted(() => {
                     crossStyle: {
                         color: '#999'
                     }
-                }
+                },
+                textStyle: {
+                    color: '#fafafa',
+                },
+                borderColor: 'transparent',
+                backgroundColor: 'rgba(0, 0, 0, 0.5)',
+                extraCssText: 'backdrop-filter: blur(6px);',
             },
             // 调整 grid 配置以在 Y 轴方向拉伸图表
             grid: {

src/views/system/energy/modules/consume.vue

@@ -52,7 +52,13 @@ onMounted(() => {
                     crossStyle: {
                         color: '#999'
                     }
-                }
+                },
+                textStyle: {
+                    color: '#fafafa',
+                },
+                borderColor: 'transparent',
+                backgroundColor: 'rgba(0, 0, 0, 0.5)',
+                extraCssText: 'backdrop-filter: blur(6px);',
             },
             // 调整 grid 配置以在 Y 轴方向拉伸图表
             grid: {

src/views/system/energy/modules/consumptionPower.vue

@@ -54,7 +54,13 @@ onMounted(() => {
                     crossStyle: {
                         color: '#999'
                     }
-                }
+                },
+                textStyle: {
+                    color: '#fafafa',
+                },
+                borderColor: 'transparent',
+                backgroundColor: 'rgba(0, 0, 0, 0.5)',
+                extraCssText: 'backdrop-filter: blur(6px);',
             },
             grid: {
                 top: '10%',

src/views/system/energy/modules/consumptionWater.vue

@@ -56,7 +56,13 @@ onMounted(() => {
                     crossStyle: {
                         color: '#999'
                     }
-                }
+                },
+                textStyle: {
+                    color: '#fafafa',
+                },
+                borderColor: 'transparent',
+                backgroundColor: 'rgba(0, 0, 0, 0.5)',
+                extraCssText: 'backdrop-filter: blur(6px);',
             },
             grid: {
                 top: '10%',

src/views/system/entranceguard/inbreak.vue

@@ -55,14 +55,15 @@ const initAccess = (val1, val2, val3) => {
         },
         tooltip: {
             trigger: 'axis',
-            backgroundColor: '#3A4667',
-            borderColor: '#3A4667',
-            textStyle: {
-                color: '#fff'
-            },
             axisPointer: {
                 type: 'shadow', // 默认为直线，可选为：'line' | 'shadow'
             },
+            textStyle: {
+                color: '#fafafa',
+            },
+            borderColor: 'transparent',
+            backgroundColor: 'rgba(0, 0, 0, 0.5)',
+            extraCssText: 'backdrop-filter: blur(6px);',
         },
         legend: {
             data: ['非法入侵', '强行闯入'],

src/views/system/intruderalarm/index.vue

@@ -51,7 +51,8 @@
                                 <div style="width: 140px;height: 140px;">
                                     <waterdrop width="100%" fontSize="32px" circleBackGround="rgb(8, 36, 62)"
                                         birderColor="transparent" color="rgb(42, 139, 247)"
-                                        :heightTop="'-' + leftData.trend + '%'" :dropTitle="leftData.trend + '%'"></waterdrop>
+                                        :heightTop="'-' + leftData.trend + '%'" :dropTitle="leftData.trend + '%'">
+                                    </waterdrop>
                                 </div>
                                 <!-- <div ref="chartWater" style="width: 140px;height: 140px;"></div> -->
                             </div>
@@ -565,7 +566,7 @@ watch(() => leftData.value, (newVal) => {
         })
         let arrData = []
         let arrData1 = newVal.realTime
-        arrData1.forEach(item=>{
+        arrData1.forEach(item => {
             let arrData2 = []
             arrData2.push(item.Name)
             arrData2.push(item.Location)

src/views/system/lighting/modules/running.vue

@@ -197,6 +197,12 @@ const initAccess = () => {
             show: true,
             trigger: 'item',
             formatter: '{a}<br>{b}:{c}({d}%)',
+            textStyle: {
+                color: '#fafafa',
+            },
+            borderColor: 'transparent',
+            backgroundColor: 'rgba(0, 0, 0, 0.5)',
+            extraCssText: 'backdrop-filter: blur(6px);',
         },
         color: ['#409eff', '#15acaa', '#FFC107', 'rgb(244, 67, 54)'],
         grid: {

src/views/system/lighting/modules/switchAll.vue

@@ -38,7 +38,13 @@ onMounted(() => {
         const option = {
             title: null,
             tooltip: {
-                trigger: 'axis'
+                trigger: 'axis',
+                textStyle: {
+                    color: '#fafafa',
+                },
+                borderColor: 'transparent',
+                backgroundColor: 'rgba(0, 0, 0, 0.5)',
+                extraCssText: 'backdrop-filter: blur(6px);',
             },
             legend: false,
             // 调整 grid 配置以在 Y 轴方向拉伸图表

src/views/system/message/modules/carbonEmission.vue

@@ -51,10 +51,12 @@ onMounted(() => {
             tooltip: {
                 trigger: 'item',
                 formatter: '{a} <br/>{b} : {c} ({d}%)',
-                backgroundColor: 'rgba(0, 0, 0, 0.8)',
                 textStyle: {
-                    color: '#fff'
-                }
+                    color: '#fafafa',
+                },
+                borderColor: 'transparent',
+                backgroundColor: 'rgba(0, 0, 0, 0.5)',
+                extraCssText: 'backdrop-filter: blur(6px);',
             },
             // 添加图例配置
             legend: {

src/views/system/message/modules/tiring.vue

@@ -46,7 +46,13 @@ onMounted(() => {
                     crossStyle: {
                         color: '#999'
                     }
-                }
+                },
+                textStyle: {
+                    color: '#fafafa',
+                },
+                borderColor: 'transparent',
+                backgroundColor: 'rgba(0, 0, 0, 0.5)',
+                extraCssText: 'backdrop-filter: blur(6px);',
             },
             grid: {
                 top: '10%',

src/views/system/passageway/index.vue

@@ -29,7 +29,7 @@
                     <div class="line_blue">
                       <div class="blue_dot"></div>
                     </div>
-                    <div class="monit_title">在线</div>
+                    <div class="monit_title">空闲车位</div>
                     <span class="monit_num">{{ leftData.Online }}</span>
                   </div>
                   <div class="camera">
@@ -47,7 +47,7 @@
                             <stop offset="100%" stop-color="rgb(4, 223, 247)" />
                           </linearGradient>
                         </defs>
-                        <use xlink:href="#icon-camera" fill="url('#myGradientil')" />
+                        <use xlink:href="#icon-parkingSpot" fill="url('#myGradientil')" />
                       </svg>
                     </div>
                   </div>
@@ -55,8 +55,8 @@
                     <div class="line_green">
                       <div class="green_dot"></div>
                     </div>
-                    <div class="monit_title">离线</div>
-                    <span class="monit_num">{{ leftData.Offline }}</span>
+                    <div class="monit_title">已占车位</div>
+                    <span class="monit_num1">{{ leftData.Offline }}</span>
                   </div>
                 </div>
               </dv-border-box-1>
@@ -69,7 +69,7 @@
         </div>
       </div> -->
           <div class="flex_spection">
-            <HeadlineTag type="right" value="设备排名"></HeadlineTag>
+            <HeadlineTag type="right" value="设备出入统计排名(Top5)"></HeadlineTag>
             <div class="box_arch">
               <div ref="chartRouting" style="width: 100%;height: 100%;"></div>
             </div>
@@ -137,7 +137,13 @@ const initChart = () => {
       },
       formatter: function (res) {
         return `${res.name} : ${res.data}万人`;
-      }
+      },
+      textStyle: {
+        color: '#fafafa',
+      },
+      borderColor: 'transparent',
+      backgroundColor: 'rgba(0, 0, 0, 0.5)',
+      extraCssText: 'backdrop-filter: blur(6px);',
     },
     legend: {
       selectedMode: false,
@@ -270,13 +276,17 @@ function getAccessData() {
 
 watch(() => leftData.value, (newVal) => {
   if (chartInstance) {
+    let result = newVal.DeviceRanking.map(person => person.DeviceName)
+    var firstFive = result.slice(0, 5)
+    let result1 = newVal.DeviceRanking.map(person => person.Value)
+    var firstFive1 = result1.slice(0, 5)
     chartInstance.setOption({
       yAxis: [{
-        data: newVal.DeviceRanking.map(person => person.DeviceName),
+        data: firstFive,
       }],
       series: [{
         name: '标准化',
-        data: newVal.DeviceRanking.map(person => person.Value),
+        data: firstFive1,
       }],
     })
   }
@@ -420,7 +430,7 @@ window.addEventListener('resize', () => {
   position: relative;
   height: 5px;
   width: 70%;
-  background-color: rgba(5, 125, 230, .5);
+  background-color: rgba(12, 208, 67, .5);
   margin-bottom: 10px;
 }
 
@@ -430,16 +440,16 @@ window.addEventListener('resize', () => {
   top: 0;
   bottom: 0;
   width: 20px;
-  border-left: 5px solid #000;
-  border-right: 5px solid #000;
-  background-color: rgba(5, 125, 230, 1);
+  border-left: 5px solid rgb(5, 26, 52);
+  border-right: 5px solid rgb(5, 26, 52);
+  background-color: rgba(12, 208, 67, 1);
 }
 
 .line_green {
   position: relative;
   height: 5px;
   width: 70%;
-  background-color: rgba(5, 227, 227, .5);
+  background-color: rgba(254, 33, 44, .5);
   margin-bottom: 10px;
 }
 
@@ -449,9 +459,9 @@ window.addEventListener('resize', () => {
   top: 0;
   bottom: 0;
   width: 20px;
-  border-left: 5px solid #000;
-  border-right: 5px solid #000;
-  background-color: rgba(5, 227, 227, 1);
+  border-left: 5px solid rgb(5, 26, 52);
+  border-right: 5px solid rgb(5, 26, 52);
+  background-color: rgba(254, 33, 44, 1);
 }
 
 .img_camera {
@@ -462,7 +472,7 @@ window.addEventListener('resize', () => {
   left: calc(50% - 60px);
   border-radius: 50%;
   border: 1px solid rgb(15, 39, 66);
-  box-shadow: inset 0px 0px 20px 2px rgb(78, 207, 220);
+  box-shadow: inset 0px 0px 20px 2px rgb(42, 147, 223);
 }
 
 .camera_box_icon {
@@ -566,6 +576,13 @@ window.addEventListener('resize', () => {
 
 .monit_num {
   font-size: 30px;
+  color: rgba(12, 208, 67, 1);
+  font-weight: bold;
+}
+
+.monit_num1 {
+  font-size: 30px;
+  color: rgba(254, 33, 44, 1);
   font-weight: bold;
 }
 </style>

src/views/system/receptiondesk/formerly.vue

@@ -84,8 +84,11 @@ const initAccess = () => {
                 }
             },
             textStyle: {
-                fontSize: 12
+                color: '#fafafa',
             },
+            borderColor: 'transparent',
+            backgroundColor: 'rgba(0, 0, 0, 0.5)',
+            extraCssText: 'backdrop-filter: blur(6px);',
         },
         title: {
             x: 'center',

src/views/system/receptiondesk/wordcloud.vue

@@ -28,15 +28,15 @@ const initAccess = () => {
     let option = {
         tooltip: {
             trigger: "axis",
-            backgroundColor: "rgba(9,40,84,0.8)",
-            borderColor: "rgba(9,40,84,0.8)",
-            textStyle: {
-                fontSize: 20,
-                color: "#fff",
-            },
             axisPointer: {
                 type: "shadow",
             },
+            textStyle: {
+                color: '#fafafa',
+            },
+            borderColor: 'transparent',
+            backgroundColor: 'rgba(0, 0, 0, 0.5)',
+            extraCssText: 'backdrop-filter: blur(6px);',
             formatter: function (params) {
                 return (
                     params[0].name +

src/views/system/tenement/modules/carbonEmission.vue

@@ -52,7 +52,13 @@ onMounted(() => {
                     crossStyle: {
                         color: '#999'
                     }
-                }
+                },
+                textStyle: {
+                    color: '#fafafa',
+                },
+                borderColor: 'transparent',
+                backgroundColor: 'rgba(0, 0, 0, 0.5)',
+                extraCssText: 'backdrop-filter: blur(6px);',
             },
             grid: {
                 top: '10%',

src/views/system/tenement/modules/sameDay.vue

@@ -53,7 +53,13 @@ onMounted(() => {
                     crossStyle: {
                         color: '#999'
                     }
-                }
+                },
+                textStyle: {
+                    color: '#fafafa',
+                },
+                borderColor: 'transparent',
+                backgroundColor: 'rgba(0, 0, 0, 0.5)',
+                extraCssText: 'backdrop-filter: blur(6px);',
             },
             grid: {
                 top: '10%',

src/views/system/video/index.vue

@@ -9,7 +9,7 @@
                 </div>
             </template>
             <template #content>
-                <p>视频</p>
+                <!-- <p>视频</p> -->
             </template>
             <template #right>
                 <div style="height: 100%;display: flex;flex-direction: column;overflow: hidden;">

src/views/system/video/modules/carbonEmission.vue

@@ -53,7 +53,13 @@ onMounted(() => {
                     crossStyle: {
                         color: '#999'
                     }
-                }
+                },
+                textStyle: {
+                    color: '#fafafa',
+                },
+                borderColor: 'transparent',
+                backgroundColor: 'rgba(0, 0, 0, 0.5)',
+                extraCssText: 'backdrop-filter: blur(6px);',
             },
             grid: {
                 top: '10%',

src/views/system/visitor/transit.vue

@@ -51,7 +51,13 @@ onMounted(() => {
                     crossStyle: {
                         color: '#999'
                     }
-                }
+                },
+                textStyle: {
+                    color: '#fafafa',
+                },
+                borderColor: 'transparent',
+                backgroundColor: 'rgba(0, 0, 0, 0.5)',
+                extraCssText: 'backdrop-filter: blur(6px);',
             },
             grid: {
                 top: '10%',