czg_team/cashier_wx
7
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

积分商城功能完善

Browse Source
This commit is contained in:
YeMingfei666
2025-12-10 19:33:29 +08:00
parent 6b53d30f69
commit 87f2ee8c3d
12 changed files with 1268 additions and 589 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
common/api/order/pointGoods.js
View File

@@ -13,7 +13,6 @@ platformType = 'alipay'
payType='aliPay' payType='aliPay'
// #endif // #endif
//订单列表
export const pointGoodsPage = (data) => { export const pointGoodsPage = (data) => {
return request({ return request({
url: url + '/user/pointGoods/page', url: url + '/user/pointGoods/page',
@@ -22,3 +21,38 @@ export const pointGoodsPage = (data) => {
}) })
} }
export const exchange = (data) => {
return request({
url: url + '/user/pointGoods/exchange',
method: 'post',
data: {...data,payType}
})
}
export const applyRefund = (data) => {
return request({
url: url + '/user/pointGoods/applyRefund',
method: 'post',
data: data
})
}
export const cancelRefund = (data) => {
return request({
url: url + '/user/pointGoods/cancelRefund',
method: 'post',
data: data
})
}
export const recordPage = (data) => {
return request({
url: url + '/user/pointGoods/record/page',
method: 'get',
data: data
})
}

142
components/coupon-icon/index.vue Normal file
View File

@@ -0,0 +1,142 @@
<!-- 优惠券图标 -->
<template>
<view class="container">
<view class="icon icon1" v-if="props.item[props.typeKey] == 1">
<view class="top">
<text class="i">￥</text>
<text class="num">{{ props.item.discountAmount }}</text>
</view>
<view class="intro">
<text class="t">满{{ props.item.fullAmount }}可用</text>
</view>
</view>
<view class="icon icon2" v-if="props.item[props.typeKey] == 2">
<view class="top">
<text class="i">{{ props.item.discountNum }}件</text>
<text class="num">商品兑换</text>
</view>
<view class="intro">
<text class="t">满{{ props.item.fullAmount }}可用</text>
</view>
</view>
<view class="icon icon3" v-if="props.item[props.typeKey] == 3">
<view class="top">
<text class="num">{{ props.item.discountRate/10 }}折</text>
</view>
<view class="intro">
<text class="t">满{{ props.item.fullAmount }}可用</text>
</view>
</view>
<view class="icon icon2" v-if="props.item[props.typeKey] == 4">
<view class="top">
<text class="i">第二件</text>
<text class="num">半价券</text>
</view>
</view>
<view class="icon icon2" v-if="props.item[props.typeKey] == 6">
<view class="top">
<text class="i">买一送</text>
<text class="num">一券</text>
</view>
</view>
</view>
</template>
<script setup>
const props = defineProps({
item: {
type: Object,
default: {}
},
typeKey: {
type: String,
default: 'type'
}
});
</script>
<style scoped lang="scss">
$color: #ff1c1c;
.container {
width: 100%;
height: 100%;
.icon {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
&.icon1 {
.top {
.i {
color: $color;
font-size: 24upx;
font-weight: bold;
}
.num {
color: $color;
font-size: 72upx;
font-weight: bold;
}
}
}
&.icon2 {
.top {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
.i {
color: $color;
font-size: 34upx;
font-weight: bold;
}
.num {
color: $color;
font-size: 34upx;
font-weight: bold;
}
}
}
&.icon3 {
.top {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
.i {
color: $color;
font-size: 34upx;
font-weight: bold;
}
.num {
color: $color;
font-size: 52upx;
font-weight: bold;
}
}
}
.intro {
display: flex;
justify-content: center;
.t {
font-size: 22upx;
color: #999;
}
}
}
}
</style>

2
pages/order/coupon.vue
View File

@@ -204,7 +204,7 @@ import {
getCouponShops, getCouponShops,
} from "@/common/api/member.js"; } from "@/common/api/member.js";
import { findCoupon } from "@/common/api/market/coupon.js"; import { findCoupon } from "@/common/api/market/coupon.js";
import couponIcon from "@/pages/user/components/coupon-icon.vue"; import couponIcon from "@/components/coupon-icon/index";
// import * as UTILS from '@/utils/goods-utils.js'; // import * as UTILS from '@/utils/goods-utils.js';
import yskUtils from "ysk-utils"; import yskUtils from "ysk-utils";
const UTILS = yskUtils.couponUtils; const UTILS = yskUtils.couponUtils;

267
scoreShop/detail/index.vue
View File

@@ -1,75 +1,74 @@
<template> <template>
<view class="color-333 u-font-28"> <view class="color-333 u-font-28" v-if="item.id">
<template v-if="item.goodsCategory=='优惠券'">
<view class="top" :style="{ backgroundImage: 'url(' + imgs.bg + ')' }"> <view class="top" :style="{ backgroundImage: 'url(' + imgs.bg + ')' }">
<view class="name"> 这里是优惠券名称啊啊啊啊 </view> <view class="name u-line-1"> {{item.couponInfo.title}} </view>
<view class="info"> 15元代金券（满200可用） </view> <view class="info"> {{returnCouponTypeName}} </view>
</view> </view>
</template>
<template v-else>
<image class="top-img" :src="item.goodsImageUrl" mode="aspectFit"></image>
</template>
<view class="sku"> <view class="sku">
<view> <view>
<view> <view>
<text class="price">800</text> <text class="price">{{item.requiredPoints}}</text>
<text class="text">积分</text> <text class="text">积分</text>
<template v-if="item.extraPrice">
<text class="price">+</text> <text class="price">+</text>
<text class="price">9.99</text> <text class="price">{{item.extraPrice}}</text>
<text class="text">元</text> <text class="text">元</text>
</template>
</view> </view>
<view class="u-m-t-16 text"> 限购2份 </view> <view class="u-m-t-16 text" v-if="item.limitQuota"> 限购{{item.limitQuota}}份 </view>
</view> </view>
<text class="text">剩余：99999</text> <text class="text">剩余：{{item.quantity}}</text>
</view> </view>
<view class="goods-name">这里是商品名称啊啊啊啊啊</view> <view class="goods-name">{{item.goodsName}}</view>
<view class="bg-f7" style="height: 24rpx"></view> <view class="bg-f7" style="height: 24rpx"></view>
<view class="desc"> <view class="desc">
<view class="u-flex"> <view class="u-flex">
<view class="color-666 no-wrap">领取方式</view> <view class="color-666 no-wrap">领取方式</view>
<view class="u-m-l-16">系统发放</view> <view class="u-m-l-16" v-if="item.goodsCategory=='优惠券'">系统发放</view>
<view class="u-m-l-16" v-else>店内自取</view>
</view> </view>
<view class="u-flex u-m-t-16 u-col-baseline"> <view class="u-flex u-m-t-16 u-col-baseline" v-if="item.goodsCategory=='优惠券'">
<view class="color-666 no-wrap">特别说明</view> <view class="color-666 no-wrap">特别说明</view>
<view class="u-m-l-16" <view class="u-m-l-16">优惠券为虚拟发放，一旦兑换不支持退款，请悉知</view>
>优惠券为虚拟发放，一旦兑换不支持退款，请悉知</view
>
</view> </view>
</view> </view>
<view class="bg-f7" style="height: 24rpx"></view> <view class="bg-f7" style="height: 24rpx"></view>
<view class="goods-detail"> <view class="goods-detail" v-if="item.goodsCategory!='优惠券'">
<view class="u-flex u-row-center"> <view class="u-flex u-row-center">
<view class="title">商品详情</view> <view class="title">商品详情</view>
</view> </view>
<view class="u-m-t-32">
<image class="w-full" v-for="(item,index) in item.goodsDescription" :key="index" mode="widthFix" :src="item">
</image>
</view>
</view> </view>
<view style="height: 72px"></view> <view style="height: 100px"></view>
<view class="fixed-bottom u-flex u-row-center"> <view class="fixed-bottom u-flex u-row-center">
<view class="btn" @click="exchangeClick">立即兑换</view> <view class="btn" @click="exchangeClick" :class="isCanExchange">立即兑换</view>
</view> </view>
<!-- 兑换确认弹窗start --> <!-- 兑换确认弹窗start -->
<modal <modal v-model="modalData.show" title="立即兑换确认" @confirm="confirmExchange">
v-model="modalData.show"
title="立即兑换确认"
@confirm="confirmExchange"
>
<view style="padding: 32rpx 50rpx"> <view style="padding: 32rpx 50rpx">
<view class="u-font-32" <view class="u-font-32">您将消耗{{item.requiredPoints}}积分，兑换商品{{item.goodsName}}，是否确认兑换</view>
>您将消耗{800}积分，兑换商品{这里是商品名称}，是否确认兑换</view
>
<view class="u-m-t-20 waring u-flex u-font-32 u-col-center"> <view class="u-m-t-20 waring u-flex u-font-32 u-col-center">
<up-icon name="info-circle" size="16" color="#FF9900"></up-icon> <up-icon name="info-circle" size="16" color="#FF9900"></up-icon>
<view class="u-m-l-24" <view class="u-m-l-24">优惠券为虚拟发放，一旦兑换不支持退款，请悉知</view>
>优惠券为虚拟发放，一旦兑换不支持退款，请悉知</view
>
</view> </view>
</view> </view>
</modal> </modal>
<!-- 需要支付的弹窗 --> <!-- 需要支付的弹窗 -->
<up-popup <up-popup :show="popupData.show" mode="bottom" closeOnClickOverlay @close="popupData.show = false">
:show="popupData.show"
mode="bottom"
closeOnClickOverlay
@close="popupData.show = false"
>
<view class="popup-content"> <view class="popup-content">
<view class="popup-content-top"> <view class="popup-content-top">
<text class="color-666">领取方式</text> <text class="color-666">领取方式</text>
@@ -88,9 +87,7 @@
</view> </view>
<view class="u-m-t-20 waring u-flex u-col-center"> <view class="u-m-t-20 waring u-flex u-col-center">
<up-icon name="info-circle" size="16" color="#FF9900"></up-icon> <up-icon name="info-circle" size="16" color="#FF9900"></up-icon>
<view class="u-m-l-16" <view class="u-m-l-16">优惠券为虚拟发放，一旦兑换不支持退款，请悉知</view>
>优惠券为虚拟发放，一旦兑换不支持退款，请悉知</view
>
</view> </view>
</view> </view>
@@ -107,30 +104,151 @@
</view> </view>
</template> </template>
<script setup> <script setup>
import modal from "@/scoreShop/components/modal.vue"; import {
const imgs = { computed,
reactive
} from "vue";
import {
getOpenId
} from '@/utils/uniapp.js'
import modal from "@/scoreShop/components/modal.vue";
import * as pointGoodsApi from "@/common/api/order/pointGoods.js";
const imgs = {
bg: "https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/2/9fd6a3ad2b384f6cb4e88ed6b77bd334.png", bg: "https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/2/9fd6a3ad2b384f6cb4e88ed6b77bd334.png",
}; };
const modalData = reactive({ const modalData = reactive({
show: false, show: false,
}); });
const popupData = reactive({ const popupData = reactive({
show: false, show: false,
}); });
function exchangeClick() {
function exchangeClick() {
modalData.show = true; modalData.show = true;
} }
function confirmExchange() {
function confirmExchange() {
// modalData.show = false;
exchange()
}
async function exchange() {
uni.showLoading({
title: '兑换中……'
})
const openId = await getOpenId()
uni.hideLoading()
if (openId) {
pointGoodsApi.exchange({
pointsGoodsId: item.id,
shopId: item.shopId,
number: 1,
price: item.extraPrice,
openId
}).then(res => {
modalData.show = false; modalData.show = false;
} if(res){
uni.setStorageSync('exchange_goods_success',res)
uni.redirectTo({
url:'/scoreShop/success/index'
})
}else{
uni.showToast({
title: '兑换失败',
icon: 'none'
})
}
})
} else {
uni.showToast({
title: '鉴权失败，兑换失败',
icon: 'none'
})
}
}
const item = reactive({
goodsDescription: []
})
const couponTypes = {
1: "满减券",
2: "商品券",
3: "折扣券",
4: "第二件半价券",
5: "消费送券",
6: "买一送一券",
7: "固定价格券",
8: "免配送费券",
};
const returnCouponTypeName = computed(() => {
if (!item.id) {
return ' '
}
const type = item.couponInfo.couponType
if (type == 1) {
return item.couponInfo.discountAmount + '元代金券' + ' ' + `(满${item.fullAmount}可用)`
}
if (type == 2) {
return item.couponInfo.discountNum + '件商品兑换' + ' ' + `(满${item.fullAmount}可用)`
}
if (type == 3) {
return item.couponInfo.discountRate / 10 + '折' + ' ' + `(满${item.fullAmount}可用)`
}
if (type == 4) {
return '第二件半价券'
}
if (type == 6) {
return '买一送一券'
}
})
const pointsUser = reactive({
pointBalance: 0,
})
const isCanExchange = computed(() => {
if (pointsUser.pointBalance <= 0) {
return false
}
if (pointsUser.pointBalance < item.requiredPoints) {
return false
}
if (item.quantity <= 0) {
return false
}
if(item.limitQuota&&item.boughtCount>=item.limitQuota){
return false
}
return true
})
onLoad((opt) => {
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>
<style lang="scss" scoped> <style lang="scss" scoped>
.top { $topHeight: 350rpx;
.top-img {
width: 750rpx;
height: $topHeight;
}
.top {
margin: 14rpx 18rpx; margin: 14rpx 18rpx;
background-size: cover; background-size: cover;
height: 350rpx; height: $topHeight;
box-sizing: border-box; box-sizing: border-box;
padding-left: 70rpx; padding-left: 70rpx;
padding-top: 95rpx; padding-top: 95rpx;
@@ -140,45 +258,54 @@ function confirmExchange() {
font-size: 36rpx; font-size: 36rpx;
font-weight: 700; font-weight: 700;
} }
.info { .info {
color: #333333; color: #333333;
font-size: 48rpx; font-size: 48rpx;
font-weight: 700; font-weight: 700;
margin-top: 62rpx; margin-top: 62rpx;
} }
} }
.sku {
.sku {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
padding: 20rpx 36rpx; padding: 20rpx 36rpx;
align-items: center; align-items: center;
background: linear-gradient(90deg, #ff4a63 0%, #fd1f48 100%); background: linear-gradient(90deg, #ff4a63 0%, #fd1f48 100%);
.price { .price {
color: #fff; color: #fff;
font-weight: 700; font-weight: 700;
font-size: 36rpx; font-size: 36rpx;
} }
.text { .text {
color: #fff; color: #fff;
font-size: 28rpx; font-size: 28rpx;
} }
} }
.goods-name {
.goods-name {
padding: 20rpx 28rpx; padding: 20rpx 28rpx;
background: #fff; background: #fff;
font-size: 32rpx; font-size: 32rpx;
font-weight: 700; font-weight: 700;
color: #333; color: #333;
} }
.desc {
.desc {
padding: 32rpx 28rpx; padding: 32rpx 28rpx;
background-color: #fff; background-color: #fff;
} }
.goods-detail {
.goods-detail {
padding: 32rpx; padding: 32rpx;
.title { .title {
position: relative; position: relative;
padding: 0 22rpx; padding: 0 22rpx;
&::before { &::before {
content: ""; content: "";
display: block; display: block;
@@ -190,6 +317,7 @@ function confirmExchange() {
transform: translateY(-50%); transform: translateY(-50%);
background: linear-gradient(90deg, #f7f8f9 0%, #c9cbcc 100%); background: linear-gradient(90deg, #f7f8f9 0%, #c9cbcc 100%);
} }
&::after { &::after {
left: 100%; left: 100%;
content: ""; content: "";
@@ -202,17 +330,20 @@ function confirmExchange() {
background: linear-gradient(90deg, #c9cbcc 0%, #f7f8f9 100%); background: linear-gradient(90deg, #c9cbcc 0%, #f7f8f9 100%);
} }
} }
} }
.fixed-bottom { .fixed-bottom {
position: fixed; position: fixed;
background-color: #fff; background-color: #fff;
left: 0; left: 0;
right: 0; right: 0;
padding-bottom: calc(env(safe-area-inset-bottom) + 2rpx); padding-bottom: calc(env(safe-area-inset-bottom) + 2rpx);
padding-top: 32rpx;
background-color: #fff; background-color: #fff;
bottom: 0; bottom: 0;
z-index: 10; z-index: 10;
.btn { .btn {
padding: 16rpx 62rpx; padding: 16rpx 62rpx;
border-radius: 16rpx; border-radius: 16rpx;
@@ -220,27 +351,33 @@ function confirmExchange() {
font-weight: 700; font-weight: 700;
color: #9c571f; color: #9c571f;
background: linear-gradient(180deg, #f7cc84 0%, #f9dda9 100%); background: linear-gradient(180deg, #f7cc84 0%, #f9dda9 100%);
&.gray { &.gray {
background: #9999992b; background: #9999992b;
color: #999999; color: #999999;
} }
} }
} }
.waring {
.waring {
background-color: rgba(255, 204, 0, 0.09); background-color: rgba(255, 204, 0, 0.09);
padding: 32rpx 24rpx; padding: 32rpx 24rpx;
color: #ff8d28; color: #ff8d28;
} }
.popup-content {
.popup-content {
font-size: 28rpx; font-size: 28rpx;
min-height: 300px; min-height: 300px;
.popup-content-top { .popup-content-top {
padding: 32rpx 28rpx; padding: 32rpx 28rpx;
border-bottom: 1px solid #ededed; border-bottom: 1px solid #ededed;
} }
.goods-info { .goods-info {
padding: 44rpx 28rpx; padding: 44rpx 28rpx;
border-bottom: 1px solid #ededed; border-bottom: 1px solid #ededed;
.cover { .cover {
width: 184rpx; width: 184rpx;
height: 184rpx; height: 184rpx;
@@ -248,10 +385,12 @@ function confirmExchange() {
background: #d9d9d9; background: #d9d9d9;
} }
} }
.bottom { .bottom {
padding: 20rpx 28rpx 20rpx 20rpx; padding: 20rpx 28rpx 20rpx 20rpx;
border-bottom: 1px solid #ededed; border-bottom: 1px solid #ededed;
} }
.btn { .btn {
display: flex; display: flex;
padding: 22rpx 214rpx; padding: 22rpx 214rpx;
@@ -263,5 +402,5 @@ function confirmExchange() {
color: #fff; color: #fff;
font-size: 700; font-size: 700;
} }
} }
</style> </style>

125
scoreShop/index/components/goods-list.vue
View File

@@ -1,30 +1,44 @@
<template> <template>
<view class="goodslist" :class="[layout]"> <view class="goodslist" :class="[layout]">
<view v-for="(item, index) in 10" :key="index" @click="toDetail(item)"> <view v-for="(item, index) in list" :key="index" @click="toDetail(item)">
<template v-if="layout === 'list'"> <template v-if="layout === 'list'">
<view class="item"> <view class="item">
<image class="img" lazy-load></image> <view class="img coupon" v-if="item.goodsCategory=='优惠劵'&&item.couponInfo">
<couponIcon :item="item.couponInfo" typeKey="couponType" />
</view>
<image class="img" v-else lazy-load :src="item.goodsImageUrl"></image>
<view class="info"> <view class="info">
<view> <view>
<view class="name u-line-1">这里是商品名称</view> <view class="name u-line-1">{{item.goodsName}}</view>
<view class="price">8000积分</view> <view class="price">
<text>{{item.requiredPoints}}积分 </text>
<text v-if="item.extraPrice">+{{item.extraPrice}}元</text>
</view>
</view> </view>
<view class="u-flex u-row-center u-col-center u-flex-col"> <view class="u-flex u-row-center u-col-center u-flex-col">
<view class="btn">兑换</view> <view class="btn" v-if="canExchange(item)">兑换</view>
<view class="limit">限购2份</view> <view class="btn end" v-else>已兑完</view>
<view class="limit" v-if="item.limitQuota">限购{{item.limitQuota}}份</view>
</view> </view>
</view> </view>
</view> </view>
</template> </template>
<template v-if="layout === 'block'"> <template v-if="layout === 'block'">
<view class="item"> <view class="item">
<image class="img" lazy-load></image> <view class="img coupon" v-if="item.goodsCategory=='优惠劵'&&item.couponInfo">
<couponIcon :item="item.couponInfo" typeKey="couponType" />
</view>
<image class="img" v-else lazy-load :src="item.goodsImageUrl"></image>
<view class="info"> <view class="info">
<view class="name u-line-1">这里是商品名称</view> <view class="name u-line-1">{{item.goodsName}}</view>
<view class="price">8000积分</view> <view class="price">
<text>{{item.requiredPoints}}积分 </text>
<text v-if="item.extraPrice">+{{item.extraPrice}}元</text>
</view>
<view class="u-flex u-col-center u-m-t-16 u-row-between"> <view class="u-flex u-col-center u-m-t-16 u-row-between">
<view class="limit">限购2份</view> <view class="limit" v-if="item.limitQuota">限购{{item.limitQuota}}份</view>
<view class="btn">兑换</view> <view class="btn" v-if="canExchange(item)">兑换</view>
<view class="btn end" v-else>已兑完</view>
</view> </view>
</view> </view>
</view> </view>
@@ -34,7 +48,8 @@
</template> </template>
<script setup> <script setup>
const props = defineProps({ import couponIcon from "@/components/coupon-icon/index";
const props = defineProps({
list: { list: {
type: Object, type: Object,
default: () => [], default: () => [],
@@ -43,18 +58,61 @@ const props = defineProps({
type: String, type: String,
default: "block", default: "block",
}, },
}); pointsUser: {
type: Object,
default: () => {},
}
});
function toDetail(item) { function toDetail(item) {
if (!canExchange(item)) {
return
}
uni.setStorageSync('exchange_goods', item)
uni.navigateTo({ uni.navigateTo({
url: '/scoreShop/detail/index?id=' + item.id, url: '/scoreShop/detail/index?id=' + item.id,
}) })
} }
function canExchange(item) {
if (item.goodsCategory == '优惠券' && !item.couponInfo) {
return false
}
if (props.pointsUser.pointBalance <= 0) {
return false
}
if (props.pointsUser.pointBalance < item.requiredPoints) {
return false
}
if (item.quantity <= 0) {
return false
}
if (item.limitQuota && item.boughtCount >= item.limitQuota) {
return false
}
return true
}
const emits = defineEmits('exchange')
function exchange(item) {
// uni.showModal({
// title: '提示',
// content: `是否确认兑换` + item.goodsName + '？',
// cancelText: '取消',
// showCancel: true,
// success(res) {
// if (res.confirm) {
// emits('exchange', item)
// }
// }
// })
}
</script> </script>
<style lang="scss"> <style lang="scss">
.goodslist { .goodslist {
padding: 28rpx; padding: 28rpx;
&.list { &.list {
.item { .item {
background-color: #fff; background-color: #fff;
@@ -62,28 +120,38 @@ function toDetail(item) {
border-radius: 16rpx; border-radius: 16rpx;
display: flex; display: flex;
margin-bottom: 18rpx; margin-bottom: 18rpx;
.img { .img {
width: 112rpx; width: 112rpx;
height: 112rpx; height: 112rpx;
border-radius: 16rpx; border-radius: 16rpx;
background: #d9d9d9; background: #d9d9d9;
&.coupon {
// background-color: transparent;
} }
}
.info { .info {
flex: 1; flex: 1;
padding-left: 16rpx; padding-left: 16rpx;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
.name { .name {
font-size: 28rpx; font-size: 28rpx;
color: #333; color: #333;
font-weight: 700; font-weight: 700;
} }
.price { .price {
font-size: 28rpx; font-size: 28rpx;
margin-top: 14rpx; margin-top: 14rpx;
color: #666; color: #666;
} }
.btn { .btn {
padding: 14rpx 48rpx; padding: 14rpx 48rpx;
border-radius: 16rpx; border-radius: 16rpx;
@@ -91,47 +159,62 @@ function toDetail(item) {
color: #9c571f; color: #9c571f;
font-size: 28rpx; font-size: 28rpx;
font-weight: 700; font-weight: 700;
white-space: nowrap;
&.end { &.end {
color: #999999; color: #999999;
background-color: rgba(153, 153, 153, 0.3); background: rgba(153, 153, 153, 0.3);
} }
} }
.limit { .limit {
color: #666; color: #666;
font-size: 24rpx; font-size: 24rpx;
margin-top: 8rpx; margin-top: 8rpx;
white-space: nowrap;
} }
} }
} }
} }
&.block { &.block {
display: grid; display: grid;
grid-template-columns: repeat(2, 1fr); grid-template-columns: repeat(2, 1fr);
row-gap: 30rpx; row-gap: 30rpx;
column-gap: 52rpx; column-gap: 52rpx;
.item { .item {
padding: 32rpx 28rpx; padding: 32rpx 28rpx;
border-radius: 16rpx; border-radius: 16rpx;
background-color: #fff; background-color: #fff;
.img { .img {
width: 266rpx; width: 266rpx;
height: 266rpx; height: 266rpx;
border-radius: 16rpx; border-radius: 16rpx;
background: #d9d9d9; background: #d9d9d9;
&.coupon {
// background-color: transparent;
} }
}
.info { .info {
margin-top: 28rpx; margin-top: 28rpx;
.name { .name {
font-size: 28rpx; font-size: 28rpx;
color: #333; color: #333;
font-weight: 700; font-weight: 700;
} }
.price { .price {
font-size: 28rpx; font-size: 28rpx;
margin-top: 16rpx; margin-top: 16rpx;
font-weight: 700; font-weight: 700;
color: #9C571F; color: #9C571F;
} }
.btn { .btn {
padding: 14rpx 48rpx; padding: 14rpx 48rpx;
border-radius: 16rpx; border-radius: 16rpx;
@@ -139,17 +222,21 @@ function toDetail(item) {
color: #9c571f; color: #9c571f;
font-size: 28rpx; font-size: 28rpx;
font-weight: 700; font-weight: 700;
white-space: nowrap;
&.end { &.end {
color: #999999; color: #999999;
background-color: rgba(153, 153, 153, 0.3); background: rgba(153, 153, 153, 0.3);
} }
} }
.limit { .limit {
color: #666; color: #666;
font-size: 24rpx; font-size: 24rpx;
white-space: nowrap;
}
} }
} }
} }
} }
}
</style> </style>

69
scoreShop/index/index.vue
View File

@@ -7,13 +7,16 @@
<view> <view>
<view class="u-flex"> <view class="u-flex">
<image :src="imgs.wujiaoxing" class="wujiaoxing"></image> <image :src="imgs.wujiaoxing" class="wujiaoxing"></image>
<view class="number u-m-l-20 u-m-r-12">{{pointsUser?pointsUser.pointBalance:''}}</view> <view class="u-flex" @click="toDetail">
<view class="number u-m-l-20 u-m-r-12">{{pointsUser?pointsUser.pointBalance:0}}</view>
<view class="u-flex"> <view class="u-flex">
<up-icon name="arrow-right" size="18" bold color="#9C571F"></up-icon> <up-icon name="arrow-right" size="18" bold color="#9C571F"></up-icon>
</view> </view>
</view> </view>
</view>
<view class="u-m-t-10 u-flex color1" style="margin-left: 66rpx"> <view class="u-m-t-10 u-flex color1" style="margin-left: 66rpx">
<text @click="toPage('/scoreShop/order/index')">积分订单</text> <text @click="toPage('/scoreShop/order/index?shopId='+query.shopId)">积分订单</text>
<text class="u-m-l-44" @click="toDetail">积分明细</text> <text class="u-m-l-44" @click="toDetail">积分明细</text>
</view> </view>
</view> </view>
@@ -26,13 +29,17 @@
<view class="tab-box u-flex"> <view class="tab-box u-flex">
<view class="tabs u-flex-1 u-flex"> <view class="tabs u-flex-1 u-flex">
<view class="tab-item" :class="tabActive === 0 ? 'active' : ''" @click="tabActive = 0">优惠券</view> <view class="tab-item" :class="tabActive === 0 ? 'active' : ''" @click="tabActive = 0">优惠券</view>
<view class="tab-item" :class="tabActive === 1 ? 'active' : ''" @click="tabActive = 1">其他商品</view> <view class="tab-item" :class="tabActive === 1 ? 'active' : ''" @click="tabActive = 1">其它商品</view>
</view> </view>
<view class="u-flex" @click="toggleLayout"> <view class="u-flex" @click="toggleLayout">
<image :src="layout === 'block' ? imgs.layout_block : imgs.layout" class="layout" /> <image :src="layout === 'block' ? imgs.layout_block : imgs.layout" class="layout" />
</view> </view>
</view> </view>
<goodsList :layout="layout"></goodsList> <goodsList :pointsUser="pointsUser" :layout="layout" :list="list" @exchange="exchange"></goodsList>
<view class="">
<up-loadmore :status="isEnd?'nomore':'loadmore'"></up-loadmore>
</view>
</view> </view>
</view> </view>
</template> </template>
@@ -42,6 +49,13 @@
import { import {
onLoad onLoad
} from "@dcloudio/uni-app"; } from "@dcloudio/uni-app";
import {
reactive,
watch
} from "vue";
import {
onReachBottom
} from "@dcloudio/uni-app";
const imgs = { const imgs = {
bg: "https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/2/3716211a58d84fda9ee596a1882c0704.png", //背景图 bg: "https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/2/3716211a58d84fda9ee596a1882c0704.png", //背景图
huizhang: "https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/2/5d07600cc494490aa3adacfe51d8845d.png", //徽章 huizhang: "https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/2/5d07600cc494490aa3adacfe51d8845d.png", //徽章
@@ -61,6 +75,17 @@
}); });
} }
// function exchange(item) {
// pointGoodsApi.exchange({
// pointsGoodsId: item.id,
// shopId: item.shopId,
// number: 1,
// price: item.extraPrice
// }).then(res => {
// refresh()
// })
// }
function toDetail() { function toDetail() {
uni.navigateTo({ uni.navigateTo({
url: '/pages/user/member/billDetails?type=2&shopId=' + query.shopId + '&id=' + (pointsUser.value.id || url: '/pages/user/member/billDetails?type=2&shopId=' + query.shopId + '&id=' + (pointsUser.value.id ||
@@ -78,22 +103,52 @@
page: 1, page: 1,
size: 10, size: 10,
shopId: '', shopId: '',
goodsCategory: ''
}); });
const isEnd = ref(false); const isEnd = ref(false);
const pointsUser = ref(null) const pointsUser = ref(null)
const list = ref([])
function getList() { function getList() {
pointGoodsApi.pointGoodsPage(query).then(res => { const goodsCategory = tabActive.value === 1 ? '其它商品' : '优惠券'
pointGoodsApi.pointGoodsPage({
...query,
goodsCategory,
}).then(res => {
pointsUser.value = res.pointsUser pointsUser.value = res.pointsUser
uni.setStorageSync('pointsUser', res.pointsUser)
const newList = res.pointsGoods.records
if (query.page == 1) {
list.value = newList
} else {
list.value.push(...newList)
}
if (query.page >= res.pointsGoods.totalPage * 1) {
isEnd.value = true
}
}) })
} }
onLoad((opt) => { onLoad((opt) => {
query.shopId = opt.id || '' query.shopId = opt.shopId || ''
}) })
onShow(() => { watch(() => tabActive.value, (newval, oldval) => {
refresh()
})
function refresh() {
query.page = 1; query.page = 1;
isEnd.value = false; isEnd.value = false;
getList(); getList();
}
onReachBottom(() => {
if (isEnd.value) {
return
}
query.page++
getList();
})
onShow(() => {
refresh()
}); });
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">

80
scoreShop/order/components/order-list.vue
View File

@@ -1,71 +1,121 @@
<template> <template>
<view class="list"> <view class="list">
<view v-for="(item, index) in 10" :key="index" class="item"> <view v-for="(item, index) in list" :key="index" class="item">
<view class="u-flex u-row-between"> <view class="u-flex u-row-between">
<text class="color-999">2025/08/20 02:37:58</text> <text class="color-999">{{item.createTime}}</text>
<text class="status success">待核销</text> <text class="status " :class="[returnStatusClass(item)]">{{item.status}}</text>
</view> </view>
<view class="u-m-t-22 u-flex u-col-center"> <view class="u-m-t-22 u-flex u-col-center">
<up-image width="132rpx" height="132rpx" :src="item.img"></up-image> <up-image width="132rpx" height="132rpx" :src="item.goodsImageUrl" v-if="item.goodsCategory!='优惠券'"></up-image>
<view class="img" v-else>
<couponIcon :item="item.couponInfo" typeKey="couponType" />
</view>
<view class="u-p-l-36"> <view class="u-p-l-36">
<view>这里是商品名称</view> <view>{{item.pointsGoodsName}}</view>
<view class="u-m-t-28 color-666">800积分</view> <view class="u-m-t-28 color-666">{{item.spendPoints}}积分</view>
</view> </view>
</view> </view>
<view class="u-m-t-28 u-flex u-row-right btns"> <view class="u-m-t-28 u-flex u-row-right btns">
<view class="btn look" @click="lookCode">查看券码</view> <view class="btn look" @click="lookCode(item)" v-if="item.goodsCategory!='优惠券'">查看券码</view>
<view class="btn black">申请退款</view> <view class="btn black" @click="tuikuan(item)" v-if="canRefund(item)">申请退款</view>
<view class="btn black" @click="cancelRefund(item)" v-if="item.status=='退款中'" >取消退款</view>
</view> </view>
</view> </view>
</view> </view>
</template> </template>
<script setup> <script setup>
import { ref } from "vue"; import couponIcon from "@/components/coupon-icon/index";
import {
ref
} from "vue";
const props = defineProps({
list: {
type: Array,
default: () => []
}
})
const emits = defineEmits(["lookCode", "refund","cancelRefund"]);
const lookCode = (item) => {
emits("lookCode", item);
};
const emits = defineEmits(["lookCode"]); function tuikuan(item) {
const lookCode = () => { emits("refund", item);
emits("lookCode"); }
}; function cancelRefund(item) {
emits("cancelRefund", item);
}
function returnStatusClass(item) {
if (item.status == '已完成' || item.status == '已退款') {
return 'gray'
}
if (item.status == '待核销') {
return 'success'
}
if (item.status == '退款中') {
return 'error'
}
}
function canRefund(item) {
if(item.status=='已退款'|| item.status=='退款中'||item.goodsCategory!='其它商品' ){
return false
}
return true
}
</script> </script>
<style lang="scss"> <style lang="scss">
.list { .list {
padding: 28rpx; padding: 28rpx;
.item { .item {
padding: 14rpx 46rpx; padding: 14rpx 46rpx;
border-radius: 24rpx; border-radius: 24rpx;
background: #fff; background: #fff;
margin-bottom: 48rpx; margin-bottom: 48rpx;
.img{
width: 132rpx;
height: 132rpx;
}
.status { .status {
padding: 8rpx 18rpx; padding: 8rpx 18rpx;
border-radius: 8rpx; border-radius: 8rpx;
border: 2rpx solid transparent; border: 2rpx solid transparent;
&.success { &.success {
background: rgba(123, 209, 54, 0.12); background: rgba(123, 209, 54, 0.12);
border-color: #7bd136; border-color: #7bd136;
color: #7bd136; color: #7bd136;
} }
&.gray { &.gray {
background: #9999991f; background: #9999991f;
border-color: #999; border-color: #999;
color: #999; color: #999;
} }
&.error { &.error {
background: #ff1c1c2e; background: #ff1c1c2e;
border-color: #ff1c1c; border-color: #ff1c1c;
color: #ff1c1c; color: #ff1c1c;
} }
} }
.btns { .btns {
display: flex; display: flex;
gap: 34rpx; gap: 34rpx;
.btn { .btn {
padding: 8rpx 14rpx; padding: 8rpx 14rpx;
border-radius: 10rpx; border-radius: 10rpx;
border: 2rpx solid transparent; border: 2rpx solid transparent;
&.look { &.look {
border-color: #ededed; border-color: #ededed;
color: #333; color: #333;
} }
&.black { &.black {
border-color: #343030; border-color: #343030;
background: #343030; background: #343030;
@@ -74,5 +124,5 @@ const lookCode = () => {
} }
} }
} }
} }
</style> </style>

185
scoreShop/order/index.vue
View File

@@ -2,18 +2,16 @@
<view class="min-page bg-f7 u-font-28"> <view class="min-page bg-f7 u-font-28">
<up-sticky> <up-sticky>
<view class="top"> <view class="top">
<view <view v-for="(item, index) in tabs.list" :key="index" class="tab-item"
v-for="(item, index) in tabs.list" :class="{ active: item.value == tabs.sel }" @click="tabs.sel = item.value">{{ item.name }}</view>
:key="index"
class="tab-item"
:class="{ active: item.value == tabs.sel }"
@click="tabs.sel = item.value"
>{{ item.name }}</view
>
</view> </view>
</up-sticky> </up-sticky>
<orderList :list="list" @lookCode="lookCode" /> <orderList :list="list" @lookCode="lookCode" @refund="refund" @cancelRefund="cancelRefund" />
<view class="safe-bottom">
<up-loadmore :status="isEnd?'nomore':'loadmore'"></up-loadmore>
</view>
<modal v-model="modalData.show" title="立即兑换确认" :showBottom="false"> <modal v-model="modalData.show" title="立即兑换确认" :showBottom="false">
<view class="u-p-28"> <view class="u-p-28">
@@ -23,10 +21,7 @@
<view class="u-m-t-22 u-flex u-row-center"> <view class="u-m-t-22 u-flex u-row-center">
<text>{{ qrcode }}</text> <text>{{ qrcode }}</text>
<view @click="copyCode"> <view @click="copyCode">
<image <image src="/scoreShop/static/image/copy.png" class="u-m-l-24 copy"></image>
src="/scoreShop/static/image/copy.png"
class="u-m-l-24 copy"
></image>
</view> </view>
</view> </view>
</view> </view>
@@ -35,32 +30,115 @@
</template> </template>
<script setup> <script setup>
import modal from "@/scoreShop/components/modal.vue"; import modal from "@/scoreShop/components/modal.vue";
import orderList from "./components/order-list.vue"; import orderList from "./components/order-list.vue";
const modalData = reactive({ import * as pointGoodsApi from "@/common/api/order/pointGoods.js";
show: false, import {
}); onLoad
const qrcode = ref("daddadaddad"); } from "@dcloudio/uni-app";
import {
watch
} from "vue";
function copyCode() { const modalData = reactive({
show: false,
});
const qrcode = ref("");
function copyCode() {
uni.setClipboardData({ uni.setClipboardData({
data: qrcode.value, data: qrcode.value,
success: function () { success: function() {
uni.showToast({ uni.showToast({
title: "复制成功", title: "复制成功",
icon: "none", icon: "none",
}); });
}, },
}); });
} }
function lookCode() { function refresh() {
query.page = 1;
isEnd.value = false;
getList();
}
function refund(item) {
uni.showModal({
title: '提示',
content: '是否申请退款',
showCancel: true,
success(res) {
if (res.confirm) {
pointGoodsApi.applyRefund({
orderNo: item.orderNo,
recordId: item.id
}).then(res => {
if (res) {
uni.showToast({
title: '申请退款成功',
icon: 'none'
})
} else {
uni.showToast({
title: '申请退款失败',
icon: 'none'
})
}
setTimeout(() => {
refresh()
}, 1000)
})
}
}
})
}
function cancelRefund(item) {
uni.showModal({
title: '提示',
content: '是否取消退款',
showCancel: true,
success(res) {
if (res.confirm) {
pointGoodsApi.cancelRefund({
orderNo: item.orderNo,
recordId: item.id
}).then(res => {
if (res) {
uni.showToast({
title: '取消退款成功',
icon: 'none'
})
} else {
uni.showToast({
title: '取消退款失败',
icon: 'none'
})
}
setTimeout(() => {
refresh()
}, 1000)
})
}
}
})
}
function lookCode(item) {
qrcode.value = item.couponCode
modalData.show = true; modalData.show = true;
} }
const tabs = reactive({ const tabs = reactive({
list: [ list: [{
{
name: "全部订单", name: "全部订单",
value: "", value: "",
}, },
@@ -78,28 +156,65 @@ const tabs = reactive({
}, },
], ],
sel: "", sel: "",
}); });
const list = ref([]); const list = ref([]);
const query = reactive({
page: 1,
size: 10,
shopId: '',
});
const isEnd = ref(false);
watch(() => tabs.sel, (newval) => {
refresh()
})
function getList() {
const status = tabs.list.find(v => v.value == tabs.sel)
pointGoodsApi.recordPage({
...query,
}).then(res => {
const newList = res.records
if (query.page == 1) {
list.value = newList
} else {
list.value.push(...newList)
}
if (query.page >= res.totalPage * 1) {
isEnd.value = true
}
})
}
onLoad((opt) => {
query.shopId = opt.shopId || ''
getList()
})
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.top { .top {
background-color: #fff; background-color: #fff;
padding: 32rpx 28rpx; padding: 32rpx 28rpx;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
} }
.tab-item {
.tab-item {
color: #999; color: #999;
transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;
&.active { &.active {
color: #000; color: #000;
font-size: 32rpx; font-size: 32rpx;
font-weight: 700; font-weight: 700;
} }
} }
.copy {
.copy {
width: 28rpx; width: 28rpx;
height: 28rpx; height: 28rpx;
} }
.safe-bottom {
padding-bottom: calc(env(safe-area-inset-bottom) + 2rpx);
}
</style> </style>

29
scoreShop/success/index.vue
View File

@@ -10,29 +10,30 @@
<view class="bg" :style="{ backgroundImage: `url(${imgs.bg})` }"> <view class="bg" :style="{ backgroundImage: `url(${imgs.bg})` }">
<image :src="imgs.success" class="success"></image> <image :src="imgs.success" class="success"></image>
<view class="u-font-40 font-700">兑换成功</view> <view class="u-font-40 font-700">兑换成功</view>
<view class="u-font-32 font-700">这里是商品名称</view> <view class="u-font-32 font-700">{{item.pointsGoodsName}}</view>
<view class="u-m-t-14">需前往店铺自行兑换领取</view> <view class="u-m-t-14" v-if="item.goodsCategory!='优惠券'">需前往店铺自行兑换领取</view>
<view class="u-m-t-14" v-else>优惠券直接到账您的账户中</view>
</view> </view>
<view class="info u-flex u-flex-col"> <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>这里是商品名称</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>1份</text> <text>{{item.number}}份</text>
</view> </view>
<view class="u-p-22"> <view class="u-p-22">
<text class="color-666">消耗积分：</text> <text class="color-666">消耗积分：</text>
<text>800</text> <text>{{item.spendPoints}}</text>
</view> </view>
<view class="u-p-22"> <view class="u-p-22">
<text class="color-666">下单时间：</text> <text class="color-666">下单时间：</text>
<text>2025-12-3 17:19：32</text> <text>{{item.checkoutTime}}</text>
</view> </view>
<view class="u-p-22"> <view class="u-p-22">
<text class="color-666">订单号：</text> <text class="color-666">订单号：</text>
<text>：DH202511300001</text> <text>：{{item.orderNo}}</text>
</view> </view>
</view> </view>
<view class="u-flex bottom u-row-center"> <view class="u-flex bottom u-row-center">
@@ -44,6 +45,8 @@
</template> </template>
<script setup> <script setup>
const imgs = { const imgs = {
bg: "https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/2/b625560a5b75418c9e643841f8674a0c.png", bg: "https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/2/b625560a5b75418c9e643841f8674a0c.png",
success: success:
@@ -53,8 +56,18 @@ function back() {
uni.navigateBack(); uni.navigateBack();
} }
function lookOrder() { function lookOrder() {
uni.redirectTo({
url:'/scoreShop/order/index?shopId='+item.shopId
})
} }
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>

1
src/auto-imports.d.ts vendored
View File

@@ -32,6 +32,7 @@ declare global {
const onLoad: typeof import('@dcloudio/uni-app')['onLoad'] const onLoad: typeof import('@dcloudio/uni-app')['onLoad']
const onMounted: typeof import('vue')['onMounted'] const onMounted: typeof import('vue')['onMounted']
const onPageScroll: typeof import('@dcloudio/uni-app')['onPageScroll'] const onPageScroll: typeof import('@dcloudio/uni-app')['onPageScroll']
const onReachBottom: typeof import('@dcloudio/uni-app')['onReachBottom']
const onReady: typeof import('@dcloudio/uni-app')['onReady'] const onReady: typeof import('@dcloudio/uni-app')['onReady']
const onRenderTracked: typeof import('vue')['onRenderTracked'] const onRenderTracked: typeof import('vue')['onRenderTracked']
const onRenderTriggered: typeof import('vue')['onRenderTriggered'] const onRenderTriggered: typeof import('vue')['onRenderTriggered']

54
utils/uniapp.js
View File

@@ -1,16 +1,58 @@
export const back=()=>{ export const back = () => {
console.log('调用返回方法back'); console.log('调用返回方法back');
try { try {
const arr= getCurrentPages() const arr = getCurrentPages()
if(arr.length>=2){ if (arr.length >= 2) {
return uni.navigateBack() return uni.navigateBack()
}else{ } else {
uni.reLaunch({ uni.reLaunch({
url:'/pages/index/index' url: '/pages/index/index'
}) })
} }
} catch (error) { } catch (error) {
console.error('页面返回出错',error) console.error('页面返回出错', error)
//TODO handle the exception //TODO handle the exception
} }
} }
import {
APIuserlogin,
APIuser
} from "@/common/api/api.js";
export const getOpenId = () => {
// #ifdef MP-WEIXIN
return new Promise((resolve, reject) => {
uni.login({
provider: "weixin",
success: (data) => {
// 微信小程序环境
uni.getUserInfo({
provider: "weixin",
success: async (infoRes) => {
let res = await APIuserlogin({
code: data.code, //临时登录凭证
rawData: infoRes.rawData,
source: "wechat",
});
if (res) {
resolve(res.userInfo
.wechatOpenId);
} else {
reject(false);
}
},
fail: (err) => {
reject(false);
},
});
},
});
})
// #endif
// #ifdef MP-ALIPAY
// #endif
}

1
vite.config.js
View File

@@ -17,6 +17,7 @@ module.exports = defineConfig({
"onHide", "onHide",
"onUnload", "onUnload",
"onReady", "onReady",
"onReachBottom",
"onPageScroll", "onPageScroll",
"uni.request", "uni.request",
"uni.navigateTo", "uni.navigateTo",