课程评论回复

src/api/phase2/note.js

@@ -44,7 +44,7 @@ const del=function (id){
  * }
  * */
 const coursePage=function (query){
-  return ajax.post(baseURL,'/xboe/subgroup/m/noteinfo/course',query);
+  return ajax.post(baseURL,'/xboe/subgroup/m/noteinfo/course-page',query);
 }
 
 /**

src/api/phase2/stat.js

@@ -47,14 +47,6 @@ const userDynamicList = function(data) {
     return ajax.post(baseURL,'/xboe/m/stat/userdynamic/list',data);
 }
 
-/**
- * 获取用户最近 x 天的U币记录
- * @param {String} aid 用户的id
- * @param {Integer} days x天的记录，默认为7天
- */
-const userCoinList = function(aid,days) {
-    return ajax.get(baseURL,'/xboe/m/stat/usercoinrecord/list?aid='+aid+'&days='+days);
-}
 /**
  * 获取用户全部勋章
  * @param {String} aid 用户的id
@@ -113,6 +105,15 @@ const exportUserCoinRecord = function(aid) {
     return ajax.get(baseURL,'/xboe/m/stat/usercoinrecord/export?aid='+aid);
 }
 
+/**
+ * 获取用户最近 x 天的U币记录
+ * @param {String} aid 用户的id
+ * @param {Integer} days x天的记录，默认为7天
+ */
+ const userCoinList = function(aid,days) {
+    return ajax.get(baseURL,'/xboe/m/stat/usercoinrecord/list?aid='+aid+'&days='+days);
+}
+
 
 export default {
     sendEvent,

src/components/Course/myNote.vue

@@ -2,8 +2,8 @@
     <div class="my-note">
         <div class="mynote">
             <div class="mynote-tab">
-                <div @click="notetabType(1)" :class="notetab == 1 ? 'noteactive' : ' ' "> <a href="#">新增笔记</a> </div>
-                <div @click="notetabType(2)" :class="notetab == 2 ? 'noteactive' : ' '"> <a href="#">我的笔记</a> </div>
+                <div @click="notetabType(1)" :class="notetab == 1 ? 'noteactive' : ' ' "> <span>新增笔记</span> </div>
+                <div @click="notetabType(2)" :class="notetab == 2 ? 'noteactive' : ' '"> <span>我的笔记</span> </div>
             </div>
             <!-- 新增笔记  -->
             <div class="newcote-content" v-if="notetab == 1">
@@ -86,8 +86,8 @@ export default {
             default: () => { }
         },
         score: {
-            type:String,
-            default:''
+            type:Number,
+            default:0
         }
     },
     name: 'MyNote',
@@ -114,8 +114,9 @@ export default {
         ...mapGetters(['intTimeNote', 'userInfo']),
     },
     mounted() {
-        this.mynoteData.courseId = this.data.courseId;
-        this.mynoteData.contentId = this.data.id;
+        console.log(this.data,'data111');
+        // this.mynoteData.courseId = this.data.courseId;
+        // this.mynoteData.contentId = this.data.id;
         //   if(localStorage.getItem("NOTE_TEXT") !=''){
         //     this.mynoteData.content = localStorage.getItem("NOTE_TEXT");
         //     this.notetab = 1;
@@ -125,6 +126,13 @@ export default {
 
     },
     watch: {
+        data(val){
+           if(val.id) {
+            console.log(val,'val');
+            this.mynoteData.courseId = this.data.courseId;
+            this.mynoteData.contentId = this.data.id;
+           }
+        },
         intTimeNote(val) {
             this.mynoteData.playTime = val;
         }
@@ -405,7 +413,7 @@ export default {
             flex: 1;
         }
 
-        .noteactive a {
+        .noteactive span {
             font-weight: 600;
             color: #333333;
             padding-bottom: 7px;

src/components/Portal/noteComment.vue

@@ -15,7 +15,7 @@
             <div class="comment" v-for="(com,comIdx) in list" :key="com.id">
                  <div class="comment-top">
                     <div class="comment-author">
-                        <authorInfo :avatar="com.avatar" :name="com.sysCreateBy" :sex="com.sex" :info="com.orgInfo"></authorInfo>
+                        <authorInfo :avatar="com.avatar" :name="com.name" :sex="com.sex" :info="com.orgInfo"></authorInfo>
                     </div>
                  </div>
                  <div class="comment-body" >
@@ -30,17 +30,6 @@
                           <showTime :time="com.sysCreateTime"></showTime>
                           <interactBar :type="10" :shares="false"  :data="com" @addAnswers="showReply(com)" :favorites="false" :views="false" :comments="false" :answers="true"></interactBar>
                         </div>
-                        <!-- <div class="comment-btns"> -->
-                          
-                           <!-- <a><svg-icon icon-class="like"></svg-icon><span>66</span></a> -->
-                           <!-- <div v-show="btnsShowRowId==com.id"> -->
-                            
-                             <!-- <a @click="showReply(com)"><svg-icon icon-class="comment" style="margin-right: 0px;font-size: 16px;"></svg-icon><span>回复</span></a> -->
-                             <!--必须当前登录人是一个人-->
-                             <!-- <a v-if="userInfo.aid==com.sysCreateAid" @click="delCommnet(com,comIdx)"><svg-icon icon-class="remove" style="margin-right: 0px;font-size: 16px;"></svg-icon><span>删除</span></a> -->
-                             <!-- <a v-if="com.replyList && com.replyList.length==5" @click="showMoreReply(com)" ><svg-icon icon-class="all" style="margin-right: 0px;font-size: 16px;"></svg-icon><span>全部</span></a> -->
-                           <!-- </div> -->
-                        <!-- </div> -->
                         <div v-if="replyInfo.parentId==com.id" class="comment-reply" style="padding-bottom: 5px;">
                           <div style="width:100%;display:flex;">
                             <div style="flex: 1;">
@@ -76,13 +65,6 @@
                                        <showTime :time="reply.sysCreateTime"></showTime>
                                        <interactBar :type="10" :shares="false"  :data="reply" @addAnswers="showReply(reply)" :favorites="false" :views="false"  :comments="false" :answers="true"></interactBar>
                                       </div>
-                                     <!-- <div class="comment-btns"> -->
-                                        <!-- <a><svg-icon icon-class="like"></svg-icon><span>66</span></a> -->
-                                        <!-- <div v-show="btnsShowRowId==reply.id">
-                                          <a  @click="showReply(reply)"><svg-icon icon-class="comment" style="margin-right: 0px;font-size: 16px;"></svg-icon><span>回复</span></a>
-                                          <a  v-if="userInfo.aid==reply.sysCreateAid" @click="delReply(com,reply,replyIdx)"><svg-icon icon-class="remove" style="margin-right: 0px;font-size: 16px;"></svg-icon><span>删除</span></a>
-                                        </div> -->
-                                     <!-- </div> -->
                                   </div>
                                   <!--发布回复-->
                                   <div v-if="replyInfo.parentId==reply.id" class="comment-reply" style="padding-bottom: 5px;">
@@ -163,6 +145,7 @@
     import apiComment from '@/api/modules/comments.js'
     import apiUser from '@/api/system/user.js'
     import authorInfo from '@/components/Portal/authorInfo.vue';
+    import apiNote from '@/api/phase2/note.js';
     // import author from '@/components/Portal/author.vue';
     import { mapGetters } from 'vuex';
     export default {
@@ -209,14 +192,14 @@
           isAuthor: false,
           authorList:[],//当前页面存储的用户信息，如果已经存在就不再重新请求了
           toUserId: '',
-            loadStatus:'more',//more,loading,noMore
-                pageSize:10,
-                pageIndex:1,
+          loadStatus:'more',//more,loading,noMore
+          pageSize:10,
+          pageIndex:1,
           total:0,
           listShow:true,
-                inputValue:'',
-                list:[],
-                replyParent:{},
+          inputValue:'',
+          list:[],
+          replyParent:{},
           replyShow:false,
           btnsShowRowId:'',
           replyInfo:{
@@ -282,31 +265,13 @@
       mounted() {
         this.author = this.authorId;
         this.loadData(false);
-        //在中文输入法状态下输入光标不在文字最后，同时会被遮挡两个文字大小的长度
-        // let vm=document.querySelector('.hideControl input')
-        // vm.addEventListener('compositionstart',(e)=>{
-        // vm.style.padding='0 63px 0 0'
-        // vm.size=100
-        //以上两种方式都未解决
-        // })
       },
         methods: {
         loadMore() {
           this.pageIndex +=1;
           this.loadData(true);
         },
-        // lookYourself() {// 只看作者
-        // this.pageIndex =1;
-        // this.isAuthor = !this.isAuthor;
-        // if(this.isAuthor){
-        //   this.author = this.authorId;
-        // } else{
-        //    this.author = '';
-        // }
-        //   this.loadData();
-        // },
         loadAuthorInfo(list,ids){ //加载作者信息，头像，机构信息
-        // console.log(list,ids)
           if(ids.length==0){
             return;
           }
@@ -319,6 +284,7 @@
                     item.avatar=author.avatar;
                     item.orgInfo=author.orgInfo;
                     item.sex=author.sex;
+                    item.name=author.name;
                     return true;
                   }else{
                     return false;
@@ -349,18 +315,19 @@
           let params={
             pageIndex:this.pageIndex,
             pageSize:this.pageSize,
-            type:this.objType,
-            id:this.objId,
-            author: this.author,
+            openType:1,
+            courseId:this.objId,
           }
           let $this=this;
-          apiComment.pageQuery(params).then(res=>{
+          apiNote.coursePage(params).then(res=>{
               if(res.status==200){
                 let ids=[];
                 let allList=[];
                 res.result.list.forEach(item=>{
+                  item.replyList = [];
                   item.avatar='';
                   item.orgInfo='';
+                  item.name='';
                   item.isAll=false;
                   //item.sex=null;
                   allList.push(item);
@@ -369,12 +336,39 @@
                       item.replyList.forEach(reply=>{
                         reply.avatar='';
                         reply.orgInfo='';
+                        reply.name='';
                         reply.sex=null;
                         reply.isAll=false;
                         allList.push(reply);
                         ids.push(reply.sysCreateAid);
                       })
                   }
+              
+                  let query={
+                    pageIndex:this.pageIndex,
+                    pageSize:this.pageSize,
+                    type:6,
+                    id:item.id,
+                    // author: this.author,
+                  }
+                  // console.log(item,'item');
+                  apiComment.pageQuery(query).then(res=>{
+                     if(res.status == 200 && res.result.list.length > 0) {
+                      let ids = [];
+                      res.result.list.forEach(it=>{
+                        ids.push(item.sysCreateAid);
+                        it.replyList = [];
+                        it.avatar='';
+                        it.orgInfo='';
+                        it.name='';
+                        it.isAll=false;
+                      })
+                      // let ids = res.result.list.map(item=>item.sysCreateAid);
+                      const noReapetIds=[...new Set(ids)]
+                      this.loadAuthorInfo(res.result.list,noReapetIds);
+                        item.replyList.push(...res.result.list);
+                     }
+                  })
                 });
                 this.loadAuthorInfo(allList,ids);
                 this.total=res.result.count;
@@ -460,12 +454,14 @@
           item.isAll=!item.isAll;
         },
         showReply(item){
-          console.log("9999999999");
             this.replyInfo.objType=this.objType;
-            this.replyInfo.objId=this.objId;
+            this.replyInfo.objId=item.id;
             this.replyInfo.parentId=item.id;
             this.replyInfo.replyAid=item.sysCreateAid;
             this.replyInfo.replyName=item.sysCreateBy;
+            this.replyInfo.toAid='';
+            this.replyInfo.toAname='';
+            this.replyInfo.clevel=1;
             this.replyShow=true;
         },
         cancelReply(){
@@ -480,11 +476,11 @@
           if(this.replyInfo.content==''){
             return;
           }
-          this.replyInfo.commentId=comment.id;
-          if(comment.replyList==''){
-            comment.replyList=[];
-          }
-          apiComment.reply(this.replyInfo).then(res=>{
+          // this.replyInfo.commentId=comment.id;
+          // if(comment.replyList==''){
+          //   comment.replyList=[];
+          // }
+          apiComment.add(this.replyInfo).then(res=>{
              if(res.status==200){
                 res.result.sex = null;
                 res.result.isAll=false;

src/utils/tools.js

@@ -238,3 +238,28 @@ export function testType(type) { //此方法移到tools中
     }
     return text;
   }
+// u币key
+  const uTypeMaps = {
+    'PublishArticle': '发表文章',
+    'ViewArticle': '阅读文章',
+    'StudyCourse': '学习课程',
+    'PublishCourse': '发布课程',
+    'PulishQuestion': '发布问题',
+    'ReadQuestion': '阅读问题',
+    'AnswerQuestion': '回答问题',
+    'PublishNote': '发布笔记',
+    'PublishComment': '发表评论',
+    'ReplyComment': '回复评论',
+    'Praise': '点赞',
+    'ScoreCourse':'课程评分',
+    'Feedback':'意见反馈',
+    'VideoStudyDayStat':'试听学习时长',
+    'ViewCase':'阅读案例',
+    'ViewArticle':'阅读文章',
+    'DeleteQuestion':'删除问题',
+    'other':'其他'
+};
+export function getUType(type) {
+    let name =  uTypeMaps[type];
+    return name;
+}

src/views/study/coursenew.vue

@@ -114,13 +114,8 @@
                    <comments v-if="courseInfo.id && courseInfo.id != ''" :obj-type="1" :obj-id="courseInfo.id" :toUsers="toUsers"></comments>
                 </div>
                 <div v-show="!courestab" class="coures-note">
-                  <note-comments v-if="courseInfo.id && courseInfo.id != ''" :obj-type="1" :obj-id="courseInfo.id"></note-comments>
-                   <!-- <div class="note-tole">33条笔记</div>
-                   <div class="note-info">
-                      
-                   </div> -->
+                  <note-comments v-if="courseInfo.id && courseInfo.id != ''" :obj-type="6" :obj-id="courseInfo.id"></note-comments>
                 </div>
-               
             </div>
            </div>
            <div class="coures-infobox">
@@ -151,7 +146,7 @@
             </div>
                </div>
                <!-- 我的笔记 -->
-               <div class="mynote" v-if="tab == 2">
+               <div class="mynote" v-show="tab == 2">
                  <my-note :data="contentData" @videoLocation="videoLocation" @onPlayVideo="onPlayVideo" :score="courseInfo.score"></my-note>
                </div>
            </div>

src/views/ucurrency/Index.vue

@@ -3,41 +3,22 @@
        <div class="myubi">
            <div class="ubi-hear">
                <h6>我的U币:367</h6><span class="cursor-pointer" @click="dialogVisible = true">U币规则 <i class="el-icon-arrow-right"></i> </span>
-                <el-button>导出记录</el-button>
+                <el-button @click="exportRecord()">导出记录</el-button>
            </div>
-           <div class="Ubi-hist">
-               <h6>U币历史记录</h6><span>（最多保留近7天的记录）</span>
+           <div style="max-height:600px;overflow-y:auto;padding-right:50px">
+                <div class="Ubi-hist">
+                    <h6>U币历史记录</h6><span>（最多保留近7天的记录）</span>
+                    <div style="width:100%;height:290px" ref="chart"></div>
+                </div>
+                <div class="my-Recording" v-for="(day, index) in uCoinRecord" :key="index">
+                    <h3>{{day.dayNmae}}</h3>
+                    <div class="Recording-info" v-for="info in day.list">
+                        <div class="info-tit">{{getUType(info.eventKey)}}</div>
+                        <div class="info-Gold"><img src="../../../public/images/Uimg.png" alt="">{{info.uvalue > 0? '+':''}} {{info.uvalue}}</div>
+                    </div>
+                </div>
            </div>
-          <div class="my-Recording">
-            <h3>5月31日</h3>
-            <div class="Recording-info">
-              <div class="info-tit">发布笔记</div>
-              <div class="info-Gold"><img src="../../../public/images/Uimg.png" alt=""> +5</div>
-            </div>
-              <div class="Recording-info">
-              <div class="info-tit">回答问题</div>
-              <div class="info-Gold"><img src="../../../public/images/Uimg.png" alt=""> +5</div>
-            </div>
-              <div class="Recording-info">
-              <div class="info-tit">意见反馈</div>
-              <div class="info-Gold"><img src="../../../public/images/Uimg.png" alt=""> +5</div>
-            </div>
-          </div>
-           <div class="my-Recording">
-            <h3>5月29日</h3>
-            <div class="Recording-info">
-              <div class="info-tit">发布笔记</div>
-              <div class="info-Gold"><img src="../../../public/images/Uimg.png" alt=""> +5</div>
-            </div>
-              <div class="Recording-info">
-              <div class="info-tit">回答问题</div>
-              <div class="info-Gold"><img src="../../../public/images/Uimg.png" alt=""> +5</div>
-            </div>
-              <div class="Recording-info">
-              <div class="info-tit">意见反馈</div>
-              <div class="info-Gold"><img src="../../../public/images/Uimg.png" alt=""> +5</div>
-            </div>
-          </div>
+           
        </div>
         <div class="experience">
           <div class="exp-hear">
@@ -51,11 +32,10 @@
                     累计<i class="el-icon-arrow-down el-icon--right"></i>
                 </span>
                 <el-dropdown-menu slot="dropdown">
-                    <el-dropdown-item>黄金糕</el-dropdown-item>
-                    <el-dropdown-item>狮子头</el-dropdown-item>
-                    <el-dropdown-item>螺蛳粉</el-dropdown-item>
-                    <el-dropdown-item disabled>双皮奶</el-dropdown-item>
-                    <el-dropdown-item divided>蚵仔煎</el-dropdown-item>
+                    <el-dropdown-item>累计</el-dropdown-item>
+                    <el-dropdown-item>本周</el-dropdown-item>
+                    <el-dropdown-item>本月</el-dropdown-item>
+                    <el-dropdown-item disabled>本年</el-dropdown-item>
                 </el-dropdown-menu>
                 </el-dropdown> 
               </div>
@@ -186,6 +166,8 @@
 <script>
     import apiStat from '@/api/phase2/stat.js';
     import { mapGetters } from 'vuex';
+    import {getUType} from '@/utils/tools.js'
+    import * as echarts from 'echarts'
       export default{
           computed: {
           ...mapGetters(['userInfo']),
@@ -194,15 +176,102 @@
           components: {},
           data(){
               return{
+                getUType,
                 dialogVisible:false,
-                tableData:[]
+                tableData:[],
+                uCoinRecord:[],
+                chart:null,
               }
           },
           mounted() {
-             
+             this.getList();
           },
         methods:{
-      
+            exportRecord() {
+                let urlPre=window.location.protocol+'//'+window.location.host;
+                window.open(urlPre + '/xboe/m/stat/usercoinrecord/export?aid='+this.userInfo.aid)
+            },
+            initChat(chatData) {
+               this.chart = echarts.init(this.$refs.chart);
+               const option = {
+                    tooltip: {
+                        trigger: 'item'
+                    },
+                    legend: {
+                        top: 'center',
+                        right:100,
+                        orient:'vertical',
+                        itemWidth:8,
+                        itemHeight:8,
+                        borderRadius:'50%',
+                        itemGap:26,
+                        formatter:function(name) {
+                            let data =option.series[0].data;
+                            let total = 0;
+                            let tarValue = 0;//每一项值
+                            for(let i = 0;i < data.length;i++){
+                                total += data[i].value;
+                                if(data[i].name == name) {
+                                    tarValue = data[i].value;
+                                }
+                            }
+                            let p =Math.round((tarValue/total)*100)+'%';
+                            return ` ${p}  ${name}`
+                        }
+                    },
+                    series: [
+                        {
+                        // name: 'name',
+                        type: 'pie',
+                        radius: ['50%', '40%'],
+                        avoidLabelOverlap: false,
+                        center: ['32%','50%'],
+                        itemStyle: {
+                            borderRadius: 0,
+                            borderColor: '#fff',
+                            borderWidth: 2,
+                            normal: {
+                                color: function (colors) {
+                                    let colorList = ['#5bb9fe','#f7b36b','#72e5d5','#e1e1f9'];
+                                    return colorList[colors.dataIndex];
+                                },
+                            }
+                        },
+                        label: {
+                            show: false,
+                            position: 'center',
+                        },
+                        labelLine: {
+                            show: false
+                        },
+                        data: chatData,
+                        }
+                    ]
+                    };
+                    this.chart.setOption(option);
+            },
+           getList() {
+            apiStat.userCoinList(this.userInfo.aid,7).then(res=>{
+                if(res.status == 200) {
+                   this.uCoinRecord = [];
+                    for(let key in res.result.uCoinRecord){
+                        this.uCoinRecord.push({
+                        dayNmae: key,
+                        list:res.result.uCoinRecord[key]
+                        })
+                    }
+                    let chatData = [];
+                    
+                    for(let key in res.result.chatData){
+                        chatData.push({
+                            value:res.result.chatData[key],
+                            name:this.getUType(key)
+                        })
+                    }
+                    this.initChat(chatData);
+                }
+            })
+           }
         }
       }
 </script>
@@ -314,7 +383,7 @@
     }
     .myubi{
       flex: 1;
-      margin-right: 107px;
+      margin-right: 84px;
     }
     .omit{
         padding-left: 20px;

src/views/user/ranking.vue

@@ -1,5 +1,5 @@
 <template>
-  <div style="padding:26px 40px;display:flex;">
+  <div style="padding:26px 40px;display:flex;overflow-x: auto;">
       <div class="experience">
           <div class="exp-hear">
               <div class="exp-hear-text">
@@ -12,11 +12,10 @@
                     累计<i class="el-icon-arrow-down el-icon--right"></i>
                 </span>
                 <el-dropdown-menu slot="dropdown">
-                    <el-dropdown-item>黄金糕</el-dropdown-item>
-                    <el-dropdown-item>狮子头</el-dropdown-item>
-                    <el-dropdown-item>螺蛳粉</el-dropdown-item>
-                    <el-dropdown-item disabled>双皮奶</el-dropdown-item>
-                    <el-dropdown-item divided>蚵仔煎</el-dropdown-item>
+                    <el-dropdown-item>累计</el-dropdown-item>
+                    <el-dropdown-item>本周</el-dropdown-item>
+                    <el-dropdown-item>本月</el-dropdown-item>
+                    <el-dropdown-item>本年</el-dropdown-item>
                 </el-dropdown-menu>
                 </el-dropdown> 
               </div>
@@ -43,8 +42,8 @@
              <div class="table-hear">
                 <div style="margin-left:5px">排名</div>
                 <div style="margin-left:5px">姓名</div>
-                <div class="bm">部门</div>
-                <div class="jy">经验值</div>
+                <div class="bm">学习时长</div>
+                <!-- <div class="jy">经验值</div> -->
              </div>
              <div style="height:450px;overflow-y:auto">
             <div class="table-hear" style="margin-top:40px;border-bottom: 1px solid #ddd;padding-bottom:20px">
@@ -114,11 +113,10 @@
                     累计<i class="el-icon-arrow-down el-icon--right"></i>
                 </span>
                 <el-dropdown-menu slot="dropdown">
-                    <el-dropdown-item>黄金糕</el-dropdown-item>
-                    <el-dropdown-item>狮子头</el-dropdown-item>
-                    <el-dropdown-item>螺蛳粉</el-dropdown-item>
-                    <el-dropdown-item disabled>双皮奶</el-dropdown-item>
-                    <el-dropdown-item divided>蚵仔煎</el-dropdown-item>
+                    <el-dropdown-item>累计</el-dropdown-item>
+                    <el-dropdown-item>本周</el-dropdown-item>
+                    <el-dropdown-item>本月</el-dropdown-item>
+                    <el-dropdown-item>本年</el-dropdown-item>
                 </el-dropdown-menu>
                 </el-dropdown> 
               </div>
@@ -193,6 +191,96 @@
              </div>
           </div>
       </di>
+      <di class="Duration">
+           <div class="exp-hear">
+              <div class="exp-hear-text">
+                  学习天数排行榜
+                  <span class="exp-hear-textbor"></span>
+             </div>
+              <div class="exp-hear-xiala">
+                 <el-dropdown trigger="click">
+                <span class="el-dropdown-link">
+                    累计<i class="el-icon-arrow-down el-icon--right"></i>
+                </span>
+                <el-dropdown-menu slot="dropdown">
+                    <el-dropdown-item>累计</el-dropdown-item>
+                    <el-dropdown-item>本周</el-dropdown-item>
+                    <el-dropdown-item>本月</el-dropdown-item>
+                    <el-dropdown-item>本年</el-dropdown-item>
+                </el-dropdown-menu>
+                </el-dropdown> 
+              </div>
+          </div>
+          <div class="myselftext">
+             <div class="myranking">
+                 我的排名 :  <span> 128</span>
+             </div>
+             <div class="myexperience">
+                 我的经验值 :  <span> 367</span>
+             </div>
+          </div>
+           <div class="exp-table">
+             <div class="table-hear">
+                <div style="margin-left:5px">排名</div>
+                <div style="margin-left:5px">姓名</div>
+                <div class="bm">学习天数</div>
+                <!-- <div class="jy">经验值</div> -->
+             </div>
+             <div style="height:500px;overflow-y:auto">
+            <div class="table-hear" style="margin-top:40px;border-bottom: 1px solid #ddd;padding-bottom:20px">
+                 <div class="tab-rank" ><img src="../../../public/images/rank1.png" alt=""></div>
+                 <div class="tab-name"><img src="../../../public/images/Avatarwoman.png" alt=""> <span>小李</span></div>
+                 <div class="bm tab-bm" style="margin-left:30px;">BOE / 企划中心 / 数据资产部</div>
+                 <div class="jy tab-jy">
+                     <div style="font-size: 18px;color: #333333;font-weight: 600;">1093</div>
+                 </div>
+             </div>
+              <div class="table-hear" style="margin-top:40px;border-bottom: 1px solid #ddd;padding-bottom:20px">
+                 <div class="tab-rank" ><img src="../../../public/images/rank2.png" alt=""></div>
+                 <div class="tab-name"><img src="../../../public/images/Avatarwoman.png" alt=""> <span>小李</span> </div>
+                 <div class="bm tab-bm" style="margin-left:30px;">BOE / 企划中心 / 数据资产部</div>
+                 <div class="jy tab-jy">
+                     <div style="font-size: 18px;color: #333333;font-weight: 600;">1093</div>
+                 </div>
+             </div>
+              <div class="table-hear" style="margin-top:40px;border-bottom: 1px solid #ddd;padding-bottom:20px">
+                 <div class="tab-rank" ><img src="../../../public/images/rank3.png" alt=""></div>
+                 <div class="tab-name"><img src="../../../public/images/Avatarwoman.png" alt=""> <span>小李</span> </div>
+                 <div class="bm tab-bm" style="margin-left:30px;">BOE / 企划中心 / 数据资产部</div>
+                 <div class="jy tab-jy">
+                     <div style="font-size: 18px;color: #333333;font-weight: 600;">1093</div>
+                 </div>
+             </div>
+              <div class="table-hear" style="margin-top:40px;border-bottom: 1px solid #ddd;padding-bottom:20px">
+                 <div style="line-height: 40px;padding-left:15px;font-size: 16px;color: #333333;">4</div>
+                 <div class="tab-name"><img src="../../../public/images/Avatarwoman.png" alt=""> <span>小李</span> </div>
+                 <div class="bm tab-bm" style="margin-left:30px;">BOE / 企划中心 / 数据资产部</div>
+                 <div class="jy tab-jy">
+                     <div style="font-size: 18px;color: #333333;font-weight: 600;">1093</div>
+                 </div>
+             </div>
+              <div class="table-hear" style="margin-top:40px;border-bottom: 1px solid #ddd;padding-bottom:20px">
+                 <div style="line-height: 40px;padding-left:15px;font-size: 16px;color: #333333;">5</div>
+                 <div class="tab-name"><img src="../../../public/images/Avatarwoman.png" alt=""> <span>小李</span> </div>
+                 <div class="bm tab-bm" style="margin-left:30px;">BOE / 企划中心 / 数据资产部</div>
+                 <div class="jy tab-jy">
+                     <div style="font-size: 18px;color: #333333;font-weight: 600;">1093</div>
+                 </div>
+             </div>
+             </div>
+             <div class="omit">
+                 <div>.</div> <div>.</div> <div>.</div>
+             </div>
+             <div class="table-hear" style="margin-top:40px;border-bottom: 1px solid #ddd;padding-bottom:20px">
+                 <div style="color: #0059FF;line-height: 40px;padding-left:15px;font-size: 16px;" class="tab-rank" >128</div>
+                 <div class="tab-name"><img src="../../../public/images/Avatarwoman.png" alt=""> <span style="color: #0059FF;">小李</span> </div>
+                 <div class="bm tab-bm" style="margin-left:30px;color: #0059FF;">BOE / 企划中心 / 数据资产部</div>
+                 <div class="jy tab-jy">
+                     <div style="font-size: 18px;color: #333333;font-weight: 600;color: #0059FF;">1093</div>
+                 </div>
+             </div>
+          </div>
+      </di>
   </div>
 </template>