frontend/src/routes/contacts/+page.svelte (view raw)
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 |
<script lang="ts">
import { goto } from "$app/navigation";
import { NewContact, GetAllContactsSorted } from "$lib/wailsjs/go/main/App";
import { global } from "$lib/global.svelte.js";
if (global.activeContacts.length) {
global.contacts = global.activeContacts;
global.activeContacts = [];
} else {
global.contacts = await GetAllContactsSorted();
}
async function new_contact () {
global.contact = await NewContact();
goto("/contact");
}
function edit_contact(contact) {
return function () {
global.contact = contact;
goto("/contact");
}
}
</script>
<div class="h-full w-full p-4 overflow-scroll flex flex-col">
<div class="flex justify-between">
<h1 class="page-header">Contacts</h1>
<button class="text-button" onclick={new_contact}>Add New Contact</button>
</div>
<ol class="w-full">
{#each global.contacts as contact}
<li class="mt-4 w-full flex justify-between border-b-1 border-primary">
<div class="flex flex-col">
<h4 class="text-sm">
{#if contact.ID == 1}
<span class="text-input">(YOU)</span>
{/if}
{contact.Firstname} {contact.Lastname}
{#if contact.Association}
({contact.Association})
{/if}
</h4>
<span class="min-h-8 text-xs text-input">
{#each contact.Emails as email, index}
{#if index !== 0}
,
{/if}
{email.Value} ({email.Key})
{/each}
</span>
</div>
<div>
<button class="text-button"
onclick={edit_contact(contact)}>Edit</button>
</div>
</li>
{/each}
</ol>
</div>
|