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 @@
<div class="failureDeContent">
<div class="failureDeContentFromViews">
<div>
<img src="../../../../assets/images/truckTuPian/fuxiaobiaotititle.png">
<img class="tu1" src="../../../../assets/images/truckTuPian/fuxiaobiaotititle.png">
<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>
</div>
......@@ -26,11 +26,11 @@
</div>
<div style="display:flex;">
<span>车辆位置：</span>
<div style="cursor: pointer;" @click="getLocationFn()">
<img src="../../../../assets/images/truckTuPian/dingwei1.png" height="20">
<span style="color: rgb(24,228,240);font-size:18px;margin-top:-10px;text-decoration:underline;">{{getLocationText}}</span>
<div class="getweizhitu1" style="" @click="getLocationFn()">
<img src="../../../../assets/images/truckTuPian/dingwei1.png">
<span>{{getLocationText}}</span>
</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>
<span>故障类型：</span>
......@@ -39,19 +39,19 @@
</el-select>
</div>
<div>
<div style="color: rgb(24,228,240);font-size: 20px;margin-bottom:10px;">故障问题描述：</div>
<div class="failure_textarea1">故障问题描述：</div>
<el-input
type="textarea"
:rows="4"
placeholder="请输入内容"
v-model="from.problem"
style="font-size: 18px;width:30vw;">
class="failure_textarea2">
</el-input>
</div>
</div>
</div>
<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>
</template>
......@@ -75,7 +75,6 @@ export default {
zuobiaoShow:false,
}
},
mounted() { },
methods: {
loadData(carnumber,personName) {
this.showDecide = true;
......@@ -196,99 +195,274 @@ export default {
</script>
<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{
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;
@media screen and (max-width:901px){
.failure_textarea1{
color: rgb(24,228,240);
font-size: 13px;
margin-bottom:1vh;
}
.failure_textarea2{
font-size: 13px;
width:30vw;
}
.failure_textarea2 .el-textarea__inner{
max-height: 20vh !important;
}
.getweizhitu1{
cursor: pointer;
}
.getweizhitu1>img{
height: 2.5vh;
}
.getweizhitu1>span{
color: rgb(24,228,240);
font-size:12px;
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: 12px;
text-align: center;
line-height: 7vh;
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;
bottom: 20px;
left: 50%;
transform: translateX(-50%);
@media screen and (min-width:901px){
.failure_textarea1{
color: rgb(24,228,240);
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>
\ 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