From 9d8839b4018007ee2bb5726590f79e3aea05a14f Mon Sep 17 00:00:00 2001
From: zhaofang <752743406@qq.com>
Date: Mon, 19 Sep 2022 19:23:43 +0800
Subject: [PATCH] =?UTF-8?q?=E6=88=91=E7=9A=84=E5=8B=8B=E7=AB=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/medal/Index.vue | 47 ++++++++++++++++++++++++++-------------
 1 file changed, 32 insertions(+), 15 deletions(-)

diff --git a/src/views/medal/Index.vue b/src/views/medal/Index.vue
index 8ad9dcff..9f95e5cc 100644
--- a/src/views/medal/Index.vue
+++ b/src/views/medal/Index.vue
@@ -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,