|
@@ -1,22 +1,10 @@
|
|
|
<template>
|
|
|
<div class="statstics-wrapper">
|
|
|
- <div
|
|
|
- ref="headerWrapper"
|
|
|
- class="statstics-header"
|
|
|
- >
|
|
|
- <StatisticsHeader
|
|
|
- :title="`${chartsTitle}统计`"
|
|
|
- :custom-items="customFormItems"
|
|
|
- @getFormData="getFormData"
|
|
|
- @export="exportHandler"
|
|
|
- />
|
|
|
+ <div ref="headerWrapper" class="statstics-header">
|
|
|
+ <StatisticsHeader :title="`${chartsTitle}统计`" :custom-items="customFormItems" @getFormData="getFormData" @export="exportHandler" />
|
|
|
</div>
|
|
|
<div class="statstics-content">
|
|
|
- <div
|
|
|
- id="chart"
|
|
|
- class="statistics-chart"
|
|
|
- :style="{ height: chartHeight }"
|
|
|
- />
|
|
|
+ <div id="chart" class="statistics-chart" :style="{ height: chartHeight }" />
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
@@ -46,7 +34,7 @@ export default {
|
|
|
default: () => [],
|
|
|
},
|
|
|
},
|
|
|
- data() {
|
|
|
+ data () {
|
|
|
return {
|
|
|
myChart: null,
|
|
|
debounceTime: 300,
|
|
@@ -212,7 +200,7 @@ export default {
|
|
|
},
|
|
|
computed: {
|
|
|
...mapGetters(['sidebar']),
|
|
|
- seriesKey() {
|
|
|
+ seriesKey () {
|
|
|
const filterMap = {
|
|
|
全部: '',
|
|
|
有行李: '_have_bag',
|
|
@@ -228,17 +216,17 @@ export default {
|
|
|
watch: {
|
|
|
// 监听数据变化 重绘图形
|
|
|
options: {
|
|
|
- handler(obj) {
|
|
|
+ handler (obj) {
|
|
|
this.myChart.setOption(obj)
|
|
|
this.resizeHandler()
|
|
|
},
|
|
|
deep: true,
|
|
|
},
|
|
|
- 'sidebar.expand'() {
|
|
|
+ 'sidebar.expand' () {
|
|
|
this.setChartHeight()
|
|
|
},
|
|
|
querySettings: {
|
|
|
- handler({ seriesKey }) {
|
|
|
+ handler ({ seriesKey }) {
|
|
|
if (seriesKey) {
|
|
|
this.baseKey = seriesKey
|
|
|
}
|
|
@@ -247,7 +235,7 @@ export default {
|
|
|
immediate: true,
|
|
|
},
|
|
|
},
|
|
|
- mounted() {
|
|
|
+ mounted () {
|
|
|
this.setChartHeight()
|
|
|
this.myChart = this.$echarts.init(document.getElementById('chart'))
|
|
|
this.myChart.setOption(this.options)
|
|
@@ -258,7 +246,7 @@ export default {
|
|
|
)
|
|
|
window.addEventListener('resize', this.debouncedChartHeightSetter)
|
|
|
},
|
|
|
- beforeDestroy() {
|
|
|
+ beforeDestroy () {
|
|
|
// 销毁实例和移除监听
|
|
|
window.removeEventListener('resize', this.debouncedChartHeightSetter)
|
|
|
if (this.myChart) {
|
|
@@ -267,7 +255,7 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
- resetDatas() {
|
|
|
+ resetDatas () {
|
|
|
this.hasChartData = false
|
|
|
this.options.yAxis[0].max = 60000
|
|
|
this.options.xAxis.data = []
|
|
@@ -276,7 +264,7 @@ export default {
|
|
|
this.options.yAxis[1].min = -0.3
|
|
|
this.options.yAxis[1].max = 0.5
|
|
|
},
|
|
|
- getFormData(formData) {
|
|
|
+ getFormData (formData) {
|
|
|
this.resetDatas()
|
|
|
|
|
|
let serviceId
|
|
@@ -306,30 +294,30 @@ export default {
|
|
|
dataContentList =
|
|
|
formData.airline instanceof Array
|
|
|
? formData.airline.map(airline => ({
|
|
|
- ...dataContent,
|
|
|
- air_line: airline,
|
|
|
- }))
|
|
|
+ ...dataContent,
|
|
|
+ air_line: airline,
|
|
|
+ }))
|
|
|
: [
|
|
|
- {
|
|
|
- ...dataContent,
|
|
|
- air_line: formData.airline,
|
|
|
- },
|
|
|
- ]
|
|
|
+ {
|
|
|
+ ...dataContent,
|
|
|
+ air_line: formData.airline,
|
|
|
+ },
|
|
|
+ ]
|
|
|
break
|
|
|
case '航站':
|
|
|
serviceId = SERVICE_ID.airlineCompanyByAirport
|
|
|
dataContentList =
|
|
|
formData.airport instanceof Array
|
|
|
? formData.airport.map(airport => ({
|
|
|
- ...dataContent,
|
|
|
- airport,
|
|
|
- }))
|
|
|
+ ...dataContent,
|
|
|
+ airport,
|
|
|
+ }))
|
|
|
: [
|
|
|
- {
|
|
|
- ...dataContent,
|
|
|
- airport: formData.airport,
|
|
|
- },
|
|
|
- ]
|
|
|
+ {
|
|
|
+ ...dataContent,
|
|
|
+ airport: formData.airport,
|
|
|
+ },
|
|
|
+ ]
|
|
|
break
|
|
|
case '航站楼':
|
|
|
serviceId = SERVICE_ID.airlineCompanyByTerminal
|
|
@@ -365,13 +353,13 @@ export default {
|
|
|
formData.dateTime[1],
|
|
|
...this.filters,
|
|
|
]
|
|
|
- this.getMultipleChartsData(serviceId, dataContentList)
|
|
|
+ this.getMultipleChartsData(serviceId, dataContentList, formData.range)
|
|
|
},
|
|
|
- async getMultipleChartsData(serviceId, dataContentList) {
|
|
|
+ async getMultipleChartsData (serviceId, dataContentList, typeName) {
|
|
|
try {
|
|
|
const listValuesArray = await Promise.all(
|
|
|
dataContentList.map(dataContent =>
|
|
|
- this.getChartsData(serviceId, dataContent)
|
|
|
+ this.getChartsData(serviceId, dataContent, typeName)
|
|
|
)
|
|
|
)
|
|
|
const listValues = listValuesArray.reduce(
|
|
@@ -398,13 +386,18 @@ export default {
|
|
|
this.$message.error(error.message)
|
|
|
}
|
|
|
},
|
|
|
- async getChartsData(serviceId, dataContent) {
|
|
|
+ async getChartsData (serviceId, dataContent, typeName) {
|
|
|
try {
|
|
|
- const { code, returnData, message } = await Query({
|
|
|
+ const params = {
|
|
|
serviceId,
|
|
|
dataContent,
|
|
|
event: '0',
|
|
|
- })
|
|
|
+ }
|
|
|
+ if (typeName && (typeName === '航线' || typeName === '航站')) {
|
|
|
+ params['page'] = 1
|
|
|
+ params['pageSize'] = 9999
|
|
|
+ }
|
|
|
+ const { code, returnData, message } = await Query(params)
|
|
|
if (String(code) === '0') {
|
|
|
return returnData
|
|
|
} else {
|
|
@@ -414,7 +407,7 @@ export default {
|
|
|
return Promise.reject(error.message || '失败')
|
|
|
}
|
|
|
},
|
|
|
- setChartsData(listValues) {
|
|
|
+ setChartsData (listValues) {
|
|
|
const xAxisData = []
|
|
|
const yAxisData = [0]
|
|
|
const seriesDatas = []
|
|
@@ -431,7 +424,7 @@ export default {
|
|
|
yAxisData.push(
|
|
|
(listValues[i][this.seriesKey] -
|
|
|
listValues[i - 1][this.seriesKey]) /
|
|
|
- listValues[i - 1][this.seriesKey]
|
|
|
+ listValues[i - 1][this.seriesKey]
|
|
|
)
|
|
|
} else {
|
|
|
yAxisData.push(0)
|
|
@@ -449,29 +442,28 @@ export default {
|
|
|
this.tableData = [xAxisData, seriesDatas, yAxisData]
|
|
|
this.hasChartData = true
|
|
|
},
|
|
|
- setChartHeight() {
|
|
|
+ setChartHeight () {
|
|
|
const topBarHeight = 80
|
|
|
const headerBlankHeight = 24
|
|
|
const tabsWrapperHeight = 62
|
|
|
const headerHeight = this.$refs['headerWrapper'].offsetHeight
|
|
|
const footerBlankHeight = 24
|
|
|
- this.chartHeight = `calc(100vh - ${
|
|
|
- topBarHeight +
|
|
|
+ this.chartHeight = `calc(100vh - ${topBarHeight +
|
|
|
headerBlankHeight +
|
|
|
tabsWrapperHeight +
|
|
|
headerHeight +
|
|
|
footerBlankHeight
|
|
|
- }px)`
|
|
|
+ }px)`
|
|
|
this.$nextTick(() => {
|
|
|
this.resizeHandler()
|
|
|
})
|
|
|
},
|
|
|
- resizeHandler() {
|
|
|
+ resizeHandler () {
|
|
|
if (this.myChart) {
|
|
|
this.myChart.resize()
|
|
|
}
|
|
|
},
|
|
|
- exportHandler() {
|
|
|
+ exportHandler () {
|
|
|
if (!this.hasChartData) {
|
|
|
this.$message.warning('请查询后再进行导出')
|
|
|
return
|