Skip to content

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

1

parent 937e2cf5
Hide whitespace changes
Inline Side-by-side
Showing with 276 additions and 102 deletions
src/views/MLargeScreen/components/failureDeclaration/index.vue
View file @ 860386d7
...@@ -5,9 +5,9 @@ ...@@ -5,9 +5,9 @@
<div class="failureDeContent"> <div class="failureDeContent">
<div class="failureDeContentFromViews"> <div class="failureDeContentFromViews">
<div> <div>
<img src="../../../../assets/images/truckTuPian/fuxiaobiaotititle.png"> <img class="tu1" src="../../../../assets/images/truckTuPian/fuxiaobiaotititle.png">
<span class="failureDeContent_left_title">选择要申报的车辆：</span> <span class="failureDeContent_left_title">选择要申报的车辆：</span>
<div style="display: flex;justify-content: space-evenly;margin-top:10px;"> <div style="display: flex;justify-content: space-evenly;margin-top:1vh;">
<el-radio v-model="from.car" label="当前车辆故障" border>当前车辆故障</el-radio> <el-radio v-model="from.car" label="当前车辆故障" border>当前车辆故障</el-radio>
<el-radio v-model="from.car" label="其他车辆故障" border>其他车辆故障</el-radio> <el-radio v-model="from.car" label="其他车辆故障" border>其他车辆故障</el-radio>
</div> </div>
...@@ -26,11 +26,11 @@ ...@@ -26,11 +26,11 @@
</div> </div>
<div style="display:flex;"> <div style="display:flex;">
<span>车辆位置：</span> <span>车辆位置：</span>
<div style="cursor: pointer;" @click="getLocationFn()"> <div class="getweizhitu1" style="" @click="getLocationFn()">
<img src="../../../../assets/images/truckTuPian/dingwei1.png" height="20"> <img src="../../../../assets/images/truckTuPian/dingwei1.png">
<span style="color: rgb(24,228,240);font-size:18px;margin-top:-10px;text-decoration:underline;">{{getLocationText}}</span> <span>{{getLocationText}}</span>
</div> </div>
<span style="margin-left:10px;" v-if="zuobiaoShow">坐标:{{parseFloat(from.lat).toFixed(2)}},{{parseFloat(from.lon).toFixed(2)}}</span> <span style="margin-left:1vw;" v-if="zuobiaoShow">坐标:{{parseFloat(from.lat).toFixed(2)}},{{parseFloat(from.lon).toFixed(2)}}</span>
</div> </div>
<div> <div>
<span>故障类型：</span> <span>故障类型：</span>
...@@ -39,19 +39,19 @@ ...@@ -39,19 +39,19 @@
</el-select> </el-select>
</div> </div>
<div> <div>
<div style="color: rgb(24,228,240);font-size: 20px;margin-bottom:10px;">故障问题描述：</div> <div class="failure_textarea1">故障问题描述：</div>
<el-input <el-input
type="textarea" type="textarea"
:rows="4" :rows="4"
placeholder="请输入内容" placeholder="请输入内容"
v-model="from.problem" v-model="from.problem"
style="font-size: 18px;width:30vw;"> class="failure_textarea2">
</el-input> </el-input>
</div> </div>
</div> </div>
</div> </div>
<div class="submitDeStyle"> <div class="submitDeStyle">
<el-button :loading="submitLoading" type="primary" round style="width:10vw;height:5.5vh;font-size:18px;letter-spacing:2px;" @click="submitDeFn()">故障申报</el-button> <el-button :loading="submitLoading" type="primary" round @click="submitDeFn()">故障申报</el-button>
</div> </div>
</div> </div>
</template> </template>
...@@ -75,7 +75,6 @@ export default { ...@@ -75,7 +75,6 @@ export default {
zuobiaoShow:false, zuobiaoShow:false,
} }
}, },
mounted() { },
methods: { methods: {
loadData(carnumber,personName) { loadData(carnumber,personName) {
this.showDecide = true; this.showDecide = true;
...@@ -196,99 +195,274 @@ export default { ...@@ -196,99 +195,274 @@ export default {
</script> </script>
<style scope> <style scope>
.el-select-dropdown__item{
font-size: 20px;
height: 45px;
line-height: 45px;
}
.failureDeMainViews{
position: absolute;
z-index: 2;
top: 50%;
left: 50%;
height: 90vh;
width: 40vw;
background:no-repeat center center url('~@/assets/images/truckTuPian/guzhangshenbankuang1.png');
background-size:100% 100%;
transform: translate(-50%,-48%);
padding: 12px 30px 0px;
box-sizing: border-box;
}
.failureDeSmallTitle{
color: white;
font-size: 17px;
text-align: center;
line-height: 4.5vh;
width: 11vw;
height: 4.5vh;
background:no-repeat center center url('~@/assets/images/truckTuPian/xiaobiaotikuang.png');
background-size:100% 100%;
}
.failureDeClose{
position: absolute;
top: 4vh;
right: 1vw;
cursor: pointer;
}
.failureDeContent{
width: 100%;
display: flex;
justify-content: center;
}
.failureDeContent_left_title{ @media screen and (max-width:901px){
font-size: 20px; .failure_textarea1{
font-weight: 500; color: rgb(24,228,240);
color: rgb(24,228,240); font-size: 13px;
} margin-bottom:1vh;
/* 未选中样式 */ }
.is-bordered .el-radio__label{ .failure_textarea2{
font-size: 17px; font-size: 13px;
color: wheat; width:30vw;
} }
.is-bordered { .failure_textarea2 .el-textarea__inner{
border: wheat 2px solid; max-height: 20vh !important;
height: 38px; }
line-height: 20px; .getweizhitu1{
} cursor: pointer;
.is-bordered .el-radio__inner{ }
height: 18px; .getweizhitu1>img{
width: 18px; height: 2.5vh;
} }
/* 选中样式 */ .getweizhitu1>span{
.el-radio__input.is-checked+.el-radio__label{ color: rgb(24,228,240);
color: #1890ff; font-size:12px;
} text-decoration:underline;
.el-radio.is-bordered.is-checked{ }
border-color: #1890ff; .el-select-dropdown__item{
} font-size: 20px;
.el-radio__input.is-checked .el-radio__inner{ height: 45px;
border-color: #1890ff; line-height: 45px;
background: #1890ff; }
} .failureDeMainViews{
.el-radio{ position: absolute;
margin: 0; z-index: 2;
} top: 50%;
.el-radio.is-bordered{ left: 50%;
padding: 8px 20px 0px 10px; height: 90vh;
} width: 40vw;
.failureDeContentFromViews{ background:no-repeat center center url('~@/assets/images/truckTuPian/guzhangshenbankuang1.png');
margin-top: 10px; background-size:100% 100%;
} transform: translate(-50%,-48%);
.failureDeContentFromViews>div{ padding: 12px 30px 0px;
margin-bottom: 25px ; box-sizing: border-box;
} }
.failureDeContentFromViews>div>span{ .failureDeSmallTitle{
color: rgb(24,228,240); color: white;
font-size: 20px; font-size: 12px;
} text-align: center;
.el-input--small .el-input__inner{ line-height: 7vh;
font-size: 18px; width: 14vw;
height: 7vh;
background:no-repeat center center url('~@/assets/images/truckTuPian/xiaobiaotikuang.png');
background-size:100% 100%;
}
.failureDeClose{
position: absolute;
top: 4vh;
right: 1vw;
cursor: pointer;
}
.failureDeContent{
width: 100%;
display: flex;
justify-content: center;
}
.failureDeContent_left_title{
font-size: 13px !important;
font-weight: 500;
color: rgb(24,228,240);
}
.failureDeContentFromViews .tu1{
width: 3vw;
}
/* 未选中样式 */
.is-bordered .el-radio__label{
font-size: 13px !important;
color: wheat;
}
.is-bordered {
border: wheat 2px solid;
height: 38px;
line-height: 20px;
}
.is-bordered .el-radio__inner{
height: 18px;
width: 18px;
}
.failureDeContentFromViews .el-radio.is-bordered{
height: 7vh;
width: 49%;
padding: 0.5vh 1vw 0px;
}
/* 选中样式 */
.el-radio__input.is-checked+.el-radio__label{
color: #1890ff;
}
.el-radio.is-bordered.is-checked{
border-color: #1890ff;
}
.el-radio__input.is-checked .el-radio__inner{
border-color: #1890ff;
background: #1890ff;
}
.el-radio{
margin: 0;
}
.el-radio.is-bordered{
padding: 8px 20px 0px 10px;
}
.failureDeContentFromViews{
margin-top: 1vh;
}
.failureDeContentFromViews>div{
margin-bottom: 1vh;
}
.failureDeContentFromViews>div>span{
color: rgb(24,228,240);
font-size: 13px;
}
.el-input--small .el-input__inner{
font-size: 18px;
}
.submitDeStyle{
position: absolute;
bottom: 2vh;
left: 50%;
transform: translateX(-50%);
}
.submitDeStyle button{
width:11vw;
height:7vh;
font-size:13px;
letter-spacing:1px;
text-align: center;
line-height: 0;
}
.failureDeContentFromViews .el-input--suffix .el-input__inner{
height: 6.5vh;
font-size: 13px;
}
.failureDeContentFromViews .el-select__caret.el-input__icon.el-icon-arrow-up{
line-height: 0px !important;
}
} }
.submitDeStyle{
position: absolute; @media screen and (min-width:901px){
bottom: 20px; .failure_textarea1{
left: 50%; color: rgb(24,228,240);
transform: translateX(-50%); font-size: 20px;
margin-bottom:10px;
}
.failure_textarea2{
font-size: 18px;
width:30vw;
}
.getweizhitu1{
cursor: pointer;
}
.getweizhitu1>img{
height: 20px;
}
.getweizhitu1>span{
color: rgb(24,228,240);
font-size:18px;
margin-top:-10px;
text-decoration:underline;
}
.el-select-dropdown__item{
font-size: 20px;
height: 45px;
line-height: 45px;
}
.failureDeMainViews{
position: absolute;
z-index: 2;
top: 50%;
left: 50%;
height: 90vh;
width: 40vw;
background:no-repeat center center url('~@/assets/images/truckTuPian/guzhangshenbankuang1.png');
background-size:100% 100%;
transform: translate(-50%,-48%);
padding: 12px 30px 0px;
box-sizing: border-box;
}
.failureDeSmallTitle{
color: white;
font-size: 17px;
text-align: center;
line-height: 4.5vh;
width: 11vw;
height: 4.5vh;
background:no-repeat center center url('~@/assets/images/truckTuPian/xiaobiaotikuang.png');
background-size:100% 100%;
}
.failureDeClose{
position: absolute;
top: 4vh;
right: 1vw;
cursor: pointer;
}
.failureDeContent{
width: 100%;
display: flex;
justify-content: center;
}
.failureDeContent_left_title{
font-size: 20px;
font-weight: 500;
color: rgb(24,228,240);
}
/* 未选中样式 */
.is-bordered .el-radio__label{
font-size: 17px;
color: wheat;
}
.is-bordered {
border: wheat 2px solid;
height: 38px;
line-height: 20px;
}
.is-bordered .el-radio__inner{
height: 18px;
width: 18px;
}
/* 选中样式 */
.el-radio__input.is-checked+.el-radio__label{
color: #1890ff;
}
.el-radio.is-bordered.is-checked{
border-color: #1890ff;
}
.el-radio__input.is-checked .el-radio__inner{
border-color: #1890ff;
background: #1890ff;
}
.el-radio{
margin: 0;
}
.el-radio.is-bordered{
padding: 8px 20px 0px 10px;
}
.failureDeContentFromViews{
margin-top: 10px;
}
.failureDeContentFromViews>div{
margin-bottom: 25px ;
}
.failureDeContentFromViews>div>span{
color: rgb(24,228,240);
font-size: 20px;
}
.el-input--small .el-input__inner{
font-size: 18px;
}
.submitDeStyle{
position: absolute;
bottom: 20px;
left: 50%;
transform: translateX(-50%);
}
.submitDeStyle button{
width:10vw;
height:5.5vh;
font-size:18px;
letter-spacing:2px;
}
} }
</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