refactor: 修改样式

src/pages-sub/asset/index.vue

@@ -3,11 +3,13 @@
   style: {
     navigationBarTitleText: '资金明细',
     navigationBarBackgroundColor: '#fff',
+    navigationStyle: 'custom',
   },
 }
 </route>
 
 <script lang="ts" setup>
+import NavBar from '@/components/NavBar.vue'
 import { getMyAssetAPI } from '@/service'
 import { useUserStore } from '@/store'
 
@@ -35,9 +37,6 @@ const { list: assetList, onReload } = useListPageRequest(
 
 onLoad((options) => {
   tabIndex.value = Number(options.tabIndex ?? 0)
-  uni.setNavigationBarTitle({
-    title: tabList.value[tabIndex.value].label,
-  })
 })
 watch(
   () => tabIndex.value,
@@ -54,7 +53,7 @@ watch(
 
 <template>
   <view class="asset-page pt-15 relative">
-    <view class="absolute top-130 -left-55 btn-gradient text-white rounded-full w-172 h-172"></view>
+    <NavBar :title="tabList[tabIndex].label" />
     <!-- <view class="flex justify-around">
       <view
         v-for="(tabItem, index) in tabList"
@@ -66,11 +65,11 @@ watch(
         <view class="text-14">{{ tabItem.label }}</view>
       </view>
     </view> -->
-    <view class="p-15">
+    <view class="mt-30 p-15 text-white">
       <view class="text-17">{{ tabList[tabIndex].label }}</view>
       <view class="text-30">￥{{ tabList[tabIndex].money }}</view>
     </view>
-    <view class="relative z-1 main-content pt-40 pb-30 rounded-t-15">
+    <view class="relative z-1 mt-10 main-content pt-30 pb-30 rounded-t-15">
       <view class="mb-15 px-25">【{{ tabList[tabIndex].label }}】明细</view>
       <template v-if="assetList.length">
         <view
@@ -107,11 +106,13 @@ watch(
 
 <style scoped>
 .asset-page {
+  background-image: url('@/static/images/assets-bg.jpg');
   background-repeat: no-repeat;
-  background-position: center;
-  background-size: 172px 172px;
+  background-position: top center;
+  background-size: 100%;
 }
 .main-content {
+  background-color: #ffffff99;
   backdrop-filter: blur(60px);
 }
 </style>

src/pages-sub/invest-detail/index.vue

@@ -3,11 +3,13 @@
   style: {
     navigationBarTitleText: '投资记录',
     navigationBarBackgroundColor: '#fff',
+    navigationStyle: 'custom',
   },
 }
 </route>
 
 <script setup lang="ts">
+import NavBar from '@/components/NavBar.vue'
 import { getInvestmentRecordAPI } from '@/service'
 
 const { list: investmentRecordList } = useListPageRequest(getInvestmentRecordAPI)
@@ -16,10 +18,14 @@ function getType(item) {
 }
 </script>
 <template>
-  <view class="min-h-screen pb-100">
-    <template v-if="investmentRecordList.length">
   <view
-        class="flex px-15 py-8 border-b border-#E5E5E5 border-b-solid"
+    class="min-h-screen pb-100"
+    style="background: linear-gradient(180deg, #3a90f2 0%, #f7f7f7 100%)"
+  >
+    <NavBar />
+    <view class="mt-15" v-if="investmentRecordList.length">
+      <view
+        class="flex px-15 py-8 mb-1 bg-#ffffffe5"
         v-for="item in investmentRecordList"
         :key="item.id"
       >
@@ -40,7 +46,7 @@ function getType(item) {
           </view>
         </view>
       </view>
-    </template>
+    </view>
     <template v-else>
       <wd-status-tip image="content" tip="暂无内容" />
     </template>

src/pages.json

@@ -120,7 +120,8 @@
           "type": "page",
           "style": {
             "navigationBarTitleText": "资金明细",
-            "navigationBarBackgroundColor": "#fff"
+            "navigationBarBackgroundColor": "#fff",
+            "navigationStyle": "custom"
           }
         },
         {
@@ -158,7 +159,8 @@
           "type": "page",
           "style": {
             "navigationBarTitleText": "投资记录",
-            "navigationBarBackgroundColor": "#fff"
+            "navigationBarBackgroundColor": "#fff",
+            "navigationStyle": "custom"
           }
         },
         {

src/pages/register/index.vue

@@ -84,9 +84,14 @@ onLoad(async (options) => {
 
 <template>
   <view class="login-container relative">
-    <NavBar title-color="#333" />
+    <NavBar />
+    <image
+      class="mt-30 w-86 rounded-full mx-auto block h-86"
+      src="@/static/images/login/logo.png"
+      mode="aspectFit"
+    />
     <view class="pt-45">
-      <view class="mx-15 px-15 shadow-[0_0_10px_rgba(10,68,245,0.1)] rounded-10">
+      <view class="mx-15 bg-white px-15 shadow-[0_0_10px_rgba(10,68,245,0.1)] rounded-10">
         <view class="flex items-center py-15">
           <view class="text-gradient">手机号</view>
           <input
@@ -154,7 +159,7 @@ onLoad(async (options) => {
   box-sizing: border-box;
   min-height: 100vh;
   padding-bottom: 200rpx;
-  background-image: url('@/static/images/login-bg.png');
+  background-image: url('@/static/images/register-bg.jpg');
   background-repeat: no-repeat;
   background-size: cover;
 }