From 23eb4337693b4e9021bcda55844dc92e6a4004b8 Mon Sep 17 00:00:00 2001
From: xuxueyang <xuxy@fengyuntec.com>
Date: 星期四, 12 九月 2024 11:17:14 +0800
Subject: [PATCH] update 会员积分相关的优化
---
sub_pages/customer/self/member-center.vue | 300 ++++++++++++++++++++++++++++++++++++++++++++---------------
1 files changed, 221 insertions(+), 79 deletions(-)
diff --git a/sub_pages/customer/self/member-center.vue b/sub_pages/customer/self/member-center.vue
index 6d5edd4..1697959 100644
--- a/sub_pages/customer/self/member-center.vue
+++ b/sub_pages/customer/self/member-center.vue
@@ -6,7 +6,7 @@
<banner3d ref="banner3d" v-if="init" :banner-list="bannerList" :swiper-config="swiperConfig"></banner3d>
</view>
<view class="p20" style="padding-top: 0rpx;">
- <view class="info bg-white p20">
+ <!-- <view class="info bg-white p20">
<view class="flex">
<view>成长值规则</view>
<view class="m-l-a m-r-0 text-right desc-gray" @click="goto('/pages/help/content?id=会员协议',false)">
@@ -14,33 +14,67 @@
</view>
</view>
- </view>
- <view class="info bg-white p20 m-t-20"
- v-if="currentInfo.customerDTO&¤tInfo.customerDTO.userGrowthRecord
- &¤tInfo.customerDTO.userGrowthRecord.targetMemberInfos&¤tInfo.customerDTO.userGrowthRecord.targetMemberInfos.length>=1">
- <view class="text-center desc-gray">
- ———————— 会员权益 ————————
+ </view> -->
+ <!-- v-if="currentInfo.customerDTO&¤tInfo.customerDTO.userGrowthRecord
+ &¤tInfo.customerDTO.userGrowthRecord.targetMemberInfos&¤tInfo.customerDTO.userGrowthRecord.targetMemberInfos.length>=1"
+ -->
+ <view class="member-infos info bg-white p20 ">
+ <view class="text-center w-fit flex m-auto top-title ">
+ <view class="left-line"></view>
+ <view class="title">会员权益</view>
+ <view class="right-line"></view>
</view>
- <view>
- <view class="m-t-12">积分达到
- {{currentInfo.customerDTO.userGrowthRecord.targetMemberInfos[0].targetStartPoint || '-'}}
+ <view class="desc-info flex m-t-12" style="padding: 42rpx;">
+ <view class="m-t-12 flex1">
+ <image class="m-auto icon img100 " mode="scaleToFill"
+ src="../../../static/images/customer/coupon/member/icon-member-info-1.png"></image>
+ <view class="desc">
+ 积分达到{{currentInfo.customerDTO.userGrowthRecord.currentGrowthValue || '-'}}
+ </view>
</view>
- <view class="m-t-12">优惠
- {{currentInfo.customerDTO.userGrowthRecord.targetMemberInfos[0].targetDiscountAmount || '-'}}元/扎
+ <view class="m-t-12 flex1">
+ <image class="m-auto icon img100" mode="scaleToFill"
+ src="../../../static/images/customer/coupon/member/icon-member-info-2.png"></image>
+
+ <view class="desc">
+ 优惠
+ <span v-if="currentInfo.customerDTO.userGrowthRecord.currentDiscountType=='ratio'">
+ {{(currentInfo.customerDTO.userGrowthRecord.currentDiscountRatio) || '-'}}%/扎
+ </span>
+ <span v-else>
+ {{currentInfo.customerDTO.userGrowthRecord.currentDiscountAmount || '-'}}元/扎
+ </span>
+ <!-- serGrowthRecord: {currentMemberLevel: "银卡会员", currentGrowthValue: 4941, currentDiscountType:
+ "ratio",…}
+ currentDiscountAmount: 0
+ currentDiscountRatio: 5
+ currentDiscountType: "ratio"
+ currentDiscountTypeStr: "百分比"
+ currentGrowthValue: 4941
+ currentMemberLevel: "银卡会员" -->
+
+ <!-- {{currentInfo.customerDTO.userGrowthRecord.targetMemberInfos[0].targetDiscountAmount || '-'}}元/扎 -->
+
+ </view>
</view>
</view>
- </view>
- <view class="info bg-white p20 m-t-20">
- <view class="text-center desc-gray">
- ————— 成长值获取规则 —————
+ <!-- </view>
+ <view class="info bg-white p20 m-t-20 member-infos"> -->
+ <view class="text-center w-fit flex m-auto top-title m-t-20">
+ <view class="left-line"></view>
+ <view class="title">成长值获取规则</view>
+ <view class="right-line"></view>
</view>
- <view class="m-t-12">
+ <view class="m-t-12 desc-info">
每消费1元，即可获得1成长值。
成长值将在订单交易完成后，根据实际交易金额进行赠送。
消费越多，获得的成长值越多，享受更高等级的会员权益。
快来参与消费，累积成长值，解锁更多专属福利吧！
</view>
+ </view>
+ <view class="protocol" @click="goto('/pages/help/content?id=会员协议',false)">会员协议 <uni-icons type="right"
+ size="16" color="#AD790F"></uni-icons>
</view>
</view>
</view>
@@ -51,75 +85,102 @@
<script>
import banner3d from '@/components/banner3d/banner3d'
export default {
+ async onPullDownRefresh() {
+ await this.$store.dispatch('getCurrentInfo')
+ uni.stopPullDownRefresh()
+ },
methods: {
},
- onLoad() {
- if (this.currentInfo.customerDTO && this.currentInfo.customerDTO.userGrowthRecord && this.currentInfo
- .customerDTO.userGrowthRecord.currentMemberLevel) {
- // userGrowthRecord: {currentMemberLevel: "普通会员", currentGrowthValue: 6919,…}
- // currentGrowthValue: 6919
- // currentMemberLevel: "普通会员"
- // targetMemberInfos: [{targetMemberLevel: "金卡会员", targetStartPoint: 15001, targetGap: 8082, targetDiscountAmount: 0.4},…]
- // 0: {targetMemberLevel: "金卡会员", targetStartPoint: 15001, targetGap: 8082, targetDiscountAmount: 0.4}
- // targetDiscountAmount: 0.4
- // targetGap: 8082
- // targetMemberLevel: "金卡会员"
- // targetStartPoint: 15001
- // 1: {targetMemberLevel: "钻石会员", targetStartPoint: 10001, targetGap: 3082, targetDiscountAmount: 0.5}
- // targetDiscountAmount: 0.5
- // targetGap: 3082
- // targetMemberLevel: "钻石会员"
- // targetStartPoint: 10001
- //计算下一个等级的差距
- let name = this.currentInfo.customerDTO.userGrowthRecord.currentMemberLevel
-
- for (var tmp of this.bannerList) {
- tmp.point = {
- current: this.currentInfo.customerDTO.userGrowthRecord.currentGrowthValue || 0
- }
- tmp.currentMsg = ''
- if (tmp.title === name) {
- //说明是当前等级，其他待定
- tmp.currentMsg = '当前等级'
- }
- }
- if (this.currentInfo.customerDTO.userGrowthRecord.targetMemberInfos) {
- var t = -1
+ async onLoad() {
+ await this.$store.dispatch('getCurrentInfo')
+ this.$nextTick(() => {
+ if (this.currentInfo.customerDTO && this.currentInfo.customerDTO.userGrowthRecord && this
+ .currentInfo
+ .customerDTO.userGrowthRecord.currentMemberLevel) {
+ // userGrowthRecord: {currentMemberLevel: "普通会员", currentGrowthValue: 6919,…}
+ // currentGrowthValue: 6919
+ // currentMemberLevel: "普通会员"
+ // targetMemberInfos: [{targetMemberLevel: "金卡会员", targetStartPoint: 15001, targetGap: 8082, targetDiscountAmount: 0.4},…]
+ // 0: {targetMemberLevel: "金卡会员", targetStartPoint: 15001, targetGap: 8082, targetDiscountAmount: 0.4}
+ // targetDiscountAmount: 0.4
+ // targetGap: 8082
+ // targetMemberLevel: "金卡会员"
+ // targetStartPoint: 15001
+ // 1: {targetMemberLevel: "钻石会员", targetStartPoint: 10001, targetGap: 3082, targetDiscountAmount: 0.5}
+ // targetDiscountAmount: 0.5
+ // targetGap: 3082
+ // targetMemberLevel: "钻石会员"
+ // targetStartPoint: 10001
+ //计算下一个等级的差距
+ let name = this.currentInfo.customerDTO.userGrowthRecord.currentMemberLevel
+ var currentindex = -1
+ var j = -1
for (var tmp of this.bannerList) {
- t += 1
- for (var k of this.currentInfo.customerDTO.userGrowthRecord.targetMemberInfos) {
- if (tmp.title === k.targetMemberLevel) {
- console.log('eq', k, tmp)
- tmp.point = {
- current: this.currentInfo.customerDTO.userGrowthRecord.currentGrowthValue || 0,
- end: k.targetStartPoint || 0,
+ j += 1
+ tmp.point = {
+ current: this.currentInfo.customerDTO.userGrowthRecord.currentGrowthValue || 0
+ }
+ tmp.currentMsg = ''
+ if (tmp.title === name) {
+ //说明是当前等级，其他待定
+ tmp.currentMsg = '当前等级'
+ currentindex = j
+ }
+
+
+
+ }
+ //重新排序,当前等级第一个
+ var newBannerSort = []
+ for (var i = currentindex; i < 2 * j; i++) {
+ newBannerSort.push(this.bannerList[i % (j + 1)])
+ if (newBannerSort.length >= this.bannerList.length) {
+ break
+ }
+ }
+ this.bannerList = newBannerSort
+
+ if (this.currentInfo.customerDTO.userGrowthRecord.targetMemberInfos) {
+ var t = -1
+ for (var tmp of this.bannerList) {
+ t += 1
+ for (var k of this.currentInfo.customerDTO.userGrowthRecord.targetMemberInfos) {
+ if (tmp.title === k.targetMemberLevel) {
+ console.log('eq', k, tmp)
+ tmp.point = {
+ current: this.currentInfo.customerDTO.userGrowthRecord
+ .currentGrowthValue || 0,
+ end: k.targetStartPoint || 0,
+ }
}
}
}
}
+
+ this.init = true
+ // this.$nextTick(() => {
+ // // var name = this.currentInfo.customerDTO.userGrowthRecord.currentMemberLevel
+ // var index = -1
+ // for (var tmp of this.bannerList) {
+ // index += 1
+ // if (tmp.title === name) {
+ // // this.$refs.banner3d.swiperChange({
+ // // mp: {
+ // // detail: {
+ // // current: index
+ // // }
+ // // }
+ // // })
+ // this.$refs.banner3d.swiperChangeIndex(index)
+
+ // break
+ // }
+ // }
+ // })
+
}
-
- this.init = true
- this.$nextTick(() => {
- // var name = this.currentInfo.customerDTO.userGrowthRecord.currentMemberLevel
- var index = -1
- for (var tmp of this.bannerList) {
- index += 1
- if (tmp.title === name) {
- this.$refs.banner3d.swiperChange({
- mp: {
- detail: {
- current: index
- }
- }
- })
- break
- }
- }
- })
-
- }
+ })
},
data() {
return {
@@ -131,25 +192,29 @@
// description: '一万年太久，就现在，给你爱',
path: '',
point: undefined,
+ key: '1',
}, {
bg: 'https://hmy-flower.oss-cn-shanghai.aliyuncs.com/25/2534864ad275400b9e8db4042b87bfeaBv7NbzOZG0ptc7fca5df83dcd97fd02b4027518cc593.png',
picture: 'https://hmy-flower.oss-cn-shanghai.aliyuncs.com/07/075db9222f7a41e981c5b263d7210ed5Ztljs5yDHKILd37c3399011f84f401b755477bb8a323.png',
title: '银卡会员',
// description: '花中樱，鱼乃鲷花中樱，鱼乃鲷',
path: '',
+ key: '2',
// currentMsg:''
}, {
bg: 'https://hmy-flower.oss-cn-shanghai.aliyuncs.com/4d/4d8ab63e75ca462fa9e3bb480ff2da68ID5KnLIH9DwM23f9a04d99cc1f3306a8655c1eff34bf.png',
picture: 'https://hmy-flower.oss-cn-shanghai.aliyuncs.com/f1/f192b651606045ddba5c5f04a34a00c2R8MmH6mVsprH81cab47fbe889222f6088f4ca2cf20d5.png',
title: '金卡会员',
// description: '取材自湘西苗族传统的烟熏文化',
- path: ''
+ path: '',
+ key: '3',
}, {
bg: 'https://hmy-flower.oss-cn-shanghai.aliyuncs.com/db/db6b0cefdbb949cca9c8da824a5ebdebXsPsk2ROfxZu22f9b09e3feece76753b0df971fdc301.png',
picture: 'https://hmy-flower.oss-cn-shanghai.aliyuncs.com/c9/c94d8f444af94b899d1e1593cebb933eDyZyhyoyDxTRaf60a4d692f097e5d790cdb88fae9d0c.png',
title: '钻石会员',
// description: '在自己的小世界里，日日好日，夜夜好清宵',
- path: ''
+ path: '',
+ key: '4',
}],
swiperConfig: {
indicatorDots: true,
@@ -175,6 +240,83 @@
.member-center {
position: relative;
+ .member-infos {
+ // width: 670rpx;
+ padding: 32rpx 58rpx;
+ background: linear-gradient(213deg, #F7ECC6 0%, #EEE5CE 100%);
+ border-radius: 16rpx;
+
+ .desc-info {
+ background: #FFFFFF;
+ border-radius: 16rpx;
+ opacity: 0.55;
+ font-size: 24rpx;
+ color: #AD790F;
+ line-height: 34rpx;
+ text-align: left;
+ font-style: normal;
+ padding: 24rpx;
+
+ .icon {
+ width: 78rpx;
+ height: 78rpx;
+ margin: auto;
+ display: block;
+ margin-bottom: 10rpx;
+
+ }
+
+ .desc {
+ text-align: center;
+
+ }
+ }
+
+ .top-title {
+ .left-line {
+ min-width: 54rpx;
+ height: 6rpx;
+ background: linear-gradient(270deg, rgba(226, 157, 17, 0) 0%, #E39D10 100%);
+ border-radius: 4rpx;
+ display: inline-block;
+ margin-right: 20rpx;
+ vertical-align: middle;
+ margin-top: 23rpx;
+ }
+
+ .right-line {
+ min-width: 54rpx;
+ height: 6rpx;
+ background: linear-gradient(270deg, rgba(226, 157, 17, 0) 0%, #E39D10 100%);
+ border-radius: 4rpx;
+ margin-left: 20rpx;
+ display: inline-block;
+ vertical-align: middle;
+ margin-top: 23rpx;
+
+
+ }
+
+ .title {
+ font-weight: 600;
+ font-size: 36rpx;
+ color: #AD790F;
+ line-height: 50rpx;
+ text-align: left;
+ font-style: normal;
+ }
+ }
+ }
+
+ .protocol {
+ font-weight: 400;
+ font-size: 24rpx;
+ color: #AD790F;
+ line-height: 34rpx;
+ text-align: center;
+ margin-top: 32rpx;
+ }
+
.banner {
position: relative;
z-index: 10;
--
Gitblit v1.9.3