initial signals set up

This commit is contained in:
Julian 2025-06-07 18:23:25 +02:00
parent 8437489085
commit 8377743d1b
2 changed files with 98 additions and 16 deletions

View file

@ -1,8 +1,65 @@
package fahrtenbuch
import scala.scalajs.js.Date
import com.raquo.laminar.api.L.{*, given}
import org.scalajs.dom.HTMLTableRowElement
import com.raquo.laminar.nodes.ReactiveHtmlElement
case class Entry(startKm: Double, endKm: Double, date: Date, animal: String, paid: Boolean, driver: String):
type Id = String
case class EntryComponent(
entry: Entry,
editMode: Boolean
):
def render: ReactiveHtmlElement[HTMLTableRowElement] = {
if editMode then
tr(
td(input(cls := "input")),
td(input(cls := "input")),
td(input(cls := "input")),
td(input(cls := "input")),
td(input(cls := "input")),
td(input(cls := "input")),
td(input(cls := "input")),
td(input(cls := "input")),
td(
button(
cls := "button is-success",
span(
cls := "icon edit",
i(cls := "mdi mdi-18px mdi-check-bold")
)
)
)
)
else
tr(
td(entry.date.toDateString()),
td(entry.driver),
td(entry.startKm),
td(entry.endKm),
td(entry.animal),
td(entry.costWear),
td(entry.costTotal),
td(entry.paid),
td(
button(
cls := "button is-link",
span(cls := "icon edit", i(cls := "mdi mdi-18px mdi-pencil"))
)
)
)
}
case class Entry(
id: Id,
startKm: Double,
endKm: Double,
date: Date,
animal: String,
paid: Boolean,
driver: String
):
val distance = endKm - startKm
// 13 cent pro km, 5 cent Abnutzung

View file

@ -20,10 +20,27 @@ def Fahrtenbuch(): Unit =
object Main {
val entries = List(
Entry(100.0, 200.0, new Date(), "🐷", true, "Gesine"),
Entry(200.0, 300.0, new Date(), "Dog", false, "Bob")
val entries = Var(
List(
Entry("0", 100.0, 200.0, new Date(), "🐷", true, "Gesine"),
Entry("1", 200.0, 300.0, new Date(), "Dog", false, "Bob")
)
)
val entriesSignal = entries.signal
val editState = Var(Map.empty[Id, Boolean])
val editStateSignal = editState.signal
val entryComponents: Signal[List[EntryComponent]] =
entriesSignal
.combineWith(editStateSignal)
.map { case (entries, editState) =>
entries.map(entry =>
EntryComponent(entry, editState.getOrElse(entry.id, false))
)
}
val editClickBus = new EventBus[(Id, Boolean)]
def appElement(): HtmlElement =
div(
@ -40,21 +57,29 @@ object Main {
th("Tier"),
th("Abnutzung"),
th("Gesamtkosten"),
th("Bezahlt")
th("Bezahlt"),
th()
)
),
tbody(
entries.map(entry =>
tr(
td(entry.date.toDateString()),
td(entry.driver),
td(entry.startKm),
td(entry.endKm),
td(entry.animal),
td(entry.costWear),
td(entry.costTotal),
td(entry.paid),
td(span(cls := "icon", i(cls := "mdi mdi-pencil-box")))
children <-- entryComponents.map(_.map(_.render))
),
tr(
td(input(cls := "input")),
td(input(cls := "input")),
td(input(cls := "input")),
td(input(cls := "input")),
td(input(cls := "input")),
td(input(cls := "input")),
td(input(cls := "input")),
td(input(cls := "input")),
td(
button(
cls := "button is-success",
span(
cls := "icon edit",
i(cls := "mdi mdi-18px mdi-check-bold")
)
)
)
)