Standardized how we use the Message component.
This commit is contained in:
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div class="columns is-multiline">
|
||||
<div class="column is-12 is-clearfix">
|
||||
<div class="column is-12 is-clearfix is-unselectable">
|
||||
<span class="title is-4">
|
||||
<NuxtLink to="/backends">Backends</NuxtLink>
|
||||
-
|
||||
@@ -11,8 +11,7 @@
|
||||
<div class="is-pulled-right">
|
||||
<div class="field is-grouped">
|
||||
<p class="control">
|
||||
<button class="button is-info" @click.prevent="loadContent" :disabled="isLoading"
|
||||
:class="{'is-loading':isLoading}">
|
||||
<button class="button is-info" @click="loadContent" :disabled="isLoading" :class="{'is-loading':isLoading}">
|
||||
<span class="icon"><i class="fas fa-sync"></i></span>
|
||||
</button>
|
||||
</p>
|
||||
@@ -25,16 +24,11 @@
|
||||
</div>
|
||||
|
||||
<div class="column is-12" v-if="items.length < 1">
|
||||
<Message message_class="has-background-info-90 has-text-dark" title="No Libraries">
|
||||
<span class="icon-text" v-if="isLoading">
|
||||
<span class="icon"><i class="fas fa-spinner fa-spin"></i></span>
|
||||
<span>Loading libraries list. Please wait...</span>
|
||||
</span>
|
||||
<span class="icon-text" v-else>
|
||||
<span class="icon"><i class="fas fa-info-circle"></i></span>
|
||||
<span>No libraries found in the backend.</span>
|
||||
</span>
|
||||
</Message>
|
||||
<Message message_class="has-background-info-90 has-text-dark" title="Loading" icon="fas fa-spinner fa-spin"
|
||||
message="Loading libraries list. Please wait..." v-if="isLoading"/>
|
||||
<Message v-else message_class="has-background-warning-80 has-text-dark" title="Warning"
|
||||
icon="fas fa-exclamation-circle"
|
||||
message="WatchState was unable to get any libraries from the backend."/>
|
||||
</div>
|
||||
|
||||
<div class="column is-6" v-for="item in items" :key="`library-${item.id}`">
|
||||
@@ -82,31 +76,14 @@
|
||||
</div>
|
||||
|
||||
<div class="column is-12">
|
||||
<Message message_class="has-background-info-90 has-text-dark">
|
||||
<div class="is-pulled-right">
|
||||
<NuxtLink @click="show_page_tips=false" v-if="show_page_tips">
|
||||
<span class="icon"><i class="fas fa-arrow-up"></i></span>
|
||||
<span>Close</span>
|
||||
</NuxtLink>
|
||||
<NuxtLink @click="show_page_tips=true" v-else>
|
||||
<span class="icon"><i class="fas fa-arrow-down"></i></span>
|
||||
<span>Open</span>
|
||||
</NuxtLink>
|
||||
</div>
|
||||
<h5 class="title is-5 is-unselectable">
|
||||
<span class="icon-text">
|
||||
<span class="icon"><i class="fas fa-info-circle"></i></span>
|
||||
<span>Tips</span>
|
||||
</span>
|
||||
</h5>
|
||||
<div class="content" v-if="show_page_tips">
|
||||
<ul>
|
||||
<li>Ignoring library will prevent any content from being added to the local database from that library
|
||||
during import process, and via webhook events.
|
||||
</li>
|
||||
<li>Libraries that shows <code>Supported: No</code> will not be processed by the system.</li>
|
||||
</ul>
|
||||
</div>
|
||||
<Message message_class="has-background-info-90 has-text-dark" title="Tips" icon="fas fa-info-circle"
|
||||
:toggle="show_page_tips" @toggle="show_page_tips = !show_page_tips" :use-toggle="true">
|
||||
<ul>
|
||||
<li>Ignoring library will prevent any content from being added to the local database from the library
|
||||
during import process, and webhook events handling.
|
||||
</li>
|
||||
<li>Libraries that shows <code>Supported: No</code> will not be processed by <code>WatchState</code>.</li>
|
||||
</ul>
|
||||
</Message>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user