Makes navigation a little bit better.
This commit is contained in:
Bryce
@@ -1,12 +1,13 @@
|
||||
(ns auto-ap.ssr.components.aside
|
||||
(:require [auto-ap.client-routes :as client-routes]
|
||||
[auto-ap.logging :as alog]
|
||||
[auto-ap.routes.admin.clients :as ac-routes]
|
||||
[auto-ap.routes.admin.excel-invoices :as ei-routes]
|
||||
[auto-ap.routes.admin.import-batch :as ib-routes]
|
||||
[auto-ap.routes.admin.transaction-rules :as transaction-rules]
|
||||
[auto-ap.routes.admin.vendors :as v-routes]
|
||||
[auto-ap.routes.payments :as payment-routes]
|
||||
[auto-ap.routes.invoice :as invoice-route]
|
||||
[auto-ap.routes.payments :as payment-routes]
|
||||
[auto-ap.ssr-routes :as ssr-routes]
|
||||
[auto-ap.ssr.hiccup-helper :as hh]
|
||||
[auto-ap.ssr.hx :as hx]
|
||||
@@ -19,30 +20,36 @@
|
||||
[:a (-> params
|
||||
(dissoc :icon)
|
||||
(assoc :type "button")
|
||||
(update :class str " cursor-pointer flex items-center p-2 w-full text-xs text-gray-600 rounded-lg transition duration-75 group hover:bg-gray-100 dark:text-white dark:hover:bg-gray-700")
|
||||
(update :class (fn [c]
|
||||
(cond-> (or c "cursor-pointer flex items-center p-2 w-full text-sm rounded-lg transition duration-75 group hover:bg-gray-100 dark:hover:bg-gray-700 select-none")
|
||||
(:active? params) (hh/add-class "text-blue-600 font-extrabold dark:text-blue-100 bg-gray-100")
|
||||
(not (:active? params)) (hh/add-class "text-gray-600 dark:text-white"))))
|
||||
(assoc :hx-indicator "find .htmx-indicator")
|
||||
(assoc :hx-boost "true")
|
||||
(assoc :hx-select "#app")
|
||||
(assoc :hx-target "#app")
|
||||
(assoc :hx-swap "innerHTML"))
|
||||
|
||||
(when (:icon params)
|
||||
[:span {:class "flex-shrink-0 w-6 h-6 text-gray-400 transition duration-75 group-hover:text-blue-500 dark:text-gray-400 group-hover:scale-110 dark:group-hover:text-white mr-3"}
|
||||
(:icon params)])
|
||||
|
||||
(into [:span {:class "flex-1 text-left whitespace-nowrap text-gray-600 dark:text-white"}] children)
|
||||
(when (get params "@click")
|
||||
(into [:span {:class "flex-1 text-left whitespace-nowrap"}] children)
|
||||
(when (get params "@click.prevent")
|
||||
[:svg {:aria-hidden "true", :class "w-6 h-6", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"}
|
||||
[:path {:fill-rule "evenodd", :d "M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z", :clip-rule "evenodd"}]])
|
||||
[:div.htmx-indicator.flex.items-center
|
||||
(svg/spinner-primary {:class "inline w-4 h-4 text-white"})]]])
|
||||
|
||||
(defn sub-menu- [params & children]
|
||||
[:ul (update params
|
||||
:class (fnil hh/add-class "")"py-2 space-y-1.5")
|
||||
[:ul (cond-> (update params
|
||||
:class (fnil hh/add-class "") "space-y-1.5 max-h-0 transition transition-all overflow-hidden")
|
||||
true (assoc ":class" (format "selected == '%s' ? 'py-0.5' : 'py-0'" (:selector params))
|
||||
:x-ref "submenu"
|
||||
":style" (format "selected == '%s' ? 'max-height: ' + $refs.submenu.scrollHeight + 'px' : ''" (:selector params))))
|
||||
(for [c children]
|
||||
[:li
|
||||
(update-in c [1 1 :class ] str " flex items-center p-2 pl-11 w-full text-base font-normal text-gray-900 rounded-lg transition duration-75 group hover:bg-gray-100 dark:text-white dark:hover:bg-gray-700")])])
|
||||
(update-in c [1 1 :class ] (fn [c]
|
||||
(hh/add-class (or c "") " flex items-center p-2 pl-11 w-full text-base font-normal rounded-lg transition duration-75 group hover:bg-gray-100 dark:text-white dark:hover:bg-gray-700")))])])
|
||||
|
||||
(defn left-aside- [{:keys [nav page-specific]} & children]
|
||||
[:aside {:id "left-nav",
|
||||
@@ -67,84 +74,113 @@
|
||||
page-specific]
|
||||
)]])
|
||||
|
||||
(defn main-aside-nav- []
|
||||
[:ul {:class "space-y-1"}
|
||||
(defn main-aside-nav- [request]
|
||||
[:ul {:class "space-y-1"
|
||||
:x-data (hx/json {:selected
|
||||
(cond
|
||||
(#{::invoice-route/page} (:matched-route request))
|
||||
"invoices"
|
||||
|
||||
(#{:pos-sales :pos-expected-deposits :pos-tenders :pos-refunds :pos-cash-drawer-shifts} (:matched-route request))
|
||||
"sales"
|
||||
(#{::payment-routes/page} (:matched-route request))
|
||||
"payments"
|
||||
:else
|
||||
nil)})}
|
||||
|
||||
[:li
|
||||
(menu-button- {:icon svg/pie
|
||||
:href "/"}
|
||||
"Dashboard")]
|
||||
[:li {:x-data (hx/json {:open false})}
|
||||
(menu-button- {"@click" "open = !open"
|
||||
:icon svg/accounting-invoice-mail}
|
||||
"Invoices")
|
||||
(sub-menu- (hx/alpine-appear {:x-show "open"})
|
||||
(menu-button- {:href (hu/url (bidi/path-for ssr-routes/only-routes
|
||||
::invoice-route/page)
|
||||
{:date-range "month"})}
|
||||
"All")
|
||||
(menu-button- {:href (hu/url (bidi/path-for ssr-routes/only-routes
|
||||
::invoice-route/page)
|
||||
{:date-range "month"})}
|
||||
"Paid")
|
||||
(menu-button- {:href (hu/url (bidi/path-for ssr-routes/only-routes
|
||||
::invoice-route/unpaid-page)
|
||||
{:date-range "month"})}
|
||||
"Unpaid")
|
||||
(menu-button- {:href (hu/url (bidi/path-for ssr-routes/only-routes
|
||||
::invoice-route/voided-page)
|
||||
{:date-range "month"})}
|
||||
"Voided"))]
|
||||
[:li {:x-data (hx/json {:open false})}
|
||||
(menu-button- {:icon svg/receipt-register-1
|
||||
"@click" "open = !open"}
|
||||
"Sales")
|
||||
(sub-menu- (hx/alpine-appear {:x-show "open"})
|
||||
(menu-button- {:href (str (bidi/path-for ssr-routes/only-routes
|
||||
:pos-sales)
|
||||
"?date-range=week")} "Sales")
|
||||
(menu-button- {:href (str (bidi/path-for ssr-routes/only-routes
|
||||
:pos-expected-deposits)
|
||||
"?date-range=week")} "Expected Deposits")
|
||||
(menu-button- {:href (str (bidi/path-for ssr-routes/only-routes
|
||||
:pos-tenders)
|
||||
"?date-range=week")} "Tenders")
|
||||
|
||||
(menu-button- {:href (str (bidi/path-for ssr-routes/only-routes
|
||||
:pos-refunds)
|
||||
"?date-range=week")} "Refunds")
|
||||
(menu-button- {:href (str (bidi/path-for ssr-routes/only-routes
|
||||
:pos-cash-drawer-shifts)
|
||||
"?date-range=week")} "Cash drawer shifts")
|
||||
#_(menu-button- {:href "Sales"} "Cash Shifts")
|
||||
#_(menu-button- {:href "Sales"} "Tenders"))]
|
||||
[:li {:x-data (hx/json {:open false})}
|
||||
(menu-button- {"@click" "open = !open"
|
||||
:icon svg/payments}
|
||||
"Payments")
|
||||
(sub-menu- (hx/alpine-appear {:x-show "open"})
|
||||
(menu-button- {:href (hu/url (bidi/path-for ssr-routes/only-routes
|
||||
::payment-routes/page)
|
||||
{ :date-range "month"})} "All")
|
||||
(menu-button- {:href (hu/url (bidi/path-for ssr-routes/only-routes
|
||||
::payment-routes/page)
|
||||
{:status "pending"
|
||||
:date-range "month"})} "Pending")
|
||||
(menu-button- {:href (hu/url (bidi/path-for ssr-routes/only-routes
|
||||
::payment-routes/page)
|
||||
{:status "cleared"
|
||||
:date-range "month"})} "Cleared")
|
||||
(menu-button- {:href (hu/url (bidi/path-for ssr-routes/only-routes
|
||||
::payment-routes/page)
|
||||
{:status "voided"
|
||||
:date-range "month"})} "Voided"))]
|
||||
(menu-button- {"@click.prevent" "if (selected == 'invoices') {selected = null } else { selected = 'invoices'} "
|
||||
:icon svg/accounting-invoice-mail}
|
||||
"Invoices")
|
||||
(sub-menu-
|
||||
{:selector "invoices"}
|
||||
(menu-button- {:href (hu/url (bidi/path-for ssr-routes/only-routes
|
||||
::invoice-route/page)
|
||||
{:date-range "month"})
|
||||
:active? (= ::invoice-route/page (:matched-route request))}
|
||||
|
||||
"All")
|
||||
(menu-button- {:href (hu/url (bidi/path-for ssr-routes/only-routes
|
||||
::invoice-route/page)
|
||||
{:date-range "month"})
|
||||
:active? (= ::invoice-route/page (:matched-route request))}
|
||||
"Paid")
|
||||
(menu-button- {:href (hu/url (bidi/path-for ssr-routes/only-routes
|
||||
::invoice-route/unpaid-page)
|
||||
{:date-range "month"})
|
||||
:active? (= ::invoice-route/page (:matched-route request))}
|
||||
"Unpaid")
|
||||
(menu-button- {:href (hu/url (bidi/path-for ssr-routes/only-routes
|
||||
::invoice-route/voided-page)
|
||||
{:date-range "month"})
|
||||
:active? (= ::invoice-route/page (:matched-route request))}
|
||||
"Voided"))
|
||||
|
||||
(menu-button- {:icon svg/receipt-register-1
|
||||
|
||||
"@click.prevent" "if (selected == 'sales') {selected = null } else { selected = 'sales'} "}
|
||||
"Sales")
|
||||
(sub-menu- {:selector "sales"}
|
||||
(menu-button- {:href (str (bidi/path-for ssr-routes/only-routes
|
||||
:pos-sales)
|
||||
"?date-range=week")
|
||||
:active? (= :pos-sales (:matched-route request))} "Sales")
|
||||
(menu-button- {:href (str (bidi/path-for ssr-routes/only-routes
|
||||
:pos-expected-deposits)
|
||||
"?date-range=week")
|
||||
:active? (= :pos-expected-deposits (:matched-route request))}
|
||||
"Expected Deposits")
|
||||
(menu-button- {:href (str (bidi/path-for ssr-routes/only-routes
|
||||
:pos-tenders)
|
||||
"?date-range=week")
|
||||
:active? (= :pos-tenders (:matched-route request))} "Tenders")
|
||||
|
||||
(menu-button- {:href (str (bidi/path-for ssr-routes/only-routes
|
||||
:pos-refunds)
|
||||
"?date-range=week")
|
||||
:active? (= :pos-refunds (:matched-route request))} "Refunds")
|
||||
(menu-button- {:href (str (bidi/path-for ssr-routes/only-routes
|
||||
:pos-cash-drawer-shifts)
|
||||
"?date-range=week")
|
||||
:active? (= :cash-drawer-shifts (:matched-route request))} "Cash drawer shifts"))
|
||||
;; TODO make specific routes for categories
|
||||
;; TODO auto-apen sub menus
|
||||
|
||||
(menu-button- {"@click.prevent" "if (selected == 'payments') {selected = null } else { selected = 'payments'} "
|
||||
:icon svg/payments}
|
||||
"Payments")
|
||||
(sub-menu- {:selector "payments"}
|
||||
(menu-button- {:href (hu/url (bidi/path-for ssr-routes/only-routes
|
||||
::payment-routes/page)
|
||||
{:date-range "month"})
|
||||
:active? (= ::payment-routes/page (:matched-route request))} "All")
|
||||
|
||||
(menu-button- {:href (hu/url (bidi/path-for ssr-routes/only-routes
|
||||
::payment-routes/page)
|
||||
{:status "pending"
|
||||
:date-range "month"})
|
||||
:active? (= ::payment-routes/page (:matched-route request))} "Pending")
|
||||
(menu-button- {:href (hu/url (bidi/path-for ssr-routes/only-routes
|
||||
::payment-routes/page)
|
||||
{:status "cleared"
|
||||
:date-range "month"})
|
||||
:active? (= ::payment-routes/page (:matched-route request))} "Cleared")
|
||||
(menu-button- {:href (hu/url (bidi/path-for ssr-routes/only-routes
|
||||
::payment-routes/page)
|
||||
{:status "voided"
|
||||
:date-range "month"})
|
||||
:active? (= ::payment-routes/page (:matched-route request))} "Voided"))
|
||||
|
||||
[:li {:x-data (hx/json {:open false})}
|
||||
(menu-button- {"@click" "open = !open"
|
||||
(menu-button- {"@click.prevent" "if (selected == 'transactions') {selected = null } else { selected = 'transactions'} "
|
||||
:icon svg/bank}
|
||||
"Transactions")
|
||||
|
||||
(sub-menu- (hx/alpine-appear {:x-show "open"})
|
||||
(sub-menu- {:selector "transactions"}
|
||||
(menu-button- {:href (bidi/path-for client-routes/routes
|
||||
:transactions)} "All")
|
||||
(menu-button- {:href (bidi/path-for client-routes/routes
|
||||
@@ -155,26 +191,26 @@
|
||||
:approved-transactions)} "Approved")
|
||||
(menu-button- {:href (bidi/path-for ssr-routes/only-routes
|
||||
:transaction-insights)} "Insights"))]
|
||||
[:li {:x-data (hx/json {:open false})}
|
||||
(menu-button- {"@click" "open = !open"
|
||||
:icon svg/receipt}
|
||||
"Ledger")
|
||||
(sub-menu- (hx/alpine-appear {:x-show "open"})
|
||||
(menu-button- {:href (bidi/path-for client-routes/routes
|
||||
:ledger)} "Register")
|
||||
(menu-button- {:href (bidi/path-for client-routes/routes
|
||||
:profit-and-loss)} "Profit & Loss")
|
||||
(menu-button- {:href (bidi/path-for client-routes/routes
|
||||
:profit-and-loss-detail)} "Profit & Loss Detail")
|
||||
(menu-button- {:href (bidi/path-for client-routes/routes
|
||||
:cash-flows)} "Cash Flows")
|
||||
(menu-button- {:href (bidi/path-for client-routes/routes
|
||||
:balance-sheet)} "Balance Sheet")
|
||||
(menu-button- {:href (bidi/path-for client-routes/routes
|
||||
:external-import-ledger)} "External Ledger Import"))]])
|
||||
|
||||
(menu-button- {"@click.prevent" "if (selected == 'ledger') {selected = null } else { selected = 'ledger'} "
|
||||
:icon svg/receipt}
|
||||
"Ledger")
|
||||
(sub-menu- {:selector "ledger"}
|
||||
(menu-button- {:href (bidi/path-for client-routes/routes
|
||||
:ledger)} "Register")
|
||||
(menu-button- {:href (bidi/path-for client-routes/routes
|
||||
:profit-and-loss)} "Profit & Loss")
|
||||
(menu-button- {:href (bidi/path-for client-routes/routes
|
||||
:profit-and-loss-detail)} "Profit & Loss Detail")
|
||||
(menu-button- {:href (bidi/path-for client-routes/routes
|
||||
:cash-flows)} "Cash Flows")
|
||||
(menu-button- {:href (bidi/path-for client-routes/routes
|
||||
:balance-sheet)} "Balance Sheet")
|
||||
(menu-button- {:href (bidi/path-for client-routes/routes
|
||||
:external-import-ledger)} "External Ledger Import"))])
|
||||
|
||||
|
||||
(defn company-aside-nav- []
|
||||
(defn company-aside-nav- [_]
|
||||
[:ul {:class "space-y-2" :hx-boost "true"}
|
||||
[:li
|
||||
(menu-button- {:icon svg/vendors
|
||||
@@ -204,40 +240,47 @@
|
||||
"1099 Vendor Info"
|
||||
)]])
|
||||
|
||||
(defn admin-aside-nav- []
|
||||
[:ul {:class "space-y-2"}
|
||||
(defn admin-aside-nav- [{:keys [matched-route] :as request}]
|
||||
[:ul {:class "space-y-2" :x-data (hx/json {:selected "nil"})}
|
||||
[:li
|
||||
(menu-button- {:icon svg/dashboard
|
||||
:active? (= :auto-ap.routes.admin/page matched-route)
|
||||
:href (bidi/path-for ssr-routes/only-routes :auto-ap.routes.admin/page)}
|
||||
"Dashboard")]
|
||||
|
||||
[:li
|
||||
(menu-button- {:icon svg/restaurant
|
||||
:href (bidi/path-for ssr-routes/only-routes ::ac-routes/page) }
|
||||
:active? (= ::ac-routes/page matched-route)
|
||||
:href (bidi/path-for ssr-routes/only-routes ::ac-routes/page)}
|
||||
"Clients")]
|
||||
[:li
|
||||
(menu-button- {:icon svg/vendors
|
||||
:active? (= ::v-routes/page matched-route)
|
||||
:href (bidi/path-for ssr-routes/only-routes
|
||||
::v-routes/page)}
|
||||
"Vendors")]
|
||||
[:li
|
||||
(menu-button- {:icon svg/user
|
||||
:active? (= :users matched-route)
|
||||
:href (bidi/path-for ssr-routes/only-routes
|
||||
:users)}
|
||||
"Users")]
|
||||
[:li
|
||||
(menu-button- {:icon svg/accounts
|
||||
:active? (= :admin-accounts matched-route)
|
||||
:href (bidi/path-for ssr-routes/only-routes
|
||||
:admin-accounts)}
|
||||
"Accounts")]
|
||||
|
||||
[:li
|
||||
(menu-button- {:icon svg/cog
|
||||
:active? (= ::transaction-rules/page matched-route)
|
||||
:href (bidi/path-for ssr-routes/only-routes ::transaction-rules/page)}
|
||||
"Rules")]
|
||||
|
||||
[:li
|
||||
(menu-button- {:icon svg/question
|
||||
:active? (= :admin-rules matched-route)
|
||||
:href (bidi/path-for ssr-routes/only-routes
|
||||
:admin-history)
|
||||
:hx-boost "true"}
|
||||
@@ -245,20 +288,24 @@
|
||||
|
||||
[:li
|
||||
(menu-button- {:icon svg/rabbit
|
||||
:active? (= :admin-jobs matched-route)
|
||||
:href (bidi/path-for ssr-routes/only-routes
|
||||
:admin-jobs)}
|
||||
"Background Jobs")]
|
||||
[:li {:x-data (hx/json {:open false})}
|
||||
(menu-button- {:icon svg/arrow-in
|
||||
"@click" "open = !open"}
|
||||
"Import")
|
||||
|
||||
(sub-menu- (hx/alpine-appear
|
||||
{:x-show "open"})
|
||||
(menu-button- {:href (bidi/path-for ssr-routes/only-routes
|
||||
::ei-routes/page)} "Excel Invoices")
|
||||
(menu-button- {:href (bidi/path-for ssr-routes/only-routes
|
||||
::ib-routes/page)} "Import Batches")
|
||||
(menu-button- {:href (bidi/path-for ssr-routes/only-routes
|
||||
:admin-ezcater-xls)
|
||||
:hx-boost "true"} "EZCater XLS Import"))]])
|
||||
|
||||
(menu-button- {:icon svg/arrow-in
|
||||
"@click.prevent" "if (selected == 'import') {selected = null } else { selected = 'import'} "}
|
||||
"Import")
|
||||
|
||||
(sub-menu- {:selector "import"}
|
||||
(menu-button- {:href (bidi/path-for ssr-routes/only-routes
|
||||
::ei-routes/page)
|
||||
:active? (= ::ei-routes/page matched-route)} "Excel Invoices")
|
||||
(menu-button- {:href (bidi/path-for ssr-routes/only-routes
|
||||
::ib-routes/page)
|
||||
:active? (= ::ib-routes/page matched-route)} "Import Batches")
|
||||
(menu-button- {:href (bidi/path-for ssr-routes/only-routes
|
||||
:admin-ezcater-xls)
|
||||
:active? (= :admin-ezcater-xls matched-route)
|
||||
:hx-boost "true"} "EZCater XLS Import"))])
|
||||
|
||||
@@ -6,7 +6,7 @@
|
||||
[auto-ap.ssr.svg :as svg]
|
||||
[auto-ap.ssr.hx :as hx]))
|
||||
|
||||
(defn page- [{:keys [nav page-specific client clients client-selection identity app-params] :or {app-params {}}} & children]
|
||||
(defn page- [{:keys [nav page-specific client clients client-selection identity app-params request] :or {app-params {}} } & children]
|
||||
[:div#app {"_" (hiccup/raw "
|
||||
on notification from body put event.detail.value into #notification-details then add .htmx-added to #notification-holder then remove .hidden from #notification-holder then wait 30ms then remove .htmx-added from #notification-holder
|
||||
on htmx:responseError put event.detail.xhr.response into #error-details then add .htmx-added to #error-holder then remove .hidden from #error-holder then wait 30ms then remove .htmx-added from #error-holder"
|
||||
@@ -19,7 +19,8 @@
|
||||
[:div#app-contents.flex.pt-16.overflow-hidden (assoc app-params
|
||||
:hx-disinherit "*"
|
||||
:x-init "leftNavShow = true")
|
||||
(left-aside- {:nav nav
|
||||
(left-aside- {:nav (when nav
|
||||
(nav request))
|
||||
:page-specific page-specific})
|
||||
[:div#main-content {:class "relative w-full h-full overflow-y-auto px-4 bg-gray-100 dark:bg-gray-900 min-h-content lg:pl-64"
|
||||
":class" "leftNavShow ? 'lg:pl-64' : ''"
|
||||
|
||||
Reference in New Issue
Block a user