From 73341eba8e313c2aead0476026bc362b8c4be4b1 Mon Sep 17 00:00:00 2001 From: xuxueyang <xuxy@fengyuntec.com> Date: 星期四, 12 九月 2024 16:05:06 +0800 Subject: [PATCH] update 优化 --- pages/home/home.vue | 397 ++++++++++++++++++++++++++++++++++--------------------- 1 files changed, 244 insertions(+), 153 deletions(-) diff --git a/pages/home/home.vue b/pages/home/home.vue index 9cd7764..1695491 100644 --- a/pages/home/home.vue +++ b/pages/home/home.vue @@ -31,28 +31,28 @@ </view> <!-- banner --> - <!-- <uni-swiper-dot class="uni-swiper-dot-box" @clickItem=clickItem :info="info" :current="currentBanner" + <!-- <uni-swiper-dot class="uni-swiper-dot-box" @clickItem=clickItem :info="info" :current="currentBanner" :mode="'dot'" :dots-styles="dotsStyles[0]" field="content"> --> - <swiper class="swiper-box" @change="changeBanner" :interval="10000" :circular="true" :current="0" - v-if="banners&&banners.length>0" :autoplay="true"> - <swiper-item v-for="(item, index) in banners" :key="index"> - <view class="swiper-item" :class="'swiper-item' + index"> - <!-- @click="previewImg(item.url||item.image)" --> - <image class="home-banner-image" mode="scaleToFill" @click="clickBanner(item)" - :src="item.url||item.image"> - </image> - </view> - </swiper-item> - </swiper> - <swiper class="swiper-box" @change="changeBanner" :current="0" v-if="!banners||banners.length==0"> - <swiper-item v-for="(item, index) in 1" :key="index"> - <view class="swiper-item" :class="'swiper-item' + index"> - <image class="home-banner-image" mode="scaleToFill" - src="https://hmy-flower.oss-cn-shanghai.aliyuncs.com/62/62ddac6297104e369aba646be704064dbanner@2x.png"> - </image> - </view> - </swiper-item> - </swiper> + <swiper class="swiper-box" @change="changeBanner" :interval="10000" :circular="true" :current="0" + v-if="banners&&banners.length>0" :autoplay="true"> + <swiper-item v-for="(item, index) in banners" :key="index"> + <view class="swiper-item" :class="'swiper-item' + index"> + <!-- @click="previewImg(item.url||item.image)" --> + <image class="home-banner-image" mode="scaleToFill" @click="clickBanner(item)" + :src="item.url||item.image"> + </image> + </view> + </swiper-item> + </swiper> + <swiper class="swiper-box" @change="changeBanner" :current="0" v-if="!banners||banners.length==0"> + <swiper-item v-for="(item, index) in 1" :key="index"> + <view class="swiper-item" :class="'swiper-item' + index"> + <image class="home-banner-image" mode="scaleToFill" + src="https://hmy-flower.oss-cn-shanghai.aliyuncs.com/62/62ddac6297104e369aba646be704064dbanner@2x.png"> + </image> + </view> + </swiper-item> + </swiper> <!-- </uni-swiper-dot> --> <!-- tip --> <view class="m-t-12" @click="getNoticeMore"> @@ -61,19 +61,53 @@ <span v-if="!currentNotice||!currentNotice.id"> </span> </view> <!-- 当前分类 --> - <home-category></home-category> + <home-category ref="home_category"></home-category> <!-- 特别的几个公告图片 --> - <home-banner-imgs></home-banner-imgs> + <home-banner-imgs ref="home_banner"></home-banner-imgs> <!-- 均价情况 --> <!-- <home-price></home-price> --> <!-- 几个专区 --> - <home-zones></home-zones> + <home-zones ref="home_zeros"></home-zones> <!-- 置顶的花列表 --> <home-top-flow ref="home_top_flow"></home-top-flow> <view style="min-height:140rpx"> </view> <common-footer flg="0"></common-footer> + + <uni-popup ref="coupon_home" type="center" border-radius="10px 10px 0 0"> + <view class="coupon-container" style="width: 690rpx;"> + <view class="coupont-item all"> + <view class="flex container img100"> + <view class="info-price"> + <view class="price1"> + {{dto_home_coupon.maxDiscountAmount?(`${dto_home_coupon.maxDiscountAmount}折`):(`¥${dto_home_coupon.couponDiscountValue}`)}} + </view> + <view class="price2"> + {{dto_home_coupon.minOrderAmount?(`满¥${dto_home_coupon.minOrderAmount}可用`):'无门槛'}} + </view> + </view> + <view class="info flex1"> + <view class="title"> + {{dto_home_coupon.couponName||'-'}} + </view> + <view class="time" v-if="dto_home_coupon.getEndDate"> + <!-- 领取后{{dto_home_coupon.usageTimeNum||''}}{{dto_home_coupon.usageTimeTypeName||''}}有效 --> + {{dto_home_coupon.getEndDate|| '-'}}前有效 + </view> + <view class="button" @click="getCoupon(dto_home_coupon)"> + 立即领取 + </view> + </view> + </view> + + <view class="tip"> + <span class="t-red">*</span>此券每人限领1张。仅限用于花满芜鲜花交易平台鲜切花花款满额使用,不可与其他优惠同享、不可叠加使用 + </view> + </view> + </view> + </uni-popup> + </view> </template> @@ -106,7 +140,16 @@ homeZones, homeTopFlow }, - + onPullDownRefresh() { + // 下拉刷新方法 + this.init() + this.$message.showLoading() + this.init_children() + setTimeout(() => { + this.$message.hideLoading() + uni.stopPullDownRefresh() + }, 2000) + }, data() { return { search_flow: '', @@ -163,7 +206,8 @@ hide_footer: false, noticeList: [], currentNoticeIndex: 0, - currentNotice: {} + currentNotice: {}, + dto_home_coupon: {} }; }, onShareAppMessage() { @@ -188,156 +232,199 @@ path: url, } }, - onReachBottom() { - console.log('onReachBottom') - if(this.$refs&&this.$refs.home_top_flow){ - // console.log(this.$refs.home_top_flow) - this.$refs.home_top_flow.fun_GetMore() - } + onReachBottom() { + console.log('onReachBottom') + if (this.$refs && this.$refs.home_top_flow) { + // console.log(this.$refs.home_top_flow) + this.$refs.home_top_flow.fun_GetMore() + } }, onLoad(options) { - // if(options.partnerUserId){ - // //需要前往注册了 - // uni.navigateTo({ - // url: '/pages/login/supplier-login' - // }) - // } - // console.log('home created') - //这里进行一次初始化即可 - // this.$http.request('get', '/api/school/area/list', { + this.init() + }, + methods: { + async getCoupon(item) { + this.$message.showLoading() + const { + code, + data + } = await this.$http.request('post', '/api/v2/coupon/app/receive', { + data: { + couponId: item.id, + num: 1 + } + }) + if (code == 0) { + this.$refs.coupon_home.close() - // }).then(res => { - // if (res.code == 0) { - // this.schools = res.data || [] - // } - // }) + this.$message.showToast('领取成功') + } + }, + init_children() { + this.$refs.home_top_flow && this.$refs.home_top_flow.init && this.$refs.home_top_flow.init() + this.$refs.home_category && this.$refs.home_category.init && this.$refs.home_category.init() + this.$refs.home_banner && this.$refs.home_banner.init && this.$refs.home_banner.init() + this.$refs.home_zeros && this.$refs.home_zeros.init && this.$refs.home_zeros.init() + }, + init() { + // if(options.partnerUserId){ + // //需要前往注册了 + // uni.navigateTo({ + // url: '/pages/login/supplier-login' + // }) + // } + // console.log('home created') + //这里进行一次初始化即可 + // this.$http.request('get', '/api/school/area/list', { - // uni.navigateTo({ - // url: '/sub_pages/customer/trade/detail' - // }) + // }).then(res => { + // if (res.code == 0) { + // this.schools = res.data || [] + // } + // }) - //获取banner图 - this.$http.request('get', '/api/pub/banner/list', {}).then(res => { - if (res.code == 0) { - this.banners = [] + // uni.navigateTo({ + // url: '/sub_pages/customer/trade/detail' + // }) - var tarr = res.data || [] - if (tarr.length == 0) { - // tarr.push({ - // url: 'https://hmy-flower.oss-cn-shanghai.aliyuncs.com/62/62ddac6297104e369aba646be704064dbanner@2x.png' - // }) - this.banners = tarr - } else { - var result = [] - for (var item of tarr) { - // http://106.14.123.210/files/group1/e8/e1c17f7229514e5da211d8d47b09906b.jpeg - try { - if (item.url) { - var t = JSON.parse(item.url) - if (Array.isArray(t)) { - // item.url = t[0] || '' - for (var url of t) { + //获取banner图 + this.$http.request('get', '/api/pub/banner/list', {}).then(res => { + if (res.code == 0) { + this.banners = [] + + var tarr = res.data || [] + if (tarr.length == 0) { + // tarr.push({ + // url: 'https://hmy-flower.oss-cn-shanghai.aliyuncs.com/62/62ddac6297104e369aba646be704064dbanner@2x.png' + // }) + this.banners = tarr + } else { + var result = [] + for (var item of tarr) { + // http://106.14.123.210/files/group1/e8/e1c17f7229514e5da211d8d47b09906b.jpeg + try { + if (item.url) { + var t = JSON.parse(item.url) + if (Array.isArray(t)) { + // item.url = t[0] || '' + for (var url of t) { + result.push({ + ...item, + url: url || '' + }) + } + } else { + // item.url = t.url || '' result.push({ ...item, - url: url || '' + url: t.url || '' }) } - } else { - // item.url = t.url || '' - result.push({ - ...item, - url: t.url || '' - }) } + + } catch (e) { + // console.log('error',e) } - - } catch (e) { - // console.log('error',e) } + this.banners = result } - this.banners = result + console.log('this.banners', this.banners) } - console.log('this.banners', this.banners) + }) + + var areaIndex = uni.getStorageSync('areaIndex') + if (!areaIndex && areaIndex !== 0) { + + } else { + this.areaIndex = areaIndex } - }) + //如果已经登录,加载一下默认地址 + let that = this + setTimeout(() => { + if (that.currentInfo.id && !that.address.id) { + that.$http.request('get', '/api/address/default/detail').then(res => { + if (res.data) { + that.$store.commit('setDefaultAddress', { + ...res.data + }) - var areaIndex = uni.getStorageSync('areaIndex') - if (!areaIndex && areaIndex !== 0) { + } + }) + } - } else { - this.areaIndex = areaIndex - } - //如果已经登录,加载一下默认地址 - let that = this - setTimeout(() => { - if (that.currentInfo.id && !that.address.id) { - that.$http.request('get', '/api/address/default/detail').then(res => { - if (res.data) { - that.$store.commit('setDefaultAddress', { - ...res.data - }) + }, 2000) + //公告 + var type = '' + // #ifdef PUB_CUSTOMER + type = 'customer' + // #endif + // #ifdef PUB_SUPPLIER + type = 'supplier' + // #endif + // #ifdef PUB_PARTNER + type = 'partner' + // #endif + this.$http.request('get', '/api/pub/announcement/list/' + type, { + params: { + size: 5, + status: 'A' + } + }).then(res => { + if (res.code === 0) { + // (res.data && res.data.records || []) + this.noticeList = res.data || [] + console.log('this.noticeList', this.noticeList) + if (this.noticeList.length > 0) { + this.currentNotice = this.noticeList[0] + if (this.currentNotice.title && this.currentNotice.title.length >= 30) { + this.scrollable = true + } else { + this.scrollable = false + } + let that = this + if (this.noticeList.length >= 1) { + setInterval(() => { + console.log('interval,1') + that.currentNoticeIndex += 1 + that.currentNoticeIndex %= that.noticeList.length + that.currentNotice = that.noticeList[that.currentNoticeIndex] + that.scrollable = false + that.$nextTick(() => { + if (that.currentNotice.title && that.currentNotice.title + .length >= 30) { + that.scrollable = true + } else { + that.scrollable = false + } + }) + + }, 8000) + } + + } + } + }) + + let tmp = this + var value = this.$storage.getItem('cache_home_show_coupon') + if (!value || true) { + //首页优惠券 + this.$storage.setItem('cache_home_show_coupon', '1') + this.$http.request('get', '/api/v2/coupon/home/alert').then(res => { + if (res.code == 0) { + var list = res.data || [] + var dto = list.length >= 1 ? list[0] : undefined + if (dto) { + // 显示弹窗图片 + this.dto_home_coupon = dto + tmp.$refs.coupon_home.open() + } } }) } + }, - }, 2000) - //公告 - var type = '' - // #ifdef PUB_CUSTOMER - type = 'customer' - // #endif - // #ifdef PUB_SUPPLIER - type = 'supplier' - // #endif - // #ifdef PUB_PARTNER - type = 'partner' - // #endif - - this.$http.request('get', '/api/pub/announcement/list/' + type, { - params: { - size: 5, - status: 'A' - } - }).then(res => { - if (res.code === 0) { - // (res.data && res.data.records || []) - this.noticeList = res.data || [] - console.log('this.noticeList', this.noticeList) - if (this.noticeList.length > 0) { - this.currentNotice = this.noticeList[0] - if (this.currentNotice.title && this.currentNotice.title.length >= 30) { - this.scrollable = true - } else { - this.scrollable = false - } - let that = this - if (this.noticeList.length >= 1) { - setInterval(() => { - console.log('interval,1') - that.currentNoticeIndex += 1 - that.currentNoticeIndex %= that.noticeList.length - that.currentNotice = that.noticeList[that.currentNoticeIndex] - that.scrollable = false - that.$nextTick(() => { - if (that.currentNotice.title && that.currentNotice.title - .length >= 30) { - that.scrollable = true - } else { - that.scrollable = false - } - }) - - }, 8000) - } - - } - } - }) - - - }, - methods: { clickBanner(item) { if (item.id) { uni.navigateTo({ @@ -394,4 +481,8 @@ <style lang="scss" scoped> @import "./home.scss"; + + /* #ifdef PUB_CUSTOMER */ + @import "@/sub_pages/customer/coupon/coupon.scss"; + /* #endif */ </style> \ No newline at end of file -- Gitblit v1.9.3