<template>
|
<div class="content page-branch">
|
<div class="filter-section" v-show="!playBack">
|
<!-- 查询条件 -->
|
<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.stationName"
|
placeholder="请输入关键字并回车"
|
@keypress.enter.native="handleChange"
|
></el-input>
|
</el-form-item>
|
<el-form-item label="时间筛选">
|
<el-date-picker
|
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>
|
</div>
|
<div class="filter-section" v-show="playBack">
|
<!-- 查询条件 -->
|
<el-form
|
style="flex: 1"
|
:inline="true"
|
:model="backFilterForm"
|
ref="backFilterForm"
|
class="g-table-filter"
|
>
|
<el-form-item label="时间筛选">
|
<el-date-picker
|
v-model="backTimeRange"
|
type="datetimerange"
|
placeholder=""
|
style="width: 364px"
|
: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
|
v-show="playBack"
|
@click="playBack = false"
|
class="action-item blue pointer"
|
style="margin-left: 20px"
|
>
|
站点列表
|
</div>
|
</div>
|
</div>
|
<!-- 数据表格 -->
|
<div class="g-table">
|
<el-table
|
v-show="!playBack"
|
stripe
|
style="width: 100%"
|
header-row-class-name="table-header"
|
:height="'calc(100vh - 400px)'"
|
:data="dataList"
|
highlight-current-row
|
class="bs"
|
v-loading="siteLoading"
|
@sort-change="handleSortChange"
|
ref="siteTable"
|
:default-sort="{prop: 'todayPassengerFlow', order: 'descending'}"
|
>
|
<el-table-column
|
align="center"
|
prop="stationName"
|
label="站点名称"
|
sortable="custom"
|
></el-table-column>
|
<el-table-column
|
align="center"
|
prop="passLine"
|
label="经过路线"
|
width="200"
|
:show-overflow-tooltip="true"
|
></el-table-column>
|
<el-table-column
|
align="center"
|
prop="todayPassengerFlow"
|
label="今日客流"
|
sortable="custom"
|
>
|
<template slot-scope="scope">{{
|
scope.row.todayPassengerFlow
|
? parseInt(scope.row.todayPassengerFlow)
|
: "-"
|
}}</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="pastPassengerFlow"
|
label="往日客流"
|
sortable="custom"
|
>
|
<template slot-scope="scope">{{
|
scope.row.pastPassengerFlow
|
? parseInt(scope.row.pastPassengerFlow)
|
: "-"
|
}}</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="tripShiftNum"
|
label="途径班次"
|
width="120"
|
sortable="custom"
|
>
|
<template slot-scope="scope">{{scope.row.tripShiftNum || '-'}}</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="lngAndlat"
|
label="位置"
|
width="120"
|
sortable="custom"
|
>
|
<template slot-scope="scope">{{scope.row.lngAndlat || '-'}}</template>
|
</el-table-column>
|
<!-- <el-table-column
|
align="center"
|
prop="headEndOnTimeRate"
|
label="首末站发车准点率"
|
width="170"
|
sortable="custom"
|
>
|
<template slot-scope="scope">{{
|
scope.row.headEndOnTimeRate || "-"
|
}}</template>
|
</el-table-column>
|
<el-table-column align="center" prop="position " label="位置" sortable="custom">
|
<template slot-scope="scope">{{
|
scope.row.position || "-"
|
}}</template>
|
</el-table-column> -->
|
<el-table-column
|
align="center"
|
prop="relateStation "
|
label="关联站点"
|
width="150"
|
:show-overflow-tooltip="true"
|
sortable="custom"
|
>
|
<template slot-scope="scope">{{
|
scope.row.relateStation || "-"
|
}}</template>
|
</el-table-column>
|
<el-table-column label="操作" width="180" align="center">
|
<template slot-scope="scope">
|
|
<el-button type="text" @click="getPlayBack(scope.row.stationId)"
|
>站点回放</el-button
|
>
|
<el-button type="text" @click="handleDetail(scope.row)"
|
>客流详情</el-button
|
>
|
</template>
|
</el-table-column>
|
</el-table>
|
<!-- 站点回放数据表 -->
|
<el-table
|
v-show="playBack"
|
stripe
|
style="width: 100%"
|
header-row-class-name="table-header"
|
:height="'calc(100vh - 400px)'"
|
:data="backList"
|
highlight-current-row
|
class="bs"
|
v-loading="playBackLoading"
|
@sort-change="playBackHandleSortChange"
|
>
|
<el-table-column
|
align="center"
|
prop="stationName"
|
label="站点名称"
|
></el-table-column>
|
<el-table-column
|
align="center"
|
prop="busLineName"
|
label="经过路线"
|
sortable="custom"
|
></el-table-column>
|
<el-table-column
|
align="center"
|
prop="flatHumpVolumePeople"
|
label="上客人数"
|
sortable="custom"
|
>
|
<template slot-scope="scope">{{
|
parseInt(scope.row.flatHumpVolumePeople)
|
}}</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="statTime"
|
label="时间"
|
sortable="custom"
|
></el-table-column>
|
<el-table-column
|
align="center"
|
prop="plateNum"
|
label="车辆"
|
sortable="custom"
|
></el-table-column>
|
</el-table>
|
<div class="g-pagination">
|
<el-pagination
|
layout="total, prev, pager, next"
|
:current-page="filterForm.pageNum"
|
:page-size="filterForm.pageSize"
|
:total="total"
|
background
|
prev-text="上一页"
|
next-text="下一页"
|
@current-change="pageChange"
|
v-show="!playBack"
|
></el-pagination>
|
<el-pagination
|
layout="total, prev, pager, next"
|
:current-page="backFilterForm.pageNum"
|
:page-size="backFilterForm.pageSize"
|
:total="backTotal"
|
background
|
prev-text="上一页"
|
next-text="下一页"
|
@current-change="backPageChage"
|
v-show="playBack"
|
></el-pagination>
|
</div>
|
</div>
|
|
<div class="mask" v-if="showDialog"></div>
|
<div class="dialog" v-if="showDialog" id="fxpSiteEditDialog">
|
<div class="title">
|
<span class="title-text">{{ currentSite.stationName }}</span>
|
</div>
|
<img
|
class="icon-close"
|
:src="require('@/assets/safety/icon_close.png')"
|
alt=""
|
@click="showDialog = false"
|
/>
|
<div class="content-table">
|
<div class="row">
|
<div class="item">
|
<div class="label">经纬度</div>
|
<div class="sep">:</div>
|
<div class="value">
|
{{ currentSite.lngAndlat.split(",")[0] }},{{
|
currentSite.lngAndlat.split(",")[1]
|
}}
|
</div>
|
</div>
|
<div class="item">
|
<div class="label">经过路线</div>
|
<div class="sep">:</div>
|
<div class="value">
|
{{ currentSite.passLine }}
|
</div>
|
</div>
|
</div>
|
<div class="row">
|
<div class="item">
|
<div class="label">站点位置</div>
|
<div class="sep">:</div>
|
<div class="value">
|
<el-input
|
style="width: 412px"
|
placeholder="请输入站点位置"
|
v-model="currentSite.position"
|
></el-input>
|
</div>
|
</div>
|
</div>
|
<div class="row">
|
<div class="item" style="width: 100%; margin: 20px 0">
|
<div class="label">关联站点</div>
|
<div class="sep">:</div>
|
<div class="value font14">
|
<el-tag
|
:key="index"
|
v-for="(reSite, index) in reSiteList"
|
closable
|
:disable-transitions="false"
|
@close="handleClose(index)"
|
>
|
{{ reSite.stationName }}
|
</el-tag>
|
<el-select
|
v-if="showSelect"
|
placeholder="输入关键字搜索"
|
id="fxpSiteLoadMoreSelect"
|
style="width: 160px"
|
filterable
|
remote
|
:remote-method="getRemoteSite"
|
@change="handleSelect"
|
v-model="selectedSite"
|
ref="siteListDown"
|
autofocus
|
>
|
<el-option
|
v-for="site in remoteSiteList"
|
:key="site.stationId"
|
:label="site.stationName"
|
:value="site.stationId"
|
></el-option>
|
</el-select>
|
<el-button
|
v-else
|
class="button-new-tag"
|
size="small"
|
@click="showSelect_"
|
>
|
<i class="el-icon el-icon-plus"></i>
|
</el-button>
|
</div>
|
</div>
|
</div>
|
</div>
|
<div class="action-bar">
|
<div class="action-item orange pointer" @click="showDialog = false">
|
取消
|
</div>
|
<div class="action-item blue pointer" @click="saveRelSite">保存</div>
|
</div>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
import moment from "moment";
|
import qs from "qs";
|
export default {
|
name: "site",
|
data() {
|
return {
|
showDialog: false,
|
total: 0,
|
backTotal: 0,
|
siteLoading: false,
|
playBackLoading: false,
|
reRender: true,
|
filterForm: {
|
stationName: "",
|
startDate: moment().subtract(7, 'day').format('yyyy-MM-DD'),
|
endDate: moment().format('yyyy-MM-DD'),
|
pageSize: 20,
|
pageNum: 1,
|
},
|
backFilterForm: {
|
stationName: "",
|
startDate: moment().format('yyyy-MM-DD') + ' 00:00:00',
|
endDate: moment().format('yyyy-MM-DD') + ' 23:59:59',
|
pageSize: 20,
|
pageNum: 1,
|
},
|
timeRange: [moment().subtract(7, 'day'), moment()],
|
backTimeRange: [new Date(moment().format('yyyy-MM-DD') + ' 00:00:00'), new Date()],
|
dataList: [],
|
backList: [],
|
authButton: [],
|
playBack: false,
|
currentId: "",
|
currentSite: {},
|
reSiteList: [],
|
showSelect: false,
|
searchTotal: 1,
|
searchPage: 1,
|
remoteSiteList: [],
|
query: "",
|
selectedSite: "",
|
playBackId: ''
|
};
|
},
|
mounted() {
|
if(this.reRender) {
|
if(this.$route.query.siteName){
|
this.filterForm.stationName = this.$route.query.siteName
|
}else {
|
this.filterForm.stationName = '';
|
}
|
if(this.$route.query.prop){
|
let {prop, order} = this.$route.query;
|
this.$refs.siteTable.sort(prop, order);
|
}else {
|
this.$refs.siteTable.sort('todayPassengerFlow', 'descending')
|
}
|
this.getAuth();
|
}
|
},
|
activated() {
|
if(!this.reRender) {
|
if(this.$route.query.siteName){
|
this.filterForm.stationName = this.$route.query.siteName
|
}else {
|
this.filterForm.stationName = '';
|
}
|
if(this.$route.query.prop){
|
let {prop, order} = this.$route.query;
|
this.$refs.siteTable.sort(prop, order);
|
}else {
|
this.$refs.siteTable.sort('todayPassengerFlow', 'descending')
|
}
|
this.getAuth();
|
}
|
},
|
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();
|
},
|
playBackHandleSortChange(opt){
|
let {prop, order} = opt;
|
this.backFilterForm.sortWord = prop;
|
switch (order){
|
case 'ascending':
|
this.backFilterForm.sortFx = 'ASC';
|
break;
|
case 'descending':
|
this.backFilterForm.sortFx = 'DESC';
|
break;
|
default:
|
this.backFilterForm.sortFx = '';
|
}
|
this.getBackList();
|
},
|
getAuth() {
|
this.$axios.get(this.$Interface.auth).then(res=>{
|
if(res.data && res.data.length>0){
|
this.authButton= res.data.map(item=>item.permissions);
|
}else{
|
this.authButton=[]
|
}
|
})
|
},
|
getAuthBtn(type){
|
return this.authButton.includes(type);
|
},
|
handleChange() {
|
if (this.playBack) {
|
this.backFilterForm.pageNum = 1;
|
this.backList = [];
|
this.getBackList();
|
} else {
|
this.filterForm.pageNum = 1;
|
this.dataList = [];
|
this.getList();
|
}
|
},
|
timeChange() {
|
if (this.playBack) {
|
if (this.backTimeRange) {
|
this.backFilterForm.startDate = moment(this.backTimeRange[0]).format(
|
"yyyy-MM-DD HH:mm:ss"
|
);
|
this.backFilterForm.endDate = moment(this.backTimeRange[1]).format(
|
"yyyy-MM-DD HH:mm:ss"
|
);
|
} else {
|
this.backFilterForm.startDate = "";
|
this.backFilterForm.endDate = '';
|
}
|
} else {
|
if (this.timeRange) {
|
this.filterForm.startDate =
|
moment(this.timeRange[0]).format("yyyy-MM-DD") + " 00:00:00";
|
this.filterForm.endDate =
|
moment(this.timeRange[1]).format("yyyy-MM-DD") + " 23:59:59";
|
} else {
|
this.filterForm.startDate = "";
|
this.filterForm.endDate = "";
|
}
|
}
|
this.handleChange();
|
},
|
getList() {
|
this.siteLoading = true;
|
const params = {};
|
if (this.filterForm.startDate) {
|
params.startDate = this.filterForm.startDate;
|
params.endDate = this.filterForm.endDate;
|
}
|
if (this.filterForm.stationName) {
|
params.stationName = this.filterForm.stationName;
|
}
|
if(this.filterForm.sortFx){
|
params.sortFx = this.filterForm.sortFx;
|
params.sortWord = this.filterForm.sortWord;
|
}
|
this.$axios
|
.get(this.$Interface.basicResource.site, {
|
params: {
|
limit: this.filterForm.pageSize,
|
page: this.filterForm.pageNum,
|
...params,
|
},
|
})
|
.then((res) => {
|
this.dataList = res.data.records;
|
this.total = Number(res.data.total);
|
this.siteLoading = false;
|
});
|
},
|
exportData() {
|
const params = {};
|
if (this.filterForm.oneDate) {
|
params.oneDate = this.filterForm.oneDate;
|
}
|
if (this.filterForm.stationName) {
|
params.stationName = this.filterForm.stationName;
|
}
|
let token = localStorage.getItem("mtoken");
|
let _params = qs.stringify({
|
token,
|
...params,
|
});
|
let a = document.createElement("a");
|
a.href = `${
|
this.$exportBase + this.$Interface.basicResource.export.site
|
}?${_params}`;
|
a.click();
|
a = null;
|
},
|
getBackList() {
|
this.playBackLoading = true;
|
const params = {};
|
if (this.backFilterForm.startDate) {
|
params.startDate = this.backFilterForm.startDate;
|
params.endDate = this.backFilterForm.endDate;
|
}
|
if (this.backFilterForm.stationName) {
|
params.stationName = this.filterForm.stationName;
|
}
|
if (this.backFilterForm.sortFx) {
|
params.sortFx = this.backFilterForm.sortFx;
|
params.sortWord = this.backFilterForm.sortWord;
|
}
|
this.$axios
|
.get(this.$Interface.basicResource.siteBack, {
|
params: {
|
limit: this.backFilterForm.pageSize,
|
page: this.backFilterForm.pageNum,
|
stationId: this.playBackId,
|
...params,
|
},
|
})
|
.then((res) => {
|
this.backList = res.data.records;
|
this.backTotal = Number(res.data.total);
|
this.playBackLoading = false;
|
});
|
},
|
exportData_() {
|
const params = {};
|
if (this.backFilterForm.oneDate) {
|
params.oneDate = this.filterForm.oneDate;
|
}
|
if (this.backFilterForm.stationName) {
|
params.stationName = this.filterForm.stationName;
|
}
|
let token = localStorage.getItem("mtoken");
|
let _params = qs.stringify({
|
token,
|
stationId: this.currentId,
|
...params,
|
});
|
let a = document.createElement("a");
|
a.href = `${
|
this.$exportBase + this.$Interface.basicResource.export.playBack
|
}?${_params}`;
|
a.click();
|
a = null;
|
},
|
pageChange(page) {
|
this.filterForm.pageNum = page;
|
this.getList();
|
},
|
backPageChage(page) {
|
this.backFilterForm.pageNum = page;
|
this.getBackList();
|
},
|
getPlayBack(id) {
|
this.playBackId = id;
|
this.currentId = id;
|
this.playBack = true;
|
this.backList = [];
|
if(this.filterForm.endDate){
|
this.backFilterForm.startDate = this.filterForm.endDate + ' 00:00:00';
|
this.backFilterForm.endDate = this.filterForm.endDate + ' 23:59:59';
|
}
|
|
this.backTimeRange = [new Date(this.filterForm.endDate + ' 00:00:00'), new Date(this.filterForm.endDate + ' 23:59:59')];
|
this.getBackList();
|
},
|
|
getRemoteSite(query) {
|
const params = {};
|
if (query) {
|
this.query = query;
|
this.searchPage = 1;
|
this.remoteSiteList = [];
|
} else {
|
this.query = "";
|
}
|
if (this.query) {
|
params.stationName = this.query;
|
}
|
this.$axios
|
.get(this.$Interface.basicResource.searchSite, {
|
params: {
|
limit: 20,
|
page: this.searchPage,
|
stationId: this.currentSite.stationId,
|
...params,
|
},
|
})
|
.then((res) => {
|
this.searchTotal = Number(res.data.pages);
|
this.remoteSiteList = this.remoteSiteList.concat(res.data.records);
|
});
|
},
|
|
editSite(site) {
|
this.$axios
|
.get(this.$Interface.basicResource.siteDetail, {
|
params: {
|
stationId: site.stationId,
|
},
|
})
|
.then((res) => {
|
this.currentSite = res.data;
|
this.showDialog = true;
|
this.showSelect = false;
|
this.remoteSiteList = [];
|
this.searchPage = 1;
|
this.query = "";
|
this.reSiteList = [];
|
this.getRemoteSite();
|
|
if (res.data.relateStationId) {
|
let temp = res.data.relateStationId.split(",");
|
let names = res.data.relateStation.split(",");
|
temp.forEach((item, index) => {
|
this.reSiteList.push({
|
stationId: item,
|
stationName: names[index],
|
});
|
});
|
}
|
});
|
// this.currentSite = site;
|
},
|
|
showSelect_() {
|
this.showSelect = true;
|
const that = this;
|
setTimeout(function () {
|
that.setLoadMore();
|
that.$refs.siteListDown.focus();
|
}, 100);
|
},
|
handleDetail(row) {
|
this.$router.push({
|
path: `/basicPassengerFlowDetail/${row.stationId}`,
|
query: {
|
id: row.stationId,
|
name: row.stationName,
|
typeName: '站点'
|
}
|
})
|
},
|
handleSelect(val) {
|
const that = this;
|
if (val) {
|
let obj = this.remoteSiteList.find((item) => {
|
return item.stationId === val;
|
});
|
|
let exist = this.reSiteList.find((item) => {
|
return item.stationId == val;
|
});
|
if (!exist) {
|
this.reSiteList.push(obj);
|
}
|
}
|
this.selectedSite = "";
|
this.$nextTick(function (){
|
document.querySelector('#fxpSiteLoadMoreSelect').click();
|
})
|
},
|
|
handleClose(index) {
|
this.reSiteList.splice(index, 1);
|
},
|
|
// 保存关联站点
|
saveRelSite() {
|
const obj = {};
|
obj.position = this.currentSite.position;
|
obj.stationId = this.currentSite.stationId;
|
const temp = this.reSiteList;
|
const names = [this.currentSite.stationName];
|
const ids = [this.currentSite.stationId];
|
for (let i = 0; i < temp.length; i++) {
|
names.push(temp[i].stationName);
|
ids.push(temp[i].stationId);
|
}
|
obj.stationIds = ids.join(",");
|
obj.stationNames = names.join(",");
|
if (!obj.position) {
|
this.$message({
|
message: "请输入位置信息",
|
type: "error",
|
});
|
return;
|
}
|
this.$axios
|
.post(this.$Interface.basicResource.siteMerge, obj)
|
.then((res) => {
|
this.$message({
|
message: "保存成功",
|
type: 'success',
|
startDate: this.filterForm.startDate,
|
endDate: this.filterForm.endDate
|
});
|
this.showDialog = false;
|
this.getList();
|
});
|
},
|
// 下拉滚动加载
|
setLoadMore() {
|
const that = this;
|
const el = document
|
.getElementById("fxpSiteEditDialog")
|
.getElementsByClassName("el-select-dropdown__wrap")[0];
|
function handleScroll() {
|
const dis = el.scrollHeight - el.scrollTop - el.clientHeight;
|
if (dis <= 0 && that.searchPage < that.searchTotal) {
|
that.searchPage += 1;
|
that.getRemoteSite();
|
}
|
}
|
el.addEventListener("scroll", handleScroll);
|
if (this.searchPage == this.searchTotal) {
|
el.removeEventListener("scroll", handleScroll);
|
}
|
},
|
},
|
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 {
|
display: flex;
|
align-items: flex-start;
|
text-align: right;
|
}
|
}
|
.action-bar {
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
color: #fff;
|
font-size: 14px;
|
margin-left: 50px;
|
padding-top: 5px;
|
.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);
|
}
|
}
|
|
.mask {
|
position: fixed;
|
top: 0;
|
left: 0;
|
z-index: 10;
|
width: 100vw;
|
height: 100vh;
|
background: rgba(0, 0, 0, 0.8);
|
}
|
.dialog {
|
width: 1305px;
|
height: 468px;
|
opacity: 1;
|
background: linear-gradient(180deg, #06203f, #08141c);
|
border: 2px solid #2a488a;
|
margin: auto;
|
position: fixed;
|
top: 160px;
|
left: 0;
|
right: 0;
|
z-index: 2000;
|
.title {
|
background: #090f1d;
|
padding: 1px;
|
.title-text {
|
display: inline-block;
|
// width: 120px;
|
padding: 0 20px;
|
flex-shrink: 0;
|
height: 32px;
|
background: #0c1a35;
|
border: 1px solid #47598f;
|
border-radius: 4px;
|
margin: 13px 24px;
|
text-align: center;
|
line-height: 32px;
|
}
|
}
|
.icon-close {
|
position: absolute;
|
top: 15px;
|
right: 13px;
|
width: 30px;
|
cursor: pointer;
|
}
|
|
.content-table {
|
.row {
|
display: flex;
|
min-height: 55px;
|
align-items: center;
|
border-top: 1px solid #415788;
|
.item {
|
display: flex;
|
align-items: center;
|
width: 620px;
|
.label {
|
color: #a3b0d1;
|
text-align: justify;
|
width: 60px;
|
margin-left: 24px;
|
text-align: right;
|
flex-shrink: 0;
|
}
|
.sep {
|
color: #a3b0d1;
|
margin-right: 10px;
|
}
|
}
|
}
|
/deep/input {
|
height: 32px;
|
background: rgba(0, 131, 250, 0.1);
|
border: 1px solid rgba(20, 131, 242, 0.6);
|
border-radius: 0;
|
font-size: 12px;
|
::placeholder {
|
font-size: 12px;
|
}
|
color: #fff !important;
|
}
|
/deep/.el-icon-arrow-up:before {
|
content: "\e78f";
|
}
|
/deep/.el-form-item__label {
|
color: #fff;
|
}
|
/deep/.el-icon-date::before {
|
content: "" !important;
|
}
|
/deep/.el-range-editor.el-input__inner {
|
background: none;
|
height: 32px;
|
background: rgba(0, 131, 250, 0.1);
|
border: 1px solid rgba(20, 131, 242, 0.6);
|
border-radius: 0;
|
font-size: 12px;
|
margin-top: 6px;
|
input {
|
border: none;
|
background: none;
|
}
|
.el-range-separator {
|
color: #fff;
|
line-height: 20px;
|
}
|
.el-range__close-icon {
|
line-height: 24px;
|
}
|
}
|
/deep/.el-select__input {
|
background: none !important;
|
border: 0 !important;
|
}
|
}
|
|
.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);
|
}
|
}
|
}
|
.button-new-tag,
|
.button-new-tag:focus,
|
.button-new-tag:hover {
|
height: 32px;
|
padding: 0!important;
|
color: #fff;
|
background: #06203f;
|
border: 1px solid rgba(17, 133, 226, 0.4);
|
width: 32px;
|
text-align: center;
|
}
|
/deep/.el-tag {
|
height: 32px;
|
background: #21345e;
|
border: 1px solid #4865be;
|
border-radius: 4px;
|
margin-right: 8px;
|
margin-bottom: 10px;
|
}
|
</style>
|