hhe/vapor-po
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Working vendor views, does need some tweeks to user experience.

Browse Source
This commit is contained in:
Michael Housh
2025-01-16 11:09:35 -05:00
parent d4a8444700
commit 51124205b8
7 changed files with 155 additions and 91 deletions
Download Patch File Download Diff File Expand all files Collapse all files

46
Sources/App/Views/Utils/Float.swift
View File

@@ -1,29 +1,29 @@
import Elementary
struct Float<C: HTML>: HTML {
struct Float<C: HTML, B: HTML>: HTML {
let id: String
let shouldDisplay: Bool
let body: C?
let resetURL: String?
let closeButton: B?
init(id: String = "float") {
self.id = id
self.shouldDisplay = false
self.resetURL = nil
self.body = nil
self.closeButton = nil
}
init(
id: String = "float",
shouldDisplay: Bool,
resetURL: String? = nil,
@HTMLBuilder body: () -> C
@HTMLBuilder body: () -> C,
@HTMLBuilder closeButton: () -> B
) {
self.id = id
self.shouldDisplay = shouldDisplay
self.resetURL = resetURL
self.body = body()
self.closeButton = closeButton()
}
private var classString: String {
@@ -37,8 +37,10 @@ struct Float<C: HTML>: HTML {
var content: some HTML<HTMLTag.div> {
div(.id(id), .class(classString), .style("display: \(display);")) {
if let body, shouldDisplay {
div(.class("btn-row")) {
Button.close(id: id, resetURL: resetURL)
if let closeButton {
div(.class("btn-row")) {
closeButton
}
}
body
}
@@ -46,4 +48,30 @@ struct Float<C: HTML>: HTML {
}
}
extension Float: Sendable where C: Sendable {}
struct DefaultCloseButton: HTML {
let id: String
let resetURL: String?
var content: some HTML {
Button.close(id: id, resetURL: resetURL)
}
}
extension Float where B == DefaultCloseButton {
init(
id: String = "float",
shouldDisplay: Bool,
resetURL: String? = nil,
@HTMLBuilder body: () -> C
) {
self.init(
id: id,
shouldDisplay: shouldDisplay,
body: body,
closeButton: { DefaultCloseButton(id: id, resetURL: resetURL) }
)
}
}
extension Float: Sendable where C: Sendable, B: Sendable {}

100
Sources/App/Views/Vendors/VendorDetail.swift
View File

@@ -9,57 +9,67 @@ struct VendorDetail: HTML {
var content: some HTML {
Float(shouldDisplay: true) {
VendorForm(.formOnly(vendor))
BranchTable(branches: vendor.branches ?? [])
div(.class("row btn-row")) {
button(.class("btn-done")) { "Done" }
button(.class("danger")) { "Delete" }
h2(.style("margin-left: 20px; font-size: 1.5em;"), .class("label")) { "Branches" }
branchForm
branches
} closeButton: {
Button.close(id: "float")
.attributes(
.hx.get("/vendors"),
.hx.pushURL(true),
.hx.target("body"),
.hx.swap(.outerHTML)
)
}
}
var branchForm: some HTML {
form(
.id("branch-form"),
.hx.post("/vendors/\(vendor.id)/branches"),
.hx.target("#branches"),
.hx.swap(.beforeEnd),
.custom(name: "hx-on::after-request", value: "if(event.detail.successful) this.reset();")
) {
input(
.type(.text), .class("col-9"), .name("name"), .placeholder("Add branch..."), .required,
.hx.post("/vendors/\(vendor.id)/branches"),
.hx.trigger(.event(.keyup).changed().delay("800ms")),
.hx.target("#branches"),
.hx.swap(.beforeEnd) // ,
// .custom(name: "hx-on::after-request", value: "if(event.detail.successful) this.reset();")
)
button(
.type(.submit),
.class("btn-secondary"),
.style("float: right; padding: 10px 50px;"),
.hx.target("#branch-table"),
.hx.swap(.beforeEnd)
) { "+" }
}
}
var branches: some HTML {
ul(.id("branches")) {
for branch in vendor.branches ?? [] {
BranchRow(branch: branch)
}
}
}
struct BranchTable: HTML {
let branches: [VendorBranch]
struct BranchRow: HTML {
let branch: VendorBranch
var content: some HTML {
div {
form(
.id("branch-form"),
.custom(name: "hx-on::after-request", value: "if(event.detail.successful) this.reset();")
var content: some HTML<HTMLTag.li> {
li(.id("branch_\(branch.id)"), .class("branch-row")) {
span(.class("label")) { branch.name.capitalized }
button(
.class("btn"),
.hx.delete("/api/v1/vendors/branches/\(branch.id)"),
.hx.target("#branch_\(branch.id)"),
.hx.swap(.outerHTML.transition(true).swap("0.5s"))
) {
div(.class("row"), .style("margin: 0;")) {
input(.type(.text), .class("col-10"), .placeholder("Branch Name"), .required)
button(
.type(.submit),
.class("btn-secondary"),
.style("float: right; padding: 10px 50px;"),
.hx.target("#branch-table"),
.hx.swap(.beforeEnd)
) { "+" }
}
}
table {
thead {
tr {
th(.class("label col-11")) { "Branch Location" }
th(.class("col-1")) {}
}
}
tbody(.id("branch-table")) {
for branch in branches {
Row(branch: branch)
}
}
}
}
}
struct Row: HTML {
let branch: VendorBranch
var content: some HTML<HTMLTag.tr> {
tr {
td(.class("col-11")) { branch.name }
td(.class("col-1")) { Button.danger { "Delete" } }
img(.src("/images/trash-can.svg"), .width(30), .height(30), .style("margin-top: 5px;"))
}
}
}

20
Sources/App/Views/Vendors/VendorForm.swift
View File

@@ -42,7 +42,7 @@ struct VendorForm: HTML {
form(
.id("vendor-form"),
vendor != nil ? .hx.put(targetURL) : .hx.post(targetURL),
.hx.target("#float"),
.hx.target("#content"),
.hx.swap(.outerHTML)
) {
div(.class("row")) {
@@ -53,11 +53,27 @@ struct VendorForm: HTML {
.name("name"),
.value(vendor?.name ?? ""),
.placeholder("Vendor Name"),
vendor != nil ? .hx.put(targetURL) : .hx.post(targetURL),
.hx.trigger(.event(.keyup).changed().delay("500ms")),
.required
)
if let vendor {
button(
.class("danger"),
.style("font-size: 1.25em; padding: 10px 20px; border-radius: 10px;"),
.hx.delete("/api/v1/vendors/\(vendor.id)"),
.hx.confirm("Are you sure you want to delete this vendor?"),
.hx.target("#vendor_\(vendor.id)"),
.hx.swap(.outerHTML.transition(true).swap("1s")),
.custom(
name: "hx-on::after-request",
value: "if(event.detail.successful) toggleContent('float'); window.location.href='/vendors';"
)
) { "Delete" }
}
button(
.type(.submit),
.class("col-1 btn-primary"),
.class("btn-primary"),
.style("float: right")
) { buttonLabel }
}