| | |
| | | <template> |
| | | <view> |
| | | |
| | | <view class="member-center"> |
| | | <image src="../../../static/images/customer/coupon/member/member-level-bg.png" mode="aspectFit" |
| | | class="img100 member-level-image"></image> |
| | | <view class="banner"> |
| | | <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="flex"> |
| | | <view>成长值规则</view> |
| | | <view class="m-l-a m-r-0 text-right desc-gray" @click="goto('/pages/help/content?id=会员协议',false)"> |
| | | 点击查看会员协议 |
| | | </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> |
| | | <view> |
| | | <view class="m-t-12">积分达到 |
| | | {{currentInfo.customerDTO.userGrowthRecord.targetMemberInfos[0].targetStartPoint || '-'}} |
| | | </view> |
| | | <view class="m-t-12">优惠 |
| | | {{currentInfo.customerDTO.userGrowthRecord.targetMemberInfos[0].targetDiscountAmount || '-'}}元/扎 |
| | | </view> |
| | | |
| | | </view> |
| | | </view> |
| | | <view class="info bg-white p20 m-t-20"> |
| | | <view class="text-center desc-gray"> |
| | | ————— 成长值获取规则 ————— |
| | | </view> |
| | | <view class="m-t-12"> |
| | | 每消费1元,即可获得1成长值。 |
| | | 成长值将在订单交易完成后,根据实际交易金额进行赠送。 |
| | | 消费越多,获得的成长值越多,享受更高等级的会员权益。 |
| | | 快来参与消费,累积成长值,解锁更多专属福利吧! |
| | | </view> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | |
| | | </view> |
| | | </template> |
| | | |
| | | <script> |
| | | import banner3d from '@/components/banner3d/banner3d' |
| | | export default { |
| | | data() { |
| | | return { |
| | | |
| | | 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 |
| | | 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 |
| | | } |
| | | } |
| | | }) |
| | | break |
| | | } |
| | | } |
| | | }) |
| | | |
| | | } |
| | | }, |
| | | methods: { |
| | | |
| | | } |
| | | data() { |
| | | return { |
| | | init: false, |
| | | bannerList: [{ |
| | | bg: 'https://hmy-flower.oss-cn-shanghai.aliyuncs.com/74/74cae150ea44463f92abbe1f9dd3c561fKcsrp0hOcNYa1cfb5eb753e56876fddcba7ea1e1a32.png', |
| | | picture: 'https://hmy-flower.oss-cn-shanghai.aliyuncs.com/ef/ef96604518db467fbd344c08e48d1fac8jZdk1ED0Yq023d4f86c2ec36975c981ba522c2bfe3f.png', |
| | | title: '普通会员', |
| | | // description: '一万年太久,就现在,给你爱', |
| | | path: '', |
| | | point: undefined, |
| | | }, { |
| | | 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: '', |
| | | // 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: '' |
| | | }, { |
| | | 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: '' |
| | | }], |
| | | swiperConfig: { |
| | | indicatorDots: true, |
| | | indicatorColor: 'rgba(255, 255, 255, .4)', |
| | | indicatorActiveColor: 'rgba(255, 255, 255, 1)', |
| | | autoplay: false, |
| | | interval: 3000, |
| | | duration: 300, |
| | | circular: true, |
| | | previousMargin: '58rpx', |
| | | nextMargin: '58rpx' |
| | | } |
| | | } |
| | | }, |
| | | components: { |
| | | banner3d |
| | | }, |
| | | |
| | | } |
| | | </script> |
| | | |
| | | <style> |
| | | <style lang="scss" scoped> |
| | | .member-center { |
| | | position: relative; |
| | | |
| | | </style> |
| | | .banner { |
| | | position: relative; |
| | | z-index: 10; |
| | | padding-top: 160rpx; |
| | | } |
| | | |
| | | .member-level-image { |
| | | width: 750rpx; |
| | | min-height: 530rpx; |
| | | position: absolute; |
| | | left: 0; |
| | | right: 0; |
| | | top: 0; |
| | | z-index: 1; |
| | | } |
| | | } |
| | | </style> |