makes stuff work

This commit is contained in:
2023-05-11 09:43:37 -07:00
parent 6220ae1f6d
commit 0e814a8a4a
12 changed files with 403 additions and 197 deletions

View File

@@ -1285,6 +1285,26 @@ input:checked + .toggle-bg {
height: 0.5rem; height: 0.5rem;
} }
.h-48 {
height: 12rem;
}
.h-64 {
height: 16rem;
}
.h-80 {
height: 20rem;
}
.h-1\/2 {
height: 50%;
}
.h-96 {
height: 24rem;
}
.max-h-full { .max-h-full {
max-height: 100%; max-height: 100%;
} }
@@ -1502,6 +1522,10 @@ input:checked + .toggle-bg {
gap: 1.5rem; gap: 1.5rem;
} }
.gap-8 {
gap: 2rem;
}
.-space-x-px > :not([hidden]) ~ :not([hidden]) { .-space-x-px > :not([hidden]) ~ :not([hidden]) {
--tw-space-x-reverse: 0; --tw-space-x-reverse: 0;
margin-right: calc(-1px * var(--tw-space-x-reverse)); margin-right: calc(-1px * var(--tw-space-x-reverse));
@@ -1544,6 +1568,18 @@ input:checked + .toggle-bg {
margin-bottom: calc(1.5rem * var(--tw-space-y-reverse)); margin-bottom: calc(1.5rem * var(--tw-space-y-reverse));
} }
.space-y-4 > :not([hidden]) ~ :not([hidden]) {
--tw-space-y-reverse: 0;
margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));
margin-bottom: calc(1rem * var(--tw-space-y-reverse));
}
.space-y-8 > :not([hidden]) ~ :not([hidden]) {
--tw-space-y-reverse: 0;
margin-top: calc(2rem * calc(1 - var(--tw-space-y-reverse)));
margin-bottom: calc(2rem * var(--tw-space-y-reverse));
}
.divide-y > :not([hidden]) ~ :not([hidden]) { .divide-y > :not([hidden]) ~ :not([hidden]) {
--tw-divide-y-reverse: 0; --tw-divide-y-reverse: 0;
border-top-width: calc(1px * calc(1 - var(--tw-divide-y-reverse))); border-top-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
@@ -1555,6 +1591,10 @@ input:checked + .toggle-bg {
border-color: rgb(243 244 246 / var(--tw-divide-opacity)); border-color: rgb(243 244 246 / var(--tw-divide-opacity));
} }
.overflow-auto {
overflow: auto;
}
.overflow-hidden { .overflow-hidden {
overflow: hidden; overflow: hidden;
} }
@@ -1740,6 +1780,21 @@ input:checked + .toggle-bg {
background-color: rgb(253 246 178 / var(--tw-bg-opacity)); background-color: rgb(253 246 178 / var(--tw-bg-opacity));
} }
.bg-blue-200 {
--tw-bg-opacity: 1;
background-color: rgb(153 215 247 / var(--tw-bg-opacity));
}
.bg-blue-300 {
--tw-bg-opacity: 1;
background-color: rgb(102 196 242 / var(--tw-bg-opacity));
}
.bg-green-100 {
--tw-bg-opacity: 1;
background-color: rgb(228 240 213 / var(--tw-bg-opacity));
}
.bg-opacity-50 { .bg-opacity-50 {
--tw-bg-opacity: 0.5; --tw-bg-opacity: 0.5;
} }
@@ -1768,6 +1823,14 @@ input:checked + .toggle-bg {
padding: 1.5rem; padding: 1.5rem;
} }
.p-8 {
padding: 2rem;
}
.p-5 {
padding: 1.25rem;
}
.px-2 { .px-2 {
padding-left: 0.5rem; padding-left: 0.5rem;
padding-right: 0.5rem; padding-right: 0.5rem;
@@ -1861,6 +1924,18 @@ input:checked + .toggle-bg {
padding-top: 1.25rem; padding-top: 1.25rem;
} }
.pb-2 {
padding-bottom: 0.5rem;
}
.pr-2 {
padding-right: 0.5rem;
}
.pr-2\.5 {
padding-right: 0.625rem;
}
.text-left { .text-left {
text-align: left; text-align: left;
} }
@@ -1999,6 +2074,16 @@ input:checked + .toggle-bg {
color: rgb(114 59 19 / var(--tw-text-opacity)); color: rgb(114 59 19 / var(--tw-text-opacity));
} }
.text-gray-200 {
--tw-text-opacity: 1;
color: rgb(229 231 235 / var(--tw-text-opacity));
}
.text-green-800 {
--tw-text-opacity: 1;
color: rgb(48 72 18 / var(--tw-text-opacity));
}
.opacity-0 { .opacity-0 {
opacity: 0; opacity: 0;
} }
@@ -2231,6 +2316,11 @@ input:checked + .toggle-bg {
background-color: rgb(255 255 255 / var(--tw-bg-opacity)); background-color: rgb(255 255 255 / var(--tw-bg-opacity));
} }
.hover\:bg-gray-200:hover {
--tw-bg-opacity: 1;
background-color: rgb(229 231 235 / var(--tw-bg-opacity));
}
.hover\:text-blue-600:hover { .hover\:text-blue-600:hover {
--tw-text-opacity: 1; --tw-text-opacity: 1;
color: rgb(0 125 187 / var(--tw-text-opacity)); color: rgb(0 125 187 / var(--tw-text-opacity));
@@ -2419,6 +2509,16 @@ input:checked + .toggle-bg {
background-color: rgb(99 49 18 / var(--tw-bg-opacity)); background-color: rgb(99 49 18 / var(--tw-bg-opacity));
} }
.dark .dark\:bg-blue-700 {
--tw-bg-opacity: 1;
background-color: rgb(0 94 140 / var(--tw-bg-opacity));
}
.dark .dark\:bg-green-900 {
--tw-bg-opacity: 1;
background-color: rgb(24 36 9 / var(--tw-bg-opacity));
}
.dark .dark\:bg-opacity-80 { .dark .dark\:bg-opacity-80 {
--tw-bg-opacity: 0.8; --tw-bg-opacity: 0.8;
} }
@@ -2458,6 +2558,16 @@ input:checked + .toggle-bg {
color: rgb(250 202 21 / var(--tw-text-opacity)); color: rgb(250 202 21 / var(--tw-text-opacity));
} }
.dark .dark\:text-green-300 {
--tw-text-opacity: 1;
color: rgb(175 211 130 / var(--tw-text-opacity));
}
.dark .dark\:text-gray-50 {
--tw-text-opacity: 1;
color: rgb(249 250 251 / var(--tw-text-opacity));
}
.dark .dark\:placeholder-gray-400::-moz-placeholder { .dark .dark\:placeholder-gray-400::-moz-placeholder {
--tw-placeholder-opacity: 1; --tw-placeholder-opacity: 1;
color: rgb(156 163 175 / var(--tw-placeholder-opacity)); color: rgb(156 163 175 / var(--tw-placeholder-opacity));
@@ -2632,6 +2742,10 @@ input:checked + .toggle-bg {
display: block; display: block;
} }
.lg\:inline {
display: inline;
}
.lg\:flex { .lg\:flex {
display: flex; display: flex;
} }

View File

@@ -164,7 +164,7 @@
(com/data-grid-cell {} (:client/code client)) (com/data-grid-cell {} (:client/code client))
(com/data-grid-cell (com/data-grid-cell
{} {}
[:div.flex.whitespace-nowrap.items-center [:div.flex.whitespace-nowrap.items-center.gap-4
[:div [:div (:vendor/name vendor)] [:div [:div (:vendor/name vendor)]
[:div.text-sm.text-gray-400 [:div.text-sm.text-gray-400
(or (-> vendor :vendor/legal-entity-name not-empty) (or (-> vendor :vendor/legal-entity-name not-empty)
@@ -172,8 +172,11 @@
(-> vendor :vendor/legal-entity-middle-name) " " (-> vendor :vendor/legal-entity-middle-name) " "
(-> vendor :vendor/legal-entity-last-name)))]] (-> vendor :vendor/legal-entity-last-name)))]]
(when-let [t99-type (some-> vendor :vendor/legal-entity-1099-type :db/ident name)] (when-let [t99-type (some-> vendor :vendor/legal-entity-1099-type :db/ident name)]
[:p {:class "ml-8 bg-yellow-100 text-yellow-800 text-xs font-medium px-2 py-0.5 rounded dark:bg-yellow-900 dark:text-yellow-300"} (com/pill
(str/capitalize t99-type)])]) {:class "text-xs font-medium"
:color :primary}
(str/capitalize t99-type))
)])
(com/data-grid-cell (com/data-grid-cell
{:class "hidden md:table-cell"} {:class "hidden md:table-cell"}
[:div.flex.gap-4 [:div.flex.gap-4
@@ -181,9 +184,9 @@
[:span {:class "text-xs font-medium py-0.5 "} [:span {:class "text-xs font-medium py-0.5 "}
tin]) tin])
(when-let [tin-type (some-> vendor :vendor/legal-entity-tin-type :db/ident name)] (when-let [tin-type (some-> vendor :vendor/legal-entity-tin-type :db/ident name)]
[:p {:class "bg-yellow-100 text-yellow-800 text-xs font-medium px-2 py-0.5 rounded dark:bg-yellow-900 dark:text-yellow-300"} (com/pill {:class "text-xs font-medium"
(str/capitalize tin-type) :color :yellow}
])]) (name tin-type)))])
(com/data-grid-cell (com/data-grid-cell
{:class "hidden lg:table-cell"} {:class "hidden lg:table-cell"}
(if (-> vendor :vendor/address :address/street1) (if (-> vendor :vendor/address :address/street1)
@@ -197,8 +200,9 @@
(-> vendor :vendor/address :address/zip)]] (-> vendor :vendor/address :address/zip)]]
[:p.text-sm.italic.text-gray-400 "No address"])) [:p.text-sm.italic.text-gray-400 "No address"]))
(com/data-grid-cell {} (com/data-grid-cell {}
[:span {:class "bg-blue-100 text-blue-800 text-xs font-medium px-2 py-0.5 rounded dark:bg-blue-900 dark:text-blue-300 whitespace-nowrap"} (com/pill {:class "text-xs font-medium"
"Paid $" (Math/round amount)]) :color :primary}
"Paid $" (Math/round amount)))
(com/data-grid-right-stack-cell (com/data-grid-right-stack-cell
{} {}
(if (cannot-overwrite? vendor) (if (cannot-overwrite? vendor)
@@ -207,8 +211,8 @@
:company-1099-vendor-dialog :company-1099-vendor-dialog
:vendor-id (:db/id vendor)) :vendor-id (:db/id vendor))
:hx-target "#modal-content" :hx-target "#modal-content"
:hx-swap "innerHTML"} :hx-swap "outerHTML"}
[:i.fa.fa-pencil ]))))))] svg/pencil))))))]
(com/paginator))])) (com/paginator))]))
(defn form-data->map [form-data] (defn form-data->map [form-data]
@@ -250,90 +254,89 @@
(let [vendor (dc/pull (dc/db conn) '[* {:vendor/legal-entity-1099-type [:db/ident] (let [vendor (dc/pull (dc/db conn) '[* {:vendor/legal-entity-1099-type [:db/ident]
:vendor/legal-entity-tin-type [:db/ident]}] (Long/parseLong (:vendor-id (:params request))))] ;; TODO perms :vendor/legal-entity-tin-type [:db/ident]}] (Long/parseLong (:vendor-id (:params request))))] ;; TODO perms
(html-response (html-response
[:div#modal-content [:form {:hx-post (bidi/path-for ssr-routes/only-routes
[:form {:hx-post (bidi/path-for ssr-routes/only-routes :company-1099-vendor-save
:company-1099-vendor-save :request-method :post
:request-method :post :vendor-id (Long/parseLong (:vendor-id (:params request))))
:vendor-id (Long/parseLong (:vendor-id (:params request)))) :hx-target "#vendor-table"
:hx-target "#vendor-table" :hx-swap "outerHTML swap:300ms"}
:hx-swap "outerHTML swap:300ms"} (com/dialog
(com/dialog [:div.flex [:div.p-2 "Vendor 1099 Info"] [:p.ml-2.rounded.bg-gray-200.p-2.dark:bg-gray-600 (:vendor/name vendor)]]
[:div.flex [:div.p-2 "Vendor 1099 Info"] [:p.ml-2.rounded.bg-gray-200.p-2.dark:bg-gray-600 (:vendor/name vendor)]] [:div.space-y-6
[:div.space-y-6 [:div.grid.grid-cols-6.gap-4
[:div.grid.grid-cols-6.gap-4 [:h4.text-xl.border-b.col-span-6 "Address"]
[:h4.text-xl.border-b.col-span-6 "Address"] [:div.col-span-6
[:div.col-span-6 (com/field {:label "Street 1"}
(com/field {:label "Street 1"} (com/text-input {:name (path->name [:vendor/address :address/street1])
(com/text-input {:name (path->name [:vendor/address :address/street1]) :value (-> vendor :vendor/address :address/street1)
:value (-> vendor :vendor/address :address/street1) :placeholder "1700 Pennsylvania Ave"
:placeholder "1700 Pennsylvania Ave" :autofocus true}))]
:autofocus true}))] [:div.col-span-6
[:div.col-span-6 (com/field {:label "Street 2"}
(com/field {:label "Street 2"} (com/text-input {:name (path->name [:vendor/address :address/street2])
(com/text-input {:name (path->name [:vendor/address :address/street2]) :value (-> vendor :vendor/address :address/street2)
:value (-> vendor :vendor/address :address/street2) :placeholder "Suite 200"}))]
:placeholder "Suite 200"}))] [:div.col-span-3
[:div.col-span-3 (com/field {:label "City"}
(com/field {:label "City"} (com/text-input {:name (path->name [:vendor/address :address/city])
(com/text-input {:name (path->name [:vendor/address :address/city]) :value (-> vendor :vendor/address :address/city)
:value (-> vendor :vendor/address :address/city) :placeholder "Cupertino"}))]
:placeholder "Cupertino"}))] [:div.col-span-1
[:div.col-span-1 (com/field {:label "State"}
(com/field {:label "State"} (com/text-input {:name (path->name [:vendor/address :address/state])
(com/text-input {:name (path->name [:vendor/address :address/state]) :value (-> vendor :vendor/address :address/state)
:value (-> vendor :vendor/address :address/state) :placeholder "CA"}))]
:placeholder "CA"}))] [:div.col-span-2
[:div.col-span-2 (com/field {:label "Zip"}
(com/field {:label "Zip"} (com/text-input {:name (path->name [:vendor/address :address/zip])
(com/text-input {:name (path->name [:vendor/address :address/zip]) :value (-> vendor :vendor/address :address/zip)
:value (-> vendor :vendor/address :address/zip) :placeholder "98102"}))]
:placeholder "98102"}))] [:h4.text-xl.border-b.col-span-6 "Legal Entity"]
[:h4.text-xl.border-b.col-span-6 "Legal Entity"] [:div.col-span-6
[:div.col-span-6 (com/field {:label "Legal Entity Name"}
(com/field {:label "Legal Entity Name"} (com/text-input {:name (path->name [:vendor/legal-entity-name])
(com/text-input {:name (path->name [:vendor/legal-entity-name]) :value (-> vendor :vendor/legal-entity-name)
:value (-> vendor :vendor/legal-entity-name) :placeholder "Good Restaurant LLC"}))]
:placeholder "Good Restaurant LLC"}))] [:div.col-span-6.text-center " - OR -"]
[:div.col-span-6.text-center " - OR -"] [:div.col-span-2
[:div.col-span-2 (com/field {:label "First Name"}
(com/field {:label "First Name"} (com/text-input {:name (path->name [:vendor/legal-entity-first-name])
(com/text-input {:name (path->name [:vendor/legal-entity-first-name]) :value (-> vendor :vendor/legal-entity-first-name)
:value (-> vendor :vendor/legal-entity-first-name) :placeholder "John"}))]
:placeholder "John"}))] [:div.col-span-2
[:div.col-span-2 (com/field {:label "Middle Name"}
(com/field {:label "Middle Name"} (com/text-input {:name (path->name [:vendor/legal-entity-middle-name])
(com/text-input {:name (path->name [:vendor/legal-entity-middle-name]) :value (-> vendor :vendor/legal-entity-middle-name)
:value (-> vendor :vendor/legal-entity-middle-name) :placeholder "C."}))]
:placeholder "C."}))] [:div.col-span-2
[:div.col-span-2 (com/field {:label "Last Name"}
(com/field {:label "Last Name"} (com/text-input {:name (path->name [:vendor/legal-entity-last-name])
(com/text-input {:name (path->name [:vendor/legal-entity-last-name]) :value (-> vendor :vendor/legal-entity-last-name)
:value (-> vendor :vendor/legal-entity-last-name) :placeholder "Riley"}))]
:placeholder "Riley"}))] [:div.col-span-2
[:div.col-span-2 (com/field {:label "TIN"}
(com/field {:label "TIN"} (com/text-input {:name (path->name [:vendor/legal-entity-tin])
(com/text-input {:name (path->name [:vendor/legal-entity-tin]) :value (-> vendor :vendor/legal-entity-tin)
:value (-> vendor :vendor/legal-entity-tin) :placeholder "John"}))]
:placeholder "John"}))] [:div.col-span-2
[:div.col-span-2 (com/field {:label "TIN Type"}
(com/field {:label "TIN Type"} (com/select {:name (path->name [:vendor/legal-entity-tin-type])
(com/select {:name (path->name [:vendor/legal-entity-tin-type]) :allow-blank? true
:allow-blank? true :value (some-> vendor :vendor/legal-entity-tin-type :db/ident name)
:value (some-> vendor :vendor/legal-entity-tin-type :db/ident name) :options [["ein" "EIN"]
:options [["ein" "EIN"] ["ssn" "SSN"]]}))]
["ssn" "SSN"]]}))] [:div.col-span-2
[:div.col-span-2 (com/field {:label "1099 Type"}
(com/field {:label "1099 Type"} (com/select {:name (path->name [:vendor/legal-entity-1099-type])
(com/select {:name (path->name [:vendor/legal-entity-1099-type]) :allow-blank? true
:allow-blank? true :value (some-> vendor :vendor/legal-entity-1099-type :db/ident name)
:value (some-> vendor :vendor/legal-entity-1099-type :db/ident name) :options [["none" "None"]
:options [["none" "None"] ["misc" "Misc"]
["misc" "Misc"] ["landlord" "Landlord"]]}))]
["landlord" "Landlord"]]}))] [:div.col-span-6
[:div.col-span-6 (com/button {:color :primary}
(com/button {:color :primary} "Save")]]]
"Save")]]] [:div])]
[:div])]]
:headers {"hx-trigger" "openDialog"}))) :headers {"hx-trigger" "openDialog"})))
(defn vendor-table [request] (defn vendor-table [request]

View File

@@ -7,7 +7,8 @@
[auto-ap.ssr.components.card :as card] [auto-ap.ssr.components.card :as card]
[auto-ap.ssr.components.navbar :as navbar] [auto-ap.ssr.components.navbar :as navbar]
[auto-ap.ssr.components.page :as page] [auto-ap.ssr.components.page :as page]
[auto-ap.ssr.components.data-grid :as data-grid])) [auto-ap.ssr.components.data-grid :as data-grid]
[auto-ap.ssr.components.tags :as tags]))
(def breadcrumbs breadcrumbs/breadcrumbs-) (def breadcrumbs breadcrumbs/breadcrumbs-)
@@ -23,11 +24,14 @@
(def left-aside aside/left-aside-) (def left-aside aside/left-aside-)
(def company-aside-nav aside/company-aside-nav-) (def company-aside-nav aside/company-aside-nav-)
(def content-card card/content-card-) (def content-card card/content-card-)
(def card card/card-)
(def navbar navbar/navbar-) (def navbar navbar/navbar-)
(def page page/page-) (def page page/page-)
(def pill tags/pill-)
(def data-grid data-grid/data-grid-) (def data-grid data-grid/data-grid-)
(def data-grid-header data-grid/header-) (def data-grid-header data-grid/header-)
(def data-grid-row data-grid/row-) (def data-grid-row data-grid/row-)

View File

@@ -1,5 +1,9 @@
(ns auto-ap.ssr.components.card) (ns auto-ap.ssr.components.card)
(defn card- [params & children]
(into [:div {:class "shadow-md dark:bg-gray-800 sm:rounded-lg border-2 border-gray-200 dark:border-gray-900 bg-white overflow-hidden"}]
children))
(defn content-card- [params & children] (defn content-card- [params & children]
[:section {:class " py-3 sm:py-5"} [:section {:class " py-3 sm:py-5"}
[:div {:class "max-w-screen-2xl"} [:div {:class "max-w-screen-2xl"}

View File

@@ -1,8 +1,9 @@
(ns auto-ap.ssr.components.dialog) (ns auto-ap.ssr.components.dialog)
(defn dialog- [header content footer] (defn dialog- [header content footer]
[:div {:class "relative bg-white rounded-lg shadow dark:bg-gray-700 dark:text-white fade-in slide-up duration-300 transition-all modal-content"} [:div#modal-content
[:div {:class "flex items-start justify-between p-4 border-b rounded-t dark:border-gray-600"} header] [:div {:class "relative bg-white rounded-lg shadow dark:bg-gray-700 dark:text-white fade-in slide-up duration-300 transition-all modal-content"}
[:div {:class "p-6 space-y-6"} [:div {:class "flex items-start justify-between p-4 border-b rounded-t dark:border-gray-600"} header]
content] [:div {:class "p-6 space-y-6"}
[:div footer]]) content]
[:div footer]]])

View File

@@ -13,12 +13,9 @@
(defn text-input- [params] (defn text-input- [params]
[:input [:input
{:type "text" (update params
:class "bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500" :class str " bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500")
:autofocus (:autofocus params) ])
:name (:name params)
:placeholder (:placeholder params)
:value (:value params)}])
(defn field- [params & rest] (defn field- [params & rest]
(into (into

View File

@@ -1,7 +1,9 @@
(ns auto-ap.ssr.components.navbar (ns auto-ap.ssr.components.navbar
(:require [auto-ap.ssr.components.buttons :refer [icon-button-]] (:require [auto-ap.ssr.components.buttons :refer [icon-button-]]
[auto-ap.ssr.svg :as svg] [auto-ap.ssr.svg :as svg]
[hiccup2.core :as hiccup])) [hiccup2.core :as hiccup]
[bidi.bidi :as bidi]
[auto-ap.ssr-routes :as ssr-routes]))
(defn navbar- [] (defn navbar- []
[:nav {:class "fixed z-30 w-full bg-white border-b border-gray-200 dark:bg-gray-800 dark:border-gray-700"} [:nav {:class "fixed z-30 w-full bg-white border-b border-gray-200 dark:bg-gray-800 dark:border-gray-700"}
@@ -15,24 +17,30 @@
[:a {:href "https://flowbite-admin-dashboard.vercel.app/", :class "flex ml-2 md:mr-24"} [:a {:href "https://flowbite-admin-dashboard.vercel.app/", :class "flex ml-2 md:mr-24"}
[:img {:src "/img/logo-big2.png", :class "h-10 mr-16", :alt "Integreat logo"}] [:img {:src "/img/logo-big2.png", :class "h-10 mr-16", :alt "Integreat logo"}]
] ]
[:form {:action "#", :method "GET", :class "hidden lg:block lg:pl-3.5"} [:button.mt-1.lg:w-96.relative.hidden.lg:block {:class "bg-gray-50 hover:bg-gray-200 dark:hover:bg-gray-700 border border-gray-300 text-gray-900 sm:text-sm rounded-lg focus:ring-primary-500 focus:border-primary-500 w-full pl-10 py-4 pr-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500 gap-4 "
[:label {:for "topbar-search", :class "sr-only"} "Search"] :hx-get (bidi/path-for ssr-routes/only-routes
[:div {:class "relative mt-1 lg:w-96"} :search)
[:div {:class "absolute inset-y-0 left-0 flex items-center pl-3 pointer-events-none"} :hx-target "#modal-content"
[:svg {:class "w-5 h-5 text-gray-500 dark:text-gray-400", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} :hx-swap "innerHTML"}
[:path {:fill-rule "evenodd", :d "M8 4a4 4 0 100 8 4 4 0 000-8zM2 8a6 6 0 1110.89 3.476l4.817 4.817a1 1 0 01-1.414 1.414l-4.816-4.816A6 6 0 012 8z", :clip-rule "evenodd"}]]] [:div {:class "absolute inset-y-0 left-0 flex items-center pl-3 pointer-events-none text-gray-500"}
[:input {:type "text", :name "email", :id "topbar-search", :class "bg-gray-50 border border-gray-300 text-gray-900 sm:text-sm rounded-lg focus:ring-primary-500 focus:border-primary-500 block w-full pl-10 p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500", :placeholder "Search"}]]]] [:div.w-4.h-4 svg/search]
[:span.ml-2 "Search"]]]]
[:div {:class "flex items-center gap-4"} [:div {:class "flex items-center gap-4"}
[:div {:class "hidden mr-3 -mb-1 sm:block"} [:div {:class "hidden mr-3 -mb-1 sm:block"}
[:span]] [:span]]
[:button {:id "toggleSidebarMobileSearch", :type "button", :class "p-2 text-gray-500 rounded-lg lg:hidden hover:text-gray-900 hover:bg-gray-100 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white"} (icon-button-
[:span {:class "sr-only"} "Search"] {:id "toggleSidebarMobileSearch", :type "button", :class "p-2 text-gray-500 rounded-lg lg:hidden hover:text-gray-900 hover:bg-gray-100 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white"
[:svg {:class "w-6 h-6", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} :hx-get (bidi/path-for ssr-routes/only-routes
[:path {:fill-rule "evenodd", :d "M8 4a4 4 0 100 8 4 4 0 000-8zM2 8a6 6 0 1110.89 3.476l4.817 4.817a1 1 0 01-1.414 1.414l-4.816-4.816A6 6 0 012 8z", :clip-rule "evenodd"}]]] :search)
:hx-target "#modal-content"
:hx-swap "innerHTML"}
svg/search)
#_[:button
[:div.w-4.h-4 svg/search]]
(icon-button- {} [:div.w-4.h-4 svg/search])
#_[:button {:type "button", :data-dropdown-toggle "apps-dropdown", :class "hidden p-2 text-gray-500 rounded-lg sm:flex hover:text-gray-900 hover:bg-gray-100 dark:text-gray-400 dark:hover:text-white dark:hover:bg-gray-700"} #_[:button {:type "button", :data-dropdown-toggle "apps-dropdown", :class "hidden p-2 text-gray-500 rounded-lg sm:flex hover:text-gray-900 hover:bg-gray-100 dark:text-gray-400 dark:hover:text-white dark:hover:bg-gray-700"}
[:span {:class "sr-only"} "View notifications"] [:span {:class "sr-only"} "View notifications"]
[:svg {:class "w-6 h-6", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} [:svg {:class "w-6 h-6", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"}

View File

@@ -1,6 +1,7 @@
(ns auto-ap.ssr.components.page (ns auto-ap.ssr.components.page
(:require [auto-ap.ssr.components.navbar :refer [navbar-]] (:require [auto-ap.ssr.components.navbar :refer [navbar-]]
[auto-ap.ssr.components.aside :refer [left-aside-]])) [auto-ap.ssr.components.aside :refer [left-aside-]]
[hiccup2.core :as hiccup]))
(defn page- [{:keys [nav page-specific]} & children] (defn page- [{:keys [nav page-specific]} & children]
[:div#app [:div#app
@@ -14,7 +15,10 @@
[:div.p-4] [:div.p-4]
children)]] children)]]
[:div#modal-holder.hidden [:div#modal-holder.hidden
{"_" (hiccup/raw "on click trigger closeDialog")}
[:div { :tabindex "-1", :class "fixed top-0 left-0 right-0 z-50 w-full p-4 overflow-x-hidden overflow-y-auto md:inset-0 h-[calc(100%-1rem)] max-h-full flex justify-center "} [:div { :tabindex "-1", :class "fixed top-0 left-0 right-0 z-50 w-full p-4 overflow-x-hidden overflow-y-auto md:inset-0 h-[calc(100%-1rem)] max-h-full flex justify-center "}
[:div {:class "relative w-full max-w-2xl max-h-full"} [:div {:class "relative w-full max-w-2xl max-h-full"
"_" (hiccup/raw "on click halt the event")}
[:div#modal-content ]]] [:div#modal-content ]]]
[:div {:class "bg-gray-900 bg-opacity-50 dark:bg-opacity-80 fixed inset-0 z-40"}]]]) [:div {:class "bg-gray-900 bg-opacity-50 dark:bg-opacity-80 fixed inset-0 z-40"
}]]])

View File

@@ -0,0 +1,18 @@
(ns auto-ap.ssr.components.tags)
(defn pill- [params & children]
(into
[:span (cond-> params
true (update :class str " text-xs font-medium px-2 py-0.5 rounded whitespace-nowrap")
(= :primary (:color params))
(update :class str " bg-green-100 text-green-800 dark:bg-green-900 dark:text-green-300 ")
(= :secondary (:color params))
(update :class str " bg-blue-100 text-blue-800 dark:bg-blue-900 dark:text-blue-300 ")
(= :yellow (:color params))
(update :class str " bg-yellow-100 text-yellow-800 dark:bg-yellow-900 dark:text-yellow-300")
)]
children))

View File

@@ -5,7 +5,9 @@
[auto-ap.ssr.utils :refer [html-response]] [auto-ap.ssr.utils :refer [html-response]]
[auto-ap.time :as atime] [auto-ap.time :as atime]
[clojure.string :as str] [clojure.string :as str]
[com.brunobonacci.mulog :as mu])) [com.brunobonacci.mulog :as mu]
[auto-ap.ssr.components :as com]
[auto-ap.ssr.svg :as svg]))
(defn try-cleanse-date [d] (defn try-cleanse-date [d]
(try (try
@@ -60,58 +62,65 @@
(let [results (search-results q id)] (let [results (search-results q id)]
[:div [:div
(if (seq results) (if (seq results)
(for [doc results] [:div.flex.gap-8.flex-col
[:div.block (for [doc results]
[:div.card (com/card {}
[:div.card-header.has-background-info-light [:div.flex.flex-col.gap-4
(cond (= "transaction" (:type doc)) [:div.flex.items-center.p-2.gap-4.bg-gray-50.dark:bg-gray-800
[:div.card-header-icon.icon-task-list-text-1] [:div.h-8.w-8.p-2
(cond (= "transaction" (:type doc))
svg/bank
(= "invoice" (:type doc)) (= "invoice" (:type doc))
[:div.card-header-icon.icon-accounting-invoice-mail] svg/accounting-invoice-mail
(= "payment" (:type doc)) (= "payment" (:type doc))
[:div.card-header-icon.icon-check-payment-sign] svg/payments
(= "journal-entry" (:type doc)) (= "journal-entry" (:type doc))
[:div.card-header-icon.icon-receipt] svg/receipt
:else :else
nil) nil)]
[:div.card-header-title (clojure.string/capitalize (:type doc)) (clojure.string/capitalize (:type doc))
" " (com/pill {:color :primary}
" " "client: " (:client_code doc))
[:span.tags.ml-3 (com/pill {:color :secondary}
[:span.tag.is-warning "client: " (:client_code doc)] "amount: $" (first (:amount doc)))
[:span.tag.is-info "amount: $" (first (:amount doc))]
(when-let [vendor-name (first (:vendor_name doc))] (when-let [vendor-name (first (:vendor_name doc))]
[:span.tag.is-primary "vendor: " vendor-name])]] (com/pill {:color :yellow}
[:a.card-header-icon.fa.fa-external-link {:href (str "/" (cond (= "invoice" "vendor: " vendor-name))
(:type doc)) [:div
"invoices" (com/link {:href (str "/" (cond (= "invoice"
(:type doc))
"invoices"
(= "transaction" (= "transaction"
(:type doc)) (:type doc))
"transactions" "transactions"
(= "journal-entry" (= "journal-entry"
(:type doc)) (:type doc))
"ledger" "ledger"
:else :else
"payments") "/?exact-match-id=" (:id doc)) "payments") "/?exact-match-id=" (:id doc))
:target "_blank"}] :target "_blank"}
] [:div.h-8.w-8.p-2
svg/external-link])]
]
[:div.card-content
[:span
[:strong (atime/unparse (atime/parse (:date doc) atime/solr-date) atime/normal-date)]
": " [:div.px-4.pb-2
(str (or (first (:description doc)) [:span
(first (:number doc))))]]]]
) [:strong (atime/unparse (atime/parse (:date doc) atime/solr-date) atime/normal-date)]
": "
(str (or (first (:description doc))
(first (:number doc))))]]])
)]
[:div.block "No results found."])])) [:div.block "No results found."])]))
(defn dialog-contents [request] (defn dialog-contents [request]
@@ -121,22 +130,26 @@
(if-let [q (get (:form-params request) "q")] (if-let [q (get (:form-params request) "q")]
(html-response (search-results* q (:identity request))) (html-response (search-results* q (:identity request)))
(html-response (html-response
[:div#search {:style {:height "400px" :overflow "auto"}} (com/dialog
[:div.p-2 "Search"]
[:div.block [:div#search.overflow-auto.space-y-6.p-2.h-96
[:input#search-input.input {:type "search"
:placeholder "5/5/2034 Magheritas" (com/text-input {:id "search-input"
:name "q" :type "search"
:hx-post "/search" :placeholder "5/5/2034 Magheritas"
:hx-trigger "keyup changed delay:300ms, search" :name "q"
:hx-target "#search-results" :hx-post "/search"
:hx-indicator "#search" :hx-trigger "keyup changed delay:300ms, search"
:value (:q (:params request)) :hx-target "#search-results"
:autofocus true}]] :hx-indicator "#search"
[:i "Try dates, numbers, vendors. To filter to specific entity type, use 'invoice', 'transaction', 'journal-entry', 'payment'."] :value (:q (:params request))
[:style :autofocus true})
".htmx-request #search-results {display: none} .htmx-request .htmx-indicator { display: block !important; }"] [:i.text-sm.text-gray-600.dark:text-gray-50 "Try dates, numbers, vendors. To filter to specific type, use 'invoice', 'transaction', 'journal-entry', 'payment'."]
[:div#search-results #_[:style
] ".htmx-request #search-results {display: none} .htmx-request .htmx-indicator { display: block !important; }"]
[:div.loader.is-loading.big.htmx-indicator {:style {:display "none"}}]]))) [:div#search-results
]
[:div.loader.is-loading.big.htmx-indicator ]]
nil)
:headers {"hx-trigger" "openDialog"})))

View File

@@ -140,3 +140,56 @@
[:line {:stroke "currentColor", :fill "none", :stroke-linejoin "round", :y1 "0.75", :stroke-linecap "round", :stroke-width "1.5px", :x1 "12", :y2 "2.25", :x2 "12"}] [:line {:stroke "currentColor", :fill "none", :stroke-linejoin "round", :y1 "0.75", :stroke-linecap "round", :stroke-width "1.5px", :x1 "12", :y2 "2.25", :x2 "12"}]
[:line {:stroke "currentColor", :fill "none", :stroke-linejoin "round", :y1 "23.25", :stroke-linecap "round", :stroke-width "1.5px", :x1 "0.75", :y2 "23.25", :x2 "23.25"}] [:line {:stroke "currentColor", :fill "none", :stroke-linejoin "round", :y1 "23.25", :stroke-linecap "round", :stroke-width "1.5px", :x1 "0.75", :y2 "23.25", :x2 "23.25"}]
[:line {:stroke "currentColor", :fill "none", :stroke-linejoin "round", :y1 "20.25", :stroke-linecap "round", :stroke-width "1.5px", :x1 "2", :y2 "20.25", :x2 "22"}]]]) [:line {:stroke "currentColor", :fill "none", :stroke-linejoin "round", :y1 "20.25", :stroke-linecap "round", :stroke-width "1.5px", :x1 "2", :y2 "20.25", :x2 "22"}]]])
(def external-link
[:svg
{:xmlns "http://www.w3.org/2000/svg", :viewBox "0 0 24 24"}
[:defs]
[:title "navigation-next"]
[:path
{:d "M23,9.5H12.387a4,4,0,0,0-4,4v2",
:fill "none",
:stroke "currentColor",
:stroke-linecap "round",
:stroke-linejoin "round"}]
[:polyline
{:points "19 13.498 23 9.498 19 5.498",
:fill "none",
:stroke "currentColor",
:stroke-linecap "round",
:stroke-linejoin "round"}]
[:path
{:d
"M14.387,13v5.5a1,1,0,0,1-1,1h-12a1,1,0,0,1-1-1V6.5a1,1,0,0,1,1-1h12a1,1,0,0,1,1,1V7",
:fill "none",
:stroke "currentColor",
:stroke-linecap "round",
:stroke-linejoin "round"}]])
(def pencil
[:svg
{:xmlns "http://www.w3.org/2000/svg", :viewBox "0 0 24 24"}
[:defs]
[:title "pencil"]
[:rect
{:y "1.09",
:stroke "currentColor",
:transform "translate(11.889 -5.238) rotate(45)",
:fill "none",
:stroke-linejoin "round",
:width "6",
:stroke-linecap "round",
:x "9.268",
:height "21.284"}]
[:polygon
{:points "2.621 17.136 0.5 23.5 6.864 21.379 2.621 17.136",
:fill "none",
:stroke "currentColor",
:stroke-linecap "round",
:stroke-linejoin "round"}]
[:path
{:d "M21.914,6.328,17.672,2.086l.707-.707a3,3,0,0,1,4.242,4.242Z",
:fill "none",
:stroke "currentColor",
:stroke-linecap "round",
:stroke-linejoin "round"}]])

View File

@@ -1,9 +1,5 @@
(ns auto-ap.ssr.ui (ns auto-ap.ssr.ui
(:require (:require
[auto-ap.client-routes :as client-routes]
[auto-ap.ssr.company-dropdown :as company-dropdown]
[auto-ap.ssr.login-dropdown :as login-dropdown]
[bidi.bidi :as bidi]
[hiccup2.core :as hiccup])) [hiccup2.core :as hiccup]))
(defn html-page [hiccup] (defn html-page [hiccup]
@@ -23,18 +19,9 @@
[:meta {:http-equiv "X-UA-Compatible", :content "IE=edge"}] [:meta {:http-equiv "X-UA-Compatible", :content "IE=edge"}]
[:meta {:name "viewport", :content "width=device-width, initial-scale=1"}] [:meta {:name "viewport", :content "width=device-width, initial-scale=1"}]
[:title "Integreat"] [:title "Integreat"]
[:link {:rel "stylesheet", :href "https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css", :integrity "sha256-eZrrJcwDc/3uDhsdt61sL2oOBY362qM3lon1gyExkL0=", :crossorigin "anonymous"}]
[:link {:href "/css/font.min.css", :rel "stylesheet"}] [:link {:href "/css/font.min.css", :rel "stylesheet"}]
#_[:link {:rel "stylesheet", :href "/css/bulma.min.css"}]
[:link {:rel "stylesheet", :href "/css/bulma-calendar.min.css"}]
[:link {:rel "stylesheet", :href "/css/bulma-badge.min.css"}]
[:link {:rel "stylesheet", :href "/css/react-datepicker.min.inc.css"}] [:link {:rel "stylesheet", :href "/css/react-datepicker.min.inc.css"}]
[:link {:rel "stylesheet", :href "/output.css"}] [:link {:rel "stylesheet", :href "/output.css"}]
[:link {:rel "stylesheet", :href "/css/animate.css"}]
[:link {:rel "stylesheet", :href "/finance-font/style.css"}]
#_[:link {:rel "stylesheet", :href "/css/main.css"}]
#_[:link {:rel "stylesheet", :href "https://unpkg.com/placeholder-loading/dist/css/placeholder-loading.min.css"}]
#_[:link {:rel "stylesheet", :href "https://cdn.jsdelivr.net/npm/@tarekraafat/autocomplete.js@10.2.7/dist/css/autoComplete.min.css"}]
[:script {:src "https://unpkg.com/hyperscript.org@0.9.7"}] [:script {:src "https://unpkg.com/hyperscript.org@0.9.7"}]
[:script {:src "https://unpkg.com/@popperjs/core@2"}] [:script {:src "https://unpkg.com/@popperjs/core@2"}]
#_[:script {:src "https://unpkg.com/htmx.org@1.8.4" #_[:script {:src "https://unpkg.com/htmx.org@1.8.4"