chore: initialize qiming workspace repository
This commit is contained in:
@@ -0,0 +1,92 @@
|
||||
<template>
|
||||
<modal-popup
|
||||
ref="modalRef"
|
||||
:title="t('Mobile.MySubscriptions.purchaseTitle')"
|
||||
>
|
||||
<view class="purchase-modal">
|
||||
<text class="purchase-subtitle">{{
|
||||
t("Mobile.MySubscriptions.purchaseSubtitle")
|
||||
}}</text>
|
||||
|
||||
<view v-if="loading" class="loading-state">
|
||||
<text class="loading-text">...</text>
|
||||
</view>
|
||||
|
||||
<view v-else class="package-list">
|
||||
<view
|
||||
v-for="pkg in packages"
|
||||
:key="pkg.id"
|
||||
class="package-card"
|
||||
:class="{ 'package-processing': processingId === pkg.id }"
|
||||
@tap="handlePurchase(pkg)"
|
||||
>
|
||||
<view class="package-header">
|
||||
<text class="package-name">{{ pkg.packageName }}</text>
|
||||
<view v-if="pkg.remark" class="package-remark">
|
||||
<text class="remark-text">{{ pkg.remark }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="package-footer">
|
||||
<text class="package-credit">{{
|
||||
`${formatNumber(pkg.creditAmount, 0)} ${t("Mobile.MySubscriptions.creditPackageCredit")}`
|
||||
}}</text>
|
||||
<text class="package-price">{{
|
||||
`¥ ${formatNumber(pkg.price, 2)}`
|
||||
}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</modal-popup>
|
||||
</template>
|
||||
|
||||
<script setup lang="uts">
|
||||
import type { CreditPackageInfo } from "@/subpackages/types/interfaces/subscription";
|
||||
import { SUCCESS_CODE } from "@/constants/codes.constants.uts";
|
||||
import { apiListCreditPackages } from "@/subpackages/servers/subscription";
|
||||
import { useI18n } from "@/utils/i18n";
|
||||
import { formatNumber } from "@/utils/system";
|
||||
import ModalPopup from "@/components/modal-popup/modal-popup.uvue";
|
||||
import { useSubscriptionPurchase } from "../../hooks/useSubscriptionPurchase";
|
||||
|
||||
const { t } = useI18n();
|
||||
const { processingId, handlePayCredits } = useSubscriptionPurchase();
|
||||
|
||||
const modalRef = ref<any>(null);
|
||||
const packages = ref<CreditPackageInfo[]>([]);
|
||||
const loading = ref(false);
|
||||
|
||||
const open = async () => {
|
||||
modalRef.value?.open();
|
||||
await fetchPackages();
|
||||
};
|
||||
|
||||
const close = () => {
|
||||
modalRef.value?.close();
|
||||
};
|
||||
|
||||
const fetchPackages = async () => {
|
||||
loading.value = true;
|
||||
try {
|
||||
const res = await apiListCreditPackages();
|
||||
if (res.code === SUCCESS_CODE && res.data) {
|
||||
const data = res.data as any;
|
||||
packages.value = Array.isArray(data) ? data : data.data || [];
|
||||
}
|
||||
} catch (e) {
|
||||
// ignore
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
const handlePurchase = async (pkg: CreditPackageInfo) => {
|
||||
await handlePayCredits(pkg.id);
|
||||
};
|
||||
|
||||
defineExpose({ open, close });
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import "./purchase-modal.scss";
|
||||
</style>
|
||||
Reference in New Issue
Block a user