feat(dashboard): consistent loading spinners

This commit is contained in:
Jake/Rads 2022-06-23 22:25:49 +02:00
parent 2e69de1b1b
commit 9efa8d4289
3 changed files with 6 additions and 11 deletions

View file

@ -1,5 +1,5 @@
<script lang="ts">
import { Row, Col, Input, Button, Label, Alert } from 'sveltestrap';
import { Row, Col, Input, Button, Label, Alert, Spinner } from 'sveltestrap';
import autosize from 'svelte-autosize';
// import moment from 'moment-timezone';
import { currentUser } from '../../stores';
@ -11,7 +11,7 @@
export let editMode: boolean;
export let user: System;
export let loading: boolean;
let loading: boolean;
let err: string[] = [];
@ -92,4 +92,5 @@
<br>
<textarea class="form-control" bind:value={input.description} maxlength={1000} use:autosize placeholder={user.description} aria-label="system description"/>
</div>
<Button style="flex: 0" color="primary" on:click={submit} aria-label="submit edits">Submit</Button> <Button style="flex: 0" color="light" on:click={() => editMode = false} aria-label="cancel edits" >Back</Button>
{#if !loading}<Button style="flex: 0" color="primary" on:click={submit} aria-label="submit edits" >Submit</Button> <Button style="flex: 0" color="secondary" on:click={() => editMode = false} aria-label="cancel edits">Back</Button>
{:else}<Button style="flex: 0" color="primary" disabled aria-label="submit edits"><Spinner size="sm"/></Button> <Button style="flex: 0" color="secondary" disabled aria-label="cancel edits">Back</Button>{/if}

View file

@ -10,14 +10,13 @@
export let user: System;
export let isPublic = true;
let loading = false;
let editMode = false;
</script>
<Card class="mb-4">
<CardHeader>
<CardsHeader bind:item={user} bind:loading>
<CardsHeader bind:item={user}>
<FaAddressCard slot="icon" />
</CardsHeader>
</CardHeader>
@ -25,7 +24,7 @@
{#if !editMode}
<Body bind:user bind:editMode bind:isPublic/>
{:else}
<Edit bind:user bind:editMode bind:loading />
<Edit bind:user bind:editMode />
{/if}
</CardBody>
</Card>