feat: 添加全局菜单组件及相关路由，优化用户界面

src/router/index.ts

@@ -205,6 +205,10 @@ const routes: Array<RouteRecordRaw> = [
       },
     ],
   },
+  {
+    path: "/global-menu",
+    component: () => import("@/views/global-menu/index.vue"),
+  },
 ];
 
 const router = createRouter({

src/ui/avatar/index.vue

@@ -24,5 +24,6 @@ ion-avatar {
   --padding: 10px;
   background-color: #e7f6e1;
   padding: var(--padding);
+  border: 2px solid #e3e3e3;
 }
 </style>

src/views/global-menu/components/issuing-asset.vue

@@ -0,0 +1,46 @@
+<script lang='ts' setup>
+import { calculatorOutline, documentTextOutline, fingerPrintOutline, personOutline } from "ionicons/icons";
+
+const { t } = useI18n();
+</script>
+
+<template>
+  <div>
+    <ion-label class="text-md font-semibold">
+      {{ t("asset.issue.issuingAsset") }}
+    </ion-label>
+    <div class="grid grid-cols-4 mt-5">
+      <div class="col-span-1 flex-col-center gap-2">
+        <ion-icon :icon="personOutline" />
+        <div class="text-xs">
+          {{ t("asset.issue.myCompany") }}
+        </div>
+      </div>
+      <div class="col-span-1 flex-col-center gap-2" @click="$router.push('/issue/issuing-apply')">
+        <ion-icon :icon="documentTextOutline" />
+        <div class="text-xs">
+          {{ t("asset.issue.issuingApply") }}
+        </div>
+      </div>
+      <div class="col-span-1 flex-col-center gap-2">
+        <ion-icon :icon="calculatorOutline" />
+        <div class="text-xs">
+          {{ t("asset.issue.audit") }}
+        </div>
+      </div>
+      <div class="col-span-1 flex-col-center gap-2">
+        <ion-icon :icon="fingerPrintOutline" />
+        <div class="text-xs">
+          {{ t("asset.issue.supervision") }}
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<style lang='css' scoped>
+ion-icon {
+  font-size: 1.5rem;
+  color: var(--ion-color-primary);
+}
+</style>

src/views/global-menu/components/my-revenue.vue

@@ -0,0 +1,68 @@
+<script lang='ts' setup>
+import { calendarOutline, listOutline, timeOutline, walletOutline } from "ionicons/icons";
+
+const { t } = useI18n();
+const router = useRouter();
+
+function navigateToTotal() {
+  router.push("/revenue/total");
+}
+
+function navigateToMonthly() {
+  router.push("/revenue/monthly");
+}
+
+function navigateToPending() {
+  router.push("/revenue/pending");
+}
+
+function navigateToRecords() {
+  router.push("/revenue/records");
+}
+</script>
+
+<template>
+  <div>
+    <ion-label class="text-md font-semibold">
+      {{ t("asset.revenue.myRevenue") }}
+    </ion-label>
+    <div class="grid grid-cols-4 mt-5">
+      <div
+        class="col-span-1 flex flex-col items-center gap-2 cursor-pointer transition-opacity active:opacity-70"
+        @click="navigateToTotal"
+      >
+        <ion-icon :icon="walletOutline" class="text-2xl text-primary" />
+        <div class="text-xs">
+          {{ t("asset.revenue.totalRevenue") }}
+        </div>
+      </div>
+      <div
+        class="col-span-1 flex flex-col items-center gap-2 cursor-pointer transition-opacity active:opacity-70"
+        @click="navigateToMonthly"
+      >
+        <ion-icon :icon="calendarOutline" class="text-2xl text-primary" />
+        <div class="text-xs">
+          {{ t("asset.revenue.monthlyRevenue") }}
+        </div>
+      </div>
+      <div
+        class="col-span-1 flex flex-col items-center gap-2 cursor-pointer transition-opacity active:opacity-70"
+        @click="navigateToPending"
+      >
+        <ion-icon :icon="timeOutline" class="text-2xl text-primary" />
+        <div class="text-xs">
+          {{ t("asset.revenue.pendingRevenue") }}
+        </div>
+      </div>
+      <div
+        class="col-span-1 flex flex-col items-center gap-2 cursor-pointer transition-opacity active:opacity-70"
+        @click="navigateToRecords"
+      >
+        <ion-icon :icon="listOutline" class="text-2xl text-primary" />
+        <div class="text-xs">
+          {{ t("asset.revenue.revenueDetails") }}
+        </div>
+      </div>
+    </div>
+  </div>
+</template>

src/views/global-menu/components/trade-settings.vue

@@ -0,0 +1,40 @@
+<script lang='ts' setup>
+import { cardOutline, documentOutline, documentTextOutline } from "ionicons/icons";
+
+const { t } = useI18n();
+</script>
+
+<template>
+  <div>
+    <ion-label class="text-md font-semibold">
+      {{ t('trade.title') }}
+    </ion-label>
+    <div class="grid grid-cols-4 mt-5">
+      <div class="col-span-1 flex-col-center gap-2" @click="$router.push('/trade-settings/bank-management')">
+        <ion-icon :icon="cardOutline" />
+        <div class="text-xs">
+          {{ t('trade.settings.bankManagement') }}
+        </div>
+      </div>
+      <div class="col-span-1 flex-col-center gap-2" @click="$router.push('/trade-settings/my-subscribe')">
+        <ion-icon :icon="documentOutline" />
+        <div class="text-xs">
+          {{ t('trade.settings.mySubscribe') }}
+        </div>
+      </div>
+      <div class="col-span-1 flex-col-center gap-2" @click="$router.push('/trade-settings/my-issues')">
+        <ion-icon :icon="documentTextOutline" />
+        <div class="text-xs">
+          {{ t('trade.settings.myIssues') }}
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<style lang='css' scoped>
+ion-icon {
+  font-size: 1.5rem;
+  color: var(--ion-color-primary);
+}
+</style>

src/views/global-menu/index.vue

@@ -0,0 +1,27 @@
+<script lang='ts' setup>
+import UserInfo from "../user/components/user-info.vue";
+import IssuingAsset from "./components/issuing-asset.vue";
+import MyRevenue from "./components/my-revenue.vue";
+import TradeSettings from "./components/trade-settings.vue";
+</script>
+
+<template>
+  <ion-page>
+    <ion-header class="ion-no-border">
+      <ion-toolbar class="ui-toolbar">
+        <ui-back-button slot="start" text="" />
+      </ion-toolbar>
+    </ion-header>
+    <ion-content :fullscreen="true" class="ion-padding">
+      <UserInfo />
+      <div class="h-px w-full bg-text-900 my-5" />
+      <div class="flex flex-col gap-10 mt-10">
+        <IssuingAsset />
+        <MyRevenue />
+        <TradeSettings />
+      </div>
+    </ion-content>
+  </ion-page>
+</template>
+
+<style lang='css' scoped></style>

src/views/riwa/index.vue

@@ -8,12 +8,9 @@ import Rwa from "./components/rwa.vue";
   <ion-page>
     <ion-header class="ion-no-border">
       <ion-toolbar class="ui-toolbar">
-        <ion-button slot="start" fill="clear">
+        <ion-button slot="start" fill="clear" class="z-1" @click="$router.push('/global-menu')">
           <IconParkOutlineApplicationMenu slot="icon-only" />
         </ion-button>
-        <ion-button slot="end" fill="clear">
-          <!-- <ui-avatar slot="icon-only" class="w-10 h-10" style="--padding: 8px" /> -->
-        </ion-button>
         <ion-title>首页</ion-title>
       </ion-toolbar>
     </ion-header>

src/views/user/components/asset.vue

@@ -9,11 +9,11 @@ const { fundingBalances, totalAssetValue } = storeToRefs(walletStore);
 
 <template>
   <div>
-    <ion-label class="text-xs font-medium text-text-300">
+    <div class="text-md font-semibold my-4">
       资产分布
-    </ion-label>
+    </div>
 
-    <div class="grid grid-cols-2 gap-4 mt-2">
+    <div class="grid grid-cols-2 gap-4">
       <div class="asset-card">
         <div class="text-xs text-text-400 font-semibold flex items-center gap-1">
           <SolarDollarMinimalisticBoldDuotone />
@@ -34,9 +34,10 @@ const { fundingBalances, totalAssetValue } = storeToRefs(walletStore);
       </div>
     </div>
 
-    <ion-label class="text-xs font-medium text-text-300">
+    <div class="text-md font-semibold my-4">
       资产
-    </ion-label>
+    </div>
+
     <ion-list lines="none" class="space-y-5 mt-2!">
       <ion-item v-for="asset, i in fundingBalances" :key="i" class="">
         <div class="flex items-center space-x-3 flex-1">

src/views/user/components/user-info.vue

@@ -9,7 +9,7 @@ const { userProfile } = storeToRefs(userStore);
 <template>
   <div class="user-info-container">
     <div class="user-info" @click="$router.push('/user/settings')">
-      <ui-avatar class="size-18" />
+      <ui-avatar class="size-14" />
       <div>
         <div class="user-name">
           {{ userProfile?.user?.email }}

src/views/user/components/wallet-card.vue

@@ -39,7 +39,7 @@ onMounted(() => {
     </div>
   </div>
 
-  <div class="flex gap-2 w-full justify-around">
+  <div class="flex gap-2 w-full justify-around mt-2">
     <div id="open-recharge-modal" class="flex-col-center">
       <ion-button expand="full" color="success" shape="round" class="w-12 h-12">
         <IcRoundArrowCircleDown slot="icon-only" />

src/views/user/index.vue

@@ -64,9 +64,9 @@ async function handleScan() {
         <UserInfo />
         <WalletCard />
         <Asset />
-        <IssuingAsset />
+        <!-- <IssuingAsset />
         <MyRevenue />
-        <TradeSettings />
+        <TradeSettings /> -->
       </div>
     </ion-content>
   </ion-page>