<template>
|
<div class="content page-branch">
|
<!-- 查询条件 -->
|
<div class="filter-section">
|
<el-form
|
style="flex: 1"
|
:inline="true"
|
:model="filterForm"
|
ref="filterForm"
|
class="g-table-filter"
|
>
|
<el-form-item label="线路名称">
|
<el-input
|
style="width: 154px"
|
v-model="filterForm.busLineName"
|
placeholder="请输入关键字并回车"
|
@keypress.enter.native="handleChange"
|
></el-input>
|
</el-form-item>
|
<el-form-item label="数据维度">
|
<el-select
|
style="width: 154px"
|
v-model="filterForm.disScreen"
|
popper-class="safety-report-filter"
|
@change="disScreenChange"
|
>
|
<el-option
|
v-for="item in disScreenOptions"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value"
|
></el-option
|
></el-select>
|
</el-form-item>
|
<el-form-item label="时间筛选">
|
<el-date-picker
|
v-if="
|
filterForm.disScreen == 'month' ||
|
filterForm.disScreen == 'year' ||
|
filterForm.disScreen == 'quarter'
|
"
|
v-model="timeRange"
|
type="monthrange"
|
placeholder=""
|
style="width: 184px"
|
:clearable="false"
|
@change="timeChange"
|
>
|
</el-date-picker>
|
<el-date-picker
|
v-if="filterForm.disScreen == 'day' || filterForm.disScreen == 'default'"
|
v-model="timeRange"
|
type="daterange"
|
placeholder=""
|
style="width: 244px"
|
:clearable="false"
|
@change="timeChange"
|
>
|
</el-date-picker>
|
</el-form-item>
|
</el-form>
|
<div class="action-bar">
|
<div class="action-item orange pointer" @click="exportData">
|
数据导出
|
</div>
|
<div class="action-item blue pointer" @click="showDialog = true">
|
线路对比
|
</div>
|
</div>
|
</div>
|
<!-- 数据表格 -->
|
<div class="g-table">
|
<el-table
|
stripe
|
style="width: 100%"
|
header-row-class-name="table-header"
|
:height="'calc(100vh - 400px)'"
|
:data="dataList"
|
highlight-current-row
|
class="bs"
|
v-loading="loading"
|
@sort-change="handleSortChange"
|
ref="busLineTable"
|
:default-sort="{prop: 'sumVolumePeople', order: 'descending'}"
|
>
|
<el-table-column
|
align="center"
|
prop="busLineName"
|
label="线路名称"
|
sortable="custom"
|
width="120"
|
fixed
|
></el-table-column>
|
<!-- <el-table-column
|
align="center"
|
prop="statisticalDate"
|
label="统计时间"
|
v-if="isShow('statisticalDate') && filterForm.disScreen != 'default'"
|
width="140"
|
sortable="custom"
|
></el-table-column> -->
|
<el-table-column
|
align="center"
|
prop="flag"
|
label="线路类型"
|
v-if="isShow('flag')"
|
width="120"
|
sortable="custom"
|
></el-table-column>
|
<el-table-column
|
align="center"
|
prop="statisticalDate"
|
label="所属公司"
|
width="120"
|
sortable="custom"
|
>
|
<template slot-scope="scope">{{scope.row.companyName || '-'}}</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="openDate"
|
label="开通时间"
|
width="130"
|
sortable="custom"
|
>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="statisticalDate"
|
label="运营时间"
|
width="120"
|
sortable="custom"
|
>
|
<template slot-scope="scope">{{scope.row.operateTime || '-'}}</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="stationIdNum"
|
label="往返站点"
|
width="120"
|
v-if="isShow('stationIdNum')"
|
sortable="custom"
|
>
|
<template slot-scope="scope">{{
|
getDefault(scope.row.stationIdNum)
|
}}</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="length"
|
label="线路长度(km)"
|
v-if="isShow('length')"
|
width="140"
|
sortable="custom"
|
>
|
<template slot-scope="scope">{{
|
(scope.row.length || scope.row.length == 0) ? Number(scope.row.length).toFixed(2) : "-"
|
}}</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="busNum"
|
label="线路车辆数"
|
v-if="isShow('busNum')"
|
width="120"
|
sortable="custom"
|
>
|
<template slot-scope="scope">{{
|
getDefault(scope.row.busNum)
|
}}</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="driverNum"
|
label="线路司机数"
|
v-if="isShow('driverNum')"
|
sortable="custom"
|
width="120"
|
></el-table-column>
|
<el-table-column
|
align="center"
|
prop="oneWayTime"
|
label="单程时长"
|
width="120"
|
sortable="custom"
|
>
|
<template slot-scope="scope">{{scope.row.oneWayTime || '-'}}</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="avgStationDistance"
|
label="平均站距(km)"
|
width="140"
|
sortable="custom"
|
>
|
<template slot-scope="scope">{{scope.row.avgStationDistance || '-'}}</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="nonLinearRatio"
|
label="非直线系数"
|
width="120"
|
sortable="custom"
|
>
|
<template slot-scope="scope">{{`${scope.row.nonLinearRatio}%` || '-'}}</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="busTypeNum"
|
label="配车数(分车型)"
|
width="160"
|
sortable="custom"
|
>
|
<template slot-scope="scope">{{`${scope.row.busTypeNum}` || '-'}}</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="counterInstallNum"
|
label="客流计数器安装车数"
|
width="200"
|
sortable="custom"
|
>
|
<template slot-scope="scope">{{`${scope.row.counterInstallNum}` || '-'}}</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="completionRate"
|
label="班次完成率"
|
width="120"
|
v-if="isShow('completionRate')"
|
sortable="custom"
|
>
|
<template slot-scope="scope"
|
>{{
|
(scope.row.onTimeRate || scope.row.onTimeRate == 0)
|
? Number(scope.row.completionRate).toFixed(2)
|
: "-"
|
}}%</template
|
>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="onTimeRate"
|
label="班次发车准点率"
|
width="150"
|
v-if="isShow('onTimeRate')"
|
sortable="custom"
|
>
|
<template slot-scope="scope"
|
>{{ Number(scope.row.onTimeRate).toFixed(2) }}%</template
|
>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="onTimeRateF"
|
label="首班准点率"
|
v-if="isShow('onTimeRateF')"
|
width="120"
|
sortable="custom"
|
>
|
<template slot-scope="scope"
|
>{{ Number(scope.row.onTimeRateF).toFixed(2) }}%</template
|
>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="onTimeRateL"
|
label="末班准点率"
|
v-if="isShow('onTimeRateL')"
|
width="120"
|
sortable="custom"
|
>
|
<template slot-scope="scope"
|
>{{ Number(scope.row.onTimeRateL).toFixed(2) }}%</template
|
>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="punctualRate"
|
label="正点率"
|
width="120"
|
sortable="custom"
|
>
|
<template slot-scope="scope">{{`${scope.row.punctualRate}%` || '-'}}</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="delayRate"
|
label="晚点率"
|
width="120"
|
sortable="custom"
|
>
|
<template slot-scope="scope">{{`${scope.row.delayRate}%` || '-'}}</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="earlyRate"
|
label="早点率"
|
width="120"
|
sortable="custom"
|
>
|
<template slot-scope="scope">{{`${scope.row.earlyRate}%` || '-'}}</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="totalMileageByDay"
|
label="行驶总里程(km)"
|
width="150"
|
v-if="isShow('totalMileageByDay')"
|
sortable="custom"
|
>
|
<template slot-scope="scope">{{
|
getDefault(scope.row.totalMileageByDay)
|
}}</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="avgOneWayTime"
|
label="平均单程时间(分钟)"
|
width="180"
|
sortable="custom"
|
>
|
<template slot-scope="scope">{{`${scope.row.avgOneWayTime}` || '-'}}</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="avgHourSpeed"
|
label="平均时数(km/h)"
|
width="140"
|
sortable="custom"
|
>
|
<template slot-scope="scope">{{`${scope.row.avgHourSpeed}` || '-'}}</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="powerPerKm"
|
label="百公里电耗"
|
width="120"
|
v-if="isShow('powerPerKm')"
|
sortable="custom"
|
></el-table-column>
|
<el-table-column
|
align="center"
|
prop="peakDepartureInterval"
|
label="高峰发车间隔(分钟)"
|
width="180"
|
sortable="custom"
|
>
|
<template slot-scope="scope">{{`${scope.row.peakDepartureInterval}` || '-'}}</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="flatDepartureInterval"
|
label="平峰发车间隔(分钟)"
|
width="180"
|
sortable="custom"
|
>
|
<template slot-scope="scope">{{`${scope.row.flatDepartureInterval}` || '-'}}</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="avgDepartureInterval"
|
label="平均发车间隔(分钟)"
|
width="180"
|
sortable="custom"
|
>
|
<template slot-scope="scope">{{`${scope.row.avgDepartureInterval}` || '-'}}</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="numberLargeIntervals"
|
label="大间隔次数"
|
width="120"
|
v-if="isShow('numberLargeIntervals')"
|
sortable="custom"
|
></el-table-column>
|
<el-table-column
|
align="center"
|
prop="plannedShift"
|
label="总计划班次"
|
width="120"
|
sortable="custom"
|
></el-table-column>
|
<el-table-column
|
align="center"
|
prop="operateShift"
|
label="总营运班次"
|
width="120"
|
sortable="custom"
|
></el-table-column>
|
<el-table-column
|
align="center"
|
prop="numberShiftsPlannedG"
|
label="高峰班计划数"
|
width="140"
|
sortable="custom"
|
></el-table-column>
|
<el-table-column
|
align="center"
|
prop="numberShiftsActualG"
|
label="高峰班完成数"
|
width="140"
|
sortable="custom"
|
></el-table-column>
|
<el-table-column
|
align="center"
|
prop="completionRateG"
|
label="高峰班完成率"
|
width="140"
|
sortable="custom"
|
>
|
<template slot-scope="scope">{{decimal(scope.row.completionRateG, 2)}}%</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="numberShiftsPlannedP"
|
label="保障班计划数"
|
width="140"
|
sortable="custom"
|
></el-table-column>
|
<el-table-column
|
align="center"
|
prop="numberShiftsActualP"
|
label="保障班完成数"
|
width="140"
|
sortable="custom"
|
>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="completionRateP"
|
label="保障班完成率"
|
width="140"
|
sortable="custom"
|
>
|
<template slot-scope="scope">{{decimal(scope.row.completionRateP, 2)}}%</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="dailyIncome"
|
label="日总收入"
|
width="120"
|
sortable="custom"
|
>
|
<template slot-scope="scope">{{`${scope.row.dailyIncome}` || '-'}}</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="kilometerPerson"
|
label="千公里人次"
|
width="120"
|
sortable="custom"
|
>
|
<template slot-scope="scope">{{`${scope.row.kilometerPerson}` || '-'}}</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="kilometerIncome"
|
label="千公里收入"
|
width="120"
|
sortable="custom"
|
>
|
<template slot-scope="scope">{{scope.row.kilometerIncome || '-'}}</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="kilometerCost"
|
label="千公里事故费"
|
width="140"
|
sortable="custom"
|
>
|
<template slot-scope="scope">{{scope.row.kilometerCost || '-'}}</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="complaintsNum"
|
label="投诉数量"
|
width="120"
|
v-if="isShow('complaintsNum')"
|
sortable="custom"
|
>
|
<template slot-scope="scope">{{
|
getDefault(scope.row.complaintsNum)
|
}}</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="sumVolumePeople"
|
label="客流总量"
|
v-if="isShow('sumVolumePeople')"
|
sortable="custom"
|
width="120"
|
>
|
<template slot-scope="scope">{{
|
getDefault(scope.row.sumVolumePeople)
|
}}</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="avgDailyFlow"
|
label="日均客流量"
|
width="120"
|
sortable="custom"
|
>
|
<template slot-scope="scope">{{scope.row.avgDailyFlow || '-'}}</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="avgShiftFlow"
|
label="每班次平均客流量"
|
width="180"
|
sortable="custom"
|
>
|
<template slot-scope="scope">{{scope.row.avgShiftFlow || '-'}}</template>
|
</el-table-column>
|
<!-- <el-table-column
|
align="center"
|
prop="runningSpeed"
|
label="平均行驶速度(km/h)"
|
width="170"
|
sortable="custom"
|
>
|
<template slot-scope="scope">{{
|
scope.row.runningSpeed ? Number(scope.row.runningSpeed).toFixed(2) : '0.00'
|
}}</template>
|
</el-table-column>
|
-->
|
<el-table-column
|
align="center"
|
prop="mornPeakVolumePeople"
|
label="早高峰客流(人)"
|
width="140"
|
v-if="isShow('mornPeakVolumePeople')"
|
sortable="custom"
|
>
|
<template slot-scope="scope">{{getDefault(scope.row.mornPeakVolumePeople)}}</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="flatHumpVolumePeople"
|
label="平峰客流(人)"
|
width="140"
|
v-if="isShow('flatHumpVolumePeople')"
|
sortable="custom"
|
>
|
<template slot-scope="scope">{{getDefault(scope.row.flatHumpVolumePeople)}}</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="evePeakVolumePeople"
|
label="晚高峰客流(人)"
|
width="140"
|
v-if="isShow('evePeakVolumePeople')"
|
sortable="custom"
|
>
|
<template slot-scope="scope">{{getDefault(scope.row.evePeakVolumePeople)}}</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
fixed="right"
|
label="操作"
|
width="120px"
|
>
|
<template slot-scope="scope">
|
<el-button type="text" @click="$to(`/lineCenter?lineName=${scope.row.busLineName}&companyId=${scope.row.companyId || ''}`, 3)"
|
>指标看板</el-button
|
>
|
</template>
|
</el-table-column>
|
</el-table>
|
<div class="g-pagination">
|
<el-pagination
|
layout="total, prev, pager, next"
|
:total="total"
|
:current-page="filterForm.pageNum"
|
:page-size="filterForm.pageSize"
|
background
|
prev-text="上一页"
|
next-text="下一页"
|
@current-change="pageChange"
|
></el-pagination>
|
</div>
|
</div>
|
<!-- 弹窗 -->
|
<div class="dialog" v-if="showDialog">
|
<div class="title row">
|
<img
|
class="title-icon"
|
:src="require('@/assets/safety/icon_select.png')"
|
alt=""
|
/>
|
<span class="title-text">请选择要对比的指标</span>
|
</div>
|
<img
|
class="icon-close"
|
:src="require('@/assets/safety/icon_close_n.png')"
|
alt=""
|
@click="showDialog = false"
|
/>
|
|
<el-checkbox-group v-model="tempCheckedColumns" @change="columnChange">
|
<el-checkbox
|
v-for="column in toSelectColumn"
|
:label="column.prop"
|
:key="column.label"
|
>{{ column.label }}</el-checkbox
|
>
|
</el-checkbox-group>
|
|
<div class="action-bar">
|
<div class="action-item orange pointer" @click="showDialog = false">
|
取消
|
</div>
|
<div class="action-item blue pointer" @click="changeShowColumn">
|
确认
|
</div>
|
</div>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
import moment from "moment";
|
import qs from "qs";
|
export default {
|
name: "busLine",
|
data() {
|
return {
|
loading: false,
|
showDialog: false,
|
total: 0,
|
reRender: true,
|
filterForm: {
|
disScreen: "default",
|
busLineName: "",
|
endDate: moment().format("yyyy-MM-DD") + " 23:59:59",
|
startDate:
|
moment().subtract(7, "days").format("yyyy-MM-DD") + " 00:00:00",
|
pageSize: 20,
|
pageNum: 1,
|
},
|
timeRange: [moment().subtract(7, "days"), moment()],
|
disScreenOptions: [
|
{ label: "月", value: "month" },
|
{ label: "日", value: "day" },
|
{ label: "默认", value: "default" },
|
],
|
dataList: [],
|
toSelectColumn: [
|
{ prop: "statisticalDate", label: "时间" },
|
{
|
prop: "flag",
|
label: "线路类型",
|
},
|
{
|
prop: "stationIdNum",
|
label: "站点数量",
|
},
|
{
|
prop: "length",
|
label: "线路长度",
|
},
|
{
|
prop: "completionRate",
|
label: "班次完成率",
|
},
|
{
|
prop: "onTimeRate",
|
label: "班次发车准点率",
|
},
|
{
|
prop: "onTimeRateF",
|
label: "首班准点率",
|
},
|
{
|
prop: "onTimeRateL",
|
label: "末班准点率",
|
},
|
{
|
prop: "sumVolumePeople",
|
label: "客流总量",
|
},
|
{
|
label: "行驶总里程",
|
prop: "totalMileageByDay",
|
},
|
{
|
prop: "complaintsNum",
|
label: "投诉数量",
|
},
|
{
|
prop: "evePeakVolumePeople",
|
label: "晚高峰客流",
|
},
|
{
|
prop: "flatHumpVolumePeople",
|
label: "平峰客流",
|
},
|
{
|
prop: "mornPeakVolumePeople",
|
label: "早高峰客流",
|
},
|
{
|
prop: "powerPerKm",
|
label: "百公里电耗",
|
},
|
{
|
prop: "numberLargeIntervals",
|
label: "大间隔次数",
|
},
|
{
|
prop: "busNum",
|
label: "线路车辆",
|
},
|
{
|
prop: "driverNum",
|
label: "线路司机",
|
},
|
],
|
checkedColumns: [
|
"onTimeRateF",
|
"length",
|
"stationIdNum",
|
"flag",
|
"statisticalDate",
|
"onTimeRate",
|
"completionRate",
|
"onTimeRateL",
|
"sumVolumePeople",
|
"totalMileageByDay",
|
"complaintsNum",
|
"evePeakVolumePeople",
|
"flatHumpVolumePeople",
|
"mornPeakVolumePeople",
|
"powerPerKm",
|
"numberLargeIntervals",
|
"busNum",
|
"driverNum",
|
],
|
tempCheckedColumns: [
|
"onTimeRateF",
|
"length",
|
"stationIdNum",
|
"flag",
|
"statisticalDate",
|
"onTimeRate",
|
"completionRate",
|
"onTimeRateL",
|
"sumVolumePeople",
|
"totalMileageByDay",
|
"complaintsNum",
|
"evePeakVolumePeople",
|
"flatHumpVolumePeople",
|
"mornPeakVolumePeople",
|
"powerPerKm",
|
"numberLargeIntervals",
|
"busNum",
|
"driverNum",
|
],
|
};
|
},
|
mounted() {
|
if(this.$route.query.busLineName){
|
this.filterForm.busLineName = this.$route.query.busLineName
|
}else {
|
this.filterForm.busLineName = '';
|
}
|
if(this.reRender) {
|
if(this.$route.query.prop){
|
let {prop, order} = this.$route.query;
|
this.$refs.busLineTable.sort(prop, order);
|
}else {
|
this.$refs.busLineTable.sort('sumVolumePeople', 'descending')
|
}
|
}
|
},
|
activated() {
|
if(this.$route.query.busLineName){
|
this.filterForm.busLineName = this.$route.query.busLineName
|
}else {
|
this.filterForm.busLineName = '';
|
}
|
if(!this.reRender) {
|
if(this.$route.query.prop){
|
let {prop, order} = this.$route.query;
|
this.$refs.busLineTable.sort(prop, order);
|
}else {
|
this.$refs.busLineTable.sort('sumVolumePeople', 'descending')
|
}
|
}
|
},
|
methods: {
|
handleSortChange(opt){
|
let {prop, order} = opt;
|
this.filterForm.sortWord = prop;
|
switch (order){
|
case 'ascending':
|
this.filterForm.sortFx = 'ASC';
|
break;
|
case 'descending':
|
this.filterForm.sortFx = 'DESC';
|
break;
|
default:
|
this.filterForm.sortFx = '';
|
}
|
this.getList();
|
},
|
handleChange() {
|
this.filterForm.pageNum = 1;
|
this.dataList = [];
|
this.getList();
|
},
|
disScreenChange() {
|
this.filterForm.startDate = "";
|
this.filterForm.endDate = "";
|
this.timeRange = null;
|
if (this.filterForm.disScreen == "default") {
|
this.filterForm.endDate = moment().format("yyyy-MM-DD") + " 23:59:59";
|
this.filterForm.startDate =
|
moment().subtract(7, "days").format("yyyy-MM-DD") + " 00:00:00";
|
this.timeRange = [moment().subtract(7, "days"), moment()];
|
}
|
this.handleChange();
|
this.handleChange();
|
},
|
timeChange() {
|
if (this.timeRange && Array.isArray(this.timeRange)) {
|
let start = this.timeRange[0];
|
let end = this.timeRange[1];
|
this.filterForm.startDate =
|
moment(start).format("yyyy-MM-DD") + " 00:00:00";
|
this.filterForm.endDate =
|
moment(end).format("yyyy-MM-DD") + " 23:59:59";
|
if (this.filterForm.disScreen == "month") {
|
this.filterForm.endDate =
|
moment(end).endOf("month").format("yyyy-MM-DD") + " 23:59:59";
|
}
|
} else {
|
this.filterForm.startDate = "";
|
this.filterForm.endDate = "";
|
}
|
this.handleChange();
|
},
|
getList() {
|
this.loading = true;
|
const params = {};
|
if (this.filterForm.busLineName) {
|
params.busLineName = this.filterForm.busLineName;
|
}
|
if (this.filterForm.startDate) {
|
params.startDate = this.filterForm.startDate;
|
params.endDate = this.filterForm.endDate;
|
}
|
if(this.filterForm.sortFx){
|
params.sortFx = this.filterForm.sortFx;
|
params.sortWord = this.filterForm.sortWord;
|
}
|
this.$axios
|
.get(this.$Interface.basicResource.busLine, {
|
params: {
|
limit: this.filterForm.pageSize,
|
page: this.filterForm.pageNum,
|
disScreen: this.filterForm.disScreen,
|
...params,
|
},
|
})
|
.then((res) => {
|
this.dataList = res.data.records;
|
this.total = Number(res.data.total);
|
this.loading = false;
|
});
|
},
|
handleDetail(row) {
|
this.$router.push({
|
path: `/basicPassengerFlowDetail/${row.busLineId}`,
|
query: {
|
id: row.busLineId,
|
name: row.busLineName,
|
typeName: '线路'
|
}
|
})
|
},
|
exportData() {
|
const params = {};
|
if (this.filterForm.busLineName) {
|
params.busLineName = this.filterForm.busLineName;
|
}
|
if (this.filterForm.startDate) {
|
params.startDate = this.filterForm.startDate;
|
params.endDate = this.filterForm.endDate;
|
}
|
let token = localStorage.getItem("mtoken");
|
let _params = qs.stringify({
|
token,
|
disScreen: this.filterForm.disScreen,
|
...params,
|
});
|
let a = document.createElement("a");
|
a.href = `${
|
this.$exportBase + this.$Interface.basicResource.export.line
|
}?${_params}`;
|
a.click();
|
a = null;
|
},
|
pageChange(page) {
|
this.filterForm.pageNum = page;
|
this.getList();
|
},
|
columnChange(val) {
|
},
|
changeShowColumn() {
|
this.checkedColumns = this.tempCheckedColumns;
|
this.showDialog = false;
|
},
|
isShow(prop) {
|
return this.checkedColumns.includes(prop);
|
},
|
},
|
deactivated() {
|
this.reRender = false;
|
}
|
};
|
</script>
|
|
<style lang="less" scoped>
|
@import url("../../assets/css/common.css");
|
@orange: #1cd1d3;
|
@blue: #3e89d3;
|
.content {
|
margin-top: 16px;
|
.filter-section {
|
text-align: right;
|
display: flex;
|
align-items: flex-start;
|
}
|
}
|
.action-bar {
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
color: #fff;
|
font-size: 14px;
|
margin-left: 50px;
|
padding-top: 5px;
|
.action-item:first-child {
|
margin-right: 20px;
|
}
|
.action-item {
|
padding: 8px 30px;
|
border-left: 2px solid;
|
border-right: 2px solid;
|
opacity: 0.8;
|
}
|
.orange {
|
border-color: @orange;
|
background-color: rgba(28, 209, 211, 0.1);
|
}
|
.blue {
|
border-color: @blue;
|
background-color: rgba(62, 137, 211, 0.1);
|
}
|
}
|
.dialog {
|
width: 690px;
|
height: 768px;
|
opacity: 1;
|
background: linear-gradient(180deg, #06203f, #08141c);
|
border: 2px solid #2a488a;
|
margin: auto;
|
position: fixed;
|
top: 100px;
|
left: 0;
|
right: 0;
|
.title {
|
.title-icon {
|
margin: 17px 20px;
|
margin-right: 8px;
|
width: 20px;
|
}
|
}
|
.icon-close {
|
position: absolute;
|
top: 0;
|
right: -3px;
|
width: 42px;
|
cursor: pointer;
|
}
|
|
.action-bar {
|
position: absolute;
|
width: 100%;
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
color: #fff;
|
font-size: 14px;
|
margin-top: 113px;
|
bottom: 60px;
|
.action-item:first-child {
|
margin-right: 96px;
|
}
|
.action-item {
|
padding: 8px 30px;
|
border-left: 2px solid;
|
border-right: 2px solid;
|
opacity: 0.8;
|
}
|
.orange {
|
border-color: @orange;
|
background-color: rgba(28, 209, 211, 0.1);
|
}
|
.blue {
|
border-color: @blue;
|
background-color: rgba(62, 137, 211, 0.1);
|
}
|
}
|
|
/deep/.el-checkbox-group {
|
display: flex;
|
flex-direction: column;
|
margin-top: 50px;
|
margin-left: 100px;
|
label {
|
margin-bottom: 10px;
|
}
|
.el-checkbox__label {
|
color: #fff;
|
}
|
.is-checked + .el-checkbox__label {
|
color: #409eff;
|
}
|
}
|
}
|
</style>
|
