feat: 添加国际化支持，更新市场和交易视图中的文本，优化用户体验

src/components/layout/default.vue

@@ -1,5 +1,7 @@
 <script setup lang="ts">
 import { cellular, chatboxEllipses, compass, personCircle, swapHorizontal } from "ionicons/icons";
+
+const { t } = useI18n();
 </script>
 
 <template>
@@ -9,27 +11,27 @@ import { cellular, chatboxEllipses, compass, personCircle, swapHorizontal } from
       <IonTabBar slot="bottom" class="tabbar">
         <IonTabButton tab="riwa" href="/layout/riwa">
           <IonIcon aria-hidden="true" :icon="compass" />
-          <IonLabel>Riwa</IonLabel>
+          <IonLabel>{{ t('tabs.riwa') }}</IonLabel>
         </IonTabButton>
 
         <IonTabButton tab="market" href="/layout/market">
           <IonIcon aria-hidden="true" :icon="cellular" />
-          <IonLabel>Market</IonLabel>
+          <IonLabel>{{ t('tabs.market') }}</IonLabel>
         </IonTabButton>
 
         <IonTabButton tab="trade" href="/layout/trade">
           <IonIcon aria-hidden="true" :icon="swapHorizontal" />
-          <IonLabel>Trade</IonLabel>
+          <IonLabel>{{ t('tabs.trade') }}</IonLabel>
         </IonTabButton>
 
         <IonTabButton tab="chat" href="/layout/chat">
           <IonIcon aria-hidden="true" :icon="chatboxEllipses" />
-          <IonLabel>Chat</IonLabel>
+          <IonLabel>{{ t('tabs.chat') }}</IonLabel>
         </IonTabButton>
 
         <IonTabButton tab="user" href="/layout/user">
           <IonIcon aria-hidden="true" :icon="personCircle" />
-          <IonLabel>User</IonLabel>
+          <IonLabel>{{ t('tabs.user') }}</IonLabel>
         </IonTabButton>
       </IonTabBar>
     </IonTabs>

src/locales/en-US.json

@@ -201,5 +201,30 @@
       "pendingRevenue": "Pending Revenue",
       "revenueDetails": "Revenue Details"
     }
+  },
+  "market": {
+    "title": "Market",
+    "search": {
+      "placeholder": "Search"
+    },
+    "category": {
+      "all": "All"
+    },
+    "rwaList": {
+      "nameCode": "Name/Code",
+      "stage": "Stage",
+      "issueDate": "Issue Date",
+      "subscriptionPrice": "Subscription Price"
+    },
+    "loading": {
+      "loadingMore": "Loading more..."
+    }
+  },
+  "tabs": {
+    "riwa": "Riwa",
+    "market": "Market",
+    "trade": "Trade",
+    "chat": "Chat",
+    "user": "Profile"
   }
 }

src/locales/zh-CN.json

@@ -201,5 +201,30 @@
       "pendingRevenue": "待确认收益",
       "revenueDetails": "收益明细"
     }
+  },
+  "market": {
+    "title": "市场",
+    "search": {
+      "placeholder": "搜索"
+    },
+    "category": {
+      "all": "全部"
+    },
+    "rwaList": {
+      "nameCode": "名称/代码",
+      "stage": "阶段",
+      "issueDate": "发行日期",
+      "subscriptionPrice": "申购单价"
+    },
+    "loading": {
+      "loadingMore": "加载更多..."
+    }
+  },
+  "tabs": {
+    "riwa": "Riwa",
+    "market": "市场",
+    "trade": "交易",
+    "chat": "聊天",
+    "user": "我的"
   }
 }

src/views/market/components/category.vue

@@ -1,6 +1,7 @@
 <script lang='ts' setup>
 import { client, safeClient } from "@/api";
 
+const { t } = useI18n();
 const model = defineModel({ type: String, default: "" });
 
 const { data: categories } = await safeClient(() => client.api.rwa.issuance.categories.get());
@@ -10,7 +11,7 @@ const { data: categories } = await safeClient(() => client.api.rwa.issuance.cate
   <ion-content :scroll-x="true" :scroll-y="false" class="w-full h-6">
     <div class="flex items-center whitespace-nowrap space-x-4">
       <div class="item" :class="{ active: model === '' }" @click="model = ''">
-        全部
+        {{ t('market.category.all') }}
       </div>
       <div
         v-for="item in categories?.data"

src/views/market/components/rwa-list.vue

@@ -4,6 +4,8 @@ import type { RwaData } from "@/api/types";
 defineProps<{
   data: RwaData["data"];
 }>();
+
+const { t } = useI18n();
 </script>
 
 <template>
@@ -12,21 +14,21 @@ defineProps<{
       <ion-grid>
         <ion-row class="ion-align-items-center text-xs">
           <ion-col size="6">
-            <div>名称/代码</div>
+            <div>{{ t('market.rwaList.nameCode') }}</div>
           </ion-col>
           <ion-col>
             <div class="text-right">
-              阶段
+              {{ t('market.rwaList.stage') }}
             </div>
           </ion-col>
           <ion-col>
             <div class="text-right">
-              发行日期
+              {{ t('market.rwaList.issueDate') }}
             </div>
           </ion-col>
           <ion-col>
             <div class="text-right">
-              申购单价
+              {{ t('market.rwaList.subscriptionPrice') }}
             </div>
           </ion-col>
         </ion-row>

src/views/market/index.vue

@@ -5,6 +5,8 @@ import { client, safeClient } from "@/api";
 import Category from "./components/category.vue";
 import RwaList from "./components/rwa-list.vue";
 
+const { t } = useI18n();
+
 const [query] = useResetRef<AvailableSubscriptionBody>({
   limit: 20,
   offset: 0,
@@ -59,7 +61,7 @@ onBeforeMount(() => {
 <template>
   <IonPage>
     <IonHeader class="ion-padding ui-header">
-      <ion-searchbar placeholder=" Search" />
+      <ion-searchbar :placeholder="t('market.search.placeholder')" />
       <Category v-model="query!.categoryId" />
     </IonHeader>
     <IonContent :fullscreen="true" class="ion-padding">
@@ -72,7 +74,7 @@ onBeforeMount(() => {
       <ion-infinite-scroll threshold="100px" @ion-infinite="handleInfinite">
         <ion-infinite-scroll-content
           loading-spinner="bubbles"
-          loading-text="加载更多..."
+          :loading-text="t('market.loading.loadingMore')"
         />
       </ion-infinite-scroll>
     </IonContent>

src/views/trade/index.vue

@@ -2,6 +2,7 @@
 import { cartOutline } from "ionicons/icons";
 import OperationWrapper from "./components/operation-wrapper.vue";
 
+const { t } = useI18n();
 const current = ref<"sale" | "buy" | null>(null);
 </script>
 
@@ -9,7 +10,7 @@ const current = ref<"sale" | "buy" | null>(null);
   <IonPage>
     <IonHeader>
       <IonToolbar>
-        <IonTitle>Market</IonTitle>
+        <IonTitle>{{ t('tabs.trade') }}</IonTitle>
       </IonToolbar>
     </IonHeader>
     <IonContent :fullscreen="true">