jcloud/dashboard/src2/components/AlertUnpaidInvoices.vue
2025-04-12 17:39:38 +08:00

31 lines
663 B
Vue

<template>
<AlertBanner :title="outstandingBalanceMessage" type="warning">
<Button class="ml-auto" route="/billing" variant="outline">
立即支付
</Button>
</AlertBanner>
</template>
<script>
import AlertBanner from './AlertBanner.vue';
export default {
name: 'AlertUnpaidInvoices',
components: { AlertBanner },
props: {
amount: {
type: Number,
required: true
},
currency: {
type: String
}
},
computed: {
outstandingBalanceMessage() {
return `您的账户当前有未结余额 ${this.$format.userCurrency(
this.amount
)}。请结清余额以避免网站被暂停。`;
}
}
};
</script>