Skip to content

N
NewTruckTerminalSyetem
Commit fa964e51 authored by xxx's avatar xxx
Browse files
Options

1

parent 1636ef18
Show whitespace changes
Inline Side-by-side
Showing with 802 additions and 396 deletions
src/views/Login.vue
View file @ fa964e51
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
<el-input <el-input
v-model="loginForm.username" v-model="loginForm.username"
id="userInp" id="userInp"
placeholder="输入你的用户名" placeholder="输入用户名"
@focus="showkey('username')" @focus="showkey('username')"
></el-input> ></el-input>
</el-form-item> </el-form-item>
...@@ -25,7 +25,7 @@ ...@@ -25,7 +25,7 @@
type="password" type="password"
v-model="loginForm.password" v-model="loginForm.password"
id="passWordInp" id="passWordInp"
placeholder="输入你的密码" placeholder="输入密码"
@focus="showkey('password')" @focus="showkey('password')"
></el-input> ></el-input>
</el-form-item> </el-form-item>
...@@ -166,24 +166,127 @@ export default { ...@@ -166,24 +166,127 @@ export default {
</script> </script>
<style> <style>
* { @media screen and (max-width:901px) {
margin: 0; .backGround {
padding: 0; padding-top: 2vh;
} box-sizing: border-box;
.keyboardStyle{ height: 100vh;
width: 100vw;
background-image: url("../assets/imgs/bg.png");
}
.projectName{
text-align: center;
font-size: 40px;
font-weight: 600;
background-image:-webkit-linear-gradient(bottom,rgb(36,162,254),rgb(255,255,255));
background-clip:text;
-webkit-text-fill-color:transparent;
letter-spacing: 3px;
}
.loginBody{
position: relative;
padding-top: 9vh;
box-sizing: border-box;
margin: 0 auto;
width: 70%;
height: 90%;
background-image: url("../assets/imgs/kuang.png");
background-size: 100% 110%;
margin-top: -5vh;
}
.loginTitle{
margin-left: 4vw;
text-align: center;
font-size: 19px;
color:rgb(47,213,255);
letter-spacing: 6px;
}
.loginText{
margin-top: 20px;
margin-left: 50px;
text-align: center;
font-size: 30px;
color:rgb(151,227,244);
letter-spacing: 6px;
margin-bottom: 10px;
}
.loginInoputs{
margin-top: 8vh;
position: absolute; position: absolute;
top:0; right: 6vw;
left: 0; }
z-index: 100; .userInpBody{
padding: 2px;
border: 1px solid rgb(18,70,113);
margin-bottom: 20px;
}
.el-form-item__content{
display: flex;
width: 25vw;
}
.userIcon{
padding: 11px;
box-sizing: border-box;
width: 50px;
height: 50px;
background-color: rgb(18,70,113);
}
#userInp{
height: 100%;
width: 100%;
background: none;
outline: none;
border: none;
font-size: 20px;
color: rgb(47,213,255);
}
/* .el-input input::-webkit-input-placeholder {
color:rgb(47,213,255);
} */
.passWordInpBody{
display: flex;
padding: 2px;
border: 1px solid rgb(18,70,113);
margin-bottom: 50px;
}
.passWordIcon{
padding: 11px;
box-sizing: border-box;
width: 50px;
height: 50px;
background-color: rgb(18,70,113);
}
#passWordInp{
height: 100%;
width: 80%;
background: none;
outline: none;
border: none;
font-size: 20px;
color: rgb(47,213,255);
letter-spacing: 2px;
}
.loginBtn{
width: 100%;
height: 10vh;
font-size: 17px;
background-color:rgb(24,180,255);
border: 0px;
color: white;
letter-spacing: 10px;
cursor: pointer;
}
} }
.backGround {
@media screen and (min-width:901px) {
.backGround {
padding-top: 50px; padding-top: 50px;
box-sizing: border-box; box-sizing: border-box;
height: 100vh; height: 100vh;
width: 100vw; width: 100vw;
background-image: url("../assets/imgs/bg.png"); background-image: url("../assets/imgs/bg.png");
} }
.projectName{ .projectName{
text-align: center; text-align: center;
font-size: 70px; font-size: 70px;
font-weight: 600; font-weight: 600;
...@@ -191,25 +294,25 @@ export default { ...@@ -191,25 +294,25 @@ export default {
background-clip:text; background-clip:text;
-webkit-text-fill-color:transparent; -webkit-text-fill-color:transparent;
letter-spacing: 3px; letter-spacing: 3px;
} }
.loginBody{ .loginBody{
position: relative; position: relative;
padding-top: 60px; padding-top: 9vh;
box-sizing: border-box; box-sizing: border-box;
margin: 0 auto; margin: 0 auto;
width: 75%; width: 75%;
height: 90%; height: 90%;
background-image: url("../assets/imgs/kuang.png"); background-image: url("../assets/imgs/kuang.png");
background-size: 100% 100%; background-size: 100% 100%;
} }
.loginTitle{ .loginTitle{
margin-left: 50px; margin-left: 50px;
text-align: center; text-align: center;
font-size: 25px; font-size: 25px;
color:rgb(47,213,255); color:rgb(47,213,255);
letter-spacing: 6px; letter-spacing: 6px;
} }
.loginText{ .loginText{
margin-top: 20px; margin-top: 20px;
margin-left: 50px; margin-left: 50px;
text-align: center; text-align: center;
...@@ -217,30 +320,28 @@ export default { ...@@ -217,30 +320,28 @@ export default {
color:rgb(151,227,244); color:rgb(151,227,244);
letter-spacing: 6px; letter-spacing: 6px;
margin-bottom: 10px; margin-bottom: 10px;
} }
.loginInoputs{ .loginInoputs{
margin-top: 80px; margin-top: 15vh;
position: absolute; position: absolute;
right: 100px; right: 13vh;
width: 340px; }
height: 300px; .userInpBody{
}
.userInpBody{
padding: 2px; padding: 2px;
border: 1px solid rgb(18,70,113); border: 1px solid rgb(18,70,113);
margin-bottom: 20px; margin-bottom: 20px;
} }
.el-form-item__content{ .el-form-item__content{
display: flex; display: flex;
} }
.userIcon{ .userIcon{
padding: 11px; padding: 11px;
box-sizing: border-box; box-sizing: border-box;
width: 50px; width: 50px;
height: 50px; height: 50px;
background-color: rgb(18,70,113); background-color: rgb(18,70,113);
} }
#userInp{ #userInp{
height: 100%; height: 100%;
width: 100%; width: 100%;
background: none; background: none;
...@@ -249,24 +350,24 @@ export default { ...@@ -249,24 +350,24 @@ export default {
font-size: 20px; font-size: 20px;
color: rgb(47,213,255); color: rgb(47,213,255);
letter-spacing: 2px; letter-spacing: 2px;
} }
/* .el-input input::-webkit-input-placeholder { /* .el-input input::-webkit-input-placeholder {
color:rgb(47,213,255); color:rgb(47,213,255);
} */ } */
.passWordInpBody{ .passWordInpBody{
display: flex; display: flex;
padding: 2px; padding: 2px;
border: 1px solid rgb(18,70,113); border: 1px solid rgb(18,70,113);
margin-bottom: 50px; margin-bottom: 50px;
} }
.passWordIcon{ .passWordIcon{
padding: 11px; padding: 11px;
box-sizing: border-box; box-sizing: border-box;
width: 50px; width: 50px;
height: 50px; height: 50px;
background-color: rgb(18,70,113); background-color: rgb(18,70,113);
} }
#passWordInp{ #passWordInp{
height: 100%; height: 100%;
width: 80%; width: 80%;
background: none; background: none;
...@@ -275,8 +376,8 @@ export default { ...@@ -275,8 +376,8 @@ export default {
font-size: 20px; font-size: 20px;
color: rgb(47,213,255); color: rgb(47,213,255);
letter-spacing: 2px; letter-spacing: 2px;
} }
.loginBtn{ .loginBtn{
width: 100%; width: 100%;
height: 60px; height: 60px;
font-size: 26px; font-size: 26px;
...@@ -285,5 +386,18 @@ export default { ...@@ -285,5 +386,18 @@ export default {
color: white; color: white;
letter-spacing: 10px; letter-spacing: 10px;
cursor: pointer; cursor: pointer;
}
}
* {
margin: 0;
padding: 0;
} }
.keyboardStyle{
position: absolute;
top:0;
left: 0;
z-index: 100;
}
</style> </style>
\ No newline at end of file
src/views/MLargeScreen/index.vue
View file @ fa964e51
...@@ -532,19 +532,20 @@ export default { ...@@ -532,19 +532,20 @@ export default {
</script> </script>
<style scope> <style scope>
.mapcontainer { @media screen and (max-width:901px){
.mapcontainer {
height: 100vh; height: 100vh;
width: 100vw; width: 100vw;
top: 0px; top: 0px;
position: absolute; position: absolute;
overflow: hidden; overflow: hidden;
} }
.mianViews{ .mianViews{
width: 100vw; width: 100vw;
height: 100vh; height: 100vh;
overflow: hidden; overflow: hidden;
} }
.topViews{ .topViews{
position: absolute; position: absolute;
top: 0px; top: 0px;
z-index: 1; z-index: 1;
...@@ -556,16 +557,16 @@ export default { ...@@ -556,16 +557,16 @@ export default {
align-items: center; align-items: center;
padding: 0px 20px; padding: 0px 20px;
box-sizing: border-box; box-sizing: border-box;
} }
.topTitle{ .topTitle{
background-image:-webkit-linear-gradient(bottom, #59C8FF, #FAFEFF); background-image:-webkit-linear-gradient(bottom, #59C8FF, #FAFEFF);
-webkit-background-clip:text; -webkit-background-clip:text;
-webkit-text-fill-color:transparent; -webkit-text-fill-color:transparent;
font-size: 27px; font-size: 27px;
letter-spacing: 4px; letter-spacing: 4px;
font-weight: bold; font-weight: bold;
} }
.topcontent{ .topcontent{
display: flex; display: flex;
align-items: center; align-items: center;
font-size: 24px; font-size: 24px;
...@@ -573,8 +574,8 @@ export default { ...@@ -573,8 +574,8 @@ export default {
background-image:-webkit-linear-gradient(bottom, #59C8FF, #FAFEFF); background-image:-webkit-linear-gradient(bottom, #59C8FF, #FAFEFF);
-webkit-background-clip:text; -webkit-background-clip:text;
-webkit-text-fill-color:transparent; -webkit-text-fill-color:transparent;
} }
.centerViews{ .centerViews{
position: absolute; position: absolute;
top: 0px; top: 0px;
left: 0px; left: 0px;
...@@ -583,18 +584,18 @@ export default { ...@@ -583,18 +584,18 @@ export default {
font-weight: 600; font-weight: 600;
text-align: center; text-align: center;
letter-spacing: 2px; letter-spacing: 2px;
} }
.centerViewsTitle1{ .centerViewsTitle1{
margin-top: 10.5vh; margin-top: 10.5vh;
background-image:-webkit-linear-gradient(bottom, #59C8FF, #FAFEFF); background-image:-webkit-linear-gradient(bottom, #59C8FF, #FAFEFF);
-webkit-background-clip:text; -webkit-background-clip:text;
-webkit-text-fill-color:transparent; -webkit-text-fill-color:transparent;
} }
.centerViewsTitle2{ .centerViewsTitle2{
margin-top: 10.5vh; margin-top: 10.5vh;
color:gainsboro; color:gainsboro;
} }
.IntelligentDis1{ .IntelligentDis1{
height: 15vh; height: 15vh;
width: 16vh; width: 16vh;
background:no-repeat center center url('~@/assets/images/truckTuPian/zhinengpaidan1.png'); background:no-repeat center center url('~@/assets/images/truckTuPian/zhinengpaidan1.png');
...@@ -603,8 +604,8 @@ export default { ...@@ -603,8 +604,8 @@ export default {
top: 6.5vh; top: 6.5vh;
left: 0.8vw; left: 0.8vw;
cursor: pointer; cursor: pointer;
} }
.IntelligentDis2{ .IntelligentDis2{
height: 15vh; height: 15vh;
width: 16vh; width: 16vh;
background:no-repeat center center url('~@/assets/images/truckTuPian/zhinengpaidan2.png'); background:no-repeat center center url('~@/assets/images/truckTuPian/zhinengpaidan2.png');
...@@ -613,8 +614,8 @@ export default { ...@@ -613,8 +614,8 @@ export default {
top: 6.5vh; top: 6.5vh;
left: 0.8vw; left: 0.8vw;
cursor: pointer; cursor: pointer;
} }
.voiceAp1{ .voiceAp1{
height: 15vh; height: 15vh;
width: 16vh; width: 16vh;
background:no-repeat center center url('~@/assets/images/truckTuPian/yuyinshenping1.png'); background:no-repeat center center url('~@/assets/images/truckTuPian/yuyinshenping1.png');
...@@ -623,8 +624,8 @@ export default { ...@@ -623,8 +624,8 @@ export default {
top: 22vh; top: 22vh;
left: 0.8vw; left: 0.8vw;
cursor: pointer; cursor: pointer;
} }
.voiceAp2{ .voiceAp2{
height: 15vh; height: 15vh;
width: 16vh; width: 16vh;
background:no-repeat center center url('~@/assets/images/truckTuPian/yuyinshenping2.png'); background:no-repeat center center url('~@/assets/images/truckTuPian/yuyinshenping2.png');
...@@ -633,8 +634,8 @@ export default { ...@@ -633,8 +634,8 @@ export default {
top: 22vh; top: 22vh;
left: 0.8vw; left: 0.8vw;
cursor: pointer; cursor: pointer;
} }
.failureDe1{ .failureDe1{
height: 15vh; height: 15vh;
width: 16vh; width: 16vh;
background:no-repeat center center url('~@/assets/images/truckTuPian/guzhangshenbao1.png'); background:no-repeat center center url('~@/assets/images/truckTuPian/guzhangshenbao1.png');
...@@ -643,8 +644,8 @@ export default { ...@@ -643,8 +644,8 @@ export default {
top: 37.5vh; top: 37.5vh;
left: 0.8vw; left: 0.8vw;
cursor: pointer; cursor: pointer;
} }
.failureDe2{ .failureDe2{
height: 15vh; height: 15vh;
width: 16vh; width: 16vh;
background:no-repeat center center url('~@/assets/images/truckTuPian/guzhangshenbao2.png'); background:no-repeat center center url('~@/assets/images/truckTuPian/guzhangshenbao2.png');
...@@ -653,8 +654,8 @@ export default { ...@@ -653,8 +654,8 @@ export default {
top: 37.5vh; top: 37.5vh;
left: 0.8vw; left: 0.8vw;
cursor: pointer; cursor: pointer;
} }
.performanceSt1{ .performanceSt1{
height: 15vh; height: 15vh;
width: 16vh; width: 16vh;
background:no-repeat center center url('~@/assets/images/truckTuPian/jixiao1.png'); background:no-repeat center center url('~@/assets/images/truckTuPian/jixiao1.png');
...@@ -663,8 +664,8 @@ export default { ...@@ -663,8 +664,8 @@ export default {
top: 53vh; top: 53vh;
left: 0.8vw; left: 0.8vw;
cursor: pointer; cursor: pointer;
} }
.performanceSt2{ .performanceSt2{
height: 15vh; height: 15vh;
width: 16vh; width: 16vh;
background:no-repeat center center url('~@/assets/images/truckTuPian/jixiao2.png'); background:no-repeat center center url('~@/assets/images/truckTuPian/jixiao2.png');
...@@ -673,8 +674,8 @@ export default { ...@@ -673,8 +674,8 @@ export default {
top: 53vh; top: 53vh;
left: 0.8vw; left: 0.8vw;
cursor: pointer; cursor: pointer;
} }
.carIn1{ .carIn1{
height: 15vh; height: 15vh;
width: 16vh; width: 16vh;
background:no-repeat center center url('~@/assets/images/truckTuPian/cheliangxinxi1.png'); background:no-repeat center center url('~@/assets/images/truckTuPian/cheliangxinxi1.png');
...@@ -683,8 +684,8 @@ export default { ...@@ -683,8 +684,8 @@ export default {
top: 68.5vh; top: 68.5vh;
left: 0.8vw; left: 0.8vw;
cursor: pointer; cursor: pointer;
} }
.carIn2{ .carIn2{
height: 15vh; height: 15vh;
width: 16vh; width: 16vh;
background:no-repeat center center url('~@/assets/images/truckTuPian/cheliangxinxi2.png'); background:no-repeat center center url('~@/assets/images/truckTuPian/cheliangxinxi2.png');
...@@ -693,8 +694,8 @@ export default { ...@@ -693,8 +694,8 @@ export default {
top: 68.5vh; top: 68.5vh;
left: 0.8vw; left: 0.8vw;
cursor: pointer; cursor: pointer;
} }
.personalCe1{ .personalCe1{
height: 15vh; height: 15vh;
width: 16vh; width: 16vh;
background:no-repeat center center url('~@/assets/images/truckTuPian/gerenzhongxin1.png'); background:no-repeat center center url('~@/assets/images/truckTuPian/gerenzhongxin1.png');
...@@ -703,8 +704,8 @@ export default { ...@@ -703,8 +704,8 @@ export default {
top: 84vh; top: 84vh;
left: 0.8vw; left: 0.8vw;
cursor: pointer; cursor: pointer;
} }
.personalCe2{ .personalCe2{
height: 15vh; height: 15vh;
width: 16vh; width: 16vh;
background:no-repeat center center url('~@/assets/images/truckTuPian/gerenzhongxin2.png'); background:no-repeat center center url('~@/assets/images/truckTuPian/gerenzhongxin2.png');
...@@ -713,8 +714,8 @@ export default { ...@@ -713,8 +714,8 @@ export default {
top: 84vh; top: 84vh;
left: 0.8vw; left: 0.8vw;
cursor: pointer; cursor: pointer;
} }
.roadblockStyle{ .roadblockStyle{
position: absolute; position: absolute;
z-index: 1; z-index: 1;
right: 170px; right: 170px;
...@@ -730,8 +731,8 @@ export default { ...@@ -730,8 +731,8 @@ export default {
border: 1px solid lightskyblue; border: 1px solid lightskyblue;
opacity: 0.9; opacity: 0.9;
cursor: pointer; cursor: pointer;
} }
.dispatchCenterStyle{ .dispatchCenterStyle{
z-index: 1; z-index: 1;
position: absolute; position: absolute;
right: 20px; right: 20px;
...@@ -747,8 +748,8 @@ export default { ...@@ -747,8 +748,8 @@ export default {
border: 1px solid lightskyblue; border: 1px solid lightskyblue;
opacity: 0.9; opacity: 0.9;
cursor: pointer; cursor: pointer;
} }
.smallWindowStyle{ .smallWindowStyle{
color: red; color: red;
font-size: 50px; font-size: 50px;
position: absolute; position: absolute;
...@@ -756,8 +757,8 @@ export default { ...@@ -756,8 +757,8 @@ export default {
top: 50%; top: 50%;
left: 50%; left: 50%;
transform: translate(-50%,-50%); transform: translate(-50%,-50%);
} }
.waitingtrucksView{ .waitingtrucksView{
position: absolute; position: absolute;
right: 0px; right: 0px;
top: 8vh; top: 8vh;
...@@ -768,8 +769,8 @@ export default { ...@@ -768,8 +769,8 @@ export default {
z-index: 1; z-index: 1;
padding: 10px 10px 0px; padding: 10px 10px 0px;
box-sizing: border-box; box-sizing: border-box;
} }
.waitingtrucksView_title{ .waitingtrucksView_title{
font-size: 26px; font-size: 26px;
font-weight: 600; font-weight: 600;
text-align: center; text-align: center;
...@@ -777,19 +778,19 @@ export default { ...@@ -777,19 +778,19 @@ export default {
background-image:-webkit-linear-gradient(bottom, #59C8FF, #FAFEFF); background-image:-webkit-linear-gradient(bottom, #59C8FF, #FAFEFF);
-webkit-background-clip:text; -webkit-background-clip:text;
-webkit-text-fill-color:transparent; -webkit-text-fill-color:transparent;
} }
.waitingtrucksView_content{ .waitingtrucksView_content{
margin-top: 10px; margin-top: 10px;
height: 70vh; height: 70vh;
width: 100%; width: 100%;
overflow-y:auto; overflow-y:auto;
} }
.waitingtrucksView_content::-webkit-scrollbar { .waitingtrucksView_content::-webkit-scrollbar {
/*滚动条整体样式*/ /*滚动条整体样式*/
width : 8px; /*高宽分别对应横竖滚动条的尺寸*/ width : 8px; /*高宽分别对应横竖滚动条的尺寸*/
height: 1px; height: 1px;
} }
.waitingtrucksView_content::-webkit-scrollbar-thumb { .waitingtrucksView_content::-webkit-scrollbar-thumb {
/*滚动条里面小方块*/ /*滚动条里面小方块*/
border-radius : 10px; border-radius : 10px;
background-color: #274088; background-color: #274088;
...@@ -803,19 +804,310 @@ export default { ...@@ -803,19 +804,310 @@ export default {
transparent 75%, transparent 75%,
transparent transparent
); );
} }
.waitingtrucksView_content::-webkit-scrollbar-track { .waitingtrucksView_content::-webkit-scrollbar-track {
/*滚动条里面轨道*/ /*滚动条里面轨道*/
box-shadow : inset 0 0 5px rgba(0, 0, 0, 0.2); box-shadow : inset 0 0 5px rgba(0, 0, 0, 0.2);
background : #ededed; background : #ededed;
border-radius: 10px; border-radius: 10px;
}
.waitingtrucksView_content>div{
color: rgb(254,210,5);
font-size: 19px;
margin-bottom: 15px;
display: flex;
align-items: center;
justify-content: space-between;
}
} }
.waitingtrucksView_content>div{
@media screen and (min-width:901px){
.mapcontainer {
height: 100vh;
width: 100vw;
top: 0px;
position: absolute;
overflow: hidden;
}
.mianViews{
width: 100vw;
height: 100vh;
overflow: hidden;
}
.topViews{
position: absolute;
top: 0px;
z-index: 1;
width: 100vw;
height: 6vh;
background-color: rgb(29,49,81);
display: flex;
justify-content: space-between;
align-items: center;
padding: 0px 20px;
box-sizing: border-box;
}
.topTitle{
background-image:-webkit-linear-gradient(bottom, #59C8FF, #FAFEFF);
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
font-size: 27px;
letter-spacing: 4px;
font-weight: bold;
}
.topcontent{
display: flex;
align-items: center;
font-size: 24px;
font-weight: 600;
background-image:-webkit-linear-gradient(bottom, #59C8FF, #FAFEFF);
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
}
.centerViews{
position: absolute;
top: 0px;
left: 0px;
z-index: 1;
font-size: 19px;
font-weight: 600;
text-align: center;
letter-spacing: 2px;
}
.centerViewsTitle1{
margin-top: 10.5vh;
background-image:-webkit-linear-gradient(bottom, #59C8FF, #FAFEFF);
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
}
.centerViewsTitle2{
margin-top: 10.5vh;
color:gainsboro;
}
.IntelligentDis1{
height: 15vh;
width: 16vh;
background:no-repeat center center url('~@/assets/images/truckTuPian/zhinengpaidan1.png');
background-size:100% 100%;
position: absolute;
top: 6.5vh;
left: 0.8vw;
cursor: pointer;
}
.IntelligentDis2{
height: 15vh;
width: 16vh;
background:no-repeat center center url('~@/assets/images/truckTuPian/zhinengpaidan2.png');
background-size:100% 100%;
position: absolute;
top: 6.5vh;
left: 0.8vw;
cursor: pointer;
}
.voiceAp1{
height: 15vh;
width: 16vh;
background:no-repeat center center url('~@/assets/images/truckTuPian/yuyinshenping1.png');
background-size:100% 100%;
position: absolute;
top: 22vh;
left: 0.8vw;
cursor: pointer;
}
.voiceAp2{
height: 15vh;
width: 16vh;
background:no-repeat center center url('~@/assets/images/truckTuPian/yuyinshenping2.png');
background-size:100% 100%;
position: absolute;
top: 22vh;
left: 0.8vw;
cursor: pointer;
}
.failureDe1{
height: 15vh;
width: 16vh;
background:no-repeat center center url('~@/assets/images/truckTuPian/guzhangshenbao1.png');
background-size:100% 100%;
position: absolute;
top: 37.5vh;
left: 0.8vw;
cursor: pointer;
}
.failureDe2{
height: 15vh;
width: 16vh;
background:no-repeat center center url('~@/assets/images/truckTuPian/guzhangshenbao2.png');
background-size:100% 100%;
position: absolute;
top: 37.5vh;
left: 0.8vw;
cursor: pointer;
}
.performanceSt1{
height: 15vh;
width: 16vh;
background:no-repeat center center url('~@/assets/images/truckTuPian/jixiao1.png');
background-size:100% 100%;
position: absolute;
top: 53vh;
left: 0.8vw;
cursor: pointer;
}
.performanceSt2{
height: 15vh;
width: 16vh;
background:no-repeat center center url('~@/assets/images/truckTuPian/jixiao2.png');
background-size:100% 100%;
position: absolute;
top: 53vh;
left: 0.8vw;
cursor: pointer;
}
.carIn1{
height: 15vh;
width: 16vh;
background:no-repeat center center url('~@/assets/images/truckTuPian/cheliangxinxi1.png');
background-size:100% 100%;
position: absolute;
top: 68.5vh;
left: 0.8vw;
cursor: pointer;
}
.carIn2{
height: 15vh;
width: 16vh;
background:no-repeat center center url('~@/assets/images/truckTuPian/cheliangxinxi2.png');
background-size:100% 100%;
position: absolute;
top: 68.5vh;
left: 0.8vw;
cursor: pointer;
}
.personalCe1{
height: 15vh;
width: 16vh;
background:no-repeat center center url('~@/assets/images/truckTuPian/gerenzhongxin1.png');
background-size:100% 100%;
position: absolute;
top: 84vh;
left: 0.8vw;
cursor: pointer;
}
.personalCe2{
height: 15vh;
width: 16vh;
background:no-repeat center center url('~@/assets/images/truckTuPian/gerenzhongxin2.png');
background-size:100% 100%;
position: absolute;
top: 84vh;
left: 0.8vw;
cursor: pointer;
}
.roadblockStyle{
position: absolute;
z-index: 1;
right: 170px;
bottom: 2vh;
height: 5vh;
line-height: 5vh;
width: 130px;
font-size: 18px;
text-align: center;
color: rgb(254,210,5);
background-color: rgb(26,39,83);
border-radius: 5px;
border: 1px solid lightskyblue;
opacity: 0.9;
cursor: pointer;
}
.dispatchCenterStyle{
z-index: 1;
position: absolute;
right: 20px;
bottom: 2vh;
height: 5vh;
line-height: 5vh;
width: 130px;
font-size: 18px;
text-align: center;
color: rgb(14,229,226);
background-color: rgb(26,39,83);
border-radius: 5px;
border: 1px solid lightskyblue;
opacity: 0.9;
cursor: pointer;
}
.smallWindowStyle{
color: red;
font-size: 50px;
position: absolute;
z-index: 2;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
}
.waitingtrucksView{
position: absolute;
right: 0px;
top: 8vh;
width: 25vw;
height: 80vh;
background:no-repeat center center url('~@/assets/images/truckTuPian/juxingkaobei6_1.png');
background-size:100% 100%;
z-index: 1;
padding: 10px 10px 0px;
box-sizing: border-box;
}
.waitingtrucksView_title{
font-size: 26px;
font-weight: 600;
text-align: center;
width: 100%;
background-image:-webkit-linear-gradient(bottom, #59C8FF, #FAFEFF);
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
}
.waitingtrucksView_content{
margin-top: 10px;
height: 70vh;
width: 100%;
overflow-y:auto;
}
.waitingtrucksView_content::-webkit-scrollbar {
/*滚动条整体样式*/
width : 8px; /*高宽分别对应横竖滚动条的尺寸*/
height: 1px;
}
.waitingtrucksView_content::-webkit-scrollbar-thumb {
/*滚动条里面小方块*/
border-radius : 10px;
background-color: #274088;
background-image: -webkit-linear-gradient(
45deg,
rgba(255, 255, 255, 0.2) 25%,
transparent 25%,
transparent 50%,
rgba(255, 255, 255, 0.2) 50%,
rgba(255, 255, 255, 0.2) 75%,
transparent 75%,
transparent
);
}
.waitingtrucksView_content::-webkit-scrollbar-track {
/*滚动条里面轨道*/
box-shadow : inset 0 0 5px rgba(0, 0, 0, 0.2);
background : #ededed;
border-radius: 10px;
}
.waitingtrucksView_content>div{
color: rgb(254,210,5); color: rgb(254,210,5);
font-size: 19px; font-size: 19px;
margin-bottom: 15px; margin-bottom: 15px;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
}
} }
</style> </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