135 lines
3.9 KiB
Svelte
135 lines
3.9 KiB
Svelte
<script>
|
||
import {onMount} from 'svelte';
|
||
import {api} from '../../urls.svelte';
|
||
import { error, yikes } from '../../warn.svelte';
|
||
import {t} from '../../translations.svelte';
|
||
|
||
import Editor from './Editor.svelte';
|
||
import LineEditor from '../../Components/LineEditor.svelte';
|
||
import Notes from '../notes/RelatedNotes.svelte';
|
||
|
||
let companies = $state(null);
|
||
let new_company = $state({name:null,email:null});
|
||
let selected = $state(0);
|
||
let missing_fields = $derived(!new_company.name || !new_company.email?.includes('@'));
|
||
|
||
async function create_company(){
|
||
const url = api('company');
|
||
const resp = await fetch(url,{
|
||
credentials : 'include',
|
||
method : 'POST',
|
||
body : JSON.stringify(new_company)
|
||
});
|
||
if (resp.ok){
|
||
const company = await resp.json();
|
||
companies[company.id] = company;
|
||
yikes();
|
||
} else {
|
||
error(resp);
|
||
}
|
||
}
|
||
|
||
async function drop(company){
|
||
if (!confirm(t('confirm_delete',{element:company.name}))) return;
|
||
const url = api(`company/${company.id}`);
|
||
const resp = await fetch(url,{
|
||
credentials : 'include',
|
||
method : 'DELETE'
|
||
});
|
||
if (resp.ok){
|
||
delete companies[company.id];
|
||
yikes();
|
||
} else {
|
||
error(await resp.text());
|
||
}
|
||
return false;
|
||
}
|
||
|
||
async function loadCompanies(){
|
||
const url = api('company/list');
|
||
const resp = await fetch(url,{credentials:'include'});
|
||
if (resp.ok){
|
||
companies = await resp.json();
|
||
yikes();
|
||
} else {
|
||
error(resp);
|
||
}
|
||
}
|
||
|
||
function showDetail(company_id){
|
||
selected = company_id;
|
||
}
|
||
|
||
onMount(loadCompanies)
|
||
</script>
|
||
|
||
<svelte:head>
|
||
<title>Umbrella – {t('companies')}</title>
|
||
</svelte:head>
|
||
|
||
<fieldset>
|
||
<legend>
|
||
{t('companies')}
|
||
</legend>
|
||
{#if companies}
|
||
<table class="companies">
|
||
<thead>
|
||
<tr>
|
||
<th>
|
||
{t('name')}
|
||
</th>
|
||
<th>
|
||
{t('email')}
|
||
</th>
|
||
<th>
|
||
{t('members')}
|
||
</th>
|
||
<th>
|
||
{t('actions')}
|
||
</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td>
|
||
<input type="text" bind:value={new_company.name} />
|
||
</td>
|
||
<td>
|
||
<input type="email" bind:value={new_company.email} />
|
||
</td>
|
||
<td></td>
|
||
<td>
|
||
<button disabled={missing_fields} onclick={create_company}>{t('create_new_object',{object:t('company')})}</button>
|
||
</td>
|
||
</tr>
|
||
{#each Object.entries(companies) as [cid, company]}
|
||
<tr onclick={e => showDetail(cid)}>
|
||
<td>{company.name}</td>
|
||
<td>{company.email}</td>
|
||
<td>
|
||
<ul>
|
||
{#each Object.entries(company.members) as [uid,member]}
|
||
<li>{member.name}</li>
|
||
{/each}
|
||
</ul>
|
||
</td>
|
||
<td>
|
||
<button onclick={e => drop(company)}>{t('delete_object',{object:t('company')})}</button>
|
||
</td>
|
||
</tr>
|
||
{#if selected==cid}
|
||
<tr>
|
||
<td colspan="4" class="edit">
|
||
<Editor {company} />
|
||
<div class="notes">
|
||
<Notes module="company" entity_id={cid} />
|
||
</div>
|
||
</td>
|
||
</tr>
|
||
{/if}
|
||
{/each}
|
||
</tbody>
|
||
</table>
|
||
{/if}
|
||
</fieldset>
|