Skip to content

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

1

parent 1636ef18
Hide 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,6 +166,229 @@ export default { ...@@ -166,6 +166,229 @@ export default {
</script> </script>
<style> <style>
@media screen and (max-width:901px) {
.backGround {
padding-top: 2vh;
box-sizing: border-box;
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;
right: 6vw;
}
.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;
}
}
@media screen and (min-width:901px) {
.backGround {
padding-top: 50px;
box-sizing: border-box;
height: 100vh;
width: 100vw;
background-image: url("../assets/imgs/bg.png");
}
.projectName{
text-align: center;
font-size: 70px;
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: 75%;
height: 90%;
background-image: url("../assets/imgs/kuang.png");
background-size: 100% 100%;
}
.loginTitle{
margin-left: 50px;
text-align: center;
font-size: 25px;
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: 15vh;
position: absolute;
right: 13vh;
}
.userInpBody{
padding: 2px;
border: 1px solid rgb(18,70,113);
margin-bottom: 20px;
}
.el-form-item__content{
display: flex;
}
.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);
letter-spacing: 2px;
}
/* .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: 60px;
font-size: 26px;
background-color:rgb(24,180,255);
border: 0px;
color: white;
letter-spacing: 10px;
cursor: pointer;
}
}
* { * {
margin: 0; margin: 0;
padding: 0; padding: 0;
...@@ -176,114 +399,5 @@ export default { ...@@ -176,114 +399,5 @@ export default {
left: 0; left: 0;
z-index: 100; z-index: 100;
} }
.backGround {
padding-top: 50px;
box-sizing: border-box;
height: 100vh;
width: 100vw;
background-image: url("../assets/imgs/bg.png");
}
.projectName{
text-align: center;
font-size: 70px;
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: 60px;
box-sizing: border-box;
margin: 0 auto;
width: 75%;
height: 90%;
background-image: url("../assets/imgs/kuang.png");
background-size: 100% 100%;
}
.loginTitle{
margin-left: 50px;
text-align: center;
font-size: 25px;
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: 80px;
position: absolute;
right: 100px;
width: 340px;
height: 300px;
}
.userInpBody{
padding: 2px;
border: 1px solid rgb(18,70,113);
margin-bottom: 20px;
}
.el-form-item__content{
display: flex;
}
.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);
letter-spacing: 2px;
}
/* .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: 60px;
font-size: 26px;
background-color:rgb(24,180,255);
border: 0px;
color: white;
letter-spacing: 10px;
cursor: pointer;
}
</style> </style>
\ No newline at end of file
src/views/MLargeScreen/index.vue
View file @ fa964e51
...@@ -532,290 +532,582 @@ export default { ...@@ -532,290 +532,582 @@ export default {
</script> </script>
<style scope> <style scope>
.mapcontainer { @media screen and (max-width:901px){
height: 100vh; .mapcontainer {
width: 100vw; height: 100vh;
top: 0px; width: 100vw;
position: absolute; top: 0px;
overflow: hidden; 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);
font-size: 19px;
margin-bottom: 15px;
display: flex;
align-items: center;
justify-content: space-between;
}
} }
.mianViews{
width: 100vw; @media screen and (min-width:901px){
height: 100vh; .mapcontainer {
overflow: hidden; height: 100vh;
} width: 100vw;
.topViews{ top: 0px;
position: absolute; position: absolute;
top: 0px; overflow: hidden;
z-index: 1; }
width: 100vw; .mianViews{
height: 6vh; width: 100vw;
background-color: rgb(29,49,81); height: 100vh;
display: flex; overflow: hidden;
justify-content: space-between; }
align-items: center; .topViews{
padding: 0px 20px; position: absolute;
box-sizing: border-box; top: 0px;
} z-index: 1;
.topTitle{ width: 100vw;
background-image:-webkit-linear-gradient(bottom, #59C8FF, #FAFEFF); height: 6vh;
-webkit-background-clip:text; background-color: rgb(29,49,81);
-webkit-text-fill-color:transparent; display: flex;
font-size: 27px; justify-content: space-between;
letter-spacing: 4px; align-items: center;
font-weight: bold; padding: 0px 20px;
} box-sizing: border-box;
.topcontent{ }
display: flex; .topTitle{
align-items: center; background-image:-webkit-linear-gradient(bottom, #59C8FF, #FAFEFF);
font-size: 24px; -webkit-background-clip:text;
font-weight: 600; -webkit-text-fill-color:transparent;
background-image:-webkit-linear-gradient(bottom, #59C8FF, #FAFEFF); font-size: 27px;
-webkit-background-clip:text; letter-spacing: 4px;
-webkit-text-fill-color:transparent; font-weight: bold;
} }
.centerViews{ .topcontent{
position: absolute; display: flex;
top: 0px; align-items: center;
left: 0px; font-size: 24px;
z-index: 1; font-weight: 600;
font-size: 19px; background-image:-webkit-linear-gradient(bottom, #59C8FF, #FAFEFF);
font-weight: 600; -webkit-background-clip:text;
text-align: center; -webkit-text-fill-color:transparent;
letter-spacing: 2px; }
} .centerViews{
.centerViewsTitle1{ position: absolute;
margin-top: 10.5vh; top: 0px;
background-image:-webkit-linear-gradient(bottom, #59C8FF, #FAFEFF); left: 0px;
-webkit-background-clip:text; z-index: 1;
-webkit-text-fill-color:transparent; font-size: 19px;
} font-weight: 600;
.centerViewsTitle2{ text-align: center;
margin-top: 10.5vh; letter-spacing: 2px;
color:gainsboro; }
} .centerViewsTitle1{
.IntelligentDis1{ margin-top: 10.5vh;
height: 15vh; background-image:-webkit-linear-gradient(bottom, #59C8FF, #FAFEFF);
width: 16vh; -webkit-background-clip:text;
background:no-repeat center center url('~@/assets/images/truckTuPian/zhinengpaidan1.png'); -webkit-text-fill-color:transparent;
background-size:100% 100%; }
position: absolute; .centerViewsTitle2{
top: 6.5vh; margin-top: 10.5vh;
left: 0.8vw; color:gainsboro;
cursor: pointer; }
} .IntelligentDis1{
.IntelligentDis2{ 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/zhinengpaidan2.png'); background-size:100% 100%;
background-size:100% 100%; position: absolute;
position: absolute; top: 6.5vh;
top: 6.5vh; left: 0.8vw;
left: 0.8vw; cursor: pointer;
cursor: pointer; }
} .IntelligentDis2{
.voiceAp1{ 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/yuyinshenping1.png'); background-size:100% 100%;
background-size:100% 100%; position: absolute;
position: absolute; top: 6.5vh;
top: 22vh; left: 0.8vw;
left: 0.8vw; cursor: pointer;
cursor: pointer; }
} .voiceAp1{
.voiceAp2{ 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/yuyinshenping2.png'); background-size:100% 100%;
background-size:100% 100%; position: absolute;
position: absolute; top: 22vh;
top: 22vh; left: 0.8vw;
left: 0.8vw; cursor: pointer;
cursor: pointer; }
} .voiceAp2{
.failureDe1{ 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/guzhangshenbao1.png'); background-size:100% 100%;
background-size:100% 100%; position: absolute;
position: absolute; top: 22vh;
top: 37.5vh; left: 0.8vw;
left: 0.8vw; cursor: pointer;
cursor: pointer; }
} .failureDe1{
.failureDe2{ 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/guzhangshenbao2.png'); background-size:100% 100%;
background-size:100% 100%; position: absolute;
position: absolute; top: 37.5vh;
top: 37.5vh; left: 0.8vw;
left: 0.8vw; cursor: pointer;
cursor: pointer; }
} .failureDe2{
.performanceSt1{ 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/jixiao1.png'); background-size:100% 100%;
background-size:100% 100%; position: absolute;
position: absolute; top: 37.5vh;
top: 53vh; left: 0.8vw;
left: 0.8vw; cursor: pointer;
cursor: pointer; }
} .performanceSt1{
.performanceSt2{ 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/jixiao2.png'); background-size:100% 100%;
background-size:100% 100%; position: absolute;
position: absolute; top: 53vh;
top: 53vh; left: 0.8vw;
left: 0.8vw; cursor: pointer;
cursor: pointer; }
} .performanceSt2{
.carIn1{ 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/cheliangxinxi1.png'); background-size:100% 100%;
background-size:100% 100%; position: absolute;
position: absolute; top: 53vh;
top: 68.5vh; left: 0.8vw;
left: 0.8vw; cursor: pointer;
cursor: pointer; }
} .carIn1{
.carIn2{ 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/cheliangxinxi2.png'); background-size:100% 100%;
background-size:100% 100%; position: absolute;
position: absolute; top: 68.5vh;
top: 68.5vh; left: 0.8vw;
left: 0.8vw; cursor: pointer;
cursor: pointer; }
} .carIn2{
.personalCe1{ 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/gerenzhongxin1.png'); background-size:100% 100%;
background-size:100% 100%; position: absolute;
position: absolute; top: 68.5vh;
top: 84vh; left: 0.8vw;
left: 0.8vw; cursor: pointer;
cursor: pointer; }
} .personalCe1{
.personalCe2{ 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/gerenzhongxin2.png'); background-size:100% 100%;
background-size:100% 100%; position: absolute;
position: absolute; top: 84vh;
top: 84vh; left: 0.8vw;
left: 0.8vw; cursor: pointer;
cursor: pointer; }
} .personalCe2{
.roadblockStyle{ height: 15vh;
position: absolute; width: 16vh;
z-index: 1; background:no-repeat center center url('~@/assets/images/truckTuPian/gerenzhongxin2.png');
right: 170px; background-size:100% 100%;
bottom: 2vh; position: absolute;
height: 5vh; top: 84vh;
line-height: 5vh; left: 0.8vw;
width: 130px; cursor: pointer;
font-size: 18px; }
text-align: center; .roadblockStyle{
color: rgb(254,210,5); position: absolute;
background-color: rgb(26,39,83); z-index: 1;
border-radius: 5px; right: 170px;
border: 1px solid lightskyblue; bottom: 2vh;
opacity: 0.9; height: 5vh;
cursor: pointer; line-height: 5vh;
} width: 130px;
.dispatchCenterStyle{ font-size: 18px;
z-index: 1; text-align: center;
position: absolute; color: rgb(254,210,5);
right: 20px; background-color: rgb(26,39,83);
bottom: 2vh; border-radius: 5px;
height: 5vh; border: 1px solid lightskyblue;
line-height: 5vh; opacity: 0.9;
width: 130px; cursor: pointer;
font-size: 18px; }
text-align: center; .dispatchCenterStyle{
color: rgb(14,229,226); z-index: 1;
background-color: rgb(26,39,83); position: absolute;
border-radius: 5px; right: 20px;
border: 1px solid lightskyblue; bottom: 2vh;
opacity: 0.9; height: 5vh;
cursor: pointer; line-height: 5vh;
} width: 130px;
.smallWindowStyle{ font-size: 18px;
color: red; text-align: center;
font-size: 50px; color: rgb(14,229,226);
position: absolute; background-color: rgb(26,39,83);
z-index: 2; border-radius: 5px;
top: 50%; border: 1px solid lightskyblue;
left: 50%; opacity: 0.9;
transform: translate(-50%,-50%); cursor: pointer;
} }
.waitingtrucksView{ .smallWindowStyle{
position: absolute; color: red;
right: 0px; font-size: 50px;
top: 8vh; position: absolute;
width: 25vw; z-index: 2;
height: 80vh; top: 50%;
background:no-repeat center center url('~@/assets/images/truckTuPian/juxingkaobei6_1.png'); left: 50%;
background-size:100% 100%; transform: translate(-50%,-50%);
z-index: 1; }
padding: 10px 10px 0px; .waitingtrucksView{
box-sizing: border-box; position: absolute;
} right: 0px;
.waitingtrucksView_title{ top: 8vh;
font-size: 26px; width: 25vw;
font-weight: 600; height: 80vh;
text-align: center; background:no-repeat center center url('~@/assets/images/truckTuPian/juxingkaobei6_1.png');
width: 100%; background-size:100% 100%;
background-image:-webkit-linear-gradient(bottom, #59C8FF, #FAFEFF); z-index: 1;
-webkit-background-clip:text; padding: 10px 10px 0px;
-webkit-text-fill-color:transparent; box-sizing: border-box;
} }
.waitingtrucksView_content{ .waitingtrucksView_title{
margin-top: 10px; font-size: 26px;
height: 70vh; font-weight: 600;
width: 100%; text-align: center;
overflow-y:auto; width: 100%;
} background-image:-webkit-linear-gradient(bottom, #59C8FF, #FAFEFF);
.waitingtrucksView_content::-webkit-scrollbar { -webkit-background-clip:text;
/*滚动条整体样式*/ -webkit-text-fill-color:transparent;
width : 8px; /*高宽分别对应横竖滚动条的尺寸*/ }
height: 1px; .waitingtrucksView_content{
} margin-top: 10px;
.waitingtrucksView_content::-webkit-scrollbar-thumb { height: 70vh;
/*滚动条里面小方块*/ width: 100%;
border-radius : 10px; overflow-y:auto;
background-color: #274088; }
background-image: -webkit-linear-gradient( .waitingtrucksView_content::-webkit-scrollbar {
45deg, /*滚动条整体样式*/
rgba(255, 255, 255, 0.2) 25%, width : 8px; /*高宽分别对应横竖滚动条的尺寸*/
transparent 25%, height: 1px;
transparent 50%, }
rgba(255, 255, 255, 0.2) 50%, .waitingtrucksView_content::-webkit-scrollbar-thumb {
rgba(255, 255, 255, 0.2) 75%, /*滚动条里面小方块*/
transparent 75%, border-radius : 10px;
transparent background-color: #274088;
); background-image: -webkit-linear-gradient(
} 45deg,
.waitingtrucksView_content::-webkit-scrollbar-track { rgba(255, 255, 255, 0.2) 25%,
/*滚动条里面轨道*/ transparent 25%,
box-shadow : inset 0 0 5px rgba(0, 0, 0, 0.2); transparent 50%,
background : #ededed; rgba(255, 255, 255, 0.2) 50%,
border-radius: 10px; rgba(255, 255, 255, 0.2) 75%,
} transparent 75%,
.waitingtrucksView_content>div{ transparent
color: rgb(254,210,5); );
font-size: 19px; }
margin-bottom: 15px; .waitingtrucksView_content::-webkit-scrollbar-track {
display: flex; /*滚动条里面轨道*/
align-items: center; box-shadow : inset 0 0 5px rgba(0, 0, 0, 0.2);
justify-content: space-between; background : #ededed;
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;
}
} }
</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