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

Add cloudron registration via setupToken

Browse Source
This commit is contained in:
Johannes Zellner
2025-03-21 11:42:30 +01:00
parent c517b6db3b
commit 7c1160de92
3 changed files with 122 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files
dashboard/src/components/CloudronAccount.vue
+44 -25
View File
@@ -1,9 +1,11 @@
<script setup>
import { ref, onMounted } from 'vue';
import { ref, onMounted, useTemplateRef } from 'vue';
import { Button } from 'pankow';
import { prettyDate } from 'pankow/utils';
import Section from '../components/Section.vue';
import SettingsItem from '../components/SettingsItem.vue';
import CloudronRegistrationDialog from '../components/CloudronRegistrationDialog.vue';
import AppstoreModel from '../models/AppstoreModel.js';
const appstoreModel = AppstoreModel.create();
@@ -21,7 +23,12 @@ const planName = ref('');
const cancelAt = ref(0);
const status = ref('');
onMounted(async () => {
const registrationDialog = useTemplateRef('registrationDialog');
function onOpenRegistrationDialog() {
registrationDialog.value.open();
}
async function refresh() {
const [error, result] = await appstoreModel.getSubscription();
if (error) {
if (error.status === 402) return busy.value = false; // not yet registered
@@ -38,7 +45,10 @@ onMounted(async () => {
planName.value = result.plan.name;
cancelAt.value = result.cancel_at || 0;
status.value = result.status;
}
onMounted(async () => {
await refresh();
busy.value = false;
});
@@ -46,35 +56,44 @@ onMounted(async () => {
<template>
<div>
<CloudronRegistrationDialog ref="registrationDialog" @success="refresh()"/>
<Section :title="$t('settings.appstoreAccount.title')">
<p>{{ $t('settings.appstoreAccount.description') }}</p>
<div v-if="!busy">
<div v-if="hasSubscription">
<p>{{ $t('settings.appstoreAccount.description') }}</p>
<a href="/#/appstore" target="_blank" v-show="!hasSubscription && !busy">{{ $t('settings.appstoreAccount.setupAction') }}</a>
<!-- TODO what is `subscription.externalCustomer` ? -->
<div class="info-row">
<div class="info-label">{{ $t('settings.appstoreAccount.email') }}</div>
<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>
<div v-show="hasSubscription && !busy">
<!-- TODO what is `subscription.externalCustomer` ? -->
<div class="info-row">
<div class="info-label">{{ $t('settings.appstoreAccount.email') }}</div>
<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 class="info-row">
<div class="info-label">{{ $t('settings.appstoreAccount.cloudronId') }}</div>
<div class="info-value">{{ cloudronId }}</div>
</div>
<div class="info-row">
<div class="info-label">{{ $t('settings.appstoreAccount.subscription') }}</div>
<div class="info-value">{{ planName }}</div>
</div>
<p class="text-danger" v-show="cancelAt">{{ $t('settings.appstoreAccount.subscriptionEndsAt') }} {{ prettyDate(cancelAt*1000) }}</p>
<Button :href="`${consoleServerOrigin}/#/cloudron/${cloudronId}?email=${encodeURIComponent(email)}`" target="_blank">
<span v-show="planName === 'free'">{{ $t('settings.appstoreAccount.subscriptionSetupAction') }}</span>
<span v-show="cancelAt">{{ $t('settings.appstoreAccount.subscriptionReactivateAction') }}</span>
<span v-show="!cancelAt">{{ $t('settings.appstoreAccount.subscriptionChangeAction') }}</span>
</Button>
</div>
<div class="info-row">
<div class="info-label">{{ $t('settings.appstoreAccount.cloudronId') }}</div>
<div class="info-value">{{ cloudronId }}</div>
<div v-else>
<SettingsItem>
<div style="display: flex; align-items: center;">{{ $t('settings.appstoreAccount.description') }}</div>
<Button @click="onOpenRegistrationDialog()">{{ $t('settings.appstoreAccount.setupAction') }}</Button>
</SettingsItem>
</div>
<div class="info-row">
<div class="info-label">{{ $t('settings.appstoreAccount.subscription') }}</div>
<div class="info-value">{{ planName }}</div>
</div>
<p class="text-danger" v-show="cancelAt">{{ $t('settings.appstoreAccount.subscriptionEndsAt') }} {{ prettyDate(cancelAt*1000) }}</p>
<Button v-show="!busy" :href="`${consoleServerOrigin}/#/cloudron/${cloudronId}?email=${encodeURIComponent(email)}`" target="_blank">
<span v-show="planName === 'free'">{{ $t('settings.appstoreAccount.subscriptionSetupAction') }}</span>
<span v-show="cancelAt">{{ $t('settings.appstoreAccount.subscriptionReactivateAction') }}</span>
<span v-show="!cancelAt">{{ $t('settings.appstoreAccount.subscriptionChangeAction') }}</span>
</Button>
</div>
</Section>
</div>