Skip to content

卡
卡车调度系统
Commit 1de63f2d authored by caicaicai's avatar caicaicai
Browse files
Options

修改

parent b0b7c5c3
Show whitespace changes
Inline Side-by-side
Showing with 915 additions and 11 deletions
src/views/MLargeScreen/components/carManagement/index.vue
View file @ 1de63f2d
<template>
<div class="carManScrView" v-if="whetherShow">
<div class="carManScrView_leftView">
<!-- 车辆运行状况 -->
<div>
......@@ -116,23 +117,143 @@
<img src="../../../../assets/images/cutGraph/huoche11.png" height="28">
<div>KK35125</div>
</div>
<div class="truckDynamicContent1">
<div class="truckDynamicRateStyle">
<div style="color:white;font-size:20px;">{{truckDynamicListData.rate}}%</div>
<div style="color:white;font-size:15px;">完成度</div>
</div>
<el-progress type="circle" :percentage="28" :stroke-width="7" :width="90" :height="90" :show-text='false'></el-progress>
<div style="text-align: center;">
<div style="font-size:14px;color:white;">今日运载量</div>
<div style="font-size:20px;color:#05F7FC;">{{truckDynamicListData.carry}}<span style="font-size:14px;">T</span></div>
<div style="font-size:14px;color:white;">今日工时</div>
<div style="font-size:20px;color:#05F7FC;">{{truckDynamicListData.workTime}}<span style="font-size:14px;">H</span></div>
</div>
<div style="text-align: center;">
<div style="font-size:14px;color:white;">今日完成度</div>
<div style="font-size:20px;color:#05F7FC;">{{truckDynamicListData.rate}}<span style="font-size:14px;">%</span></div>
<div style="font-size:14px;color:white;">今日里程</div>
<div style="font-size:20px;color:#05F7FC;">{{truckDynamicListData.mileage}}<span style="font-size:14px;">KM</span></div>
</div>
</div>
<div class="carDynamicContent1">
<div>
<img src="../../../../assets/images/cutGraph/mokuaikaobei4.png">
<div>开始工作时间</div>
<div>{{truckDynamicListData.startTime}}</div>
</div>
<div>
<img src="../../../../assets/images/cutGraph/mokuaikaobei4.png">
<div>结束工作时间</div>
<div>{{truckDynamicListData.endTime}}</div>
</div>
</div>
<div class="carDynamicContent2">
<img src="../../../../assets/images/cutGraph/tuiyuan1.png">
<span class="el-icon-sort"></span>
<div>
<div style="color:white;">{{truckDynamicListData.loadArea}}</div>
<div style="color:white;">{{truckDynamicListData.unloadArea}}</div>
</div>
<span class="el-icon-sort"></span>
<img src="../../../../assets/images/cutGraph/tuiyuan2.png">
</div>
</div>
</div>
<!-- 电铲动态-->
<div>
<div class="carManScrView_rightView_title">电铲动态</div>
<div class="carManScrView_rightView_content">
<div class="carDynamicTitleStyle">
<img src="../../../../assets/images/cutGraph/huoche11.png" height="28">
<div>KK35125</div>
</div>
<div class="ForkliftDynamicContent1">
<div>
<div>今日完成量</div>
<div class="ForkliftDynamicContent1_son1">{{forkliftkDynamicListData.rate}}%</div>
</div>
<div>
<div>今日工时/H</div>
<div class="ForkliftDynamicContent1_son1">{{forkliftkDynamicListData.workTime}}</div>
</div>
<div>
<div>今日里程/Km</div>
<div class="ForkliftDynamicContent1_son1">{{forkliftkDynamicListData.mileage}}</div>
</div>
</div>
<div class="carDynamicContent1">
<div>
<img src="../../../../assets/images/cutGraph/mokuaikaobei4.png">
<div>开始工作时间</div>
<div>{{forkliftkDynamicListData.startTime}}</div>
</div>
<div>
<img src="../../../../assets/images/cutGraph/mokuaikaobei4.png">
<div>结束工作时间</div>
<div>{{forkliftkDynamicListData.endTime}}</div>
</div>
</div>
<div class="carDynamicContent2">
<img src="../../../../assets/images/cutGraph/tuiyuan1.png">
<span class="el-icon-sort"></span>
<div>
<div style="color:white;">{{forkliftkDynamicListData.loadArea}}</div>
<div style="color:white;">{{forkliftkDynamicListData.unloadArea}}</div>
</div>
<span class="el-icon-sort"></span>
<img src="../../../../assets/images/cutGraph/tuiyuan2.png">
</div>
</div>
</div>
<!-- 其他车动态 -->
<div>
<div class="carManScrView_rightView_title">其他车动态</div>
<div class="carManScrView_rightView_content">
<div class="carDynamicTitleStyle">
<img src="../../../../assets/images/cutGraph/huoche11.png" height="28">
<div>KK35125</div>
</div>
<div class="otherCarDynamicContent1">
<div>
<div>今日完成量</div>
<div class="otherCarDynamicContent1_son1">{{otherCarDynamicListData.rate}}%</div>
</div>
<div>
<div>今日工时/H</div>
<div class="otherCarDynamicContent1_son1">{{otherCarDynamicListData.workTime}}</div>
</div>
<div>
<div>今日里程/Km</div>
<div class="otherCarDynamicContent1_son1">{{otherCarDynamicListData.mileage}}</div>
</div>
</div>
<div class="carDynamicContent1">
<div>
<img src="../../../../assets/images/cutGraph/mokuaikaobei4.png">
<div>开始工作时间</div>
<div>{{otherCarDynamicListData.startTime}}</div>
</div>
<div>
<img src="../../../../assets/images/cutGraph/mokuaikaobei4.png">
<div>结束工作时间</div>
<div>{{otherCarDynamicListData.endTime}}</div>
</div>
</div>
<div class="carDynamicContent2">
<img src="../../../../assets/images/cutGraph/tuiyuan1.png">
<span class="el-icon-sort"></span>
<div>
<div style="color:white;">{{otherCarDynamicListData.loadArea}}</div>
<div style="color:white;">{{otherCarDynamicListData.unloadArea}}</div>
</div>
<span class="el-icon-sort"></span>
<img src="../../../../assets/images/cutGraph/tuiyuan2.png">
</div>
</div>
</div>
</div>
</div>
</template>
......@@ -170,6 +291,37 @@ export default {
selectFieldText:'time',
listData:[],
selectTimeDate:'',
},
//卡车动态
truckDynamicListData:{
rate:28,
carry:4210,
workTime:13,
mileage:135,
startTime:'2022-03-25 09:00:00',
endTime:'2022-03-25 18:00:00',
loadArea:'装载区1',
unloadArea:'卸载口1',
},
//电铲动态
forkliftkDynamicListData:{
rate:28,
workTime:13,
mileage:135,
startTime:'2022-03-26 09:00:00',
endTime:'2022-03-26 18:00:00',
loadArea:'装载区2',
unloadArea:'卸载口2',
},
//其他车动态
otherCarDynamicListData:{
rate:28,
workTime:13,
mileage:135,
startTime:'2022-03-26 09:00:00',
endTime:'2022-03-26 18:00:00',
loadArea:'装载区2',
unloadArea:'卸载口2',
},
}
},
......@@ -476,7 +628,7 @@ export default {
}
.carManScrView_rightView>div{
width: 100%;
height: 32vh;
height: 31.8vh;
background:no-repeat center center url('~@/assets/images/cutGraph/yuanjianjuxing1.png');
background-size:100% 100%;
padding: 5px 7px;
......@@ -592,7 +744,7 @@ export default {
.carDynamicTitleStyle>div{
margin-left: 10px;
height: 3.5vh;
width: 5vw;
width: 6vw;
background:no-repeat center center url('~@/assets/images/cutGraph/xingzhuang9kaobei2.png');
background-size:100% 100%;
line-height: 3.5vh;
......@@ -601,4 +753,87 @@ export default {
font-weight: 600;
font-size: 17px;
}
.truckDynamicContent1{
position: relative;
margin-top: 1vh;
display: flex;
align-items: center;
font-weight: 600;
justify-content: space-evenly;
}
.truckDynamicRateStyle{
position: absolute;
left: 3vw;
top: 2.5vh;
text-align: center;
}
.carDynamicContent1{
width: 100%;
height: 7vh;
}
.carDynamicContent1>div{
color: #06EFFE;
margin-top: 5px;
display: flex;
justify-content: space-around;
align-items: center;
}
.carDynamicContent2{
width: 100%;
height: 5vh;
display: flex;
justify-content: space-between;
align-items: center;
padding: 0px 10px;
box-sizing: border-box;
color: #03BFFD;
}
.carDynamicContent2>span{
transform: rotateZ(90deg);
font-size: 30px;
}
.ForkliftDynamicContent1{
margin-top: 0.3vh;
display: flex;
justify-content: space-between;
width: 100%;
height: 10vh;
font-size: 15px;
}
.ForkliftDynamicContent1>div{
width: 33%;
text-align: center;
color: white;
}
.ForkliftDynamicContent1_son1{
margin: 0px auto;
width: 4.3vw;
height: 4.3vw;
border: 4px solid #06EFFE;
border-radius: 50%;
line-height: 3.8vw;
font-size: 24px;
}
.otherCarDynamicContent1{
margin-top: 0.3vh;
display: flex;
justify-content: space-between;
width: 100%;
height: 9vh;
font-size: 15px;
}
.otherCarDynamicContent1>div{
width: 33%;
text-align: center;
color: white;
}
.otherCarDynamicContent1_son1{
margin: 0px auto;
width: 4vw;
height: 4vw;
border: 4px solid #06EFFE;
border-radius: 50%;
line-height: 3.5vw;
font-size: 24px;
}
</style>
\ No newline at end of file
src/views/MLargeScreen/components/intelligentSchedul/index.vue
View file @ 1de63f2d
<template>
<div class="intelligentSchView">
智能调度
<div class="intelligentSchScrView" v-if="whetherShow">
<div class="intelligentSchScrView_leftView">
<!-- 人工调度 -->
<div>
<div class="intelligentSchScrView_leftView_title">人工调度</div>
<div class="intelligentSchScrView_leftView_content">
</div>
</div>
<!-- 近期通知列表-->
<div>
<div class="intelligentSchScrView_leftView_title">近期通知列表</div>
<div class="intelligentSchScrView_leftView_content">
</div>
</div>
</div>
<div class="intelligentSchScrView_rightView">
<!-- 智能调度信息 -->
<div>
<div class="intelligentSchScrView_rightView_title">智能调度信息</div>
<div class="intelligentSchScrView_rightView_content">
</div>
</div>
<!-- 电铲动态-->
<div>
<div class="intelligentSchScrView_rightView_title">电铲动态</div>
<div class="intelligentSchScrView_rightView_content">
<div class="ForkliftDynamicContent1">
<div>
<div>今日完成量</div>
<div class="ForkliftDynamicContent1_son1">{{forkliftkDynamicListData.rate}}%</div>
</div>
<div>
<div>今日工时/H</div>
<div class="ForkliftDynamicContent1_son1">{{forkliftkDynamicListData.workTime}}</div>
</div>
<div>
<div>今日里程/Km</div>
<div class="ForkliftDynamicContent1_son1">{{forkliftkDynamicListData.mileage}}</div>
</div>
</div>
<div class="carDynamicContent1">
<div>
<img src="../../../../assets/images/cutGraph/mokuaikaobei4.png">
<div>开始工作时间</div>
<div>{{forkliftkDynamicListData.startTime}}</div>
</div>
<div>
<img src="../../../../assets/images/cutGraph/mokuaikaobei4.png">
<div>结束工作时间</div>
<div>{{forkliftkDynamicListData.endTime}}</div>
</div>
</div>
<div class="carDynamicContent2">
<img src="../../../../assets/images/cutGraph/tuiyuan1.png">
<span class="el-icon-sort"></span>
<div>
<div style="color:white;">{{forkliftkDynamicListData.loadArea}}</div>
<div style="color:white;">{{forkliftkDynamicListData.unloadArea}}</div>
</div>
<span class="el-icon-sort"></span>
<img src="../../../../assets/images/cutGraph/tuiyuan2.png">
</div>
</div>
</div>
<!-- 其他车动态 -->
<div>
<div class="intelligentSchScrView_rightView_title">其他车动态</div>
<div class="intelligentSchScrView_rightView_content">
<div class="otherCarDynamicContent1">
<div>
<div>今日完成量</div>
<div class="otherCarDynamicContent1_son1">{{otherCarDynamicListData.rate}}%</div>
</div>
<div>
<div>今日工时/H</div>
<div class="otherCarDynamicContent1_son1">{{otherCarDynamicListData.workTime}}</div>
</div>
<div>
<div>今日里程/Km</div>
<div class="otherCarDynamicContent1_son1">{{otherCarDynamicListData.mileage}}</div>
</div>
</div>
<div class="carDynamicContent1">
<div>
<img src="../../../../assets/images/cutGraph/mokuaikaobei4.png">
<div>开始工作时间</div>
<div>{{otherCarDynamicListData.startTime}}</div>
</div>
<div>
<img src="../../../../assets/images/cutGraph/mokuaikaobei4.png">
<div>结束工作时间</div>
<div>{{otherCarDynamicListData.endTime}}</div>
</div>
</div>
<div class="carDynamicContent2">
<img src="../../../../assets/images/cutGraph/tuiyuan1.png">
<span class="el-icon-sort"></span>
<div>
<div style="color:white;">{{otherCarDynamicListData.loadArea}}</div>
<div style="color:white;">{{otherCarDynamicListData.unloadArea}}</div>
</div>
<span class="el-icon-sort"></span>
<img src="../../../../assets/images/cutGraph/tuiyuan2.png">
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import { Tools, HttpReq, Dates} from '@/assets/js/common.js';
import * as echarts from 'echarts';
export default {
data() {
return {
whetherShow:false,
//时间
currentTime:{
day:'',
month:'',
year:'',
},
//车辆运行状况
carWorkingStateData:{
online:[],
offline:[],
},
//卡车排行榜
truckRankListData:{
carclass:'卡车',
selectTimeText:'day',
selectFieldText:'juli',
listData:[],
selectTimeDate:'',
},
//电铲排行榜
forkLiftRankListData:{
carclass:'电铲',
selectTimeText:'day',
selectFieldText:'time',
listData:[],
selectTimeDate:'',
},
//卡车动态
truckDynamicListData:{
rate:28,
carry:4210,
workTime:13,
mileage:135,
startTime:'2022-03-25 09:00:00',
endTime:'2022-03-25 18:00:00',
loadArea:'装载区1',
unloadArea:'卸载口1',
},
//电铲动态
forkliftkDynamicListData:{
rate:28,
workTime:13,
mileage:135,
startTime:'2022-03-26 09:00:00',
endTime:'2022-03-26 18:00:00',
loadArea:'装载区2',
unloadArea:'卸载口2',
},
//其他车动态
otherCarDynamicListData:{
rate:28,
workTime:13,
mileage:135,
startTime:'2022-03-26 09:00:00',
endTime:'2022-03-26 18:00:00',
loadArea:'装载区2',
unloadArea:'卸载口2',
},
}
},
mounted() { },
methods: {
loadData(){
console.log('智能调度');
this.whetherShow = true;
this.dayCurrentTimeFn();
this.monthCurrentTimeFn();
this.yearCurrentTimeFn();
this.$nextTick(()=>{
//获取车辆运行状况
HttpReq.truckDispatching.screenDriverInformationQuery({size:9999}).then((res) => {
let kache1 = [];
let kachezaixian = [];
let kachelixian = [];
let dianchan1 = [];
let dianchanzaixian = [];
let dianchanlixian = [];
let qitache1 = [];
let qitachezaixian = [];
let qitachelixian = [];
let zaixianAllNum = [];
let lixianAllNum = [];
if(res.code == 200){
res.data.content.forEach((item)=>{
if(item.carclass == '卡车'){
kache1.push(item);
}else if(item.carclass == '电铲'){
dianchan1.push(item);
}else{
qitache1.push(item);
}
})
kache1.forEach((item)=>{
if(item.status == 1){
kachezaixian.push(item);
}else{
kachelixian.push(item);
}
})
dianchan1.forEach((item)=>{
if(item.status == 1){
dianchanzaixian.push(item);
}else{
dianchanlixian.push(item);
}
})
qitache1.forEach((item)=>{
if(item.status == 1){
qitachezaixian.push(item);
}else{
qitachelixian.push(item);
}
})
zaixianAllNum.push(kachezaixian.length);
zaixianAllNum.push(dianchanzaixian.length);
zaixianAllNum.push(qitachezaixian.length);
lixianAllNum.push(kachelixian.length);
lixianAllNum.push(dianchanlixian.length);
lixianAllNum.push(qitachelixian.length);
this.carWorkingStateData.online = zaixianAllNum;
this.carWorkingStateData.offline = lixianAllNum;
//绘制车辆运行状况图表
this.$nextTick(()=>{
this.carWorkingStateEcharts();
})
}
})
//获取卡车排行榜
this.truckRankListData.selectTimeDate = this.currentTime.day;
let truckQuery1 = {};
truckQuery1.size = 10;
truckQuery1.sort = this.truckRankListData.selectFieldText + ',desc';
truckQuery1.carclass = this.truckRankListData.carclass;
truckQuery1.createTime = this.truckRankListData.selectTimeDate;
this.$nextTick(()=>{
HttpReq.truckDispatching.screenDriverInformationQuery(truckQuery1).then((res) => {
if(res.code == 200){
this.truckRankListData.listData = res.data.content;
}
})
})
//获取电铲排行榜
this.forkLiftRankListData.selectTimeDate = this.currentTime.day;
let forkLiftQuery1 = {};
forkLiftQuery1.size = 10;
forkLiftQuery1.sort = this.forkLiftRankListData.selectFieldText + ',desc';
forkLiftQuery1.carclass = this.forkLiftRankListData.carclass;
forkLiftQuery1.createTime = this.forkLiftRankListData.selectTimeDate;
this.$nextTick(()=>{
HttpReq.truckDispatching.screenDriverInformationQuery(forkLiftQuery1).then((res) => {
if(res.code == 200){
this.forkLiftRankListData.listData = res.data.content;
}
})
})
//卡车动态
})
},
//车辆运行状况
carWorkingStateEcharts(){
let that = this;
var myChart = echarts.init(document.getElementById('carWorkingStateEcharts'));
var option = {
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow'
}
},
legend: {
textStyle:{
color: 'white',
fontSize:16,
}
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
xAxis: {
type: 'category',
data: ['卡车状态', '电铲状态', '其他车辆'],
axisLabel: {
show: true,
textStyle: {
color: 'white',
fontSize:16,
}
},
axisLine: {
lineStyle: {
color: 'white',
width: 1
}
},
},
yAxis: {
type: 'value',
axisLabel: {
show: true,
textStyle: {
color: 'white',
fontSize:16,
}
},
axisLine: {
lineStyle: {
color: 'white',
width: 0
}
},
},
series: [
{
name: '车辆离线',
type: 'bar',
data: that.carWorkingStateData.offline,
barWidth: 20,
itemStyle: {
color: '#14F3C5'
},
},
{
name: '车辆在线',
type: 'bar',
data: that.carWorkingStateData.online,
barWidth: 20,
itemStyle: {
color: '#2195FD'
},
}
]
};
option && myChart.setOption(option);
},
//卡车切换时间
truckChangeTime(text){
this.truckRankListData.selectTimeText = text;
if(text == 'day'){
this.truckRankListData.selectTimeDate = this.currentTime.day;
}
if(text == 'month'){
this.truckRankListData.selectTimeDate = this.currentTime.month;
}
if(text == 'year'){
this.truckRankListData.selectTimeDate = this.currentTime.year;
}
},
//卡车切换字段排序
truckChangeField(text){
this.truckRankListData.selectFieldText = text;
let truckQuery1 = {};
truckQuery1.size = 10;
truckQuery1.sort = this.truckRankListData.selectFieldText + ',desc';
truckQuery1.carclass = this.truckRankListData.carclass;
truckQuery1.createTime = this.truckRankListData.selectTimeDate;
this.$nextTick(()=>{
HttpReq.truckDispatching.screenDriverInformationQuery(truckQuery1).then((res) => {
if(res.code == 200){
this.truckRankListData.listData = res.data.content;
}
})
})
},
//电铲切换时间
forkLiftChangeTime(text){
this.forkLiftRankListData.selectTimeText = text;
if(text == 'day'){
this.forkLiftRankListData.selectTimeDate = this.currentTime.day;
}
if(text == 'month'){
this.forkLiftRankListData.selectTimeDate = this.currentTime.month;
}
if(text == 'year'){
this.forkLiftRankListData.selectTimeDate = this.currentTime.year;
}
},
//电铲切换字段排序
forkLiftChangeField(text){
this.forkLiftRankListData.selectFieldText = text;
let forkLiftQuery1 = {};
forkLiftQuery1.size = 10;
forkLiftQuery1.sort = this.forkLiftRankListData.selectFieldText + ',desc';
forkLiftQuery1.carclass = this.forkLiftRankListData.carclass;
forkLiftQuery1.createTime = this.forkLiftRankListData.selectTimeDate;
this.$nextTick(()=>{
HttpReq.truckDispatching.screenDriverInformationQuery(forkLiftQuery1).then((res) => {
if(res.code == 200){
this.forkLiftRankListData.listData = res.data.content;
}
})
})
},
//获取当前时间
dayCurrentTimeFn(){
var date = new Date();
var year = date.getFullYear(); //年 ,从 Date 对象以四位数字返回年份
var month = date.getMonth() + 1; //月 ,从 Date 对象返回月份 (0 ~ 11) ,date.getMonth()比实际月份少 1 个月
var day = date.getDate(); //日 ,从 Date 对象返回一个月中的某一天 (1 ~ 31)
//修改月份格式
if (month >= 1 && month <= 9) {
month = "0" + month;
}
//修改日期格式
if (day >= 0 && day <= 9) {
day = "0" + day;
}
let currentFormatDate = year + "-" + month + "-" + day;
this.currentTime.day = currentFormatDate;
},
monthCurrentTimeFn(){
var date = new Date();
var year = date.getFullYear(); //年 ,从 Date 对象以四位数字返回年份
var month = date.getMonth() + 1; //月 ,从 Date 对象返回月份 (0 ~ 11) ,date.getMonth()比实际月份少 1 个月
//修改月份格式
if (month >= 1 && month <= 9) {
month = "0" + month;
}
let currentFormatDate = year + "-" + month;
this.currentTime.month = currentFormatDate;
},
yearCurrentTimeFn(){
var date = new Date();
var year = date.getFullYear(); //年 ,从 Date 对象以四位数字返回年份
let currentFormatDate = year;
this.currentTime.year = currentFormatDate;
},
},
}
</script>
<style>
.intelligentSchView{
<style scoped>
.intelligentSchScrView{
width: 100%;
height: 100%;
overflow: hidden;
background-color: aliceblue;
display: flex;
justify-content: space-between;
}
.intelligentSchScrView_leftView{
height: 100%;
width: 20%;
}
.intelligentSchScrView_rightView{
height: 100%;
width: 20%;
}
.intelligentSchScrView_leftView>div{
width: 100%;
height: 32vh;
background:no-repeat center center url('~@/assets/images/cutGraph/yuanjianjuxing1.png');
background-size:100% 100%;
padding: 5px 7px;
box-sizing: border-box;
overflow: hidden;
}
.intelligentSchScrView_rightView>div{
width: 100%;
height: 31.8vh;
background:no-repeat center center url('~@/assets/images/cutGraph/yuanjianjuxing1.png');
background-size:100% 100%;
padding: 5px 7px;
box-sizing: border-box;
overflow: hidden;
}
.intelligentSchScrView_leftView_title,.intelligentSchScrView_rightView_title{
margin-bottom: 5px;
width: 100%;
height: 3.5vh;
background:no-repeat center center url('~@/assets/images/cutGraph/biaoti1.png');
background-size:100% 100%;
padding-left: 10px;
box-sizing: border-box;
font-size: 18px;
line-height: 3.5vh;
color: #FAFAFB;
letter-spacing: 1px;
text-shadow: 1px 1px 1px #92CBFF;
}
.intelligentSchScrView_leftView_content,.intelligentSchScrView_rightView_content{
width: 100%;
height: 27vh;
}
.rolling{
height: 13.5vh;
overflow-y:auto;
scrollbar-width: none;
}
.rolling::-webkit-scrollbar {
display: none;
}
.truck_titleStyle{
display: flex;
justify-content: space-between;
padding-right: 4vw;
}
.driverTitleDateStyle{
display: flex;
color: #06EFFE;
font-size: 16px;
text-shadow: 0px 0px 0px;
height: 3.5vh;
align-items: center;
}
.driverTitleDateStyle_son1{
height: 2.5vh;
line-height: 2.5vh;
margin-right: 5px;
padding:0px 5px;
background-color: #2DB3BB;
box-sizing: border-box;
border-radius: 5px;
cursor: pointer;
}
.driverTitleDateStyle_son2{
height: 2.5vh;
line-height: 2.5vh;
margin-right: 5px;
padding:0px 5px;
box-sizing: border-box;
border-radius: 5px;
cursor: pointer;
}
.intelligentSchScrView_leftView_content_views2{
display: flex;
justify-content: space-between;
}
.intelligentSchScrView_leftView_content_views2>div{
height: 2.5vh;
width: 24%;
font-size: 15px;
border:2px solid #01A6FC;
border-radius: 5px;
color: #06EFFE;
line-height: 2.2vh;
text-align: center;
cursor: pointer;
font-weight: 600;
}
.selectFieldStyle{
opacity: 0.7;
}
.intelligentSchScrView_leftView_content_views3{
width: 100%;
height: 24vh;
overflow-y:auto;
scrollbar-width: none;
}
.intelligentSchScrView_leftView_content_views3::-webkit-scrollbar {
display: none;
}
.intelligentSchScrView_leftView_content_views3>div>div{
font: 18px;
font-weight: 600;
display: flex;
justify-content: space-evenly;
}
.intelligentSchScrView_leftView_content_views3>div>div>div{
margin-top: 7px;
}
#carWorkingStateEcharts{
width: 100%;
height: 28vh;
}
.carDynamicTitleStyle{
display: flex;
width: 100%;
height: 3.5vh;
align-items: center;
}
.carDynamicTitleStyle>div{
margin-left: 10px;
height: 3.5vh;
width: 6vw;
background:no-repeat center center url('~@/assets/images/cutGraph/xingzhuang9kaobei2.png');
background-size:100% 100%;
line-height: 3.5vh;
text-align: center;
color: #06EFFE;
font-weight: 600;
font-size: 17px;
}
.truckDynamicContent1{
position: relative;
margin-top: 1vh;
display: flex;
align-items: center;
font-weight: 600;
justify-content: space-evenly;
}
.truckDynamicRateStyle{
position: absolute;
left: 3vw;
top: 2.5vh;
text-align: center;
}
.carDynamicContent1{
width: 100%;
height: 7vh;
}
.carDynamicContent1>div{
color: #06EFFE;
margin-top: 5px;
display: flex;
justify-content: space-around;
align-items: center;
}
.carDynamicContent2{
width: 100%;
height: 5vh;
display: flex;
justify-content: space-between;
align-items: center;
padding: 0px 10px;
box-sizing: border-box;
color: #03BFFD;
}
.carDynamicContent2>span{
transform: rotateZ(90deg);
font-size: 30px;
}
.ForkliftDynamicContent1{
margin-top: 0.3vh;
display: flex;
justify-content: space-between;
width: 100%;
height: 10vh;
font-size: 15px;
}
.ForkliftDynamicContent1>div{
width: 33%;
text-align: center;
color: white;
}
.ForkliftDynamicContent1_son1{
margin: 0px auto;
width: 4.3vw;
height: 4.3vw;
border: 4px solid #06EFFE;
border-radius: 50%;
line-height: 3.8vw;
font-size: 24px;
}
.otherCarDynamicContent1{
margin-top: 0.3vh;
display: flex;
justify-content: space-between;
width: 100%;
height: 9vh;
font-size: 15px;
}
.otherCarDynamicContent1>div{
width: 33%;
text-align: center;
color: white;
}
.otherCarDynamicContent1_son1{
margin: 0px auto;
width: 4vw;
height: 4vw;
border: 4px solid #06EFFE;
border-radius: 50%;
line-height: 3.5vw;
font-size: 24px;
}
</style>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment