优化空数据状态、切换页面请求优化

src/api/system/airconditioner.js

@@ -0,0 +1,12 @@
+import request from '@/utils/request'
+const Url = "http://182.43.247.65:8000"
+
+// 查询出入口统计数据
+export function getTemperature(query) {
+    return request({
+        url: '/temperature/count',
+        method: 'get',
+        params: query,
+        baseURL: import.meta.env.DEV ? '/APP' : Url,
+    })
+}

src/components/Empty/index.vue

@@ -1,8 +1,8 @@
 <template>
     <div class="box_empty">
-        <div class="card_empty">
+        <div class="card_empty" :style="{ 'flex-direction': bottom ? 'column' : '' }">
             <svg-icon icon-class="empty" className="arch_icon" />
-            <div class="empty_title">{{ title }}</div>
+            <div class="empty_title" :style="{'margin': bottom ? '10px 0px 0px 0px' : ''}">{{ title }}</div>
         </div>
     </div>
 </template>
@@ -12,6 +12,10 @@ defineProps({
     title: {
         type: String,
         default: '暂无数据'
+    },
+    bottom: {
+        type: Boolean,
+        default: false
     }
 })
 

src/layout/components/AppMain.vue

@@ -8,10 +8,10 @@
       <!-- </transition> -->
     </router-view>
     <iframe-toggle />
-    <iframe id="myIframe" :src="srcUrl" style="width: 100%;height: 100%;" frameborder="0"
+    <!-- <iframe id="myIframe" :src="srcUrl" style="width: 100%;height: 100%;" frameborder="0"
       v-show="pathUrl == '/index' || pathUrl == '/system/building'"></iframe>
     <iframe id="myIframeil" :src="srcUrl1" style="width: 100%;height: 100%;" frameborder="0"
-      v-if="pathUrl != '/index' && pathShow || pathShow && pathUrl != '/system/lighting'"></iframe>
+      v-if="pathUrl != '/index' && pathShow || pathShow && pathUrl != '/system/lighting'"></iframe> -->
   </section>
 </template>
 
@@ -27,22 +27,6 @@ const srcUrl1 = ref('')
 onMounted(() => {
   addIframe()
 })
-// const onLoad = () => {
-//   let num = 1
-//   const iframe = document.getElementById("myIframe");
-//   iframe.contentWindow.postMessage(
-//     `window.iot3d.ParkSwitch(${num});`,
-//     "*"
-//   );
-//   if (num == 0) {
-//     num = 1
-//   } else {
-//     num = 0
-//   }
-// }
-// function handleScroll() {
-//   console.log('Iframe scrolled!');
-// }
 watch(() => route, (newVal) => {
   pathUrl.value = newVal.path
   if (pathUrl.value == '/system/lighting') {
@@ -87,6 +71,27 @@ watch(() => route, (newVal) => {
   } else if (pathUrl.value == '/system/receptiondesk') {
     // 会议系统
     srcUrl1.value = 'http://117.187.233.165:9191/ViewRun?T_ViewID=41rwFKnP9R7DAQXGYkz2S8Vcba3qTU14'
+  } else if (pathUrl.value == '/system/airConditioner') {
+    // 空调系统
+    srcUrl1.value = 'http://117.187.233.165:9191/ViewRun?T_ViewID=41rwFKnP9R7DAQXGYkz2S8Vcba3qTU17'
+  } else if (pathUrl.value == '/system/wastewater') {
+    // 给排水系统
+    srcUrl1.value = 'http://117.187.233.165:9191/ViewRun?T_ViewID=41rwFKnP9R7DAQXGYkz2S8Vcba3qTU18'
+  } else if (pathUrl.value == '/system/wirelessIntercom') {
+    // 无线对讲系统
+    srcUrl1.value = 'http://117.187.233.165:9191/ViewRun?T_ViewID=41rwFKnP9R7DAQXGYkz2S8Vcba3qTU19'
+  } else if (pathUrl.value == '/system/sceneLighting') {
+    // 景观照明系统
+    srcUrl1.value = 'http://117.187.233.165:9191/ViewRun?T_ViewID=41rwFKnP9R7DAQXGYkz2S8Vcba3qTU20'
+  } else if (pathUrl.value == '/system/floodlighting') {
+    // 泛光照明系统
+    srcUrl1.value = 'http://117.187.233.165:9191/ViewRun?T_ViewID=41rwFKnP9R7DAQXGYkz2S8Vcba3qTU21'
+  } else if (pathUrl.value == '/system/fireAlarm') {
+    // 火灾报警系统
+    srcUrl1.value = 'http://117.187.233.165:9191/ViewRun?T_ViewID=41rwFKnP9R7DAQXGYkz2S8Vcba3qTU22'
+  } else if (pathUrl.value == '/system/dynamicEnvironment') {
+    // 动力环境监控系统
+    srcUrl1.value = 'http://117.187.233.165:9191/ViewRun?T_ViewID=41rwFKnP9R7DAQXGYkz2S8Vcba3qTU23'
   }
   pathShow.value = true
   if (pathUrl.value == '/system/building') {
@@ -96,7 +101,7 @@ watch(() => route, (newVal) => {
   } else if (pathUrl.value == '/index' || pathUrl.value == '/') {
     pathShow.value = false
   }
-  console.log(pathUrl.value, 998);
+  // console.log(pathUrl.value, 998);
   addIframe()
 }, { deep: true, immediate: true } // 开启深度监听
 )

src/layout/components/Sidebar/Logo.vue

@@ -156,7 +156,7 @@ const getWeather = async (params) => {
       weathers.value = weatherArr.weather
       temperatures.value = weatherArr.temperature
       weatherList.forEach(el => {
-        console.log(el.name, weatherArr.weather, 335)
+        // console.log(el.name, weatherArr.weather, 335)
         if (el.name === weatherArr.weather) {
           imgUrl.value = el.url
         }

src/utils/request.js

@@ -17,7 +17,7 @@ const service = axios.create({
   // axios中请求配置有baseURL选项，表示请求URL公共部分
   baseURL: import.meta.env.VITE_APP_BASE_API,
   // 超时
-  timeout: 10000
+  timeout: 60000
 })
 
 // request拦截器

src/views/index/LineChart.vue

@@ -1,105 +1,122 @@
 <template>
-    <div ref="chartDom" style="width: 100%;height: 100%;" />
+    <div ref="chartDom" style="width: 100%;height: 100%;" v-if="chartShow" />
+    <Empty :bottom="true" v-else></Empty>
 </template>
 
 <script setup>
 import * as echarts from 'echarts'
+import Empty from '@/components/Empty'
+import { ref, onMounted, watch, nextTick } from 'vue'
 const props = defineProps({
     lineData: {
         type: Object,
         default: {}
     }
 })
+const chartShow = ref(false)
 const chartDom = ref(null);
 let chartInstance = null;
 // 初始化图表
 const initChart = () => {
-    chartInstance = echarts.init(chartDom.value);
-    chartInstance.setOption({
-        tooltip: {
-            trigger: 'axis',
-            textStyle: {
-                color: '#fafafa',
-            },
-            borderColor: 'transparent',
-            backgroundColor: 'rgba(0, 0, 0, 0.5)',
-            extraCssText: 'backdrop-filter: blur(6px);',
-        },
-        grid: {
-            left: '4%',
-            right: '4%',
-            bottom: '10%',
-            top: '16%',
-            containLabel: true,
-        },
-        xAxis: {
-            data: Object.keys(props.lineData),
-            type: 'category',
-            boundaryGap: false,
-            axisLine: {
-                symbol: 'none',
-                lineStyle: {
-                    color: '#50637A',
+    if (chartDom.value) {
+        chartInstance = echarts.init(chartDom.value);
+        chartInstance.setOption({
+            tooltip: {
+                trigger: 'axis',
+                textStyle: {
+                    color: '#fafafa',
                 },
+                borderColor: 'transparent',
+                backgroundColor: 'rgba(0, 0, 0, 0.5)',
+                extraCssText: 'backdrop-filter: blur(6px);',
             },
-            axisTick: {
-                show: false,
-            },
-            axisLabel: {
-                interval: 0,
-                color: '#ffffff',
-                fontSize: 12,
-                padding: [10, 0, 0, 0],
-            },
-        },
-        yAxis: {
-            type: 'value',
-            axisLabel: {
-                color: '#ffffff',
-                fontSize: 12,
-                padding: [0, 10, 0, 0],
+            grid: {
+                left: '4%',
+                right: '4%',
+                bottom: '10%',
+                top: '16%',
+                containLabel: true,
             },
-            splitLine: {
-                show: false,
+            xAxis: {
+                data: Object.keys(props.lineData),
+                type: 'category',
+                boundaryGap: false,
+                axisLine: {
+                    symbol: 'none',
+                    lineStyle: {
+                        color: '#50637A',
+                    },
+                },
+                axisTick: {
+                    show: false,
+                },
+                axisLabel: {
+                    interval: 0,
+                    color: '#ffffff',
+                    fontSize: 12,
+                    padding: [10, 0, 0, 0],
+                },
             },
-        },
-        series: [
-            {
-                name: '增加值',
-                data: Object.entries(props.lineData),
-                type: 'line',
-                color: 'rgb(49, 143, 247)',
-                lineStyle: {
-                    width: 2,
+            yAxis: {
+                type: 'value',
+                axisLabel: {
+                    color: '#ffffff',
+                    fontSize: 12,
+                    padding: [0, 10, 0, 0],
                 },
-                areaStyle: {
-                    color: new echarts.graphic.LinearGradient(
-                        0,
-                        0,
-                        0,
-                        1,
-                        [{
-                            offset: 0,
-                            color: 'rgba(49, 143, 247, .6)',
-                        },
-                        {
-                            offset: 0.8,
-                            color: 'rgba(49, 143, 247, .2)',
-                        },
-                        ],
-                        false
-                    ),
-                    shadowColor: 'rgba(0, 0, 0, 0.1)',
-                    shadowBlur: 10,
+                splitLine: {
+                    show: false,
                 },
-                symbol: 'circle',
-                symbolSize: 6,
             },
-        ],
-    });
+            series: [
+                {
+                    name: '增加值',
+                    data: Object.entries(props.lineData),
+                    type: 'line',
+                    color: 'rgb(49, 143, 247)',
+                    lineStyle: {
+                        width: 2,
+                    },
+                    areaStyle: {
+                        color: new echarts.graphic.LinearGradient(
+                            0,
+                            0,
+                            0,
+                            1,
+                            [{
+                                offset: 0,
+                                color: 'rgba(49, 143, 247, .6)',
+                            },
+                            {
+                                offset: 0.8,
+                                color: 'rgba(49, 143, 247, .2)',
+                            },
+                            ],
+                            false
+                        ),
+                        shadowColor: 'rgba(0, 0, 0, 0.1)',
+                        shadowBlur: 10,
+                    },
+                    symbol: 'circle',
+                    symbolSize: 6,
+                },
+            ],
+        });
+    }
 };
 
 watch(() => props.lineData, (newVal) => {
+    if (newVal && chartInstance == null) {
+        if (newVal && Object.keys(newVal).length === 0) {
+            chartShow.value = false;
+            return;
+        } else {
+            chartShow.value = true;
+            nextTick(() => {
+                initChart();
+            });
+        }
+    }
     if (chartInstance) {
         chartInstance.setOption({
             xAxis: {
@@ -113,7 +130,11 @@ watch(() => props.lineData, (newVal) => {
 }, { deep: true, immediate: true } // 开启深度监听
 )
 // 生命周期
-onMounted(initChart);
+onMounted(() => {
+    nextTick(() => {
+        initChart();
+    });
+});
 // 窗口自适应
 window.addEventListener('resize', () => {
     chartInstance?.resize();

src/views/index/leftDesk.vue

@@ -11,19 +11,19 @@
                 <div class="right_content">
                     <div class="title_row">
                         <div class="survey_title">建筑面积:</div>
-                        <div class="survey_num">{{ resultData.Area }}<span>m²</span></div>
+                        <div class="survey_num">{{ resultData.Area || 0 }}<span>m²</span></div>
                     </div>
                     <div class="title_row">
                         <div class="survey_title">占地面积:</div>
-                        <div class="survey_num">{{ resultData.FloorSpace }}<span>m²</span></div>
+                        <div class="survey_num">{{ resultData.FloorSpace || 0 }}<span>m²</span></div>
                     </div>
                     <div class="title_row">
                         <div class="survey_title">建筑高度:</div>
-                        <div class="survey_num">{{ resultData.BuildingHeight }}<span>m</span></div>
+                        <div class="survey_num">{{ resultData.BuildingHeight || 0 }}<span>m</span></div>
                     </div>
                     <div class="title_row">
                         <div class="survey_title">建筑层数:</div>
-                        <div class="survey_num">{{ resultData.Storey }}</div>
+                        <div class="survey_num">{{ resultData.Storey || 0 }}</div>
                     </div>
                 </div>
             </div>
@@ -34,12 +34,12 @@
                 <div class="box_facility">
                     <div class="left_ity">
                         <div class="title_ity">设备总数</div>
-                        <div class="num_ity" style="color: rgb(45, 220, 223);">{{ resultData.Device }}</div>
+                        <div class="num_ity" style="color: rgb(45, 220, 223);">{{ resultData.Device || 0 }}</div>
                     </div>
                     <div class="facil_line"></div>
                     <div class="left_ity">
                         <div class="title_ity">设备故障</div>
-                        <div class="num_ity" style="color: rgb(226, 164, 25);">{{ resultData.Fault }}</div>
+                        <div class="num_ity" style="color: rgb(226, 164, 25);">{{ resultData.Fault || 0 }}</div>
                     </div>
                 </div>
                 <div class="box_loader">
@@ -65,12 +65,12 @@
                 <div class="box_facility">
                     <div class="right_ity">
                         <div class="title_ity">运行总数</div>
-                        <div class="num_ity" style="color: rgb(230, 232, 233);">{{ resultData.Runing }}</div>
+                        <div class="num_ity" style="color: rgb(230, 232, 233);">{{ resultData.Runing || 0 }}</div>
                     </div>
                     <div class="facil_line"></div>
                     <div class="right_ity">
                         <div class="title_ity">报警总数</div>
-                        <div class="num_ity" style="color: rgb(232, 64, 66);">{{ resultData.Alarm }}</div>
+                        <div class="num_ity" style="color: rgb(232, 64, 66);">{{ resultData.Alarm || 0 }}</div>
                     </div>
                 </div>
             </div>
@@ -85,7 +85,7 @@
                         </el-icon>
                         <div class="day_time">今日</div>
                     </div>
-                    <span>{{ resultData.TodayConsumption }}</span>
+                    <span>{{ resultData.TodayConsumption || 0 }}</span>
                 </div>
                 <div class="energy_box">
                     <div class="title_row">
@@ -94,7 +94,7 @@
                         </el-icon>
                         <div class="day_time">本周</div>
                     </div>
-                    <span>{{ resultData.WeekConsumption }}</span>
+                    <span>{{ resultData.WeekConsumption || 0 }}</span>
                 </div>
                 <div class="energy_box">
                     <div class="title_row">
@@ -103,7 +103,7 @@
                         </el-icon>
                         <div class="day_time">本月</div>
                     </div>
-                    <span>{{ resultData.MonthConsumption }}</span>
+                    <span>{{ resultData.MonthConsumption || 0 }}</span>
                 </div>
                 <div class="energy_box">
                     <div class="title_row">
@@ -112,7 +112,7 @@
                         </el-icon>
                         <div class="day_time">本年</div>
                     </div>
-                    <span>{{ resultData.YearConsumption }}</span>
+                    <span>{{ resultData.YearConsumption || 0 }}</span>
                 </div>
             </div>
         </div>
@@ -121,7 +121,7 @@
             <div class="space_between_in card_subentry">
                 <div class="entry_box">
                     <div class="num_gross">总量</div>
-                    <span>{{ resultData.Impetus + resultData.illuminating + resultData.SpecialElectricity + resultData.AirConditioningSockets }}</span>
+                    <span>{{ getEnergy() || 0 }}</span>
                 </div>
                 <div class="box_subentry">
                     <div class="subentry_item space_between_in">
@@ -129,28 +129,28 @@
                             <span class="box_line color-cyan"></span>
                             <span>动力</span>
                         </div>
-                        <span class="text-cyan">{{ resultData.Impetus }}</span>
+                        <span class="text-cyan">{{ resultData.Impetus || 0 }}</span>
                     </div>
                     <div class="subentry_item space_between_in">
                         <div class="same_row_in">
                             <span class="box_line color-yellow"></span>
                             <span>照明</span>
                         </div>
-                        <span class="text-yellow">{{ resultData.illuminating }}</span>
+                        <span class="text-yellow">{{ resultData.illuminating || 0 }}</span>
                     </div>
                     <div class="subentry_item space_between_in">
                         <div class="same_row_in">
                             <span class="box_line color-blue"></span>
                             <span>特殊用电</span>
                         </div>
-                        <span class="text-blue">{{ resultData.SpecialElectricity }}</span>
+                        <span class="text-blue">{{ resultData.SpecialElectricity || 0 }}</span>
                     </div>
                     <div class="subentry_item space_between_in">
                         <div class="same_row_in">
                             <span class="box_line color-red"></span>
                             <span>空调插座</span>
                         </div>
-                        <span class="text-red">{{ resultData.AirConditioningSockets }}</span>
+                        <span class="text-red">{{ resultData.AirConditioningSockets || 0 }}</span>
                     </div>
                 </div>
             </div>
@@ -166,6 +166,16 @@ const props = defineProps({
         default: {}
     }
 })
+const getEnergy = () => {
+    let num = 0
+    num = props.resultData.Impetus + props.resultData.illuminating + props.resultData.SpecialElectricity + props.resultData.AirConditioningSockets
+    if (num) {
+        num = num
+    } else {
+        num = 0
+    }
+    return num
+}
 </script>
 
 <style scoped lang="scss">

src/views/index/reightDesk.vue

@@ -4,12 +4,12 @@
             <HeadlineTag type="right" value="工单统计(本周)"></HeadlineTag>
             <div class="box_arch">
                 <div class="image_tubbiness">
-                    <div class="work_num">{{ resultData.TodaysTicket }}<span>个</span></div>
+                    <div class="work_num">{{ resultData.TodaysTicket || 0 }}<span>个</span></div>
                     <div class="work_title">今日总数</div>
                 </div>
                 <div class="right_content">
-                    <div class="work_week"><span>进行中:</span>{{ resultData.ConductedTicket }}</div>
-                    <div class="work_week"><span>已超时:</span>{{ resultData.TimeoutTicket }}</div>
+                    <div class="work_week"><span>进行中:</span>{{ resultData.ConductedTicket || 0 }}</div>
+                    <div class="work_week"><span>已超时:</span>{{ resultData.TimeoutTicket || 0 }}</div>
                 </div>
             </div>
         </div>
@@ -33,7 +33,7 @@
                     </div>
                     <div class="appeal_num">
                         <span>总数</span>
-                        <span class="amount_num">{{ resultData.Demands }}</span>
+                        <span class="amount_num">{{ resultData.Demands || 0 }}</span>
                     </div>
                 </div>
                 <div class="appeal_box">
@@ -53,7 +53,7 @@
                     </div>
                     <div class="appeal_num">
                         <span>已处理</span>
-                        <span class="amount_num">{{ resultData.DisposeDemands }}</span>
+                        <span class="amount_num">{{ resultData.DisposeDemands || 0 }}</span>
                     </div>
                 </div>
                 <div class="appeal_box">
@@ -73,7 +73,7 @@
                     </div>
                     <div class="appeal_num">
                         <span>未处理</span>
-                        <span class="amount_num">{{ resultData.UnDisposeDemands }}</span>
+                        <span class="amount_num">{{ resultData.UnDisposeDemands || 0 }}</span>
                     </div>
                 </div>
                 <div class="appeal_box">
@@ -93,7 +93,7 @@
                     </div>
                     <div class="appeal_num">
                         <span>今日新增</span>
-                        <span class="amount_num">+{{ resultData.TodayDisposeDemands }}</span>
+                        <span class="amount_num">+{{ resultData.TodayDisposeDemands || 0 }}</span>
                     </div>
                 </div>
             </div>

src/views/system/airConditioner/index.vue

@@ -4,7 +4,7 @@
             <template #left>
                 <div style="height: 100%;display: flex;flex-direction: column;overflow: hidden;">
                     <consume :resultData="leftData" style="height: 35%;" />
-                    <running :resultData="MonitorList" style="flex: 1;" />
+                    <running :resultData="leftData.temperatureDevice" style="flex: 1;" />
                 </div>
             </template>
             <template #content>
@@ -12,9 +12,9 @@
             </template>
             <template #right>
                 <div style="height: 100%;display: flex;flex-direction: column;overflow: hidden;">
-                    <blowingIn :resultData="leftData.OnedayPowerConsumption" style="flex: 1;" />
-                    <energy :resultData="leftData.OnedayPowerConsumption" style="flex: 1;" />
-                    <temperatureTrend :resultData="leftData.OnedayWaterConsumption" style="flex: 1;" />
+                    <blowingIn :resultData="leftData" style="flex: 1;" />
+                    <energy :resultData="leftData.RunAnalyse" style="flex: 1;" />
+                    <temperatureTrend :resultData="leftData.EventList?.alarm" style="flex: 1;" />
                 </div>
             </template>
         </layout>
@@ -22,8 +22,7 @@
 </template>
 
 <script setup name="Air">
-import { getEnergy } from "@/api/system/energy"
-import { getAccess } from "@/api/system/passageway"
+import { getTemperature } from "@/api/system/airconditioner"
 import layout from "@/components/layout_/index.vue";
 import consume from './modules/consume.vue'
 import running from './modules/running.vue'
@@ -38,27 +37,19 @@ const MonitorList = ref([])
 onMounted(() => {
     intervalId.value = setInterval(getEnergyData, 10000);
     getEnergyData()
-    getAccessData()
 });
 onUnmounted(() => {
     clearInterval(intervalId.value);
 })
 function getEnergyData() {
-    getEnergy().then((res) => {
+    getTemperature().then((res) => {
         if (res.code == 200) {
+            console.log(res.data,887)
             leftData.value = res.data
         }
     })
 }
 
-function getAccessData() {
-    getAccess().then((res) => {
-        if (res.code == 200) {
-            MonitorList.value = res.data.DeviceList
-        }
-    })
-}
-
 </script>
 <style lang="scss">
 ._energy {

src/views/system/airConditioner/modules/blowingIn.vue

@@ -1,16 +1,38 @@
 <template>
-    <div class="_consume">
-        <HeadlineTag type="right" value="能耗趋势"></HeadlineTag>
-        <div class="_consume_mains">
-            <div ref="chartRef" style="width: 100%; height: 100%;"></div>
+    <div class="_running">
+        <HeadlineTag type="right" value="网关统计"></HeadlineTag>
+        <div class="_running_mains">
+            <div class="_running_mains_left" id="videoWidth" :style="{ '--heightRun': heightVideo + 'px' }">
+                <div class="_running_mains_left_tuan"></div>
+                <div class="_running_mains_left_conter">
+                    <div class="_running_mains_left_conter_num">{{ resultData.GatewayCount }}</div>
+                    <div class="_running_mains_left_conter_text">网关总量</div>
+                </div>
+            </div>
+            <div class="_running_mains_right">
+                <div class="_running_mains_right_item" v-for="item, index in runningList" :key="index">
+                    <div class="_running_mains_right_item_tuan">
+                        <span class="_running_mains_right_item_tuan_flag"
+                            :style="{ backgroundColor: item.color }"></span>
+                        <el-text class="w-150px mb-2" truncated style="color: #ccc;">
+                            {{ item.name }}
+                        </el-text>
+                    </div>
+                    <div class="_running_mains_right_item__txt">
+                        <span>{{ item.state }}</span>
+                        <span :style="{ color: item.color, 'font-size': '12px', 'margin-left': '5px' }">
+                            {{ item.unit }}
+                        </span>
+                    </div>
+                </div>
+            </div>
         </div>
     </div>
 </template>
 
 <script setup>
-import { ref, onMounted, onUnmounted } from 'vue';
-import * as echarts from 'echarts';
-import HeadlineTag from '@/components/HeadlineTag';
+import { ref } from "vue";
+import HeadlineTag from '@/components/HeadlineTag'
 const props = defineProps({
     resultData: {
         type: Object,
@@ -18,194 +40,112 @@ const props = defineProps({
     }
 })
 
-const chartRef = ref(null);
-let chart = null;
-const generateRandomData = (length, max) => {
-    const randomData = [];
-    for (let i = 0; i < length; i++) {
-        randomData.push(Math.floor(Math.random() * max));
-    }
-    return randomData;
-};
-const handleResize = () => {
-    if (chart) {
-        chart.resize();
-    }
-};
-onMounted(() => {
-    if (chartRef.value) {
-        chart = echarts.init(chartRef.value);
-        // 修改为 24 小时
-        // const hours = Array.from({ length: 24 }, (_, i) => `${i}时`);
-        const hours = []
-        const option = {
-            xAxis: {
-                type: 'category',
-                // 使用 24 小时数据
-                data: hours,
-                axisLabel: {
-                    color: '#fff'
-                },
-            },
-            tooltip: {
-                trigger: 'axis',
-                axisPointer: {
-                    type: 'cross',
-                    crossStyle: {
-                        color: '#999'
-                    }
-                },
-                textStyle: {
-                    color: '#fafafa',
-                },
-                borderColor: 'transparent',
-                backgroundColor: 'rgba(0, 0, 0, 0.5)',
-                extraCssText: 'backdrop-filter: blur(6px);',
-            },
-            grid: {
-                top: '10%',
-                bottom: '10%',
-                right: '0%',
-            },
-            yAxis: {
-                type: 'value',
-                axisLabel: {
-                    show: true,
-                    color: '#fff'
-                },
-                splitLine: {
-                    show: false,
-                    lineStyle: {
-                        color: '#44585e'
-                    }
-                },
-                axisTick: {
-                    show: false
-                },
-            },
-            series: [
-                {
-                    name: '24小时气能耗',
-                    // data: generateRandomData(7, 50),
-                    data: [],
-                    type: 'line',
-                    showSymbol: false,
-                    smooth: true,
-                    color: '#49e645',
-                    lineStyle: {
-                        width: 2,
-                    },
-                    areaStyle: {
-                        color: new echarts.graphic.LinearGradient(
-                            0,
-                            0,
-                            0,
-                            1,
-                            [{
-                                offset: 0,
-                                color: 'rgba(58, 226, 56, .6)',
-                            },
-                            {
-                                offset: 0.8,
-                                color: 'rgba(58, 226, 56, .2)',
-                            },
-                            ],
-                            false
-                        ),
-                        shadowColor: 'rgba(0, 0, 0, 0.1)',
-                        shadowBlur: 10,
-                    },
-                    symbol: 'circle',
-                    symbolSize: 6,
-                }
-            ]
-        };
-
-        chart.setOption(option);
-    }
-});
+const runningList = ref([
+    { name: '在线', state: 0, color: '#409eff', unit: '台' },
+    { name: '离线', state: 0, color: '#15acaa', unit: '台' },
+])
 
 watch(() => props.resultData, (newVal) => {
-    if (chart) {
-        chart.setOption({
-            xAxis: {
-                data: Object.keys(newVal),
-            },
-            series: [{
-                type: 'line',
-                data: Object.entries(newVal),
-            }],
-        })
+    if (newVal) {
+        runningList.value[0].state = newVal.GatewayOnline
+        runningList.value[1].state = newVal.GatewayOffline
     }
 }, { deep: true, immediate: true } // 开启深度监听
 )
-onUnmounted(() => {
-    window.removeEventListener('resize', handleResize);
-    if (chart) {
-        chart.dispose();
-    }
+const heightVideo = ref(0)
+// 生命周期
+onMounted(() => {
+    var element = document.getElementById("videoWidth");
+    var width = element.offsetWidth;
+    heightVideo.value = width
 });
 </script>
-
-<style lang="scss">
-._divider {
-    height: 1px;
-    border: 1px dashed #168cdb;
-    flex: 1;
-    margin: 0 10px;
-}
-
-._consume {
+<style lang="scss" scoped>
+._running {
     display: flex;
     flex-direction: column;
 
     &_mains {
-        margin: 10px 30px;
         flex: 1;
+        margin: 30px;
         display: flex;
+        align-items: center;
 
-        &_item {
-            display: flex;
-            justify-content: space-between;
-            align-items: center;
-            padding: 10px;
+        &_left {
+            width: 50%;
+            height: var(--heightRun);
+            position: relative;
 
-            &_name {
-                width: 30px;
-                height: 30px;
-                background: url("@/assets/images/content_circle_num.png");
+            &_tuan {
+                width: 100%;
+                height: 100%;
+                background: url("@/assets/images/content_circle.png");
                 background-size: 100% 100%;
                 background-position: center;
                 background-repeat: no-repeat;
-                // animation: scanning 4s linear infinite;
-                border: 1px solid red;
+                animation: scanning 4s linear infinite;
+            }
+
+            &_conter {
+                position: absolute;
+                left: 0;
+                top: 0;
+                flex-shrink: 0;
+                width: 100%;
+                height: 100%;
+                display: flex;
+                flex-direction: column;
+                align-items: center;
+                justify-content: center;
+                color: #fff;
+
+                &_num {
+                    font-size: 20px;
+                }
+
+                &_text {
+                    font-size: 15px;
+                }
             }
+        }
+
+        &_right {
+            margin-left: 10px;
+            flex: 1;
+            color: #fff;
 
-            &_flag {
+            &_item {
                 display: flex;
                 align-items: center;
-                gap: 3px;
-
-                &_item {
-                    width: 30px;
-                    height: 30px;
-                    border: 3px dashed #168cdb;
-                    box-sizing: border-box;
-                    background: #0e6ead;
-                    color: #fff;
-                    border-radius: 50%;
+                gap: 40px;
+                padding: 5px 0;
+
+                &_tuan {
                     display: flex;
                     align-items: center;
-                    justify-content: center;
-                    font-size: 14px;
+
+                    &_flag {
+                        display: block;
+                        width: 7px;
+                        height: 7px;
+                        border-radius: 50%;
+                        margin-right: 10px;
+                    }
+                }
+
+                &__txt {
+                    font-size: 24px;
                 }
             }
         }
 
-        &_item:hover {
-            cursor: pointer;
-            background-image: linear-gradient(to right, #168cdb, transparent);
-        }
+
+    }
+}
+
+@keyframes scanning {
+    to {
+        transform: rotate(1turn);
     }
 }
 </style>

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

@@ -5,7 +5,7 @@
             <div class="_running_mains_left" id="videoWidth" :style="{ '--heightRun': heightVideo + 'px' }">
                 <div class="_running_mains_left_tuan"></div>
                 <div class="_running_mains_left_conter">
-                    <div class="_running_mains_left_conter_num">{{ resultData.EnergyCount }}</div>
+                    <div class="_running_mains_left_conter_num">{{ resultData.DeviceCount }}</div>
                     <div class="_running_mains_left_conter_text">空调总量</div>
                 </div>
             </div>
@@ -47,8 +47,8 @@ const runningList = ref([
 
 watch(() => props.resultData, (newVal) => {
     if (newVal) {
-        runningList.value[0].state = newVal.CarbonEmissions
-        runningList.value[1].state = newVal.EnergyIntensity
+        runningList.value[0].state = newVal.DeviceOnLine
+        runningList.value[1].state = newVal.DeviceOffLine
     }
 }, { deep: true, immediate: true } // 开启深度监听
 )
@@ -100,11 +100,11 @@ onMounted(() => {
                 color: #fff;
 
                 &_num {
-                    font-size: 18px;
+                    font-size: 20px;
                 }
 
                 &_text {
-                    font-size: 12px;
+                    font-size: 15px;
                 }
             }
         }

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

@@ -1,6 +1,6 @@
 <template>
     <div class="_consume">
-        <HeadlineTag type="right" value="送风温度趋势"></HeadlineTag>
+        <HeadlineTag type="right" value="报警信息统计分析"></HeadlineTag>
         <div class="_consume_mains">
             <div ref="chartRef" style="width: 100%; height: 100%;"></div>
         </div>
@@ -66,6 +66,7 @@ onMounted(() => {
                 top: '10%',
                 bottom: '10%',
                 right: '0%',
+                left: '15%',
             },
             yAxis: {
                 type: 'value',
@@ -85,7 +86,7 @@ onMounted(() => {
             },
             series: [
                 {
-                    name: '24小时电能耗',
+                    name: '报警次数',
                     // data: generateRandomData(7, 50),
                     data: [],
                     type: 'line',
@@ -125,15 +126,26 @@ onMounted(() => {
     }
 });
 
+const getChartData = (electricityCount) => {
+    const dates = [];
+    const countData = [];
+    Object.entries(electricityCount || {}).forEach(([date, value]) => {
+        dates.push(value.time);
+        countData.push(value.count);
+    });
+
+    return { dates, countData };
+};
 watch(() => props.resultData, (newVal) => {
     if (chart) {
+        const { dates, countData } = getChartData(newVal);
         chart.setOption({
             xAxis: {
-                data: Object.keys(newVal),
+                data: dates,
             },
             series: [{
                 type: 'line',
-                data: Object.entries(newVal),
+                data: countData,
             }],
         })
     }
@@ -160,7 +172,7 @@ onUnmounted(() => {
     flex-direction: column;
 
     &_mains {
-        margin: 10px 30px;
+        margin: 10px;
         flex: 1;
         display: flex;
 

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

@@ -3,18 +3,18 @@
         <HeadlineTag value="空调设备列表" style="flex-shrink: 0;"></HeadlineTag>
         <div class="scroll-view" ref="scrollViewRef" @mouseenter="onMouseenter" @mouseleave="onMouseleave">
             <div ref="listRef" class="list" v-for="(p, n) in count" :key="n">
-                <div class="item" v-for="(item, index) in data" :key="index">
+                <div class="item" v-for="(item, index) in dataRunning" :key="index">
                     <div class="_eventList_mains_item_text view_item" style="width: 45%;">
                         <div :class="item.Id === 'on' ? '_success' : '_warning'"
                             class="_eventList_mains_item_text_flag"></div>
                         <el-text class="w-150px mb-2" truncated style="color: white;margin-left: 10px;">
-                            {{ index + 1 }}F#{{ item.Name }}
+                            {{ item.devices_name }}
                         </el-text>
                     </div>
                     <div style="justify-content: flex-start;width: 60px;"
-                        :class="item.State == 0 ? 'blue_title' : 'red_title'">
-                        {{ item.State == 0 ? '在线' : '离线' }}</div>
-                    <div class="view_item">{{ item.Date }}</div>
+                        :class="item.devices_enabled == 1 ? 'blue_title' : 'red_title'">
+                        {{ item.devices_enabled == 1 ? '在线' : '离线' }}</div>
+                    <div class="view_item" style="justify-content: flex-end;">{{ getTime(item.devices_created) }}</div>
                 </div>
             </div>
         </div>
@@ -30,7 +30,7 @@ const props = defineProps({
         default: []
     }
 })
-const data = ref(); //列表数据
+const dataRunning = ref([]); //列表数据
 const listRef = ref(); //列表dom
 const scrollViewRef = ref(); //滚动区域dom
 const count = ref(1); //列表个数
@@ -49,11 +49,17 @@ const getData = () => {
         }, 100);
     });
 };
-
+const getTime = (time) => {
+    const dateStr = time;
+    const date = new Date(dateStr);
+    const pad = n => n.toString().padStart(2, '0');
+    const format = `${date.getFullYear()}-${pad(date.getMonth() + 1)}-${pad(date.getDate())} ${pad(date.getHours())}:${pad(date.getMinutes())}:${pad(date.getSeconds())}`;
+    return format;
+}
 watch(() => props.resultData, (newVal) => {
     if (newVal) {
         // data.value = await getData();
-        data.value = newVal;
+        dataRunning.value = newVal;
         intervalId && clearInterval(intervalId);
         nextTick(() => {
             //判断列表是否生成滚动条

src/views/system/airConditioner/modules/temperatureTrend.vue

@@ -1,211 +1,243 @@
 <template>
-    <div class="_consume">
-        <HeadlineTag type="right" value="温度变化趋势"></HeadlineTag>
-        <div class="_consume_mains">
-            <div ref="chartRef" style="width: 100%; height: 100%;"></div>
+    <div class="_eventList">
+        <HeadlineTag type="right" value="报警列表" style="flex-shrink: 0;"></HeadlineTag>
+        <div class="scroll-view" ref="scrollViewRef" @mouseenter="onMouseenter" @mouseleave="onMouseleave">
+            <div ref="listRef" class="list" v-for="(p, n) in count" :key="n">
+                <div class="item" v-for="(item, index) in dataRunning" :key="index">
+                    <div class="_eventList_mains_item_text view_item" style="width: 45%;">
+                        <div :class="item.Id === 'on' ? '_success' : '_warning'"
+                            class="_eventList_mains_item_text_flag"></div>
+                        <el-text class="w-150px mb-2" truncated style="color: white;margin-left: 10px;">
+                            {{ item.full_region_name }}
+                        </el-text>
+                    </div>
+                    <div class="view_item_trend" style="width: 20%;">{{ item.alarm_title }}</div>
+                    <div class="view_item">{{ item.alarm_create_time }}</div>
+                </div>
+            </div>
         </div>
     </div>
 </template>
 
 <script setup>
-import { ref, onMounted, onUnmounted } from 'vue';
-import * as echarts from 'echarts';
-import HeadlineTag from '@/components/HeadlineTag';
+import { ref, onMounted, onUnmounted } from "vue";
+import HeadlineTag from '@/components/HeadlineTag'
 const props = defineProps({
     resultData: {
-        type: Object,
-        default: {}
+        type: Array,
+        default: []
     }
 })
+const dataRunning = ref([]); //列表数据
+const listRef = ref(); //列表dom
+const scrollViewRef = ref(); //滚动区域dom
+const count = ref(1); //列表个数
 
-const chartRef = ref(null);
-let chart = null;
-const generateRandomData = (length, max) => {
-    const randomData = [];
-    for (let i = 0; i < length; i++) {
-        randomData.push(Math.floor(Math.random() * max));
-    }
-    return randomData;
-};
-const handleResize = () => {
-    if (chart) {
-        chart.resize();
-    }
-};
-onMounted(() => {
-    if (chartRef.value) {
-        chart = echarts.init(chartRef.value);
-        // 修改为 24 小时
-        // const hours = Array.from({ length: 24 }, (_, i) => `${i}时`);
-        const hours = []
-        const option = {
-            xAxis: {
-                type: 'category',
-                // 使用 24 小时数据
-                data: hours,
-                axisLabel: {
-                    color: '#fff'
-                },
-            },
-            tooltip: {
-                trigger: 'axis',
-                axisPointer: {
-                    type: 'cross',
-                    crossStyle: {
-                        color: '#999'
-                    }
-                },
-                textStyle: {
-                    color: '#fafafa',
-                },
-                borderColor: 'transparent',
-                backgroundColor: 'rgba(0, 0, 0, 0.5)',
-                extraCssText: 'backdrop-filter: blur(6px);',
-            },
-            grid: {
-                top: '10%',
-                bottom: '10%',
-                right: '0%',
-            },
-            yAxis: {
-                type: 'value',
-                axisLabel: {
-                    show: true,
-                    color: '#fff'
-                },
-                splitLine: {
-                    show: false,
-                    lineStyle: {
-                        color: '#44585e'
-                    }
-                },
-                axisTick: {
-                    show: false
-                },
-            },
-            series: [
-                {
-                    name: '温度',
-                    // data: generateRandomData(7, 50),
-                    data: [],
-                    type: 'line',
-                    showSymbol: false,
-                    smooth: true,
-                    color: '#f5c400',
-                    lineStyle: {
-                        width: 2,
-                    },
-                    areaStyle: {
-                        color: new echarts.graphic.LinearGradient(
-                            0,
-                            0,
-                            0,
-                            1,
-                            [{
-                                offset: 0,
-                                color: 'rgba(245, 196, 0, .6)',
-                            },
-                            {
-                                offset: 0.8,
-                                color: 'rgba(245, 196, 0, .2)',
-                            },
-                            ],
-                            false
-                        ),
-                        shadowColor: 'rgba(0, 0, 0, 0.1)',
-                        shadowBlur: 10,
-                    },
-                    symbol: 'circle',
-                    symbolSize: 6,
-                }
-            ]
-        };
+let intervalId = null;
+let isAutoScrolling = true; //是否自动滚动标识
 
-        chart.setOption(option);
-    }
-});
+//获取列表数据
+const getData = () => {
+    //模拟接口请求列表数据
+    return new Promise((resolve, reject) => {
+        setTimeout(() => {
+            //生成10条数据
+            let list = new Array(30).fill().map((item, index) => index);
+            resolve(list);
+        }, 100);
+    });
+};
 
 watch(() => props.resultData, (newVal) => {
-    if (chart) {
-        chart.setOption({
-            xAxis: {
-                data: Object.keys(newVal),
-            },
-            series: [{
-                type: 'line',
-                data: Object.entries(newVal),
-            }],
-        })
+    if (newVal) {
+        // data.value = await getData();
+        dataRunning.value = newVal;
+        intervalId && clearInterval(intervalId);
+        nextTick(() => {
+            //判断列表是否生成滚动条
+            count.value = hasScrollBar() ? 2 : 1;
+            //有滚动条开始自动滚动
+            if (count.value == 2) {
+                autoScrolling();
+            }
+        });
     }
 }, { deep: true, immediate: true } // 开启深度监听
 )
-onUnmounted(() => {
-    window.removeEventListener('resize', handleResize);
-    if (chart) {
-        chart.dispose();
-    }
+onMounted(() => {
+})
+//判断列表是否有滚动条
+const hasScrollBar = () => {
+    return scrollViewRef.value.scrollHeight > scrollViewRef.value.clientHeight;
+};
+//设置自动滚动
+const autoScrolling = () => {
+    intervalId = setInterval(() => {
+        if (scrollViewRef.value.scrollTop < listRef.value[0].clientHeight) {
+            scrollViewRef.value.scrollTop += isAutoScrolling ? 1 : 0;
+        } else {
+            scrollViewRef.value.scrollTop = 0;
+        }
+    }, 20);
+};
+
+onBeforeUnmount(() => {
+    //离开页面清理定时器
+    intervalId && clearInterval(intervalId);
 });
+
+//鼠标进入，停止滚动
+const onMouseenter = () => {
+    isAutoScrolling = false;
+};
+//鼠标移出，继续滚动
+const onMouseleave = () => {
+    isAutoScrolling = true;
+};
 </script>
 
-<style lang="scss">
-._divider {
-    height: 1px;
-    border: 1px dashed #168cdb;
-    flex: 1;
-    margin: 0 10px;
+<style lang="scss" scoped>
+._success {
+    background: #15acaa;
 }
 
-._consume {
+._warning {
+    background: #FFC107;
+}
+
+._eventList {
+    overflow: hidden;
     display: flex;
     flex-direction: column;
 
     &_mains {
         margin: 10px 30px;
-        flex: 1;
-        display: flex;
+        overflow: hidden; // 隐藏溢出内容
+        // 鼠标移入时改变手势
+        cursor: pointer;
 
         &_item {
             display: flex;
             justify-content: space-between;
             align-items: center;
-            padding: 10px;
-
-            &_name {
-                width: 30px;
-                height: 30px;
-                background: url("@/assets/images/content_circle_num.png");
-                background-size: 100% 100%;
-                background-position: center;
-                background-repeat: no-repeat;
-                // animation: scanning 4s linear infinite;
-                border: 1px solid red;
-            }
+            padding: 10px 0;
 
-            &_flag {
+            &_text {
                 display: flex;
+                justify-content: space-between;
                 align-items: center;
-                gap: 3px;
 
-                &_item {
-                    width: 30px;
-                    height: 30px;
-                    border: 3px dashed #168cdb;
-                    box-sizing: border-box;
-                    background: #0e6ead;
-                    color: #fff;
+                &_flag {
+                    width: 10px;
+                    height: 10px;
                     border-radius: 50%;
-                    display: flex;
-                    align-items: center;
-                    justify-content: center;
-                    font-size: 14px;
+                    margin-left: 10px;
+                }
+
+                &_p {
+                    margin-left: 10px;
                 }
             }
-        }
 
-        &_item:hover {
-            cursor: pointer;
-            background-image: linear-gradient(to right, #168cdb, transparent);
+            &_btn {
+                color: red;
+                display: flex;
+                font-size: 14px;
+                gap: 20px;
+
+                &_item {
+                    border-radius: 5px;
+                    cursor: pointer;
+                }
+            }
         }
     }
 }
+
+.header-view {
+    margin-top: 10px;
+    width: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 10px 10px 10px 20px;
+    background-color: rgba(16, 40, 92, 1);
+}
+
+.view_item {
+    // flex: 1;
+    display: flex;
+    align-items: center;
+    justify-content: flex-start;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    overflow: hidden;
+    width: 33%;
+}
+
+.view_item_trend {
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    overflow: hidden;
+}
+
+.warning-view {
+    width: 100%;
+    height: calc(100% - 51px);
+    display: flex;
+    flex-direction: column;
+}
+
+.label {
+    color: #fff;
+    padding: 20px;
+    font-size: 22px;
+}
+
+.scroll-view {
+    flex: 1;
+    height: 0;
+    width: 100%;
+    overflow-y: auto;
+}
+
+.list {
+    width: 100%;
+    box-sizing: border-box;
+}
+
+.item {
+    padding: 0px 10px 0px 20px;
+    width: 100%;
+    height: 50px;
+    min-height: 50px;
+    font-size: 15px;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    color: #eee;
+}
+
+.item:nth-child(even) {
+    background: rgba(16, 40, 92, 0.4);
+}
+
+.item:hover {
+    cursor: pointer;
+    background-image: linear-gradient(to right, #168cdb, transparent);
+}
+
+/*隐藏滚动条
+ */
+::-webkit-scrollbar {
+    display: none;
+}
+
+.blue_title {
+    color: #67C23A;
+}
+
+.red_title {
+    color: #F56C6C;
+}
 </style>

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

@@ -9,7 +9,8 @@
                 <div class="view_item" v-for="(item, index) in headerList" :key="index">{{ item }}</div>
             </div>
             <div class="warning-view">
-                <div class="scroll-view" ref="scrollViewRef" @mouseenter="onMouseenter" @mouseleave="onMouseleave">
+                <div class="scroll-view" ref="scrollViewRef" v-if="data && data.length > 0" @mouseenter="onMouseenter"
+                    @mouseleave="onMouseleave">
                     <div ref="listRef" class="list" v-for="(p, n) in count" :key="n">
                         <div class="item" v-for="(item, index) in data" :key="index">
                             <div class="content view_item">
@@ -27,6 +28,7 @@
                         </div>
                     </div>
                 </div>
+                <Empty :bottom="true" v-else></Empty>
             </div>
         </div>
     </div>
@@ -36,6 +38,7 @@
 import { ref, onBeforeMount, onMounted, onBeforeUnmount, nextTick } from "vue";
 import HeadlineTag from '@/components/HeadlineTag'
 import { Headset, Aim } from '@element-plus/icons-vue'
+import Empty from '@/components/Empty'
 const props = defineProps({
     resultData: {
         type: Array,

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

@@ -1,7 +1,8 @@
 <template>
     <div class="_eventList">
         <HeadlineTag type="right" value="终端日志" style="flex-shrink: 0;"></HeadlineTag>
-        <div class="scroll-view" ref="scrollViewRef" @mouseenter="onMouseenter" @mouseleave="onMouseleave">
+        <div class="scroll-view" ref="scrollViewRef" v-if="data && data.length > 0" @mouseenter="onMouseenter"
+            @mouseleave="onMouseleave">
             <div ref="listRef" class="list" v-for="(p, n) in count" :key="n">
                 <div class="item" v-for="(item, index) in data" :key="index">
                     <div class="_eventList_mains_item_text">
@@ -17,12 +18,14 @@
                 </div>
             </div>
         </div>
+        <Empty :bottom="true" v-else></Empty>
     </div>
 </template>
 
 <script setup>
 import { ref, onBeforeMount, onMounted, onBeforeUnmount, nextTick } from "vue";
 import HeadlineTag from '@/components/HeadlineTag'
+import Empty from '@/components/Empty'
 const props = defineProps({
     resultData: {
         type: Array,

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

@@ -1,7 +1,7 @@
 <template>
     <div class="_eventList">
         <HeadlineTag type="right" value="播放控制" style="flex-shrink: 0;"></HeadlineTag>
-        <div class="scroll-view" ref="scrollViewRef" @mouseenter="onMouseenter" @mouseleave="onMouseleave">
+        <div class="scroll-view" ref="scrollViewRef" v-if="data && data.length > 0" @mouseenter="onMouseenter" @mouseleave="onMouseleave">
             <div ref="listRef" class="list" v-for="(p, n) in count" :key="n">
                 <div class="item" v-for="(item, index) in data" :key="index">
                     <div class="_eventList_mains_item_text">
@@ -23,12 +23,15 @@
                 </div>
             </div>
         </div>
+        <Empty :bottom="true" v-else></Empty>
     </div>
 </template>
 
 <script setup>
 import { ref, onMounted, onUnmounted } from "vue";
 import HeadlineTag from '@/components/HeadlineTag'
+import { Microphone, Mute } from '@element-plus/icons-vue'
+import Empty from '@/components/Empty'
 const props = defineProps({
     resultData: {
         type: Array,

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

@@ -1,9 +1,10 @@
 <template>
     <div class="_consume">
         <HeadlineTag value="终端离线(周)"></HeadlineTag>
-        <div class="_consume_mains">
+        <div class="_consume_mains" v-if="resultData && Object.keys(resultData).length != 0">
             <div ref="chartRef" style="width: 100%; height: 100%;"></div>
         </div>
+        <Empty :bottom="true" v-else></Empty>
     </div>
 </template>
 
@@ -11,6 +12,7 @@
 import { ref, onMounted, onUnmounted } from 'vue';
 import * as echarts from 'echarts';
 import HeadlineTag from '@/components/HeadlineTag';
+import Empty from '@/components/Empty'
 const props = defineProps({
     resultData: {
         type: Object,

src/views/system/building/index.vue

@@ -8,9 +8,13 @@
                         <div class="point_box" style="margin-top: 10px;margin-left: 15px;">
                             <el-input v-model="input" placeholder="按设备名称搜索" />
                         </div>
-                        <div style="height: calc(100% - 85px);">
+                        <div style="height: calc(100% - 85px);"
+                            v-if="leftData.DeviceList && leftData.DeviceList.length > 0">
                             <equipment :resultData="leftData.DeviceList"></equipment>
                         </div>
+                        <div style="height: calc(100% - 160px);" v-else>
+                            <Empty :bottom="true"></Empty>
+                        </div>
                         <!-- <div style="height: calc(100% - 160px);">
                                 <Empty></Empty>
                             </div>
@@ -50,13 +54,17 @@
                     <div class="flex_spection" style="height: 33%;">
                         <HeadlineTag type="right" value="设备群控"></HeadlineTag>
                         <div class="box_arch">
-                            <groupControl :resultData="leftData.DeviceList"></groupControl>
+                            <groupControl :resultData="leftData.DeviceList"
+                                v-if="leftData.DeviceList && leftData.DeviceList.length > 0"></groupControl>
+                            <Empty :bottom="true" v-else></Empty>
                         </div>
                     </div>
                     <div class="flex_spection" style="height: 33%;">
                         <HeadlineTag type="right" value="运行事件"></HeadlineTag>
                         <div class="box_arch">
-                            <incident :resultData="leftData.DeviceList"></incident>
+                            <incident :resultData="leftData.DeviceList"
+                                v-if="leftData.DeviceList && leftData.DeviceList.length > 0"></incident>
+                            <Empty :bottom="true" v-else></Empty>
                         </div>
                     </div>
                 </div>

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

@@ -1,16 +1,18 @@
 <template>
     <div class="_consume">
         <HeadlineTag value="运行状态(周)"></HeadlineTag>
-        <div class="_consume_mains">
+        <div class="_consume_mains" v-if="resultData && Object.keys(resultData).length != 0">
             <div ref="chartRef" style="width: 100%; height: 100%;"></div>
         </div>
+        <Empty :bottom="true" v-else></Empty>
     </div>
 </template>
 
 <script setup>
-import { ref, onMounted, onUnmounted } from 'vue';
+import { ref, onMounted, onUnmounted,nextTick } from 'vue';
 import * as echarts from 'echarts';
 import HeadlineTag from '@/components/HeadlineTag';
+import Empty from '@/components/Empty'
 
 const props = defineProps({
     resultData: {
@@ -34,10 +36,13 @@ const handleResize = () => {
     }
 };
 onMounted(() => {
+    initChart();
+});
+const  initChart = (xAxisData, dataVal,dataNew) => {
     if (chartRef.value) {
         chart = echarts.init(chartRef.value);
         // 生成一周的日期数据
-        const weekDays = [];
+        const weekDays = xAxisData;
         const option = {
             xAxis: {
                 type: 'category',
@@ -87,7 +92,7 @@ onMounted(() => {
                 {
                     name: '运行正常',
                     type: 'bar',
-                    data: [],
+                    data: dataVal,
                     barWidth: '30%',
                     itemStyle: {
                         color: {
@@ -110,7 +115,7 @@ onMounted(() => {
                 {
                     name: '运行异常',
                     type: 'line',
-                    data: [],
+                    data: dataNew,
                     lineStyle: {
                         color: '#216b87',
                     },
@@ -142,13 +147,18 @@ onMounted(() => {
         chart.setOption(option);
     }
     window.addEventListener('resize', handleResize);
-});
+}
 const flagSion = ref(false)
 watch(() => props.resultData, (newVal) => {
     function isEmptyObject(obj) {
         return Object.keys(obj).length === 0;
     }
     flagSion.value = isEmptyObject(newVal)
+    if (newVal && chart == null) {
+            nextTick(() => {
+                initChart(Object.keys(newVal), Object.entries(newVal),Object.entries(newVal));
+            });
+        }
     if (chart) {
         chart.setOption({
             xAxis: {

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

@@ -1,9 +1,10 @@
 <template>
     <div class="_consume">
         <HeadlineTag type="right" value="超载预警(周)"></HeadlineTag>
-        <div class="_consume_mains">
+        <div class="_consume_mains" v-if="resultData && Object.keys(resultData).length != 0">
             <div ref="chartRef" style="width: 100%; height: 100%;"></div>
         </div>
+        <Empty :bottom="true" v-else></Empty>
     </div>
 </template>
 
@@ -11,6 +12,7 @@
 import { ref, onMounted, onUnmounted } from 'vue';
 import * as echarts from 'echarts';
 import HeadlineTag from '@/components/HeadlineTag';
+import Empty from '@/components/Empty'
 const props = defineProps({
     resultData: {
         type: Object,
@@ -33,11 +35,12 @@ const handleResize = () => {
     }
 };
 onMounted(() => {
+    initChart();
+});
+const initChart = (xAxisData, EPEValue) => {
     if (chartRef.value) {
         chart = echarts.init(chartRef.value);
-        // 生成一周的日期数据
-        // const weekDays = ['周一', '周二', '周三', '周四', '周五', '周六', '周日'];
-        const weekDays = [];
+        const weekDays = xAxisData;
         const option = {
             xAxis: {
                 type: 'category',
@@ -88,7 +91,7 @@ onMounted(() => {
                     name: '超载预警次数',
                     type: 'line',
                     // data: generateRandomData(7, 50),
-                    data: [],
+                    data: EPEValue,
                     lineStyle: {
                         color: '#3b90d7',
                     },
@@ -121,9 +124,13 @@ onMounted(() => {
         chart.setOption(option);
     }
     window.addEventListener('resize', handleResize);
-});
-
+}
 watch(() => props.resultData, (newVal) => {
+    if (newVal && chart == null) {
+        nextTick(() => {
+            initChart(Object.keys(newVal), Object.entries(newVal));
+        });
+    }
     if (chart) {
         chart.setOption({
             xAxis: {

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

@@ -5,7 +5,7 @@
             <div class="_running_mains_left">
                 <dv-decoration-9 style="width:150px;height:150px;">
                     <div class="_running_mains_left_conter">
-                        <div class="_running_mains_left_conter_num">{{ resultData.ElevatorCount }}</div>
+                        <div class="_running_mains_left_conter_num">{{ resultData.ElevatorCount || 0 }}</div>
                         <div class="_running_mains_left_conter_text">电梯总量</div>
                     </div>
                 </dv-decoration-9>
@@ -20,9 +20,10 @@
                         </el-text>
                     </div>
                     <div class="_running_mains_right_item__txt">
-                        <span>{{ item.state }}</span>
-                        <span :style="{ color: item.color, 'font-size': '12px', 'margin-left': '5px' }">{{ item.unit
-                            }}</span>
+                        <span>{{ item.state || 0 }}</span>
+                        <span :style="{ color: item.color, 'font-size': '12px', 'margin-left': '5px' }">
+                            {{ item.unit || 0 }}
+                        </span>
                     </div>
                 </div>
             </div>

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

@@ -1,9 +1,10 @@
 <template>
     <div class="_consume">
         <HeadlineTag type="right" value="异常震动(周)"></HeadlineTag>
-        <div class="_consume_mains">
+        <div class="_consume_mains" v-if="resultData && Object.keys(resultData).length != 0">
             <div ref="chartRef" style="width: 100%; height: 100%;"></div>
         </div>
+        <Empty :bottom="true" v-else></Empty>
     </div>
 </template>
 
@@ -11,6 +12,7 @@
 import { ref, onMounted, onUnmounted } from 'vue';
 import * as echarts from 'echarts';
 import HeadlineTag from '@/components/HeadlineTag';
+import Empty from '@/components/Empty'
 const props = defineProps({
     resultData: {
         type: Object,
@@ -33,10 +35,14 @@ const handleResize = () => {
     }
 };
 onMounted(() => {
+    initChart();
+});
+
+const initChart = (xAxisData, EPEValue) => {
     if (chartRef.value) {
         chart = echarts.init(chartRef.value);
         // 生成一周的日期数据
-        const weekDays = [];
+        const weekDays = xAxisData;
         const option = {
             xAxis: {
                 type: 'category',
@@ -87,7 +93,7 @@ onMounted(() => {
                     name: '异常震动次数',
                     type: 'line',
                     // data: generateRandomData(7, 50),
-                    data: [],
+                    data: EPEValue,
                     lineStyle: {
                         color: '#de4337',
                     },
@@ -119,9 +125,13 @@ onMounted(() => {
         chart.setOption(option);
     }
     window.addEventListener('resize', handleResize);
-});
-
+}
 watch(() => props.resultData, (newVal) => {
+    if (newVal && chart == null) {
+        nextTick(() => {
+            initChart(Object.keys(newVal), Object.entries(newVal));
+        });
+    }
     if (chart) {
         chart.setOption({
             xAxis: {

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

@@ -1,9 +1,10 @@
 <template>
     <div class="_consume">
         <HeadlineTag type="right" value="困人告警(周)"></HeadlineTag>
-        <div class="_consume_mains">
+        <div class="_consume_mains" v-if="resultData && Object.keys(resultData).length != 0">
             <div ref="chartRef" style="width: 100%; height: 100%;"></div>
         </div>
+        <Empty :bottom="true" v-else></Empty>
     </div>
 </template>
 
@@ -11,6 +12,7 @@
 import { ref, onMounted, onUnmounted } from 'vue';
 import * as echarts from 'echarts';
 import HeadlineTag from '@/components/HeadlineTag';
+import Empty from '@/components/Empty'
 const props = defineProps({
     resultData: {
         type: Object,
@@ -33,10 +35,14 @@ const handleResize = () => {
     }
 };
 onMounted(() => {
+    initChart();
+});
+
+const initChart = (xAxisData, EPEValue) => {
     if (chartRef.value) {
         chart = echarts.init(chartRef.value);
         // 生成一周的日期数据
-        const weekDays = [];
+        const weekDays = xAxisData;
         const option = {
             xAxis: {
                 type: 'category',
@@ -86,7 +92,7 @@ onMounted(() => {
                 {
                     name: '困人告警次数',
                     type: 'line',
-                    data: [],
+                    data: EPEValue,
                     lineStyle: {
                         color: '#ffc107',
                     },
@@ -118,9 +124,13 @@ onMounted(() => {
         chart.setOption(option);
     }
     window.addEventListener('resize', handleResize);
-});
-
+}
 watch(() => props.resultData, (newVal) => {
+    if (newVal && chart == null) {
+        nextTick(() => {
+            initChart(Object.keys(newVal), Object.entries(newVal));
+        });
+    }
     if (chart) {
         chart.setOption({
             xAxis: {

src/views/system/energy/index.vue

@@ -3,8 +3,8 @@
         <layout>
             <template #left>
                 <div style="height: 100%;display: flex;flex-direction: column;overflow: hidden;">
-                    <consumptionWater :resultData="leftData.OnedayWaterConsumption" style="flex: 1;" />
-                    <consumptionPower :resultData="leftData.OnedayPowerConsumption" style="flex: 1;" />
+                    <consumptionWater :resultData="leftData.waterCount" style="flex: 1;" />
+                    <consumptionPower :resultData="leftData.electricityCount" style="flex: 1;" />
                     <sameDay :resultData="leftData.OnedayWaterConsumption" style="flex: 1;" />
                 </div>
             </template>
@@ -14,8 +14,8 @@
             <template #right>
                 <div style="height: 100%;display: flex;flex-direction: column;overflow: hidden;">
                     <running :resultData="leftData" style="flex: 1;" />
-                    <consume :resultData="leftData" style="flex: 1;" />
-                    <carbonEmission :resultData="leftData" style="flex: 1;" />
+                    <consume :resultData="leftData.waterNight" style="flex: 1;" />
+                    <carbonEmission :resultData="leftData.electricityNight" style="flex: 1;" />
                 </div>
             </template>
         </layout>
@@ -36,17 +36,21 @@ const intervalId = ref(null)
 const leftData = ref({})
 // 生命周期
 onMounted(() => {
-    intervalId.value = setInterval(getEnergyData, 10000);
     getEnergyData()
 });
 onUnmounted(() => {
     clearInterval(intervalId.value);
 })
 function getEnergyData() {
+    clearInterval(intervalId.value);
     getEnergy().then((res) => {
         if (res.code == 200) {
             leftData.value = res.data
+            intervalId.value = setInterval(getEnergyData, 30000);
         }
+    }).catch(() => {
+        intervalId.value = null
+        getEnergyData()
     })
 }
 </script>

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

@@ -1,16 +1,18 @@
 <template>
     <div class="_consume">
-        <HeadlineTag type="right" value="碳排趋势(年)"></HeadlineTag>
-        <div class="_consume_mains">
+        <HeadlineTag type="right" value="用电量昼夜分析"></HeadlineTag>
+        <div class="_consume_mains" v-if="resultData && Object.keys(resultData).length != 0">
             <div ref="chartRef" style="width: 100%; height: 100%;"></div>
         </div>
+        <Empty :bottom="true" v-else></Empty>
     </div>
 </template>
 
 <script setup>
-import { ref, onMounted, onUnmounted } from 'vue';
+import { ref, onMounted, onUnmounted, nextTick } from 'vue';
 import * as echarts from 'echarts';
 import HeadlineTag from '@/components/HeadlineTag';
+import Empty from '@/components/Empty'
 const props = defineProps({
     resultData: {
         type: Object,
@@ -32,9 +34,12 @@ const handleResize = () => {
     }
 };
 onMounted(() => {
+    initChart();
+});
+
+const initChart = (dates, waterData, totalUsage, dayUsage) => {
     if (chartRef.value) {
         chart = echarts.init(chartRef.value);
-        // const months = ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'];
         const months = []
         const option = {
             xAxis: {
@@ -43,6 +48,10 @@ onMounted(() => {
                 axisLabel: {
                     color: '#fff'
                 },
+                axisPointer: {
+                    type: 'shadow'
+                },
+                data: dates,
             },
             tooltip: {
                 trigger: 'axis',
@@ -63,103 +72,142 @@ onMounted(() => {
             grid: {
                 top: '10%', // 减小顶部边距，让图表向上扩展
                 bottom: '10%', // 减小底部边距，让图表向下扩展
-                right: '0%',
+                left: '16%',
+                right: '10%',
             },
-            yAxis: {
-                type: 'value',
-                axisLabel: {
-                    show: true, // 不显示刻度标签
-                    color: '#fff'
-                },
-                // 配置 Y 轴网格刻线
-                splitLine: {
-                    show: false, // 显示网格刻线
-                    lineStyle: {
-                        color: '#44585e' // 设置网格刻线颜色 
+            yAxis: [
+                {
+                    name: '能耗量',
+                    type: 'value',
+                    axisLabel: {
+                        formatter: '{value}kW.h',
+                        color: '#fff'
+                    },
+                    splitLine: {
+                        show: false,
                     }
                 },
-                axisTick: {
-                    show: false // 不显示刻度线
-                },
-            },
+                {
+                    name: '百分比',
+                    type: 'value',
+                    axisLabel: {
+                        formatter: '{value}%',
+                        color: '#fff'
+                    },
+                    splitLine: {
+                        show: false,
+                    }
+                }
+            ],
             series: [
                 // 单根柱状图
                 {
-                    name: '当年',
+                    name: '昼间能耗',
                     type: 'bar',
-                    // data: generateRandomData(12, 50),
-                    data: [],
+                    stack: 'BB',
+                    data: waterData,
                     barWidth: '30%',
-                    itemStyle: {
-                        color: {
-                            type: 'linear',
-                            x: 0,
-                            y: 0,
-                            x2: 0,
-                            y2: 1,
-                            colorStops: [{
-                                offset: 0, color: '#28c928' // 0% 处的颜色
-                            }, {
-                                offset: 1, color: '#89f87c' // 100% 处的颜色
-                            }],
-                            global: false // 缺省为 false
-                        },
-                        barBorderRadius: [10, 10, 10, 10]
-
+                    tooltip: {
+                        valueFormatter: function (value) {
+                            return value + 'kW.h';
+                        }
                     },
                 },
-                // 曲线
                 {
-                    name: '去年',
+                    name: '夜间能耗',
+                    type: 'bar',
+                    stack: 'BB',
+                    data: totalUsage,
+                    barWidth: '30%',
+                    tooltip: {
+                        valueFormatter: function (value) {
+                            return value + 'kW.h';
+                        }
+                    },
+                },
+                {
+                    name: '夜间能耗百分比',
                     type: 'line',
-                    // smooth: true,
-                    // data: generateRandomData(12, 50),
-                    data: [],
+                    yAxisIndex: 1,
+                    data: dayUsage,
                     lineStyle: {
-                        color: '#216b87',
-                        // 设置柱状图圆角
+                        width: 2,
+                        type: 'solid'
+                    },
+                    tooltip: {
+                        valueFormatter: function (value) {
+                            return value + '%';
+                        }
                     },
                     showSymbol: false,
                     smooth: true,
-                    areaStyle: {
-                        color: new echarts.graphic.LinearGradient(
-                            0,
-                            0,
-                            0,
-                            1,
-                            [{
-                                offset: 0,
-                                color: 'rgba(0, 247, 255, .6)',
-                            },
-                            {
-                                offset: 0.8,
-                                color: 'rgba(0, 247, 255, .2)',
-                            },
-                            ],
-                            false
-                        ),
-                        shadowColor: 'rgba(0, 0, 0, 0.1)',
-                        shadowBlur: 10,
-                    },
+                    yAxisIndex: 1,
                 }
             ]
         };
         chart.setOption(option);
     }
-});
-
+}
+const getChartData = (electricityCount) => {
+    const dates = [];
+    const waterData = [];
+    const dayUsage = [];
+    const totalUsage = [];
+    Object.entries(electricityCount || {}).forEach(([date, value]) => {
+        dates.push(value.time);
+        let dayWater = JSON.parse(value.day_usage);
+        waterData.push(dayWater.EPE)
+        let totalWater = JSON.parse(value.total_usage);
+        let water = (totalWater.EPE - dayWater.EPE).toFixed(2)
+        totalUsage.push(water);
+        let arr = ((dayWater.EPE / totalWater.EPE) * 100).toFixed(2)
+        if (arr == 'NaN') {
+            arr = '0'
+        }
+        dayUsage.push(arr || 0);
+    });
+    return { dates, dayUsage, waterData, totalUsage };
+};
 watch(() => props.resultData, (newVal) => {
+    const { dates, dayUsage, waterData, totalUsage } = getChartData(newVal);
+    if (newVal && chart == null) {
+        nextTick(() => {
+            initChart(dates, waterData, totalUsage, dayUsage);
+        });
+    }
     if (chart) {
         chart.setOption({
             xAxis: {
-                data: Object.keys(newVal.LastYearCarbonEmissions),
+                data: dates,
             },
             series: [{
-                name: '当年',
-                data: Object.entries(newVal.YearCarbonEmissions),
+                name: '昼间能耗',
+                stack: 'BB',
+                tooltip: {
+                    valueFormatter: function (value) {
+                        return value + 'kW.h';
+                    }
+                },
+                data: waterData,
             }, {
-                name: '去年',
-                data: Object.entries(newVal.LastYearCarbonEmissions),
+                name: '夜间能耗',
+                stack: 'BB',
+                tooltip: {
+                    valueFormatter: function (value) {
+                        return value + 'kW.h';
+                    }
+                },
+                data: totalUsage,
+            }, {
+                name: '夜间能耗百分比',
+                tooltip: {
+                    valueFormatter: function (value) {
+                        return value + '%';
+                    }
+                },
+                data: dayUsage,
+                type: 'line',
+                yAxisIndex: 1,
             }],
         })
     }
@@ -186,7 +234,7 @@ onUnmounted(() => {
     flex-direction: column;
 
     &_mains {
-        margin: 10px 30px;
+        margin: 10px 10px;
         flex: 1;
         display: flex;
 

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

@@ -1,16 +1,18 @@
 <template>
     <div class="_consume">
-        <HeadlineTag type="right" value="能耗趋势(年)"></HeadlineTag>
-        <div class="_consume_mains">
+        <HeadlineTag type="right" value="用水量昼夜分析"></HeadlineTag>
+        <div class="_consume_mains" v-if="resultData && Object.keys(resultData).length != 0">
             <div ref="chartRef" style="width: 100%; height: 100%;"></div>
         </div>
+        <Empty :bottom="true" v-else></Empty>
     </div>
 </template>
 
 <script setup>
-import { ref, onMounted, onUnmounted } from 'vue';
+import { ref, onMounted, onUnmounted, nextTick } from 'vue';
 import * as echarts from 'echarts';
 import HeadlineTag from '@/components/HeadlineTag';
+import Empty from '@/components/Empty'
 const props = defineProps({
     resultData: {
         type: Object,
@@ -33,6 +35,9 @@ const handleResize = () => {
     }
 };
 onMounted(() => {
+    initChart();
+});
+const initChart = (dates, waterData, totalUsage, dayUsage) => {
     if (chartRef.value) {
         chart = echarts.init(chartRef.value);
         // const months = ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'];
@@ -44,6 +49,7 @@ onMounted(() => {
                 axisLabel: {
                     color: '#fff'
                 },
+                data: dates,
             },
             tooltip: {
                 trigger: 'axis',
@@ -64,102 +70,143 @@ onMounted(() => {
             grid: {
                 top: '10%', // 减小顶部边距，让图表向上扩展
                 bottom: '10%', // 减小底部边距，让图表向下扩展
-                right: '0%',
+                left: '15%',
+                right: '10%',
             },
-            yAxis: {
-                type: 'value',
-                axisLabel: {
-                    show: true, // 不显示刻度标签
-                    color: '#fff'
-                },
-                // 配置 Y 轴网格刻线
-                splitLine: {
-                    show: false, // 显示网格刻线
-                    lineStyle: {
-                        color: '#44585e' // 设置网格刻线颜色 
+            yAxis: [
+                {
+                    name: '能耗量',
+                    type: 'value',
+                    axisLabel: {
+                        formatter: '{value}m³',
+                        color: '#fff'
+                    },
+                    splitLine: {
+                        show: false,
                     }
                 },
-                axisTick: {
-                    show: false // 不显示刻度线
-                },
-            },
+                {
+                    name: '百分比',
+                    type: 'value',
+                    axisLabel: {
+                        formatter: '{value}%',
+                        color: '#fff'
+                    },
+                    splitLine: {
+                        show: false,
+                    }
+                }
+            ],
             series: [
                 // 单根柱状图
                 {
-                    name: '当年',
+                    name: '昼间能耗',
+                    type: 'bar',
+                    stack: 'BB',
+                    data: waterData,
+                    barWidth: '30%',
+                    tooltip: {
+                        valueFormatter: function (value) {
+                            return value + 'm³';
+                        }
+                    },
+                },
+                {
+                    name: '夜间能耗',
                     type: 'bar',
-                    // data: generateRandomData(12, 50),
-                    data: [],
+                    stack: 'BB',
+                    data: totalUsage,
                     barWidth: '30%',
-                    itemStyle: {
-                        color: {
-                            type: 'linear',
-                            x: 0,
-                            y: 0,
-                            x2: 0,
-                            y2: 1,
-                            colorStops: [{
-                                offset: 0, color: '#78befe' // 0% 处的颜色
-                            }, {
-                                offset: 1, color: '#0352fb' // 100% 处的颜色
-                            }],
-                            global: false // 缺省为 false
-                        },
-                        borderRadius: [10, 10, 10, 10]
+                    tooltip: {
+                        valueFormatter: function (value) {
+                            return value + 'm³';
+                        }
                     },
                 },
                 // 曲线
                 {
-                    name: '去年',
+                    name: '夜间能耗百分比',
                     type: 'line',
-                    // smooth: true,
-                    // data: generateRandomData(12, 50),
-                    data: [],
+                    data: dayUsage,
                     lineStyle: {
-                        color: '#cda23d',
-                        // 设置柱状图圆角
+                        width: 2,
+                        type: 'solid'
+                    },
+                    tooltip: {
+                        valueFormatter: function (value) {
+                            return value + '%';
+                        }
                     },
                     showSymbol: false,
                     smooth: true,
-                    areaStyle: {
-                        color: new echarts.graphic.LinearGradient(
-                            0,
-                            0,
-                            0,
-                            1,
-                            [{
-                                offset: 0,
-                                color: 'rgba(0, 247, 255, .6)',
-                            },
-                            {
-                                offset: 0.8,
-                                color: 'rgba(0, 247, 255, .2)',
-                            },
-                            ],
-                            false
-                        ),
-                        shadowColor: 'rgba(0, 0, 0, 0.1)',
-                        shadowBlur: 10,
-                    },
+                    yAxisIndex: 1,
                 }
             ]
         };
         chart.setOption(option);
     }
-});
+}
+const getChartData = (electricityCount) => {
+    const dates = [];
+    const waterData = [];
+    const dayUsage = [];
+    const totalUsage = [];
+    Object.entries(electricityCount || {}).forEach(([date, value]) => {
+        dates.push(value.time);
+        let dayWater = JSON.parse(value.day_usage);
+        waterData.push(dayWater.total_water)
+        let totalWater = JSON.parse(value.total_usage);
+        let water = (totalWater.total_water - dayWater.total_water).toFixed(2)
+        totalUsage.push(water);
+        let arr = ((dayWater.total_water / totalWater.total_water) * 100).toFixed(2)
+        if (arr == 'NaN') {
+            arr = '0'
+        }
+        dayUsage.push(arr);
+    });
 
+    return { dates, dayUsage, waterData, totalUsage };
+};
 watch(() => props.resultData, (newVal) => {
+    const { dates, dayUsage, waterData, totalUsage } = getChartData(newVal);
+    if (newVal && chart == null) {
+        nextTick(() => {
+            initChart(dates, waterData, totalUsage, dayUsage);
+        });
+    }
     if (chart) {
         chart.setOption({
             xAxis: {
-                data: Object.keys(newVal.YearEnergyConsumption),
+                data: dates,
             },
             series: [{
-                name: '当年',
-                data: Object.entries(newVal.YearEnergyConsumption),
+                name: '昼间能耗',
+                stack: 'BB',
+                tooltip: {
+                    valueFormatter: function (value) {
+                        return value + 'm³';
+                    }
+                },
+                data: waterData,
+            }, {
+                name: '夜间能耗',
+                stack: 'BB',
+                tooltip: {
+                    valueFormatter: function (value) {
+                        return value + 'm³';
+                    }
+                },
+                data: totalUsage,
             }, {
-                name: '去年',
-                data: Object.entries(newVal.LastYearEnergyConsumption),
+                name: '夜间能耗百分比',
+                tooltip: {
+                    valueFormatter: function (value) {
+                        return value + '%';
+                    }
+                },
+                data: dayUsage,
+                type: 'line',
+                yAxisIndex: 1,
             }],
         })
     }
@@ -186,7 +233,7 @@ onUnmounted(() => {
     flex-direction: column;
 
     &_mains {
-        margin: 10px 30px;
+        margin: 10px 10px;
         flex: 1;
         display: flex;
 

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

@@ -1,16 +1,18 @@
 <template>
     <div class="_consume">
-        <HeadlineTag value="24小时能耗-电/kWh"></HeadlineTag>
-        <div class="_consume_mains">
+        <HeadlineTag value="能耗-电/kWh(周)"></HeadlineTag>
+        <div class="_consume_mains" v-if="resultData && Object.keys(resultData).length != 0">
             <div ref="chartRef" style="width: 100%; height: 100%;"></div>
         </div>
+        <Empty :bottom="true" v-else></Empty>
     </div>
 </template>
 
 <script setup>
-import { ref, onMounted, onUnmounted } from 'vue';
+import { ref, onMounted, onUnmounted, nextTick } from 'vue';
 import * as echarts from 'echarts';
 import HeadlineTag from '@/components/HeadlineTag';
+import Empty from '@/components/Empty'
 const props = defineProps({
     resultData: {
         type: Object,
@@ -33,6 +35,9 @@ const handleResize = () => {
     }
 };
 onMounted(() => {
+    initChart();
+});
+const initChart = (dates, EPE) => {
     if (chartRef.value) {
         chart = echarts.init(chartRef.value);
         // 修改为 24 小时
@@ -46,6 +51,7 @@ onMounted(() => {
                 axisLabel: {
                     color: '#fff'
                 },
+                data: dates,
             },
             tooltip: {
                 trigger: 'axis',
@@ -61,6 +67,13 @@ onMounted(() => {
                 borderColor: 'transparent',
                 backgroundColor: 'rgba(0, 0, 0, 0.5)',
                 extraCssText: 'backdrop-filter: blur(6px);',
+                formatter: function (params) {
+                    let result = params[0].axisValue + '<br/>';
+                    params.forEach(item => {
+                        result += item.marker + item.seriesName + '：' + item.data + ' kW.h<br/>';
+                    });
+                    return result;
+                }
             },
             grid: {
                 top: '10%',
@@ -87,7 +100,7 @@ onMounted(() => {
                 {
                     name: '24小时电能耗',
                     // data: generateRandomData(7, 50),
-                    data: [],
+                    data: EPE,
                     type: 'line',
                     showSymbol: false,
                     smooth: true,
@@ -120,20 +133,37 @@ onMounted(() => {
                 }
             ]
         };
-
         chart.setOption(option);
     }
-});
+}
+// 假设 props.resultData.electricityCount 就是你给的数据
+const getChartData = (electricityCount) => {
+    const dates = [];
+    const EPE = [];
+    const EPE_forecast = [];
+    Object.entries(electricityCount || {}).forEach(([date, value]) => {
+        dates.push(date);
+        EPE.push(value.EPE);
+        EPE_forecast.push(value.EPE_forecast);
+    });
 
+    return { dates, EPE, EPE_forecast };
+};
 watch(() => props.resultData, (newVal) => {
+    const { dates, EPE, EPE_forecast } = getChartData(newVal);
+    if (newVal && chart == null) {
+        nextTick(() => {
+            initChart(dates, EPE);
+        });
+    }
     if (chart) {
         chart.setOption({
             xAxis: {
-                data: Object.keys(newVal),
+                data: dates,
             },
             series: [{
                 type: 'line',
-                data: Object.entries(newVal),
+                data: EPE,
             }],
         })
     }

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

@@ -1,16 +1,18 @@
 <template>
     <div class="_consume">
         <HeadlineTag value="24小时能耗-水/T"></HeadlineTag>
-        <div class="_consume_mains">
+        <div class="_consume_mains" v-if="resultData && Object.keys(resultData).length != 0">
             <div ref="chartRef" style="width: 100%; height: 100%;"></div>
         </div>
+        <Empty :bottom="true" v-else></Empty>
     </div>
 </template>
 
 <script setup>
-import { ref, onMounted, onUnmounted } from 'vue';
+import { ref, onMounted, onUnmounted, nextTick } from 'vue';
 import * as echarts from 'echarts';
 import HeadlineTag from '@/components/HeadlineTag';
+import Empty from '@/components/Empty'
 const props = defineProps({
     resultData: {
         type: Object,
@@ -35,6 +37,9 @@ const handleResize = () => {
 };
 
 onMounted(() => {
+    initChart();
+});
+const initChart = (dates, EPE) => {
     if (chartRef.value) {
         chart = echarts.init(chartRef.value);
         // 生成 24 小时的时间数据
@@ -48,6 +53,7 @@ onMounted(() => {
                 axisLabel: {
                     color: '#fff'
                 },
+                data: dates,
             },
             tooltip: {
                 trigger: 'axis',
@@ -63,6 +69,13 @@ onMounted(() => {
                 borderColor: 'transparent',
                 backgroundColor: 'rgba(0, 0, 0, 0.5)',
                 extraCssText: 'backdrop-filter: blur(6px);',
+                formatter: function (params) {
+                    let result = params[0].axisValue + '<br/>';
+                    params.forEach(item => {
+                        result += item.marker + item.seriesName + '：' + item.data + ' m3<br/>';
+                    });
+                    return result;
+                }
             },
             grid: {
                 top: '10%',
@@ -91,7 +104,7 @@ onMounted(() => {
                     type: 'line',
                     // 生成 24 个随机数据
                     // data: generateRandomData(7, 50),
-                    data: [],
+                    data: EPE,
                     lineStyle: {
                         color: 'rgb(49, 143, 247)',
                     },
@@ -120,20 +133,36 @@ onMounted(() => {
                 }
             ]
         };
-
         chart.setOption(option);
     }
-});
+}
+const getChartData = (electricityCount) => {
+    const dates = [];
+    const EPE = [];
+    const EPE_forecast = [];
+    Object.entries(electricityCount || {}).forEach(([date, value]) => {
+        dates.push(date);
+        EPE.push(value.EPE);
+        EPE_forecast.push(value.EPE_forecast);
+    });
 
+    return { dates, EPE, EPE_forecast };
+};
 watch(() => props.resultData, (newVal) => {
+    const { dates, EPE, EPE_forecast } = getChartData(newVal);
+    if (newVal && chart == null) {
+        nextTick(() => {
+            initChart(dates, EPE);
+        });
+    }
     if (chart) {
         chart.setOption({
             xAxis: {
-                data: Object.keys(newVal),
+                data: dates,
             },
             series: [{
                 type: 'line',
-                data: Object.entries(newVal),
+                data: EPE,
             }],
         })
     }

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

@@ -5,8 +5,8 @@
             <div class="_running_mains_left" id="runWidth" :style="{ '--heightRunning': heightRun + 'px' }">
                 <div class="_running_mains_left_tuan"></div>
                 <div class="_running_mains_left_conter">
-                    <div class="_running_mains_left_conter_num">{{resultData.EnergyCount}}</div>
-                    <div class="_running_mains_left_conter_text">能源总量</div>
+                    <div class="_running_mains_left_conter_num">{{ resultData.DeviceCount || 0 }}</div>
+                    <div class="_running_mains_left_conter_text">设备总数</div>
                 </div>
             </div>
             <div class="_running_mains_right">
@@ -19,7 +19,7 @@
                         </el-text>
                     </div>
                     <div class="_running_mains_right_item__txt">
-                        {{ item.state }}
+                        {{ item.state || 0 }}
                     </div>
                 </div>
             </div>
@@ -38,16 +38,16 @@ const props = defineProps({
 })
 
 const runningList = ref([
-    { name: '水耗强度', state: 0, color: '#15acaa' },
-    { name: '电耗强度', state: 0, color: '#FFC107' },
-    { name: '气耗强度', state: 0, color: '#F44336' },
+    { name: '报警总数', state: 0, color: '#15acaa' },
+    { name: '网关总数', state: 0, color: '#FFC107' },
+    // { name: '房间', state: 0, color: '#F44336' },
 ])
 
 watch(() => props.resultData, (newVal) => {
     if (newVal) {
-        runningList.value[0].state = newVal.EnergyIntensity
-        runningList.value[1].state = newVal.CarbonEmissions
-        runningList.value[2].state = newVal.CarbonIsntensity
+        runningList.value[0].state = newVal.AlarmCount
+        runningList.value[1].state = newVal.GatewayCount
+        // runningList.value[2].state = newVal.MonthElectricityConsumption
     }
 }, { deep: true, immediate: true } // 开启深度监听
 )

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

@@ -1,16 +1,18 @@
 <template>
     <div class="_consume">
         <HeadlineTag value="24小时能耗-气/kPa"></HeadlineTag>
-        <div class="_consume_mains">
+        <div class="_consume_mains" v-if="resultData && Object.keys(resultData).length != 0">
             <div ref="chartRef" style="width: 100%; height: 100%;"></div>
         </div>
+        <Empty :bottom="true" v-else></Empty>
     </div>
 </template>
 
 <script setup>
-import { ref, onMounted, onUnmounted } from 'vue';
+import { ref, onMounted, onUnmounted, nextTick } from 'vue';
 import * as echarts from 'echarts';
 import HeadlineTag from '@/components/HeadlineTag';
+import Empty from '@/components/Empty'
 const props = defineProps({
     resultData: {
         type: Object,
@@ -33,6 +35,9 @@ const handleResize = () => {
     }
 };
 onMounted(() => {
+    initChart();
+});
+const initChart = (dates, EPE) => {
     if (chartRef.value) {
         chart = echarts.init(chartRef.value);
         // 修改为 24 小时
@@ -46,6 +51,7 @@ onMounted(() => {
                 axisLabel: {
                     color: '#fff'
                 },
+                data: dates,
             },
             tooltip: {
                 trigger: 'axis',
@@ -87,7 +93,7 @@ onMounted(() => {
                 {
                     name: '24小时气能耗',
                     // data: generateRandomData(7, 50),
-                    data: [],
+                    data: EPE,
                     type: 'line',
                     showSymbol: false,
                     smooth: true,
@@ -123,9 +129,13 @@ onMounted(() => {
 
         chart.setOption(option);
     }
-});
-
+}
 watch(() => props.resultData, (newVal) => {
+    if (newVal && chart == null) {
+        nextTick(() => {
+            initChart(Object.keys(newVal), Object.entries(newVal));
+        });
+    }
     if (chart) {
         chart.setOption({
             xAxis: {

src/views/system/entranceguard/equipment.vue

@@ -7,7 +7,7 @@
                 </div>
                 <div class="equip_ment">
                     <div class="equip_ment_title">设备总数</div>
-                    <span class="num_ment blue_title">{{ resultData.DeviceCount }}</span>
+                    <span class="num_ment blue_title">{{ resultData.DeviceCount || 0 }}</span>
                 </div>
             </div>
             <div class="card_ment_equip">
@@ -16,7 +16,7 @@
                 </div>
                 <div class="equip_ment">
                     <div class="equip_ment_title">在线</div>
-                    <span class="num_ment green_title">{{ resultData.Online }}</span>
+                    <span class="num_ment green_title">{{ resultData.Online || 0 }}</span>
                 </div>
             </div>
             <div class="card_ment_equip">
@@ -25,7 +25,7 @@
                 </div>
                 <div class="equip_ment">
                     <div class="equip_ment_title">异常</div>
-                    <span class="num_ment yellow_title">{{ resultData.Abnormal }}</span>
+                    <span class="num_ment yellow_title">{{ resultData.Abnormal || 0 }}</span>
                 </div>
             </div>
         </div>
@@ -34,7 +34,7 @@
                 <div class="header-view">
                     <div class="view_item" v-for="item in headerList" :key="item">{{ item }}</div>
                 </div>
-                <div class="warning-view">
+                <div class="warning-view" v-if="data && data.length > 0">
                     <div class="scroll-view" ref="scrollViewRef" @mouseenter="onMouseenter" @mouseleave="onMouseleave">
                         <div ref="listRef" class="list" v-for="(p, n) in count" :key="n">
                             <div class="item" v-for="(item, index) in data" :key="index">
@@ -47,12 +47,15 @@
                         </div>
                     </div>
                 </div>
+                <Empty :bottom="true" v-else></Empty>
             </div>
         </div>
     </div>
 </template>
 
 <script setup>
+import { ref, onMounted, onBeforeUnmount, nextTick, watch } from "vue";
+import Empty from '@/components/Empty'
 const props = defineProps({
     resultData: {
         type: Object,

src/views/system/entranceguard/index.vue

@@ -34,7 +34,9 @@
                     <div class="flex_spection" style="height: 33%;">
                         <HeadlineTag type="right" value="实时告警与通知"></HeadlineTag>
                         <div class="box_arch">
-                            <inform :resultData="leftData.devices"></inform>
+                            <inform :resultData="leftData.devices"
+                                v-if="leftData.devices && leftData.devices.length > 0"></inform>
+                            <Empty :bottom="true" v-else></Empty>
                         </div>
                     </div>
                 </div>
@@ -52,6 +54,7 @@ import equipment from './equipment'
 import inbreak from './inbreak'
 import passable from './passable'
 import inform from './inform'
+import Empty from '@/components/Empty'
 
 // 生命周期
 onMounted(() => {

src/views/system/entranceguard/passable.vue

@@ -7,7 +7,7 @@
                         <div class="blue_dot"></div>
                     </div>
                     <div class="monit_title">应到岗</div>
-                    <span class="monit_num">{{ resultData.Fault }}人</span>
+                    <span class="monit_num">{{ resultData.Fault || 0 }}人</span>
                 </div>
                 <div class="camera">
                     <div class="entry-box">
@@ -25,7 +25,7 @@
                         <div class="green_dot"></div>
                     </div>
                     <div class="monit_title">实际到岗</div>
-                    <span class="monit_num">{{ resultData.Offline }}人</span>
+                    <span class="monit_num">{{ resultData.Offline || 0 }}人</span>
                 </div>
             </div>
         </dv-border-box-1>

src/views/system/inspection/index.vue

@@ -8,7 +8,12 @@
             <div class="point_box" style="margin-top: 10px;margin-left: 15px;">
               <el-input v-model="input" placeholder="按巡查点名称搜索" />
             </div>
-            <point :resultData="leftData.DeviceList"></point>
+            <div v-if="leftData.DeviceList && Object.keys(leftData.DeviceList).length != 0">
+              <point :resultData="leftData.DeviceList"></point>
+            </div>
+            <div style="height: calc(100% - 160px);" v-else>
+              <Empty :bottom="true"></Empty>
+            </div>
             <!-- <div style="height: calc(100% - 160px);">
               <Empty></Empty>
             </div>
@@ -25,21 +30,21 @@
             <HeadlineTag type="right" value="运行统计"></HeadlineTag>
             <div class="box_arch">
               <div class="image_tubbiness">
-                <div class="work_num">{{ leftData.TodayTotal }}<span>个</span></div>
+                <div class="work_num">{{ leftData.TodayTotal || 0 }}<span>个</span></div>
                 <div class="work_title">今日总数</div>
               </div>
               <div class="right_content">
                 <div class="work_week">
                   <div class="color_line_xj" style="background-color: rgb(21, 213, 21);"></div>
-                  <span>巡检点数:</span>{{ leftData.InspectionPoints }}
+                  <span>巡检点数:</span>{{ leftData.InspectionPoints || 0 }}
                 </div>
                 <div class="work_week">
                   <div class="color_line_xj" style="background-color: rgb(196, 127, 19);"></div>
-                  <span>巡检计划:</span>{{ leftData.InspectionPlan }}
+                  <span>巡检计划:</span>{{ leftData.InspectionPlan || 0 }}
                 </div>
                 <div class="work_week">
                   <div class="color_line_xj" style="background-color: rgb(195, 56, 56);"></div>
-                  <span>巡检线路:</span>{{ leftData.InspectTheLine }}
+                  <span>巡检线路:</span>{{ leftData.InspectTheLine || 0 }}
                 </div>
               </div>
             </div>
@@ -52,9 +57,10 @@
           </div>
           <div class="flex_spection" style="height: 33%;">
             <HeadlineTag type="right" value="实时巡检"></HeadlineTag>
-            <div class="box_arch">
+            <div class="box_arch" v-if="leftData.realTime && leftData.realTime.length > 0">
               <polling :resultData="leftData.realTime"></polling>
             </div>
+            <Empty :bottom="true" v-else></Empty>
           </div>
         </div>
       </template>

src/views/system/intruderalarm/index.vue

@@ -15,7 +15,12 @@
                             <div class="point_box" style="margin-top: 10px;margin-left: 15px;">
                                 <el-input v-model="input" placeholder="按报警名称搜索" />
                             </div>
-                            <alarm :resultData="leftData.realTime"></alarm>
+                            <div v-if="leftData.realTime && Object.keys(leftData.realTime).length != 0">
+                                <alarm :resultData="leftData.realTime"></alarm>
+                            </div>
+                            <div style="height: calc(100% - 160px);" v-else>
+                                <Empty :bottom="true"></Empty>
+                            </div>
                             <!-- <div style="height: calc(100% - 160px);">
                                 <Empty></Empty>
                             </div>
@@ -66,9 +71,10 @@
                     </div>
                     <div class="flex_spection" style="height: 33%;">
                         <HeadlineTag type="right" value="实时监控"></HeadlineTag>
-                        <div class="box_arch">
+                        <div class="box_arch" v-if="leftData.realTime && Object.keys(leftData.realTime).length != 0">
                             <inspection :resultData="leftData.realTime"></inspection>
                         </div>
+                        <Empty :bottom="true" v-else></Empty>
                     </div>
                 </div>
             </template>
@@ -86,6 +92,7 @@ import alarm from './alarm.vue'
 import inspection from './inspection.vue'
 import * as echarts from 'echarts'
 import 'echarts-liquidfill';
+const route = useRoute()
 const total = ref(0);
 const queryParams = ref({
     pageNum: 1,
@@ -510,7 +517,6 @@ const initFacility = (data, total) => {
 }
 // 生命周期
 onMounted(() => {
-    intervalId.value = setInterval(getInvadeData, 10000);
     getInvadeData()
     initChart()
     initFacility()
@@ -521,9 +527,20 @@ onUnmounted(() => {
 const intervalId = ref(null)
 const leftData = ref({})
 function getInvadeData() {
+    clearInterval(intervalId.value);
     getInvade().then((res) => {
         if (res.code == 200) {
             leftData.value = res.data
+            if (route.path == '/system/intruderalarm') {
+                intervalId.value = setInterval(getInvadeData, 10000);
+            } else {
+                clearInterval(intervalId.value);
+            }
+        }
+    }).catch(() => {
+        if (route.path == '/system/intruderalarm') {
+            intervalId.value = null
+            getInvadeData()
         }
     })
 }

src/views/system/lighting/index.vue

@@ -13,7 +13,7 @@
                 <div style="height: 100%;display: flex;flex-direction: column;overflow: hidden;">
                     <running :resultData="leftData" style="flex: 1;" />
                     <switchAll :resultData="leftData.RunAnalyse" style="flex: 1;" />
-                    <eventList :resultData="leftData.EventList.alarm" style="flex: 1;" />
+                    <eventList :resultData="leftData.EventList?.alarm" style="flex: 1;" />
                 </div>
             </template>
         </layout>
@@ -27,12 +27,11 @@ import deviceList from './modules/deviceList.vue'
 import running from './modules/running.vue'
 import eventList from './modules/eventList.vue'
 import switchAll from './modules/switchAll.vue'
-
+const route = useRoute()
 const intervalId = ref(null)
 const leftData = ref({})
 // 生命周期
 onMounted(() => {
-    intervalId.value = setInterval(getIlluminatingData, 10000);
     getIlluminatingData()
 });
 onUnmounted(() => {
@@ -42,6 +41,16 @@ function getIlluminatingData() {
     getIlluminating().then((res) => {
         if (res.code == 200) {
             leftData.value = res.data
+            if (route.path == '/system/lighting') {
+                intervalId.value = setInterval(getIlluminatingData, 10000);
+            } else {
+                clearInterval(intervalId.value);
+            }
+        }
+    }).catch(() => {
+        if (route.path == '/system/lighting') {
+            intervalId.value = null
+            getIlluminatingData()
         }
     })
 }

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

@@ -4,7 +4,8 @@
         <div class="point_box" style="margin-top: 10px;">
             <el-input v-model="value" placeholder="按巡查点名称搜索" />
         </div>
-        <div class="scroll-view" ref="scrollViewRef" @mouseenter="onMouseenter" @mouseleave="onMouseleave">
+        <div class="scroll-view" ref="scrollViewRef" v-if="resultData.length > 0" @mouseenter="onMouseenter"
+            @mouseleave="onMouseleave">
             <div ref="listRef" class="list" v-for="(p, n) in count" :key="n">
                 <div class="item" v-for="(item, index) in data" :key="index">
                     <el-text class="w-150px mb-2 _table_row1" truncated style="color: white;flex: .4;">
@@ -25,6 +26,9 @@
                 </div>
             </div>
         </div>
+        <div class="scroll-view" v-else>
+            <Empty :bottom="true"></Empty>
+        </div>
     </div>
 </template>
 
@@ -32,6 +36,7 @@
 import { ref, onMounted, onUnmounted } from "vue";
 import HeadlineTag from '@/components/HeadlineTag'
 import { Opportunity, Aim } from '@element-plus/icons-vue'
+import Empty from '@/components/Empty'
 const props = defineProps({
     resultData: {
         type: Array,
@@ -115,6 +120,7 @@ const onMouseleave = () => {
     overflow: hidden;
     display: flex;
     flex-direction: column;
+    flex: 1;
 
     &_mains {
         margin: 10px 30px;

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

@@ -1,14 +1,15 @@
 <template>
     <div class="_eventList">
         <HeadlineTag type="right" value="报警记录" style="flex-shrink: 0;"></HeadlineTag>
-        <div class="scroll-view" ref="scrollViewRef" @mouseenter="onMouseenter" @mouseleave="onMouseleave">
+        <div class="scroll-view" ref="scrollViewRef" v-if="resultData.length > 0" @mouseenter="onMouseenter"
+            @mouseleave="onMouseleave">
             <div ref="listRef" class="list" v-for="(p, n) in count" :key="n">
                 <div class="item" v-for="(item, index) in data" :key="index">
                     <div class="_eventList_mains_item_text">
                         <div :class="item.DeviceStatus === 0 ? '_success' : '_warning'"
                             class="_eventList_mains_item_text_flag"></div>
                         <el-text class="w-150px mb-2" truncated style="color: white;margin-left: 10px;">
-                            {{ item.alarm_title	}}
+                            {{ item.alarm_title }}
                         </el-text>
                     </div>
                     <el-text class="w-150px mb-2" truncated style="color: white;">
@@ -17,12 +18,15 @@
                 </div>
             </div>
         </div>
+        <Empty :bottom="true" v-else></Empty>
     </div>
 </template>
 
 <script setup>
 import { ref, onMounted, onUnmounted } from "vue";
 import HeadlineTag from '@/components/HeadlineTag'
+import Empty from '@/components/Empty'
+
 const props = defineProps({
     resultData: {
         type: Array,
@@ -146,6 +150,7 @@ const onMouseleave = () => {
         }
     }
 }
+
 .header-view {
     margin-top: 10px;
     width: 100%;

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

@@ -259,7 +259,7 @@ const initAccess = () => {
 };
 
 watch(() => props.resultData, (newVal) => {
-    if (chartLeft) {
+    if (chartLeft && newVal && Object.keys(newVal).length != 0) {
         let data = [
             {
                 name: '设备总数',

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

@@ -1,9 +1,10 @@
 <template>
     <div class="_switchAll">
         <HeadlineTag type="right" value="报警统计(月)"></HeadlineTag>
-        <div class="_switchAll_mains">
+        <div class="_switchAll_mains" v-if="resultData && Object.keys(resultData).length != 0">
             <div ref="chartRef" style="width: 100%; height: 100%;"></div>
         </div>
+        <Empty :bottom="true" v-else></Empty>
     </div>
 </template>
 
@@ -11,10 +12,11 @@
 import { ref, onMounted, onUnmounted } from 'vue';
 import * as echarts from 'echarts';
 import HeadlineTag from '@/components/HeadlineTag';
+import Empty from '@/components/Empty'
 const props = defineProps({
     resultData: {
-        type: Object,
-        default: {}
+        type: Array,
+        default: []
     }
 })
 
@@ -33,6 +35,9 @@ const handleResize = () => {
     }
 };
 onMounted(() => {
+    initChart();
+});
+const initChart = (xAxisData, EPEValue) => {
     if (chartRef.value) {
         chart = echarts.init(chartRef.value);
         const option = {
@@ -55,7 +60,7 @@ onMounted(() => {
             },
             xAxis: {
                 type: 'category',
-                data: [],
+                data: xAxisData,
                 axisLabel: {
                     color: '#fff'
                 },
@@ -83,7 +88,7 @@ onMounted(() => {
                     type: 'line',
                     smooth: true,
                     // data: generateRandomData(7, 50),
-                    data: [],
+                    data: EPEValue,
                     showSymbol: false,
                     lineStyle: {
                         color: 'rgb(49, 143, 247)',
@@ -111,14 +116,12 @@ onMounted(() => {
                 },
             ]
         };
-
         chart.setOption(option);
     }
     window.addEventListener('resize', handleResize);
-});
-
+}
 watch(() => props.resultData, (newVal) => {
-    if (chart) {
+    if (newVal) {
         let arrData = newVal
         let arr1 = []
         let arr2 = []
@@ -126,15 +129,22 @@ watch(() => props.resultData, (newVal) => {
             arr1.push(item.count)
             arr2.push(item.time)
         })
-        chart.setOption({
-            xAxis: {
-                data: arr2,
-            },
-            series: [{
-                name: '报警次数',
-                data: arr1,
-            }],
-        })
+        if (newVal && chart == null) {
+            nextTick(() => {
+                initChart(arr2, arr1);
+            });
+        }
+        if (chart) {
+            chart.setOption({
+                xAxis: {
+                    data: arr2,
+                },
+                series: [{
+                    name: '报警次数',
+                    data: arr1,
+                }],
+            })
+        }
     }
 }, { deep: true, immediate: true } // 开启深度监听
 )

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

@@ -1,7 +1,8 @@
 <template>
     <div class="_eventList">
         <HeadlineTag value="信息发布记录" style="flex-shrink: 0;"></HeadlineTag>
-        <div class="scroll-view" ref="scrollViewRef" @mouseenter="onMouseenter" @mouseleave="onMouseleave">
+        <div class="scroll-view" ref="scrollViewRef" v-if="resultData && resultData.length > 0"
+            @mouseenter="onMouseenter" @mouseleave="onMouseleave">
             <div ref="listRef" class="list" v-for="(p, n) in count" :key="n">
                 <div class="item" v-for="(item, index) in data" :key="index">
                     <div class="_eventList_mains_item_text view_item">
@@ -17,12 +18,14 @@
                 </div>
             </div>
         </div>
+        <Empty :bottom="true" v-else></Empty>
     </div>
 </template>
 
 <script setup>
-import { ref, onBeforeMount, onMounted, onBeforeUnmount, nextTick } from "vue";
+import { ref, onBeforeMount, onMounted, onBeforeUnmount, nextTick, watch } from "vue";
 import HeadlineTag from '@/components/HeadlineTag'
+import Empty from '@/components/Empty'
 const props = defineProps({
     resultData: {
         type: Array,

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

@@ -18,7 +18,7 @@
                         </el-text>
                     </div>
                     <div class="_running_mains_right_item__txt">
-                        <span>{{ item.state }}</span>
+                        <span>{{ item.state || 0 }}</span>
                         <span :style="{ color: item.color, 'font-size': '12px', 'margin-left': '5px' }">{{ item.unit }}</span>
                     </div>
                 </div>

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

@@ -1,7 +1,8 @@
 <template>
     <div class="_eventList">
         <HeadlineTag type="right" value="信息发布设备控制" style="flex-shrink: 0;"></HeadlineTag>
-        <div class="scroll-view" ref="scrollViewRef" @mouseenter="onMouseenter" @mouseleave="onMouseleave">
+        <div class="scroll-view" ref="scrollViewRef" v-if="resultData && resultData.length > 0"
+            @mouseenter="onMouseenter" @mouseleave="onMouseleave">
             <div ref="listRef" class="list" v-for="(p, n) in count" :key="n">
                 <div class="item" v-for="(item, index) in data" :key="index">
                     <div class="_eventList_mains_item_text">
@@ -20,12 +21,14 @@
                 </div>
             </div>
         </div>
+        <Empty :bottom="true" v-else></Empty>
     </div>
 </template>
 
 <script setup>
-import { ref, onBeforeMount, onMounted, onBeforeUnmount, nextTick } from "vue";
+import { ref, onBeforeMount, onMounted, onBeforeUnmount, nextTick, watch } from "vue";
 import HeadlineTag from '@/components/HeadlineTag'
+import Empty from '@/components/Empty'
 const props = defineProps({
     resultData: {
         type: Array,

src/views/system/passengerFlow/earlyWarning.vue

@@ -16,12 +16,12 @@
         <div class="right_warning">
             <div class="box_equipment">
                 <span class="equi_title">客流监控设备</span>
-                <span class="equi_num">{{ networkDevices }}</span>
+                <span class="equi_num">{{ networkDevices || 0 }}</span>
             </div>
             <div class="box_early_warn">
                 <div class="space_between_in card_eary">
                     <div class="type_title_early">正常</div>
-                    <div class="type_num_early">{{ resultData.Normal }}个</div>
+                    <div class="type_num_early">{{ resultData.Normal || 0 }}个</div>
                 </div>
                 <el-progress :percentage="getPercentage(resultData.Normal)" :text-inside="true"
                     color="rgb(100, 178, 161)" />
@@ -29,7 +29,7 @@
             <div class="box_early_warn">
                 <div class="space_between_in card_eary">
                     <div class="type_title_early">故障</div>
-                    <div class="type_num_early">{{ resultData.Fault }}个</div>
+                    <div class="type_num_early">{{ resultData.Fault || 0 }}个</div>
                 </div>
                 <el-progress :percentage="getPercentage(resultData.Fault)" :text-inside="true"
                     color="rgb(230, 162, 60)" />
@@ -37,7 +37,7 @@
             <div class="box_early_warn">
                 <div class="space_between_in card_eary">
                     <div class="type_title_early">离线</div>
-                    <div class="type_num_early">{{ resultData.Offline }}个</div>
+                    <div class="type_num_early">{{ resultData.Offline || 0 }}个</div>
                 </div>
                 <el-progress :percentage="getPercentage(resultData.Offline)" :text-inside="true"
                     color="rgb(245, 108, 108)" />
@@ -62,7 +62,9 @@ watch(() => props.resultData, (newVal) => {
 )
 function getPercentage(params) {
     let num = params / networkDevices.value * 100
-    return Math.floor(num)
+    if (num) {
+        return Math.floor(num)
+    }
 }
 // 生命周期
 onMounted(() => {

src/views/system/passengerFlow/index.vue

@@ -5,9 +5,10 @@
         <div class="left_passenger_flow">
           <div class="flex_spection">
             <HeadlineTag value="客流监控"></HeadlineTag>
-            <div class="box_arch">
+            <div class="box_arch" v-if="leftData && Object.keys(leftData).length != 0">
               <monitoring :resultData="leftData"></monitoring>
             </div>
+            <Empty :bottom="true" v-else></Empty>
           </div>
           <div class="flex_spection">
             <HeadlineTag value="安全监控等级"></HeadlineTag>
@@ -39,9 +40,10 @@
           </div>
           <div class="flex_spection" style="height: 33%;">
             <HeadlineTag type="right" value="安全事件列表"></HeadlineTag>
-            <div class="box_arch">
-              <incident  :resultData="leftData.Event"></incident>
+            <div class="box_arch" v-if="leftData.Event && leftData.Event.length > 0">
+              <incident :resultData="leftData.Event"></incident>
             </div>
+            <Empty :bottom="true" v-else></Empty>
           </div>
         </div>
       </template>
@@ -59,6 +61,8 @@ import security from './security'
 import district from './district'
 import incident from './incident'
 import * as echarts from 'echarts'
+import { ref, onMounted, onUnmounted, watch } from 'vue';
+import Empty from '@/components/Empty'
 const chartFlow = ref(null);
 let chartInstanceWater = null;
 const initChart = (arrData) => {

src/views/system/passengerFlow/monitoring.vue

@@ -5,6 +5,7 @@
 </template>
 
 <script setup>
+import { ref, onMounted, watch } from 'vue';
 import * as echarts from 'echarts'
 const props = defineProps({
     resultData: {

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

@@ -1,9 +1,10 @@
 <template>
     <div class="_consume">
         <HeadlineTag value="业主投诉量趋势"></HeadlineTag>
-        <div class="_consume_mains">
+        <div class="_consume_mains" v-if="resultData && Object.keys(resultData).length != 0">
             <div ref="chartRef" style="width: 100%; height: 100%;"></div>
         </div>
+        <Empty :bottom="true" v-else></Empty>
     </div>
 </template>
 
@@ -11,6 +12,7 @@
 import { ref, onMounted, onUnmounted } from 'vue';
 import * as echarts from 'echarts';
 import HeadlineTag from '@/components/HeadlineTag';
+import Empty from '@/components/Empty'
 const props = defineProps({
     resultData: {
         type: Object,

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

@@ -5,21 +5,21 @@
             <div class="_runnings_mains_left" id="sumeWidth">
                 <div class="_runnings_mains_left_tuan tuan1"></div>
                 <div class="_runnings_mains_left_conter">
-                    <div class="_runnings_mains_left_conter_num">{{ resultData.HousesCount }}</div>
+                    <div class="_runnings_mains_left_conter_num">{{ resultData.HousesCount || 0 }}</div>
                     <div class="_runnings_mains_left_conter_text">房屋数</div>
                 </div>
             </div>
             <div class="_runnings_mains_left">
                 <div class="_runnings_mains_left_tuan tuan2"></div>
                 <div class="_runnings_mains_left_conter">
-                    <div class="_runnings_mains_left_conter_num">{{ resultData.HouseholdCount }}</div>
+                    <div class="_runnings_mains_left_conter_num">{{ resultData.HouseholdCount || 0 }}</div>
                     <div class="_runnings_mains_left_conter_text">住户数</div>
                 </div>
             </div>
             <div class="_runnings_mains_left">
                 <div class="_runnings_mains_left_tuan tuan3"></div>
                 <div class="_runnings_mains_left_conter">
-                    <div class="_runnings_mains_left_conter_num">{{ resultData.DrivewayCount }}</div>
+                    <div class="_runnings_mains_left_conter_num">{{ resultData.DrivewayCount || 0 }}</div>
                     <div class="_runnings_mains_left_conter_text">车位数</div>
                 </div>
             </div>

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

@@ -1,7 +1,8 @@
 <template>
     <div class="_eventList">
         <HeadlineTag type="right" value="人员出入记录" style="flex-shrink: 0;"></HeadlineTag>
-        <div class="scroll-view" ref="scrollViewRef" @mouseenter="onMouseenter" @mouseleave="onMouseleave">
+        <div class="scroll-view" ref="scrollViewRef" v-if="data && data.length > 0" @mouseenter="onMouseenter"
+            @mouseleave="onMouseleave">
             <div ref="listRef" class="list" v-for="(p, n) in count" :key="n">
                 <div class="item" v-for="(item, index) in data" :key="index">
                     <div class="_eventList_mains_item_text">
@@ -22,12 +23,14 @@
                 </div>
             </div>
         </div>
+        <Empty :bottom="true" v-else></Empty>
     </div>
 </template>
 
 <script setup>
 import { ref, onBeforeMount, onMounted, onBeforeUnmount, nextTick } from "vue";
 import HeadlineTag from '@/components/HeadlineTag'
+import Empty from '@/components/Empty'
 const props = defineProps({
     resultData: {
         type: Array,

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

@@ -19,7 +19,7 @@
                         </el-text>
                     </div>
                     <div class="_running_mains_right_item__txt">
-                        <span>{{ item.state }}</span>
+                        <span>{{ item.state || 0 }}</span>
                         <span :style="{ color: item.color, 'font-size': '12px', 'margin-left': '5px' }">
                             {{ item.unit }}
                         </span>
@@ -56,7 +56,11 @@ watch(() => props.resultData, (newVal) => {
 )
 function getTotal() {
     let num = runningList.value[0].state + runningList.value[1].state + runningList.value[2].state + runningList.value[3].state
-    return num
+    if (num) {
+        return num
+    }else{
+        return 0
+    }
 }
 const heightVideo = ref(0)
 // 生命周期

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

@@ -1,9 +1,10 @@
 <template>
     <div class="_consume">
         <HeadlineTag type="right" value="业主满意度趋势"></HeadlineTag>
-        <div class="_consume_mains">
+        <div class="_consume_mains" v-if="resultData && Object.keys(resultData).length != 0">
             <div ref="chartRef" style="width: 100%; height: 100%;"></div>
         </div>
+        <Empty :bottom="true" v-else></Empty>
     </div>
 </template>
 
@@ -11,6 +12,7 @@
 import { ref, onMounted, onUnmounted } from 'vue';
 import * as echarts from 'echarts';
 import HeadlineTag from '@/components/HeadlineTag';
+import Empty from '@/components/Empty'
 const props = defineProps({
     resultData: {
         type: Object,

src/views/system/video/index.vue

@@ -30,20 +30,35 @@ import carbonEmission from './modules/carbonEmission.vue'
 import sameDay from './modules/sameDay.vue'
 import eventList from './modules/eventList.vue'
 
+const route = useRoute()
 const intervalId = ref(null)
 const leftData = ref({})
 // 生命周期
 onMounted(() => {
-    intervalId.value = setInterval(getHikvisionData, 10000);
     getHikvisionData()
 });
 onUnmounted(() => {
     clearInterval(intervalId.value);
 })
 function getHikvisionData() {
+    clearInterval(intervalId.value);
     getHikvision().then((res) => {
         if (res.code == 200) {
             leftData.value = res.data
+            if (route.path == '/system/video') {
+                intervalId.value = setInterval(() => {
+                    getHikvisionData()
+                    clearInterval(intervalId.value);
+                }, 10000);
+            } else {
+                clearInterval(intervalId.value);
+                intervalId.value = null
+            }
+        }
+    }).catch(() => {
+        if (route.path == '/system/video') {
+            intervalId.value = null
+            getHikvisionData()
         }
     })
 }

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

@@ -1,9 +1,10 @@
 <template>
     <div class="_consume">
         <HeadlineTag value="车牌识别(周)"></HeadlineTag>
-        <div class="_consume_mains">
+        <div class="_consume_mains" v-if="resultData && Object.keys(resultData).length != 0">
             <div ref="chartRef" style="width: 100%; height: 100%;"></div>
         </div>
+        <Empty :bottom="true" v-else></Empty>
     </div>
 </template>
 
@@ -11,6 +12,7 @@
 import { ref, onMounted, onUnmounted } from 'vue';
 import * as echarts from 'echarts';
 import HeadlineTag from '@/components/HeadlineTag';
+import Empty from '@/components/Empty'
 const props = defineProps({
     resultData: {
         type: Object,
@@ -104,7 +106,7 @@ onMounted(() => {
                             }],
                             global: false // 缺省为 false
                         },
-                        barBorderRadius: [10, 10, 10,10]
+                        barBorderRadius: [10, 10, 10, 10]
                     },
                 },
                 // 曲线表示黑名单

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

@@ -5,7 +5,7 @@
             <div class="_running_mains_left" id="videoWidth" :style="{ '--heightRun': heightVideo + 'px' }">
                 <div class="_running_mains_left_tuan"></div>
                 <div class="_running_mains_left_conter">
-                    <div class="_running_mains_left_conter_num">{{ resultData.MonitorCount }}</div>
+                    <div class="_running_mains_left_conter_num">{{ resultData.MonitorCount || 0 }}</div>
                     <div class="_running_mains_left_conter_text">设备总量</div>
                 </div>
             </div>
@@ -19,9 +19,9 @@
                         </el-text>
                     </div>
                     <div class="_running_mains_right_item__txt">
-                        <span>{{ item.state }}</span>
+                        <span>{{ item.state || 0 }}</span>
                         <span :style="{ color: item.color, 'font-size': '12px', 'margin-left': '5px' }">
-                            {{ item.unit }}
+                            {{ item.unit}}
                         </span>
                     </div>
                 </div>

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

@@ -1,7 +1,8 @@
 <template>
     <div class="_eventList">
         <HeadlineTag type="right" value="视频图像诊断列表" style="flex-shrink: 0;"></HeadlineTag>
-        <div class="scroll-view" ref="scrollViewRef" @mouseenter="onMouseenter" @mouseleave="onMouseleave">
+        <div class="scroll-view" ref="scrollViewRef" v-if="resultData.length > 0" @mouseenter="onMouseenter"
+            @mouseleave="onMouseleave">
             <div ref="listRef" class="list" v-for="(p, n) in count" :key="n">
                 <div class="item" v-for="(item, index) in data" :key="index">
                     <div class="_eventList_mains_item_text view_item" style="flex: 2;">
@@ -17,12 +18,14 @@
                 </div>
             </div>
         </div>
+        <Empty :bottom="true" v-else></Empty>
     </div>
 </template>
 
 <script setup>
-import { ref, onMounted, onUnmounted } from "vue";
+import { ref, onMounted, onUnmounted, watch, nextTick } from "vue";
 import HeadlineTag from '@/components/HeadlineTag'
+import Empty from '@/components/Empty'
 const props = defineProps({
     resultData: {
         type: Array,

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

@@ -1,7 +1,7 @@
 <template>
     <div class="_eventList">
         <HeadlineTag value="监控列表" style="flex-shrink: 0;"></HeadlineTag>
-        <div class="scroll-view" ref="scrollViewRef" @mouseenter="onMouseenter" @mouseleave="onMouseleave">
+        <div class="scroll-view" ref="scrollViewRef" v-if="resultData.length > 0" @mouseenter="onMouseenter" @mouseleave="onMouseleave">
             <div ref="listRef" class="list" v-for="(p, n) in count" :key="n">
                 <div class="item" v-for="(item, index) in data" :key="index">
                     <div class="_eventList_mains_item_text view_item" style="width: 45%;">
@@ -18,12 +18,14 @@
                 </div>
             </div>
         </div>
+        <Empty :bottom="true" v-else></Empty>
     </div>
 </template>
 
 <script setup>
 import { ref, onMounted, onUnmounted } from "vue";
 import HeadlineTag from '@/components/HeadlineTag'
+import Empty from '@/components/Empty'
 const props = defineProps({
     resultData: {
         type: Array,

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

@@ -5,7 +5,7 @@
             <div class="_running_mains_left" id="videoWidth" :style="{ '--heightRun': heightVideo + 'px' }">
                 <div class="_running_mains_left_tuan"></div>
                 <div class="_running_mains_left_conter">
-                    <div class="_running_mains_left_conter_num">{{ resultData.MonitorCount }}</div>
+                    <div class="_running_mains_left_conter_num">{{ resultData.MonitorCount || 0 }}</div>
                     <div class="_running_mains_left_conter_text">设备总量</div>
                 </div>
             </div>
@@ -19,7 +19,7 @@
                         </el-text>
                     </div>
                     <div class="_running_mains_right_item__txt">
-                        <span>{{ item.state }}</span>
+                        <span>{{ item.state || 0 }}</span>
                     </div>
                 </div>
             </div>

src/views/system/visitor/index.vue

@@ -9,7 +9,10 @@
               <div class="point_box" style="margin-top: 10px;margin-left: 15px;">
                 <el-input v-model="input" placeholder="按访客名称搜索" />
               </div>
-              <register :resultData="leftData.VisitorRegistration"></register>
+              <div v-if="leftData.VisitorRegistration && leftData.VisitorRegistration.length > 0">
+                <register :resultData="leftData.VisitorRegistration"></register>
+              </div>
+              <Empty :bottom="true" v-else></Empty>
               <!-- <div style="height: calc(100%);">
                 <Empty></Empty>
               </div> -->
@@ -25,7 +28,10 @@
               <div class="point_box" style="margin-top: 10px;margin-left: 15px;">
                 <el-input v-model="input" placeholder="按访客名称搜索" />
               </div>
-              <swiping :resultData="leftData.VisitorsSwipeCards"></swiping>
+              <div v-if="leftData.VisitorsSwipeCards && leftData.VisitorsSwipeCards.length > 0">
+                <swiping :resultData="leftData.VisitorsSwipeCards"></swiping>
+              </div>
+              <Empty :bottom="true" v-else></Empty>
               <!-- <div style="height: calc(100%);">
                 <Empty></Empty>
               </div> -->
@@ -48,9 +54,10 @@
           </div>
           <div class="flex_spection">
             <HeadlineTag type="right" value="通行趋势"></HeadlineTag>
-            <div class="card_visitor_star">
+            <div class="card_visitor_star" v-if="leftData && Object.keys(leftData).length != 0">
               <transit :resultData="leftData"></transit>
             </div>
+            <Empty :bottom="true" v-else></Empty>
           </div>
           <div class="flex_spection">
             <HeadlineTag type="right" value="访客身份类型占比"></HeadlineTag>

vite.config.js

@@ -32,7 +32,7 @@ export default defineConfig(({ mode, command }) => {
           rewrite: (p) => p.replace(/^\/dev-api/, '')
         },
         '/APP': {
-          // target: 'http://182.43.247.65:8000',
+          // target: 'http://182.43.247.65:8081',
           target: 'http://192.168.0.196:8000',
           changeOrigin: true,
           rewrite: (path) => path.replace(/^\/APP/, '')