feat: 添加锁仓选项组件并更新持仓页面逻辑

This commit is contained in:
2026-01-12 17:38:15 +07:00
parent 15cb20f2bb
commit 8c367f6c54
3 changed files with 62 additions and 7 deletions

View File

@@ -0,0 +1,13 @@
<script lang='ts' setup>
</script>
<template>
<div class="ion-padding">
<ion-button expand="block" color="primary">
确定
</ion-button>
</div>
</template>
<style lang='css' scoped></style>

View File

@@ -1,8 +1,10 @@
<script lang='ts' setup> <script lang='ts' setup>
import type { InfiniteScrollCustomEvent, RefresherCustomEvent } from "@ionic/vue"; import type { InfiniteScrollCustomEvent, RefresherCustomEvent } from "@ionic/vue";
import type { HoldingItem } from "@/api/types"; import type { HoldingItem } from "@/api/types";
import { alertController, modalController } from "@ionic/vue";
import CryptocurrencyColorNuls from "~icons/cryptocurrency-color/nuls"; import CryptocurrencyColorNuls from "~icons/cryptocurrency-color/nuls";
import { client, safeClient } from "@/api"; import { client, safeClient } from "@/api";
import LockOption from "./lock-option.vue";
const { t } = useI18n(); const { t } = useI18n();
const { vibrate } = useHaptics(); const { vibrate } = useHaptics();
@@ -46,6 +48,39 @@ function getStatusText(status: HoldingItem["status"]) {
}; };
return statusMap[status]; return statusMap[status];
} }
async function handleTokenized(item: HoldingItem) {
const alert = await alertController.create({
header: "资产化确认",
message: "将持仓转换为可交易资产(失去分红权),是否继续?",
buttons: [
{
text: "取消",
role: "cancel",
},
{
text: "确认",
role: "destructive",
handler: async () => {
await safeClient(client.api.rwa.tokenization.immediate.post({ productId: item.productId }));
item.status = "tokenized";
},
},
],
});
await alert.present();
}
async function handleLocked(item: HoldingItem) {
const modal = await modalController.create({
component: LockOption,
componentProps: {
id: item.productId,
},
initialBreakpoint: 0.35,
breakpoints: [0, 0.35],
handle: true,
});
await modal.present();
}
onMounted(() => { onMounted(() => {
fetchHoldings(); fetchHoldings();
@@ -78,7 +113,6 @@ onMounted(() => {
{{ getStatusText(item.status) }} {{ getStatusText(item.status) }}
</ion-badge> </ion-badge>
</div> </div>
<!-- operations -->
</div> </div>
<div class="grid grid-cols-2 gap-2 mb-2"> <div class="grid grid-cols-2 gap-2 mb-2">
@@ -104,8 +138,17 @@ onMounted(() => {
</div> </div>
</div> </div>
<div class="pt-2"> <div class="pt-2 flex items-center">
<span class="text-[11px] text-(--ion-text-color-step-500)">{{ useDateFormat(item.createdAt, 'YYYY/MM/DD HH:mm') }}</span> <span class="text-[11px] text-(--ion-text-color-step-500)">{{ useDateFormat(item.createdAt, 'YYYY/MM/DD HH:mm') }}</span>
<div v-if="item.status === 'active'" class="flex-1 text-right space-x-2">
<ion-button size="small" @click="handleTokenized(item)">
资产化
</ion-button>
<ion-button size="small" @click="handleLocked(item)">
立即锁仓
</ion-button>
</div>
</div> </div>
</div> </div>
</div> </div>

View File

@@ -11,12 +11,11 @@ import RwaOrders from "./components/rwa-orders.vue";
</ion-toolbar> </ion-toolbar>
</ion-header> </ion-header>
<ion-content :fullscreen="true" class="ion-padding"> <ion-content :fullscreen="true" class="ion-padding">
<ui-tabs size="small">
<ui-tab-pane title="数字化产品" name="rwa">
<RwaOrders /> <RwaOrders />
</ui-tab-pane> <!-- <ui-tabs size="small">
<ui-tab-pane title="数字化产品" name="rwa" />
<ui-tab-pane title="代币化产品" name="tokenized" /> <ui-tab-pane title="代币化产品" name="tokenized" />
</ui-tabs> </ui-tabs> -->
</ion-content> </ion-content>
</ion-page> </ion-page>
</template> </template>