<template>
|
<!-- top="10vh" -->
|
<el-dialog
|
:close-on-click-modal="false"
|
:visible.sync="islook"
|
width="300px"
|
top="28vh"
|
class="add-event-dialog"
|
:show-close="false"
|
>
|
<div class="tank-box">
|
<div slot="title" class="tac drawerHeader">提示</div>
|
<div class="dialog-content-box">
|
<div
|
style="
|
margin: 0 auto;
|
width: 100%;
|
height: 100%;
|
overflow: hidden;
|
margin-bottom: 30px;
|
text-align: left;
|
"
|
>
|
<div class="title-box margin_bottom_13 color_4efefa font_size_17">
|
|
{{ messageError }}下发失败！
|
|
</div>
|
</div>
|
</div>
|
<div slot="footer" class="dialog-footer tac" style="overflow: hidden">
|
|
<div class="btn" @click="shutdown">
|
<img src="../../public/confirm3.png" />
|
</div>
|
</div>
|
</div>
|
</el-dialog>
|
</template>
|
|
<script>
|
|
|
export default {
|
components: {},
|
props: {
|
messageError: {
|
type: [String],
|
default: '下发失败！',
|
},
|
},
|
data() {
|
return {
|
islook: true,
|
|
};
|
},
|
mounted() {
|
|
},
|
watch: {
|
|
},
|
methods: {
|
shutdown() {
|
this.islook = false;
|
this.$emit('shutdown')
|
},
|
},
|
};
|
</script>
|
|
<style lang="scss" scoped>
|
.tank-box {
|
width: 300px;
|
height: 322px;
|
padding: 0 20px;
|
background: url("../../public/tank.png") no-repeat center center / cover;
|
position: relative;
|
.dialog-footer {
|
position: absolute;
|
bottom: 20px;
|
}
|
}
|
.color_4efefa {
|
color: #4efefa !important;
|
}
|
.font_size_16 {
|
font-size: 16px !important;
|
}
|
.margin_bottom_13 {
|
margin-bottom: 13px;
|
}
|
.title-box {
|
width: 100%;
|
height: auto;
|
overflow: hidden;
|
line-height:30px;
|
text-align:center;
|
}
|
::v-deep .el-dialog {
|
background: transparent;
|
}
|
::v-deep .el-dialog__header {
|
padding: 0 !important;
|
}
|
::v-deep .el-dialog__body {
|
padding: 0 !important;
|
}
|
.btn {
|
width: 160px;
|
height: auto;
|
float: left;
|
display: inline-block;
|
img {
|
width: 100%;
|
}
|
&:nth-of-type(1) {
|
margin-right: 30px;
|
margin-left: 80px;
|
}
|
}
|
::v-deep .el-tabs__content {
|
height: calc(100% - 55px);
|
overflow-y: auto;
|
}
|
.circel {
|
width: 100px;
|
height: 100px;
|
border-radius: 50%;
|
border: 2px solid rgba(12, 79, 218, 1);
|
position: relative;
|
float: left;
|
.circel-two {
|
width: 75px;
|
height: 75px;
|
position: absolute;
|
top: 11px;
|
left: 11px;
|
border-radius: 50%;
|
border: 2px solid rgba(12, 79, 218, 1);
|
}
|
}
|
.circel-text {
|
color: #fff;
|
margin-left: 20px;
|
.circel-text-t {
|
font-size: 18px;
|
line-height: 40px;
|
}
|
.circel-text-b {
|
font-weight: 700;
|
font-size: 14px;
|
|
span {
|
color: rgba(12, 79, 218, 1);
|
font-size: 38px;
|
margin-right: 10px;
|
}
|
}
|
}
|
.color_red {
|
width: 100%;
|
margin: 0 auto;
|
text-align: center;
|
font-size: 14px;
|
margin-bottom: 25px;
|
}
|
.form-item {
|
width: calc(50% - 20px);
|
float: left;
|
&:nth-child(odd) {
|
margin-right: 20px;
|
}
|
}
|
.form-item-two {
|
width: calc(50% - 20px);
|
float: left;
|
&:nth-of-type(odd) {
|
margin-right: 20px;
|
}
|
}
|
.form-item-three {
|
width: calc(100% - 20px);
|
float: left;
|
}
|
.form-item-check {
|
width: calc(33% - 40px);
|
float: left;
|
&:nth-of-type(odd) {
|
margin-right: 20px;
|
}
|
}
|
.title {
|
width: 100%;
|
}
|
.dialog-content-box {
|
height: calc(100% - 200px);
|
// overflow: hidden;
|
padding: 50px 20px 20px;
|
.el-form {
|
overflow: hidden;
|
}
|
.title-auto-box {
|
height: calc(100% - 150px);
|
overflow: auto;
|
}
|
|
}
|
.num-identify {
|
padding: 5px 8px;
|
background-color: rgba(255, 153, 0, 1);
|
border-radius: 6px;
|
font-size: 14px;
|
color: #fff;
|
font-weight: 600;
|
}
|
.drawerHeader {
|
font-weight: 700;
|
font-size: 14px;
|
text-align: center;
|
color: #fff;
|
height: 22px;
|
line-height: 22px;
|
.identify {
|
width: 80px;
|
height: 25px;
|
line-height: 25px;
|
text-align: center;
|
border: 1px solid rgba(255, 153, 0, 1);
|
border-radius: 6px;
|
font-size: 16px;
|
color: rgba(255, 153, 0, 1);
|
transform: rotate(15deg);
|
font-weight: 600;
|
margin-right: 100px;
|
margin-top: 12px;
|
float: right;
|
}
|
}
|
</style>
|
