From ef240131386f3f37cd3d0b232b4d237fb73d1132 Mon Sep 17 00:00:00 2001 From: 陶杰 <1378534974@qq.com> Date: 星期三, 16 十月 2024 23:59:09 +0800 Subject: [PATCH] 1.部分图片替换 --- sub_pages/customer/coupon/good-all.vue | 101 ++++++++++++++++++++++++++++++++++++++++---------- 1 files changed, 80 insertions(+), 21 deletions(-) diff --git a/sub_pages/customer/coupon/good-all.vue b/sub_pages/customer/coupon/good-all.vue index 1e4a572..52a07fd 100644 --- a/sub_pages/customer/coupon/good-all.vue +++ b/sub_pages/customer/coupon/good-all.vue @@ -1,30 +1,35 @@ <template> <view class="good-list-container"> <view class="top-bg img100 relative" :style="{'padding-top':(StatusBar)+'px','line-height':CustomBar+'rpx' }"> - <image class="component-bg" src="../../../static/images/customer/coupon/good-top-bg.png" + <!-- ../../../static/images/customer/coupon/good-top-bg.png --> + <image class="component-bg" + src="https://hmy-flower.oss-cn-shanghai.aliyuncs.com/a9/a9731b0037924324a3d3318dfa7d10c5LZk6JsSC33ua754767bf8c714154f06bbd5b4d905174.png" mode="scaleToFill" /> <view class="title"> - <uni-icons class="icon" type="left" size="24" @click="backpage"></uni-icons> + <uni-icons class="icon" type="left" size="24" @click="backpage()"></uni-icons> 积分兑换 </view> <view class="flex point-info"> <view class="point-record m-r-a"> <view class="text-center title">我的积分</view> - <view class="flex"> - <image src="../../../static/images/customer/coupon/icon-point.png" class="point-icon"> + <view class="flex" @click="goto('/sub_pages/customer/coupon/point-history',true)"> + <image src="https://hmy-flower.oss-cn-shanghai.aliyuncs.com/82/82d4e36b7d124dab843427c36454da93icon-point.png" class="point-icon"> </image> - {{currentInfo.currentPoint || 0}} + {{self_point}} <uni-icons class="icon" type="right" size="32"></uni-icons> </view> </view> - <view class="m-l-a m-r-0 rule"> + <view class="m-l-a m-r-0 rule" @click="goto('/pages/help/content?id=积分规则',false)"> <view class="flex w-fit m-l-a m-r-15"> <view class="m-r-10">规则</view> - <image src="../../../static/images/customer/coupon/icon-rule.png" class="rule-icon"> + <image src="https://hmy-flower.oss-cn-shanghai.aliyuncs.com/da/da4bfa0af86345a9ab3ce383b7fac830icon-rule.png" class="rule-icon"> </image> </view> - <image class="good-point-icon" src="../../../static/images/customer/coupon/good-point-icon.png" + <!-- src="../../../static/images/customer/coupon/good-point-icon.png" --> + <image class="good-point-icon" + src="https://hmy-flower.oss-cn-shanghai.aliyuncs.com/db/db114326a52e4f6d92f1d6769748e8e6yHXbwXV7T1A38e325506998c85122d1e6a0a1328f7b0.png" + mode="scaleToFill" /> </view> </view> @@ -46,15 +51,19 @@ <view class="good-container p15 flex"> <view v-for="(item,index) of list" :key="index" class="good-item" @click="toDetail(item)"> - <image class="cover" :src="item.cover" :lazy-load="true" mode="scaleToFill"> + <image class="cover" :src="item.cover" :lazy-load="true" mode="scaleToFill" + :class="[item.stock===0?'component-stock-zero':'']"> </image> <view class="title"> {{item.name}} </view> <view class="flex score-info"> - <view><span class="score">{{item.point||'-'}}</span>积分</view> - <view class="button m-l-a m-r-0" @click.stop="exchange('good',item)">兑换</view> + <view> + <view><span class="score">{{item.point||'-'}}</span> 积分</view> + <view class="desc-gray">库存:<span class="">{{item.stock||'0'}}</span></view> + </view> + <view class="button m-l-a m-r-0 m-t-20" @click.stop="exchange('good',item)">兑换</view> </view> </view> </view> @@ -76,14 +85,18 @@ {{item.couponName||'-'}} </view> <view class="time"> - 领取后{{item.usageTimeNum||''}}{{item.usageTimeTypeName||''}}有效 + {{item.getStartDate||'领取后'}}{{item.getEndDate&&(' 至 ' + item.getEndDate )||''}}有效 </view> <view class="flex"> <view class="t-red"> {{item.point||'0'}}积分 </view> - <view class="button m-l-a m-r-0" @click="exchange('coupon',item)"> - 兑换 + <view class="m-l-10 desc-gray"> + 库存:{{item.couponAmount||'0'}} + </view> + <view class="button m-l-a m-r-15" :class="[item.couponAmount===0?'over':'']" + @click="exchange('coupon',item)"> + {{item.couponAmount===0?'已售磬':'兑换'}} </view> </view> </view> @@ -97,13 +110,32 @@ <script> export default { + computed: { + + self_point() { + if (this.currentInfo.currentPoint) { + if (this.currentInfo.currentPoint >= 10000) { + return (this.currentInfo.currentPoint / 10000 + '万') + } else { + return this.currentInfo.currentPoint + } + } + + return 0 + } + }, methods: { changeTab(flg) { this.flg = '' + flg this.listApi = this.tabs[flg].api + this.list = [] this.refreshList() }, async exchange(type, item) { + if (item.stock === 0 || item.couponAmount === 0) { + this.$message.showToast('库存为0,无法兑换') + return + } var api = '' if (type == 'good') { api = '/api/customer/point/goods/exchange' @@ -120,12 +152,22 @@ data: { couponId: item.id, goodsId: item.id, //兼容2个 - num:1 + num: 1 } }) this.$message.hideLoading() if (code == 0) { - this.$message.showToast('兑换成功') + //刷新积分 + this.$store.dispatch('getCurrentInfo'); + await this.$message.showToast('兑换成功') + if (type == 'good') { + item.stock -= 1 + this.$forceUpdate() + } + if (type == 'coupon') { + item.couponAmount -= 1 + this.$forceUpdate() + } } }, toDetail(item) { @@ -133,7 +175,7 @@ url: '/sub_pages/customer/coupon/good-detail?id=' + item.id }) }, - changeScore(item){ + changeScore(item) { this.query.pointLower = item.min || 0 this.query.pointUpper = item.max || 990000 this.refreshList() @@ -152,7 +194,8 @@ }, { name: '优惠券', - api: '/api/v2/coupon/app/activy/list', + // api: '/api/v2/coupon/app/activy/list', + api: '/api/v2/coupon/point/active/list', }, ], @@ -185,6 +228,14 @@ }, onLoad() { this.listApi = '/api/customer/point/goods/list' + this.getList() + }, + async onPullDownRefresh() { + //刷新积分和刷新商品 + this.$store.dispatch('getCurrentInfo'); + // this.list = [] + await this.refreshList() + uni.stopPullDownRefresh() }, onReachBottom() { @@ -194,6 +245,8 @@ </script> <style lang="scss" scoped> + @import './coupon.scss'; + .good-list-container { .good-container { .good-item { @@ -209,7 +262,7 @@ } .title { - padding:18rpx 18rpx 0rpx 18rpx; + padding: 18rpx 18rpx 0rpx 18rpx; font-weight: 600; font-size: 32rpx; color: #000000; @@ -223,7 +276,7 @@ font-weight: 400; font-size: 24rpx; color: #44775A; - padding:18rpx; + padding: 18rpx; padding-bottom: 28rpx; .score { @@ -244,6 +297,11 @@ text-align: center; line-height: 46rpx; } + + .button.over { + color: #747374; + border: 2rpx solid #747374; + } } .good-item:nth-child(2n+1) { @@ -259,6 +317,7 @@ .query-scores { overflow-x: scroll; + // width: max-content; .item { min-width: fit-content; @@ -272,7 +331,7 @@ height: 50rpx; border-radius: 26rpx; // width: fit-content; - + } .item.active { -- Gitblit v1.9.3