勋章详细计算错误

src/views/medal/Index.vue

@@ -26,7 +26,7 @@
                 <div>
                     <h4 class="title-medal">{{medal.medalName}} <span style="font-weight: 600;">LV{{medal.medalLevel}}</span> </h4>
                     <p class="title-medal-info">你已经超过 {{medal.exceed}} 人</p>
-                    <p class="title-medal-info">继续学习 <span style="color:#333333;font-size:18px;font-weight: 600;">{{medal.nextValue - medal.curValue}}</span> 小时可升级进入下一级</p>
+                    <p class="title-medal-info" v-html="nextmsg"></p>
                 </div>
                 <div class="medal-img">
                     <medal-img style="width:186px;height:210px" :item="medal"></medal-img>
@@ -37,9 +37,7 @@
                     <el-step v-for="set in 8" :title="'L'+set"></el-step>
                 </el-steps>
             </div>
-            <el-table
-            :data="rules"
-            style="width: 100%;height:200px;overflow-y: auto;">
+            <el-table  :data="rules"   style="width: 100%;height:200px;overflow-y: auto;">
                 <el-table-column prop="name" angin="center" label="勋章" width="80">
                     <template slot-scope="scope">
                         <img style="width:40px;height:40px" :src="`${webBaseUrl}/images/medal.png`" alt="" srcset="">
@@ -66,8 +64,23 @@
     import { mapGetters } from 'vuex';
       export default{
           computed: {
-          ...mapGetters(['userInfo']),
-          medalData(){
+            ...mapGetters(['userInfo']),
+            nextmsg(){
+              let msg='';
+              if(this.medal.medalId){
+                if(this.medal.medalId==1){ //学习时长
+                    msg='继续学习 <span class="next-num">'+this.medal.dvalue+'</span> 小时可升级进入下一级';
+                }else if(this.medal.medalId==2){ //学习天数
+                    msg='继续学习 <span class="next-num">'+this.medal.dvalue+'</span> 天可升级进入下一级';
+                }else if(this.medal.medalId==3){ //上传的知识
+                    msg='继续发布 <span class="next-num">'+this.medal.dvalue+'</span> 个知识可升级进入下一级';
+                }else if(this.medal.medalId==4){ //被点赞数
+                    msg='再被点赞 <span class="next-num">'+this.medal.dvalue+'</span> 次可升级进入下一级';
+                }
+              }
+              return msg;
+            },
+            medalData(){
             let data = [];
             if(this.activeName == 'first') {
                 data = this.medalList
@@ -107,7 +120,7 @@
              this.getConfig();
           },
         methods:{
-            
+
             getConfig() {// 获取勋章配置
                 apiStat.userMedalConfig().then(res=>{
                     if(res.status == 200) {
@@ -153,6 +166,11 @@
   </script>
 
   <style lang="scss" scoped>
+    .next-num{
+      color:#333333;
+      font-size:18px;
+      font-weight: 600;
+    }
    ::v-deep .table-medal{
        .medal-text{
         display: none;
@@ -275,7 +293,7 @@
         }
         .medal-index{
             width: 144px;
-            
+
             text-align: center;