sunlupeng 1 anno fa
parent
commit
a7b07deb86

+ 9 - 1
src/views/HomeView/Index.vue

@@ -101,7 +101,15 @@ export default{
     },
      // 保存滚动值,这是兼容的写法
      handleScroll () {
-        if((document.documentElement.scrollTop + window.innerHeight) == document.body.offsetHeight){
+        //变量scrollTop是滚动条滚动时,距离顶部的距离
+        var scrollTop = document.documentElement.scrollTop||document.body.scrollTop;
+        //变量windowHeight是可视区的高度
+        var windowHeight = document.documentElement.clientHeight || document.body.clientHeight;
+        //变量scrollHeight是滚动条的总高度
+        var scrollHeight = document.documentElement.scrollHeight||document.body.scrollHeight;
+        //滚动条到底部的条件
+        console.log("距顶部---"+scrollTop+"可视区高度---"+windowHeight+"滚动条总高度---"+scrollHeight);
+        if(scrollHeight - (scrollTop+windowHeight) < 10){
             if(this.page > this.pages){
                 return
             }else{

+ 60 - 55
src/views/HomeView/PointsMall.vue

@@ -29,8 +29,7 @@
                 <el-tab-pane label="积分兑换" name="goodsNotice">
                     <el-input clearable style="width: 200px;" size="small" v-model="goodsName"
                         placeholder="物品名称"></el-input>
-                    <el-button size="small" style="margin-left: 30px;" type="primary"
-                        @click="handleFilter">查询</el-button>
+                    <el-button size="small" style="margin-left: 30px;" type="primary" @click="handleFilter">查询</el-button>
                     <div class="tab-list" style="margin-top: 10px;">
                         <div :class="{ 'tab': true, 'checked': item.checked }" v-for="(item) in options"
                             :key="item.dictValue" @click="choseProductAttributeType(item)">
@@ -149,15 +148,15 @@ import { getTab } from '@/utils/auth'
 export default {
     data() {
         return {
-            page:1,
-            pages:1,
+            page: 1,
+            pages: 1,
             // tab 列表
             options: [],
             goodsName: '',
             productAttribute: '',
             orderByClause: 'asc',
-            deliveryType:'',
-            deliveryTypeList:[
+            deliveryType: '',
+            deliveryTypeList: [
                 {
                     type: '',
                     checked: true,
@@ -201,13 +200,12 @@ export default {
             activeName: 'goodsNotice',
             noticeContent: '',
             goodsList: [],
-            giftList:[],
+            giftList: [],
         };
     },
     created() {
-        window.addEventListener('scroll', this.handleScroll, true)
         const Tab = getTab();
-        if(Tab == 'gift'){
+        if (Tab == 'gift') {
             this.activeName = 'giftNotice';
         };
         this.getIntegralTypes();
@@ -216,24 +214,10 @@ export default {
         this.getNotice(this.activeName);
     },
     methods: {
-        handleFilter(){
+        handleFilter() {
             this.page = 1;
             this.getFirstList();
         },
-        // 保存滚动值,这是兼容的写法
-        handleScroll () {
-            const bottomHight = document.documentElement.scrollTop + window.innerHeight;
-            const offsetHeight = document.body.offsetHeight;
-            console.log(bottomHight,'-----11');
-            console.log(offsetHeight,'-----22');
-            if(bottomHight == offsetHeight){
-                if(this.page > this.pages){
-                    return
-                }else{
-                    this.getFirstList();
-                }
-            }
-        },
         changeOrderByClause(item) {
             this.orderByClauseList.forEach((element) => {
                 element.checked = false;
@@ -319,42 +303,42 @@ export default {
                 this.noticeContent = response.data.data.content
             })
         },
-        getFirstList(){
+        getFirstList() {
             let params = {
-                    limit:8,
-                    page:this.page,
-                    name: this.goodsName,
-                    productAttribute: this.productAttribute,
-                    orderByClause: this.orderByClause,
-                    deliveryType: this.deliveryType
+                limit: 8,
+                page: this.page,
+                name: this.goodsName,
+                productAttribute: this.productAttribute,
+                orderByClause: this.orderByClause,
+                deliveryType: this.deliveryType
+            }
+
+            integralList(params).then(response => {
+                if (this.page == 1) {
+                    this.goodsList = response.data.data.list;
+                    this.page = response.data.data.pageNum;
+                    this.pages = response.data.data.pages;
+                } else {
+                    this.goodsList = [
+                        ...this.goodsList,
+                        ...response.data.data.list
+                    ]
                 }
-               
-                integralList(params).then(response => {
-                    if(this.page==1){
-                        this.goodsList = response.data.data.list;
-                        this.page = response.data.data.pageNum;
-                        this.pages = response.data.data.pages;
-                    }else{
-                        this.goodsList = [
-                            ...this.goodsList,
-                            ...response.data.data.list
-                        ]
-                    }
-                    ++this.page  
-                })
+                ++this.page
+            })
         },
-        getSecondList(){
+        getSecondList() {
             festivalList({ welfareId: this.curChosed }).then(response => {
-                    console.log(response.data.data);
-                    this.giftList = response.data.data;
-                })
+                console.log(response.data.data);
+                this.giftList = response.data.data;
+            })
         },
         handleClick(tab, event) {
             this.page = 1;
             console.log(tab.name, event);
-            if(tab.name=='goodsNotice'){
+            if (tab.name == 'goodsNotice') {
                 this.getFirstList();
-            }else{
+            } else {
                 this.getSecondList();
             }
             this.getNotice(tab.name);
@@ -368,12 +352,32 @@ export default {
                 }
             });
         },
+        // 保存滚动值,这是兼容的写法
+        handleScroll() {
+            //变量scrollTop是滚动条滚动时,距离顶部的距离
+            var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
+            //变量windowHeight是可视区的高度
+            var windowHeight = document.documentElement.clientHeight || document.body.clientHeight;
+            //变量scrollHeight是滚动条的总高度
+            var scrollHeight = document.documentElement.scrollHeight || document.body.scrollHeight;
+            //滚动条到底部的条件
+            console.log("距顶部---" + scrollTop + "可视区高度---" + windowHeight + "滚动条总高度---" + scrollHeight);
+            if (scrollHeight - (scrollTop + windowHeight) < 10) {
+                if (this.page > this.pages) {
+                    return
+                } else {
+                    this.getFirstList();
+                }
+            }
+        },
     },
-
-    destroyed () {
+    mounted() {
+        window.addEventListener('scroll', this.handleScroll)
+    },
+    destroyed() {
         console.log('lalalal')
         // 离开该页面需要移除这个监听的事件,不然会报错
-        window.removeEventListener('scroll', this.handleScroll, true)
+        window.removeEventListener('scroll', this.handleScroll)
     }
 };
 </script>
@@ -608,4 +612,5 @@ button {
     background-color: #1e80ff;
     color: #fff;
     box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .05), 0 1px 2px 0 rgba(0, 0, 0, .05);
-}</style>
+}
+</style>

+ 9 - 1
src/views/NoticeCenter.vue

@@ -89,7 +89,15 @@ export default{
     },
      // 保存滚动值,这是兼容的写法
      handleScroll () {
-        if((document.documentElement.scrollTop + window.innerHeight) == document.body.offsetHeight){
+        //变量scrollTop是滚动条滚动时,距离顶部的距离
+        var scrollTop = document.documentElement.scrollTop||document.body.scrollTop;
+        //变量windowHeight是可视区的高度
+        var windowHeight = document.documentElement.clientHeight || document.body.clientHeight;
+        //变量scrollHeight是滚动条的总高度
+        var scrollHeight = document.documentElement.scrollHeight||document.body.scrollHeight;
+        //滚动条到底部的条件
+        console.log("距顶部---"+scrollTop+"可视区高度---"+windowHeight+"滚动条总高度---"+scrollHeight);
+        if(scrollHeight - (scrollTop+windowHeight) < 10){
             if(this.page > this.pages){
                 return
             }else{