OpenSource Projekt-Management-Software
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 

74 lines
2.0 KiB

<script>
import { t } from '../../translations.svelte';
import Address from './Address.svelte';
import Email from './Email.svelte';
import ExtraField from './ExtraField.svelte';
import FN from './FN.svelte';
import Name from './Name.svelte';
import Org from './Org.svelte';
let { contact } = $props();
let addresses = $derived(contact.vcard.match(/^ADR.*:.+$/gm));
let code = $state(false);
let emails = $derived(contact.vcard.match(/^EMAIL.*:.+$/gm));
let extra_fields = $derived(contact.vcard.match(/^X-.*:.+/gm));
function toggleCode(){
code = !code;
}
</script>
<fieldset class="vcard">
<legend>
{t('contact_number',{number:contact.id})}
<button class="symbol" onclick={toggleCode}>C</button>
</legend>
<table>
<thead></thead>
<tbody>
<tr>
<td>
<FN vcard={contact.vcard} />
</td>
{#if code}
<td rowspan="6">
<pre>{contact.vcard}</pre>
</td>
{/if}
</tr>
<tr>
<td>
<Org vcard={contact.vcard} />
</td>
</tr>
<tr>
<td>
<Name vcard={contact.vcard} />
</td>
</tr>
<tr>
<td>
{#each addresses as code}
<Address {code} />
{/each}
</td>
</tr>
<tr>
<td>
{#each emails as code}
<Email {code} />
{/each}
</td>
</tr>
<tr>
<td>
{#each extra_fields as code}
<ExtraField {code} />
{/each}
</td>
</tr>
</tbody>
</table>
</fieldset>