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

src/views/newcomerTraining/newTrainingList.vue

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