You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
177 lines
4.5 KiB
177 lines
4.5 KiB
<script lang="ts">
|
|
import EmptyList from "../components/EmptyList.svelte";
|
|
import EmptyParentEntry from "../components/EmptyParentEntry.svelte";
|
|
import GoalEntry from "../components/GoalEntry.svelte";
|
|
import LogEntry from "../components/LogEntry.svelte";
|
|
import ParentEntry from "../components/ParentEntry.svelte";
|
|
import ProjectEntry from "../components/ProjectEntry.svelte";
|
|
import RefreshSelection from "../components/RefreshSelection.svelte";
|
|
import type { ProjectResult } from "../models/project";
|
|
import { fpGoalStore } from "../stores/goal";
|
|
import { fpLogStore } from "../stores/logs";
|
|
import { fpProjectStore, fpProjectStore2 } from "../stores/project";
|
|
import { fpTaskStore } from "../stores/tasks";
|
|
import { endOfDay, startOfDay } from "../utils/time";
|
|
|
|
let fakeMap: {[projectId: string]: boolean} = {}
|
|
let fakeProjects: ProjectResult[]
|
|
let sortedProjects: ProjectResult[]
|
|
|
|
$: {
|
|
if ($fpGoalStore.stale && !$fpGoalStore.loading) {
|
|
fpGoalStore.load({
|
|
maxTime: new Date(Date.now() + (86400000 * 3)),
|
|
minTime: new Date(),
|
|
});
|
|
}
|
|
}
|
|
|
|
$: {
|
|
if ($fpTaskStore.stale && !$fpTaskStore.loading) {
|
|
fpTaskStore.load({
|
|
active: true,
|
|
expiring: true,
|
|
})
|
|
}
|
|
}
|
|
|
|
$: {
|
|
if ($fpProjectStore.stale && !$fpProjectStore.loading) {
|
|
fpProjectStore.load({
|
|
active: true,
|
|
expiring: true,
|
|
includeSemiActive: true,
|
|
});
|
|
}
|
|
}
|
|
|
|
$: {
|
|
if ($fpProjectStore2.stale && !$fpProjectStore2.loading) {
|
|
fpProjectStore2.load({
|
|
favorite: true,
|
|
});
|
|
}
|
|
}
|
|
|
|
|
|
$: {
|
|
if ($fpLogStore.stale && !$fpLogStore.loading) {
|
|
fpLogStore.load({
|
|
maxTime: endOfDay(new Date()),
|
|
minTime: startOfDay(new Date()),
|
|
})
|
|
}
|
|
}
|
|
|
|
$: {
|
|
const individualTasks = $fpTaskStore.tasks
|
|
.filter(t => $fpProjectStore.projects.find(p => p.id === t.projectId) == null)
|
|
.sort((a,b) => Date.parse(a.endTime) - Date.parse(b.endTime));
|
|
|
|
fakeProjects = [];
|
|
fakeMap = {};
|
|
for (let task of individualTasks) {
|
|
if (!task.project.active) {
|
|
continue;
|
|
}
|
|
|
|
let fakeProject = fakeProjects.find(p => p.id === task.id);
|
|
if (fakeProject == null) {
|
|
fakeMap[task.projectId] = true;
|
|
fakeProjects.push({
|
|
...task.project,
|
|
tasks: [task],
|
|
});
|
|
} else {
|
|
fakeProject.tasks.push(task);
|
|
}
|
|
}
|
|
|
|
for (const fakeProject of fakeProjects) {
|
|
fakeProject.createdTime = fakeProject.tasks.map(t => t.createdTime).sort()[0];
|
|
fakeProject.endTime = fakeProject.tasks[0].endTime;
|
|
}
|
|
}
|
|
|
|
$: {
|
|
sortedProjects = [...fakeProjects, ...$fpProjectStore.projects]
|
|
.sort((a,b) => Date.parse(a.endTime) - Date.parse(b.endTime));
|
|
}
|
|
</script>
|
|
|
|
<div class="page">
|
|
<div class="left">
|
|
{#if !$fpGoalStore.loading || $fpGoalStore.goals.length > 0}
|
|
<h1>Active Goals</h1>
|
|
{/if}
|
|
{#each $fpGoalStore.goals as goal (goal.id)}
|
|
<GoalEntry goal={goal} />
|
|
{/each}
|
|
{#if !$fpGoalStore.loading && $fpGoalStore.goals.length === 0}
|
|
<EmptyList icon="list" text="No goals." />
|
|
{/if}
|
|
{#if $fpLogStore.logs.length > 0}
|
|
<h1>Today's Logs</h1>
|
|
<EmptyParentEntry icon="list">
|
|
{#each $fpLogStore.logs as log (log.id)}
|
|
<LogEntry log={log} />
|
|
{/each}
|
|
</EmptyParentEntry>
|
|
{/if}
|
|
</div>
|
|
<div class="right">
|
|
{#if $fpProjectStore.projects.length > 0}
|
|
<h1>Upcoming Deadlines</h1>
|
|
{#each sortedProjects as project (project.id)}
|
|
<ProjectEntry isFake={fakeMap[project.id]} hideInactive project={project} />
|
|
{/each}
|
|
{/if}
|
|
|
|
{#if $fpProjectStore2.projects.length > 0}
|
|
<h1>Starred Projects</h1>
|
|
{#each $fpProjectStore2.projects as project (project.id)}
|
|
<ProjectEntry hideInactive project={project} />
|
|
{/each}
|
|
{/if}
|
|
</div>
|
|
</div>
|
|
<RefreshSelection />
|
|
|
|
<style>
|
|
div.page {
|
|
display: flex;
|
|
flex-direction: row;
|
|
max-width: 100%;
|
|
padding: 0 1ch;
|
|
margin: 0;
|
|
width: 1020px;
|
|
box-sizing: border-box;
|
|
margin: 1em auto;
|
|
}
|
|
div.left, div.right {
|
|
width: 50%;
|
|
padding: 0 1ch;
|
|
margin: 0;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
h1 {
|
|
font-size: 1.5em;
|
|
font-weight: 100;
|
|
text-align: center;
|
|
}
|
|
|
|
@media screen and (max-width: 900px) {
|
|
div.page {
|
|
display: block;
|
|
}
|
|
div.left, div.right {
|
|
padding-left: 0;
|
|
padding-right: 0;
|
|
padding-bottom: 2em;
|
|
max-width: 100%;
|
|
width: 640px;
|
|
margin: auto;
|
|
}
|
|
}
|
|
</style>
|