jjkiers/cloudron-box
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Poll for subscription updates when in cloudron.io view

Browse Source
This commit is contained in:
Johannes Zellner
2025-06-30 13:18:30 +02:00
parent 7fbc883ec0
commit 0c8620e944
1 changed files with 20 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
dashboard/src/views/CloudronAccountView.vue
View File

@@ -4,9 +4,9 @@ import { useI18n } from 'vue-i18n';
const i18n = useI18n();
const t = i18n.t;
import { ref, onMounted, useTemplateRef } from 'vue';
import { ref, onMounted, onUnmounted, useTemplateRef } from 'vue';
import { Button, Spinner, InputDialog } from 'pankow';
import { prettyDate } from 'pankow/utils';
import { prettyLongDate } from 'pankow/utils';
import Section from '../components/Section.vue';
import SettingsItem from '../components/SettingsItem.vue';
import AppstoreModel from '../models/AppstoreModel.js';
@@ -27,6 +27,8 @@ const planName = ref('');
const cancelAt = ref(0);
const status = ref('');
let pollTimeoutId = 0;
async function refresh() {
const [error, result] = await appstoreModel.getSubscription();
if (error) {
@@ -42,7 +44,7 @@ async function refresh() {
cloudronId.value = result.cloudronId;
planId.value = result.plan.id;
planName.value = result.plan.name;
cancelAt.value = result.cancel_at || 0;
cancelAt.value = result.cancel_at;
status.value = result.status;
}
@@ -62,6 +64,11 @@ async function onAskResetCloudron() {
await onResetCloudron();
}
async function pollSubscription() {
await refresh();
pollTimeoutId = setInterval(refresh, 3000);
}
async function onResetCloudron() {
busy.value = true;
@@ -81,6 +88,12 @@ onMounted(async () => {
await refresh();
busy.value = false;
await pollSubscription();
});
onUnmounted(() => {
clearInterval(pollTimeoutId);
});
</script>
@@ -98,7 +111,6 @@ onMounted(async () => {
<div class="info-row" v-if="email">
<div class="info-label">{{ $t('settings.appstoreAccount.email') }}</div>
<!-- TODO change to setup subscxription -->
<!-- TODO button is a link to console.cloudron.io/setup-subscription?cloudronId=xxx -->
<div class="info-value"><a :href="`${consoleServerOrigin}?email=${emailEncoded}`" target="_blank">{{ email }} <i v-show="!emailVerified" class="fas fa-exclamation-triangle text-danger" v-tooltip="$t('settings.appstoreAccount.emailNotVerified')"></i></a></div>
</div>
@@ -109,15 +121,14 @@ onMounted(async () => {
</div>
<div class="info-row">
<div class="info-label">{{ $t('settings.appstoreAccount.subscription') }}</div>
<div class="info-label">{{ $t('settings.appstoreAccount.subscription') }} <span v-if="cancelAt" class="error-label">{{ $t('settings.appstoreAccount.subscriptionEndsAt') }} {{ prettyLongDate(cancelAt*1000) }}</span></div>
<div class="info-value">{{ planName }}</div>
</div>
<p class="text-danger" v-show="cancelAt">{{ $t('settings.appstoreAccount.subscriptionEndsAt') }} {{ prettyDate(cancelAt*1000) }}</p>
<div class="button-bar">
<div class="button-bar" style="margin-top: 20px">
<Button :href="`${consoleServerOrigin}/#/claim/${cloudronId}`" target="_blank">
<span v-if="planName.toLowerCase() === 'free'">{{ $t('settings.appstoreAccount.subscriptionSetupAction') }}</span>
<span v-if="!email">{{ $t('settings.appstoreAccount.setupAction') }}</span>
<span v-else-if="planName.toLowerCase() === 'free'">{{ $t('settings.appstoreAccount.subscriptionSetupAction') }}</span>
<span v-else-if="cancelAt">{{ $t('settings.appstoreAccount.subscriptionReactivateAction') }}</span>
<span v-else>{{ $t('settings.appstoreAccount.subscriptionChangeAction') }}</span>
</Button>