root/riwa-ionic
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 更新收益相关组件，优化数据获取逻辑，修复数据展示问题

Browse Source
This commit is contained in:
Seven
2026-01-11 00:51:55 +07:00
parent 7440cbd3a5
commit 4c8b68e67d
11 changed files with 159 additions and 377 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
package.json
View File

@@ -34,7 +34,7 @@
"@elysiajs/eden": "^1.4.5", "@elysiajs/eden": "^1.4.5",
"@ionic/vue": "^8.7.11", "@ionic/vue": "^8.7.11",
"@ionic/vue-router": "^8.7.11", "@ionic/vue-router": "^8.7.11",
"@riwa/api-types": "http://192.168.1.7:9527/api/riwa-eden-0.0.116.tgz", "@riwa/api-types": "http://192.168.1.7:9527/api/riwa-eden-0.0.118.tgz",
"@tailwindcss/vite": "^4.1.18", "@tailwindcss/vite": "^4.1.18",
"@vee-validate/yup": "^4.15.1", "@vee-validate/yup": "^4.15.1",
"@vueuse/core": "^14.1.0", "@vueuse/core": "^14.1.0",

12
pnpm-lock.yaml generated
View File

@@ -57,8 +57,8 @@ importers:
specifier: ^8.7.11 specifier: ^8.7.11
version: 8.7.11(@stencil/core@4.39.0)(vue-router@4.6.3(vue@3.5.25(typescript@5.9.3)))(vue@3.5.25(typescript@5.9.3)) version: 8.7.11(@stencil/core@4.39.0)(vue-router@4.6.3(vue@3.5.25(typescript@5.9.3)))(vue@3.5.25(typescript@5.9.3))
'@riwa/api-types': '@riwa/api-types':
specifier: http://192.168.1.7:9527/api/riwa-eden-0.0.116.tgz specifier: http://192.168.1.7:9527/api/riwa-eden-0.0.118.tgz
version: '@riwa/eden@http://192.168.1.7:9527/api/riwa-eden-0.0.116.tgz(@elysiajs/eden@1.4.5(elysia@1.4.18(@sinclair/typebox@0.34.41)(exact-mirror@0.2.5(@sinclair/typebox@0.34.41))(file-type@21.1.1)(openapi-types@12.1.3)(typescript@5.9.3)))' version: '@riwa/eden@http://192.168.1.7:9527/api/riwa-eden-0.0.118.tgz(@elysiajs/eden@1.4.5(elysia@1.4.18(@sinclair/typebox@0.34.41)(exact-mirror@0.2.5(@sinclair/typebox@0.34.41))(file-type@21.1.1)(openapi-types@12.1.3)(typescript@5.9.3)))'
'@tailwindcss/vite': '@tailwindcss/vite':
specifier: ^4.1.18 specifier: ^4.1.18
version: 4.1.18(vite@7.2.7(@types/node@24.10.2)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.1)(yaml@2.8.2)) version: 4.1.18(vite@7.2.7(@types/node@24.10.2)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.1)(yaml@2.8.2))
@@ -2778,9 +2778,9 @@ packages:
'@remirror/core-constants@3.0.0': '@remirror/core-constants@3.0.0':
resolution: {integrity: sha512-42aWfPrimMfDKDi4YegyS7x+/0tlzaqwPQCULLanv3DMIlu96KTJR0fM5isWX2UViOqlGnX6YFgqWepcX+XMNg==} resolution: {integrity: sha512-42aWfPrimMfDKDi4YegyS7x+/0tlzaqwPQCULLanv3DMIlu96KTJR0fM5isWX2UViOqlGnX6YFgqWepcX+XMNg==}
'@riwa/eden@http://192.168.1.7:9527/api/riwa-eden-0.0.116.tgz': '@riwa/eden@http://192.168.1.7:9527/api/riwa-eden-0.0.118.tgz':
resolution: {tarball: http://192.168.1.7:9527/api/riwa-eden-0.0.116.tgz} resolution: {tarball: http://192.168.1.7:9527/api/riwa-eden-0.0.118.tgz}
version: 0.0.116 version: 0.0.118
peerDependencies: peerDependencies:
'@elysiajs/eden': ^1.4.5 '@elysiajs/eden': ^1.4.5
@@ -12105,7 +12105,7 @@ snapshots:
'@remirror/core-constants@3.0.0': {} '@remirror/core-constants@3.0.0': {}
'@riwa/eden@http://192.168.1.7:9527/api/riwa-eden-0.0.116.tgz(@elysiajs/eden@1.4.5(elysia@1.4.18(@sinclair/typebox@0.34.41)(exact-mirror@0.2.5(@sinclair/typebox@0.34.41))(file-type@21.1.1)(openapi-types@12.1.3)(typescript@5.9.3)))': '@riwa/eden@http://192.168.1.7:9527/api/riwa-eden-0.0.118.tgz(@elysiajs/eden@1.4.5(elysia@1.4.18(@sinclair/typebox@0.34.41)(exact-mirror@0.2.5(@sinclair/typebox@0.34.41))(file-type@21.1.1)(openapi-types@12.1.3)(typescript@5.9.3)))':
dependencies: dependencies:
'@elysiajs/eden': 1.4.5(elysia@1.4.18(@sinclair/typebox@0.34.41)(exact-mirror@0.2.5(@sinclair/typebox@0.34.41))(file-type@21.1.1)(openapi-types@12.1.3)(typescript@5.9.3)) '@elysiajs/eden': 1.4.5(elysia@1.4.18(@sinclair/typebox@0.34.41)(exact-mirror@0.2.5(@sinclair/typebox@0.34.41))(file-type@21.1.1)(openapi-types@12.1.3)(typescript@5.9.3))

17
src/views/revenue/monthly/components/overview.vue
View File

@@ -1,4 +1,9 @@
<script lang='ts' setup> <script lang='ts' setup>
import type { EaringsSummaryData } from "@/api/types";
defineProps<{
data: EaringsSummaryData | null;
}>();
</script> </script>
<template> <template>
@@ -8,27 +13,27 @@
本月总收益 本月总收益
</div> </div>
<div class="text-4xl font-bold"> <div class="text-4xl font-bold">
{{ formatAmountWithSplit(38450.20) }} {{ formatAmountWithSplit(data?.realized.thisMonth) }}
</div> </div>
<div class="flex items-center gap-2 text-xs mt-1"> <div class="flex items-center gap-2 text-xs mt-1">
<div>本月日均</div> <div>昨日收益</div>
<div>{{ formatAmountWithSplit(1423.34) }}</div> <div>+{{ formatAmountWithSplit(data?.realized.yesterday) }}</div>
</div> </div>
</div> </div>
<div class="h-px bg-text-800 my-5" /> <div class="h-px bg-text-800 my-5" />
<div class="flex justify-around"> <div class="flex justify-around">
<div class="flex-col-center"> <div class="flex-col-center">
<div class="text-base font-bold"> <div class="text-base font-bold">
{{ formatAmountWithSplit(1256.80) }} {{ formatAmountWithSplit(data?.realized.lastMonth) }}
</div> </div>
<div class="text-xs"> <div class="text-xs">
昨日收益 上月收益
</div> </div>
</div> </div>
<div class="h-auto w-px bg-text-800" /> <div class="h-auto w-px bg-text-800" />
<div class="flex-col-center"> <div class="flex-col-center">
<div class="text-base font-bold"> <div class="text-base font-bold">
{{ formatAmountWithSplit(125680.50) }} {{ formatAmountWithSplit(data?.unrealized.total) }}
</div> </div>
<div class="text-xs"> <div class="text-xs">
累计总收益 累计总收益

141
src/views/revenue/monthly/components/recent.vue
View File

@@ -1,161 +1,58 @@
<script lang='ts' setup> <script lang='ts' setup>
import { client, safeClient } from "@/api";
const { data } = await safeClient(client.api.earnings.details.post({
limit: 6,
offset: 0,
}));
</script> </script>
<template> <template>
<ion-list> <ion-list>
<ion-list-header> <ion-list-header>
<ion-label>
<h4>本月记录</h4> <h4>本月记录</h4>
</ion-label> <ion-button v-show="data?.data.length" class="text-sm">
<ion-button class="text-sm">
查看全部 查看全部
</ion-button> </ion-button>
</ion-list-header> </ion-list-header>
<ion-item> <ui-empty v-if="!data || data.data.length === 0" class="mt-5" />
<template v-else>
<ion-item v-for="item in data?.data" :key="item.id">
<div class="flex justify-between w-full items-center py-4"> <div class="flex justify-between w-full items-center py-4">
<div class="flex flex-col gap-1"> <div class="flex flex-col gap-1">
<div class="flex items-center gap-2"> <div class="flex items-center gap-2">
<div class="text-sm font-medium"> <div class="text-sm font-medium">
分红收益 {{ item.type }}
</div> </div>
<ion-badge class="text-xs p-1" color="success"> <ion-badge class="text-xs p-1" color="success">
已完成 {{ item.ledgerEntryId }}
</ion-badge> </ion-badge>
</div> </div>
<div class="text-sm font-medium"> <div class="text-sm font-medium">
纽约曼哈顿中心公寓 {{ item.relatedAssetName }}
</div> </div>
<div class="text-xs text-text-400"> <div class="text-xs text-text-400">
NYC-001 {{ item.relatedAssetCode }}
</div> </div>
</div> </div>
<div class="text-right"> <div class="text-right">
<div class="text-base font-semibold"> <div class="text-base font-semibold">
{{ formatAmountWithSplit(520.5) }} {{ formatAmountWithSplit(item.amount) }}
</div> </div>
<div class="text-xs text-text-400"> <div class="text-xs text-text-400">
12/27 {{ useDateFormat(item.createdAt) }}
</div>
</div>
</div>
</ion-item>
<ion-item>
<div class="flex justify-between w-full items-center py-4">
<div class="flex flex-col gap-1">
<div class="flex items-center gap-2">
<div class="text-sm font-medium">
资产增值
</div>
<ion-badge class="text-xs p-1" color="success">
已完成
</ion-badge>
</div>
<div class="text-sm font-medium">
旧金山商业地产
</div>
<div class="text-xs text-text-400">
SF-002
</div>
</div>
<div class="text-right">
<div class="text-base font-semibold">
{{ formatAmountWithSplit(320.8) }}
</div>
<div class="text-xs text-text-400">
12/27
</div>
</div>
</div>
</ion-item>
<ion-item>
<div class="flex justify-between w-full items-center py-4">
<div class="flex flex-col gap-1">
<div class="flex items-center gap-2">
<div class="text-sm font-medium">
交易收益
</div>
<ion-badge class="text-xs p-1" color="success">
已完成
</ion-badge>
</div>
<div class="text-sm font-medium">
洛杉矶住宅楼
</div>
<div class="text-xs text-text-400">
LA-003
</div>
</div>
<div class="text-right">
<div class="text-base font-semibold">
{{ formatAmountWithSplit(215.5) }}
</div>
<div class="text-xs text-text-400">
12/26
</div>
</div>
</div>
</ion-item>
<ion-item>
<div class="flex justify-between w-full items-center py-4">
<div class="flex flex-col gap-1">
<div class="flex items-center gap-2">
<div class="text-sm font-medium">
分红收益
</div>
<ion-badge class="text-xs p-1" color="warning">
待确认
</ion-badge>
</div>
<div class="text-sm font-medium">
迈阿密海景别墅
</div>
<div class="text-xs text-text-400">
MIA-004
</div>
</div>
<div class="text-right">
<div class="text-base font-semibold">
{{ formatAmountWithSplit(680.2) }}
</div>
<div class="text-xs text-text-400">
12/26
</div>
</div>
</div>
</ion-item>
<ion-item>
<div class="flex justify-between w-full items-center py-4">
<div class="flex flex-col gap-1">
<div class="flex items-center gap-2">
<div class="text-sm font-medium">
资产增值
</div>
<ion-badge class="text-xs p-1" color="success">
已完成
</ion-badge>
</div>
<div class="text-sm font-medium">
芝加哥写字楼
</div>
<div class="text-xs text-text-400">
CHI-005
</div>
</div>
<div class="text-right">
<div class="text-base font-semibold">
{{ formatAmountWithSplit(450.6) }}
</div>
<div class="text-xs text-text-400">
12/25
</div> </div>
</div> </div>
</div> </div>
</ion-item> </ion-item>
</template>
</ion-list> </ion-list>
</template> </template>
<style lang='css' scoped> <style lang='css' scoped>
@reference "tailwindcss";
h4 { h4 {
font-size: var(--title-font-size); font-size: var(--title-font-size);
} }

71
src/views/revenue/monthly/components/revenue-source.vue
View File

@@ -1,84 +1,45 @@
<script lang='ts' setup> <script lang='ts' setup>
import dayjs from "dayjs";
import { client, safeClient } from "@/api";
const now = dayjs();
const { data } = safeClient(client.api.earnings.type_summary.post({
startDate: now.startOf("month").toDate(),
endDate: now.endOf("month").toDate(),
}));
</script> </script>
<template> <template>
<div> <div>
<h4>本月收益来源</h4> <h4>本月收益来源</h4>
<div class="card"> <ui-empty v-if="data?.data.length === 0" />
<template v-else>
<div v-for="item in data?.data" :key="item.type" class="card">
<div class="flex justify-between items-center mb-2"> <div class="flex justify-between items-center mb-2">
<div class="flex items-center gap-2"> <div class="flex items-center gap-2">
<div class="w-2 h-2 bg-green-700 rounded-full" /> <div class="w-2 h-2 bg-green-700 rounded-full" />
<div class="text-sm font-semibold"> <div class="text-sm font-semibold">
分红收益 {{ item.type }}
</div> </div>
</div> </div>
<div class="text-base font-semibold"> <div class="text-base font-semibold">
{{ formatAmountWithSplit(26145.60) }} {{ formatAmountWithSplit(item.amount) }}
</div> </div>
</div> </div>
<div class="flex justify-between items-center mb-2"> <div class="flex justify-between items-center mb-2">
<div class="flex items-center gap-2"> <div class="flex items-center gap-2">
<div class="w-2 h-2 " /> <div class="w-2 h-2 " />
<div class="text-xs"> <div class="text-xs">
38项 {{ item.count }}项
</div> </div>
</div> </div>
<div class="text-xs text-text-200"> <div class="text-xs text-text-200">
68.02% {{ item.percentage }}%
</div>
</div>
</div>
<div class="card">
<div class="flex justify-between items-center mb-2">
<div class="flex items-center gap-2">
<div class="w-2 h-2 bg-gray-700 rounded-full" />
<div class="text-sm font-semibold">
资产增值
</div>
</div>
<div class="text-base font-semibold">
{{ formatAmountWithSplit(9820.40) }}
</div>
</div>
<div class="flex justify-between items-center mb-2">
<div class="flex items-center gap-2">
<div class="w-2 h-2 " />
<div class="text-xs">
15项
</div>
</div>
<div class="text-xs text-text-200">
25.54%
</div>
</div>
</div>
<div class="card">
<div class="flex justify-between items-center mb-2">
<div class="flex items-center gap-2">
<div class="w-2 h-2 bg-yellow-500 rounded-full" />
<div class="text-sm font-semibold">
交易收益
</div>
</div>
<div class="text-base font-semibold">
{{ formatAmountWithSplit(2484.20) }}
</div>
</div>
<div class="flex justify-between items-center mb-2">
<div class="flex items-center gap-2">
<div class="w-2 h-2 " />
<div class="text-xs">
27项
</div>
</div>
<div class="text-xs text-text-200">
6.44%
</div> </div>
</div> </div>
</div> </div>
</template>
</div> </div>
</template> </template>

47
src/views/revenue/monthly/components/trend.vue
View File

@@ -1,38 +1,22 @@
<script lang='ts' setup> <script lang='ts' setup>
import dayjs from "dayjs";
import { client, safeClient } from "@/api";
const tradingViewInst = useTemplateRef<HTMLDivElement>("tradingViewInst"); const tradingViewInst = useTemplateRef<HTMLDivElement>("tradingViewInst");
const now = dayjs();
const { data } = await safeClient(client.api.earnings.trend.post({
granularity: "month",
startDate: now.subtract(7, "month").toDate(),
endDate: now.toDate(),
}));
useTradingView(tradingViewInst, { useTradingView(tradingViewInst, {
type: "Area", type: "Area",
data: [ data: computed(() => data.value?.data.map(item => ({
{ time: dayjs(item.date).format("YYYY-MM-DD"),
time: "2025-12-01", value: item.amount,
value: 1100.50, })) || []),
},
{
time: "2025-12-05",
value: 1300.80,
},
{
time: "2025-12-10",
value: 1450.20,
},
{
time: "2025-12-15",
value: 1200.60,
},
{
time: "2025-12-20",
value: 1350.90,
},
{
time: "2025-12-25",
value: 1380.40,
},
{
time: "2025-12-27",
value: 1256.80,
},
],
weightChartOptions: { weightChartOptions: {
height: 150, height: 150,
rightPriceScale: { rightPriceScale: {
@@ -48,7 +32,8 @@ useTradingView(tradingViewInst, {
<template> <template>
<div> <div>
<h4>本月收益趋势</h4> <h4>本月收益趋势</h4>
<div ref="tradingViewInst" /> <ui-empty v-if="!data || data.data.length === 0" class="mt-5" />
<div v-else ref="tradingViewInst" />
</div> </div>
</template> </template>

28
src/views/revenue/monthly/index.vue
View File

@@ -1,5 +1,7 @@
<script lang='ts' setup> <script lang='ts' setup>
import type { RefresherCustomEvent } from "@ionic/vue"; import type { RefresherCustomEvent } from "@ionic/vue";
import type { EaringsSummaryData } from "@/api/types";
import { client, safeClient } from "@/api";
import Overview from "./components/overview.vue"; import Overview from "./components/overview.vue";
import Recent from "./components/recent.vue"; import Recent from "./components/recent.vue";
import RevenueSource from "./components/revenue-source.vue"; import RevenueSource from "./components/revenue-source.vue";
@@ -8,24 +10,24 @@ import Trend from "./components/trend.vue";
const { t } = useI18n(); const { t } = useI18n();
const { vibrate } = useHaptics(); const { vibrate } = useHaptics();
const loading = ref(true); const data = ref<EaringsSummaryData | null>(null);
async function loadIncomeData() { async function fetchData() {
loading.value = true; const { data: fetchData } = await safeClient(client.api.earnings.summary.post({
useTimeoutFn(() => { now: new Date(),
loading.value = false; }));
}, 800); data.value = fetchData.value;
} }
async function handleRefresh(event: RefresherCustomEvent) { function handleRefresh(event: RefresherCustomEvent) {
vibrate(); vibrate();
useTimeoutFn(() => { fetchData().finally(() => {
event.target.complete(); event.target.complete();
}, 800); });
} }
onMounted(() => { onMounted(() => {
loadIncomeData(); fetchData();
}); });
</script> </script>
@@ -44,10 +46,10 @@ onMounted(() => {
</ion-refresher> </ion-refresher>
<div class="container"> <div class="container">
<Overview /> <Overview :data="data" />
<Trend /> <Trend />
<RevenueSource /> <RevenueSource :data="data" />
<Recent /> <Recent :data="data" />
</div> </div>
</ion-content> </ion-content>
</ion-page> </ion-page>

87
src/views/revenue/pending/index.vue
View File

@@ -1,75 +1,13 @@
<script lang='ts' setup> <script lang='ts' setup>
import type { RefresherCustomEvent } from "@ionic/vue"; import type { RefresherCustomEvent } from "@ionic/vue";
import { client, safeClient } from "@/api";
const { t } = useI18n(); const { t } = useI18n();
const { vibrate } = useHaptics(); const { vibrate } = useHaptics();
const loading = ref(true); const loading = ref(true);
// 待确认收益数据 const { data } = safeClient(client.api.earnings.pending.get());
const pendingItems = ref([
{
id: "1",
type: "dividend",
typeName: "分红收益",
assetName: "迈阿密海景别墅",
assetCode: "MIA-004",
amount: 680.20,
expectedDate: "2025-12-28",
status: "pending",
},
{
id: "2",
type: "appreciation",
typeName: "资产增值",
assetName: "波士顿商业中心",
assetCode: "BOS-006",
amount: 1250.50,
expectedDate: "2025-12-29",
status: "pending",
},
{
id: "3",
type: "trade",
typeName: "交易收益",
assetName: "西雅图科技园区",
assetCode: "SEA-007",
amount: 890.30,
expectedDate: "2025-12-30",
status: "processing",
},
{
id: "4",
type: "dividend",
typeName: "分红收益",
assetName: "达拉斯住宅区",
assetCode: "DAL-008",
amount: 520.80,
expectedDate: "2025-12-30",
status: "pending",
},
{
id: "5",
type: "appreciation",
typeName: "资产增值",
assetName: "奥斯汀高端公寓",
assetCode: "AUS-009",
amount: 1580.20,
expectedDate: "2026-01-02",
status: "processing",
},
]);
const totalPending = computed(() =>
pendingItems.value.reduce((sum, item) => sum + item.amount, 0),
);
async function loadData() {
loading.value = true;
useTimeoutFn(() => {
loading.value = false;
}, 800);
}
async function handleRefresh(event: RefresherCustomEvent) { async function handleRefresh(event: RefresherCustomEvent) {
vibrate(); vibrate();
@@ -78,17 +16,13 @@ async function handleRefresh(event: RefresherCustomEvent) {
}, 800); }, 800);
} }
function getStatusColor(status: string) { function getStatusColor(status?: string) {
return status === "pending" ? "warning" : "medium"; return status === "pending" ? "warning" : "medium";
} }
function getStatusText(status: string) { function getStatusText(status?: string) {
return status === "pending" ? "待确认" : "处理中"; return status === "pending" ? "待确认" : "处理中";
} }
onMounted(() => {
loadData();
});
</script> </script>
<template> <template>
@@ -113,7 +47,7 @@ onMounted(() => {
</div> </div>
<div class="flex items-end gap-2"> <div class="flex items-end gap-2">
<div class="text-3xl font-bold"> <div class="text-3xl font-bold">
{{ formatAmountWithSplit(totalPending) }} {{ formatAmountWithSplit(data?.total) }}
</div> </div>
<div class="text-sm text-text-400 mb-1"> <div class="text-sm text-text-400 mb-1">
USDT USDT
@@ -132,14 +66,16 @@ onMounted(() => {
</div> </div>
</div> </div>
<ion-list class="rounded-xl overflow-hidden"> <ui-empty v-if="data?.data.length === 0" />
<ion-item v-for="item in pendingItems" :key="item.id" lines="full"> <template v-else>
<ion-list>
<ion-item v-for="item, index in data?.data" :key="index" lines="full">
<div class="w-full py-4"> <div class="w-full py-4">
<div class="flex justify-between items-start mb-3"> <div class="flex justify-between items-start mb-3">
<div class="flex flex-col gap-1.5"> <div class="flex flex-col gap-1.5">
<div class="flex items-center gap-2"> <div class="flex items-center gap-2">
<div class="text-sm font-medium"> <div class="text-sm font-medium">
{{ item.typeName }} {{ item.type }}
</div> </div>
<ion-badge <ion-badge
:color="getStatusColor(item.status)" :color="getStatusColor(item.status)"
@@ -163,11 +99,12 @@ onMounted(() => {
</div> </div>
<div class="flex items-center gap-1.5 text-xs text-text-400"> <div class="flex items-center gap-1.5 text-xs text-text-400">
<i-ic-outline-access-time class="text-sm" /> <i-ic-outline-access-time class="text-sm" />
<span>预计到账：{{ item.expectedDate }}</span> <span>预计到账：{{ useDateFormat(item.expectedAt, 'YY/MM/DD') }}</span>
</div> </div>
</div> </div>
</ion-item> </ion-item>
</ion-list> </ion-list>
</template>
<!-- 说明信息 --> <!-- 说明信息 -->
<div class="mt-6 p-4 bg-text-950 rounded-xl"> <div class="mt-6 p-4 bg-text-950 rounded-xl">

5
src/views/revenue/total/components/recent.vue
View File

@@ -10,9 +10,7 @@ const { data } = await safeClient(client.api.earnings.details.post({
<template> <template>
<ion-list> <ion-list>
<ion-list-header> <ion-list-header>
<ion-label>
<h4>最近记录</h4> <h4>最近记录</h4>
</ion-label>
<ion-button v-show="data?.data.length" class="text-sm"> <ion-button v-show="data?.data.length" class="text-sm">
查看全部 查看全部
</ion-button> </ion-button>
@@ -53,9 +51,10 @@ const { data } = await safeClient(client.api.earnings.details.post({
</template> </template>
<style lang='css' scoped> <style lang='css' scoped>
@reference "tailwindcss";
h4 { h4 {
font-size: var(--title-font-size); font-size: var(--title-font-size);
font-weight: bold;
} }
ion-badge { ion-badge {
font-size: 10px; font-size: 10px;

14
src/views/revenue/total/components/revenue-source.vue
View File

@@ -1,21 +1,15 @@
<script lang='ts' setup> <script lang='ts' setup>
import type { EaringsSummaryData } from "@/api/types"; import { client, safeClient } from "@/api";
const props = defineProps<{ const { data } = safeClient(client.api.earnings.type_summary.post());
data: EaringsSummaryData | null;
}>();
const byType = computed(() => {
return props.data?.byType || [];
});
</script> </script>
<template> <template>
<div> <div>
<h4>收益来源</h4> <h4>收益来源</h4>
<ui-empty v-if="byType.length === 0" /> <ui-empty v-if="data?.data.length === 0" />
<template v-else> <template v-else>
<div v-for="item in byType" :key="item.type" class="card"> <div v-for="item in data?.data" :key="item.type" class="card">
<div class="flex justify-between items-center mb-2"> <div class="flex justify-between items-center mb-2">
<div class="flex items-center gap-2"> <div class="flex items-center gap-2">
<div class="w-2 h-2 bg-green-700 rounded-full" /> <div class="w-2 h-2 bg-green-700 rounded-full" />

4
src/views/revenue/total/index.vue
View File

@@ -13,7 +13,9 @@ const { vibrate } = useHaptics();
const data = ref<EaringsSummaryData | null>(null); const data = ref<EaringsSummaryData | null>(null);
async function fetchData() { async function fetchData() {
const { data: fetchData } = await safeClient(client.api.earnings.summary.post()); const { data: fetchData } = await safeClient(client.api.earnings.summary.post({
now: new Date(),
}));
data.value = fetchData.value; data.value = fetchData.value;
} }