AmineTMIRI/frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add skeleton to retail trader tracker graph

Browse Source
This commit is contained in:
MuslemRahimi 2024-08-21 23:15:27 +02:00
parent f6e33ef53e
commit 4cb38a05fa
1 changed files with 10 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
src/routes/home/+page.svelte
View File

@ -24,7 +24,7 @@
export let data; export let data;
let isLoaded = false;
const quickInfo = data?.getDashboard?.quickInfo; const quickInfo = data?.getDashboard?.quickInfo;
@ -143,6 +143,7 @@ function latestInfoDate(inputDate) {
let Feedback; let Feedback;
onMount( async() => { onMount( async() => {
isLoaded = true;
Feedback = (await import('$lib/components/Feedback.svelte')).default Feedback = (await import('$lib/components/Feedback.svelte')).default
}) })
@ -352,17 +353,17 @@ onMount( async() => {
</div> </div>
</Card.Header> </Card.Header>
<Card.Content> <Card.Content>
{#if data?.getDashboard?.retailTracker?.length !== 0} {#if isLoaded && data?.getDashboard?.retailTracker?.length !== 0}
<div class="app w-full h-[300px] mt-5"> <div class="app w-full h-[300px] mt-5">
<Chart {init} options={optionsGraph} class="chart" /> <Chart {init} options={optionsGraph} class="chart" />
</div> </div>
{:else} {:else}
<div class="flex justify-center items-center h-80"> <div class="flex w-11/12 flex-col gap-x-4 gap-y-5 mt-5">
<div class="relative"> <div class="rounded-lg skeleton h-6 w-full"></div>
<label class="bg-[#09090B] rounded-xl h-14 w-14 flex justify-center items-center absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2"> <div class="rounded-lg skeleton h-6 w-11/12"></div>
<span class="loading loading-spinner loading-md"></span> <div class="rounded-lg skeleton h-6 w-5/6"></div>
</label> <div class="rounded-lg skeleton h-6 w-72"></div>
</div> <div class="rounded-lg skeleton h-6 w-28"></div>
</div> </div>
{/if} {/if}
</Card.Content> </Card.Content>