task#13769, 新人培训弹框优化

This commit is contained in:
2024-05-15 17:13:56 +08:00
parent 5cf2559335
commit 2c59b0f5a0

View File

@ -30,15 +30,16 @@
</div> </div>
<div class="poupWrap" v-if="showPoup"> <div class="poupWrap" v-if="showPoup">
<div class="container"> <div class="container">
<div class="con">
<div class="title">培训提醒</div> <div class="title">培训提醒</div>
<div class="content">欢迎使用中道供应商APP请您先完成培训阅读文章并问答相应问题完成后即可正常使用APP祝您使用愉快!</div> <div class="content">欢迎使用中道供应商APP请您先完成培训阅读文章并问答相应问题完成后即可正常使用APP祝您使用愉快!</div>
<div class="line"></div> <div class="line"></div>
<div class="btnWrap"> <div class="btnWrap">
<div class="closeBtn" @click="showPoup = false">关闭</div> <div class="nextBtn" @click="showPoup = false">确定</div>
<div class="line"></div>
<div class="nextBtn" @click="showPoup = false">答题</div>
</div> </div>
</div> </div>
</div>
</div> </div>
</div> </div>
</template> </template>
@ -147,21 +148,31 @@ export default {
overflow-y: hidden; overflow-y: hidden;
} }
.poupWrap{ .poupWrap{
width: 100%;
height: 100%;
background-color: rgba(0,0,0,.7);
position: absolute; position: absolute;
top: 0;
left: 0;
.container{
width: 320px; width: 320px;
height: 310px; height: 310px;
background-image: url("@/assets/trainBg.png"); background-image: url("@/assets/trainBg.png");
background-size: 320px 310px; background-size: 320px 310px;
background-repeat: no-repeat; background-repeat: no-repeat;
position: absolute;
top: 0; top: 0;
bottom: 0; bottom: 0;
left: 0; left: 0;
right: 0; right: 0;
margin: auto; margin: auto;
.container{ .con{
position: absolute; position: absolute;
top: 100px; top: 100px;
left: 20px; left: 20px;
}
}
.title{ .title{
font-weight: bold; font-weight: bold;
font-size: 19px; font-size: 19px;
@ -208,6 +219,5 @@ export default {
color: #3364B7; color: #3364B7;
} }
} }
}
} }
</style> </style>