提交纪念勋章显示

src/views/Index.vue

@@ -430,10 +430,18 @@
     <interest-Collection ref="userCollection"></interest-Collection> <!-- 兴趣偏好 -->
     <guide-box ref="guide" @close="closeGuide"></guide-box> <!-- 引导页 -->
     <!--登录勋章-->
-    <el-dialog width="320px"  class="medalbox"  :show-close="true"  :visible.sync="showLoginMedal"  :append-to-body="true" >
+    <el-dialog width="540px"  class="medalbox"  :visible.sync="showLoginMedal"  :append-to-body="true" >
-        <div class="medal-img">
+        <div class="jinian-medal-img" :style="`background: url(${webBaseUrl}/images/jinian_medal.png) no-repeat;`">
            <!--登录勋章显示，根据UI显示修改-->
-           <img :src="`${webBaseUrl}/images/login_medal.png`" alt="">
+           <span style="position: absolute; right:60px;top:60px;cursor: pointer;">
+             <img @click="closeJinian" :src="`${webBaseUrl}/images/close.png`" width="26px" height="26px" alt="">
+           </span>
+           <div style="text-align: center;"><img :src="`${webBaseUrl}/images/login_medal.png`" width="206px" height="269px" alt=""></div>
+           <div style="text-align: left;padding:20px 60px 100px 60px">
+             <div class="jntext1">感谢有你 一路相办</div>
+             <div class="jntext2">勋章领取条件:</div>
+             <div class="jntext3">2022年10月31日-11月15日登录过平台学习的校友</div>
+           </div>
         </div>
     </el-dialog>
   </div>
@@ -501,10 +509,14 @@
     },
     data() {
       return {
-        showLoginMedal:true,//是否显示登录勋章
+        showLoginMedal:false,//是否显示登录勋章
+        medalTips:[
+            {medalId:1,medalLevel:5},
+            {medalId:3,medalLevel:4}
+        ],
         lastStudy:{},
         overlayShow:false,
-        userData: {  uvalue:0, totalStudyHour:0  },
+        userData: {  uvalue:0, totalStudyHour:0},
         userHobby:{
           needShow:false,
           localKeyPre:'user-hobby-' //本地存储的key
@@ -518,7 +530,7 @@
         Popularity: [],
         scorelist: [],
         resonimg: [],
-         swiperOptiontwo: {
+          swiperOptiontwo: {
           autoplay: false,
           // noSwiping: true,
         },
@@ -628,10 +640,13 @@
       }
     },
     methods: {
+      closeJinian(){
+        this.showLoginMedal=false;
+      },
       banJump(item) {
         window.open(item.JumpUrl);
       },
-      // 上次学习记录
+      //上次学习记录
       getLastStudy() {
 				apiCourseStudy.lastStudy().then(res => {
 					if (res.status === 200) {
@@ -1061,8 +1076,35 @@
 </script>
 
 <style scoped lang="scss">
-.medal-img{
+.jinian-medal-img{
   text-align: center;
+  padding-top: 10px;
+  .jntext1{
+    height: 56px;
+    font-size: 40px;
+    font-family: PingFangSC-Semibold, PingFang SC;
+    font-weight: 600;
+    color: #924504;
+    line-height: 56px;
+  }
+  .jntext2{
+    margin-top: 30px;
+    height: 30px;
+    font-size: 22px;
+    font-family: PingFangSC-Semibold, PingFang SC;
+    font-weight: 600;
+    color: #924504;
+    line-height: 30px;
+  }
+  .jntext3{
+    margin-top: 10px;
+    height: 50px;
+    font-size: 18px;
+    font-family: PingFangSC-Regular, PingFang SC;
+    font-weight: 400;
+    color: #924504;
+    line-height: 25px;
+  }
 }
 .medalbox {
   background: transparent !important;
@@ -1070,7 +1112,7 @@
    background: transparent !important;
    box-shadow:none !important;
    .el-dialog__header{
-     //display: none !important;
+     display: none !important;
    }
    .el-dialog__body{
     //  width: 320px !important;