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

Use the new indeterminate spinner in the restore view

Browse Source
This commit is contained in:
Johannes Zellner
2025-07-22 16:48:51 +02:00
parent 504e18d9a7
commit 2ec6e47086
1 changed files with 28 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files
dashboard/src/views/RestoreView.vue
+28 -12
View File
@@ -1,7 +1,8 @@
<script setup>
import { ref, onMounted, useTemplateRef } from 'vue';
import { Spinner, Button, SingleSelect, FormGroup, TextInput, Checkbox } from '@cloudron/pankow';
import { Notification, ProgressBar, Button, SingleSelect, FormGroup, TextInput, Checkbox } from '@cloudron/pankow';
import { copyToClipboard } from '@cloudron/pankow/utils';
import { REGIONS_CONTABO, REGIONS_VULTR, REGIONS_IONOS, REGIONS_OVH, REGIONS_LINODE, REGIONS_SCALEWAY, REGIONS_WASABI } from '../constants.js';
import { redirectIfNeeded, mountlike, s3like } from '../utils.js';
import ProvisionModel from '../models/ProvisionModel.js';
@@ -276,6 +277,11 @@ function onUploadBackupConfig() {
backupConfigFileInput.value.click();
}
function onCopyToClipboard(text) {
copyToClipboard(text);
window.pankow.notify({ type: 'success', text: 'Copied to clipboard' });
}
onMounted(async () => {
let [error, result] = await provisionModel.status();
if (error) return console.error(error);
@@ -295,22 +301,24 @@ onMounted(async () => {
<template>
<div class="container" v-if="ready">
<Notification />
<Transition name="slide-fade" mode="out-in">
<div class="view" v-if="waitingForRestore" style="text-align: center; max-width: unset;">
<Spinner class="pankow-spinner-large"/>
<h3>{{ progressMessage }} ...</h3>
<div class="view" v-if="waitingForRestore" style="text-align: center;">
<div>
Please wait while Cloudron is restoring.
<h3>Please wait while Cloudron is restoring</h3>
<ProgressBar mode="indeterminate" :show-label="false" :slim="true"/>
<h3>{{ progressMessage }}</h3>
</div>
<div style="position: absolute; bottom: 10px; text-align: center; width: 100%; font-size: 12px;">
<span v-show="taskMinutesActive >= 4">If restore appears stuck, it can be restarted by running <code @click="onCopyToClipboard('systemctl restart box')">systemctl restart box</code> and reloading this page.</span>
<br/>
<br/>
You can follow the logs on the server at <code class="clipboard hand" data-clipboard-text="/home/yellowtent/platformdata/logs/box.log" v-tooltip="clipboardDone ? 'Copied' : 'Click to copy'">/home/yellowtent/platformdata/logs/box.log</code>
<br/>
<br/>
<span v-show="taskMinutesActive >= 4">If restore appears stuck, it can be restarted by running <code>systemctl restart box</code> and reloading this page.</span>
You can follow the logs on the server at <code @click="onCopyToClipboard('/home/yellowtent/platformdata/logs/box.log')">/home/yellowtent/platformdata/logs/box.log</code>
</div>
</div>
<div class="view" v-else>
<div class="view" v-else style="max-width: 500px;">
<h1>Cloudron Restore</h1>
<p>Provide the backup to restore from</p>
@@ -406,9 +414,17 @@ h1 {
}
.view {
margin: 60px 0;
display: flex;
flex-direction: column;
height: 100%;
width: 100%;
max-width: 500px;
margin: 60px 0;
justify-content: center;
}
.view code {
background-color: transparent;
cursor: copy;
}
</style>