mirror of
https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/learning-system-portal.git
synced 2025-12-11 03:46:44 +08:00
纪念勋章
This commit is contained in:
@@ -15,8 +15,13 @@
|
||||
<p class="index-text">您已超过{{item.exceed}}人</p>
|
||||
<el-button class="btn" type="primary" @click="goView(item)">查看详情</el-button>
|
||||
</div>
|
||||
<div class="medal-index" v-else>
|
||||
<img style="width:143px;height:161px" :src="`${webBaseUrl}/images/login_medal.png`" alt="">
|
||||
<p class="index-title">{{item.medalName}}</p>
|
||||
<!-- <p class="index-text">您已超过{{item.exceed}}人</p> -->
|
||||
<el-button class="btn" style="margin-top:30px" type="primary" @click="showLoginMedal = true">查看详情</el-button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div v-else class="home-no-list">
|
||||
<img class="img" style="width:360px;height:226px" :src="`${webBaseUrl}/images/homeWu/no-madel.png`" alt="" srcset="">
|
||||
@@ -57,6 +62,20 @@
|
||||
</el-table>
|
||||
</div>
|
||||
</el-dialog>
|
||||
<el-dialog width="540px" class="medalbox" :visible.sync="showLoginMedal" :append-to-body="true" >
|
||||
<div class="jinian-medal-img" :style="`background: url(${webBaseUrl}/images/jinian_medal.png) no-repeat;`">
|
||||
<!--登录勋章显示,根据UI显示修改-->
|
||||
<span style="position: absolute; right:60px;top:60px;cursor: pointer;">
|
||||
<img @click="showLoginMedal = false" :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>
|
||||
</template>
|
||||
|
||||
@@ -99,6 +118,7 @@
|
||||
return item.medalId == 3;
|
||||
})
|
||||
}
|
||||
console.log(data,'data');
|
||||
return data;
|
||||
}
|
||||
},
|
||||
@@ -107,6 +127,7 @@
|
||||
},
|
||||
data(){
|
||||
return{
|
||||
showLoginMedal:false,
|
||||
baseUrl:process.env.VUE_APP_FILE_BASE_URL,
|
||||
activeName:'first',
|
||||
dialogVisible:false,
|
||||
@@ -122,7 +143,7 @@
|
||||
this.getConfig();
|
||||
},
|
||||
methods:{
|
||||
|
||||
|
||||
getConfig() {// 获取勋章配置
|
||||
apiStat.userMedalConfig().then(res=>{
|
||||
if(res.status == 200) {
|
||||
@@ -168,6 +189,51 @@
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.medalbox {
|
||||
background: transparent !important;
|
||||
::v-deep .el-dialog{
|
||||
background: transparent !important;
|
||||
box-shadow:none !important;
|
||||
.el-dialog__header{
|
||||
display: none !important;
|
||||
}
|
||||
.el-dialog__body{
|
||||
// width: 320px !important;
|
||||
// height: 420px !important;
|
||||
background: transparent !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
.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;
|
||||
}
|
||||
}
|
||||
::v-deep .el-dialog__body{
|
||||
border-radius: 27px !important;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user