Update localStorage only when a successful connection is established to the API. Hide console when the API connection is not configured.

This commit is contained in:
Abdulmhsen B. A. A.
2024-06-10 20:09:00 +03:00
parent f24d545378
commit dc729cefac
2 changed files with 47 additions and 18 deletions

View File

@@ -1,14 +1,22 @@
<template>
<div class="notification is-warning">
<h1 class="title is-5">There is no <em class="is-bold">{{ api_var }}</em> configured.</h1>
<p>Please configure the API connection using the button <i class="fa fa-cog"></i> in the top right corner of the
page.</p>
<div class="notification has-text-dark is-background-warning-80">
<h5 class="title is-5 is-unselectable">
<span class="icon-text">
<span class="icon"><i class="fas fa-exclamation-triangle"></i></span>
<span>Warning</span>
</span>
</h5>
<div class="content">
<p>There is no <em class="is-bold">{{ api_var }}</em> configured.</p>
<p>Please configure the API connection using the button <i class="fa fa-cog"></i> in the top right corner of the
page.</p>
</div>
</div>
</template>
<script setup>
import {useStorage} from "@vueuse/core";
const api_url = useStorage('api_url', '')
const api_var = computed(() => (!api_url.value) ? 'API URL' : 'API token')
const api_token = useStorage('api_token', '')
const api_var = computed(() => (!api_token.value) ? 'API Token' : 'API URL')
</script>