feat: Working on route and id helpers for views.

This commit is contained in:
2025-01-17 23:50:04 -05:00
parent 531a385dba
commit d8328314ed
21 changed files with 585 additions and 255 deletions

View File

@@ -0,0 +1,11 @@
import Elementary
extension HTMLAttribute where Tag: HTMLTrait.Attributes.Global {
static var customToggleFloatAfterRequest: Self {
.custom(
name: "hx-on::after-request",
value: "if(event.detail.successful) toggleContent('float')"
)
}
}

View File

@@ -1,47 +0,0 @@
import Elementary
import ElementaryHTMX
import SharedModels
import Vapor
struct EmployeeSelect: HTML {
let classString: String
let name: String
let employees: [Employee]?
let context: Context
var content: some HTML {
if let employees {
select(.name(name), .class(classString)) {
for employee in employees {
option(.value(employee.id.uuidString)) { employee.fullName }
}
}
.attributes(.style("margin-left: 15px;"), when: context == .search)
} else {
div(
.hx.get("/select/employee?context=\(context.rawValue)"),
.hx.target("this"),
.hx.swap(.outerHTML.transition(true).swap("0.5s")),
.hx.indicator("next .hx-indicator"),
.hx.trigger(.event(.revealed)),
.style("display: inline;")
) {
Img.spinner().attributes(.class("hx-indicator"))
}
}
}
static func purchaseOrderForm(employees: [Employee]? = nil) -> Self {
.init(classString: "col-3", name: "createdForID", employees: employees, context: .form)
}
static func purchaseOrderSearch(employees: [Employee]? = nil) -> Self {
.init(classString: "col-3", name: "employeeID", employees: employees, context: .search)
}
enum Context: String, Codable, Content {
case form
case search
}
}

View File

@@ -4,4 +4,8 @@ enum Img {
static func spinner(width: Int = 30, height: Int = 30) -> some HTML<HTMLTag.img> {
img(.src("/images/spinner.svg"), .width(width), .height(height))
}
static func search(width: Int = 30, height: Int = 30) -> some HTML<HTMLTag.img> {
img(.src("/images/search.svg"), .width(width), .height(height))
}
}

View File

@@ -0,0 +1,88 @@
import Elementary
import ElementaryHTMX
import SharedModels
import Vapor
struct EmployeeSelect: HTML {
let employees: [Employee]?
let context: SelectContext
var content: some HTML {
if let employees {
select(.name("createdForID"), .class(context.classString)) {
for employee in employees {
option(.value(employee.id.uuidString)) { employee.fullName }
}
}
.attributes(.style("margin-left: 15px;"), when: context == .purchaseOrderSearch)
} else {
div(
.hx.get("/select/employee?context=\(context.rawValue)"),
.hx.target("this"),
.hx.swap(.outerHTML.transition(true).swap("0.5s")),
.hx.indicator("next .hx-indicator"),
.hx.trigger(.event(.revealed)),
.style("display: inline;")
) {
Img.spinner().attributes(.class("hx-indicator"))
}
}
}
static func purchaseOrderForm(employees: [Employee]? = nil) -> Self {
.init(employees: employees, context: .purchaseOrderForm)
}
static func purchaseOrderSearch(employees: [Employee]? = nil) -> Self {
.init(employees: employees, context: .purchaseOrderSearch)
}
}
struct VendorBranchSelect: HTML {
let branches: [VendorBranch.Detail]?
let context: SelectContext
var content: some HTML {
if let branches {
select(.name("vendorBranchID"), .class(context.classString)) {
for branch in branches {
option(.value(branch.id.uuidString)) { "\(branch.vendor.name) - \(branch.name)" }
}
}
.attributes(.style("margin-left: 15px;"), when: context == .purchaseOrderSearch)
} else {
div(
.hx.get("/select/vendor-branches?context=\(context.rawValue)"),
.hx.target("this"),
.hx.swap(.outerHTML.transition(true).swap("0.5s")),
.hx.indicator("next .hx-indicator"),
.hx.trigger(.event(.revealed)),
.style("display: inline;")
) {
Img.spinner().attributes(.class("hx-indicator"))
}
}
}
static func purchaseOrderForm(branches: [VendorBranch.Detail]? = nil) -> Self {
.init(branches: branches, context: .purchaseOrderForm)
}
static func purchaseOrderSearch(branches: [VendorBranch.Detail]? = nil) -> Self {
.init(branches: branches, context: .purchaseOrderSearch)
}
}
enum SelectContext: String, Codable, Content {
case purchaseOrderForm
case purchaseOrderSearch
var classString: String {
switch self {
case .purchaseOrderForm: return "col-3"
case .purchaseOrderSearch: return "col-6"
}
}
}