状态栏修复更新

1.添加状态栏间距来防止内容遮挡
2.添加了跟随页面自动变色的状态栏标题色改变

.gitignore

@@ -1 +1,2 @@
 node_modules
+.claude

dist/app.json

@@ -1 +1 @@
-{"pages":["pages/index/index","pages/shop/index","pages/shop/detail/index","pages/product/index","pages/diy/index","pages/diy/stickerEdit/index","pages/checkout/index","pages/designList/index","pages/orders/index","pages/profile/index","pages/service/index","pages/wordcloud/index","pages/orderDetail/index","pages/address/index","pages/settings/index","pages/agreement/index","pages/userDatabase/index"],"window":{"backgroundTextStyle":"light","navigationStyle":"custom","backgroundColor":"#ffffff","darkmode":true},"tabBar":{"custom":true,"list":[{"pagePath":"pages/index/index","text":"首页"},{"pagePath":"pages/shop/index","text":"商品"},{"pagePath":"pages/designList/index","text":"设计清单"},{"pagePath":"pages/orders/index","text":"订单"},{"pagePath":"pages/profile/index","text":"我的"}]}}
+{"pages":["pages/index/index","pages/shop/index","pages/shop/detail/index","pages/product/index","pages/diy/index","pages/diy/stickerEdit/index","pages/checkout/index","pages/designList/index","pages/orders/index","pages/profile/index","pages/service/index","pages/wordcloud/index","pages/orderDetail/index","pages/address/index","pages/settings/index","pages/agreement/index","pages/userDatabase/index"],"window":{"backgroundTextStyle":"dark","navigationStyle":"custom","navigationBarTextStyle":"black","backgroundColor":"#ffffff"},"tabBar":{"custom":true,"list":[{"pagePath":"pages/index/index","text":"首页"},{"pagePath":"pages/shop/index","text":"商品"},{"pagePath":"pages/designList/index","text":"设计清单"},{"pagePath":"pages/orders/index","text":"订单"},{"pagePath":"pages/profile/index","text":"我的"}]}}

dist/pages/agreement/index.js

@@ -1 +1 @@
-"use strict";(wx["webpackJsonp"]=wx["webpackJsonp"]||[]).push([[301],{6855:function(e,n,t){var a=t(7842),s=t(118),c=t(9703),r=t(4848);function i(){var e=(0,c.wR)(),n=(e.theme,e.resolvedTheme),t=[{title:"\u4e00\u3001\u7528\u6237\u6743\u8d23",content:"\u7528\u6237\u786e\u8ba4\u63d0\u4ea4\u7684\u8bbe\u8ba1\u5185\u5bb9\u4e0d\u4fb5\u72af\u7b2c\u4e09\u65b9\u77e5\u8bc6\u4ea7\u6743\uff0c\u5b9a\u5236\u5546\u54c1\u4e00\u7ecf\u786e\u8ba4\u4e0b\u5355\u5373\u8fdb\u5165\u751f\u4ea7\u6d41\u7a0b\uff0c\u975e\u8d28\u91cf\u95ee\u9898\u4e0d\u652f\u6301\u9000\u6362\u3002"},{title:"\u4e8c\u3001\u9690\u79c1\u4fdd\u62a4",content:"\u6211\u4eec\u4e25\u683c\u4fdd\u62a4\u7528\u6237\u4e2a\u4eba\u4fe1\u606f\uff0c\u5934\u50cf\u4e0e\u6635\u79f0\u4ec5\u7528\u4e8e\u63d0\u5347\u670d\u52a1\u4f53\u9a8c\uff0c\u4e0d\u4e0e\u7b2c\u4e09\u65b9\u5206\u4eab\u3002"},{title:"\u4e09\u3001\u552e\u540e\u8bf4\u660e",content:"\u6536\u5230\u5546\u54c1\u540e\u5982\u6709\u8d28\u91cf\u95ee\u9898\uff0c\u8bf7\u57287\u5929\u5185\u8054\u7cfb\u5ba2\u670d\uff0c\u6211\u4eec\u5c06\u4e3a\u60a8\u514d\u8d39\u91cd\u505a\u6216\u9000\u6b3e\u3002"},{title:"\u56db\u3001\u5b9a\u5236\u6d41\u7a0b",content:"1. \u9009\u62e9\u5546\u54c1\u54c1\u7c7b\u5e76\u52a0\u5165\u8bbe\u8ba1\u6e05\u5355\n2. \u5728DIY\u5de5\u4f5c\u53f0\u4e0a\u4f20\u56fe\u7247\u6216\u8f93\u5165\u6587\u5b57\n3. \u786e\u8ba4\u8bbe\u8ba1\u6548\u679c\u5e76\u63d0\u4ea4\u8ba2\u5355\n4. \u652f\u4ed8\u540e\u8fdb\u5165\u751f\u4ea7\uff0c\u7ea63-7\u4e2a\u5de5\u4f5c\u65e5\u53d1\u8d27\n5. \u7269\u6d41\u8ddf\u8e2a\u81f3\u786e\u8ba4\u6536\u8d27"}];return(0,r.jsx)(s.Ss,{className:"theme-".concat(n),children:(0,r.jsx)(s.Ss,{className:"agreement-page",children:(0,r.jsxs)(s.Ss,{className:"agreement-content",children:[(0,r.jsx)(s.EY,{className:"agreement-title",children:"\u5b9a\u5236\u534f\u8bae"}),t.map(function(e,n){return(0,r.jsxs)(s.Ss,{className:"agreement-section",children:[(0,r.jsx)(s.EY,{className:"agreement-h3",children:e.title}),(0,r.jsx)(s.EY,{className:"agreement-p",children:e.content})]},n)})]})})})}var l={navigationBarTitleText:"\u5b9a\u5236\u534f\u8bae"};Page((0,a.createPageConfig)(i,"pages/agreement/index",{root:{cn:[]}},l||{}))}},function(e){var n=function(n){return e(e.s=n)};e.O(0,[907,96,76],function(){return n(6855)});e.O()}]);
+"use strict";(wx["webpackJsonp"]=wx["webpackJsonp"]||[]).push([[301],{6855:function(e,n,t){var a=t(7842),c=t(118),s=t(9703),r=t(9201),i=t(5414),l=t(4848);function o(){var e=(0,s.wR)(),n=(e.theme,e.resolvedTheme),t=(0,r.c)();(0,i.l)(n);var a=[{title:"\u4e00\u3001\u7528\u6237\u6743\u8d23",content:"\u7528\u6237\u786e\u8ba4\u63d0\u4ea4\u7684\u8bbe\u8ba1\u5185\u5bb9\u4e0d\u4fb5\u72af\u7b2c\u4e09\u65b9\u77e5\u8bc6\u4ea7\u6743\uff0c\u5b9a\u5236\u5546\u54c1\u4e00\u7ecf\u786e\u8ba4\u4e0b\u5355\u5373\u8fdb\u5165\u751f\u4ea7\u6d41\u7a0b\uff0c\u975e\u8d28\u91cf\u95ee\u9898\u4e0d\u652f\u6301\u9000\u6362\u3002"},{title:"\u4e8c\u3001\u9690\u79c1\u4fdd\u62a4",content:"\u6211\u4eec\u4e25\u683c\u4fdd\u62a4\u7528\u6237\u4e2a\u4eba\u4fe1\u606f\uff0c\u5934\u50cf\u4e0e\u6635\u79f0\u4ec5\u7528\u4e8e\u63d0\u5347\u670d\u52a1\u4f53\u9a8c\uff0c\u4e0d\u4e0e\u7b2c\u4e09\u65b9\u5206\u4eab\u3002"},{title:"\u4e09\u3001\u552e\u540e\u8bf4\u660e",content:"\u6536\u5230\u5546\u54c1\u540e\u5982\u6709\u8d28\u91cf\u95ee\u9898\uff0c\u8bf7\u57287\u5929\u5185\u8054\u7cfb\u5ba2\u670d\uff0c\u6211\u4eec\u5c06\u4e3a\u60a8\u514d\u8d39\u91cd\u505a\u6216\u9000\u6b3e\u3002"},{title:"\u56db\u3001\u5b9a\u5236\u6d41\u7a0b",content:"1. \u9009\u62e9\u5546\u54c1\u54c1\u7c7b\u5e76\u52a0\u5165\u8bbe\u8ba1\u6e05\u5355\n2. \u5728DIY\u5de5\u4f5c\u53f0\u4e0a\u4f20\u56fe\u7247\u6216\u8f93\u5165\u6587\u5b57\n3. \u786e\u8ba4\u8bbe\u8ba1\u6548\u679c\u5e76\u63d0\u4ea4\u8ba2\u5355\n4. \u652f\u4ed8\u540e\u8fdb\u5165\u751f\u4ea7\uff0c\u7ea63-7\u4e2a\u5de5\u4f5c\u65e5\u53d1\u8d27\n5. \u7269\u6d41\u8ddf\u8e2a\u81f3\u786e\u8ba4\u6536\u8d27"}];return(0,l.jsx)(c.Ss,{className:"theme-".concat(n),children:(0,l.jsx)(c.Ss,{className:"agreement-page",children:(0,l.jsxs)(c.Ss,{className:"agreement-content",style:{marginTop:"".concat(t.headerPaddingTop,"px")},children:[(0,l.jsx)(c.EY,{className:"agreement-title",children:"\u5b9a\u5236\u534f\u8bae"}),a.map(function(e,n){return(0,l.jsxs)(c.Ss,{className:"agreement-section",children:[(0,l.jsx)(c.EY,{className:"agreement-h3",children:e.title}),(0,l.jsx)(c.EY,{className:"agreement-p",children:e.content})]},n)})]})})})}var m={navigationBarTitleText:"\u5b9a\u5236\u534f\u8bae"};Page((0,a.createPageConfig)(o,"pages/agreement/index",{root:{cn:[]}},m||{}))}},function(e){var n=function(n){return e(e.s=n)};e.O(0,[907,96,76],function(){return n(6855)});e.O()}]);

dist/pages/index/index.js

@@ -1 +1 @@
-"use strict";(wx["webpackJsonp"]=wx["webpackJsonp"]||[]).push([[421],{7265:function(e,s,a){var c=a(7842),i=a(5544),r=a(118),t=a(758),l=a.n(t),n=a(6540),o=a(5234),m=a(9703),d=a(4848),h=[{title:"\u6bd5\u4e1a\u7eaa\u5ff5\u7b14\u8bb0\u672c",desc:"\u5168\u73ed\u540d\u5b57\u7ec4\u6210\u6821\u5fbd",image:"/img/book_small/The1.jpg"},{title:"\u94dc\u8d28\u676f\u57ab",desc:"\u91d1\u5c5e\u8d28\u611f\u684c\u9762\u827a\u672f",image:"/img/cup/The1.jpg"},{title:"\u7af9\u5236\u7b14\u76d2",desc:"\u81ea\u7136\u7af9\u7eb9\u6587\u623f\u96c5\u5668",image:"/img/penbox/The1.jpg"},{title:"\u4e66\u672c\u578b\u706f",desc:"\u6e29\u6696\u5149\u5f71\u70b9\u4eae\u5fc3\u610f",image:"/img/booklight/The1.jpg"},{title:"\u60c5\u4fa3\u5b9a\u5236\u793c",desc:"\u4e24\u4e2a\u4eba\u7684\u540d\u5b57\u4ea4\u7ec7",image:"/img/book_big/The1.jpg"},{title:"\u4f01\u4e1a\u5e74\u4f1a\u793c",desc:"\u5458\u5de5\u540d\u5b57\u7ec4\u6210Logo",image:"/img/penbox/The2.jpg"}],g={"notebook-small":"/img/book_small/The1.jpg","notebook-large":"/img/book_big/The1.jpg",coaster:"/img/cup/The1.jpg",penbox:"/img/penbox/The1.jpg",booklamp:"/img/booklight/The1.jpg"};function p(){var e=(0,m.wR)(),s=(e.theme,e.resolvedTheme),a=(0,n.useState)(""),c=(0,i.A)(a,2),t=c[0],p=c[1],x=function(e){l().navigateTo({url:"/pages/product/index?id=".concat(e)})},j=t.trim()?o.R6.filter(function(e){return e.name.includes(t)||e.desc.includes(t)}):o.R6,N=function(e){p(e.detail.value)};return(0,d.jsx)(r.Ss,{className:"theme-".concat(s),children:(0,d.jsxs)(r.Ss,{className:"index-page",children:[(0,d.jsx)(r.Ss,{className:"header-bar",children:(0,d.jsx)(r.EY,{className:"header-title",children:"\u667a\u7ed8\u5fae\u523b"})}),(0,d.jsxs)(r.Ss,{className:"search-card dashed-card",children:[(0,d.jsx)(r.Ss,{className:"star-badge"}),(0,d.jsxs)(r.Ss,{className:"search-inner",children:[(0,d.jsx)(r._V,{className:"search-icon-img",src:"/icon/\u641c\u7d22.png",mode:"aspectFit"}),(0,d.jsx)(r.pd,{className:"search-input",type:"text",placeholder:"\u641c\u7d22\u5b9a\u5236\u54c1\u7c7b\uff1a\u7b14\u8bb0\u672c\u3001\u676f\u57ab\u3001\u4e66\u706f...",value:t,onInput:N,confirmType:"search"})]}),t.trim()&&(0,d.jsx)(r.Ss,{className:"search-result-hint",children:(0,d.jsx)(r.EY,{className:"hint-text",children:j.length>0?"\u627e\u5230 ".concat(j.length," \u4e2a\u76f8\u5173\u54c1\u7c7b"):"\u6ca1\u6709\u627e\u5230\u76f8\u5173\u54c1\u7c7b\uff0c\u8bd5\u8bd5\u770b\u5176\u4ed6\u5173\u952e\u8bcd"})})]}),(0,d.jsxs)(r.Ss,{className:"showcase-section mt-20",children:[(0,d.jsx)(r.EY,{className:"section-title",children:"\u5b9a\u5236\u6210\u54c1\u5c55\u793a"}),(0,d.jsx)(r.RC,{className:"showcase-swiper",indicatorColor:"#e0e0e0",indicatorActiveColor:"#ff9a9e",circular:!0,autoplay:!0,interval:3e3,duration:500,previousMargin:"40rpx",nextMargin:"40rpx",indicatorDots:!0,children:h.map(function(e,s){return(0,d.jsx)(r.wu,{className:"showcase-swiper-item",children:(0,d.jsxs)(r.Ss,{className:"showcase-swiper-card dashed-card",children:[(0,d.jsx)(r.Ss,{className:"star-badge"}),(0,d.jsx)(r.Ss,{className:"showcase-image-wrapper",children:(0,d.jsx)(r._V,{className:"showcase-real-img",src:e.image,mode:"aspectFill"})}),(0,d.jsxs)(r.Ss,{className:"showcase-text-area",children:[(0,d.jsxs)(r.Ss,{className:"showcase-info",children:[(0,d.jsx)(r.EY,{className:"showcase-title",children:e.title}),(0,d.jsx)(r.EY,{className:"showcase-desc",children:e.desc})]}),(0,d.jsx)(r.Ss,{className:"showcase-tag",children:"\u6210\u54c1\u6848\u4f8b"})]})]})},s)})})]}),(0,d.jsxs)(r.Ss,{className:"category-section mt-20",children:[(0,d.jsx)(r.EY,{className:"section-title",children:"\u70ed\u95e8\u54c1\u7c7b"}),(0,d.jsx)(r.Ss,{className:"category-grid",children:j.map(function(e){return(0,d.jsxs)(r.Ss,{className:"category-item dashed-card",onTap:function(){return x(e.id)},children:[(0,d.jsx)(r.Ss,{className:"star-badge"}),(0,d.jsx)(r.Ss,{className:"category-img-wrapper",children:(0,d.jsx)(r._V,{className:"category-img-real",src:g[e.id]||"/icon/\u56db\u89d2\u661f.png",mode:"aspectFill"})}),(0,d.jsx)(r.EY,{className:"category-name",children:e.name}),(0,d.jsx)(r.EY,{className:"category-desc",children:e.desc}),(0,d.jsxs)(r.EY,{className:"category-price",children:["\xa5",e.price," \u8d77"]})]},e.id)})}),0===j.length&&(0,d.jsxs)(r.Ss,{className:"empty-category dashed-card",children:[(0,d.jsx)(r._V,{className:"empty-icon-img",src:"/icon/\u641c\u7d22.png",mode:"aspectFit"}),(0,d.jsx)(r.EY,{className:"empty-text",children:"\u672a\u627e\u5230\u5339\u914d\u7684\u54c1\u7c7b"}),(0,d.jsx)(r.EY,{className:"empty-sub",children:"\u5c1d\u8bd5\u641c\u7d22\u201c\u7b14\u8bb0\u672c\u201d\u3001\u201c\u676f\u57ab\u201d\u7b49"})]})]}),(0,d.jsx)(r.Ss,{className:"safe-bottom-placeholder"})]})})}var x={};Page((0,c.createPageConfig)(p,"pages/index/index",{root:{cn:[]}},x||{}))}},function(e){var s=function(s){return e(e.s=s)};e.O(0,[907,96,76],function(){return s(7265)});e.O()}]);
+"use strict";(wx["webpackJsonp"]=wx["webpackJsonp"]||[]).push([[421],{7265:function(e,s,a){var c=a(7842),i=a(5544),r=a(118),t=a(758),l=a.n(t),n=a(6540),o=a(5234),m=a(9703),d=a(9201),h=a(5414),g=a(4848),p=[{title:"\u6bd5\u4e1a\u7eaa\u5ff5\u7b14\u8bb0\u672c",desc:"\u5168\u73ed\u540d\u5b57\u7ec4\u6210\u6821\u5fbd",image:"/img/book_small/The1.jpg"},{title:"\u94dc\u8d28\u676f\u57ab",desc:"\u91d1\u5c5e\u8d28\u611f\u684c\u9762\u827a\u672f",image:"/img/cup/The1.jpg"},{title:"\u7af9\u5236\u7b14\u76d2",desc:"\u81ea\u7136\u7af9\u7eb9\u6587\u623f\u96c5\u5668",image:"/img/penbox/The1.jpg"},{title:"\u4e66\u672c\u578b\u706f",desc:"\u6e29\u6696\u5149\u5f71\u70b9\u4eae\u5fc3\u610f",image:"/img/booklight/The1.jpg"},{title:"\u60c5\u4fa3\u5b9a\u5236\u793c",desc:"\u4e24\u4e2a\u4eba\u7684\u540d\u5b57\u4ea4\u7ec7",image:"/img/book_big/The1.jpg"},{title:"\u4f01\u4e1a\u5e74\u4f1a\u793c",desc:"\u5458\u5de5\u540d\u5b57\u7ec4\u6210Logo",image:"/img/penbox/The2.jpg"}],x={"notebook-small":"/img/book_small/The1.jpg","notebook-large":"/img/book_big/The1.jpg",coaster:"/img/cup/The1.jpg",penbox:"/img/penbox/The1.jpg",booklamp:"/img/booklight/The1.jpg"};function j(){var e=(0,m.wR)(),s=(e.theme,e.resolvedTheme),a=(0,d.c)();(0,h.l)(s);var c=(0,n.useState)(""),t=(0,i.A)(c,2),j=t[0],N=t[1],u=function(e){l().navigateTo({url:"/pages/product/index?id=".concat(e)})},b=j.trim()?o.R6.filter(function(e){return e.name.includes(j)||e.desc.includes(j)}):o.R6,w=function(e){N(e.detail.value)};return(0,g.jsx)(r.Ss,{className:"theme-".concat(s),children:(0,g.jsxs)(r.Ss,{className:"index-page",children:[(0,g.jsx)(r.Ss,{className:"header-bar",style:{paddingTop:"".concat(a.headerPaddingTop,"px")},children:(0,g.jsx)(r.EY,{className:"header-title",children:"\u667a\u7ed8\u5fae\u523b"})}),(0,g.jsxs)(r.Ss,{className:"search-card dashed-card",children:[(0,g.jsx)(r.Ss,{className:"star-badge"}),(0,g.jsxs)(r.Ss,{className:"search-inner",children:[(0,g.jsx)(r._V,{className:"search-icon-img",src:"/icon/\u641c\u7d22.png",mode:"aspectFit"}),(0,g.jsx)(r.pd,{className:"search-input",type:"text",placeholder:"\u641c\u7d22\u5b9a\u5236\u54c1\u7c7b\uff1a\u7b14\u8bb0\u672c\u3001\u676f\u57ab\u3001\u4e66\u706f...",value:j,onInput:w,confirmType:"search"})]}),j.trim()&&(0,g.jsx)(r.Ss,{className:"search-result-hint",children:(0,g.jsx)(r.EY,{className:"hint-text",children:b.length>0?"\u627e\u5230 ".concat(b.length," \u4e2a\u76f8\u5173\u54c1\u7c7b"):"\u6ca1\u6709\u627e\u5230\u76f8\u5173\u54c1\u7c7b\uff0c\u8bd5\u8bd5\u770b\u5176\u4ed6\u5173\u952e\u8bcd"})})]}),(0,g.jsxs)(r.Ss,{className:"showcase-section mt-20",children:[(0,g.jsx)(r.EY,{className:"section-title",children:"\u5b9a\u5236\u6210\u54c1\u5c55\u793a"}),(0,g.jsx)(r.RC,{className:"showcase-swiper",indicatorColor:"#e0e0e0",indicatorActiveColor:"#ff9a9e",circular:!0,autoplay:!0,interval:3e3,duration:500,previousMargin:"40rpx",nextMargin:"40rpx",indicatorDots:!0,children:p.map(function(e,s){return(0,g.jsx)(r.wu,{className:"showcase-swiper-item",children:(0,g.jsxs)(r.Ss,{className:"showcase-swiper-card dashed-card",children:[(0,g.jsx)(r.Ss,{className:"star-badge"}),(0,g.jsx)(r.Ss,{className:"showcase-image-wrapper",children:(0,g.jsx)(r._V,{className:"showcase-real-img",src:e.image,mode:"aspectFill"})}),(0,g.jsxs)(r.Ss,{className:"showcase-text-area",children:[(0,g.jsxs)(r.Ss,{className:"showcase-info",children:[(0,g.jsx)(r.EY,{className:"showcase-title",children:e.title}),(0,g.jsx)(r.EY,{className:"showcase-desc",children:e.desc})]}),(0,g.jsx)(r.Ss,{className:"showcase-tag",children:"\u6210\u54c1\u6848\u4f8b"})]})]})},s)})})]}),(0,g.jsxs)(r.Ss,{className:"category-section mt-20",children:[(0,g.jsx)(r.EY,{className:"section-title",children:"\u70ed\u95e8\u54c1\u7c7b"}),(0,g.jsx)(r.Ss,{className:"category-grid",children:b.map(function(e){return(0,g.jsxs)(r.Ss,{className:"category-item dashed-card",onTap:function(){return u(e.id)},children:[(0,g.jsx)(r.Ss,{className:"star-badge"}),(0,g.jsx)(r.Ss,{className:"category-img-wrapper",children:(0,g.jsx)(r._V,{className:"category-img-real",src:x[e.id]||"/icon/\u56db\u89d2\u661f.png",mode:"aspectFill"})}),(0,g.jsx)(r.EY,{className:"category-name",children:e.name}),(0,g.jsx)(r.EY,{className:"category-desc",children:e.desc}),(0,g.jsxs)(r.EY,{className:"category-price",children:["\xa5",e.price," \u8d77"]})]},e.id)})}),0===b.length&&(0,g.jsxs)(r.Ss,{className:"empty-category dashed-card",children:[(0,g.jsx)(r._V,{className:"empty-icon-img",src:"/icon/\u641c\u7d22.png",mode:"aspectFit"}),(0,g.jsx)(r.EY,{className:"empty-text",children:"\u672a\u627e\u5230\u5339\u914d\u7684\u54c1\u7c7b"}),(0,g.jsx)(r.EY,{className:"empty-sub",children:"\u5c1d\u8bd5\u641c\u7d22\u201c\u7b14\u8bb0\u672c\u201d\u3001\u201c\u676f\u57ab\u201d\u7b49"})]})]}),(0,g.jsx)(r.Ss,{className:"safe-bottom-placeholder"})]})})}var N={};Page((0,c.createPageConfig)(j,"pages/index/index",{root:{cn:[]}},N||{}))}},function(e){var s=function(s){return e(e.s=s)};e.O(0,[907,96,76],function(){return s(7265)});e.O()}]);

dist/pages/orders/index.wxss

@@ -1 +1 @@
-.orders-page{min-height:100vh;padding:0 24rpx 24rpx}.page-header{margin:20rpx 0 0;padding:calc(env(safe-area-inset-top, 0rpx) + 44rpx) 32rpx 24rpx!important}.status-tabs{margin:20rpx 0}.tabs-scroll{white-space:nowrap}.tab-item{display:inline-block;padding:20rpx 32rpx;position:relative}.tab-label{color:#b08d8d;font-size:28rpx;font-weight:500}.tab-item.active .tab-label{color:#ff9a9e;font-weight:700}.tab-underline{background:#ff9a9e;border-radius:4rpx;bottom:8rpx;height:4rpx;left:50%;position:absolute;-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translateX(-50%);width:40rpx}.orders-list{padding:0}.order-card{margin-bottom:24rpx;padding:28rpx}.order-header{-ms-flex-pack:justify;-ms-flex-align:center;-webkit-align-items:center;align-items:center;border-bottom:2rpx dashed #fce4ec;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-justify-content:space-between;justify-content:space-between;margin-bottom:20rpx;padding-bottom:20rpx}.order-date{color:#b08d8d;font-size:24rpx}.order-body{-ms-flex-align:start;-webkit-align-items:flex-start;align-items:flex-start;display:-webkit-flex;display:-ms-flexbox;display:flex;margin-bottom:20rpx}.order-icon-wrapper{-ms-flex-align:center;-ms-flex-pack:center;-ms-flex-negative:0;-webkit-align-items:center;align-items:center;background:-webkit-linear-gradient(315deg,#fff0f5,#e3f2fd);background:linear-gradient(135deg,#fff0f5,#e3f2fd);border-radius:16rpx;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-shrink:0;flex-shrink:0;height:120rpx;-webkit-justify-content:center;justify-content:center;margin-right:20rpx;width:120rpx}.order-icon{font-size:56rpx}.order-icon-img{height:56rpx;width:56rpx}.order-info{-webkit-flex:1;-ms-flex:1;flex:1}.order-product{color:#5c3a3a;display:block;font-size:30rpx;font-weight:700;margin-bottom:8rpx}.order-sku{color:#b08d8d;display:block;font-size:24rpx;margin-bottom:8rpx}.order-meta{color:#ccc;display:block;font-size:22rpx}.order-footer{border-top:2rpx dashed #fce4ec;padding-top:16rpx}.order-price-bar{-ms-flex-align:baseline;-ms-flex-pack:end;-webkit-align-items:baseline;align-items:baseline;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-justify-content:flex-end;justify-content:flex-end;margin-bottom:20rpx}.price-label{color:#b08d8d;font-size:24rpx;margin-right:8rpx}.price-value{color:#ff6b81;font-size:36rpx;font-weight:800}.order-actions{-ms-flex-pack:end;display:-webkit-flex;display:-ms-flexbox;display:flex;gap:16rpx;-webkit-justify-content:flex-end;justify-content:flex-end}.order-btn{border-radius:40rpx!important;font-size:26rpx!important;padding:14rpx 28rpx!important}.empty-state{-ms-flex-align:center;-webkit-align-items:center;align-items:center;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;padding:120rpx 40rpx}.empty-icon-img{height:56rpx;margin-bottom:24rpx;width:56rpx}.empty-text{color:var(--text-primary);font-size:36rpx;font-weight:700;margin-bottom:12rpx}.empty-sub{color:var(--text-secondary);font-size:28rpx;margin-bottom:40rpx}
+.orders-page{min-height:100vh;padding:0 24rpx 24rpx}.page-header{margin:20rpx 0 0;padding:32rpx 32rpx 24rpx}.status-tabs{margin:20rpx 0}.tabs-scroll{white-space:nowrap}.tab-item{display:inline-block;padding:20rpx 32rpx;position:relative}.tab-label{color:#b08d8d;font-size:28rpx;font-weight:500}.tab-item.active .tab-label{color:#ff9a9e;font-weight:700}.tab-underline{background:#ff9a9e;border-radius:4rpx;bottom:8rpx;height:4rpx;left:50%;position:absolute;-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translateX(-50%);width:40rpx}.orders-list{padding:0}.order-card{margin-bottom:24rpx;padding:28rpx}.order-header{-ms-flex-pack:justify;-ms-flex-align:center;-webkit-align-items:center;align-items:center;border-bottom:2rpx dashed #fce4ec;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-justify-content:space-between;justify-content:space-between;margin-bottom:20rpx;padding-bottom:20rpx}.order-date{color:#b08d8d;font-size:24rpx}.order-body{-ms-flex-align:start;-webkit-align-items:flex-start;align-items:flex-start;display:-webkit-flex;display:-ms-flexbox;display:flex;margin-bottom:20rpx}.order-icon-wrapper{-ms-flex-align:center;-ms-flex-pack:center;-ms-flex-negative:0;-webkit-align-items:center;align-items:center;background:-webkit-linear-gradient(315deg,#fff0f5,#e3f2fd);background:linear-gradient(135deg,#fff0f5,#e3f2fd);border-radius:16rpx;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-shrink:0;flex-shrink:0;height:120rpx;-webkit-justify-content:center;justify-content:center;margin-right:20rpx;width:120rpx}.order-icon{font-size:56rpx}.order-icon-img{height:56rpx;width:56rpx}.order-info{-webkit-flex:1;-ms-flex:1;flex:1}.order-product{color:#5c3a3a;display:block;font-size:30rpx;font-weight:700;margin-bottom:8rpx}.order-sku{color:#b08d8d;display:block;font-size:24rpx;margin-bottom:8rpx}.order-meta{color:#ccc;display:block;font-size:22rpx}.order-footer{border-top:2rpx dashed #fce4ec;padding-top:16rpx}.order-price-bar{-ms-flex-align:baseline;-ms-flex-pack:end;-webkit-align-items:baseline;align-items:baseline;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-justify-content:flex-end;justify-content:flex-end;margin-bottom:20rpx}.price-label{color:#b08d8d;font-size:24rpx;margin-right:8rpx}.price-value{color:#ff6b81;font-size:36rpx;font-weight:800}.order-actions{-ms-flex-pack:end;display:-webkit-flex;display:-ms-flexbox;display:flex;gap:16rpx;-webkit-justify-content:flex-end;justify-content:flex-end}.order-btn{border-radius:40rpx!important;font-size:26rpx!important;padding:14rpx 28rpx!important}.empty-state{-ms-flex-align:center;-webkit-align-items:center;align-items:center;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;padding:120rpx 40rpx}.empty-icon-img{height:56rpx;margin-bottom:24rpx;width:56rpx}.empty-text{color:var(--text-primary);font-size:36rpx;font-weight:700;margin-bottom:12rpx}.empty-sub{color:var(--text-secondary);font-size:28rpx;margin-bottom:40rpx}

dist/pages/service/index.wxss

@@ -1 +1 @@
-.service-page{min-height:100vh;padding:0 24rpx 24rpx}.page-header{margin:20rpx 0 0;padding:calc(env(safe-area-inset-top, 0rpx) + 44rpx) 32rpx 24rpx!important}.service-hero{-ms-flex-align:center;-webkit-align-items:center;align-items:center;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;padding:50rpx 40rpx;text-align:center}.service-hero-icon{height:56rpx;margin-bottom:20rpx;width:56rpx}.service-title{color:var(--text-primary);display:block;font-size:36rpx;font-weight:700;margin-bottom:12rpx}.service-desc{color:var(--text-secondary);display:block;font-size:24rpx;margin-bottom:32rpx}.service-btn{border-radius:50rpx!important;font-size:30rpx!important;padding:24rpx 56rpx!important}.contact-list{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;gap:20rpx}.contact-item{-ms-flex-align:center;-webkit-align-items:center;align-items:center;display:-webkit-flex;display:-ms-flexbox;display:flex;padding:28rpx 32rpx}.contact-icon{font-size:48rpx;margin-right:24rpx}.contact-icon-img{-ms-flex-negative:0;-webkit-flex-shrink:0;flex-shrink:0;height:32rpx;margin-right:24rpx;width:32rpx}.contact-info{-webkit-flex:1;-ms-flex:1;flex:1}.contact-label{color:var(--text-secondary);display:block;font-size:24rpx;margin-bottom:4rpx}.contact-value{color:var(--text-primary);font-size:30rpx;font-weight:600}.faq-card{margin-bottom:20rpx;padding:28rpx 32rpx}.faq-q{color:var(--text-primary);display:block;font-size:30rpx;font-weight:700;margin-bottom:12rpx}.faq-a{color:var(--text-secondary);font-size:26rpx;line-height:1.6}.enterprise-service{padding:32rpx}.enterprise-icon{height:28rpx;margin-right:12rpx;width:28rpx}.enterprise-title{color:var(--text-primary);display:block;font-size:30rpx;font-weight:700;margin-bottom:8rpx}.enterprise-desc{color:var(--text-secondary);display:block;font-size:24rpx;margin-bottom:24rpx}
+.service-page{min-height:100vh;padding:0 24rpx 24rpx}.page-header{margin:20rpx 0 0;padding:32rpx 32rpx 24rpx}.service-hero{-ms-flex-align:center;-webkit-align-items:center;align-items:center;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;padding:50rpx 40rpx;text-align:center}.service-hero-icon{height:56rpx;margin-bottom:20rpx;width:56rpx}.service-title{color:var(--text-primary);display:block;font-size:36rpx;font-weight:700;margin-bottom:12rpx}.service-desc{color:var(--text-secondary);display:block;font-size:24rpx;margin-bottom:32rpx}.service-btn{border-radius:50rpx!important;font-size:30rpx!important;padding:24rpx 56rpx!important}.contact-list{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;gap:20rpx}.contact-item{-ms-flex-align:center;-webkit-align-items:center;align-items:center;display:-webkit-flex;display:-ms-flexbox;display:flex;padding:28rpx 32rpx}.contact-icon{font-size:48rpx;margin-right:24rpx}.contact-icon-img{-ms-flex-negative:0;-webkit-flex-shrink:0;flex-shrink:0;height:32rpx;margin-right:24rpx;width:32rpx}.contact-info{-webkit-flex:1;-ms-flex:1;flex:1}.contact-label{color:var(--text-secondary);display:block;font-size:24rpx;margin-bottom:4rpx}.contact-value{color:var(--text-primary);font-size:30rpx;font-weight:600}.faq-card{margin-bottom:20rpx;padding:28rpx 32rpx}.faq-q{color:var(--text-primary);display:block;font-size:30rpx;font-weight:700;margin-bottom:12rpx}.faq-a{color:var(--text-secondary);font-size:26rpx;line-height:1.6}.enterprise-service{padding:32rpx}.enterprise-icon{height:28rpx;margin-right:12rpx;width:28rpx}.enterprise-title{color:var(--text-primary);display:block;font-size:30rpx;font-weight:700;margin-bottom:8rpx}.enterprise-desc{color:var(--text-secondary);display:block;font-size:24rpx;margin-bottom:24rpx}

dist/pages/shop/detail/index.json

@@ -1 +1 @@
-{"navigationStyle":"custom","usingComponents":{"comp":"../../../comp"}}
+{"navigationStyle":"custom","navigationBarTextStyle":"white","usingComponents":{"comp":"../../../comp"}}

dist/pages/shop/index.js

@@ -1 +1 @@
-"use strict";(wx["webpackJsonp"]=wx["webpackJsonp"]||[]).push([[205],{6296:function(s,e,a){var c=a(7842),n=a(118),o=a(758),i=a.n(o),r=a(9703),l=a(5234),d=a(4848);function t(){var s=(0,r.wR)(),e=s.resolvedTheme,a=function(s){i().navigateTo({url:"/pages/shop/detail/index?id=".concat(s)})};return(0,d.jsx)(n.Ss,{className:"shop-page theme-".concat(e),children:(0,d.jsxs)(n.Ss,{className:"shop-list",children:[(0,d.jsxs)(n.Ss,{className:"shop-header",children:[(0,d.jsx)(n.EY,{className:"shop-header-title",children:"\u667a\u7ed8\u7cbe\u9009"}),(0,d.jsx)(n.EY,{className:"shop-header-sub",children:"\u6fc0\u5149\u5fae\u96d5\u5b9a\u5236\u597d\u7269"})]}),(0,d.jsx)(n.Ss,{className:"shop-grid",children:l.zv.map(function(s){var e,c,o,i;return(0,d.jsxs)(n.Ss,{className:"shop-card",onTap:function(){return a(s.id)},children:[(0,d.jsx)(n.Ss,{className:"shop-card-img-wrap",children:(0,d.jsx)(n._V,{className:"shop-card-img",src:(null===(e=s.images)||void 0===e?void 0:e[0])||s.iconImg||"",mode:"aspectFill",lazyLoad:!0})}),(0,d.jsxs)(n.Ss,{className:"shop-card-info",style:{backgroundColor:"rgba(".concat((null===(c=s.tone)||void 0===c?void 0:c[0])||28,", ").concat((null===(o=s.tone)||void 0===o?void 0:o[1])||22,", ").concat((null===(i=s.tone)||void 0===i?void 0:i[2])||18,", 0.92)")},children:[(0,d.jsx)(n.EY,{className:"shop-card-name",children:s.name}),(0,d.jsxs)(n.EY,{className:"shop-card-price",children:["\xa5",s.price]})]})]},s.id)})}),(0,d.jsx)(n.Ss,{style:{height:"160px"}})]})})}var h={};Page((0,c.createPageConfig)(t,"pages/shop/index",{root:{cn:[]}},h||{}))}},function(s){var e=function(e){return s(s.s=e)};s.O(0,[907,96,76],function(){return e(6296)});s.O()}]);
+"use strict";(wx["webpackJsonp"]=wx["webpackJsonp"]||[]).push([[205],{6296:function(s,e,a){var c=a(7842),n=a(118),o=a(758),i=a.n(o),r=a(9703),d=a(9201),l=a(5414),t=a(5234),h=a(4848);function p(){var s=(0,r.wR)(),e=s.resolvedTheme,a=(0,d.c)();(0,l.l)(e);var c=function(s){i().navigateTo({url:"/pages/shop/detail/index?id=".concat(s)})};return(0,h.jsx)(n.Ss,{className:"shop-page theme-".concat(e),children:(0,h.jsxs)(n.Ss,{className:"shop-list",children:[(0,h.jsxs)(n.Ss,{className:"shop-header",style:{paddingTop:"".concat(a.headerPaddingTop,"px")},children:[(0,h.jsx)(n.EY,{className:"shop-header-title",children:"\u667a\u7ed8\u7cbe\u9009"}),(0,h.jsx)(n.EY,{className:"shop-header-sub",children:"\u6fc0\u5149\u5fae\u96d5\u5b9a\u5236\u597d\u7269"})]}),(0,h.jsx)(n.Ss,{className:"shop-grid",children:t.zv.map(function(s){var e,a,o,i;return(0,h.jsxs)(n.Ss,{className:"shop-card",onTap:function(){return c(s.id)},children:[(0,h.jsx)(n.Ss,{className:"shop-card-img-wrap",children:(0,h.jsx)(n._V,{className:"shop-card-img",src:(null===(e=s.images)||void 0===e?void 0:e[0])||s.iconImg||"",mode:"aspectFill",lazyLoad:!0})}),(0,h.jsxs)(n.Ss,{className:"shop-card-info",style:{backgroundColor:"rgba(".concat((null===(a=s.tone)||void 0===a?void 0:a[0])||28,", ").concat((null===(o=s.tone)||void 0===o?void 0:o[1])||22,", ").concat((null===(i=s.tone)||void 0===i?void 0:i[2])||18,", 0.92)")},children:[(0,h.jsx)(n.EY,{className:"shop-card-name",children:s.name}),(0,h.jsxs)(n.EY,{className:"shop-card-price",children:["\xa5",s.price]})]})]},s.id)})}),(0,h.jsx)(n.Ss,{style:{height:"160px"}})]})})}var m={};Page((0,c.createPageConfig)(p,"pages/shop/index",{root:{cn:[]}},m||{}))}},function(s){var e=function(e){return s(s.s=e)};s.O(0,[907,96,76],function(){return e(6296)});s.O()}]);

package.json

@@ -9,7 +9,7 @@
     "css": "sass"
   },
   "scripts": {
-    "build:weapp": "taro build --type weapp",
+    "build:weapp": "npx taro build --type weapp",
     "build:swan": "taro build --type swan",
     "build:alipay": "taro build --type alipay",
     "build:tt": "taro build --type tt",
@@ -60,7 +60,7 @@
     "@babel/preset-react": "^7.24.1",
     "@babel/preset-typescript": "^7.24.1",
     "@pmmmwh/react-refresh-webpack-plugin": "^0.5.15",
-    "@tarojs/cli": "3.6.31",
+    "@tarojs/cli": "^3.6.31",
     "@tarojs/webpack5-runner": "3.6.31",
     "@types/react": "^18.0.0",
     "@types/webpack-env": "^1.18.4",

project.private.config.json

@@ -1,6 +1,6 @@
 {
   "libVersion": "3.17.0",
-  "projectname": "weixin_wordc",
+  "projectname": "wechat_wc",
   "condition": {},
   "setting": {
     "urlCheck": true,

src/app.config.ts

@@ -19,10 +19,11 @@ export default defineAppConfig({
     'pages/userDatabase/index'
   ],
   window: {
-    backgroundTextStyle: 'light',
+    backgroundTextStyle: 'dark',
     navigationStyle: 'custom',
-    backgroundColor: '#ffffff',
+    // 应用启动时先保证浅色页面的 iOS 状态栏为黑字；页面 Hook 会在主题变化时覆盖它。
-    darkmode: true
+    navigationBarTextStyle: 'black',
+    backgroundColor: '#ffffff'
   },
   tabBar: {
     custom: true,

src/app.scss

@@ -4,17 +4,17 @@
    ========================================================== */
 
 /* --- 页面根容器主题（.theme-light / .theme-dark 放在每个页面根 View 上）--- */
+/* 状态栏避让由各页面顶部元素（.page-header 等）通过 useSafeArea 注入的 padding/margin 承担，
+   这里不再用 env(safe-area-inset-top) 隐式下移，避免与 header 的避让叠加导致顶部留白过大 */
 .theme-light {
   min-height: 100vh;
   background-color: #ffffff;
-  padding-top: env(safe-area-inset-top, 0px);
   box-sizing: border-box;
 }
 
 .theme-dark {
   min-height: 100vh;
   background-color: #1e1e2f;
-  padding-top: env(safe-area-inset-top, 0px);
   box-sizing: border-box;
 }
 
@@ -216,15 +216,15 @@ page {
 
 /* === 自定义导航栏安全区适配 === */
 /* 所有页面的顶部虚线卡头部下移，避免与微信胶囊按钮重叠 */
+/* 仅作兜底；接了 useSafeArea 的页面用 inline style 覆盖此值 */
 .page-header {
-  padding-top: calc(env(safe-area-inset-top, 20px) + 48px) !important;
+  padding-top: calc(env(safe-area-inset-top, 20px) + 48px);
 }
 
-/* 特定无 header 但有返回箭头的页面兜底 */
+/* 返回按钮不单独占状态栏空间——父级 .page-header / .edit-header 已整体下移 */
 .back-btn,
 .edit-back {
   display: inline-block;
-  padding-top: env(safe-area-inset-top, 20px) !important;
 }
 
 /* ==========================================================

src/context/ThemeContext.tsx

@@ -18,6 +18,13 @@ const ThemeContext = createContext<ThemeContextValue>({
 
 export { ThemeContext }
 
+type ThemeChangeListener = (result: { theme?: string }) => void
+
+type ThemeChangeApi = {
+  onThemeChange?: (listener: ThemeChangeListener) => void
+  offThemeChange?: (listener: ThemeChangeListener) => void
+}
+
 export function ThemeProvider({ children }: { children: React.ReactNode }) {
   const [theme, set] = useState<ThemeMode>(getTheme())
   const [resolvedTheme, setResolved] = useState<'light' | 'dark'>(resolveTheme(getTheme()))
@@ -46,52 +53,16 @@ export function ThemeProvider({ children }: { children: React.ReactNode }) {
 
   // auto模式下监听系统主题变化
   useEffect(() => {
-    // 兼容：Taro.onThemeChange 在部分版本不稳定，直接用 wx API 兜底
     if (theme === 'auto') {
       // 先同步一次当前系统主题
       setResolved(resolveTheme('auto'))
-      const listener = (res: any) => {
+      const listener: ThemeChangeListener = (res) => {
         setResolved(res.theme === 'dark' ? 'dark' : 'light')
       }
-      // 每次小程序回到前台时重新检测系统主题（解决用户切出小程序去改系统主题后回来不刷新的问题）
+      const themeApi = Taro as typeof Taro & ThemeChangeApi
-      const appShowListener = () => {
+      themeApi.onThemeChange?.(listener)
-        setResolved(resolveTheme('auto'))
-      }
-      try {
-        // @ts-ignore
-        if (typeof wx !== 'undefined' && wx.onThemeChange) {
-          // @ts-ignore
-          wx.onThemeChange(listener)
-        }
-      } catch {}
-      try {
-        // @ts-ignore
-        if (typeof wx !== 'undefined' && wx.onAppShow) {
-          // @ts-ignore
-          wx.onAppShow(appShowListener)
-        }
-      } catch {}
-      // Taro 兜底
-      try {
-        // @ts-ignore
-        if (Taro.onThemeChange) {
-          // @ts-ignore
-          Taro.onThemeChange(listener)
-        }
-      } catch {}
       return () => {
-        try {
+        themeApi.offThemeChange?.(listener)
-          // @ts-ignore
-          if (wx.offThemeChange) wx.offThemeChange(listener)
-        } catch {}
-        try {
-          // @ts-ignore
-          if (wx.offAppShow) wx.offAppShow(appShowListener)
-        } catch {}
-        try {
-          // @ts-ignore
-          if (Taro.offThemeChange) Taro.offThemeChange(listener)
-        } catch {}
       }
     } else {
       updateResolved(theme)

src/hooks/useStatusBar.ts

@@ -0,0 +1,33 @@
+import { useCallback, useEffect } from 'react'
+import Taro, { useDidShow } from '@tarojs/taro'
+
+export interface UseStatusBarOptions {
+  /** 顶部系统状态栏（iOS 时间/电量）文字颜色模式：
+   * - 'auto'（默认）：跟随当前 App 主题，浅色黑字、深色白字
+   * - 'light'：强制白字（顶部是深色图片/背景的页面用）
+   * - 'dark'：强制黑字
+   */
+  mode?: 'auto' | 'light' | 'dark'
+}
+
+/**
+ * 同步当前页面的 iOS 系统状态栏（时间、电量）文字颜色。
+ * 每个页面只调用一次，避免全局 Provider 与页面生命周期竞争写入。
+ */
+export function useStatusBar(resolvedTheme: 'light' | 'dark', options: UseStatusBarOptions = {}) {
+  const { mode = 'auto' } = options
+
+  const apply = useCallback(() => {
+    const isDarkText = mode === 'dark' || (mode === 'auto' && resolvedTheme === 'light')
+    const frontColor = isDarkText ? '#000000' : '#ffffff'
+    const bgColor = isDarkText ? '#ffffff' : '#1e1e2f'
+
+    Taro.setNavigationBarColor({ frontColor, backgroundColor: bgColor })
+  }, [mode, resolvedTheme])
+
+  // 主题切换后立即更新当前页面。
+  useEffect(apply, [apply])
+
+  // 导航返回、切换 Tab 或从后台恢复后，以当前页面主题重新覆盖原生默认值。
+  useDidShow(apply)
+}

src/pages/address/index.tsx

@@ -5,9 +5,13 @@ import './index.scss'
 import { getAddressList, addAddress, updateAddress, deleteAddress } from '../../utils/store'
 import type { AddressItem } from '../../types'
 import { useThemeContext } from '../../context/ThemeContext'
+import { useSafeArea } from '../../hooks/useSafeArea'
+import { useStatusBar } from '../../hooks/useStatusBar'
 
 export default function AddressPage() {
   const { theme, resolvedTheme } = useThemeContext()
+  const safe = useSafeArea()
+  useStatusBar(resolvedTheme)
   const [list, setList] = useState<AddressItem[]>([])
   const [editing, setEditing] = useState<AddressItem | null>(null)
   const [showForm, setShowForm] = useState(false)
@@ -91,7 +95,7 @@ export default function AddressPage() {
     <View className={`theme-${resolvedTheme}`}>
       <View className='address-page'>
 
-        <View className='page-header dashed-card mt-20'>
+        <View className='page-header dashed-card mt-20' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
           <View className='star-badge' />
           <View className='flex-between' style={{ width: '100%' }}>
             <Text className='back-btn' onTap={() => Taro.navigateBack()}>←</Text>

src/pages/agreement/index.tsx

@@ -1,9 +1,13 @@
 import { View, Text } from '@tarojs/components'
 import './index.scss'
 import { useThemeContext } from '../../context/ThemeContext'
+import { useSafeArea } from '../../hooks/useSafeArea'
+import { useStatusBar } from '../../hooks/useStatusBar'
 
 export default function AgreementPage() {
   const { theme, resolvedTheme } = useThemeContext()
+  const safe = useSafeArea()
+  useStatusBar(resolvedTheme)
 
   const SECTIONS = [
     {
@@ -31,7 +35,7 @@ export default function AgreementPage() {
   return (
     <View className={`theme-${resolvedTheme}`}>
       <View className='agreement-page'>
-        <View className='agreement-content'>
+        <View className='agreement-content' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
           <Text className='agreement-title'>定制协议</Text>
           {SECTIONS.map((sec, idx) => (
             <View key={idx} className='agreement-section'>

src/pages/checkout/index.tsx

@@ -4,9 +4,13 @@ import { useState, useEffect } from 'react'
 import './index.scss'
 import { getDesignList, designToOrder, getDefaultAddress, getAddressList, type AddressItem } from '../../utils/store'
 import { useThemeContext } from '../../context/ThemeContext'
+import { useSafeArea } from '../../hooks/useSafeArea'
+import { useStatusBar } from '../../hooks/useStatusBar'
 
 export default function CheckoutPage() {
   const { theme, resolvedTheme } = useThemeContext()
+  const safe = useSafeArea()
+  useStatusBar(resolvedTheme)
   const [design, setDesign] = useState<any>(null)
   const [address, setAddress] = useState<AddressItem | null>(null)
   const [showAddrPicker, setShowAddrPicker] = useState(false)
@@ -56,7 +60,7 @@ export default function CheckoutPage() {
     return (
       <View className={`theme-${resolvedTheme}`}>
         <View className='checkout-page'>
-          <View className='page-header dashed-card mt-20'>
+          <View className='page-header dashed-card mt-20' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
             <Text className='page-title'>设计不存在</Text>
           </View>
         </View>
@@ -77,7 +81,7 @@ export default function CheckoutPage() {
     <View className={`theme-${resolvedTheme}`}>
       <View className='checkout-page'>
 
-        <View className='page-header dashed-card mt-20'>
+        <View className='page-header dashed-card mt-20' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
           <View className='star-badge' />
           <View className='flex-between' style={{ width: '100%' }}>
             <Text className='back-btn' onTap={() => Taro.navigateBack()}>←</Text>

src/pages/designList/index.tsx

@@ -5,6 +5,8 @@ import './index.scss'
 import { getDesignList, removeDesigns, type DesignItem } from '../../utils/store'
 import { PRODUCT_ICON_MAP } from '../../utils/productConfig'
 import { useThemeContext } from '../../context/ThemeContext'
+import { useSafeArea } from '../../hooks/useSafeArea'
+import { useStatusBar } from '../../hooks/useStatusBar'
 import LoginGuard from '../../components/LoginGuard'
 
 const STATUS_TABS = [
@@ -23,6 +25,8 @@ const STATUS_STYLE: Record<string, { label: string; cls: string }> = {
 
 export default function DesignListPage() {
   const { resolvedTheme } = useThemeContext()
+  const safe = useSafeArea()
+  useStatusBar(resolvedTheme)
   const [activeTab, setActiveTab] = useState('all')
   const [list, setList] = useState<DesignItem[]>([])
   const [managing, setManaging] = useState(false)
@@ -113,7 +117,7 @@ export default function DesignListPage() {
     <View className={`theme-${resolvedTheme}`}>
       <LoginGuard>
         <View className='design-page'>
-          <View className='page-header dashed-card mt-20'>
+          <View className='page-header dashed-card mt-20' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
             <View className='flex-between' style={{ width: '100%' }}>
               <Text className='back-btn' onTap={() => Taro.navigateBack()}>←</Text>
               <Text className='page-title'>我的设计清单</Text>

src/pages/diy/index.tsx

@@ -5,9 +5,13 @@ import './index.scss'
 import { getProductById } from '../../utils/productConfig'
 import { getDesignList, setDesignList, updateDesign, type DesignItem, type StickerItem } from '../../utils/store'
 import { useThemeContext } from '../../context/ThemeContext'
+import { useSafeArea } from '../../hooks/useSafeArea'
+import { useStatusBar } from '../../hooks/useStatusBar'
 
 export default function DIYPage() {
   const { theme, resolvedTheme } = useThemeContext()
+  const safe = useSafeArea()
+  useStatusBar(resolvedTheme)
   const [category, setCategory] = useState<any>(null)
   const [step, setStep] = useState(1)
   const [designId, setDesignId] = useState('')
@@ -264,7 +268,7 @@ export default function DIYPage() {
     <View className={`theme-${resolvedTheme}`}>
       <View className='diy-page'>
 
-        <View className='page-header dashed-card mt-20'>
+        <View className='page-header dashed-card mt-20' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
           <View className='star-badge' />
           <View className='flex-between' style={{ width: '100%' }}>
             <Text className='back-btn' onTap={goBack}>←</Text>

src/pages/diy/stickerEdit/index.tsx

@@ -5,6 +5,8 @@ import './index.scss'
 import { getProductById } from '../../../utils/productConfig'
 import { getDesignList, setDesignList, updateDesign, type DesignItem, type StickerItem } from '../../../utils/store'
 import { useThemeContext } from '../../../context/ThemeContext'
+import { useSafeArea } from '../../../hooks/useSafeArea'
+import { useStatusBar } from '../../../hooks/useStatusBar'
 
 /* ============================================================
    使用 Canvas 实现贴纸编辑（亮度/色相/线稿）
@@ -77,6 +79,8 @@ function TouchSlider({ value, min, max, step = 1, onChange, format }: SliderProp
 
 export default function StickerEditPage() {
   const { resolvedTheme } = useThemeContext()
+  const safe = useSafeArea()
+  useStatusBar(resolvedTheme)
   const [designId, setDesignId] = useState('')
   const [stickerId, setStickerId] = useState('')
   const [sticker, setSticker] = useState<StickerItem | null>(null)
@@ -302,7 +306,7 @@ export default function StickerEditPage() {
     <View className={`theme-${resolvedTheme}`}>
       <View className='sticker-edit-page'>
         {/* Header */}
-        <View className='edit-header'>
+        <View className='edit-header' style={{ paddingTop: `${safe.headerPaddingTop}px` }}>
           <Text className='edit-back' onTap={() => Taro.navigateBack()}>←</Text>
           <Text className='edit-title'>编辑贴纸</Text>
           <Text className='edit-save' onTap={handleSave}>保存</Text>

src/pages/index/index.tsx

@@ -4,6 +4,8 @@ import { useState } from 'react'
 import './index.scss'
 import { CATEGORIES } from '../../utils/productConfig'
 import { useThemeContext } from '../../context/ThemeContext'
+import { useSafeArea } from '../../hooks/useSafeArea'
+import { useStatusBar } from '../../hooks/useStatusBar'
 
 // 成品展示配图（从 img 里取对应实物图）
 const SHOWCASE_LIST = [
@@ -26,6 +28,8 @@ const PRODUCT_IMG_MAP: Record<string, string> = {
 
 export default function Index() {
   const { theme, resolvedTheme } = useThemeContext()
+  const safe = useSafeArea()
+  useStatusBar(resolvedTheme)
   const [searchKey, setSearchKey] = useState('')
 
   const navigateToProduct = (categoryId: string) => {
@@ -47,7 +51,7 @@ export default function Index() {
       <View className='index-page'>
 
         {/* 顶部标题栏 */}
-        <View className='header-bar'>
+        <View className='header-bar' style={{ paddingTop: `${safe.headerPaddingTop}px` }}>
           <Text className='header-title'>智绘微刻</Text>
         </View>
 

src/pages/orderDetail/index.tsx

@@ -3,11 +3,15 @@ import Taro from '@tarojs/taro'
 import { useState, useEffect } from 'react'
 import './index.scss'
 import { useThemeContext } from '../../context/ThemeContext'
+import { useSafeArea } from '../../hooks/useSafeArea'
+import { useStatusBar } from '../../hooks/useStatusBar'
 import { getOrderList, getDefaultAddress, getAddressList, type AddressItem, type OrderItem } from '../../utils/store'
 import { PRODUCT_ICON_MAP } from '../../utils/productConfig'
 
 export default function OrderDetailPage() {
   const { theme, resolvedTheme } = useThemeContext()
+  const safe = useSafeArea()
+  useStatusBar(resolvedTheme)
   const params = Taro.getCurrentInstance().router?.params
   const orderId = params?.orderId || ''
 
@@ -48,7 +52,7 @@ export default function OrderDetailPage() {
     return (
       <View className={`theme-${resolvedTheme}`}>
         <View className='order-detail-page'>
-          <View className='page-header dashed-card mt-20'>
+          <View className='page-header dashed-card mt-20' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
             <Text className='page-title'>订单不存在</Text>
           </View>
         </View>
@@ -60,7 +64,7 @@ export default function OrderDetailPage() {
     <View className={`theme-${resolvedTheme}`}>
       <View className='order-detail-page'>
 
-        <View className='page-header dashed-card mt-20'>
+        <View className='page-header dashed-card mt-20' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
           <View className='star-badge' />
           <View className='flex-between' style={{ width: '100%' }}>
             <Text className='back-btn' onTap={() => Taro.navigateBack()}>←</Text>

src/pages/orders/index.scss

@@ -4,7 +4,7 @@
 }
 
 .page-header {
-  padding: calc(env(safe-area-inset-top, 0px) + 44px) 32px 24px !important;
+  padding: 32px 32px 24px;
   margin: 20px 0 0;
 }
 

src/pages/orders/index.tsx

@@ -5,6 +5,8 @@ import './index.scss'
 import { getOrderList, type OrderItem } from '../../utils/store'
 import { PRODUCT_ICON_MAP } from '../../utils/productConfig'
 import { useThemeContext } from '../../context/ThemeContext'
+import { useSafeArea } from '../../hooks/useSafeArea'
+import { useStatusBar } from '../../hooks/useStatusBar'
 import LoginGuard from '../../components/LoginGuard'
 
 const STATUS_TABS = [
@@ -25,6 +27,8 @@ const STATUS_MAP: Record<string, { label: string; badge: string }> = {
 
 export default function OrdersPage() {
   const { theme, resolvedTheme } = useThemeContext()
+  const safe = useSafeArea()
+  useStatusBar(resolvedTheme)
   const [activeTab, setActiveTab] = useState('all')
   const [orders, setOrders] = useState<OrderItem[]>([])
 
@@ -74,7 +78,7 @@ export default function OrdersPage() {
       <LoginGuard>
         <View className='orders-page'>
 
-          <View className='page-header dashed-card mt-20'>
+          <View className='page-header dashed-card mt-20' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
             <View className='star-badge' />
             <Text className='page-title'>我的订单</Text>
           </View>

src/pages/product/index.tsx

@@ -5,12 +5,16 @@ import './index.scss'
 import { getProductById } from '../../utils/productConfig'
 import { addDesign } from '../../utils/store'
 import { useThemeContext } from '../../context/ThemeContext'
+import { useSafeArea } from '../../hooks/useSafeArea'
+import { useStatusBar } from '../../hooks/useStatusBar'
 import { getProductIconImg } from '../../utils/productConfig'
 
 const HERO_COLORS = ['#FFE4EC', '#FFF0F5', '#FCE4EC']
 
 export default function ProductPage() {
   const { theme, resolvedTheme } = useThemeContext()
+  const safe = useSafeArea()
+  useStatusBar(resolvedTheme)
   const [showModal, setShowModal] = useState(false)
   const [quantity, setQuantity] = useState(1)
 
@@ -22,7 +26,7 @@ export default function ProductPage() {
     return (
       <View className={`theme-${resolvedTheme}`}>
         <View className='product-page'>
-          <View className='page-header dashed-card mt-20'>
+          <View className='page-header dashed-card mt-20' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
             <Text className='page-title'>商品未找到</Text>
           </View>
         </View>
@@ -56,7 +60,7 @@ export default function ProductPage() {
     <View className={`theme-${resolvedTheme}`}>
       <View className='product-page'>
 
-        <View className='page-header dashed-card mt-20'>
+        <View className='page-header dashed-card mt-20' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
           <View className='star-badge' />
           <View className='flex-between'>
             <Text className='back-btn' onTap={() => Taro.navigateBack()}>←</Text>

src/pages/profile/index.tsx

@@ -4,6 +4,8 @@ import { useState } from 'react'
 import './index.scss'
 import { getOrderList, getUserInfo, setUserInfo, getDesignList } from '../../utils/store'
 import { useThemeContext } from '../../context/ThemeContext'
+import { useSafeArea } from '../../hooks/useSafeArea'
+import { useStatusBar } from '../../hooks/useStatusBar'
 
 const ICON_MAP: Record<string, string> = {
   '我的设计': '/icon/调色盘.png',
@@ -33,6 +35,8 @@ const MENU_ITEMS = [
 
 export default function ProfilePage() {
   const { theme, resolvedTheme } = useThemeContext()
+  const safe = useSafeArea()
+  useStatusBar(resolvedTheme)
   const [isLoggedIn, setIsLoggedIn] = useState(false)
   const [userInfo, setUserInfoState] = useState({ nickName: '', avatarUrl: '' })
   const [showLogin, setShowLogin] = useState(false)
@@ -166,7 +170,7 @@ export default function ProfilePage() {
       <View className='profile-page'>
 
         {/* 用户信息头部 */}
-        <View className='profile-header dashed-card mt-20'>
+        <View className='profile-header dashed-card mt-20' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
           <View className='star-badge' />
           <View className='user-info'>
             {isLoggedIn && userInfo.avatarUrl ? (

src/pages/service/index.scss

@@ -4,7 +4,7 @@
 }
 
 .page-header {
-  padding: calc(env(safe-area-inset-top, 0px) + 44px) 32px 24px !important;
+  padding: 32px 32px 24px;
   margin: 20px 0 0;
 }
 

src/pages/service/index.tsx

@@ -2,6 +2,8 @@ import { View, Text, Image } from '@tarojs/components'
 import Taro from '@tarojs/taro'
 import './index.scss'
 import { useThemeContext } from '../../context/ThemeContext'
+import { useSafeArea } from '../../hooks/useSafeArea'
+import { useStatusBar } from '../../hooks/useStatusBar'
 
 const FAQ_ITEMS = [
   { q: '定制周期需要多久？', a: '通常下单后3-5个工作日内发货，批量订单（50件以上）可能需要7-10个工作日。' },
@@ -12,11 +14,13 @@ const FAQ_ITEMS = [
 
 export default function ServicePage() {
   const { theme, resolvedTheme } = useThemeContext()
+  const safe = useSafeArea()
+  useStatusBar(resolvedTheme)
 
   return (
     <View className={`theme-${resolvedTheme}`} style={{ minHeight: '100vh' }}>
       <View className='service-page'>
-        <View className='page-header dashed-card mt-20'>
+        <View className='page-header dashed-card mt-20' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
           <View className='star-badge' />
           <Text className='page-title'>联系客服</Text>
         </View>

src/pages/settings/index.tsx

@@ -3,6 +3,8 @@ import Taro from '@tarojs/taro'
 import { useState, useEffect, useCallback } from 'react'
 import './index.scss'
 import { useThemeContext } from '../../context/ThemeContext'
+import { useSafeArea } from '../../hooks/useSafeArea'
+import { useStatusBar } from '../../hooks/useStatusBar'
 import { getUserInfo, setUserInfo, clearUserInfo, getAddressList, getDefaultAddress, type AddressItem } from '../../utils/store'
 
 const THEME_OPTIONS: { label: string; value: 'light' | 'dark' | 'auto' }[] = [
@@ -20,6 +22,8 @@ const MENU = [
 
 export default function SettingsPage() {
   const { theme, setTheme, resolvedTheme } = useThemeContext()
+  const safe = useSafeArea()
+  useStatusBar(resolvedTheme)
   const [user, setUser] = useState<any>({})
   const [editName, setEditName] = useState('')
   const [editAvatar, setEditAvatar] = useState('')
@@ -65,7 +69,7 @@ export default function SettingsPage() {
       <View className='settings-page'>
         <View className='settings-area'>
 
-          <View className='page-header dashed-card mt-20'>
+          <View className='page-header dashed-card mt-20' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
             <View className='flex-between' style={{ width: '100%' }}>
               <Text className='back-btn' onTap={() => Taro.navigateBack()}>←</Text>
               <Text className='page-title'>设置</Text>

src/pages/shop/detail/index.config.ts

@@ -1,3 +1,5 @@
 export default definePageConfig({
-  navigationStyle: 'custom'
+  navigationStyle: 'custom',
+  // 顶部为深色商品大图，状态栏文字设为白色，确保 iOS 时间/电量可见
+  navigationBarTextStyle: 'white'
 })

src/pages/shop/detail/index.tsx

@@ -4,14 +4,21 @@ import { useState, useEffect, useCallback, useMemo } from 'react'
 import './index.scss'
 import { PRODUCTS } from '../../../utils/productConfig'
 import { ProductCategory } from '../../../types'
+import { useSafeArea } from '../../../hooks/useSafeArea'
+import { useStatusBar } from '../../../hooks/useStatusBar'
+import { useThemeContext } from '../../../context/ThemeContext'
 
 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
 const easeOut = (t: number) => 1 - Math.pow(1 - t, 3)
 
 export default function ShopDetailPage() {
+  const { resolvedTheme } = useThemeContext()
   const [winHeight, setWinHeight] = useState(667)
   const [progress, setProgress] = useState(0)
+  const safe = useSafeArea()
+  // 顶部为沉浸式商品图，状态栏始终使用白字。
+  useStatusBar(resolvedTheme, { mode: 'light' })
 
   const routerParams = Taro.getCurrentInstance().router?.params
   const productId = routerParams?.id || ''
@@ -174,6 +181,7 @@ export default function ShopDetailPage() {
           <View
             className="shop-band"
             style={{
+              top: `${safe.statusBarHeight}px`,
               opacity: heroStyles.bandOpacity,
               backgroundColor: `rgba(${tone[0]}, ${tone[1]}, ${tone[2]}, 0.88)`,
               backdropFilter: 'blur(12px)',
@@ -251,7 +259,7 @@ export default function ShopDetailPage() {
       <View
         className="shop-back-btn"
         onTap={() => Taro.navigateBack()}
-        style={{ opacity: heroStyles.backBtnOpacity }}
+        style={{ top: `${safe.backBtnPaddingTop}px`, opacity: heroStyles.backBtnOpacity }}
       >
         <Text className="shop-back-arrow">←</Text>
       </View>

src/pages/shop/index.tsx

@@ -1,11 +1,15 @@
 import { View, Text, Image } from '@tarojs/components'
 import Taro from '@tarojs/taro'
 import { useThemeContext } from '../../context/ThemeContext'
+import { useSafeArea } from '../../hooks/useSafeArea'
+import { useStatusBar } from '../../hooks/useStatusBar'
 import './index.scss'
 import { PRODUCTS } from '../../utils/productConfig'
 
 export default function ShopPage() {
   const { resolvedTheme } = useThemeContext()
+  const safe = useSafeArea()
+  useStatusBar(resolvedTheme)
 
   const openDetail = (productId: string) => {
     Taro.navigateTo({ url: `/pages/shop/detail/index?id=${productId}` })
@@ -14,7 +18,7 @@ export default function ShopPage() {
   return (
     <View className={`shop-page theme-${resolvedTheme}`}>
       <View className="shop-list">
-        <View className="shop-header">
+        <View className="shop-header" style={{ paddingTop: `${safe.headerPaddingTop}px` }}>
           <Text className="shop-header-title">智绘精选</Text>
           <Text className="shop-header-sub">激光微雕定制好物</Text>
         </View>

src/pages/userDatabase/index.tsx

@@ -11,9 +11,13 @@ import {
   verifyAdminPassword
 } from '../../utils/store'
 import { useThemeContext } from '../../context/ThemeContext'
+import { useSafeArea } from '../../hooks/useSafeArea'
+import { useStatusBar } from '../../hooks/useStatusBar'
 
 export default function UserDatabasePage() {
   const { theme, resolvedTheme } = useThemeContext()
+  const safe = useSafeArea()
+  useStatusBar(resolvedTheme)
   const [isUnlocked, setIsUnlocked] = useState(false)
   const [password, setPassword] = useState('')
   const [pwdError, setPwdError] = useState(false)
@@ -108,7 +112,7 @@ export default function UserDatabasePage() {
     <View className={`theme-${resolvedTheme}`}>
       <View className='udb-page'>
 
-        <View className='page-header dashed-card mt-20'>
+        <View className='page-header dashed-card mt-20' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
           <View className='star-badge' />
           <Text className='page-title'>本地用户数据库</Text>
         </View>

src/pages/wordcloud/index.scss

@@ -5,7 +5,7 @@
 
 /* 顶部导航 */
 .page-header {
-  padding: calc(env(safe-area-inset-top, 0px) + 44px) 32px 24px !important;
+  padding: calc(env(safe-area-inset-top, 0px) + 44px) 32px 24px;
   margin: 20px 0 0;
   background: transparent;
 }

src/pages/wordcloud/index.tsx

@@ -3,9 +3,13 @@ import Taro from '@tarojs/taro'
 import { useState } from 'react'
 import './index.scss'
 import { useThemeContext } from '../../context/ThemeContext'
+import { useSafeArea } from '../../hooks/useSafeArea'
+import { useStatusBar } from '../../hooks/useStatusBar'
 
 export default function WordCloudPage() {
   const { theme, resolvedTheme } = useThemeContext()
+  const safe = useSafeArea()
+  useStatusBar(resolvedTheme)
   const [step, setStep] = useState(1)
   const [baseImage, setBaseImage] = useState('')
   const [namesText, setNamesText] = useState('')
@@ -59,7 +63,7 @@ export default function WordCloudPage() {
     <View className={`theme-${resolvedTheme}`}>
       <View className='wordcloud-page'>
 
-        <View className='page-header flex-between'>
+        <View className='page-header flex-between' style={{ paddingTop: `${safe.headerPaddingTop}px` }}>
           <Text className='back-btn' onTap={goBack}>←</Text>
           <Text className='page-title'>AI词云生成</Text>
           <View style={{ width: '60px' }} />