EIEI/wechat_wc
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: 顶栏颜色跟随小程序主题并保留跟随系统

Browse Source
This commit is contained in:
broccoli
2026-08-06 19:54:05 +08:00
parent 9716148f15
commit f4f54a8720
84 changed files with 484 additions and 124 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/address/index.config.ts
+1
View File
@@ -1,4 +1,5 @@
export default definePageConfig({
navigationStyle: 'custom',
enablePageMeta: true,
navigationBarTitleText: '收货地址'
})
src/pages/address/index.tsx
+2
View File
@@ -7,6 +7,7 @@ import type { AddressItem } from '../../types'
import { useThemeContext } from '../../context/ThemeContext'
import { useSafeArea } from '../../hooks/useSafeArea'
import { useStatusBar } from '../../hooks/useStatusBar'
import ThemedPageMeta from '../../components/ThemedPageMeta'
export default function AddressPage() {
const { theme, resolvedTheme } = useThemeContext()
@@ -93,6 +94,7 @@ export default function AddressPage() {
return (
<View className={`theme-${resolvedTheme}`}>
<ThemedPageMeta />
<View className='address-page'>
<View className='page-header dashed-card mt-20' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
src/pages/agreement/index.config.ts
+1
View File
@@ -1,4 +1,5 @@
export default definePageConfig({
navigationStyle: 'custom',
enablePageMeta: true,
navigationBarTitleText: '定制协议'
})
src/pages/agreement/index.tsx
+2
View File
@@ -3,6 +3,7 @@ import './index.scss'
import { useThemeContext } from '../../context/ThemeContext'
import { useSafeArea } from '../../hooks/useSafeArea'
import { useStatusBar } from '../../hooks/useStatusBar'
import ThemedPageMeta from '../../components/ThemedPageMeta'
export default function AgreementPage() {
const { theme, resolvedTheme } = useThemeContext()
@@ -34,6 +35,7 @@ export default function AgreementPage() {
return (
<View className={`theme-${resolvedTheme}`}>
<ThemedPageMeta />
<View className='agreement-page'>
<View className='agreement-content' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
<Text className='agreement-title'>定制协议</Text>
src/pages/checkout/index.config.ts
+1
View File
@@ -1,4 +1,5 @@
export default definePageConfig({
navigationStyle: 'custom',
enablePageMeta: true,
navigationBarTitleText: '确认下单'
})
src/pages/checkout/index.tsx
+3
View File
@@ -6,6 +6,7 @@ import { getDesignList, designToOrder, getDefaultAddress, getAddressList, type A
import { useThemeContext } from '../../context/ThemeContext'
import { useSafeArea } from '../../hooks/useSafeArea'
import { useStatusBar } from '../../hooks/useStatusBar'
import ThemedPageMeta from '../../components/ThemedPageMeta'
export default function CheckoutPage() {
const { theme, resolvedTheme } = useThemeContext()
@@ -59,6 +60,7 @@ export default function CheckoutPage() {
if (!design) {
return (
<View className={`theme-${resolvedTheme}`}>
<ThemedPageMeta />
<View className='checkout-page'>
<View className='page-header dashed-card mt-20' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
<Text className='page-title'>设计不存在</Text>
@@ -79,6 +81,7 @@ export default function CheckoutPage() {
return (
<View className={`theme-${resolvedTheme}`}>
<ThemedPageMeta />
<View className='checkout-page'>
<View className='page-header dashed-card mt-20' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
src/pages/designList/index.config.ts
+1
View File
@@ -1,4 +1,5 @@
export default definePageConfig({
navigationStyle: 'custom',
enablePageMeta: true,
navigationBarTitleText: '设计清单'
})
src/pages/designList/index.tsx
+2
View File
@@ -8,6 +8,7 @@ import { useThemeContext } from '../../context/ThemeContext'
import { useSafeArea } from '../../hooks/useSafeArea'
import { useStatusBar } from '../../hooks/useStatusBar'
import LoginGuard from '../../components/LoginGuard'
import ThemedPageMeta from '../../components/ThemedPageMeta'
const STATUS_TABS = [
{ code: 'all', label: '全部' },
@@ -115,6 +116,7 @@ export default function DesignListPage() {
return (
<View className={`theme-${resolvedTheme}`}>
<ThemedPageMeta />
<LoginGuard>
<View className='design-page'>
<View className='page-header dashed-card mt-20' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
src/pages/diy/index.config.ts
+1
View File
@@ -1,4 +1,5 @@
export default definePageConfig({
navigationStyle: 'custom',
enablePageMeta: true,
navigationBarTitleText: 'DIY工作台'
})
src/pages/diy/index.tsx
+3
View File
@@ -7,6 +7,7 @@ import { getDesignList, setDesignList, updateDesign, type DesignItem, type Stick
import { useThemeContext } from '../../context/ThemeContext'
import { useSafeArea } from '../../hooks/useSafeArea'
import { useStatusBar } from '../../hooks/useStatusBar'
import ThemedPageMeta from '../../components/ThemedPageMeta'
export default function DIYPage() {
const { theme, resolvedTheme } = useThemeContext()
@@ -257,6 +258,7 @@ export default function DIYPage() {
if (!category) {
return (
<View className={`theme-${resolvedTheme}`}>
<ThemedPageMeta />
<View className='diy-page'>
<Text className='page-title'>加载中...</Text>
</View>
@@ -266,6 +268,7 @@ export default function DIYPage() {
return (
<View className={`theme-${resolvedTheme}`}>
<ThemedPageMeta />
<View className='diy-page'>
<View className='page-header dashed-card mt-20' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
src/pages/diy/stickerEdit/index.config.ts
+1
View File
@@ -1,4 +1,5 @@
export default definePageConfig({
navigationStyle: 'custom',
enablePageMeta: true,
navigationBarTitleText: '编辑贴纸'
})
src/pages/diy/stickerEdit/index.tsx
+2
View File
@@ -7,6 +7,7 @@ import { getDesignList, setDesignList, updateDesign, type DesignItem, type Stick
import { useThemeContext } from '../../../context/ThemeContext'
import { useSafeArea } from '../../../hooks/useSafeArea'
import { useStatusBar } from '../../../hooks/useStatusBar'
import ThemedPageMeta from '../../../components/ThemedPageMeta'
/* ============================================================
使用 Canvas 实现贴纸编辑（亮度/色相/线稿）
@@ -304,6 +305,7 @@ export default function StickerEditPage() {
return (
<View className={`theme-${resolvedTheme}`}>
<ThemedPageMeta />
<View className='sticker-edit-page'>
{/* Header */}
<View className='edit-header' style={{ paddingTop: `${safe.headerPaddingTop}px` }}>
src/pages/index/index.config.ts
+1
View File
@@ -1,4 +1,5 @@
export default definePageConfig({
navigationStyle: 'custom',
enablePageMeta: true,
navigationBarTitleText: '智绘微刻'
})
src/pages/index/index.tsx
+2
View File
@@ -6,6 +6,7 @@ import { CATEGORIES } from '../../utils/productConfig'
import { useThemeContext } from '../../context/ThemeContext'
import { useSafeArea } from '../../hooks/useSafeArea'
import { useStatusBar } from '../../hooks/useStatusBar'
import ThemedPageMeta from '../../components/ThemedPageMeta'
// 成品展示配图（从 img 里取对应实物图）
const SHOWCASE_LIST = [
@@ -48,6 +49,7 @@ export default function Index() {
return (
<View className={`theme-${resolvedTheme}`}>
<ThemedPageMeta />
<View className='index-page'>
{/* 顶部标题栏 */}
src/pages/orderDetail/index.config.ts
+1
View File
@@ -1,4 +1,5 @@
export default definePageConfig({
navigationStyle: 'custom',
enablePageMeta: true,
navigationBarTitleText: '订单详情'
})
src/pages/orderDetail/index.tsx
+3
View File
@@ -5,6 +5,7 @@ import './index.scss'
import { useThemeContext } from '../../context/ThemeContext'
import { useSafeArea } from '../../hooks/useSafeArea'
import { useStatusBar } from '../../hooks/useStatusBar'
import ThemedPageMeta from '../../components/ThemedPageMeta'
import { getOrderList, getDefaultAddress, getAddressList, type AddressItem, type OrderItem } from '../../utils/store'
import { PRODUCT_ICON_MAP } from '../../utils/productConfig'
@@ -51,6 +52,7 @@ export default function OrderDetailPage() {
if (!order) {
return (
<View className={`theme-${resolvedTheme}`}>
<ThemedPageMeta />
<View className='order-detail-page'>
<View className='page-header dashed-card mt-20' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
<Text className='page-title'>订单不存在</Text>
@@ -62,6 +64,7 @@ export default function OrderDetailPage() {
return (
<View className={`theme-${resolvedTheme}`}>
<ThemedPageMeta />
<View className='order-detail-page'>
<View className='page-header dashed-card mt-20' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
src/pages/orders/index.config.ts
+1
View File
@@ -1,4 +1,5 @@
export default definePageConfig({
navigationStyle: 'custom',
enablePageMeta: true,
navigationBarTitleText: '订单列表'
})
src/pages/orders/index.tsx
+2
View File
@@ -8,6 +8,7 @@ import { useThemeContext } from '../../context/ThemeContext'
import { useSafeArea } from '../../hooks/useSafeArea'
import { useStatusBar } from '../../hooks/useStatusBar'
import LoginGuard from '../../components/LoginGuard'
import ThemedPageMeta from '../../components/ThemedPageMeta'
const STATUS_TABS = [
{ code: 'all', label: '全部' },
@@ -75,6 +76,7 @@ export default function OrdersPage() {
return (
<View className={`theme-${resolvedTheme}`}>
<ThemedPageMeta />
<LoginGuard>
<View className='orders-page'>
src/pages/product/index.config.ts
+1
View File
@@ -1,4 +1,5 @@
export default definePageConfig({
navigationStyle: 'custom',
enablePageMeta: true,
navigationBarTitleText: '商品详情'
})
src/pages/product/index.tsx
+3
View File
@@ -7,6 +7,7 @@ import { addDesign } from '../../utils/store'
import { useThemeContext } from '../../context/ThemeContext'
import { useSafeArea } from '../../hooks/useSafeArea'
import { useStatusBar } from '../../hooks/useStatusBar'
import ThemedPageMeta from '../../components/ThemedPageMeta'
import { getProductIconImg } from '../../utils/productConfig'
const HERO_COLORS = ['#FFE4EC', '#FFF0F5', '#FCE4EC']
@@ -25,6 +26,7 @@ export default function ProductPage() {
if (!product) {
return (
<View className={`theme-${resolvedTheme}`}>
<ThemedPageMeta />
<View className='product-page'>
<View className='page-header dashed-card mt-20' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
<Text className='page-title'>商品未找到</Text>
@@ -58,6 +60,7 @@ export default function ProductPage() {
return (
<View className={`theme-${resolvedTheme}`}>
<ThemedPageMeta />
<View className='product-page'>
<View className='page-header dashed-card mt-20' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
src/pages/profile/index.config.ts
+1
View File
@@ -1,4 +1,5 @@
export default definePageConfig({
navigationStyle: 'custom',
enablePageMeta: true,
navigationBarTitleText: '个人中心'
})
src/pages/profile/index.tsx
+2
View File
@@ -6,6 +6,7 @@ import { getOrderList, getUserInfo, setUserInfo, getDesignList } from '../../uti
import { useThemeContext } from '../../context/ThemeContext'
import { useSafeArea } from '../../hooks/useSafeArea'
import { useStatusBar } from '../../hooks/useStatusBar'
import ThemedPageMeta from '../../components/ThemedPageMeta'
import { login, getMe, updateProfile, getToken } from '../../utils/api'
import { safeHideLoading } from '../../utils/request'
@@ -276,6 +277,7 @@ export default function ProfilePage() {
return (
<View className={`theme-${resolvedTheme}`} style={{ minHeight: '100vh' }}>
<ThemedPageMeta />
<View className='profile-page'>
{/* 用户信息头部 */}
src/pages/service/index.config.ts
+1
View File
@@ -1,4 +1,5 @@
export default definePageConfig({
navigationStyle: 'custom',
enablePageMeta: true,
navigationBarTitleText: '客服中心'
})
src/pages/service/index.tsx
+2
View File
@@ -4,6 +4,7 @@ import './index.scss'
import { useThemeContext } from '../../context/ThemeContext'
import { useSafeArea } from '../../hooks/useSafeArea'
import { useStatusBar } from '../../hooks/useStatusBar'
import ThemedPageMeta from '../../components/ThemedPageMeta'
const FAQ_ITEMS = [
{ q: '定制周期需要多久？', a: '通常下单后3-5个工作日内发货，批量订单（50件以上）可能需要7-10个工作日。' },
@@ -19,6 +20,7 @@ export default function ServicePage() {
return (
<View className={`theme-${resolvedTheme}`} style={{ minHeight: '100vh' }}>
<ThemedPageMeta />
<View className='service-page'>
<View className='page-header dashed-card mt-20' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
<View className='star-badge' />
src/pages/settings/index.config.ts
+1
View File
@@ -1,4 +1,5 @@
export default definePageConfig({
navigationStyle: 'custom',
enablePageMeta: true,
navigationBarTitleText: '设置'
})
src/pages/settings/index.tsx
+2
View File
@@ -5,6 +5,7 @@ import './index.scss'
import { useThemeContext } from '../../context/ThemeContext'
import { useSafeArea } from '../../hooks/useSafeArea'
import { useStatusBar } from '../../hooks/useStatusBar'
import ThemedPageMeta from '../../components/ThemedPageMeta'
import { getUserInfo, setUserInfo, clearUserInfo, getAddressList, getDefaultAddress, type AddressItem } from '../../utils/store'
const THEME_OPTIONS: { label: string; value: 'light' | 'dark' | 'auto' }[] = [
@@ -66,6 +67,7 @@ export default function SettingsPage() {
return (
<View className={`theme-${resolvedTheme}`} style={{ minHeight: '100vh' }}>
<ThemedPageMeta />
<View className='settings-page'>
<View className='settings-area'>
src/pages/shop/detail/index.config.ts
+1
View File
@@ -1,5 +1,6 @@
export default definePageConfig({
navigationStyle: 'custom',
enablePageMeta: true,
// 顶部为深色商品大图，状态栏文字设为白色，确保 iOS 时间/电量可见
navigationBarTextStyle: 'white'
})
src/pages/shop/detail/index.tsx
+3
View File
@@ -7,6 +7,7 @@ import { ProductCategory } from '../../../types'
import { useSafeArea } from '../../../hooks/useSafeArea'
import { useStatusBar } from '../../../hooks/useStatusBar'
import { useThemeContext } from '../../../context/ThemeContext'
import ThemedPageMeta from '../../../components/ThemedPageMeta'
const clamp = (v: number, min: number, max: number) => Math.min(Math.max(v, min), max)
const lerp = (a: number, b: number, t: number) => a + (b - a) * t
@@ -107,6 +108,7 @@ export default function ShopDetailPage() {
if (!product) {
return (
<View className="shop-detail-page">
<ThemedPageMeta darkTop />
<Text style={{ color: '#fff', padding: '40rpx' }}>商品不存在</Text>
</View>
)
@@ -114,6 +116,7 @@ export default function ShopDetailPage() {
return (
<View className="shop-detail-page">
<ThemedPageMeta darkTop />
{/* Fixed Hero */}
<View className="shop-hero-fixed">
<View
src/pages/shop/index.config.ts
+2 -1
View File
@@ -1,3 +1,4 @@
export default definePageConfig({
navigationStyle: 'custom'
navigationStyle: 'custom',
enablePageMeta: true,
})
src/pages/shop/index.tsx
+2
View File
@@ -3,6 +3,7 @@ import Taro from '@tarojs/taro'
import { useThemeContext } from '../../context/ThemeContext'
import { useSafeArea } from '../../hooks/useSafeArea'
import { useStatusBar } from '../../hooks/useStatusBar'
import ThemedPageMeta from '../../components/ThemedPageMeta'
import './index.scss'
import { PRODUCTS } from '../../utils/productConfig'
@@ -17,6 +18,7 @@ export default function ShopPage() {
return (
<View className={`shop-page theme-${resolvedTheme}`}>
<ThemedPageMeta />
<View className="shop-list">
<View className="shop-header" style={{ paddingTop: `${safe.headerPaddingTop}px` }}>
<Text className="shop-header-title">智绘精选</Text>
src/pages/userDatabase/index.config.ts
+1
View File
@@ -1,4 +1,5 @@
export default definePageConfig({
navigationStyle: 'custom',
enablePageMeta: true,
navigationBarTitleText: '用户数据库'
})
src/pages/userDatabase/index.tsx
+3
View File
@@ -13,6 +13,7 @@ import {
import { useThemeContext } from '../../context/ThemeContext'
import { useSafeArea } from '../../hooks/useSafeArea'
import { useStatusBar } from '../../hooks/useStatusBar'
import ThemedPageMeta from '../../components/ThemedPageMeta'
export default function UserDatabasePage() {
const { theme, resolvedTheme } = useThemeContext()
@@ -82,6 +83,7 @@ export default function UserDatabasePage() {
if (!isUnlocked) {
return (
<View className={`theme-${resolvedTheme}`}>
<ThemedPageMeta />
<View className='udb-page'>
<View className='udb-lock-card dashed-card mt-20'>
<View className='star-badge' />
@@ -110,6 +112,7 @@ export default function UserDatabasePage() {
return (
<View className={`theme-${resolvedTheme}`}>
<ThemedPageMeta />
<View className='udb-page'>
<View className='page-header dashed-card mt-20' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
src/pages/wordcloud/index.config.ts
+1
View File
@@ -1,4 +1,5 @@
export default definePageConfig({
navigationStyle: 'custom',
enablePageMeta: true,
navigationBarTitleText: '词云生成'
})
src/pages/wordcloud/index.tsx
+2
View File
@@ -5,6 +5,7 @@ import './index.scss'
import { useThemeContext } from '../../context/ThemeContext'
import { useSafeArea } from '../../hooks/useSafeArea'
import { useStatusBar } from '../../hooks/useStatusBar'
import ThemedPageMeta from '../../components/ThemedPageMeta'
export default function WordCloudPage() {
const { theme, resolvedTheme } = useThemeContext()
@@ -61,6 +62,7 @@ export default function WordCloudPage() {
return (
<View className={`theme-${resolvedTheme}`}>
<ThemedPageMeta />
<View className='wordcloud-page'>
<View className='page-header flex-between' style={{ paddingTop: `${safe.headerPaddingTop}px` }}>