feat(shop): 使用白色购物车图标替换文本图标

- 引入了 base64 格式的白色购物车 SVG 图标常量
- 将购物车按钮内的文本符号替换为可自适应大小的 Image 组件
- 保持图标外观和布局一致,增强视觉统一性
- 提升图标加载性能,适配绿色浮动按钮主题
This commit is contained in:
2026-07-14 02:50:21 +08:00
parent a37f7a5d4d
commit e157aac4c5
3 changed files with 10 additions and 1 deletions

View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="9" cy="21" r="1"></circle><circle cx="20" cy="21" r="1"></circle><path d="M1 1h4l2.68 13.39a2 2 0 0 0 2 1.61h9.72a2 2 0 0 0 2-1.61L23 6H6"></path></svg>

After

Width:  |  Height:  |  Size: 316 B

View File

@@ -0,0 +1,3 @@
// 白色购物车 SVG 图标base64用于绿色浮动按钮
export const CART_ICON_WHITE =
'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiPjxjaXJjbGUgY3g9IjkiIGN5PSIyMSIgcj0iMSI+PC9jaXJjbGU+PGNpcmNsZSBjeD0iMjAiIGN5PSIyMSIgcj0iMSI+PC9jaXJjbGU+PHBhdGggZD0iTTEgMWg0bDIuNjggMTMuMzlhMiAyIDAgMCAwIDIgMS42MWg5LjcyYTIgMiAwIDAgMCAyLTEuNjFMMjMgNkg2Ij48L3BhdGg+PC9zdmc+'

View File

@@ -14,6 +14,7 @@ import { useShare } from '@/hooks/useShare'
import EmptyState from '@/components/common/EmptyState'
import LoadMore from '@/components/common/LoadMore'
import Price from '@/components/common/Price'
import { CART_ICON_WHITE } from '@/assets/icons'
definePageConfig({
navigationBarTitleText: '商品分类',
@@ -360,7 +361,11 @@ const ShopPage: React.FC = () => {
}}
onClick={() => Taro.navigateTo({ url: '/pages/shop/cart' })}
>
<Text className='text-white text-xl'>🛒</Text>
<Image
className='w-7 h-7'
src={CART_ICON_WHITE}
mode='aspectFit'
/>
{totalCount > 0 && (
<View
className='flex items-center justify-center'