我的勋章

This commit is contained in:
zhaofang
2022-09-19 19:23:43 +08:00
parent 6581f07e2d
commit 9d8839b401

View File

@@ -2,20 +2,19 @@
<div class="medal-box">
<h6 class="medal-title">我的勋章 <span class="text">勋章规则 ></span> </h6>
<el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="全部勋章" name="first">
<div class="medal-list" >
<div class="medal-index" v-for="item in medalList" :key="item.id">
<medal-img :item="item"></medal-img>
<p class="index-title">{{item.medalName}}</p>
<p class="index-text">您已超过367人</p>
<el-button class="btn" type="primary" @click="goView(item)">查看详情</el-button>
</div>
</div>
</el-tab-pane>
<el-tab-pane label="学习勋章" name="second">学习勋章</el-tab-pane>
<el-tab-pane label="社交勋章" name="third">社交勋章</el-tab-pane>
<el-tab-pane label="成就勋章" name="fourth">成就勋章</el-tab-pane>
<el-tab-pane label="全部勋章" name="first"></el-tab-pane>
<el-tab-pane label="学习勋章" name="second"></el-tab-pane>
<el-tab-pane label="社交勋章" name="third"></el-tab-pane>
<el-tab-pane label="成就勋章" name="fourth"></el-tab-pane>
</el-tabs>
<div class="medal-list" >
<div class="medal-index" v-for="item in medalData" :key="item.id">
<medal-img :item="item"></medal-img>
<p class="index-title">{{item.medalName}}</p>
<p class="index-text">您已超过367人</p>
<el-button class="btn" type="primary" @click="goView(item)">查看详情</el-button>
</div>
</div>
<el-dialog class="medal-dialog" title="提示" :visible.sync="dialogVisible" width="657px" top="200px">
<div class="medal-box">
<div class="medal-top">
@@ -69,7 +68,26 @@
import { mapGetters } from 'vuex';
export default{
computed: {
...mapGetters(['userInfo'])
...mapGetters(['userInfo']),
medalData(){
let data = [];
if(this.activeName == 'first') {
data = this.medalList
} else if(this.activeName == 'second') {
data = this.medalList.filter(item=>{
return item.medalId == 1 || item.medalId == 2;
})
} else if(this.activeName == 'third') {
data = this.medalList.filter(item=>{
return item.medalId == 4;
})
} else if(this.activeName == 'fourth') {
data = this.medalList.filter(item=>{
return item.medalId == 3;
})
}
return data;
}
},
components: {
MedalImg
@@ -97,7 +115,6 @@
}
})
for (let index = 0; index < item.medalLevel; index++) {
this.tableData.push({
medalIcon:item.medalIcon,
medalLevel:index,