From 521fce35e4456bb2cafc37d9ed66d181e0c2b710 Mon Sep 17 00:00:00 2001 From: Thomas Basler Date: Mon, 21 Oct 2024 21:59:38 +0200 Subject: [PATCH] webapp: Added global reboot wait screen --- lang/es.lang.json | 7 +++ lang/it.lang.json | 4 ++ webapp/src/locales/de.json | 4 ++ webapp/src/locales/en.json | 4 ++ webapp/src/locales/fr.json | 4 ++ webapp/src/router/index.ts | 6 +++ webapp/src/utils/waitRestart.ts | 7 +++ webapp/src/views/ConfigAdminView.vue | 7 +-- webapp/src/views/FirmwareUpgradeView.vue | 40 +------------- webapp/src/views/MaintenanceRebootView.vue | 2 + webapp/src/views/WaitRestartView.vue | 63 ++++++++++++++++++++++ 11 files changed, 105 insertions(+), 43 deletions(-) create mode 100644 webapp/src/utils/waitRestart.ts create mode 100644 webapp/src/views/WaitRestartView.vue diff --git a/lang/es.lang.json b/lang/es.lang.json index 8d308173..5328a28f 100644 --- a/lang/es.lang.json +++ b/lang/es.lang.json @@ -37,6 +37,13 @@ "Release": "Soltar para refrescar", "Close": "Cerrar" }, + "wait": { + "NotReady": "OpenDTU is not yet ready", + "PleaseWait": "Please wait. You will be automatically redirected to the home page." + }, + "Error": { + "Oops": "Oops!" + }, "localeswitcher": { "Dark": "Oscuro", "Light": "Claro", diff --git a/lang/it.lang.json b/lang/it.lang.json index 84b61622..350b82fc 100644 --- a/lang/it.lang.json +++ b/lang/it.lang.json @@ -37,6 +37,10 @@ "Release": "Rilascia per aggiornare", "Close": "Chiudi" }, + "wait": { + "NotReady": "OpenDTU is not yet ready", + "PleaseWait": "Please wait. You will be automatically redirected to the home page." + }, "Error": { "Oops": "Oops!" }, diff --git a/webapp/src/locales/de.json b/webapp/src/locales/de.json index 433b2512..2cedd649 100644 --- a/webapp/src/locales/de.json +++ b/webapp/src/locales/de.json @@ -32,6 +32,10 @@ "Release": "Loslassen zum Aktualisieren", "Close": "Schließen" }, + "wait": { + "NotReady": "OpenDTU ist noch nicht bereit", + "PleaseWait": "Bitte warten. Sie werden automatisch auf die Startseite weitergeleitet." + }, "Error": { "Oops": "Oops!" }, diff --git a/webapp/src/locales/en.json b/webapp/src/locales/en.json index bd782139..c8419722 100644 --- a/webapp/src/locales/en.json +++ b/webapp/src/locales/en.json @@ -32,6 +32,10 @@ "Release": "Release to refresh", "Close": "Close" }, + "wait": { + "NotReady": "OpenDTU is not yet ready", + "PleaseWait": "Please wait. You will be automatically redirected to the home page." + }, "Error": { "Oops": "Oops!" }, diff --git a/webapp/src/locales/fr.json b/webapp/src/locales/fr.json index 0387565f..37c405d5 100644 --- a/webapp/src/locales/fr.json +++ b/webapp/src/locales/fr.json @@ -32,6 +32,10 @@ "Release": "Release to refresh", "Close": "Fermer" }, + "wait": { + "NotReady": "OpenDTU is not yet ready", + "PleaseWait": "Please wait. You will be automatically redirected to the home page." + }, "Error": { "Oops": "Oops!" }, diff --git a/webapp/src/router/index.ts b/webapp/src/router/index.ts index a8dc7eff..0b35e2b6 100644 --- a/webapp/src/router/index.ts +++ b/webapp/src/router/index.ts @@ -17,6 +17,7 @@ import NtpAdminView from '@/views/NtpAdminView.vue'; import NtpInfoView from '@/views/NtpInfoView.vue'; import SecurityAdminView from '@/views/SecurityAdminView.vue'; import SystemInfoView from '@/views/SystemInfoView.vue'; +import WaitRestartView from '@/views/WaitRestartView.vue'; import { createRouter, createWebHistory } from 'vue-router'; const router = createRouter({ @@ -118,6 +119,11 @@ const router = createRouter({ name: 'Device Reboot', component: MaintenanceRebootView, }, + { + path: '/wait', + name: 'Wait Restart', + component: WaitRestartView, + }, ], }); diff --git a/webapp/src/utils/waitRestart.ts b/webapp/src/utils/waitRestart.ts new file mode 100644 index 00000000..5ff44b52 --- /dev/null +++ b/webapp/src/utils/waitRestart.ts @@ -0,0 +1,7 @@ +import type { Router } from 'vue-router'; + +export function waitRestart(router: Router) { + setTimeout(() => { + router.push('/wait'); + }, 1000); +} diff --git a/webapp/src/views/ConfigAdminView.vue b/webapp/src/views/ConfigAdminView.vue index f7325915..ff90a656 100644 --- a/webapp/src/views/ConfigAdminView.vue +++ b/webapp/src/views/ConfigAdminView.vue @@ -52,11 +52,6 @@ {{ $t('fileadmin.UploadSuccess') }} -
-
-
@@ -137,6 +132,7 @@ import ModalDialog from '@/components/ModalDialog.vue'; import type { AlertResponse } from '@/types/Alert'; import type { FileInfo } from '@/types/File'; import { authHeader, handleResponse } from '@/utils/authentication'; +import { waitRestart } from '@/utils/waitRestart'; import * as bootstrap from 'bootstrap'; import { BIconArrowLeft, @@ -251,6 +247,7 @@ export default defineComponent({ // request.response will hold the response from the server if (request.status === 200) { this.UploadSuccess = true; + waitRestart(this.$router); } else if (request.status !== 500) { this.UploadError = `[HTTP ERROR] ${request.statusText}`; } else { diff --git a/webapp/src/views/FirmwareUpgradeView.vue b/webapp/src/views/FirmwareUpgradeView.vue index 3828d00e..15897c6f 100644 --- a/webapp/src/views/FirmwareUpgradeView.vue +++ b/webapp/src/views/FirmwareUpgradeView.vue @@ -39,13 +39,6 @@ {{ $t('firmwareupgrade.OtaSuccess') }} -
-
-
- -
{ - // Check if the response status is OK (200-299 range) - if (response.ok) { - console.log('Remote host is available. Reloading page...'); - clearInterval(this.hostCheckInterval); - this.hostCheckInterval = 0; - // Perform a page reload - window.location.replace('/'); - } else { - console.log('Remote host is not reachable. Do something else if needed.'); - } - }) - .catch((error) => { - console.error('Error checking remote host:', error); - }); - } else { - console.log('Browser is offline. Cannot check remote host.'); - } - }, }, mounted() { if (!isLoggedIn()) { @@ -229,8 +196,5 @@ export default defineComponent({ } this.loading = false; }, - unmounted() { - clearInterval(this.hostCheckInterval); - }, }); diff --git a/webapp/src/views/MaintenanceRebootView.vue b/webapp/src/views/MaintenanceRebootView.vue index d80d050c..682ce500 100644 --- a/webapp/src/views/MaintenanceRebootView.vue +++ b/webapp/src/views/MaintenanceRebootView.vue @@ -36,6 +36,7 @@ import ModalDialog from '@/components/ModalDialog.vue'; import { authHeader, handleResponse, isLoggedIn } from '@/utils/authentication'; import * as bootstrap from 'bootstrap'; import { defineComponent } from 'vue'; +import { waitRestart } from '@/utils/waitRestart'; export default defineComponent({ components: { @@ -80,6 +81,7 @@ export default defineComponent({ this.alertMessage = this.$t('apiresponse.' + data.code, data.param); this.alertType = data.type; this.showAlert = true; + waitRestart(this.$router); }); this.onCloseModal(this.performReboot); }, diff --git a/webapp/src/views/WaitRestartView.vue b/webapp/src/views/WaitRestartView.vue new file mode 100644 index 00000000..95640e4b --- /dev/null +++ b/webapp/src/views/WaitRestartView.vue @@ -0,0 +1,63 @@ + + +