feat: 全站视觉焕新与悬浮玻璃 TabBar 迁移

dist/custom-tab-bar/index.js

@@ -1 +1 @@
-"use strict";(wx["webpackJsonp"]=wx["webpackJsonp"]||[]).push([[777],{653:function(n,e,t){var a=t(7842),i=t(5544),c=t(118),o=t(758),r=t.n(o),u=t(6540),s=t(8594),l=t(9703),v=t(6606),g=t(8199),f=t(4848),p=[{pagePath:"/pages/index/index",label:"\u9996\u9875",icon:(0,g.uq)("/icon/\u9996\u9875.svg"),iconActive:(0,g.uq)("/icon/\u9996\u9875-fill.svg")},{pagePath:"/pages/shop/index",label:"\u5546\u54c1",icon:(0,g.uq)("/icon/\u5546\u54c1.svg"),iconActive:(0,g.uq)("/icon/\u5546\u54c1-fill.svg")},{pagePath:"/pages/designList/index",label:"\u8bbe\u8ba1\u6e05\u5355",icon:(0,g.uq)("/icon/\u8c03\u8272\u76d8.svg"),iconActive:(0,g.uq)("/icon/\u8c03\u8272\u76d8-fill.svg")},{pagePath:"/pages/orders/index",label:"\u8ba2\u5355",icon:(0,g.uq)("/icon/\u5305\u88f9.svg"),iconActive:(0,g.uq)("/icon/\u5305\u88f9-fill.svg")},{pagePath:"/pages/profile/index",label:"\u6211\u7684",icon:(0,g.uq)("/icon/\u4e2a\u4eba.svg"),iconActive:(0,g.uq)("/icon/\u4e2a\u4eba-fill.svg")}];function d(n){var e=p.findIndex(function(e){return n.endsWith(e.pagePath)});return p[e>=0?e:0].pagePath}function h(){var n,e=(null===(n=r().getCurrentInstance().router)||void 0===n?void 0:n.path)||"pages/index/index";return d(e)}function b(){var n=(0,u.useState)((0,s.eW)((0,s.O4)())),e=(0,i.A)(n,2),t=e[0],a=e[1],o=(0,u.useState)(h),g=(0,i.A)(o,2),b=g[0],x=g[1];(0,u.useEffect)(function(){var n=function(n){return a(n)};return r().eventCenter.on(l.Wo,n),function(){r().eventCenter.off(l.Wo,n)}},[]),(0,u.useEffect)(function(){var n=function(n){var e;x(d(n||(null===(e=r().getCurrentInstance().router)||void 0===e?void 0:e.path)||"pages/index/index"))};return r().eventCenter.on("tabBarChange",n),function(){r().eventCenter.off("tabBarChange",n)}},[]),(0,u.useEffect)(function(){(0,v.G)(t)},[t]);var m=function(n){var e;x(d(n)),r().switchTab({url:n}),null===(e=r().eventCenter)||void 0===e||e.trigger("tabBarChange",n)};return(0,f.jsx)(c.Ss,{className:"custom-tab-bar theme-".concat(t),children:p.map(function(n){var e=n.pagePath===b;return(0,f.jsxs)(c.Ss,{className:"tab-item ".concat(e?"active":""),onTap:function(){return m(n.pagePath)},children:[(0,f.jsx)(c._V,{className:"tab-icon-img ".concat(e?"active":""),src:e?n.iconActive:n.icon,mode:"aspectFit"}),(0,f.jsx)(c.EY,{className:"tab-label",children:n.label})]},n.pagePath)})})}Component((0,a.createComponentConfig)(b,"custom-tab-bar/index"))}},function(n){var e=function(e){return n(n.s=e)};n.O(0,[907,96,76],function(){return e(653)});n.O()}]);
+"use strict";(wx["webpackJsonp"]=wx["webpackJsonp"]||[]).push([[777],{653:function(e,n,t){var a=t(7842),i=t(5544),c=t(118),o=t(758),r=t.n(o),s=t(6540),u=t(8594),f=t(9703),g=t(6606),h=t(8199),l=t(4848),v=[{pagePath:"/pages/index/index",label:"\u9996\u9875",icon:(0,h.uq)("/icon/\u9996\u9875.svg"),iconActive:(0,h.uq)("/icon/\u9996\u9875-fill.svg")},{pagePath:"/pages/shop/index",label:"\u5546\u54c1",icon:(0,h.uq)("/icon/\u5546\u54c1.svg"),iconActive:(0,h.uq)("/icon/\u5546\u54c1-fill.svg")},{pagePath:"/pages/designList/index",label:"\u8bbe\u8ba1\u6e05\u5355",icon:(0,h.uq)("/icon/\u8c03\u8272\u76d8.svg"),iconActive:(0,h.uq)("/icon/\u8c03\u8272\u76d8-fill.svg")},{pagePath:"/pages/orders/index",label:"\u8ba2\u5355",icon:(0,h.uq)("/icon/\u5305\u88f9.svg"),iconActive:(0,h.uq)("/icon/\u5305\u88f9-fill.svg")},{pagePath:"/pages/profile/index",label:"\u6211\u7684",icon:(0,h.uq)("/icon/\u4e2a\u4eba.svg"),iconActive:(0,h.uq)("/icon/\u4e2a\u4eba-fill.svg")}];function p(e){var n=v.findIndex(function(n){return e.endsWith(n.pagePath)});return v[n>=0?n:0].pagePath}function b(){var e=r().getCurrentInstance().router,n=e&&e.path?e.path:"pages/index/index";return p(n)}function m(){var e=(0,s.useState)((0,u.eW)((0,u.O4)())),n=(0,i.A)(e,2),t=n[0],a=n[1],o=(0,s.useState)(b),h=(0,i.A)(o,2),m=h[0],d=h[1];(0,s.useEffect)(function(){var e=function(e){return a(e)};return r().eventCenter.on(f.Wo,e),function(){r().eventCenter.off(f.Wo,e)}},[]),(0,s.useEffect)(function(){var e=function(e){!e||"dark"!==e.theme&&"light"!==e.theme||((0,u.Rq)(e.theme),"auto"===(0,u.O4)()&&a(e.theme))},n=r();return n.onThemeChange&&n.onThemeChange(e),function(){n.offThemeChange&&n.offThemeChange(e)}},[]),(0,s.useEffect)(function(){var e=function(e){var n=r().getCurrentInstance().router,t=n&&n.path?n.path:"pages/index/index";d(p(e||t))};return r().eventCenter.on("tabBarChange",e),function(){r().eventCenter.off("tabBarChange",e)}},[]),(0,s.useEffect)(function(){(0,g.G)(t)},[t]);var x=function(e){d(p(e)),r().switchTab({url:e}),r().eventCenter.trigger("tabBarChange",e)};return(0,l.jsxs)(c.Ss,{className:"tab-bar-root theme-".concat(t),children:[(0,l.jsx)(c.Ss,{className:"tab-bar-gradient"}),(0,l.jsx)(c.Ss,{className:"custom-tab-bar theme-".concat(t),children:v.map(function(e){var n=e.pagePath===m;return(0,l.jsxs)(c.Ss,{className:"tab-item ".concat(n?"active":""),onTap:function(){return x(e.pagePath)},children:[n&&(0,l.jsx)(c.Ss,{className:"tab-indicator"}),(0,l.jsx)(c._V,{className:"tab-icon-img ".concat(n?"active":""),src:n?e.iconActive:e.icon,mode:"aspectFit"}),(0,l.jsx)(c.EY,{className:"tab-label",children:e.label})]},e.pagePath)})})]})}Component((0,a.createComponentConfig)(m,"custom-tab-bar/index"))}},function(e){var n=function(n){return e(e.s=n)};e.O(0,[907,96,76],function(){return n(653)});e.O()}]);

dist/custom-tab-bar/index.wxss

@@ -1 +1 @@
-.custom-tab-bar{-ms-flex-pack:distribute;-ms-flex-align:center;-webkit-align-items:center;align-items:center;backdrop-filter:blur(20rpx);-webkit-backdrop-filter:blur(20rpx);background:hsla(0,0%,100%,.78);bottom:0;-webkit-box-shadow:0 -8rpx 20rpx rgba(0,0,0,.08);box-shadow:0 -8rpx 20rpx rgba(0,0,0,.08);-webkit-box-sizing:border-box;box-sizing:border-box;display:-webkit-flex;display:-ms-flexbox;display:flex;height:calc(96rpx + constant(safe-area-inset-bottom));height:calc(96rpx + env(safe-area-inset-bottom));-webkit-justify-content:space-around;justify-content:space-around;left:0;padding-bottom:env(safe-area-inset-bottom);position:fixed;right:0;z-index:1000}.custom-tab-bar.theme-dark{backdrop-filter:blur(20rpx);-webkit-backdrop-filter:blur(20rpx);background:rgba(25,25,25,.78);-webkit-box-shadow:0 -8rpx 20rpx rgba(0,0,0,.45);box-shadow:0 -8rpx 20rpx rgba(0,0,0,.45)}.tab-item{-ms-flex-align:center;-ms-flex-pack:center;-webkit-align-items:center;align-items:center;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex:1;-ms-flex:1;flex:1;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-justify-content:center;justify-content:center;max-width:160rpx;padding:0 12rpx;position:relative}.tab-icon-img{height:40rpx;margin-bottom:2rpx;opacity:.8;-webkit-transition:-webkit-transform .2s;transition:-webkit-transform .2s;transition:transform .2s;transition:transform .2s,-webkit-transform .2s;width:40rpx}.tab-item.active .tab-icon-img{opacity:1;-webkit-transform:scale(1.08);-ms-transform:scale(1.08);transform:scale(1.08)}.tab-label{color:#b08d8d;font-size:20rpx;font-weight:700;line-height:22rpx;-webkit-transition:color .2s;transition:color .2s}.custom-tab-bar.theme-dark .tab-label{color:#999}.tab-item.active .tab-label{color:#ff9a9e}.custom-tab-bar.theme-dark .tab-item.active .tab-label{color:#ff7eb3}
+.tab-bar-root{bottom:0;height:160rpx;left:0;pointer-events:none;position:fixed;right:0;z-index:999}.tab-bar-gradient{bottom:0;height:100%;left:0;position:absolute;right:0}.tab-bar-root.theme-light .tab-bar-gradient{background:-webkit-gradient(linear,left bottom,left top,from(hsla(38,44%,96%,.5)),color-stop(50%,hsla(38,44%,96%,.1)),color-stop(86%,hsla(38,44%,96%,0)));background:-webkit-linear-gradient(bottom,hsla(38,44%,96%,.5),hsla(38,44%,96%,.1) 50%,hsla(38,44%,96%,0) 86%);background:linear-gradient(0deg,hsla(38,44%,96%,.5) 0,hsla(38,44%,96%,.1) 50%,hsla(38,44%,96%,0) 86%)}.tab-bar-root.theme-dark .tab-bar-gradient{background:-webkit-gradient(linear,left bottom,left top,from(rgba(25,25,25,.5)),color-stop(50%,rgba(25,25,25,.1)),color-stop(86%,rgba(25,25,25,0)));background:-webkit-linear-gradient(bottom,rgba(25,25,25,.5),rgba(25,25,25,.1) 50%,rgba(25,25,25,0) 86%);background:linear-gradient(0deg,rgba(25,25,25,.5) 0,rgba(25,25,25,.1) 50%,rgba(25,25,25,0) 86%)}.custom-tab-bar{-ms-flex-pack:distribute;-ms-flex-align:center;-webkit-align-items:center;align-items:center;backdrop-filter:blur(32rpx) saturate(1.2);-webkit-backdrop-filter:blur(32rpx) saturate(1.2);background:hsla(0,0%,100%,.55);border:1rpx solid hsla(0,0%,100%,.55);border-radius:64rpx;bottom:36rpx;-webkit-box-shadow:0 12rpx 40rpx rgba(0,0,0,.18),0 4rpx 12rpx rgba(0,0,0,.08);box-shadow:0 12rpx 40rpx rgba(0,0,0,.18),0 4rpx 12rpx rgba(0,0,0,.08);-webkit-box-sizing:border-box;box-sizing:border-box;display:-webkit-flex;display:-ms-flexbox;display:flex;height:116rpx;-webkit-justify-content:space-around;justify-content:space-around;left:36rpx;pointer-events:auto;position:absolute;right:36rpx;z-index:1000}.custom-tab-bar.theme-dark{backdrop-filter:blur(32rpx) saturate(1.2);-webkit-backdrop-filter:blur(32rpx) saturate(1.2);background:rgba(25,25,25,.55);border-color:hsla(0,0%,100%,.14);-webkit-box-shadow:0 12rpx 40rpx rgba(0,0,0,.5),0 4rpx 12rpx rgba(0,0,0,.3);box-shadow:0 12rpx 40rpx rgba(0,0,0,.5),0 4rpx 12rpx rgba(0,0,0,.3)}.tab-item{-ms-flex-align:center;-ms-flex-pack:center;-webkit-align-items:center;align-items:center;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex:1;-ms-flex:1;flex:1;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;height:100%;-webkit-justify-content:center;justify-content:center;max-width:160rpx;padding:0 12rpx;position:relative}.tab-indicator{background:rgba(0,0,0,.14);border-radius:50rpx;bottom:6rpx;-webkit-box-shadow:0 0 6rpx rgba(0,0,0,.07);box-shadow:0 0 6rpx rgba(0,0,0,.07);height:100rpx;left:50%;position:absolute;-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translateX(-50%);width:120rpx}.custom-tab-bar.theme-dark .tab-indicator{background:hsla(0,0%,100%,.14);-webkit-box-shadow:0 0 6rpx hsla(0,0%,100%,.07);box-shadow:0 0 6rpx hsla(0,0%,100%,.07)}.tab-icon-img{height:40rpx;margin-bottom:2rpx;opacity:.8;position:relative;-webkit-transition:-webkit-transform .2s;transition:-webkit-transform .2s;transition:transform .2s;transition:transform .2s,-webkit-transform .2s;width:40rpx;z-index:1}.tab-item.active .tab-icon-img{opacity:1;-webkit-transform:scale(1.08);-ms-transform:scale(1.08);transform:scale(1.08)}.tab-label{color:#8a7e76;font-size:20rpx;font-weight:700;line-height:22rpx;position:relative;-webkit-transition:color .2s;transition:color .2s;z-index:1}.custom-tab-bar.theme-dark .tab-label{color:#b3a79c}.tab-item.active .tab-label{color:#d96c6a}.custom-tab-bar.theme-dark .tab-item.active .tab-label{color:#f09198}