<template>
|
<div class="in-box">
|
<div class="header">
|
<div class="in-top-box flex ju-sb align-c">
|
<div class="header-title-i">车辆数量：{{clname}}</div>
|
<div class="flex">
|
<div class="flex align-c"></div>
|
<div class="header-temp"></div>
|
<div class="flex align-c">
|
<img class="close-img-size" src="../../assets/map/icon_close_s@2x.png" alt="" @click="closediv">
|
</div>
|
</div>
|
</div>
|
</div>
|
<!-- <div class="container-info color-white ">
|
<div class="flex warp mt20">
|
<div class="flex item-info">
|
<div class="flex" >
|
<img class="img-size" src="../../assets/map/icon_shishikeliu.png" alt="">
|
<div class="divtext">
|
<div class="divnumber">{{typeof form.sumPassengerFlow == "number" ? form.sumPassengerFlow : '-'}}</div>
|
<div>实际客流</div>
|
</div>
|
</div>
|
|
</div>
|
<div class="flex item-info">
|
<div class="flex" >
|
<img class="img-size" src="../../assets/map/icon_zuorikeliu.png" alt="">
|
<div class="divtext">
|
<div class="divnumber">{{typeof form.sumLine == "number" ? form.sumLine : '-'}}</div>
|
<div>昨日客流</div>
|
</div>
|
</div>
|
|
</div>
|
</div>
|
</div> -->
|
|
</div>
|
</template>
|
<script>
|
import gauge1 from '../../components/echart/gauge1.vue'
|
export default {
|
name: 'cheliangcircleinfo',
|
props: {
|
data1: {
|
type:Object,
|
default(){
|
return{}
|
}
|
}
|
},
|
data() {
|
return {
|
show:false,
|
clname: "",
|
form: {
|
"companyId": 661,
|
"companyName": "横琴分公司",
|
"longitude": 113.559449,
|
"latitude": 22.273125,
|
"sumPassengerFlow": 5,
|
"sumLine": 62,
|
"sumVehicle": 190,
|
"sumVehicleMileage": null,
|
"sumDriver": 0,
|
}
|
}
|
},
|
components:{
|
gauge1
|
},
|
|
methods: {
|
getSelectDetailByName(params) {
|
},
|
closediv(){
|
this.$emit("closediv","cheliangcircle")
|
}
|
},
|
mounted() {
|
},
|
watch: {
|
"$store.state.selAttr": function(newVal,oldVal){
|
if(newVal.visa && newVal.type == "cheliangcircle"){
|
this.clname = newVal.value.split(",").length
|
this.getSelectDetailByName(newVal.value)
|
}
|
}
|
|
}
|
}
|
</script>
|
<style scoped>
|
.in-box{
|
width: 536px;
|
height: 40px;
|
opacity: 0.8;
|
background: linear-gradient(180deg,#06203f, #08141c);
|
border: 2px solid #2a488a;
|
}
|
.header{width:100%;height:44px;background:url("../../assets/png/header_bg_info.png") no-repeat center/cover;}
|
.in-top-box{width:90%;height:34px; margin:0 auto;}
|
.header-title-i{color:#333;font-weight: 600;font-size:16px;}
|
.small-p{color:#00f09b;font-size:14px;}
|
.more-img-size{width:12px;height:12px}
|
.container-info{width:460px;margin:15px auto 0;}
|
.item-info{width:33%;text-align: center;position:relative}
|
.img-size{width:48px;height:48px;}
|
.divtext {padding-left: 10px; text-align: left;}
|
.divnumber {font-family:'Digital';font-size: 16px;color:aqua}
|
.line-fg{height: 1px;opacity: 0.4;border: 1px solid #2a4a8e;}
|
.title-b{position: absolute;bottom:0;left:0;right:0;margin:0 auto;font-size:12px;}
|
|
</style>
|
