refactor(components): 重构优惠券组件样式和结构

- 更新 CouponCard 组件样式,优化主题颜色和布局
- 调整 CouponList 组件样式,使用原生样式替代自定义样式
- 修改 orderConfirm 页面中的地址栏样式
- 更新 QuantitySelector 组件样式,统一数量选择器样式
- 删除 Questions 组件代码
This commit is contained in:
2025-08-11 18:15:36 +08:00
parent bcaf8203e4
commit 6f76be4da4
9 changed files with 230 additions and 297 deletions

View File

@@ -8,7 +8,6 @@ import {
Space,
ActionSheet,
Popup,
Toast,
InputNumber,
ConfigProvider
} from '@nutui/nutui-react-taro'
@@ -143,19 +142,28 @@ const OrderConfirm = () => {
// 检查是否满足使用条件
if (coupon.minAmount && total < coupon.minAmount) {
Toast.show(`需满${coupon.minAmount}元才能使用此优惠券`)
Taro.showToast({
title: `需满${coupon.minAmount}元才能使用此优惠券`,
icon: 'none'
})
return
}
setSelectedCoupon(coupon)
setCouponVisible(false)
Toast.show('优惠券选择成功')
Taro.showToast({
title: '优惠券选择成功',
icon: 'success'
})
}
// 取消选择优惠券
const handleCouponCancel = () => {
setSelectedCoupon(null)
Toast.show('已取消使用优惠券')
Taro.showToast({
title: '已取消使用优惠券',
icon: 'success'
})
}
/**
@@ -167,18 +175,27 @@ const OrderConfirm = () => {
// 基础校验
if (!address) {
Toast.show('请选择收货地址')
Taro.showToast({
title: '请选择收货地址',
icon: 'error'
})
return;
}
if (!payment) {
Toast.show('请选择支付方式')
Taro.showToast({
title: '请选择支付方式',
icon: 'error'
})
return;
}
// 库存校验
if (goods.stock !== undefined && quantity > goods.stock) {
Toast.show('商品库存不足')
Taro.showToast({
title: '商品库存不足',
icon: 'error'
})
return;
}
@@ -191,8 +208,7 @@ const OrderConfirm = () => {
comments: goods.name,
deliveryType: 0,
buyerRemarks: orderRemark,
couponId: selectedCoupon ? selectedCoupon.amount : undefined,
couponDiscount: getCouponDiscount()
couponId: selectedCoupon ? selectedCoupon.amount : undefined
}
);
@@ -202,10 +218,16 @@ const OrderConfirm = () => {
// 执行支付
await PaymentHandler.pay(orderData, paymentType);
Toast.show('支付成功')
Taro.showToast({
title: '支付成功',
icon: 'success'
})
} catch (error) {
console.error('支付失败:', error)
Toast.show('支付失败,请重试')
Taro.showToast({
title: '支付失败,请重试',
icon: 'error'
})
} finally {
setPayLoading(false)
}
@@ -217,17 +239,16 @@ const OrderConfirm = () => {
setLoading(true)
setError('')
// 并行加载商品信息和其他数据
const promises = []
// 分别加载数据,避免类型推断问题
let goodsRes: ShopGoods | null = null
if (goodsId) {
promises.push(getShopGoods(Number(goodsId)))
goodsRes = await getShopGoods(Number(goodsId))
}
promises.push(listShopUserAddress({isDefault: true}))
promises.push(selectPayment({}))
const [goodsRes, addressRes, paymentRes] = await Promise.all(promises)
const [addressRes, paymentRes] = await Promise.all([
listShopUserAddress({isDefault: true}),
selectPayment({})
])
// 设置商品信息
if (goodsRes) {
@@ -424,7 +445,7 @@ const OrderConfirm = () => {
>
<View className="coupon-popup">
<View className="coupon-popup__header">
<Text className="coupon-popup__title"></Text>
<Text className="text-sm"></Text>
<Button
size="small"
fill="none"
@@ -460,7 +481,7 @@ const OrderConfirm = () => {
coupons={availableCoupons.filter(coupon => {
const total = getGoodsTotal()
return coupon.minAmount && total < coupon.minAmount
}).map(coupon => ({...coupon, status: 2}))}
}).map(coupon => ({...coupon, status: 2 as const}))}
layout="vertical"
showEmpty={false}
/>