From 0094d1fe7953b5895b2d1e11a86bedeab5d3d78d Mon Sep 17 00:00:00 2001 From: 1154079537 <1154079537@qq.com> Date: Mon, 13 May 2024 17:23:05 +0800 Subject: [PATCH] 1 --- components/customTab.vue | 23 +- components/easy-loadimage/easy-loadimage.vue | 272 +++---- components/recommend/index.vue | 210 +++++- pages.json | 2 +- pages/cloud_warehouse/market/market.vue | 681 +++++++++--------- pages/cloud_warehouse/specialty/specialty.vue | 425 +++++------ pages/index/index.vue | 83 ++- pages/whole_sale/index.vue | 186 ++--- static/images/loading.gif | Bin 0 -> 17340 bytes 9 files changed, 1065 insertions(+), 817 deletions(-) create mode 100644 static/images/loading.gif diff --git a/components/customTab.vue b/components/customTab.vue index ef96390..3ce94ae 100644 --- a/components/customTab.vue +++ b/components/customTab.vue @@ -3,8 +3,7 @@ - + {{item.name}} @@ -30,7 +29,7 @@ // +---------------------------------------------------------------------- // | Author: CRMEB Team // +---------------------------------------------------------------------- - export default{ + export default { props: { newData: { type: Object, @@ -41,15 +40,15 @@ default: '', } }, - data(){ + data() { return { - + } }, mounted() { - + }, - methods:{ + methods: { goRouter(item) { var pages = getCurrentPages(); var page = (pages[pages.length - 1]).$page.fullPath; @@ -65,7 +64,6 @@ }, } } - + \ No newline at end of file diff --git a/components/easy-loadimage/easy-loadimage.vue b/components/easy-loadimage/easy-loadimage.vue index 508ccbf..10b135f 100644 --- a/components/easy-loadimage/easy-loadimage.vue +++ b/components/easy-loadimage/easy-loadimage.vue @@ -1,56 +1,63 @@ + /* 官方优化图片tips */ + image { + will-change: transform + } + /* 渐变过渡效果处理 */ + image.origin-img { + width: 100%; + height: 100%; + opacity: 0.3; + max-height: 360rpx; + } + + image.origin-img.show-transition { + transition: opacity .5s; + opacity: 1; + } + + image.origin-img.no-transition { + opacity: 1; + } + + /* 加载失败、加载中的占位图样式控制 */ + .loadfail-img { + height: 100%; + background-repeat: no-repeat; + background-size: 50%; + background-position: center; + } + + .loading-img { + height: 100%; + background-position: center; + } + + /* 转圈 */ + .spin-circle { + background-repeat: no-repeat; + background-size: 60%; + } + + /* 动态灰色若隐若现 */ + .looming-gray { + animation: looming-gray 1s infinite linear; + background-color: #e3e3e3; + } + + @keyframes looming-gray { + 0% { + background-color: #e3e3e3aa; + } + + 50% { + background-color: #e3e3e3; + } + + 100% { + background-color: #e3e3e3aa; + } + } + + /* 骨架屏1 */ + .skeleton-1 { + background-color: #e3e3e3; + background-image: linear-gradient(100deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0) 80%); + background-size: 100rpx 100%; + background-repeat: repeat-y; + background-position: 0 0; + animation: skeleton-1 .6s infinite; + } + + @keyframes skeleton-1 { + to { + background-position: 200% 0; + } + } + + /* 骨架屏2 */ + .skeleton-2 { + background-image: linear-gradient(-90deg, #fefefe 0%, #e6e6e6 50%, #fefefe 100%); + background-size: 400% 400%; + background-position: 0 0; + animation: skeleton-2 1.2s ease-in-out infinite; + } + + @keyframes skeleton-2 { + to { + background-position: -135% 0; + } + } + \ No newline at end of file diff --git a/components/recommend/index.vue b/components/recommend/index.vue index 1846bbd..a49337f 100644 --- a/components/recommend/index.vue +++ b/components/recommend/index.vue @@ -46,6 +46,7 @@ 里海新闻 更多 + - - + + {{item.name}} {{item.desc}} - - - - - 暂无商品，看点别的吧 - - + + + + + + + + + 暂无商品，看点别的吧 + + + + + {{ hotTitleArr[currTabIndex] }} + + + + + + + @@ -107,18 +129,27 @@ import { Toast } from "../../libs/uniApi"; + import { + getProductslist, + getProductHot, + storeCategory + } from '@/api/store.js'; export default { components: { WaterfallsFlow }, computed: mapGetters(['uid']), props: { - hostProduct: { - type: Array, - default: function() { - return []; - } - }, + // hostProduct: { + // type: Array, + // default: function() { + // return []; + // } + // }, + // loadTitle: { + // type: String, + // default: '加载更多...' + // }, showTab: { type: Boolean, default: false @@ -160,18 +191,153 @@ desc: '特色农副', val: 4 }], - currTabs: 1, - list: [] + currTabIndex: 0, + list: [], + loadTitle: '加载更多', + hostProduct: [ + [], + [], + [], + [] + ], + hotPageArr: [1, 1, 1, 1], + hotScrollArr: [true, true, true, true], + hostIndex: 0, + hotPage: 1, + hotLimit: 20, + hotScroll: true, + hotLoading: [false, false, false, false], + hotTitle: '加载更多', + hotTitleArr: ['加载更多', '加载更多', '加载更多', '加载更多'], + scrollY: false }; }, mounted() { this.getArticleList(); + // 初始化 + this.loadGoods(0); }, + methods: { - changeTab(e) { - this.currTabs = e; - this.$emit('changeRecommedTab', e) + // 父页面滚动 + parentPageScroll(boolean) { + this.scrollY = boolean; + this.$forceUpdate(); }, + + // 滚动底部 触底刷新 + onScrollBottom() { + this.loadGoods(); + }, + + // 滚动顶部 + onScrollTop() {}, + + // 滚动商品 + onscroll() { + console.log(1111); + }, + + + changeTab(e) { + if (e.detail) this.currTabIndex = e.detail.current; + else this.currTabIndex = e; + }, + + loadGoods(e = 0) { + this.$nextTick(() => { + if (e == 0) return this.get_host_product(0); + if (e == 1) return this.get_host_home({ + mer_type: 1 + }, 1); + if (e == 2) return this.get_host_home({ + mer_type: 2 + }, 2); + if (e == 3) return this.get_host_home({ + mer_type: 3 + }, 3); + }) + }, + /** + * 获取我的推荐 + */ + get_host_product: function(e = 0) { + let that = this; + if (!that.hotScroll) return; + if (that.hotLoading[e]) return; + + that.hotLoading[e] = true; + that.hotTitleArr[that.currTabIndex] = '加载中'; + getProductHot(that.hotPageArr[that.currTabIndex], that.hotLimit, 1, 1).then(res => { + console.log(res.data.list); + res.data.list = this.shuffleArray(res.data.list); + let list = res.data.list; + let productList = that.hostProduct[that.currTabIndex]; + // if (!that.hostProduct[that.currTabIndex]) productList[e] = []; + productList = [...productList, ...res.data.list]; + + console.log(productList); + + let hotScroll = list.length <= res.data.limit && list.length != 0; + that.hotScrollArr[that.currTabIndex] = hotScroll; + + that.hotLoading[that.currTabIndex] = false; + that.hotTitleArr[that.currTabIndex] = !hotScroll ? '已全部加载' : '加载更多'; + + // that.$set(that, 'hostProduct', productList); + that.hostProduct[that.currTabIndex] = productList; + // if (this.hostIndex == e) this.$forceUpdate(); + that.hotPageArr[that.currTabIndex] = res.data.page + 1 + // that.$set(that, 'hotPage', res.data.page + 1); + that.$set(that, 'hotLimit', res.data.limit); + + + console.log(that.hostProduct); + this.$forceUpdate() + }); + }, + /** + * 获取里海云仓, 云市场, 名优特产 + */ + get_host_home: function(query = {}, e = 1) { + let that = this; + if (!that.hotScroll) return; + if (that.hotLoading[e]) return; + that.hotLoading[e] = true; + that.hotTitle = '加载中'; + query.page = that.hotPage; + query.limit = that.hotLimit; + query.sale_type = 1; + query.rand = 1; + getProductslist({ + ...query + }).then(res => { + uni.stopPullDownRefresh(); + res.data.list = this.shuffleArray(res.data.list); + let list = res.data.list; + let productList = that.hostProduct; + if (!productList[e]) productList[e] = []; + productList[e] = [...productList[e], ...list]; + let hotScroll = list.length <= res.data.limit && list.length != 0; + that.hotScroll = hotScroll; + that.hotLoading[e] = false; + that.hotTitle = !hotScroll ? '已全部加载' : '加载更多'; + that.$set(that, 'hostProduct', productList); + if (this.hostIndex == e) this.$forceUpdate(); + that.$set(that, 'hotPage', res.data.page + 1); + that.$set(that, 'hotLimit', res.data.limit); + }); + }, + + // 数组乱序 + shuffleArray(array) { + for (let i = array.length - 1; i > 0; i--) { + const j = Math.floor(Math.random() * (i + 1)); + [array[i], array[j]] = [array[j], array[i]]; + } + return array; + }, + navTo(url) { uni.navigateTo({ url: url, @@ -180,6 +346,7 @@ } }) }, + getArticleList() { getArticleList(20, { page: 1, @@ -188,6 +355,7 @@ this.list = res.data.list; }) }, + goDetail(item) { goShopDetail(item, this.uid).then(res => { if (this.isLogin) { diff --git a/pages.json b/pages.json index 78a0cc2..8f2929b 100644 --- a/pages.json +++ b/pages.json @@ -25,7 +25,7 @@ }, { "path": "pages/whole_sale/index", "style": { - "enablePullDownRefresh": true, + "enablePullDownRefresh": false, "navigationBarTitleText": "批发", "navigationStyle": "custom" } diff --git a/pages/cloud_warehouse/market/market.vue b/pages/cloud_warehouse/market/market.vue index 88ba57c..9abb926 100644 --- a/pages/cloud_warehouse/market/market.vue +++ b/pages/cloud_warehouse/market/market.vue @@ -1,342 +1,3 @@ -