feat(apps/components/waterfall.vue) 优化滚动加载

@@ -125,6 +125,7 @@ export default {
       });
     },
     data(newVal,oldVal) {
+      console.log('watchData:', newVal.length, oldVal.length);
       this.$nextTick(() => {
         clearTimeout(this.timer);
         this.timer = setTimeout(() => {
@@ -134,7 +135,7 @@ export default {
           if (newVal.length < this.loadedIndex) {
             this.loadedIndex = 0
           }
-          if (newVal.length>oldVal.length || newVal.length > this.loadedIndex) {
+          if (newVal.length > oldVal.length || newVal.length > this.loadedIndex) {
             if (newVal.length === oldVal.length) {
               this.resize(this.loadedIndex > 0 ? this.loadedIndex : null);
               return;
@@ -237,6 +238,7 @@ export default {
       }
     },
     async resize(index, elements) { // resize and render
+      console.log('resize:', index, elements);
       this.isresizing = true;
       var self = this;
       if (!this.$slots.default) {
@@ -337,11 +339,9 @@ export default {
       const scrollTop = this.height ? this.root.scrollTop : document.documentElement.scrollTop || document.body.scrollTop || this.scrollTop
       const scrollHeight = this.height ? this.root.scrollHeight : this.root.scrollHeight; //document.documentElement.offsetHeight
       var diff = scrollHeight - scrollTop - self.clientHeight;
-
       // console.log('scrollTop=', scrollTop, 'scrollHeight=', scrollHeight, 'diff=', diff, 'max=', self.max);
-
       self.$emit('scroll', {scrollHeight: scrollHeight, scrollTop: scrollTop, clientHeight: self.clientHeight, diff: diff, time: Date.now()})
-      if (diff < self.max && self.loadmore && scrollHeight > self.clientHeight) {
+      if (diff < self.max && self.loadmore && scrollHeight > self.clientHeight && this.loadedIndex >= this.data.length - 1) {
         self.lastScrollTop = scrollTop;
         self.loadmore = false;
         self.$emit('loadmore');

@@ -52,7 +52,7 @@ export default {
     ...mapState(['articleList', 'articleListInfo', 'isFetchingArticleList']),
     listInfo() { // 列表基础信息
       if (this.articleListInfo) {
-        console.log('computed=', this.articleListInfo, 'computedList=', this.articleList);
+        // console.log('computed=', this.articleListInfo, 'computedList=', this.articleList);
         return {
           lastedTime: this.articleListInfo.lastedTime,
           pageNo: this.articleListInfo.pageNo || 1,

@@ -12,6 +12,7 @@
       <template>
         <div class="cell-item" v-for="(item, index) in articleList" :key="index">
           <div class="item-image" :data-id="item.articleId" @click="gotoDetailPage">
+            <div :class="['icon', item.sort === 4 ? 'icon-play' : '', item.sort === 1 ? 'icon-note' : '']"></div>
             <img :src="item.coverImage">
 <!--            <img :src="item.resourceSrc" v-else-if="item.dataType === 2">-->
           </div>
@@ -105,7 +106,7 @@ export default {
   },
   watch: {
     'yoho.context.isLogin': function(val) {
-      this.isLogin = val;
+      // this.isLogin = val;
     },
     isLoading(newVal) {
       if (newVal === true) {
@@ -130,7 +131,7 @@ export default {
     },
     async checkLogin() {
       const user = await this.$sdk.getUser(true);
-      console.log('userInfo=', user);
+
       if (user.uid) {
         this.isLogin = true;
       }
@@ -194,9 +195,28 @@ export default {
     }
 
     .item-image {
+      position: relative;
       width: 100%;
       border-radius: 16px 16px 0 0;
       overflow: hidden;
+
+      .icon {
+        width: 40px;
+        height: 40px;
+        position: absolute;
+        right: 12px;
+        top: 12px;
+        background-size: 100% 100%;
+        z-index: 9;
+
+        &.icon-play {
+          background-image: url("../../../statics/image/article/icon_list_play.png");
+        }
+
+        &.icon-note {
+
+        }
+      }
     }
 
     .cell-item {

@@ -13,7 +13,7 @@ export default {
 
   // 调用成功
   [Types.FETCH_ARTICLE_LIST_SUCCESS](state, {result, reload}) {
-    console.log('reload');
+    console.log('reload = ', reload);
     state.isFetchingArticleList = false;
     if (reload) {
       state.articleList = [];