vyn/mirai
1
Fork 0
mirror of https://codeberg.org/vyn/mirai.git synced 2025-07-03 01:33:19 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Add a Calendar view on the right side

Browse source
This commit is contained in:
Vyn 2024-10-29 15:02:46 +01:00
parent a80515ff90
commit f1ac8a42d1
18 changed files with 406 additions and 130 deletions
Download patch file Download diff file Expand all files Collapse all files

196
ui/MainView.slint
View file

@ -2,6 +2,7 @@ import { Backend, TaskData } from "Backend.slint";
import { Button, VerticalBox, CheckBox, ScrollView, ComboBox } from "std-widgets.slint";
import { TaskLine } from "./components/TaskLine.slint";
import { EventGroup } from "./components/EventGroup.slint";
import { Calendar } from "./components/Calendar.slint";
import { VPopupIconMenu, VDatePicker, VTimePicker, VCheckBox, VButton, VTag, VText, VTextInput, Svg, Palette } from "@selenite";
import { NewTaskData, SaveTaskData } from "Backend.slint";
import { CreateTaskOrEvent } from "components/CreateTaskOrEvent.slint";
@ -13,111 +14,113 @@ export component MainView inherits Rectangle {
private property<string> icon-not-visible: Svg.not-visible;
private property<bool> completed-tasks-visible: false;
VerticalLayout {
horizontal-stretch: 1;
padding: 16px;
spacing: 16px;
alignment: start;
HorizontalLayout {
horizontal-stretch: 1;
alignment: start;
spacing: 8px;
VButton {
text: "Show/Hide completed tasks";
clicked => {
Backend.toggle-show-completed-tasks();
completed-tasks-visible = !completed-tasks-visible;
}
icon-svg: completed-tasks-visible ? icon-visible : icon-not-visible;
icon-colorize: Palette.control-foreground;
}
}
Rectangle {
horizontal-stretch: 1;
background: Palette.background.brighter(0.2);
height: 1px;
}
HorizontalLayout {
CreateTaskOrEvent {
}
Flickable {
VerticalLayout {
horizontal-stretch: 1;
VerticalLayout {
padding: 16px;
spacing: 16px;
HorizontalLayout {
horizontal-stretch: 1;
alignment: start;
spacing: 16px;
if Backend.days.length == 0 && Backend.unscheduled-tasks.length == 0 : VText {
text: "There is no task to show";
horizontal-alignment: center;
vertical-alignment: center;
spacing: 8px;
VButton {
text: "Show/Hide completed tasks";
clicked => {
Backend.toggle-show-completed-tasks();
completed-tasks-visible = !completed-tasks-visible;
}
icon-svg: completed-tasks-visible ? icon-visible : icon-not-visible;
icon-colorize: Palette.control-foreground;
}
for day[dayIndex] in Backend.days: VerticalLayout {
Rectangle {
background: Palette.card-background;
border-radius: 8px;
VerticalLayout {
padding: 16px;
HorizontalLayout {
alignment: start;
VText {
text: Backend.format-date(day.date);
color: day.isLate ? Palette.orange : Palette.foreground;
font-size: 1.2rem;
}
VerticalLayout {
alignment: center;
}
Rectangle {
horizontal-stretch: 1;
background: Palette.background.brighter(0.2);
height: 1px;
}
CreateTaskOrEvent {
}
Flickable {
horizontal-stretch: 1;
VerticalLayout {
alignment: start;
spacing: 16px;
if Backend.days.length == 0 && Backend.unscheduled-tasks.length == 0 : VText {
text: "There is no task to show";
horizontal-alignment: center;
vertical-alignment: center;
}
for day[dayIndex] in Backend.days: VerticalLayout {
Rectangle {
background: Palette.card-background;
border-radius: 8px;
VerticalLayout {
padding: 16px;
HorizontalLayout {
alignment: start;
VText {
text: day.relativeDaysDiff == 0 ? " - today" :
day.relativeDaysDiff == 1 ? " - tomorrow" :
day.relativeDaysDiff == -1 ? " - yesterday" :
day.relativeDaysDiff > 0 ? " - in \{day.relativeDaysDiff} days" :
" - \{-day.relativeDaysDiff} days ago";
color: Palette.foreground-hint;
font-size: 1rem;
text: Backend.format-date(day.date);
color: day.isLate ? Palette.orange : Palette.foreground;
font-size: 1.2rem;
}
VerticalLayout {
alignment: center;
VText {
text: day.relativeDaysDiff == 0 ? " - today" :
day.relativeDaysDiff == 1 ? " - tomorrow" :
day.relativeDaysDiff == -1 ? " - yesterday" :
day.relativeDaysDiff > 0 ? " - in \{day.relativeDaysDiff} days" :
" - \{-day.relativeDaysDiff} days ago";
color: Palette.foreground-hint;
font-size: 1rem;
}
}
}
for event[eventIndex] in day.events: VerticalLayout {
padding-top: 16px;
EventGroup {
event: event;
}
}
for task[taskIndex] in day.tasks: VerticalLayout {
padding-top: taskIndex == 0 ? 16px : 0px;
padding-bottom: 8px;
TaskLine {
task: task;
date: day.date;
source-index: task.sourceId;
task-index: task.id;
}
}
}
for event[eventIndex] in day.events: VerticalLayout {
padding-top: 16px;
EventGroup {
event: event;
}
}
for task[taskIndex] in day.tasks: VerticalLayout {
padding-top: taskIndex == 0 ? 16px : 0px;
padding-bottom: 8px;
TaskLine {
task: task;
date: day.date;
source-index: task.sourceId;
task-index: task.id;
}
}
}
}
}
if Backend.unscheduled-tasks.length > 0 : VerticalLayout {
Rectangle {
background: Palette.card-background;
border-radius: 8px;
VerticalLayout {
padding: 16px;
HorizontalLayout {
alignment: start;
VText {
text: "Unscheduled";
color: Palette.foreground;
font-size: 1.2rem;
if Backend.unscheduled-tasks.length > 0 : VerticalLayout {
Rectangle {
background: Palette.card-background;
border-radius: 8px;
VerticalLayout {
padding: 16px;
HorizontalLayout {
alignment: start;
VText {
text: "Unscheduled";
color: Palette.foreground;
font-size: 1.2rem;
}
}
}
for task[taskIndex] in Backend.unscheduled-tasks: VerticalLayout {
padding-top: taskIndex == 0 ? 16px : 0px;
padding-bottom: 8px;
TaskLine {
task: task;
source-index: task.sourceId;
task-index: task.id;
for task[taskIndex] in Backend.unscheduled-tasks: VerticalLayout {
padding-top: taskIndex == 0 ? 16px : 0px;
padding-bottom: 8px;
TaskLine {
task: task;
source-index: task.sourceId;
task-index: task.id;
}
}
}
}
@ -125,5 +128,10 @@ export component MainView inherits Rectangle {
}
}
}
Calendar {
init => { debug("cal len", Backend.calendar.length) }
days: Backend.calendar;
}
}
}