style: 用户中心/钱包/登录页扁平化与轻动效

个人中心菜单行与钱包卡片按压反馈、钱包tab选中加粗+下划线过渡、列表行按压；登录按钮按压加深；列表页底色统一青调灰；pages.json 各页导航栏底色统一 #F4F7F6

charge-front/src/pages-user/wallet/wallet.vue

@@ -46,7 +46,8 @@
             class="flex-align-center fs-30 mr-60"
             :style="{
             color:
-              tab === item.value ? 'rgba(0, 0, 0, 1);' : 'rgba(0, 0, 0, 0.6);',
+              tab === item.value ? '#1c2b29;' : '#5c6b69;',
+            fontWeight: tab === item.value ? '600' : '400',
           }"
             @click="changeTab(index)"
         >{{
@@ -61,7 +62,9 @@
       </view>
       <view class="list pl-30 pr-30">
         <view
-            class="item flex-align-center"
+            class="item flex-align-center pressable"
+            hover-class="pressed"
+            hover-stay-time="80"
             v-for="(item, index) in dataList"
             :key="index"
             @click="detail(index)"
@@ -336,6 +339,7 @@ const detail = (index: number) => {
       & > view {
         position: relative;
         height: 72rpx;
+        transition: opacity 0.22s cubic-bezier(0.22, 1, 0.36, 1);
 
         .active {
           position: absolute;
@@ -343,9 +347,10 @@ const detail = (index: number) => {
           bottom: 0px;
           transform: translateX(-50%);
           width: 40rpx;
-          height: 4rpx;
-          border-radius: 4rpx;
+          height: 6rpx;
+          border-radius: 6rpx;
           background-color: var(--color-primary);
+          transition: opacity 0.22s cubic-bezier(0.22, 1, 0.36, 1);
         }
       }
     }
@@ -353,7 +358,7 @@ const detail = (index: number) => {
     .list {
       .item {
         height: 130rpx;
-        border-bottom: 1rpx solid rgba(0, 0, 0, 0.1);
+        border-bottom: 1rpx solid var(--divider);
 
         &:last-child {
           border-bottom: none;

charge-front/src/pages.json

@@ -74,7 +74,7 @@
           "style": {
             "navigationBarTitleText": "预约充电",
             "navigationStyle": "default",
-            "navigationBarBackgroundColor": "#F6F7FA"
+            "navigationBarBackgroundColor": "#F4F7F6"
           }
         },
         {
@@ -82,7 +82,7 @@
           "style": {
             "navigationBarTitleText": "选择充电优惠",
             "navigationStyle": "default",
-            "navigationBarBackgroundColor": "#F6F7FA"
+            "navigationBarBackgroundColor": "#F4F7F6"
           }
         },
         {
@@ -117,7 +117,7 @@
           "style": {
             "navigationStyle": "default",
             "navigationBarTitleText": "我的收藏",
-            "navigationBarBackgroundColor": "#F5F5F5"
+            "navigationBarBackgroundColor": "#F4F7F6"
           }
         },
         {
@@ -177,7 +177,7 @@
           "style": {
             "navigationStyle": "default",
             "navigationBarTitleText": "发票详情",
-            "navigationBarBackgroundColor": "#F6F7FA"
+            "navigationBarBackgroundColor": "#F4F7F6"
           }
         },
         {

charge-front/src/pages/list/list.vue

@@ -63,9 +63,9 @@ onReachBottom(() => {
 
 <style>
 .list {
-  width: 100w;
+  width: 100%;
   min-height: 100vh;
-  background-color: #f5f5f5;
+  background-color: var(--bg-page);
 }
 
 .empty {

charge-front/src/pages/login/login.vue

@@ -114,6 +114,7 @@ const performRedirect = (url: string) => {
   font-weight: 600;
   border-radius: 50rpx;
   border: none;
+  transition: background-color 0.15s cubic-bezier(0.22, 1, 0.36, 1);
 }
 
 .btn::after {
@@ -121,7 +122,8 @@ const performRedirect = (url: string) => {
 }
 
 .btn-press {
-  opacity: 0.82;
+  background: var(--color-primary-deep);
+  opacity: 0.95;
 }
 
 .err {

charge-front/src/pages/user/user.vue

@@ -22,7 +22,7 @@
             }"
           ></view>
           <view class="phone fs-40 fw-500">{{ user.mobilePhoneFormat }}</view>
-          <view class="money flex-align-center" @click="toPage(-1)">
+          <view class="money flex-align-center pressable" hover-class="pressed" hover-stay-time="80" @click="toPage(-1)">
             <uni-icons
               type="wallet-filled"
               size="24"
@@ -42,7 +42,9 @@
       <view class="body">
         <block v-for="(item, index) in menu" :key="index">
           <view
-            class="menu flex-align-center"
+            class="menu flex-align-center pressable"
+            hover-class="pressed"
+            hover-stay-time="80"
             v-if="
               index !== menu.length - 1 || user.mobilePhone === '15986907592'
             "
@@ -204,6 +206,11 @@ onShow(() => {
   font-size: 30rpx;
   border-radius: 40rpx;
   line-height: 80rpx;
+  transition: background-color 0.15s cubic-bezier(0.22, 1, 0.36, 1);
+}
+
+.login-btn:active {
+  background: var(--color-primary-deep);
 }
 .bg {
   position: absolute;
@@ -249,18 +256,19 @@ onShow(() => {
 
     .phone {
       padding-top: 78rpx;
-      color: #000;
+      color: #1c2b29;
     }
 
     .money {
       width: 690rpx;
       height: 118rpx;
-      background: #feffff;
+      background: #ffffff;
       border-radius: 120rpx;
       margin: 0 auto;
       margin-top: 30rpx;
-      color: #000000;
+      color: #1c2b29;
       padding: 0 24rpx 0 40rpx;
+      box-shadow: 0 4rpx 16rpx rgba(28, 43, 41, 0.05);
     }
   }
 }
@@ -273,7 +281,7 @@ onShow(() => {
   .menu {
     background-color: #fff;
     height: 120rpx;
-    border-bottom: 1rpx solid rgba(0, 0, 0, 0.1);
+    border-bottom: 1rpx solid var(--divider);
 
     .menu-icon {
       width: 52rpx;