feat-WIP: Style updates, new form inputs.
This commit is contained in:
@@ -39,8 +39,7 @@ struct RoomForm: HTML, Sendable {
|
||||
ModalForm(id: Self.id(room), dismiss: dismiss) {
|
||||
h1(.class("text-3xl font-bold pb-6")) { "Room" }
|
||||
form(
|
||||
.class("modal-backdrop"),
|
||||
.init(name: "method", value: "dialog"),
|
||||
.class("grid grid-cols-1 gap-4"),
|
||||
room == nil
|
||||
? .hx.post(route)
|
||||
: .hx.patch(route),
|
||||
@@ -54,34 +53,54 @@ struct RoomForm: HTML, Sendable {
|
||||
input(.class("hidden"), .name("id"), .value("\(id)"))
|
||||
}
|
||||
|
||||
div {
|
||||
label(.for("name")) { "Name:" }
|
||||
Input(id: "name", placeholder: "Room Name")
|
||||
.attributes(.type(.text), .required, .autofocus, .value(room?.name))
|
||||
}
|
||||
div {
|
||||
label(.for("heatingLoad")) { "Heating Load:" }
|
||||
Input(id: "heatingLoad", placeholder: "Heating Load")
|
||||
.attributes(.type(.number), .required, .min("0"), .value(room?.heatingLoad))
|
||||
}
|
||||
div {
|
||||
label(.for("coolingTotal")) { "Cooling Total:" }
|
||||
Input(id: "coolingTotal", placeholder: "Cooling Total")
|
||||
.attributes(.type(.number), .required, .min("0"), .value(room?.coolingTotal))
|
||||
}
|
||||
div {
|
||||
label(.for("coolingSensible")) { "Cooling Sensible:" }
|
||||
Input(id: "coolingSensible", placeholder: "Cooling Sensible (Optional)")
|
||||
.attributes(.type(.number), .min("0"), .value(room?.coolingSensible))
|
||||
}
|
||||
div(.class("pb-6")) {
|
||||
label(.for("registerCount")) { "Registers:" }
|
||||
Input(id: "registerCount", placeholder: "Register Count")
|
||||
.attributes(
|
||||
.type(.number), .required, .min("0"),
|
||||
.value("\(room != nil ? room!.registerCount : 1)"),
|
||||
)
|
||||
}
|
||||
LabeledInput(
|
||||
"Name",
|
||||
.name("name"),
|
||||
.type(.text),
|
||||
.placeholder("Name"),
|
||||
.required,
|
||||
.autofocus,
|
||||
.value(room?.name)
|
||||
)
|
||||
|
||||
LabeledInput(
|
||||
"Heating Load",
|
||||
.name("heatingLoad"),
|
||||
.type(.number),
|
||||
.placeholder("1234"),
|
||||
.required,
|
||||
.min("0"),
|
||||
.value(room?.heatingLoad)
|
||||
)
|
||||
|
||||
LabeledInput(
|
||||
"Cooling Total",
|
||||
.name("coolingTotal"),
|
||||
.type(.number),
|
||||
.placeholder("1234"),
|
||||
.required,
|
||||
.min("0"),
|
||||
.value(room?.coolingTotal)
|
||||
)
|
||||
|
||||
LabeledInput(
|
||||
"Cooling Sensible",
|
||||
.name("coolingSensible"),
|
||||
.type(.number),
|
||||
.placeholder("1234 (Optional)"),
|
||||
.min("0"),
|
||||
.value(room?.coolingSensible)
|
||||
)
|
||||
|
||||
LabeledInput(
|
||||
"Registers",
|
||||
.name("registerCount"),
|
||||
.type(.number),
|
||||
.min("1"),
|
||||
.required,
|
||||
.value(room?.registerCount ?? 1)
|
||||
)
|
||||
|
||||
SubmitButton()
|
||||
.attributes(.class("btn-block"))
|
||||
}
|
||||
|
||||
@@ -14,61 +14,84 @@ struct RoomsView: HTML, Sendable {
|
||||
var body: some HTML {
|
||||
div(.class("flex w-full flex-col")) {
|
||||
Row {
|
||||
h1(
|
||||
.class("flex flex-row text-2xl font-bold pb-6 h-full items-center")
|
||||
) { "Room Loads" }
|
||||
PageTitle { "Room Loads" }
|
||||
|
||||
div(.class("flex justify-end")) {
|
||||
div(.class("flex justify-end items-end -my-2")) {
|
||||
Tooltip("Project wide sensible heat ratio", position: .left) {
|
||||
button(
|
||||
.class(
|
||||
"""
|
||||
grid grid-cols-1 gap-2 p-4 justify-end
|
||||
justify-end items-end p-4
|
||||
hover:bg-neutral hover:text-white hover:rounded-lg
|
||||
"""
|
||||
),
|
||||
.showModal(id: SHRForm.id)
|
||||
) {
|
||||
LabeledContent("Sensible Heat Ratio") {
|
||||
LabeledContent {
|
||||
div(.class("flex justify-end items-end space-x-4")) {
|
||||
// SVG(.squarePen)
|
||||
span(.class("font-bold")) {
|
||||
"Sensible Heat Ratio"
|
||||
}
|
||||
}
|
||||
} content: {
|
||||
if let sensibleHeatRatio {
|
||||
Badge(number: sensibleHeatRatio)
|
||||
}
|
||||
}
|
||||
div(.class("flex justify-end")) {
|
||||
SVG(.squarePen)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
div(.class("flex flex-wrap justify-between mt-6")) {
|
||||
div(.class("flex items-end space-x-4")) {
|
||||
span(.class("font-bold")) { "Heating Total" }
|
||||
Badge(number: rooms.heatingTotal, digits: 0)
|
||||
.attributes(.class("badge-error"))
|
||||
}
|
||||
|
||||
div(.class("flex items-end space-x-4")) {
|
||||
span(.class("font-bold")) { "Cooling Total" }
|
||||
Badge(number: rooms.coolingTotal, digits: 0)
|
||||
.attributes(.class("badge-success"))
|
||||
}
|
||||
|
||||
div(.class("flex justify-end items-end space-x-4 me-4")) {
|
||||
span(.class("font-bold")) { "Cooling Sensible" }
|
||||
Badge(number: rooms.coolingSensible(shr: sensibleHeatRatio), digits: 0)
|
||||
.attributes(.class("badge-info"))
|
||||
}
|
||||
}
|
||||
// .attributes(.class("mt-6 me-4"))
|
||||
|
||||
div(.class("divider")) {}
|
||||
|
||||
SHRForm(projectID: projectID, sensibleHeatRatio: sensibleHeatRatio)
|
||||
|
||||
div(.class("overflow-x-auto")) {
|
||||
table(.class("table table-zebra"), .id("roomsTable")) {
|
||||
table(.class("table table-zebra text-lg"), .id("roomsTable")) {
|
||||
thead {
|
||||
tr {
|
||||
th { Label("Name") }
|
||||
tr(.class("text-lg font-bold")) {
|
||||
th { "Name" }
|
||||
th {
|
||||
div(.class("flex justify-center")) {
|
||||
Label("Heating Load")
|
||||
"Heating Load"
|
||||
}
|
||||
}
|
||||
th {
|
||||
div(.class("flex justify-center")) {
|
||||
Label("Cooling Total")
|
||||
"Cooling Total"
|
||||
}
|
||||
}
|
||||
th {
|
||||
div(.class("flex justify-center")) {
|
||||
Label("Cooling Sensible")
|
||||
"Cooling Sensible"
|
||||
}
|
||||
}
|
||||
th {
|
||||
div(.class("flex justify-center")) {
|
||||
Label("Register Count")
|
||||
"Register Count"
|
||||
}
|
||||
}
|
||||
th {
|
||||
@@ -89,30 +112,6 @@ struct RoomsView: HTML, Sendable {
|
||||
for room in rooms {
|
||||
RoomRow(room: room, shr: sensibleHeatRatio)
|
||||
}
|
||||
// TOTALS
|
||||
tr(.class("font-bold text-xl")) {
|
||||
td { Label("Total") }
|
||||
td {
|
||||
div(.class("flex justify-center")) {
|
||||
Badge(number: rooms.heatingTotal)
|
||||
.attributes(.class("badge-error badge-xl"))
|
||||
}
|
||||
}
|
||||
td {
|
||||
div(.class("flex justify-center")) {
|
||||
Badge(number: rooms.coolingTotal, digits: 0)
|
||||
.attributes(.class("badge-success badge-xl"))
|
||||
}
|
||||
}
|
||||
td {
|
||||
div(.class("flex justify-center")) {
|
||||
Badge(number: rooms.coolingSensible(shr: sensibleHeatRatio), digits: 0)
|
||||
.attributes(.class("badge-info badge-xl"))
|
||||
}
|
||||
}
|
||||
td {}
|
||||
td {}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -143,19 +142,19 @@ struct RoomsView: HTML, Sendable {
|
||||
td {
|
||||
div(.class("flex justify-center")) {
|
||||
Number(room.heatingLoad, digits: 0)
|
||||
.attributes(.class("text-error"))
|
||||
// .attributes(.class("text-error"))
|
||||
}
|
||||
}
|
||||
td {
|
||||
div(.class("flex justify-center")) {
|
||||
Number(room.coolingTotal, digits: 0)
|
||||
.attributes(.class("text-success"))
|
||||
// .attributes(.class("text-success"))
|
||||
}
|
||||
}
|
||||
td {
|
||||
div(.class("flex justify-center")) {
|
||||
Number(coolingSensible, digits: 0)
|
||||
.attributes(.class("text-info"))
|
||||
// .attributes(.class("text-info"))
|
||||
}
|
||||
}
|
||||
td {
|
||||
@@ -204,22 +203,28 @@ struct RoomsView: HTML, Sendable {
|
||||
|
||||
var body: some HTML {
|
||||
ModalForm(id: Self.id, dismiss: true) {
|
||||
h1(.class("text-xl font-bold mb-6")) {
|
||||
"Sensible Heat Ratio"
|
||||
}
|
||||
form(
|
||||
.class("space-y-6"),
|
||||
.class("grid grid-cols-1 gap-4"),
|
||||
.hx.patch("/projects/\(projectID)/rooms/update-shr"),
|
||||
.hx.target("body"),
|
||||
.hx.swap(.outerHTML)
|
||||
) {
|
||||
input(.class("hidden"), .name("projectID"), .value("\(projectID)"))
|
||||
div {
|
||||
label(.for("sensibleHeatRatio")) { "Sensible Heat Ratio" }
|
||||
Input(id: "sensibleHeatRatio", placeholder: "Sensible Heat Ratio")
|
||||
.attributes(.min("0"), .max("1"), .step("0.01"), .value(sensibleHeatRatio))
|
||||
}
|
||||
div {
|
||||
SubmitButton()
|
||||
.attributes(.class("btn-block"))
|
||||
}
|
||||
LabeledInput(
|
||||
"SHR",
|
||||
.type(.number),
|
||||
.placeholder("0.83"),
|
||||
.min("0"),
|
||||
.max("1"),
|
||||
.step("0.01"),
|
||||
.value(sensibleHeatRatio),
|
||||
.autofocus
|
||||
)
|
||||
SubmitButton()
|
||||
.attributes(.class("btn-block my-6"))
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user