Merge branch 'master' of bls-dan/busRoute into master

src/assets/global-style.scss

@@ -56,5 +56,11 @@
     .n-input__input-el{
       color: #fff;
     }
+    .n-input__separator {
+      padding: 0 5px;
+      color: #fff;
+      border: 1px solid #2185E8;
+    }
   }
+ 
 }

src/pages/views/home/components/CehicleOperation.vue

@@ -813,7 +813,22 @@ const rightContent = ref({
           },
           data: [ 120, 132, 101, 134, 90, 230, 210, 182, 191, 234, 290, 330 ]
         } ],
-        dataZoom: {}
+        dataZoom: {
+          type: 'slider',
+          height: 20,
+          bottom: 8,
+          handleIcon: 'path://M306.1,413c0,2.2-1.8,4-4,4h-59.8c-2.2,0-4-1.8-4-4V200.8c0-2.2,1.8-4,4-4h59.8c2.2,0,4,1.8,4,4V413z',
+          handleSize: '140%',
+          handleStyle: {
+            color: '#fff'
+          },
+          moveHandleSize: 0,
+          textStyle: {
+            color: '#666'
+          },
+          fillerColor: 'rgba(24,38,73,.3)',
+          borderColor: 'none'
+        }
       }
     },
     {
@@ -942,7 +957,22 @@ const rightContent = ref({
           },
           data: [ 120, 132, 101, 134, 90, 230, 210, 182, 191, 234, 290, 330 ]
         } ],
-        dataZoom: {}
+        dataZoom: {
+          type: 'slider',
+          height: 20,
+          bottom: 8,
+          handleIcon: 'path://M306.1,413c0,2.2-1.8,4-4,4h-59.8c-2.2,0-4-1.8-4-4V200.8c0-2.2,1.8-4,4-4h59.8c2.2,0,4,1.8,4,4V413z',
+          handleSize: '140%',
+          handleStyle: {
+            color: '#fff'
+          },
+          moveHandleSize: 0,
+          textStyle: {
+            color: '#666'
+          },
+          fillerColor: 'rgba(24,38,73,.3)',
+          borderColor: 'none'
+        }
       }
     }
   ],
@@ -1018,13 +1048,6 @@ watch(() => store.currentLineId, () => {
   getBusLineDriver()
   getBusLineDetail()
 })
-const timer = setInterval(() => {
-  getBusLineCar()
-}, 5 * 1000)
-
-onUnmounted(() => {
-  clearInterval(timer)
-})
 
 const nameMap:any = {
   1: '老年卡',
@@ -1085,6 +1108,18 @@ async function getVehicleStatusService() {
 }
 getVehicleStatusService()
 
+const timer = setInterval(() => {
+  getBusLineDetail()
+  getBusLineDriver()
+  getBusLineCar()
+
+  getPassengerPercent()
+  getVehicleStatusService()
+}, 5 * 1000)
+
+onUnmounted(() => {
+  clearInterval(timer)
+})
 </script>
 
 <style lang="scss" scoped>
@@ -1465,7 +1500,7 @@ getVehicleStatusService()
             color: #333333;
           }
 
-          &.no {
+          &:hover {
             td {
               background: linear-gradient(180deg, #00A8F0 0%, #02B3B3 100%);
 

src/pages/views/home/components/FacilityManagement.vue

@@ -149,7 +149,7 @@ import Layout from '@/components/layout.vue'
 import Echart from '@/components/chart.vue'
 
 import Box from '@/components/box.vue'
-import { ref } from 'vue'
+import { onUnmounted, ref } from 'vue'
 import FacilityManagementService from '../services/facilityManagement.service'
 
 const facilityStatistics = ref({
@@ -1048,6 +1048,20 @@ async function getFacilityVehicleComponents() {
   vehicleComponents.value.good = goodTotal
 }
 getFacilityVehicleComponents()
+
+const timer = setInterval(() => {
+  getFacilityStatistics()
+  getFacilityVehicleModel()
+  getFacilityStation()
+
+  getFacilityCarWasher()
+  getFacilityChargingStation()
+  getFacilityVehicleComponents()
+}, 5 * 1000)
+
+onUnmounted(() => {
+  clearInterval(timer)
+})
 </script>
 
 <style lang="scss" scoped>

src/pages/views/home/components/HomePage.vue

@@ -439,7 +439,7 @@ const leftContent:any = ref({
           }
         },
         xAxis: {
-          triggerEvent: true,
+          type: 'category',
           data: [
             '1月',
             '2月',
@@ -451,6 +451,7 @@ const leftContent:any = ref({
           axisLabel: {
             interval: 0,
             fontSize: 18,
+            rotate: 30,
             color: '#C9D2FA'
           }
         },
@@ -522,7 +523,7 @@ const leftContent:any = ref({
                 }
               ])
             },
-            barWidth: 30,
+            barMaxWidth: 30,
             data: [ 200, 108, 200, 40, 210, 100 ]
           },
           {
@@ -540,15 +541,16 @@ const leftContent:any = ref({
           height: 20,
           bottom: 8,
           handleIcon: 'path://M306.1,413c0,2.2-1.8,4-4,4h-59.8c-2.2,0-4-1.8-4-4V200.8c0-2.2,1.8-4,4-4h59.8c2.2,0,4,1.8,4,4V413z',
-          handleSize: '100%',
+          handleSize: '140%',
           handleStyle: {
-            color: '#409eff'
+            color: '#fff'
           },
+          moveHandleSize: 0,
           textStyle: {
             color: '#666'
           },
-          fillerColor: 'rgba(255,255,255,0.2)',
-          borderColor: 'rgba(64,158,225,0.3)'
+          fillerColor: 'rgba(24,38,73,.3)',
+          borderColor: 'none'
         }
       },
       btns: [ '总', '年', '月', '日' ],
@@ -605,8 +607,9 @@ const leftContent:any = ref({
             avoidLabelOverlap: true, // 是否启用防止标签重叠策略
             showEmptyCircle: true, // 是否在无数据的时候显示一个占位圆
             label: {
-              formatter: '{b}\n{d}%',
-              color: 'white'
+              formatter: '{d}%',
+              color: 'white',
+              fontSize: 14
             },
             data: [
               { name: '0次', value: 30619 },
@@ -650,6 +653,7 @@ const leftContent:any = ref({
           },
           axisLabel: {
             color: '#fff',
+            rotate: 30,
             fontSize: 18
           }
         },
@@ -740,7 +744,7 @@ const leftContent:any = ref({
             z: 2,
             name: '客流排名',
             type: 'bar',
-            barWidth: 25,
+            barMaxWidth: 25,
             zlevel: 1,
             data: datas.map((item, i) => ({
               value: item.value
@@ -792,6 +796,7 @@ const leftContent:any = ref({
           },
           axisLabel: {
             color: '#fff',
+            rotate: 30,
             fontSize: 18
           }
         },
@@ -882,7 +887,7 @@ const leftContent:any = ref({
             z: 2,
             name: '线路客流排名',
             type: 'bar',
-            barWidth: 25,
+            barMaxWidth: 25,
             zlevel: 1,
             data: datas.map((item, i) => ({
               value: item.value

src/pages/views/home/components/LineAnalysis.vue

@@ -24,6 +24,7 @@
               <SelectDate @date-change="selectDatechange" />
               <n-date-picker
                 v-model:value="lineAdjustData.range"
+                :separator="'至'"
                 :bordered="false"
                 type="daterange"
                 style="width: 260px;"
@@ -138,7 +139,7 @@ import Echart from '@/components/chart.vue'
 import SelectDate from '@/components/selectDate.vue'
 
 import {
-  Ref, h, ref, watch
+  Ref, h, onUnmounted, ref, watch
 } from 'vue'
 import { graphic } from 'echarts'
 import LineAnalysisService from '../services/lineAnalysis.service'
@@ -309,7 +310,7 @@ const leftContent: Ref<any> = ref({
             z: 2,
             name: '客流量',
             type: 'bar',
-            barWidth: 25,
+            barMaxWidth: 25,
             zlevel: 1,
             data: [ '80', '70', '60', '50', '40', '30', '20', '10' ],
             itemStyle: {
@@ -406,7 +407,7 @@ const rightContent: Ref<any> = ref({
       }
     },
     {
-      name: '线路占据分布',
+      name: '线路站据分布',
       option: {
         title: {
           text: '总', // 图标内容文本
@@ -580,7 +581,22 @@ const rightContent: Ref<any> = ref({
       data: [ 220, 182, 191, 234, 290, 330, 310, 201, 154, 190, 330, 410 ]
     }
     ],
-    dataZoom: {}
+    dataZoom: {
+      type: 'slider',
+      height: 20,
+      bottom: 8,
+      handleIcon: 'path://M306.1,413c0,2.2-1.8,4-4,4h-59.8c-2.2,0-4-1.8-4-4V200.8c0-2.2,1.8-4,4-4h59.8c2.2,0,4,1.8,4,4V413z',
+      handleSize: '140%',
+      handleStyle: {
+        color: '#fff'
+      },
+      moveHandleSize: 0,
+      textStyle: {
+        color: '#666'
+      },
+      fillerColor: 'rgba(24,38,73,.3)',
+      borderColor: 'none'
+    }
   },
   bottom: {
     grid: {
@@ -699,7 +715,7 @@ const rightContent: Ref<any> = ref({
           ],
           false
         ),
-        barWidth: 30,
+        barMaxWidth: 30,
         data: [ 200, 108, 200, 40, 210, 100, 200, 108, 200, 40, 210, 100 ]
       }
     ]
@@ -894,7 +910,6 @@ const stationRankRange = ref([ subDays(Date.now(), 7), Date.now() ])
 async function getAnalysisStationRank(params: any) {
   const res = await lineAnalysisService.getAnalysisStationRank(params)
   const groupData = groupBy(res, 'stationName')
-  console.log(groupData, 'groupData')
   const xAxisData = []
   const seriesData1 = []
 
@@ -939,6 +954,17 @@ function groupBy(array: any[], id: string) {
   // return Object.values(groups);
   return groups
 }
+
+const timer = setInterval(() => {
+  getAnalysisRegionFlow()
+  getAnalysisLineType()
+  getAnalysisLineLength()
+  getAnalysisLineDistance()
+}, 5 * 1000)
+
+onUnmounted(() => {
+  clearInterval(timer)
+})
 </script>
 
 <style lang="scss" scoped>
@@ -1043,12 +1069,6 @@ function groupBy(array: any[], id: string) {
         top: 0px;
         left: -300px;
       }
-
-      :deep(.n-input__separator) {
-        padding: 0 5px;
-        color: #fff;
-        border: 1px solid #2185E8;
-      }
     }
   }
 }

src/pages/views/home/components/MaintenanceDynamics.vue

@@ -50,6 +50,7 @@
         <n-date-picker
           v-model:value="leftContent.bottom.range"
           type="daterange"
+          :separator="'至'"
           :bordered="false"
           style="width: 260px;"
         />
@@ -165,7 +166,7 @@ import Box from '@/components/box.vue'
 import SelectDate from '@/components/selectDate.vue'
 
 import {
-  Ref, computed, onMounted, ref, watch
+  Ref, computed, onMounted, onUnmounted, ref, watch
 } from 'vue'
 import Echart from '@/components/chart.vue'
 import MaintenanceDynamicsService from '../services/maintenanceDynamics.Service'
@@ -271,15 +272,16 @@ const leftContent:Ref<any> = ref({
           height: 20,
           bottom: 8,
           handleIcon: 'path://M306.1,413c0,2.2-1.8,4-4,4h-59.8c-2.2,0-4-1.8-4-4V200.8c0-2.2,1.8-4,4-4h59.8c2.2,0,4,1.8,4,4V413z',
-          handleSize: '100%',
+          handleSize: '140%',
           handleStyle: {
-            color: '#409eff'
+            color: '#fff'
           },
+          moveHandleSize: 0,
           textStyle: {
             color: '#666'
           },
-          fillerColor: 'rgba(255,255,255,0.2)',
-          borderColor: 'rgba(64,158,225,0.3)'
+          fillerColor: 'rgba(24,38,73,.3)',
+          borderColor: 'none'
         }
       }
     },
@@ -721,12 +723,33 @@ getMaintenanceDetail()
 
 watch(() => leftContent.value.bottom.range, getMaintenanceDetail)
 
+const statisticsType = ref(1)
 function selectDatechange(type: any) {
+  statisticsType.value = type
   getMaintenanceStatistics(type)
 }
 onMounted(() => {
   selectDatechange(1)
 })
+
+const timer = setInterval(() => {
+  getBusLineDetailAll()
+  getMaintenanceStatistics(statisticsType.value)
+
+  getMaintenanceCarOperate()
+  getMaintenanceCarStatus()
+
+  getMaintenanceRidingDistance()
+  getMaintenanceLocationNum()
+  getMaintenanceConsumption()
+
+  getMaintenanceCheckupProblem()
+  getMaintenanceImplementation()
+}, 5 * 1000)
+
+onUnmounted(() => {
+  clearInterval(timer)
+})
 </script>
 
 <style lang="scss" scoped>

src/pages/views/home/components/PassengerFlow.vue

@@ -99,7 +99,7 @@
 import Layout from '@/components/layout.vue'
 import Box from '@/components/box.vue'
 import Echart from '@/components/chart.vue'
-import { ref } from 'vue'
+import { onUnmounted, ref } from 'vue'
 import { graphic } from 'echarts'
 import PassengerFlowService from '../services/passengerFlow.service'
 
@@ -283,11 +283,26 @@ const leftContent = ref({
                 )
               }
             },
-            barWidth: 30,
+            barMaxWidth: 30,
             data: [ 200, 108, 200, 40, 210, 100 ]
           }
         ],
-        dataZoom: {}
+        dataZoom: {
+          type: 'slider',
+          height: 20,
+          bottom: 8,
+          handleIcon: 'path://M306.1,413c0,2.2-1.8,4-4,4h-59.8c-2.2,0-4-1.8-4-4V200.8c0-2.2,1.8-4,4-4h59.8c2.2,0,4,1.8,4,4V413z',
+          handleSize: '140%',
+          handleStyle: {
+            color: '#fff'
+          },
+          moveHandleSize: 0,
+          textStyle: {
+            color: '#666'
+          },
+          fillerColor: 'rgba(24,38,73,.3)',
+          borderColor: 'none'
+        }
       }
     }
   ],
@@ -650,7 +665,7 @@ const rightContent = ref({
     } ],
     series: [ { // 内
       type: 'bar',
-      barWidth: 30,
+      barMaxWidth: 30,
       barGap: 0.5,
       name: '客流量',
       label: {
@@ -837,7 +852,22 @@ const rightContent = ref({
       data: [ 220, 182, 191, 234, 290, 330, 310, 201, 154, 190, 330, 410 ]
     }
     ],
-    dataZoom: {}
+    dataZoom: {
+      type: 'slider',
+      height: 20,
+      bottom: 8,
+      handleIcon: 'path://M306.1,413c0,2.2-1.8,4-4,4h-59.8c-2.2,0-4-1.8-4-4V200.8c0-2.2,1.8-4,4-4h59.8c2.2,0,4,1.8,4,4V413z',
+      handleSize: '140%',
+      handleStyle: {
+        color: '#fff'
+      },
+      moveHandleSize: 0,
+      textStyle: {
+        color: '#666'
+      },
+      fillerColor: 'rgba(24,38,73,.3)',
+      borderColor: 'none'
+    }
   },
   center: {
     grid: {
@@ -1018,7 +1048,22 @@ const rightContent = ref({
       data: [ 220, 182, 191, 234, 290, 330, 310, 201, 154, 190, 330, 410 ]
     }
     ],
-    dataZoom: {}
+    dataZoom: {
+      type: 'slider',
+      height: 20,
+      bottom: 8,
+      handleIcon: 'path://M306.1,413c0,2.2-1.8,4-4,4h-59.8c-2.2,0-4-1.8-4-4V200.8c0-2.2,1.8-4,4-4h59.8c2.2,0,4,1.8,4,4V413z',
+      handleSize: '140%',
+      handleStyle: {
+        color: '#fff'
+      },
+      moveHandleSize: 0,
+      textStyle: {
+        color: '#666'
+      },
+      fillerColor: 'rgba(24,38,73,.3)',
+      borderColor: 'none'
+    }
   },
   bottom: {
     grid: {
@@ -1199,7 +1244,22 @@ const rightContent = ref({
       data: [ 220, 182, 191, 234, 290, 330, 310, 201, 154, 190, 330, 410 ]
     }
     ],
-    dataZoom: {}
+    dataZoom: {
+      type: 'slider',
+      height: 20,
+      bottom: 8,
+      handleIcon: 'path://M306.1,413c0,2.2-1.8,4-4,4h-59.8c-2.2,0-4-1.8-4-4V200.8c0-2.2,1.8-4,4-4h59.8c2.2,0,4,1.8,4,4V413z',
+      handleSize: '140%',
+      handleStyle: {
+        color: '#fff'
+      },
+      moveHandleSize: 0,
+      textStyle: {
+        color: '#666'
+      },
+      fillerColor: 'rgba(24,38,73,.3)',
+      borderColor: 'none'
+    }
   }
 })
 
@@ -1271,6 +1331,22 @@ async function getTrafficFlowRank() {
   rightContent.value.top1!.series[0].data = seriesData
 }
 getTrafficFlowRank()
+
+const timer = setInterval(() => {
+  getTrafficAreaFlow()
+
+  getTrafficRidingDistance()
+  getTrafficTransferProportion()
+  getTrafficTypeNumber()
+  getTrafficCommutingTime()
+  getTrafficConsumeType()
+
+  getTrafficFlowRank()
+}, 5 * 1000)
+
+onUnmounted(() => {
+  clearInterval(timer)
+})
 </script>
 
 <style lang="scss" scoped>

src/pages/views/home/components/StationManagement.vue

@@ -216,6 +216,7 @@
               :columns="columns"
               :data="tableData"
               max-height="200"
+              style="font-size: 18px;"
             />
           </Box>
         </div>
@@ -228,7 +229,7 @@
 import Layout from '@/components/layout.vue'
 import Box from '@/components/box.vue'
 import {
-  Ref, computed, h, ref
+  Ref, computed, h, onUnmounted, ref
 } from 'vue'
 import Echart from '@/components/chart.vue'
 import StationManagementService from '../services/stationManagement.service'
@@ -507,8 +508,20 @@ const powerChart = ref({
     }
   },
   dataZoom: {
-    show: true,
-    type: 'slider'
+    type: 'slider',
+    height: 20,
+    bottom: 8,
+    handleIcon: 'path://M306.1,413c0,2.2-1.8,4-4,4h-59.8c-2.2,0-4-1.8-4-4V200.8c0-2.2,1.8-4,4-4h59.8c2.2,0,4,1.8,4,4V413z',
+    handleSize: '140%',
+    handleStyle: {
+      color: '#fff'
+    },
+    moveHandleSize: 0,
+    textStyle: {
+      color: '#666'
+    },
+    fillerColor: 'rgba(24,38,73,.3)',
+    borderColor: 'none'
   },
   series: {
     data: [ 820, 932, 901, 934, 1290, 1330, 1320 ],
@@ -738,6 +751,7 @@ const chargingStatus = ref([
 ])
 async function getStationChargingStatus() {
   const res = await stationManagementService.getStationChargingStatus()
+  chargingStatus.value = res.slice(0, 4)
 }
 getStationChargingStatus()
 
@@ -755,6 +769,26 @@ async function getStationResourceRate() {
   originData.value = await stationManagementService.getStationResourceRate()
 }
 getStationResourceRate()
+
+const timer = setInterval(() => {
+  getStationRegion()
+  getStationTypes()
+  getStationArea()
+  getStationOwnership()
+  getStationConstruct()
+  getStationUse()
+  getStationOperate()
+  getStationChargingTrends()
+  getStationInstalledCapacity()
+
+  getStationChargingStatus()
+  getStationChargingStatistics()
+  getStationResourceRate()
+}, 5 * 1000)
+
+onUnmounted(() => {
+  clearInterval(timer)
+})
 </script>
 
 <style lang="scss" scoped>
@@ -825,9 +859,9 @@ getStationResourceRate()
 
     .text {
       position: absolute;
-      left: 42%;
-      top: 40%;
-      font-size: 28px;
+      left: 45%;
+      top: 45%;
+      font-size: 18px;
       text-align: center;
     }
 
@@ -916,9 +950,9 @@ getStationResourceRate()
 
       .text {
         position: absolute;
-        left: 42%;
-        top: 40%;
-        font-size: 28px;
+        left: 45%;
+        top: 45%;
+        font-size: 18px;
         text-align: center;
       }
     }

src/pages/views/login/index.vue

@@ -108,7 +108,6 @@ async function login() {
           :label-style="labelStyle"
         >
           <n-button
-            v-debounce
             round
             :bordered="false"
             @click="login"