forked from gxwebsoft/mp-10550
refactor(components): 重构优惠券组件样式和结构
- 更新 CouponCard 组件样式,优化主题颜色和布局 - 调整 CouponList 组件样式,使用原生样式替代自定义样式 - 修改 orderConfirm 页面中的地址栏样式 - 更新 QuantitySelector 组件样式,统一数量选择器样式 - 删除 Questions 组件代码
This commit is contained in:
@@ -1,7 +1,6 @@
|
||||
import React from 'react'
|
||||
import { View, ScrollView } from '@tarojs/components'
|
||||
import CouponCard, { CouponCardProps } from './CouponCard'
|
||||
import './CouponCard.scss'
|
||||
|
||||
export interface CouponListProps {
|
||||
/** 优惠券列表数据 */
|
||||
@@ -33,14 +32,14 @@ const CouponList: React.FC<CouponListProps> = ({
|
||||
// 垂直布局
|
||||
if (layout === 'vertical') {
|
||||
return (
|
||||
<View className="coupon-list">
|
||||
<View className="p-4">
|
||||
{title && (
|
||||
<View className="coupon-list__title">{title}</View>
|
||||
<View className="text-lg font-semibold text-gray-800 mb-4">{title}</View>
|
||||
)}
|
||||
|
||||
|
||||
{coupons.length === 0 ? (
|
||||
showEmpty && (
|
||||
<View className="coupon-list__empty">
|
||||
<View className="text-center py-10 px-5 text-gray-500 text-sm">
|
||||
{emptyText}
|
||||
</View>
|
||||
)
|
||||
@@ -62,26 +61,30 @@ const CouponList: React.FC<CouponListProps> = ({
|
||||
return (
|
||||
<View>
|
||||
{title && (
|
||||
<View className="coupon-list__title" style={{ paddingLeft: '16px' }}>
|
||||
<View className="text-lg font-semibold text-gray-800 mb-4 pl-4">
|
||||
{title}
|
||||
</View>
|
||||
)}
|
||||
|
||||
|
||||
{coupons.length === 0 ? (
|
||||
showEmpty && (
|
||||
<View className="coupon-list__empty">
|
||||
<View className="text-center py-10 px-5 text-gray-500 text-sm">
|
||||
{emptyText}
|
||||
</View>
|
||||
)
|
||||
) : (
|
||||
<ScrollView
|
||||
scrollX
|
||||
className="coupon-scroll"
|
||||
className="flex p-4 gap-2 overflow-x-auto"
|
||||
showScrollbar={false}
|
||||
style={{
|
||||
WebkitOverflowScrolling: 'touch'
|
||||
}}
|
||||
>
|
||||
{coupons.map((coupon, index) => (
|
||||
<View
|
||||
key={index}
|
||||
className="flex-shrink-0 w-60 mb-0"
|
||||
onClick={() => handleCouponClick(coupon, index)}
|
||||
>
|
||||
<CouponCard {...coupon} />
|
||||
|
||||
Reference in New Issue
Block a user