Implement weight components

This commit is contained in:
2024-08-09 23:40:31 +02:00
parent e8da257bf1
commit 2f161bed79
6 changed files with 68 additions and 76 deletions

View File

@@ -1,50 +1,45 @@
<script lang="ts">
import { GenerateColor } from '$lib/utils'
import EmptyWeightComp from '$components/Weight/EmptyWeightComp.svelte'
import WeightComp from '$components/Weight/WeightComp.svelte'
import type { Weight } from '$lib/database/weight'
import { GenerateColor } from "$lib/utils";
import EmptyWeightComp from "$components/Weight/EmptyWeightComp.svelte";
import WeightComp from "$components/Weight/WeightComp.svelte";
import { main } from "$wails/models";
export let items: Weight[] = []
export let items: main.Weight[] = [];
const dateColors: Map<string, string> = new Map<string, string>()
const dateColors: Map<string, string> = new Map<string, string>();
function getDateColor(item: Weight): string {
if (!item) return GenerateColor()
if (!item.date) return GenerateColor()
const date = item.date.toString().split(' ')[0]
if (!date) return GenerateColor()
if (!dateColors.has(date)) dateColors.set(date, GenerateColor())
function getDateColor(item: main.Weight): string {
if (!item) return GenerateColor();
if (!item.date) return GenerateColor();
const date = item.date.toString().split("T")[0];
if (!date) return GenerateColor();
if (!dateColors.has(date)) dateColors.set(date, GenerateColor());
// THERE'S NOTHING UNDEFINED HERE
// WE GOT RID OF UNDEFINED ON LINE 33
// ASSHOLE
// @ts-ignore
return dateColors.get(date)
return dateColors.get(date);
}
</script>
<template>
<div class="relative flex flex-col flex-grow h-[95vh]" data-vaul-drawer-wrapper id="page">
<div class="relative flex flex-col flex-grow h-[93vh]" data-vaul-drawer-wrapper id="page">
<div class="relative overflow-auto h-full shadow-md sm:rounded-lg">
<table class="w-full text-sm text-left rtl:text-right text-gray-500 dark:text-gray-400">
<thead class="text-xs text-gray-700 uppercase dark:text-gray-400">
<tr>
<th class="px-6 py-3 bg-gray-50 dark:bg-gray-800 w-2/12" scope="col">
Date
</th>
<th class="px-6 py-3 w-10/12" scope="col">
Weight
</th>
</tr>
<tr>
<th class="px-6 py-3 bg-gray-50 dark:bg-gray-800 w-2/12" scope="col"> Date </th>
<th class="px-6 py-3 w-10/12" scope="col"> Weight </th>
</tr>
</thead>
<tbody>
<EmptyWeightComp />
{#each items as f}
<WeightComp item="{f}" dateColor="{getDateColor(f)}" />
{/each}
<EmptyWeightComp />
{#each items as f}
<WeightComp item={f} dateColor={getDateColor(f)} />
{/each}
</tbody>
</table>
</div>
<div>
</div>
<div></div>
</div>
</template>