Files
Umbrella/frontend/src/routes/project/View.svelte

94 lines
2.4 KiB
Svelte

<script>
import { t } from '../../translations.svelte.js';
import { onMount } from 'svelte';
import TaskList from '../../Components/TaskList.svelte';
let { id } = $props();
let project = $state(null);
let error = $state(null);
let tasks = $state(null);
async function loadProject(){
const url = `${location.protocol}//${location.host.replace('5173','8080')}/api/project/${id}`;
const resp = await fetch(url,{credentials:'include'});
if (resp.ok){
project = await resp.json();
error = null;
loadTasks();
} else {
error = await resp.text();
}
}
async function loadTasks(){
const url = `${location.protocol}//${location.host.replace('5173','8080')}/api/task/list`;
const resp = await fetch(url,{
credentials:'include',
method:'POST',
body:JSON.stringify({project_id:+id})
});
if (resp.ok){
tasks = await resp.json();
error = null;
} else {
error = await resp.text();
}
}
onMount(loadProject);
</script>
{#if error}
<span class="error">{error}</span>
{/if}
{#if project}
<table>
<tbody>
<tr>
<th>{t('project')}</th>
<td>{project.name}</td>
</tr>
{#if project.company}
<tr>
<th>{t('company')}</th>
<td>{project.company.name}</td>
</tr>
{/if}
<tr>
<th>{t('context')}</th>
<td>
<button>{t('files')}</button>
<button>{t('models')}</button>
<button>{t('times')}</button>
</td>
</tr>
<tr>
<th>{t('description')}</th>
<td>{@html project.description.rendered}</td>
</tr>
<tr>
<th>{t('estimated_time')}</th>
<td class="error">TODO</td>
</tr>
<tr>
<th>{t('tasks')}</th>
<td>
{#if tasks}
<TaskList {tasks} />
{/if}
</td>
</tr>
<tr>
<th>{t('members')}</th>
<td>
<ul>
{#each Object.entries(project.members) as [uid,member]}
<li>{member.user.name}: {t('permission.'+member.permission)}</li>
{/each}
</ul>
</td>
</tr>
</tbody>
</table>
{/if}