<template>
|
<div class="bot"
|
v-if="showsituation">
|
<div class="top1">
|
<span class="botcon">
|
<span class="icon"></span>
|
<span class="text">军标标绘</span>
|
</span>
|
<span class="close"
|
@click="close">x</span>
|
</div>
|
<div class="next">
|
</div>
|
|
</div>
|
</template>
|
|
<script>
|
|
import bus from "../../utils/bus";
|
import axios from "axios";
|
|
export default {
|
components: {
|
changePic,
|
},
|
data () {
|
return {
|
|
showdata1: true,
|
showdata2: true,
|
|
showsituation: false,
|
};
|
},
|
mounted () {
|
bus.$on("clearEve",(e) => {
|
|
});
|
bus.$on("radioData",(e) => {
|
this.radios=e;
|
});
|
bus.$on("guanzhou",(e) => {
|
|
});
|
bus.$on("areaData",(e) => {
|
|
});
|
bus.$on("showdio",(e) => {
|
this.showsituation=e=="7-9-1"
|
this.showdata1=true;
|
this.showdata2=true;
|
});
|
},
|
methods: {
|
|
},
|
watch: {
|
colorContainer: {
|
deep: true,
|
handler (data) {
|
let colornow={
|
width: "30%",
|
height: "70%",
|
border: "1px solid #000",
|
transform: "translate(40px,90px)",
|
backgroundImage: `linear-gradient(${data.maxColor},${data.minColor})`,
|
};
|
this.innerbac=colornow;
|
},
|
},
|
},
|
};
|
</script>
|
|
<style scoped>
|
.bot {
|
width: 1000px;
|
height: 1150px;
|
background: url(~@/assets/image/test/22.png);
|
background-size: 100% 100%;
|
background-repeat: no-repeat;
|
position: absolute;
|
left: 3920px;
|
top: 680px;
|
}
|
.top1 {
|
width: 95%;
|
height: 11%;
|
font-size: 40px;
|
font-weight: bold;
|
margin: 0px auto;
|
border-bottom: 2px solid #fff;
|
color: #fff;
|
letter-spacing: 3px;
|
}
|
.icon {
|
position: absolute;
|
left: 50px;
|
width: 50px;
|
height: 50px;
|
top: 39px;
|
background-size: 100% 100% !important;
|
background-repeat: no-repeat !important;
|
background-position: center !important;
|
background: url(~@/assets/image/subject/题标.png);
|
}
|
.text {
|
display: inline-block;
|
margin-left: 90px;
|
}
|
.close {
|
position: absolute;
|
font-size: 60px;
|
font-weight: 400;
|
right: 60px;
|
top: 20px;
|
}
|
.close:hover {
|
color: red;
|
transition: color 1s;
|
cursor: pointer;
|
}
|
.next {
|
width: 89%;
|
height: 79%;
|
margin: 100px auto;
|
}
|
.next >>> .el-select {
|
width: 95% !important;
|
}
|
.next >>> .el-form-item {
|
margin-top: 60px;
|
}
|
.next >>> .el-input {
|
width: 84%;
|
}
|
.next >>> .el-date-editor {
|
width: 515px;
|
}
|
.next >>> .el-form-item__label {
|
color: #fff;
|
font-size: 40px;
|
}
|
.next >>> .el-input__inner {
|
font-size: 30px;
|
}
|
.next >>> .el-form-item__error {
|
font-size: 30px;
|
font-weight: 700;
|
}
|
.botcon {
|
display: inline-block;
|
margin-top: 34px;
|
}
|
.btns {
|
margin-top: 100px;
|
width: 100%;
|
height: 70px;
|
display: flex;
|
justify-content: center;
|
}
|
.btns > span {
|
display: block;
|
width: 200px;
|
height: 70px;
|
border: 1px solid #000;
|
text-align: center;
|
font-size: 35px;
|
margin: 0 50px;
|
line-height: 70px;
|
cursor: pointer;
|
}
|
.btns > span:nth-child(3) {
|
color: #fff;
|
background-image: linear-gradient(#76c2f6, #6a9cf1);
|
}
|
.btns > span:nth-child(-n + 2) {
|
color: #000;
|
background: #cadaea;
|
}
|
.showpic {
|
width: 260px;
|
height: 400px;
|
background: url(~@/assets/image/botbtn/bac.png);
|
background-position: center;
|
background-size: 100% 100%;
|
position: absolute;
|
top: 1200px;
|
right: 0px;
|
}
|
</style>
|
