Browse Source

refactor(coupon): 重构优惠券页面布局和样式

-调整 CouponCard 和 CouponList 组件的样式,使其更加简洁和一致
- 优化页面布局,利用 flex 布局实现全屏布局
- 移除冗余代码和不必要的组件
- 调整空状态展示方式,增加查看我的优惠券按钮
dev
科技小王子 2 days ago
parent
commit
a15333da07
  1. 1
      src/components/PaymentCountdown.scss
  2. 3
      src/shop/orderDetail/index.scss
  3. 10
      src/shop/orderDetail/index.tsx

1
src/components/PaymentCountdown.scss

@ -133,7 +133,6 @@
margin: 8px 0;
.countdown-text {
font-size: 14px;
font-weight: 600;
}
}

3
src/shop/orderDetail/index.scss

@ -3,7 +3,6 @@
.nut-cell-group__title {
padding: 10px 16px;
font-size: 14px;
color: #999;
}
@ -24,4 +23,4 @@
margin-left: 10px;
}
}
}
}

10
src/shop/orderDetail/index.tsx

@ -101,7 +101,7 @@ const OrderDetail = () => {
<div className={'order-detail-page'}>
{/* 支付倒计时显示 - 详情页实时更新 */}
{!order.payStatus && order.orderStatus !== 2 && (
<div className="order-detail-countdown p-4 bg-red-50 border-b border-red-100">
<div className="order-detail-countdown flex justify-center p-4 bg-red-50 border-b border-red-100">
<PaymentCountdown
createTime={order.createTime}
payStatus={order.payStatus}
@ -148,10 +148,10 @@ const OrderDetail = () => {
<div className={'fixed-bottom'}>
<Space>
{!order.payStatus && <Button size="small" onClick={() => console.log('取消订单')}></Button>}
{!order.payStatus && <Button size="small" type="primary" onClick={() => console.log('立即支付')}></Button>}
{order.orderStatus === 1 && <Button size="small" onClick={() => console.log('申请退款')}>退</Button>}
{order.deliveryStatus === 20 && <Button size="small" type="primary" onClick={() => console.log('确认收货')}></Button>}
{!order.payStatus && <Button onClick={() => console.log('取消订单')}></Button>}
{!order.payStatus && <Button type="primary" onClick={() => console.log('立即支付')}></Button>}
{order.orderStatus === 1 && <Button onClick={() => console.log('申请退款')}>退</Button>}
{order.deliveryStatus === 20 && <Button type="primary" onClick={() => console.log('确认收货')}></Button>}
</Space>
</div>
</div>

Loading…
Cancel
Save