|
|
@@ -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>
|