feat: 添加自定义返回按钮组件并替换现有页面中的返回按钮

src/ui/back-button/index.vue

@@ -0,0 +1,26 @@
+<script lang='ts' setup>
+import { chevronBackOutline } from "ionicons/icons";
+
+const { text = "返回" } = defineProps<{
+  text?: string;
+}>();
+const router = useRouter();
+
+function onBack() {
+  if (window.history.length > 1) {
+    router.back();
+  }
+  else {
+    router.replace("/");
+  }
+}
+</script>
+
+<template>
+  <button class="z-1 flex items-center" @click="onBack">
+    <ion-icon :icon="chevronBackOutline" class="text-2xl" />
+    <span v-if="text" class="text-base">{{ text }}</span>
+  </button>
+</template>
+
+<style lang='css' scoped></style>

src/ui/index.ts

@@ -35,5 +35,6 @@ declare module "vue" {
     UiTabs: typeof import("./tabs/index.vue")["default"];
     UiTag: typeof import("./tag/index.vue")["default"];
     UiTextareaLabel: typeof import("./textarea-label/index.vue")["default"];
+    UiBackButton: typeof import("./back-button/index.vue")["default"];
   }
 }

src/views/auth/signup/index.vue

@@ -6,7 +6,7 @@ import { Field, Form } from "vee-validate";
   <IonPage>
     <IonHeader class="ion-no-border">
       <IonToolbar class="ui-toolbar">
-        <ion-back-button slot="start" />
+        <ui-back-button slot="start" />
       </IonToolbar>
     </IonHeader>
     <IonContent :fullscreen="true" class="ion-padding">

src/views/deposit/fiat.vue

@@ -55,7 +55,7 @@ async function onSubmit() {
     <IonHeader>
       <ion-toolbar class="ui-toolbar">
         <ion-buttons slot="start">
-          <ion-back-button />
+          <ui-back-button />
         </ion-buttons>
         <ion-title>{{ t("recharge.fiat.title") }}</ion-title>
       </ion-toolbar>

src/views/income/total/index.vue

@@ -36,7 +36,7 @@ onMounted(() => {
   <ion-page>
     <ion-header class="ion-no-border">
       <ion-toolbar class="ui-toolbar">
-        <ion-back-button slot="start" />
+        <ui-back-button slot="start" />
         <ion-title>{{ t("income.title") }}</ion-title>
       </ion-toolbar>
     </ion-header>

src/views/issue/issuing-apply/index.vue

@@ -56,7 +56,7 @@ async function handleSubmit(editions: RwaIssuanceProductBody["editions"]) {
   <IonPage>
     <ion-header>
       <ion-toolbar class="ui-toolbar">
-        <ion-back-button slot="start" />
+        <ui-back-button slot="start" />
         <ion-title>{{ t('asset.issue.apply.title') }}</ion-title>
       </ion-toolbar>
     </ion-header>

src/views/onchain-address/index.vue

@@ -22,7 +22,7 @@ const qrcode = useQRCode(url, {
     <IonHeader>
       <IonToolbar class="ui-toolbar">
         <ion-buttons slot="start">
-          <ion-back-button />
+          <ui-back-button />
         </ion-buttons>
         <ion-title>我的二维码</ion-title>
       </IonToolbar>

src/views/system-settings/index.vue

@@ -80,7 +80,7 @@ onMounted(() => {
   <ion-page>
     <ion-header>
       <ion-toolbar class="ui-toolbar">
-        <ion-back-button slot="start" />
+        <ui-back-button slot="start" />
       </ion-toolbar>
     </ion-header>
 

src/views/system-settings/language.vue

@@ -20,7 +20,7 @@ function handleLanguageChange(event: CustomEvent) {
   <ion-page>
     <ion-header>
       <ion-toolbar class="ui-toolbar">
-        <ion-back-button slot="start" />
+        <ui-back-button slot="start" />
         <ion-title>{{ t("settings.languageTitle") }}</ion-title>
       </ion-toolbar>
     </ion-header>

src/views/system-settings/outlet.vue

@@ -4,7 +4,7 @@
   <ion-page>
     <ion-header>
       <ion-toolbar class="ui-toolbar">
-        <ion-back-button slot="start" />
+        <ui-back-button slot="start" />
       </ion-toolbar>
     </ion-header>
 

src/views/system-settings/theme.vue

@@ -20,7 +20,7 @@ function handleThemeChange(event: CustomEvent) {
   <ion-page>
     <ion-header>
       <ion-toolbar class="ui-toolbar">
-        <ion-back-button slot="start" />
+        <ui-back-button slot="start" />
       </ion-toolbar>
     </ion-header>
 

src/views/trade-rwa/edit.vue

@@ -10,7 +10,7 @@ defineProps<{
   <ion-page>
     <ion-header>
       <ion-toolbar class="ui-toolbar">
-        <ion-back-button slot="start" text="" />
+        <ui-back-button slot="start" text="" />
         <ion-title />
       </ion-toolbar>
     </ion-header>

src/views/trade-rwa/index.vue

@@ -40,7 +40,7 @@ function gotoEdit() {
   <ion-page>
     <ion-header>
       <ion-toolbar class="ui-toolbar">
-        <ion-back-button slot="start" text="" />
+        <ui-back-button slot="start" text="" />
         <ion-title>
           {{ data?.product.code }}
         </ion-title>

src/views/trade-rwa/outlet.vue

@@ -12,7 +12,7 @@ const { data } = safeClient(client.api.rwa.subscription.available_editions({ edi
   <ion-page>
     <ion-header>
       <ion-toolbar class="ui-toolbar">
-        <ion-back-button slot="start" />
+        <ui-back-button slot="start" />
         <ion-title>
           {{ data?.product.code }}
         </ion-title>

src/views/trade-settings/bank-management/add.vue

@@ -64,7 +64,7 @@ function formatCardNumber(value: string) {
   <IonPage>
     <ion-header>
       <ion-toolbar class="ui-toolbar">
-        <ion-back-button slot="start" />
+        <ui-back-button slot="start" />
         <ion-title>{{ t('bankCard.add') }}</ion-title>
       </ion-toolbar>
     </ion-header>

src/views/trade-settings/bank-management/index.vue

@@ -107,7 +107,7 @@ onUpdated(() => {
   <IonPage>
     <ion-header>
       <ion-toolbar class="ui-toolbar">
-        <ion-back-button slot="start" />
+        <ui-back-button slot="start" />
         <ion-title>{{ t('bankCard.management') }}</ion-title>
       </ion-toolbar>
     </ion-header>

src/views/trade-settings/my-issues/detail.vue

@@ -41,7 +41,7 @@ function gotoEdit() {
   <ion-page>
     <ion-header>
       <ion-toolbar class="ui-toolbar">
-        <ion-back-button slot="start" text="" />
+        <ui-back-button slot="start" text="" />
         <ion-title>
           {{ data?.code }}
         </ion-title>

src/views/trade-settings/my-issues/outlet.vue

@@ -6,7 +6,7 @@ const { t } = useI18n();
   <ion-page>
     <ion-header>
       <ion-toolbar class="ui-toolbar">
-        <ion-back-button slot="start" />
+        <ui-back-button slot="start" />
         <ion-title>{{ t('myIssues.title') }}</ion-title>
       </ion-toolbar>
     </ion-header>

src/views/trade-settings/my-subscribe/detail.vue

@@ -34,7 +34,7 @@ async function handleSubscribe(val: number) {
   <ion-page>
     <ion-header>
       <ion-toolbar class="ui-toolbar">
-        <ion-back-button slot="start" />
+        <ui-back-button slot="start" />
         <ion-title>
           {{ data?.edition.product.code }}
         </ion-title>

src/views/trade-settings/my-subscribe/index.vue

@@ -60,7 +60,7 @@ onBeforeMount(() => {
   <ion-page>
     <ion-header>
       <ion-toolbar class="ui-toolbar">
-        <ion-back-button slot="start" />
+        <ui-back-button slot="start" />
         <ion-title>我的申购</ion-title>
       </ion-toolbar>
     </ion-header>

src/views/user-settings/outlet.vue

@@ -4,7 +4,7 @@
   <ion-page>
     <ion-header>
       <ion-toolbar class="ui-toolbar">
-        <ion-back-button slot="start" />
+        <ui-back-button slot="start" />
         <ion-title>用户设置</ion-title>
       </ion-toolbar>
     </ion-header>

src/views/wallet/bill.vue

@@ -9,7 +9,7 @@ const activeTab = ref("deposit");
   <ion-page>
     <ion-header class="ion-no-border">
       <ion-toolbar class="ui-toolbar">
-        <ion-back-button slot="start" text="" />
+        <ui-back-button slot="start" text="" />
         <ion-title>账单</ion-title>
       </ion-toolbar>
       <ion-toolbar class="ui-toolbar">

src/views/wallet/transfer.vue

@@ -122,7 +122,7 @@ function getAccountTypeName(type: AccountType) {
     <ion-header>
       <ion-toolbar class="ui-toolbar">
         <ion-buttons slot="start">
-          <ion-back-button default-href="/wallet/index" />
+          <ui-back-button default-href="/wallet/index" />
         </ion-buttons>
         <ion-title>{{ t("transfer.title") }}</ion-title>
       </ion-toolbar>

src/views/withdraw/index.vue

@@ -54,7 +54,7 @@ async function onSubmit(values: GenericObject) {
     <IonHeader>
       <ion-toolbar class="ui-toolbar">
         <ion-buttons slot="start">
-          <ion-back-button />
+          <ui-back-button />
         </ion-buttons>
         <ion-title>{{ t("withdraw.title") }}</ion-title>
       </ion-toolbar>