Browse Source

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

Caner 2 years ago
parent
commit
b915b7ad94

+ 123 - 95
src/pages/views/home/components/CehicleOperation.vue

@@ -238,7 +238,7 @@
                   :class="item.type"
                   class="status"
                 >
-                  {{ item.type }}
+                  {{ findlabel(odds,item.type) }}
                 </div>
                 <div class="info">
                   <div>
@@ -310,7 +310,7 @@
                   :class="item"
                   class="status"
                 >
-                  {{ item.type }}
+                  {{ findlabel(odds,item.type) }}
                 </div>
                 <div class="info">
                   <div>
@@ -384,19 +384,40 @@
           >
             <div class="carmonitor">
               <div class="control">
-                <div
-                  v-for="item in controlList"
-                  :key="item.label"
-                  class="item"
-                >
+                <div class="item">
                   <div class="label">
-                    {{ item.label }}
+                    状态:
                   </div>
                   <n-select
+                    v-model:value="statusVal"
+                    :on-update:value="statusChange"
                     :bordered="false"
                     size="large"
-                    :value="1"
-                    :options="item.options"
+                    :options=" [
+                      { label: '全部', value: '' },
+                      { label: '运营中', value: 1 },
+                      { label: '非运营', value: 2 }
+                    ]"
+                  />
+                </div>
+                <div class="item">
+                  <div class="label">
+                    情景:
+                  </div>
+                  <n-select
+                    v-model:value="sceneVal"
+                    :bordered="false"
+                    size="large"
+                    :on-update:value="sceneChange"
+                    :options=" [
+                      { label: '全部', value: '' },
+                      { label: '行驶中', value: 1 },
+                      { label: '维保', value: 2 },
+                      { label: '固定包车', value: 3 },
+                      { label: '临时包车', value: 4 },
+                      { label: '充电', value: 5 },
+                      { label: '公务', value: 6 },
+                    ]"
                   />
                 </div>
               </div>
@@ -419,17 +440,17 @@
                 </thead>
                 <tbody>
                   <tr
-                    v-for="item in 10"
+                    v-for="item,index in vehicleMonitorData"
                     :key="item"
-                    :class="{ no: item === 1 }"
+                    :class="{ no: index === 0 }"
                   >
                     <td>
-                      <div class="index" /> 运营中
+                      <div class="index" /> {{ findlabel(vehicleStatus,item.carStatus) }}
                     </td>
-                    <td> 川T 12345 </td>
-                    <td> 小A </td>
-                    <td> 舒适 </td>
-                    <td>{{ item === 1 ? '维保' : '行驶中' }} </td>
+                    <td> {{ item?.licensePlate }} </td>
+                    <td> {{ item?.driver }}</td>
+                    <td> {{ item.congestion }}  </td>
+                    <td>{{ findlabel(passengerOption,item.carScene) }} </td>
                   </tr>
                 </tbody>
               </n-table>
@@ -441,40 +462,28 @@
             :name="'车辆状态'"
           >
             <div class="carstatus">
-              <div class="up">
-                <div class="title">
-                  上行
-                </div>
-                <div class="content">
-                  <div
-                    v-for="item in carstatusList"
-                    :key="item.label"
-                  >
-                    <div class="label">
-                      {{ item.label }}
-                    </div>
-                    <div class="value">
-                      {{ item.value }}
-                    </div>
-                  </div>
-                </div>
-              </div>
-              <div class="down">
+              <div
+                v-for="item,index in vehicleStatusData"
+                :key="index+1000"
+                :class="item.direction===1 ? 'up' :'down'"
+              >
                 <div class="title">
-                  下行
+                  {{ item.direction===1?'上行' :'下行' }}
                 </div>
                 <div class="content">
-                  <div
-                    v-for="item in carstatusList"
-                    :key="item.label"
-                  >
-                    <div class="label">
-                      {{ item.label }}
+                  <template v-for="value,key in item">
+                    <div
+                      v-if="!['id','direction'].includes(key+'')"
+                      :key="key"
+                    >
+                      <div class="label">
+                        {{ carstatusMap[key] }}
+                      </div>
+                      <div class="value">
+                        {{ value }}
+                      </div>
                     </div>
-                    <div class="value">
-                      {{ item.value }}
-                    </div>
-                  </div>
+                  </template>
                 </div>
               </div>
               <div class="line" />
@@ -511,14 +520,17 @@ const starlist:any = ref([
 ])
 const odds = ref([
   { label: '全部', value: '' },
-  { label: '已完成', value: '1' },
-  { label: '执行中', value: '2' },
-  { label: '已处理', value: '3' },
-  { label: '已下发', value: '4' },
-  { label: '待发', value: '5' },
-  { label: '调停', value: '6' },
-  { label: '非运营', value: '7' }
+  { label: '已完成', value: 1 },
+  { label: '执行中', value: 2 },
+  { label: '已处理', value: 3 },
+  { label: '已下发', value: 4 },
+  { label: '待发', value: 5 },
+  { label: '调停', value: 6 },
+  { label: '非运营', value: 7 }
 ])
+function findlabel(arr: any[], val: any) {
+  return arr.find((item: { value: any }) => item.value === val)?.label
+}
 // 1已完成2执行中3已处理4已下发5待发6调停7非运营
 const status = [ 'success', 'warning', 'error' ]
 
@@ -535,47 +547,18 @@ const downOption = ref({
   page: 1
 })
 const downData = computed(() => downBusLineOperate.value.slice((downOption.value.page - 1) * downOption.value.pageSize, downOption.value.page * downOption.value.pageSize))
-const controlList = [
-  {
-    label: '状态:',
-    options: [
-      { label: '全部', value: 1 },
-      { label: '运营中', value: 2 },
-      { label: '非运营', value: 3 }
-    ]
-  },
-  {
-    label: '电量:',
-    options: [
-      { label: '0%-30%', value: 1 },
-      { label: '31%-60%', value: 2 },
-      { label: '61%-100%', value: 3 }
-    ]
-  },
-  {
-    label: '情景:',
-    options: [
-      { label: '全部', value: 1 },
-      { label: '维保', value: 2 },
-      { label: '充电', value: 3 },
-      { label: '停驶', value: 4 },
-      { label: '行驶中', value: 5 }
-    ]
-  }
-
-]
 
-const carstatusList = [
-  { label: '平均速度', value: '15.16' },
-  { label: '最大车速', value: '17.82' },
-  { label: '最小车速', value: '10.93' },
-  { label: '平均间距', value: '14.03' },
-  { label: '最大间距', value: '15' },
-  { label: '最小间距', value: '12' },
-  { label: '高峰平均时间', value: '69分钟' },
-  { label: '平峰平均时间', value: '72分钟' },
-  { label: '单程平均时间', value: '71分钟' }
-]
+const carstatusMap:any = {
+  avgSpacing: '平均间距',
+  minSpacing: '最小间距',
+  averageTime: '平峰平均时间',
+  singleAvgTime: '单程平均时间',
+  maxSpacing: '最大间距',
+  peakAvgTime: '高峰平均时间',
+  maxSpeed: '最大车速',
+  minSpeed: '最小车速',
+  avgSpeed: '平均车速'
+}
 
 const leftContent = ref({
   leftOp: {
@@ -1007,8 +990,53 @@ async function getPassengerPercent() {
   rightContent.value.top[0].option.series[0].data = res.map((item:any) => ({
     name: nameMap[item.passengerType], value: item.percent
   }))
+  rightContent.value.top[0].option.title!.subtext = res.reduce((prev: any, item: { percent: number }) => {
+    prev += item.percent
+    return prev
+  }, 0)
 }
 getPassengerPercent()
+
+const passengerOption = [
+  { value: 1, label: '行驶中' },
+  { value: 2, label: '维保' },
+  { value: 3, label: '固定包车' },
+  { value: 4, label: '临时包车' },
+  { value: 5, label: '充电' },
+  { value: 6, label: '公务' }
+]
+// 状态下拉框
+const vehicleStatus = [
+  { value: 1, label: '运营' },
+  { value: 2, label: '非运营' }
+]
+const statusVal = ref('' as any)
+const sceneVal = ref('' as any)
+const vehicleMonitorData = ref([] as any[])
+function sceneChange(val: number) {
+  sceneVal.value = val
+  getVehicleMonitorService()
+}
+function statusChange(val: number) {
+  statusVal.value = val
+  getVehicleMonitorService()
+}
+
+async function getVehicleMonitorService() {
+  const params = {
+    carStatus: statusVal.value,
+    carScene: sceneVal.value
+  }
+  vehicleMonitorData.value = await cehicleOperationService.getVehicleMonitorService(params)
+}
+getVehicleMonitorService()
+
+const vehicleStatusData = ref([] as any[])
+async function getVehicleStatusService() {
+  vehicleStatusData.value = await cehicleOperationService.getVehicleStatusService()
+}
+getVehicleStatusService()
+
 </script>
 
 <style lang="scss" scoped>
@@ -1348,7 +1376,7 @@ getPassengerPercent()
       }
         .item {
           display: flex;
-          flex: 1;
+          width: 33%;
           align-items: center;
           gap: 20px;
 

+ 97 - 28
src/pages/views/home/components/PassengerFlow.vue

@@ -101,6 +101,7 @@ import Box from '@/components/box.vue'
 import Echart from '@/components/chart.vue'
 import { ref } from 'vue'
 import { graphic } from 'echarts'
+import PassengerFlowService from '../services/passengerFlow.service'
 
 const leftContent = ref({
   tCharts: [
@@ -157,13 +158,13 @@ const leftContent = ref({
               color: 'white'
             },
             data: [
-              { key: 2, name: '雨城区', value: 30619 },
-              { key: 2, name: '芦山县', value: 5921 },
-              { key: 2, name: '名山县', value: 1153 },
-              { key: 2, name: '天全县', value: 266 },
-              { key: 2, name: '宝兴县', value: 87 },
-              { key: 2, name: '汉源县', value: 999 },
-              { key: 2, name: '石棉县', value: 5921 }
+              { name: '雨城区', value: 30619 },
+              { name: '芦山县', value: 5921 },
+              { name: '名山县', value: 1153 },
+              { name: '天全县', value: 266 },
+              { name: '宝兴县', value: 87 },
+              { name: '汉源县', value: 999 },
+              { name: '石棉县', value: 5921 }
             ]
           }
         ]
@@ -313,9 +314,9 @@ const leftContent = ref({
               color: 'white'
             },
             data: [
-              { key: 2, name: '常规', value: 130 },
-              { key: 2, name: '快线', value: 50 },
-              { key: 2, name: '特色线路', value: 50 }
+              { name: '常规', value: 130 },
+              { name: '快线', value: 50 },
+              { name: '特色线路', value: 50 }
             ]
           }
         ]
@@ -374,11 +375,11 @@ const leftContent = ref({
               color: 'white'
             },
             data: [
-              { key: 2, name: '老年卡', value: 180 },
-              { key: 2, name: '电子钱包', value: 50 },
-              { key: 2, name: '现金', value: 30 },
-              { key: 2, name: '学生卡', value: 20 },
-              { key: 2, name: '免费', value: 10 }
+              { name: '老年卡', value: 180 },
+              { name: '电子钱包', value: 50 },
+              { name: '现金', value: 30 },
+              { name: '学生卡', value: 20 },
+              { name: '免费', value: 10 }
             ]
           }
         ]
@@ -420,10 +421,10 @@ const leftContent = ref({
               color: 'white'
             },
             data: [
-              { key: 2, name: '2km', value: 5 },
-              { key: 2, name: '2-5km', value: 3 },
-              { key: 2, name: '5-10km', value: 2 },
-              { key: 2, name: '>10km', value: 1 }
+              { name: '2km', value: 5 },
+              { name: '2-5km', value: 3 },
+              { name: '5-10km', value: 2 },
+              { name: '>10km', value: 1 }
             ]
           }
         ]
@@ -465,10 +466,10 @@ const leftContent = ref({
               color: 'white'
             },
             data: [
-              { key: 2, name: '<30分钟', value: 130 },
-              { key: 2, name: '30-60分钟', value: 50 },
-              { key: 2, name: '60-70分钟', value: 50 },
-              { key: 2, name: '>90分钟', value: 50 }
+              { name: '<30分钟', value: 130 },
+              { name: '30-60分钟', value: 50 },
+              { name: '60-70分钟', value: 50 },
+              { name: '>90分钟', value: 50 }
             ]
           }
         ]
@@ -509,10 +510,10 @@ const leftContent = ref({
               color: 'white'
             },
             data: [
-              { key: 2, name: '0次', value: 130 },
-              { key: 2, name: '1次', value: 30 },
-              { key: 2, name: '2次', value: 20 },
-              { key: 2, name: '3次以上', value: 10 }
+              { name: '0次', value: 130 },
+              { name: '1次', value: 30 },
+              { name: '2次', value: 20 },
+              { name: '3次以上', value: 10 }
             ]
           }
         ]
@@ -593,7 +594,6 @@ const rightContent = ref({
           fontSize: 16
         }
       },
-      data: [ '1路', '2路', '3路', '4路', '5路' ],
       axisTick: {
         show: false
       }
@@ -1149,6 +1149,75 @@ const rightContent = ref({
     dataZoom: {}
   }
 })
+
+const passengerFlowService = new PassengerFlowService()
+
+async function getTrafficAreaFlow() {
+  const res = await passengerFlowService.getTrafficAreaFlow()
+  leftContent.value.tCharts[0].option!.series[0].data = res.map((item: any) => ({
+    name: item.area, value: item.total
+  }))
+  leftContent.value.tCharts[0].option.title!.subtext = res.reduce((prev: any, item: { total: number }) => {
+    prev += item.total
+    return prev
+  }, 0)
+
+  leftContent.value.tCharts[1].option!.xAxis!.data = res.map((item: any) => (item.area))
+  leftContent.value.tCharts[1].option!.series[0]!.data = res.map((item: any) => (item.total))
+}
+getTrafficAreaFlow()
+
+async function getTrafficRidingDistance() {
+  const res = await passengerFlowService.getTrafficRidingDistance()
+  leftContent.value.bCharts[2].option!.series[0].data = res.map((item: { ridingDistance: any; number: any }) => ({
+    name: item.ridingDistance, value: item.number
+  }))
+}
+getTrafficRidingDistance()
+async function getTrafficTransferProportion() {
+  const res = await passengerFlowService.getTrafficTransferProportion()
+  leftContent.value.bCharts[4].option!.series[0].data = res.map((item: { transferType: any; number: any }) => ({
+    name: item.transferType, value: item.number
+  }))
+}
+getTrafficTransferProportion()
+
+async function getTrafficTypeNumber() {
+  const res = await passengerFlowService.getTrafficTypeNumber()
+  leftContent.value.bCharts[0].option!.series[0].data = res.map((item: any) => ({
+    name: item.lineType, value: item.number
+  }))
+}
+getTrafficTypeNumber()
+
+async function getTrafficCommutingTime() {
+  const res = await passengerFlowService.getTrafficCommutingTime()
+  leftContent.value.bCharts[3].option!.series[0].data = res.map((item: any) => ({
+    name: item.commutingType, value: item.number
+  }))
+}
+getTrafficCommutingTime()
+
+async function getTrafficConsumeType() {
+  const res = await passengerFlowService.getTrafficConsumeType()
+  leftContent.value.bCharts[1].option!.series[0].data = res.map((item: any) => ({
+    name: item.consumeType, value: item.number
+  }))
+  leftContent.value.bCharts[1].option!.title!.subtext = res.reduce((prev: any, item: { number: number }) => {
+    prev += item.number
+    return prev
+  }, 0)
+}
+getTrafficConsumeType()
+
+async function getTrafficFlowRank() {
+  const res = await passengerFlowService.getTrafficFlowRank()
+  const yAxisData = res.map((item: any) => item.lineName)
+  const seriesData = res.map((item: any) => item.trafficVolume)
+  rightContent.value.top1!.yAxis[0].data = yAxisData
+  rightContent.value.top1!.series[0].data = seriesData
+}
+getTrafficFlowRank()
 </script>
 
 <style lang="scss" scoped>

+ 13 - 0
src/pages/views/home/index.vue

@@ -10,8 +10,10 @@ import passengerFlow from './components/PassengerFlow.vue'
 import Map from '@/components/map/map.vue'
 import useStore from '@/pages/store'
 import HomeService from './services/homepage.service'
+import CehicleOperationService from './services/cehicleOperation.service'
 
 const homeService = new HomeService()
+const cehicleOperationService = new CehicleOperationService()
 
 const store = useStore()
 const menus = [
@@ -353,6 +355,17 @@ async function getBusTotal() {
   menus[0].count[6].value = res.admissionRate
 }
 getBusTotal()
+async function getBusLineStatistics() {
+  const res = await cehicleOperationService.getBusLineStatistics()
+  menus[1].count[0].value = res.passengerFlow
+  menus[1].count[1].value = res.planClasses
+  menus[1].count[2].value = res.setOutClasses
+  menus[1].count[3].value = res.collapseClasses
+  menus[1].count[4].value = res.planMileage
+  menus[1].count[5].value = res.currentMileage
+  menus[1].count[6].value = res.unloadedRatio
+}
+getBusLineStatistics()
 </script>
 <template>
   <div class="home">

+ 11 - 11
src/pages/views/home/services/cehicleOperation.service.ts

@@ -50,30 +50,30 @@ export default class CehicleOperationService extends Service {
     return []
   }
 
-  /** 班次完成率  /lineOperate/getClassesCompletionRate */
-  async getClassesCompletionRate() {
-    const { success, data } = await this.netService.get('/lineOperate/getClassesCompletionRate')
+  /** 车辆监控  /lineOperate/getVehicleMonitorService */
+  async getVehicleMonitorService(params: { carStatus: number; carScene: number }) {
+    const { success, data } = await this.netService.get(`/lineOperate/getVehicleMonitorService?carStatus=${params.carStatus}&carScene=${params.carScene}`)
     if (success) {
       return data
     }
     return []
   }
 
-  /** 发车准点率  /lineOperate/getDepartPunctualityRateList */
-  async getDepartPunctualityRateList() {
-    const { success, data } = await this.netService.get('/lineOperate/getDepartPunctualityRateList')
+  /** 车辆状态  /lineOperate/getVehicleStatusService */
+  async getVehicleStatusService() {
+    const { success, data } = await this.netService.get('/lineOperate/getVehicleStatusService')
     if (success) {
       return data
     }
     return []
   }
 
-  /** 车辆状态  /lineOperate/getVehicleStatusService */
-  async getVehicleStatusService() {
-    const { success, data } = await this.netService.get('/lineOperate/getVehicleStatusService')
+  /** 线路运营地图底部汇总数据  /lineOperate/getBusLineStatistics */
+  async getBusLineStatistics() {
+    const { success, data } = await this.netService.get('/lineOperate/getBusLineStatistics')
     if (success) {
-      return data
+      return data || {}
     }
-    return []
+    return {}
   }
 }

+ 70 - 0
src/pages/views/home/services/passengerFlow.service.ts

@@ -0,0 +1,70 @@
+import NetService from '@/services/net.service'
+import { injectable, Service } from '@/services/service'
+
+@injectable
+export default class PassengerFlowService extends Service {
+  private netService = new NetService()
+
+  /** 区域客流  /trafficAnalysis/getTrafficAreaFlow   */
+  async getTrafficAreaFlow() {
+    const { success, data } = await this.netService.get('/trafficAnalysis/getTrafficAreaFlow')
+    if (success) {
+      return data || []
+    }
+    return []
+  }
+
+  /** 乘距分布  /trafficAnalysis/getTrafficRidingDistance   */
+  async getTrafficRidingDistance() {
+    const { success, data } = await this.netService.get('/trafficAnalysis/getTrafficRidingDistance')
+    if (success) {
+      return data || []
+    }
+    return []
+  }
+
+  /** 换乘次数占比  /trafficAnalysis/getTrafficTransferProportion   */
+  async getTrafficTransferProportion() {
+    const { success, data } = await this.netService.get('/trafficAnalysis/getTrafficTransferProportion')
+    if (success) {
+      return data || []
+    }
+    return []
+  }
+
+  /** 客流线路分布  /trafficAnalysis/getTrafficTypeNumber   */
+  async getTrafficTypeNumber() {
+    const { success, data } = await this.netService.get('/trafficAnalysis/getTrafficTypeNumber')
+    if (success) {
+      return data || []
+    }
+    return []
+  }
+
+  /** 通勤时间占比  /trafficAnalysis/getTrafficCommutingTime   */
+  async getTrafficCommutingTime() {
+    const { success, data } = await this.netService.get('/trafficAnalysis/getTrafficCommutingTime')
+    if (success) {
+      return data || []
+    }
+    return []
+  }
+
+  /** 消费类型  /trafficAnalysis/getTrafficConsumeType   */
+  async getTrafficConsumeType() {
+    const { success, data } = await this.netService.get('/trafficAnalysis/getTrafficConsumeType')
+    if (success) {
+      return data || []
+    }
+    return []
+  }
+
+  /** 客运量排名  /trafficAnalysis/getTrafficFlowRank   */
+  async getTrafficFlowRank() {
+    const { success, data } = await this.netService.get('/trafficAnalysis/getTrafficFlowRank')
+    if (success) {
+      return data || []
+    }
+    return []
+  }
+}