improved time display on time record list

This commit is contained in:
2025-08-29 21:43:50 +02:00
parent 7d8967fc6e
commit 7b5ea62bfd
2 changed files with 22 additions and 18 deletions

View File

@@ -13,7 +13,12 @@
let tasks = {}; let tasks = {};
let projects = {}; let projects = {};
let detail = $state(null); let detail = $state(null);
let sortedTimes = $derived.by(() => Object.values(times).sort((b, a) => a.start_time - b.start_time)); let sortedTimes = $derived.by(() => Object.values(times).map(time => ({
...time,
start: display(time.start_time),
end: display(time.end_time),
end_date: display(time.end_time)?.substring(0,10)
})).sort((b, a) => a.start_time - b.start_time));
let selected = $state({}); let selected = $state({});
let ranges = {}; let ranges = {};
let timeMap = $derived.by(calcYearMap); let timeMap = $derived.by(calcYearMap);
@@ -32,9 +37,8 @@
let monthIndex = 0; let monthIndex = 0;
for (let idx in sortedTimes){ for (let idx in sortedTimes){
const time = sortedTimes[idx]; const time = sortedTimes[idx];
const start = display(time.start_time); const year = time.start.substring(0,4);
const year = start.substring(0,4); const month = time.start.substring(5,7);
const month = start.substring(5,7);
if (year != lastYear){ if (year != lastYear){
lastYear = year; lastYear = year;
if (yearCount) result.years[yearIndex] = yearCount; if (yearCount) result.years[yearIndex] = yearCount;
@@ -96,8 +100,7 @@
} }
function toggleRange(range){ function toggleRange(range){
console.log('toggleRange → '+range); let affected = sortedTimes.filter(time => time.start.startsWith(range));
let affected = sortedTimes.filter(time => display(time.start_time).startsWith(range));
if (ranges[range]){ if (ranges[range]){
delete ranges[range]; delete ranges[range];
for (let time of affected){ for (let time of affected){
@@ -166,13 +169,13 @@
{#each sortedTimes as time,line} {#each sortedTimes as time,line}
<tr class={selected[time.id]?'selected':''}> <tr class={selected[time.id]?'selected':''}>
{#if timeMap.years[line]} {#if timeMap.years[line]}
<td class="year" rowspan={timeMap.years[line]} onclick={e => toggleRange(display(time.start_time).substring(0,4))}> <td class="year" rowspan={timeMap.years[line]} onclick={e => toggleRange(time.start.substring(0,4))}>
{display(time.start_time).substring(0,4)} {time.start.substring(0,4)}
</td> </td>
{/if} {/if}
{#if timeMap.months[line]} {#if timeMap.months[line]}
<td class="month" rowspan={timeMap.months[line]} onclick={e => toggleRange(display(time.start_time).substring(0,7))}> <td class="month" rowspan={timeMap.months[line]} onclick={e => toggleRange(time.start.substring(0,7))}>
{display(time.start_time).substring(5,7)} {time.start.substring(5,7)}
</td> </td>
{/if} {/if}
{#if detail == time.id} {#if detail == time.id}
@@ -181,7 +184,7 @@
</td> </td>
{:else} {:else}
<td class="start_end" onclick={e => toggleSelect(time.id)}> <td class="start_end" onclick={e => toggleSelect(time.id)}>
{display(time.start_time)}{#if time.end_time}<wbr><wbr>{display(time.end_time)}{/if} {time.start}{#if time.end_time}<wbr><wbr>{time.start.startsWith(time.end_date)?time.end.substring(11):time.end}{/if}
</td> </td>
<td class="duration" onclick={e => {detail = time.id}}> <td class="duration" onclick={e => {detail = time.id}}>
{#if time.duration} {#if time.duration}

View File

@@ -1,4 +1,5 @@
export function display(timestamp){ export function display(timestamp){
if (timestamp == null) return null;
const date = new Date(timestamp * 1000); const date = new Date(timestamp * 1000);
const year = date.getFullYear(); const year = date.getFullYear();
const month = String(date.getMonth() + 1).padStart(2, '0'); const month = String(date.getMonth() + 1).padStart(2, '0');