43 lines
1.0 KiB
Svelte
43 lines
1.0 KiB
Svelte
<script>
|
|
let { onclick, ondragstart, tag_colors = {}, task } = $props();
|
|
|
|
function calcStyle(){
|
|
if (!task.tags || !tag_colors) return '';
|
|
for (let tag of task.tags){
|
|
let color = tag_colors[tag.toLowerCase()];
|
|
if (color) return `background-color: ${color}`;
|
|
}
|
|
return '';
|
|
}
|
|
let style = $derived.by(calcStyle)
|
|
|
|
</script>
|
|
|
|
<div
|
|
draggable="true"
|
|
class={`box prio_${task.total_prio} p${Math.floor(task.total_prio/10)*10} p${task.total_prio % 10}`}
|
|
{onclick} {ondragstart}
|
|
style={style}
|
|
title={task.description.source}
|
|
>
|
|
<span class="title">{task.name}</span>
|
|
{#if task.estimated_time}
|
|
<span class="estimate">
|
|
({task.estimated_time} h)
|
|
</span>
|
|
{/if}
|
|
{#if task.tags}
|
|
<span class="tags">
|
|
{task.tags.join(' ')}
|
|
</span>
|
|
{/if}
|
|
{#if task.due_date}
|
|
<span class="due_date" style={style}>
|
|
{#if task.start_date}
|
|
{task.start_date}
|
|
{/if}
|
|
→ {task.due_date}
|
|
</span>
|
|
{/if}
|
|
|
|
</div> |