93 lines
2.6 KiB
Plaintext
93 lines
2.6 KiB
Plaintext
<template>
|
|
<view class="credits-breakdown">
|
|
<!-- 左列 -->
|
|
<view class="credits-column">
|
|
<view class="credits-item clickable" @tap="handleDetail">
|
|
<view class="credits-header">
|
|
<text class="credits-label">{{
|
|
t("Mobile.MySubscriptions.totalCredits")
|
|
}}</text>
|
|
<view class="credits-btn btn-blue">
|
|
<text class="credits-btn-text text-blue">{{
|
|
t("Mobile.MySubscriptions.detail")
|
|
}}</text>
|
|
</view>
|
|
</view>
|
|
<text class="credits-value">{{
|
|
formatNumber(summary?.totalCredit ?? 0, 0)
|
|
}}</text>
|
|
</view>
|
|
|
|
<view class="credits-item clickable" @tap="handleAddPurchase">
|
|
<view class="credits-header">
|
|
<text class="credits-label">{{
|
|
t("Mobile.MySubscriptions.purchaseCredits")
|
|
}}</text>
|
|
<view class="credits-btn btn-green">
|
|
<text class="credits-btn-text text-green">{{
|
|
t("Mobile.MySubscriptions.addPurchase")
|
|
}}</text>
|
|
</view>
|
|
</view>
|
|
<text class="credits-value color-green">{{
|
|
formatNumber(summary?.purchaseCredit ?? 0, 0)
|
|
}}</text>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 右列 -->
|
|
<view class="credits-column">
|
|
<view class="credits-item">
|
|
<view class="credits-header">
|
|
<text class="credits-label">{{
|
|
t("Mobile.MySubscriptions.subscriptionCredits")
|
|
}}</text>
|
|
</view>
|
|
<text class="credits-value color-blue">{{
|
|
formatNumber(summary?.subscriptionCredit ?? 0, 0)
|
|
}}</text>
|
|
</view>
|
|
|
|
<view class="credits-item">
|
|
<view class="credits-header">
|
|
<text class="credits-label">{{
|
|
t("Mobile.MySubscriptions.activityCredits")
|
|
}}</text>
|
|
</view>
|
|
<text class="credits-value color-orange">{{
|
|
formatNumber(summary?.activityCredit ?? 0, 0)
|
|
}}</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script setup lang="uts">
|
|
import type { CreditSummaryInfo } from "@/subpackages/types/interfaces/subscription";
|
|
import { useI18n } from "@/utils/i18n";
|
|
import { formatNumber } from "@/utils/system";
|
|
|
|
const { t } = useI18n();
|
|
|
|
interface Props {
|
|
summary: CreditSummaryInfo | null;
|
|
}
|
|
|
|
defineProps<Props>();
|
|
const emit = defineEmits(["add-purchase"]);
|
|
|
|
const handleAddPurchase = () => {
|
|
emit("add-purchase");
|
|
};
|
|
|
|
const handleDetail = () => {
|
|
uni.navigateTo({
|
|
url: "/subpackages/pages/credit-records/credit-records",
|
|
});
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
@import "./credits-breakdown.scss";
|
|
</style>
|