SRSoftware/Umbrella
1
0
Fork 0
Code Issues Pull Requests Actions Projects Releases Wiki Activity

loading tasks

Browse Source
This commit is contained in:
Stephan Richter
2025-07-26 22:56:40 +02:00
parent 91aa421ae9
commit 6599b08990
10 changed files with 177 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/src/App.svelte
View File

@@ -10,6 +10,7 @@
import EditService from "./routes/user/EditService.svelte";
import EditUser from "./routes/user/EditUser.svelte";
import Footer from "./Components/Footer.svelte";
import Kanban from "./routes/project/Kanban.svelte";
import Login from "./Components/Login.svelte";
import Messages from "./routes/message/Messages.svelte";
import Menu from "./Components/Menu.svelte";
@@ -52,6 +53,7 @@
<Route path="/project" component={ProjectList} />
<Route path="/project/add" component={ProjectAdd} />
<Route path="/project/:project_id/add_task" component={AddTask} />
<Route path="/project/:id/kanban" component={Kanban} />
<Route path="/project/:id/view" component={ViewPrj} />
<Route path="/search" component={Search} />
<Route path="/task/:parent_task_id/add_subtask" component={AddTask} />

10
frontend/src/Components/StateSelector.svelte
View File

@@ -1,13 +1,19 @@
<script>
import {onMount} from 'svelte';
import {t} from '../translations.svelte.js';
let { caption = t('select_state'), selected = $bindable(0), onchange = (val) => console.log('changed to '+val)} = $props();
import {api} from '../urls.svelte.js';
let {
caption = t('select_state'),
selected = $bindable(0),
onchange = (val) => console.log('changed to '+val),
project_id = '?'
} = $props();
let message = $state(t('loading'));
let states = $state(null);
async function loadStates(){
const url = `${location.protocol}//${location.host.replace('5173','8080')}/api/task/states`;
const url = api(`project/${project_id}/states`);
var resp = await fetch(url,{credentials: 'include'});
if (resp.ok){
states = await resp.json();

109
frontend/src/routes/project/Kanban.svelte Normal file
View File

@@ -0,0 +1,109 @@
<script>
import { api } from '../../urls.svelte.js';
import { onMount } from 'svelte';
import { t } from '../../translations.svelte.js';
import { useTinyRouter } from 'svelte-tiny-router';
let { id } = $props();
let error = $state(null);
let project = $state(null);
let router = useTinyRouter();
let states = $state(null);
let tasks = $state({});
let columns = $derived(states?Object.keys(states).length+1:1);
async function load(){
loadProject();
loadStates();
await loadTasks({project_id:+id,parent_task_id:0});
console.log(tasks);
}
async function loadProject(){
const url = api(`project/${id}`);
const resp = await fetch(url,{credentials:'include'});
if (resp.ok){
project = await resp.json();
error = null;
} else {
error = await resp.text();
}
}
async function loadStates(){
const url = api(`project/${id}/states`);
const resp = await fetch(url,{credentials:'include'});
if (resp.ok){
states = await resp.json();
error = null;
} else {
error = await resp.text();
}
}
async function loadTasks(selector){
const url = api('task/list');
selector.show_closed = true;
var resp = await fetch(url,{
credentials: 'include',
method:'POST',
body:JSON.stringify(selector)
});
if (resp.ok){
var json = await resp.json();
for (var task_id of Object.keys(json)) tasks[task_id] = json[task_id];
} else {
error = await resp.text();
}
}
onMount(load);
</script>
<style>
.grid > *{
min-height: 50px;
border-radius: 5px;
margin: 2px;
padding: 2px;
background: orange;
color: black;
}
.head{
background: lime;
}
</style>
{#if project}
<h1>{project.name} : {t('kanban_view')}</h1>
{/if}
{#if error}
<span class="error">{error}</span>
{/if}
<p>Columns: {columns}</p>
<div class="grid" style="display: grid; grid-template-columns: {`repeat(${columns}, auto)`}">
<div class="head">{t('user')}</div>
{#if states}
{#each Object.entries(states) as [sid,state]}
<div class="head">{t(state)}</div>
{/each}
{/if}
{#each Object.entries(tasks) as [tid,task]}
<div onclick={() => router.navigate(`/task/${tid}/view`)}>
<p>
{task.name}
</p>
<p>
{#each Object.entries(task.members) as [uid,member]}
{#if member.permission.name=='OWNER'}
{member.user.name}
{/if}
{/each}
</p>
</div>
{/each}
</div>

9
frontend/src/routes/project/View.svelte
View File

@@ -51,6 +51,10 @@
}
}
function kanban(){
router.navigate(`/project/${id}/kanban`);
}
async function loadProject(){
const url = api(`project/${id}`);
const resp = await fetch(url,{credentials:'include'});
@@ -132,7 +136,7 @@
<tr>
<th>{t('state')}</th>
<td>
<StateSelector selected={project.status.code} onchange={val => update({status:val})}/>
<StateSelector selected={project.status.code} onchange={val => update({status:val})} project_id={id} />
</td>
</tr>
{#if project.company}
@@ -185,7 +189,8 @@
<tr>
<th>
{t('tasks')}
<button onclick={addTask}>{t('add_new',t('task'))}</button>
<button onclick={addTask}>{t('add_task')}</button>
<button onclick={kanban}>{t('show_kanban')}</button>
</th>
<td class="tasks">
{#if tasks}

2
frontend/src/routes/task/View.svelte
View File

@@ -174,7 +174,7 @@
<tr>
<th>{t('state')}</th>
<td>
<StateSelector selected={task.status.code} onchange={val => update({status:val})}/>
<StateSelector selected={task.status.code} onchange={val => update({status:val})} project_id={task.project_id} />
</td>
</tr>
{#if task.description.rendered}