增加积分商城分享

This commit is contained in:
2026-01-21 16:42:18 +08:00
parent 8f1b21bf00
commit 20a54c3bd9
5 changed files with 209 additions and 134 deletions

View File

@@ -20,6 +20,12 @@ export const pointGoodsPage = (data) => {
data: data data: data
}) })
} }
export const pointsGoods = (data) => {
return request({
url: url + '/user/pointGoods/'+data.id,
method: 'get',
})
}
export const exchange = (data) => { export const exchange = (data) => {

View File

@@ -8,7 +8,7 @@
</template> </template>
<template v-else> <template v-else>
<view @click="prveImg(item.goodsImageUrl)"> <view @click="prveImg(item.goodsImageUrl)">
<image class="top-img" :src="item.goodsImageUrl" mode="aspectFill" ></image> <image class="top-img" :src="item.goodsImageUrl" mode="aspectFill"></image>
</view> </view>
</template> </template>
<view class="sku"> <view class="sku">
@@ -55,10 +55,10 @@
<view style="height: 140px"></view> <view style="height: 140px"></view>
<view class="fixed-bottom u-flex u-row-center"> <view class="fixed-bottom u-flex u-row-center">
<view v-if="isCanExchange" class="btn" @click="exchangeClick" > <view v-if="isCanExchange" class="btn" @click="exchangeClick">
{{returnBtmText}} {{returnBtmText}}
</view> </view>
<view class="btn gray" v-else > <view class="btn gray" v-else>
{{returnBtmText}} {{returnBtmText}}
</view> </view>
</view> </view>
@@ -84,7 +84,7 @@
</view> </view>
<view class="goods-info"> <view class="goods-info">
<view class="u-flex"> <view class="u-flex">
<image class="cover" v-if="item.goodsCategory!='优惠券'" :src="item.goodsImageUrl"></image> <image class="cover" v-if="item.goodsCategory!='优惠券'" :src="item.goodsImageUrl"></image>
<view v-else class="cover bg-fff"> <view v-else class="cover bg-fff">
<couponIcon :item="item.couponInfo" typeKey="couponType" /> <couponIcon :item="item.couponInfo" typeKey="couponType" />
@@ -125,6 +125,11 @@
} from '@/utils/uniapp.js' } from '@/utils/uniapp.js'
import modal from "@/scoreShop/components/modal.vue"; import modal from "@/scoreShop/components/modal.vue";
import * as pointGoodsApi from "@/common/api/order/pointGoods.js"; import * as pointGoodsApi from "@/common/api/order/pointGoods.js";
import {
userPoints
} from "@/common/api/market/points.js";
import couponIcon from "@/components/coupon-icon/index"; import couponIcon from "@/components/coupon-icon/index";
import { import {
pay pay
@@ -135,10 +140,10 @@
const modalData = reactive({ const modalData = reactive({
show: false, show: false,
}); });
function prveImg(url){ function prveImg(url) {
uni.previewImage({ uni.previewImage({
urls:[url] urls: [url]
}) })
} }
@@ -304,16 +309,63 @@
return `单人兑换已达上限` return `单人兑换已达上限`
} }
}) })
onLoad((opt) => { async function getGoods() {
const exchange_goods = uni.getStorageSync('exchange_goods') const res = await pointGoodsApi.pointsGoods({
if (exchange_goods.goodsDescription) { id: options.id
exchange_goods.goodsDescription = JSON.parse(exchange_goods.goodsDescription) })
if (res.goodsDescription) {
res.goodsDescription = JSON.parse(res.goodsDescription)
} else { } else {
exchange_goods.goodsDescription = [] res.goodsDescription = []
} }
const pointsUserData = uni.getStorageSync('pointsUser') res.couponInfo=res.couponInfo||{}
Object.assign(item, exchange_goods)
Object.assign(pointsUser, pointsUserData) Object.assign(item, res)
}
async function getPointUser() {
const res = await userPoints({
shopUserId: uni.cache.get('shopUserInfo').id || ''
})
Object.assign(pointsUser, res.pointsUser)
}
async function init() {
await getGoods()
await getPointUser()
}
import {
shareMixin,
handleMixinOnLoad,wxShare,returnQuery
} from '@/utils/share.js'
// defineOptions({
// mixins: [shareMixin],
// });
onShareAppMessage(async(res)=>{
const query=await returnQuery()
return wxShare({
...res,
title:item.goodsName,
path:'/scoreShop/detail/index'+'?'+query,
query,
imageUrl:item.goodsImageUrl||''
})
})
const options = reactive({})
onLoad(async (opt) => {
Object.assign(options, opt)
await handleMixinOnLoad(opt)
await init()
// const exchange_goods = uni.getStorageSync('exchange_goods')
// if (exchange_goods.goodsDescription) {
// exchange_goods.goodsDescription = JSON.parse(exchange_goods.goodsDescription)
// } else {
// exchange_goods.goodsDescription = []
// }
// const pointsUserData = uni.getStorageSync('pointsUser')
// Object.assign(item, exchange_goods)
// Object.assign(pointsUser, pointsUserData)
}) })
</script> </script>
@@ -463,11 +515,12 @@
height: 184rpx; height: 184rpx;
border-radius: 16rpx; border-radius: 16rpx;
background: #d9d9d9; background: #d9d9d9;
&.bg-fff{
&.bg-fff {
background-color: #fff; background-color: #fff;
} }
} }
} }
.bottom { .bottom {
@@ -487,7 +540,8 @@
font-size: 700; font-size: 700;
} }
} }
.w-full{
.w-full {
width: 100%; width: 100%;
} }
</style> </style>

View File

@@ -74,7 +74,7 @@
function toDetail(item) { function toDetail(item) {
uni.setStorageSync('exchange_goods', item) uni.setStorageSync('exchange_goods', item)
uni.navigateTo({ uni.navigateTo({
url: '/scoreShop/detail/index?id=' + item.id, url: '/scoreShop/detail/index?id=' + item.id+'&shopId='+item.shopId,
}) })
} }

View File

@@ -72,9 +72,18 @@
} }
function back() { function back() {
uni.navigateBack({ const pages = getCurrentPages();
delta: 1, if(pages.length<2){
}); uni.switchTab({
url: '/pages/index/index'
})
}else{
uni.navigateBack({
delta: 1,
});
}
} }
// function exchange(item) { // function exchange(item) {

View File

@@ -1,124 +1,130 @@
<template> <template>
<view class="min-page bg-f7 u-font-28 color-333"> <view class="min-page bg-f7 u-font-28 color-333">
<up-navbar <up-navbar title="兑换成功" bgColor="transparent" leftIconColor="#333" @leftClick="back()"
title="兑换成功" titleStyle="color:#333"></up-navbar>
bgColor="transparent" <view class="content">
leftIconColor="#333" <view class="bg" :style="{ backgroundImage: `url(${imgs.bg})` }">
@leftClick="back()" <image :src="imgs.success" class="success"></image>
titleStyle="color:#333" <view class="u-font-40 font-700">兑换成功</view>
></up-navbar> <view class="u-font-32 font-700">{{item.pointsGoodsName}}</view>
<view class="content"> <view class="u-m-t-14" v-if="item.goodsCategory!='优惠券'">需前往店铺自行兑换领取</view>
<view class="bg" :style="{ backgroundImage: `url(${imgs.bg})` }"> <view class="u-m-t-14" v-else>优惠券直接到账您的账户中</view>
<image :src="imgs.success" class="success"></image> </view>
<view class="u-font-40 font-700">兑换成功</view> <view class="info u-flex u-flex-col">
<view class="u-font-32 font-700">{{item.pointsGoodsName}}</view> <view class="u-p-22">
<view class="u-m-t-14" v-if="item.goodsCategory!='优惠券'">需前往店铺自行兑换领取</view> <text class="color-666">兑换商品</text>
<view class="u-m-t-14" v-else>优惠券直接到账您的账户中</view> <text>{{item.pointsGoodsName}}</text>
</view> </view>
<view class="info u-flex u-flex-col"> <view class="u-p-22">
<view class="u-p-22"> <text class="color-666">兑换数量</text>
<text class="color-666">兑换商品</text> <text>{{item.number}}</text>
<text>{{item.pointsGoodsName}}</text> </view>
</view> <view class="u-p-22">
<view class="u-p-22"> <text class="color-666">消耗积分</text>
<text class="color-666">兑换数量</text> <text>{{item.spendPoints}}</text>
<text>{{item.number}}</text> </view>
</view> <view class="u-p-22" v-if="item.extraPaymentAmount">
<view class="u-p-22"> <text class="color-666">支付金额</text>
<text class="color-666">消耗积分</text> <text>{{item.extraPaymentAmount}}</text>
<text>{{item.spendPoints}}</text> </view>
</view> <view class="u-p-22">
<view class="u-p-22" v-if="item.extraPaymentAmount"> <text class="color-666">下单时间</text>
<text class="color-666">支付金额</text> <text>{{item.createTime}}</text>
<text>{{item.extraPaymentAmount}}</text> </view>
<view class="u-p-22">
<text class="color-666">订单号</text>
<text>{{item.orderNo}}</text>
</view>
</view>
<view class="u-flex bottom u-row-center">
<view class="back btn" @click="back">继续兑换</view>
<view class="look btn" @click="lookOrder">查看订单</view>
</view>
</view> </view>
<view class="u-p-22"> </view>
<text class="color-666">下单时间</text>
<text>{{item.createTime}}</text>
</view>
<view class="u-p-22">
<text class="color-666">订单号</text>
<text>{{item.orderNo}}</text>
</view>
</view>
<view class="u-flex bottom u-row-center">
<view class="back btn" @click="back">继续兑换</view>
<view class="look btn" @click="lookOrder">查看订单</view>
</view>
</view>
</view>
</template> </template>
<script setup> <script setup>
const imgs = {
bg: "https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/2/b625560a5b75418c9e643841f8674a0c.png",
success: "https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/2/c2f0865efb444de58ff0d8bb3a51d300.png",
};
function back() {
const pages = getCurrentPages();
if(pages.length<2){
uni.redirectTo({
url: '/scoreShop/index/index?shopId=' + item.shopId
})
}else{
uni.navigateBack();
}
}
const imgs = { function lookOrder() {
bg: "https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/2/b625560a5b75418c9e643841f8674a0c.png", uni.redirectTo({
success: url: '/scoreShop/order/index?shopId=' + item.shopId
"https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/2/c2f0865efb444de58ff0d8bb3a51d300.png", })
}; }
function back() { const item = reactive({
uni.navigateBack();
} })
function lookOrder() { onLoad(opt => {
uni.redirectTo({ const exchange_goods_success_data = uni.getStorageSync('exchange_goods_success')
url:'/scoreShop/order/index?shopId='+item.shopId Object.assign(item, exchange_goods_success_data)
})
} })
const item=reactive({
})
onLoad(opt=>{
const exchange_goods_success_data=uni.getStorageSync('exchange_goods_success')
Object.assign(item,exchange_goods_success_data)
})
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.content { .content {
background: linear-gradient(180deg, #f5cd82 0%, rgba(247, 219, 165, 0) 100%); background: linear-gradient(180deg, #f5cd82 0%, rgba(247, 219, 165, 0) 100%);
height: 670rpx; height: 670rpx;
$color: #9c571f; $color: #9c571f;
.bg {
width: 100%;
height: 586rpx;
background-size: cover;
display: flex;
flex-direction: column;
justify-content: flex-end;
align-items: center;
padding-bottom: 26rpx;
color: $color;
.success { .bg {
width: 310rpx; width: 100%;
height: 206rpx; height: 586rpx;
} background-size: cover;
} display: flex;
.info { flex-direction: column;
padding-left: 174rpx; justify-content: flex-end;
padding-right: 32rpx; align-items: center;
} padding-bottom: 26rpx;
} color: $color;
.bottom {
gap: 48rpx;
margin-top: 44rpx;
.btn { .success {
padding: 14rpx 76rpx; width: 310rpx;
border-radius: 100rpx; height: 206rpx;
font-size: 32rpx; }
border: 1px solid transparent; }
&.back {
border-color: $my-main-color; .info {
color: $my-main-color; padding-left: 174rpx;
} padding-right: 32rpx;
&.look { }
background-color: $my-main-color; }
border-color: $my-main-color;
color: #fff; .bottom {
} gap: 48rpx;
} margin-top: 44rpx;
}
</style> .btn {
padding: 14rpx 76rpx;
border-radius: 100rpx;
font-size: 32rpx;
border: 1px solid transparent;
&.back {
border-color: $my-main-color;
color: $my-main-color;
}
&.look {
background-color: $my-main-color;
border-color: $my-main-color;
color: #fff;
}
}
}
</style>