feat: 添加我的订阅页面及相关组件,优化路由配置

This commit is contained in:
2025-12-22 21:17:12 +07:00
parent 7fa87ba08b
commit c8795a2ab8
7 changed files with 215 additions and 3 deletions

View File

@@ -0,0 +1,98 @@
<script lang='ts' setup>
import { toastController } from "@ionic/vue";
import CryptocurrencyColorNuls from "~icons/cryptocurrency-color/nuls";
import IcSharpEditNote from "~icons/ic/sharp-edit-note";
import { client, safeClient } from "@/api";
import RwaAbout from "./components/about.vue";
import RwaBase from "./components/base.vue";
const props = defineProps<{
id: string;
}>();
const { t } = useI18n();
const router = useRouter();
const model = useTemplateRef<ModalInstance>("model");
const { data } = safeClient(client.api.rwa.issuance.products({ id: props.id }).get());
async function handleSubscribe(val: number) {
await safeClient(client.api.rwa.subscription.apply.post({
editionId: props.id,
quantity: String(val),
}));
const toast = await toastController.create({
message: t("market.tradeRwa.subscribeSuccess"),
duration: 2000,
position: "bottom",
color: "success",
});
await toast.present();
model.value?.$el.dismiss();
}
function gotoEdit() {
router.push({ name: "trade-rwa-edit" });
}
</script>
<template>
<ion-page>
<ion-header>
<ion-toolbar class="ui-toolbar">
<ion-back-button slot="start" text="" />
<ion-title>
{{ data?.code }}
</ion-title>
</ion-toolbar>
</ion-header>
<ion-content :fullscreen="true" class="ion-padding">
<div>
<div class="flex items-center space-x-2">
<CryptocurrencyColorNuls class="text-3xl" />
<div class="mr-2">
<div class="text-lg font-semibold">
{{ data?.name }}
</div>
<div class="text-xs text-gray-500 font-semibold">
{{ data?.category?.name }}
</div>
</div>
</div>
<div class="flex items-center my-3" @click="gotoEdit">
<IcSharpEditNote class="inline-block text-xl mr-1 text-text-500" />
<div class="text-xs">
编辑资产
</div>
</div>
</div>
<ui-tabs size="small">
<ui-tab-pane name="overview" :title="t('market.tradeRwa.tabs.overview')">
<RwaBase :data="data" />
</ui-tab-pane>
<ui-tab-pane name="about" title="相关文档">
<RwaAbout :data="data" />
</ui-tab-pane>
</ui-tabs>
</ion-content>
</ion-page>
</template>
<style scoped>
@reference "tailwindcss";
.label {
@apply text-gray-500 mb-1;
}
ion-button {
width: 100%;
min-height: 40px;
}
ion-button::part(native) {
min-height: 40px;
}
</style>