diff --git a/resources/public/output.css b/resources/public/output.css index 0a8517ff..510baa44 100644 --- a/resources/public/output.css +++ b/resources/public/output.css @@ -1281,6 +1281,10 @@ input:checked + .toggle-bg { height: 100vh; } +.h-2 { + height: 0.5rem; +} + .max-h-full { max-height: 100%; } @@ -1334,6 +1338,10 @@ input:checked + .toggle-bg { width: max-content; } +.w-2 { + width: 0.5rem; +} + .max-w-2xl { max-width: 42rem; } @@ -1486,12 +1494,26 @@ input:checked + .toggle-bg { gap: 1rem; } +.gap-2 { + gap: 0.5rem; +} + +.gap-6 { + gap: 1.5rem; +} + .-space-x-px > :not([hidden]) ~ :not([hidden]) { --tw-space-x-reverse: 0; margin-right: calc(-1px * var(--tw-space-x-reverse)); margin-left: calc(-1px * calc(1 - var(--tw-space-x-reverse))); } +.space-x-1 > :not([hidden]) ~ :not([hidden]) { + --tw-space-x-reverse: 0; + margin-right: calc(0.25rem * var(--tw-space-x-reverse)); + margin-left: calc(0.25rem * calc(1 - var(--tw-space-x-reverse))); +} + .space-x-2 > :not([hidden]) ~ :not([hidden]) { --tw-space-x-reverse: 0; margin-right: calc(0.5rem * var(--tw-space-x-reverse)); @@ -1522,12 +1544,6 @@ input:checked + .toggle-bg { margin-bottom: calc(1.5rem * var(--tw-space-y-reverse)); } -.space-x-1 > :not([hidden]) ~ :not([hidden]) { - --tw-space-x-reverse: 0; - margin-right: calc(0.25rem * var(--tw-space-x-reverse)); - margin-left: calc(0.25rem * calc(1 - var(--tw-space-x-reverse))); -} - .divide-y > :not([hidden]) ~ :not([hidden]) { --tw-divide-y-reverse: 0; border-top-width: calc(1px * calc(1 - var(--tw-divide-y-reverse))); @@ -2578,14 +2594,14 @@ input:checked + .toggle-bg { left: 0px; } - .md\:mr-24 { - margin-right: 6rem; - } - .md\:ml-2 { margin-left: 0.5rem; } + .md\:mr-24 { + margin-right: 6rem; + } + .md\:table-cell { display: table-cell; } diff --git a/src/clj/auto_ap/ssr/company/company_1099.clj b/src/clj/auto_ap/ssr/company/company_1099.clj index a13faa3b..2593686d 100644 --- a/src/clj/auto_ap/ssr/company/company_1099.clj +++ b/src/clj/auto_ap/ssr/company/company_1099.clj @@ -2,16 +2,15 @@ (:require [auto-ap.datomic :refer [conn remove-nils]] [auto-ap.graphql.utils :refer [is-admin?]] - [iol-ion.query :refer [can-see-client?]] - [auto-ap.shared-views.company.sidebar :refer [company-side-bar]] [auto-ap.ssr-routes :as ssr-routes] - [auto-ap.ssr.ui :refer [base-page]] + [auto-ap.ssr.components :as com] [auto-ap.ssr.svg :as svg] + [auto-ap.ssr.ui :refer [base-page]] [auto-ap.ssr.utils :refer [html-response]] [bidi.bidi :as bidi] [clojure.string :as str] [datomic.api :as dc] - [hiccup2.core :as hiccup])) + [iol-ion.query :refer [can-see-client?]])) (defn cannot-overwrite? [vendor] (some? (or (:vendor/legal-entity-1099-type vendor) @@ -126,71 +125,6 @@ (sort-by (fn [[client _ amount]] [(:client/code client ) amount]))))) -(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 {:class "flex items-start justify-between p-4 border-b rounded-t dark:border-gray-600"} header] - [:div {:class "p-6 space-y-6"} - content] - [:div footer]]) - -(defn link* [{:keys [class href]} & children] - (into [:a {:href href - :class (str "font-medium text-blue-600 dark:text-blue-500 hover:underline " class)}] - children)) - -(defn icon-button* [params & children] - (into - [:button (update params :class str " inline-flex items-center justify-center bg-white dark:bg-gray-600 items-center p-3 text-sm font-medium border border-gray-300 dark:border-gray-700 text-center text-gray-500 hover:text-gray-800 rounded-lg dark:text-gray-400 dark:hover:text-gray-100") - children])) - -(defn button* [params & children] - [:button { :class (cond-> "text-white focus:ring-4 font-bold rounded-lg text-sm px-5 py-2.5 text-center mr-2 inline-flex items-center hover:scale-105 transition duration-100" - (= :secondary (:color params)) (str " bg-blue-500 hover:bg-blue-600 focus:ring-blue-300 dark:bg-blue-600 dark:hover:bg-blue-700") - (= :primary (:color params)) (str " bg-green-500 hover:bg-green-600 focus:ring-green-300 dark:bg-green-600 dark:hover:bg-green-700 "))} - [:div.htmx-indicator.flex.items-center - (svg/spinner {:class "inline w-4 h-4 text-white"}) - [:div.ml-3 "Loading..."]] - (into [:div.htmx-indicator-hidden ] children)]) - -(defn breadcrumbs [] - "HELLO" - [:div {:class "flex px-5 py-3 text-gray-700 border border-gray-200 rounded-lg bg-gray-50 dark:bg-gray-800 dark:border-gray-700"} - [:ul {:class "inline-flex items-center space-x-1 md:space-x-3"} - [:li {:class "inline-flex items-center"} - [:a {:href "#", :class "inline-flex items-center text-sm font-medium text-gray-700 hover:text-blue-600 dark:text-gray-400 dark:hover:text-white"} - [:svg { :class "w-4 h-4 mr-2", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} - [:path {:d "M10.707 2.293a1 1 0 00-1.414 0l-7 7a1 1 0 001.414 1.414L4 10.414V17a1 1 0 001 1h2a1 1 0 001-1v-2a1 1 0 011-1h2a1 1 0 011 1v2a1 1 0 001 1h2a1 1 0 001-1v-6.586l.293.293a1 1 0 001.414-1.414l-7-7z"}]]]] - [:li - [:div {:class "flex items-center"} - [:svg { :class "w-6 h-6 text-gray-400", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} - [:path {:fill-rule "evenodd", :d "M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z", :clip-rule "evenodd"}]] - [:a {:href "#", :class "ml-1 text-sm font-medium text-gray-700 hover:text-blue-600 md:ml-2 dark:text-gray-400 dark:hover:text-white"} "Templates"]]] - [:li {:aria-current "page"} - [:div {:class "flex items-center"} - [:svg {:aria-hidden "true", :class "w-6 h-6 text-gray-400", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} - [:path {:fill-rule "evenodd", :d "M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z", :clip-rule "evenodd"}]] - [:span {:class "ml-1 text-sm font-medium text-gray-500 md:ml-2 dark:text-gray-400"} "Flowbite"]]]]]"\t") - -(defn bc [params & steps] - [:div {:class "inline-flex px-5 py-3 text-gray-700 border border-gray-200 rounded-lg bg-white dark:bg-gray-800 dark:border-gray-700"} - [:ul {:class "inline-flex items-center space-x-1 md:space-x-3"} - [:li {:class "inline-flex items-center"} - [:a {:href "#", :class "inline-flex w-4 h-4 mr-2 items-center text-sm font-medium text-gray-700 hover:text-blue-600 dark:text-gray-400 dark:hover:text-white"} - svg/home]] - (for [p steps] - [:li - [:div {:class "flex items-center"} - - [:div {:class "w-6 h-6 text-gray-400",} - svg/breadcrumb-component] - - (update-in p [1 :class] str " ml-1 text-sm font-medium text-gray-700 hover:text-blue-600 md:ml-2 dark:text-gray-400 dark:hover:text-white")]]) - #_[:li {:aria-current "page"} - [:div {:class "flex items-center"} - [:svg {:aria-hidden "true", :class "w-6 h-6 text-gray-400", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} - [:path {:fill-rule "evenodd", :d "M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z", :clip-rule "evenodd"}]] - [:span {:class "ml-1 text-sm font-medium text-gray-500 md:ml-2 dark:text-gray-400"} "Flowbite"]]]]]) - (defn table* [{:keys [identity session]} & {:keys [flash-id]}] (let [companies (take 30 (get-1099-companies identity session))] [:div#vendor-table {:hx-get (bidi/path-for ssr-routes/only-routes @@ -198,513 +132,84 @@ :request-method :get) :hx-trigger "clientSelected from:body" :hx-swap "outerHTML swap:300ms"} - (bc {} - [:a {:href "#"} "My Company"] - [:a {:href "#"} "1099 Vendor Info"] - ) - - [:section {:class " py-3 sm:py-5"} - [:div {:class "max-w-screen-2xl"} - [:div {:class "relative overflow-hidden bg-white shadow-md dark:bg-gray-800 sm:rounded-lg border-2 border-gray-200 dark:border-gray-900"} - [:div {:class "flex flex-col px-4 py-3 space-y-3 lg:flex-row lg:items-center lg:justify-between lg:space-y-0 lg:space-x-4 text-gray-800 dark:text-gray-100"} - [:div - [:h1.text-2xl.mb-3.font-bold "Xendors"] - - [:div {:class "flex items-center flex-1 space-x-4"} - [:h5 - [:span "Total Vendors:"] - [:span {:class "dark:text-white pl-4"} (count companies)]]]] - [:div {:class "flex flex-col flex-shrink-0 space-y-3 md:flex-row md:items-center lg:justify-end md:space-y-0 md:space-x-3"} - (button* {:color :primary} - [:svg {:class "w-4 h-4 mr-2", :xmlns "http://www.w3.org/2000/svg", :aria-hidden "true", :fill "none", :viewbox "0 0 24 24", :stroke-width "1.5", :stroke "currentColor"} - [:path {:stroke-linecap "round", :stroke-linejoin "round", :d "M16.023 9.348h4.992v-.001M2.985 19.644v-4.992m0 0h4.992m-4.993 0l3.181 3.183a8.25 8.25 0 0013.803-3.7M4.031 9.865a8.25 8.25 0 0113.803-3.7l3.181 3.182m0-4.991v4.99"}]] - "Add new product") - - (button* {:color :secondary} - [:svg {:class "w-4 h-4 mr-2", :xmlns "http://www.w3.org/2000/svg", :aria-hidden "true", :fill "none", :viewbox "0 0 24 24", :stroke-width "1.5", :stroke "currentColor"} - [:path {:stroke-linecap "round", :stroke-linejoin "round", :d "M16.023 9.348h4.992v-.001M2.985 19.644v-4.992m0 0h4.992m-4.993 0l3.181 3.183a8.25 8.25 0 0013.803-3.7M4.031 9.865a8.25 8.25 0 0113.803-3.7l3.181 3.182m0-4.991v4.99"}]] - "Update stocks 1/250") - - (icon-button* {} - [:svg {:class "w-4 h-4", :xmlns "http://www.w3.org/2000/svg", :fill "none", :viewbox "0 0 24 24", :stroke-width "2", :stroke "currentColor", :aria-hidden "true"} - [:path {:stroke-linecap "round", :stroke-linejoin "round", :d "M3 16.5v2.25A2.25 2.25 0 005.25 21h13.5A2.25 2.25 0 0021 18.75V16.5m-13.5-9L12 3m0 0l4.5 4.5M12 3v13.5"}]]) - ]] - [:div {:class "overflow-x-auto"} - [:table {:class "w-full text-sm text-left text-gray-500 dark:text-gray-400"} - [:thead {:class "text-xs text-gray-800 uppercase bg-gray-50 dark:bg-gray-700 dark:text-gray-400"} - [:tr - #_[:th {:scope "col", :class "p-4"} - [:div {:class "flex items-center"} - [:input {:id "checkbox-all", :type "checkbox", :class "w-4 h-4 bg-gray-100 border-gray-300 rounded text-primary-600 focus:ring-primary-500 dark:focus:ring-primary-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600"}] - [:label {:for "checkbox-all", :class "sr-only"} "checkbox"]]] - [:th.px-4.py-3 {:scope "col"} "Client"] - [:th.px-4.py-3 {:scope "col"} "Vendor Name"] - [:th.px-4.py-3 {:scope "col"} "TIN"] - [:th.px-4.py-3 {:scope "col"} "Address"] - [:th.px-4.py-3 {:scope "col"} ] - [:th.px-4.py-3 {:scope "col"} ]]] - [:tbody - (for [[client vendor amount] companies] - [:tr - {:class (cond-> "border-b dark:border-gray-600 hover:bg-gray-100 dark:hover:bg-gray-700" - (= flash-id - (:db/id vendor)) - (str " live-added"))} - [:th {:scope "row", :class "px-4 py-2 font-medium text-gray-900 whitespace-nowrap dark:text-white"} - (:client/code client)] - [:td.pl-4 - - [:div.flex.whitespace-nowrap.items-center - [:div [:div (:vendor/name vendor)] - [:div.text-sm.text-gray-500 - (or (-> vendor :vendor/legal-entity-name not-empty) - (str (-> vendor :vendor/legal-entity-first-name) " " - (-> vendor :vendor/legal-entity-middle-name) " " - (-> vendor :vendor/legal-entity-last-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"} - (str/capitalize t99-type) - ]) - - ]] - [:td.px-4.py-2.hidden.md:table-cell - [:div.flex.gap-4 - - (when-let [tin (-> vendor :vendor/legal-entity-tin)] - [:span {:class "text-xs font-medium py-0.5 "} - tin]) - (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"} - (str/capitalize tin-type) - ])]] - (if (-> vendor :vendor/address :address/street1) - [:td.px-4.py-2.hidden.lg:table-cell - [:div (-> vendor :vendor/address :address/street1)] " " - [:div - (-> vendor :vendor/address :address/street2)] " " - [:div - (-> vendor :vendor/address :address/city) " " - (-> vendor :vendor/address :address/state) "," - (-> vendor :vendor/address :address/zip) - ] - ] - [:td.px-4.py-2.hidden.lg:table-cell - [:p.text-sm.italic.text-gray-400 "No address"]]) - [:td - [: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"} - "Paid $" (Math/round amount)]] - [:td.px-4.py-2 - [:div.flex.flex-row-reverse.items-center.justify-between - (if (cannot-overwrite? vendor) - [:div (link* {:href "mailto:ben@integreatconsult.com"} "Contact Integreat")] - (icon-button* {:hx-get (bidi/path-for ssr-routes/only-routes - :company-1099-vendor-dialog - :vendor-id (:db/id vendor)) - :hx-target "#modal-content" - :hx-swap "innerHTML"} - [:i.fa.fa-pencil ]) - )]]]) - #_[:tr {:class "border-b dark:border-gray-600 hover:bg-gray-100 dark:hover:bg-gray-700"} - #_[:td {:class "w-4 px-4 py-3"} - [:div {:class "flex items-center"} - [:input {:id "checkbox-table-search-1", :type "checkbox", :onclick "event.stopPropagation()", :class "w-4 h-4 bg-gray-100 border-gray-300 rounded text-primary-600 focus:ring-primary-500 dark:focus:ring-primary-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600"}] - [:label {:for "checkbox-table-search-1", :class "sr-only"} "checkbox"]]] - [:th {:scope "row", :class "flex items-center px-4 py-2 font-medium text-gray-900 whitespace-nowrap dark:text-white"} - [:img {:src "https://flowbite.s3.amazonaws.com/blocks/application-ui/products/imac-front-image.png", :alt "iMac Front Image", :class "w-auto h-8 mr-3"}]"Apple iMac 27""] - [:td {:class "px-4 py-2"} - [: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"} "Desktop PC"]] - [:td {:class "px-4 py-2 font-medium text-gray-900 whitespace-nowrap dark:text-white"} - [:div {:class "flex items-center"} - [:div {:class "inline-block w-4 h-4 mr-2 bg-red-700 rounded-full"}]]] - [:td {:class "px-4 py-2 font-medium text-gray-900 whitespace-nowrap dark:text-white"} "1.47"] - [:td {:class "px-4 py-2 font-medium text-gray-900 whitespace-nowrap dark:text-white"} "0.47"] - [:td {:class "px-4 py-2 font-medium text-gray-900 whitespace-nowrap dark:text-white"} - [:div {:class "flex items-center"} - [:svg {:aria-hidden "true", :class "w-5 h-5 text-yellow-400", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} - [:path {:d "M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"}]] - [:svg {:aria-hidden "true", :class "w-5 h-5 text-yellow-400", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} - [:path {:d "M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"}]] - [:svg {:aria-hidden "true", :class "w-5 h-5 text-yellow-400", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} - [:path {:d "M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"}]] - [:svg {:aria-hidden "true", :class "w-5 h-5 text-yellow-400", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} - [:path {:d "M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"}]] - [:svg {:aria-hidden "true", :class "w-5 h-5 text-yellow-400", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} - [:path {:d "M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"}]] - [:span {:class "ml-1 text-gray-500 dark:text-gray-400"} "5.0"]]] - [:td {:class "px-4 py-2 font-medium text-gray-900 whitespace-nowrap dark:text-white"} - [:div {:class "flex items-center"} - [:svg {:xmlns "http://www.w3.org/2000/svg", :viewbox "0 0 24 24", :fill "currentColor", :class "w-5 h-5 mr-2 text-gray-400", :aria-hidden "true"} - [:path {:d "M2.25 2.25a.75.75 0 000 1.5h1.386c.17 0 .318.114.362.278l2.558 9.592a3.752 3.752 0 00-2.806 3.63c0 .414.336.75.75.75h15.75a.75.75 0 000-1.5H5.378A2.25 2.25 0 017.5 15h11.218a.75.75 0 00.674-.421 60.358 60.358 0 002.96-7.228.75.75 0 00-.525-.965A60.864 60.864 0 005.68 4.509l-.232-.867A1.875 1.875 0 003.636 2.25H2.25zM3.75 20.25a1.5 1.5 0 113 0 1.5 1.5 0 01-3 0zM16.5 20.25a1.5 1.5 0 113 0 1.5 1.5 0 01-3 0z"}]]"1.6M"]] - [:td {:class "px-4 py-2"} "$3.2M"] - [:td {:class "px-4 py-2 font-medium text-gray-900 whitespace-nowrap dark:text-white"} "Just now"]] - - - - - - - - ]]] - [:nav {:class "flex flex-col items-start justify-between p-4 space-y-3 md:flex-row md:items-center md:space-y-0", :aria-label "Table navigation"} - [:span {:class "text-sm font-normal text-gray-500 dark:text-gray-400"} - [:span {:class "font-semibold text-gray-900 dark:text-white"} "1-10"] - [:span {:class "font-semibold text-gray-900 dark:text-white"} "1000"]] - [:ul {:class "inline-flex items-stretch -space-x-px"} - [:li - [:a {:href "#", :class "flex items-center justify-center h-full py-1.5 px-3 ml-0 text-gray-500 bg-white rounded-l-lg border border-gray-300 hover:bg-gray-100 hover:text-gray-700 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white"} - [:span {:class "sr-only"} "Previous"] - [:svg {:class "w-5 h-5", :aria-hidden "true", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} - [:path {:fill-rule "evenodd", :d "M12.707 5.293a1 1 0 010 1.414L9.414 10l3.293 3.293a1 1 0 01-1.414 1.414l-4-4a1 1 0 010-1.414l4-4a1 1 0 011.414 0z", :clip-rule "evenodd"}]]]] - [:li - [:a {:href "#", :class "flex items-center justify-center px-3 py-2 text-sm leading-tight text-gray-500 bg-white border border-gray-300 hover:bg-gray-100 hover:text-gray-700 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white"} "1"]] - [:li - [:a {:href "#", :class "flex items-center justify-center px-3 py-2 text-sm leading-tight text-gray-500 bg-white border border-gray-300 hover:bg-gray-100 hover:text-gray-700 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white"} "2"]] - [:li - [:a {:href "#", :aria-current "page", :class "z-10 flex items-center justify-center px-3 py-2 text-sm leading-tight border text-primary-600 bg-primary-50 border-primary-300 hover:bg-primary-100 hover:text-primary-700 dark:border-gray-700 dark:bg-gray-700 dark:text-white"} "3"]] - [:li - [:a {:href "#", :class "flex items-center justify-center px-3 py-2 text-sm leading-tight text-gray-500 bg-white border border-gray-300 hover:bg-gray-100 hover:text-gray-700 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white"} "..."]] - [:li - [:a {:href "#", :class "flex items-center justify-center px-3 py-2 text-sm leading-tight text-gray-500 bg-white border border-gray-300 hover:bg-gray-100 hover:text-gray-700 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white"} "100"]] - [:li - [:a {:href "#", :class "flex items-center justify-center h-full py-1.5 px-3 leading-tight text-gray-500 bg-white rounded-r-lg border border-gray-300 hover:bg-gray-100 hover:text-gray-700 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white"} - [:span {:class "sr-only"} "Next"] - [:svg {:class "w-5 h-5", :aria-hidden "true", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} - [:path {:fill-rule "evenodd", :d "M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z", :clip-rule "evenodd"}]]]]]]]]] - #_[:div.rounded-xl.overflow-hidden.w-max - [:table.text-left.text-sm.font-light.whitespace-nowrap.mb-4.shadow-lg - [:thead.border-1.font-medium.text-gray-900.rounded-lg.bg-slate-300 - [:tr - [:th.px-4.py-4.text-gray-800 "Client"] - [:th.px-4.py-4.text-gray-800 "Vendor Name"] - [:th.px-4.py-4.text-gray-800 "TIN"] - [:th.px-4.py-4.text-gray-800 "Address"] - [:th.px-4.py-4.text-gray-800 ] - [:th.px-4.py-4.text-gray-800 ] - ]] - [:tbody - ]]] - ])) -(defn menu-button* [params & children] - [:a (-> params - (dissoc :icon) - (assoc :type "button",) - (update :class str " cursor-pointer flex items-center p-2 w-full text-sm text-gray-600 rounded-lg transition duration-75 group hover:bg-gray-100 dark:text-white dark:hover:bg-gray-700")) - - (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 (:data-collapse-toggle params) - [: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"}]])]) - -(defn sub-menu* [params & children] - [:ul {:id (:id params) :class "hidden py-2 space-y-2"} - (for [c children] - [:li - (update-in c [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")])]) - -(defn sidebar* [] - [:aside {:id "left-nav", :class "fixed top-0 left-0 pt-16 z-20 w-64 h-screen transition-transform -translate-x-full lg:translate-x-0", :aria-labelledby "left-nav" :aria-hidden "true" - :onCollapse (hiccup/raw "alert(\"hello\")") - } - - [:div {:class "overflow-y-auto py-5 px-3 h-full bg-gray-50 border-r border-gray-200 dark:bg-gray-800 dark:border-gray-700"} - - [:ul {:class "space-y-2"} - - [:li - (menu-button* {:icon svg/pie} - "Dashboard")] - [:li - (menu-button* {:aria-controls "dropdown-invoices", - :data-collapse-toggle "dropdown-invoices" - :icon svg/accounting-invoice-mail} - "Invoices") - (sub-menu* {:id "dropdown-invoices"} - (menu-button* {:href "http://google.com"} - "All") - (menu-button* {:href "http://google.com"} - "Paid") - (menu-button* {:href "http://google.com"} - "Unpaid") - (menu-button* {:href "http://google.com"} - "Voided")) - ] - [:li - (menu-button* {:aria-controls "dropdown-sales", - :data-collapse-toggle "dropdown-sales" - :icon svg/receipt-register-1} - "Sales") - (sub-menu* {:id "dropdown-sales"} - (menu-button* {:href "Sales"} "Sales") - (menu-button* {:href "Sales"} "Expected Deposits") - (menu-button* {:href "Sales"} "Cash Shifts") - (menu-button* {:href "Sales"} "Tenders"))] - [:li - (menu-button* {:aria-controls "dropdown-payments" - :data-collapse-toggle "dropdown-payments" - :icon svg/payments} - "Payments") - (sub-menu* {:id "dropdown-payments"} - (menu-button* {:href "Sales"} "All") - (menu-button* {:href "Sales"} "Pending") - (menu-button* {:href "Sales"} "Cleared") - (menu-button* {:href "Sales"} "Voided"))] - - [:li - (menu-button* {:aria-controls "dropdown-transactions" - :data-collapse-toggle "dropdown-transactions" - :icon svg/bank} - "Transactions") - - (sub-menu* {:id "dropdown-transactions"} - (menu-button* {:href "Sales"} "All") - (menu-button* {:href "Sales"} "Unapproved") - (menu-button* {:href "Sales"} "Client Review") - (menu-button* {:href "Sales"} "Approved") - (menu-button* {:href "Sales"} "Insights"))] - [:li - (menu-button* {:aria-controls "dropdown-ledger" - :data-collapse-toggle "dropdown-ledger" - :icon svg/receipt} - "Ledger") - (sub-menu* {:id "dropdown-ledger"} - (menu-button* {:href "Sales"} "Register") - (menu-button* {:href "Sales"} "Profit & Loss") - (menu-button* {:href "Sales"} "Profit & Loss Detail") - (menu-button* {:href "Sales"} "Cash Flows") - (menu-button* {:href "Sales"} "Balance Sheet") - (menu-button* {:href "Sales"} "External Ledger Import")) - - ]] - #_[:ul {:class "pt-5 mt-5 space-y-2 border-t border-gray-200 dark:border-gray-700"} - [:li - [:a {:href "#", :class "flex items-center p-2 text-base font-normal text-gray-900 rounded-lg transition duration-75 hover:bg-gray-100 dark:hover:bg-gray-700 dark:text-white group"} - [:svg {:aria-hidden "true", :class "flex-shrink-0 w-6 h-6 text-gray-400 transition duration-75 dark:text-gray-400 group-hover:text-gray-900 dark:group-hover:text-white", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} - [:path {:d "M9 2a1 1 0 000 2h2a1 1 0 100-2H9z"}] - [:path {:fill-rule "evenodd", :d "M4 5a2 2 0 012-2 3 3 0 003 3h2a3 3 0 003-3 2 2 0 012 2v11a2 2 0 01-2 2H6a2 2 0 01-2-2V5zm3 4a1 1 0 000 2h.01a1 1 0 100-2H7zm3 0a1 1 0 000 2h3a1 1 0 100-2h-3zm-3 4a1 1 0 100 2h.01a1 1 0 100-2H7zm3 0a1 1 0 100 2h3a1 1 0 100-2h-3z", :clip-rule "evenodd"}]] - [:span {:class "ml-3"} "Docs"]]] - [:li - [:a {:href "#", :class "flex items-center p-2 text-base font-normal text-gray-900 rounded-lg transition duration-75 hover:bg-gray-100 dark:hover:bg-gray-700 dark:text-white group"} - [:svg {:aria-hidden "true", :class "flex-shrink-0 w-6 h-6 text-gray-400 transition duration-75 dark:text-gray-400 group-hover:text-gray-900 dark:group-hover:text-white", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} - [:path {:d "M7 3a1 1 0 000 2h6a1 1 0 100-2H7zM4 7a1 1 0 011-1h10a1 1 0 110 2H5a1 1 0 01-1-1zM2 11a2 2 0 012-2h12a2 2 0 012 2v4a2 2 0 01-2 2H4a2 2 0 01-2-2v-4z"}]] - [:span {:class "ml-3"} "Components"]]] - [:li - [:a {:href "#", :class "flex items-center p-2 text-base font-normal text-gray-900 rounded-lg transition duration-75 hover:bg-gray-100 dark:hover:bg-gray-700 dark:text-white group"} - [:svg {:aria-hidden "true", :class "flex-shrink-0 w-6 h-6 text-gray-400 transition duration-75 dark:text-gray-400 group-hover:text-gray-900 dark:group-hover:text-white", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} - [:path {:fill-rule "evenodd", :d "M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-2 0c0 .993-.241 1.929-.668 2.754l-1.524-1.525a3.997 3.997 0 00.078-2.183l1.562-1.562C15.802 8.249 16 9.1 16 10zm-5.165 3.913l1.58 1.58A5.98 5.98 0 0110 16a5.976 5.976 0 01-2.516-.552l1.562-1.562a4.006 4.006 0 001.789.027zm-4.677-2.796a4.002 4.002 0 01-.041-2.08l-.08.08-1.53-1.533A5.98 5.98 0 004 10c0 .954.223 1.856.619 2.657l1.54-1.54zm1.088-6.45A5.974 5.974 0 0110 4c.954 0 1.856.223 2.657.619l-1.54 1.54a4.002 4.002 0 00-2.346.033L7.246 4.668zM12 10a2 2 0 11-4 0 2 2 0 014 0z", :clip-rule "evenodd"}]] - [:span {:class "ml-3"} "Help"]]]]] - #_[:div {:class "hidden absolute bottom-0 left-0 justify-center p-4 space-x-4 w-full lg:flex bg-white dark:bg-gray-800 z-20 border-r border-gray-200 dark:border-gray-700"} - [:a {:href "#", :class "inline-flex justify-center p-2 text-gray-500 rounded cursor-pointer dark:text-gray-400 hover:text-gray-900 dark:hover:text-white hover:bg-gray-100 dark:hover:bg-gray-600"} - [:svg {:aria-hidden "true", :class "w-6 h-6", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} - [:path {:d "M5 4a1 1 0 00-2 0v7.268a2 2 0 000 3.464V16a1 1 0 102 0v-1.268a2 2 0 000-3.464V4zM11 4a1 1 0 10-2 0v1.268a2 2 0 000 3.464V16a1 1 0 102 0V8.732a2 2 0 000-3.464V4zM16 3a1 1 0 011 1v7.268a2 2 0 010 3.464V16a1 1 0 11-2 0v-1.268a2 2 0 010-3.464V4a1 1 0 011-1z"}]]] - [:a {:href "#", :data-tooltip-target "tooltip-settings", :class "inline-flex justify-center p-2 text-gray-500 rounded cursor-pointer dark:text-gray-400 dark:hover:text-white hover:text-gray-900 hover:bg-gray-100 dark:hover:bg-gray-600"} - [: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 "M11.49 3.17c-.38-1.56-2.6-1.56-2.98 0a1.532 1.532 0 01-2.286.948c-1.372-.836-2.942.734-2.106 2.106.54.886.061 2.042-.947 2.287-1.561.379-1.561 2.6 0 2.978a1.532 1.532 0 01.947 2.287c-.836 1.372.734 2.942 2.106 2.106a1.532 1.532 0 012.287.947c.379 1.561 2.6 1.561 2.978 0a1.533 1.533 0 012.287-.947c1.372.836 2.942-.734 2.106-2.106a1.533 1.533 0 01.947-2.287c1.561-.379 1.561-2.6 0-2.978a1.532 1.532 0 01-.947-2.287c.836-1.372-.734-2.942-2.106-2.106a1.532 1.532 0 01-2.287-.947zM10 13a3 3 0 100-6 3 3 0 000 6z", :clip-rule "evenodd"}]]] - [:div {:id "tooltip-settings", :role "tooltip", :class "inline-block absolute invisible z-10 py-2 px-3 text-sm font-medium text-white bg-gray-900 rounded-lg shadow-sm opacity-0 transition-opacity duration-300 tooltip"} "Settings page" - ] - [:button {:type "button", :data-dropdown-toggle "language-dropdown", :class "inline-flex justify-center p-2 text-gray-500 rounded cursor-pointer dark:hover:text-white dark:text-gray-400 hover:text-gray-900 hover:bg-gray-100 dark:hover:bg-gray-600"} - [:svg {:aria-hidden "true", :class "h-5 w-5 rounded-full mt-0.5", :xmlns "http://www.w3.org/2000/svg", :xmlns:xlink "http://www.w3.org/1999/xlink", :viewbox "0 0 3900 3900"} - [:path {:fill "#b22234", :d "M0 0h7410v3900H0z"}] - [:path {:d "M0 450h7410m0 600H0m0 600h7410m0 600H0m0 600h7410m0 600H0", :stroke "#fff", :stroke-width "300"}] - [:path {:fill "#3c3b6e", :d "M0 0h2964v2100H0z"}] - [:g {:fill "#fff"} - [:g {:id "d"} - [:g {:id "c"} - [:g {:id "e"} - [:g {:id "b"} - [:path {:id "a", :d "M247 90l70.534 217.082-184.66-134.164h228.253L176.466 307.082z"}] - [:use {:xlink:href "#a", :y "420"}] - [:use {:xlink:href "#a", :y "840"}] - [:use {:xlink:href "#a", :y "1260"}]] - [:use {:xlink:href "#a", :y "1680"}]] - [:use {:xlink:href "#b", :x "247", :y "210"}]] - [:use {:xlink:href "#c", :x "494"}]] - [:use {:xlink:href "#d", :x "988"}] - [:use {:xlink:href "#c", :x "1976"}] - [:use {:xlink:href "#e", :x "2470"}]]]] - [:div {:class "hidden z-50 my-4 text-base list-none bg-white rounded divide-y divide-gray-100 shadow dark:bg-gray-700", :id "language-dropdown"} - [:ul {:class "py-1", :role "none"} - [:li - [:a {:href "#", :class "block py-2 px-4 text-sm text-gray-700 hover:bg-gray-100 dark:hover:text-white dark:text-gray-300 dark:hover:bg-gray-600", :role "menuitem"} - [:div {:class "inline-flex items-center"} - [:svg {:aria-hidden "true", :class "h-3.5 w-3.5 rounded-full mr-2", :xmlns "http://www.w3.org/2000/svg", :id "flag-icon-css-us", :viewbox "0 0 512 512"} - [:g {:fill-rule "evenodd"} - [:g {:stroke-width "1pt"} - [:path {:fill "#bd3d44", :d "M0 0h247v10H0zm0 20h247v10H0zm0 20h247v10H0zm0 20h247v10H0zm0 20h247v10H0zm0 20h247v10H0zm0 20h247v10H0z", :transform "scale(3.9385)"}] - [:path {:fill "#fff", :d "M0 10h247v10H0zm0 20h247v10H0zm0 20h247v10H0zm0 20h247v10H0zm0 20h247v10H0zm0 20h247v10H0z", :transform "scale(3.9385)"}]] - [:path {:fill "#192f5d", :d "M0 0h98.8v70H0z", :transform "scale(3.9385)"}] - [:path {:fill "#fff", :d "M8.2 3l1 2.8H12L9.7 7.5l.9 2.7-2.4-1.7L6 10.2l.9-2.7-2.4-1.7h3zm16.5 0l.9 2.8h2.9l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm16.5 0l.9 2.8H45l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm16.4 0l1 2.8h2.8l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h3zm16.5 0l.9 2.8h2.9l-2.4 1.7 1 2.7L74 8.5l-2.3 1.7.9-2.7-2.4-1.7h2.9zm16.5 0l.9 2.8h2.9L92 7.5l1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm-74.1 7l.9 2.8h2.9l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm16.4 0l1 2.8h2.8l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h3zm16.5 0l.9 2.8h2.9l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm16.5 0l.9 2.8h2.9l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7H65zm16.4 0l1 2.8H86l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h3zm-74 7l.8 2.8h3l-2.4 1.7.9 2.7-2.4-1.7L6 24.2l.9-2.7-2.4-1.7h3zm16.4 0l.9 2.8h2.9l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h2.9zm16.5 0l.9 2.8H45l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm16.4 0l1 2.8h2.8l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h3zm16.5 0l.9 2.8h2.9l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h2.9zm16.5 0l.9 2.8h2.9L92 21.5l1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm-74.1 7l.9 2.8h2.9l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm16.4 0l1 2.8h2.8l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h3zm16.5 0l.9 2.8h2.9l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h2.9zm16.5 0l.9 2.8h2.9l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7H65zm16.4 0l1 2.8H86l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h3zm-74 7l.8 2.8h3l-2.4 1.7.9 2.7-2.4-1.7L6 38.2l.9-2.7-2.4-1.7h3zm16.4 0l.9 2.8h2.9l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h2.9zm16.5 0l.9 2.8H45l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm16.4 0l1 2.8h2.8l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h3zm16.5 0l.9 2.8h2.9l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h2.9zm16.5 0l.9 2.8h2.9L92 35.5l1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm-74.1 7l.9 2.8h2.9l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm16.4 0l1 2.8h2.8l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h3zm16.5 0l.9 2.8h2.9l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h2.9zm16.5 0l.9 2.8h2.9l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7H65zm16.4 0l1 2.8H86l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h3zm-74 7l.8 2.8h3l-2.4 1.7.9 2.7-2.4-1.7L6 52.2l.9-2.7-2.4-1.7h3zm16.4 0l.9 2.8h2.9l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h2.9zm16.5 0l.9 2.8H45l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm16.4 0l1 2.8h2.8l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h3zm16.5 0l.9 2.8h2.9l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h2.9zm16.5 0l.9 2.8h2.9L92 49.5l1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm-74.1 7l.9 2.8h2.9l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm16.4 0l1 2.8h2.8l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h3zm16.5 0l.9 2.8h2.9l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h2.9zm16.5 0l.9 2.8h2.9l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7H65zm16.4 0l1 2.8H86l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h3zm-74 7l.8 2.8h3l-2.4 1.7.9 2.7-2.4-1.7L6 66.2l.9-2.7-2.4-1.7h3zm16.4 0l.9 2.8h2.9l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h2.9zm16.5 0l.9 2.8H45l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm16.4 0l1 2.8h2.8l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h3zm16.5 0l.9 2.8h2.9l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h2.9zm16.5 0l.9 2.8h2.9L92 63.5l1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9z", :transform "scale(3.9385)"}]]]" \n English (US)"]]] - [:li - [:a {:href "#", :class "block py-2 px-4 text-sm text-gray-700 hover:bg-gray-100 dark:text-gray-300 dark:hover:text-white dark:hover:bg-gray-600", :role "menuitem"} - [:div {:class "inline-flex items-center"} - [:svg {:aria-hidden "true", :class "h-3.5 w-3.5 rounded-full mr-2", :xmlns "http://www.w3.org/2000/svg", :id "flag-icon-css-de", :viewbox "0 0 512 512"} - [:path {:fill "#ffce00", :d "M0 341.3h512V512H0z"}] - [:path {:d "M0 0h512v170.7H0z"}] - [:path {:fill "#d00", :d "M0 170.7h512v170.6H0z"}]]]]] - [:li - [:a {:href "#", :class "block py-2 px-4 text-sm text-gray-700 hover:bg-gray-100 dark:text-gray-300 dark:hover:text-white dark:hover:bg-gray-600", :role "menuitem"} - [:div {:class "inline-flex items-center"} - [:svg {:aria-hidden "true", :class "h-3.5 w-3.5 rounded-full mr-2", :xmlns "http://www.w3.org/2000/svg", :id "flag-icon-css-it", :viewbox "0 0 512 512"} - [:g {:fill-rule "evenodd", :stroke-width "1pt"} - [:path {:fill "#fff", :d "M0 0h512v512H0z"}] - [:path {:fill "#009246", :d "M0 0h170.7v512H0z"}] - [:path {:fill "#ce2b37", :d "M341.3 0H512v512H341.3z"}]]]]]] - [:li - [:a {:href "#", :class "block py-2 px-4 text-sm text-gray-700 hover:bg-gray-100 dark:hover:text-white dark:text-gray-300 dark:hover:bg-gray-600", :role "menuitem"} - [:div {:class "inline-flex items-center"} - [:svg {:aria-hidden "true", :class "h-3.5 w-3.5 rounded-full mr-2", :xmlns "http://www.w3.org/2000/svg", :xmlns:xlink "http://www.w3.org/1999/xlink", :id "flag-icon-css-cn", :viewbox "0 0 512 512"} - [:defs - [:path {:id "a", :fill "#ffde00", :d "M1-.3L-.7.8 0-1 .6.8-1-.3z"}]] - [:path {:fill "#de2910", :d "M0 0h512v512H0z"}] - [:use {:width "30", :height "20", :transform "matrix(76.8 0 0 76.8 128 128)", :xlink:href "#a"}] - [:use {:width "30", :height "20", :transform "rotate(-121 142.6 -47) scale(25.5827)", :xlink:href "#a"}] - [:use {:width "30", :height "20", :transform "rotate(-98.1 198 -82) scale(25.6)", :xlink:href "#a"}] - [:use {:width "30", :height "20", :transform "rotate(-74 272.4 -114) scale(25.6137)", :xlink:href "#a"}] - [:use {:width "30", :height "20", :transform "matrix(16 -19.968 19.968 16 256 230.4)", :xlink:href "#a"}]]"中文 (繁體)"]]]]]]]) - -(defn navbar* [] - [:nav {:class "fixed z-30 w-full bg-white border-b border-gray-200 dark:bg-gray-800 dark:border-gray-700"} - [:div {:class "px-3 py-3 lg:px-5 lg:pl-3"} - [:div {:class "flex items-center justify-between"} - [:div {:class "flex items-center justify-start"} - [:button { :aria-controls "left-nav", :id "left-nav-toggle" :type "button", :class "inline-flex items-center p-2 mt-2 ml-2 mr-2 text-sm text-gray-500 rounded-lg hover:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-gray-200 dark:text-gray-400 dark:hover:bg-gray-700 dark:focus:ring-gray-600"} - [:span {:class "sr-only"} "Open sidebar"] - [:svg {:class "w-6 h-6", :aria-hidden "true", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} - [:path {:clip-rule "evenodd", :fill-rule "evenodd", :d "M2 4.75A.75.75 0 012.75 4h14.5a.75.75 0 010 1.5H2.75A.75.75 0 012 4.75zm0 10.5a.75.75 0 01.75-.75h7.5a.75.75 0 010 1.5h-7.5a.75.75 0 01-.75-.75zM2 10a.75.75 0 01.75-.75h14.5a.75.75 0 010 1.5H2.75A.75.75 0 012 10z"}]]] - [: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"}] - ] - [:form {:action "#", :method "GET", :class "hidden lg:block lg:pl-3.5"} - [:label {:for "topbar-search", :class "sr-only"} "Search"] - [:div {:class "relative mt-1 lg:w-96"} - [:div {:class "absolute inset-y-0 left-0 flex items-center pl-3 pointer-events-none"} - [: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"} - [: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"}]]] - [: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 {:class "flex items-center gap-4"} - [:div {:class "hidden mr-3 -mb-1 sm:block"} - [: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"} - [:span {:class "sr-only"} "Search"] - [:svg {:class "w-6 h-6", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} - [: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"}]]] - - - (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"} - [: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"} - [:path {:d "M5 3a2 2 0 00-2 2v2a2 2 0 002 2h2a2 2 0 002-2V5a2 2 0 00-2-2H5zM5 11a2 2 0 00-2 2v2a2 2 0 002 2h2a2 2 0 002-2v-2a2 2 0 00-2-2H5zM11 5a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2V5zM11 13a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2v-2z"}]]] - #_(icon-button* {} - [:div.w-4.h-4 svg/search]) - [:div {:class "z-20 z-50 max-w-sm my-4 overflow-hidden text-base list-none bg-white divide-y divide-gray-100 rounded shadow-lg dark:bg-gray-700 dark:divide-gray-600 hidden", :id "apps-dropdown", :style "position: absolute; inset: 0px auto auto 0px; margin: 0px; transform: translate(1545px, 65px);", :data-popper-placement "bottom"} - [:div {:class "block px-4 py-2 text-base font-medium text-center text-gray-700 bg-gray-50 dark:bg-gray-700 dark:text-gray-400"} ] - [:div {:class "grid grid-cols-3 gap-4 p-4"} - [:a {:href "#", :class "block p-4 text-center rounded-lg hover:bg-gray-100 dark:hover:bg-gray-600"} - [:svg {:class "mx-auto mb-1 text-gray-500 w-7 h-7 dark:text-gray-400", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} - [:path {:fill-rule "evenodd", :d "M10 2a4 4 0 00-4 4v1H5a1 1 0 00-.994.89l-1 9A1 1 0 004 18h12a1 1 0 00.994-1.11l-1-9A1 1 0 0015 7h-1V6a4 4 0 00-4-4zm2 5V6a2 2 0 10-4 0v1h4zm-6 3a1 1 0 112 0 1 1 0 01-2 0zm7-1a1 1 0 100 2 1 1 0 000-2z", :clip-rule "evenodd"}]] - [:div {:class "text-sm font-medium text-gray-900 dark:text-white"} "Sales"]] - [:a {:href "#", :class "block p-4 text-center rounded-lg hover:bg-gray-100 dark:hover:bg-gray-600"} - [:svg {:class "mx-auto mb-1 text-gray-500 w-7 h-7 dark:text-gray-400", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} - [:path {:d "M13 6a3 3 0 11-6 0 3 3 0 016 0zM18 8a2 2 0 11-4 0 2 2 0 014 0zM14 15a4 4 0 00-8 0v3h8v-3zM6 8a2 2 0 11-4 0 2 2 0 014 0zM16 18v-3a5.972 5.972 0 00-.75-2.906A3.005 3.005 0 0119 15v3h-3zM4.75 12.094A5.973 5.973 0 004 15v3H1v-3a3 3 0 013.75-2.906z"}]] - [:div {:class "text-sm font-medium text-gray-900 dark:text-white"} "Users"]] - [:a {:href "#", :class "block p-4 text-center rounded-lg hover:bg-gray-100 dark:hover:bg-gray-600"} - [:svg {:class "mx-auto mb-1 text-gray-500 w-7 h-7 dark:text-gray-400", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} - [:path {:fill-rule "evenodd", :d "M5 3a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2V5a2 2 0 00-2-2H5zm0 2h10v7h-2l-1 2H8l-1-2H5V5z", :clip-rule "evenodd"}]] - [:div {:class "text-sm font-medium text-gray-900 dark:text-white"} "Inbox"]] - [:a {:href "#", :class "block p-4 text-center rounded-lg hover:bg-gray-100 dark:hover:bg-gray-600"} - [:svg {:class "mx-auto mb-1 text-gray-500 w-7 h-7 dark:text-gray-400", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} - [:path {:fill-rule "evenodd", :d "M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-6-3a2 2 0 11-4 0 2 2 0 014 0zm-2 4a5 5 0 00-4.546 2.916A5.986 5.986 0 0010 16a5.986 5.986 0 004.546-2.084A5 5 0 0010 11z", :clip-rule "evenodd"}]] - [:div {:class "text-sm font-medium text-gray-900 dark:text-white"} "Profile"]] - [:a {:href "#", :class "block p-4 text-center rounded-lg hover:bg-gray-100 dark:hover:bg-gray-600"} - [:svg {:class "mx-auto mb-1 text-gray-500 w-7 h-7 dark:text-gray-400", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} - [:path {:fill-rule "evenodd", :d "M11.49 3.17c-.38-1.56-2.6-1.56-2.98 0a1.532 1.532 0 01-2.286.948c-1.372-.836-2.942.734-2.106 2.106.54.886.061 2.042-.947 2.287-1.561.379-1.561 2.6 0 2.978a1.532 1.532 0 01.947 2.287c-.836 1.372.734 2.942 2.106 2.106a1.532 1.532 0 012.287.947c.379 1.561 2.6 1.561 2.978 0a1.533 1.533 0 012.287-.947c1.372.836 2.942-.734 2.106-2.106a1.533 1.533 0 01.947-2.287c1.561-.379 1.561-2.6 0-2.978a1.532 1.532 0 01-.947-2.287c.836-1.372-.734-2.942-2.106-2.106a1.532 1.532 0 01-2.287-.947zM10 13a3 3 0 100-6 3 3 0 000 6z", :clip-rule "evenodd"}]] - [:div {:class "text-sm font-medium text-gray-900 dark:text-white"} "Settings"]] - [:a {:href "#", :class "block p-4 text-center rounded-lg hover:bg-gray-100 dark:hover:bg-gray-600"} - [:svg {:class "mx-auto mb-1 text-gray-500 w-7 h-7 dark:text-gray-400", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} - [:path {:d "M4 3a2 2 0 100 4h12a2 2 0 100-4H4z"}] - [:path {:fill-rule "evenodd", :d "M3 8h14v7a2 2 0 01-2 2H5a2 2 0 01-2-2V8zm5 3a1 1 0 011-1h2a1 1 0 110 2H9a1 1 0 01-1-1z", :clip-rule "evenodd"}]] - [:div {:class "text-sm font-medium text-gray-900 dark:text-white"} "Products"]] - [:a {:href "#", :class "block p-4 text-center rounded-lg hover:bg-gray-100 dark:hover:bg-gray-600"} - [:svg {:class "mx-auto mb-1 text-gray-500 w-7 h-7 dark:text-gray-400", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} - [:path {:d "M8.433 7.418c.155-.103.346-.196.567-.267v1.698a2.305 2.305 0 01-.567-.267C8.07 8.34 8 8.114 8 8c0-.114.07-.34.433-.582zM11 12.849v-1.698c.22.071.412.164.567.267.364.243.433.468.433.582 0 .114-.07.34-.433.582a2.305 2.305 0 01-.567.267z"}] - [:path {:fill-rule "evenodd", :d "M10 18a8 8 0 100-16 8 8 0 000 16zm1-13a1 1 0 10-2 0v.092a4.535 4.535 0 00-1.676.662C6.602 6.234 6 7.009 6 8c0 .99.602 1.765 1.324 2.246.48.32 1.054.545 1.676.662v1.941c-.391-.127-.68-.317-.843-.504a1 1 0 10-1.51 1.31c.562.649 1.413 1.076 2.353 1.253V15a1 1 0 102 0v-.092a4.535 4.535 0 001.676-.662C13.398 13.766 14 12.991 14 12c0-.99-.602-1.765-1.324-2.246A4.535 4.535 0 0011 9.092V7.151c.391.127.68.317.843.504a1 1 0 101.511-1.31c-.563-.649-1.413-1.076-2.354-1.253V5z", :clip-rule "evenodd"}]] - [:div {:class "text-sm font-medium text-gray-900 dark:text-white"} "Pricing"]] - [:a {:href "#", :class "block p-4 text-center rounded-lg hover:bg-gray-100 dark:hover:bg-gray-600"} - [:svg {:class "mx-auto mb-1 text-gray-500 w-7 h-7 dark:text-gray-400", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} - [:path {:fill-rule "evenodd", :d "M5 2a2 2 0 00-2 2v14l3.5-2 3.5 2 3.5-2 3.5 2V4a2 2 0 00-2-2H5zm2.5 3a1.5 1.5 0 100 3 1.5 1.5 0 000-3zm6.207.293a1 1 0 00-1.414 0l-6 6a1 1 0 101.414 1.414l6-6a1 1 0 000-1.414zM12.5 10a1.5 1.5 0 100 3 1.5 1.5 0 000-3z", :clip-rule "evenodd"}]] - [:div {:class "text-sm font-medium text-gray-900 dark:text-white"} "Billing"]] - [:a {:href "#", :class "block p-4 text-center rounded-lg hover:bg-gray-100 dark:hover:bg-gray-600"} - [:svg {:class "mx-auto mb-1 text-gray-500 w-7 h-7 dark:text-gray-400", :fill "none", :stroke "currentColor", :viewbox "0 0 24 24", :xmlns "http://www.w3.org/2000/svg"} - [:path {:stroke-linecap "round", :stroke-linejoin "round", :stroke-width "2", :d "M11 16l-4-4m0 0l4-4m-4 4h14m-5 4v1a3 3 0 01-3 3H6a3 3 0 01-3-3V7a3 3 0 013-3h7a3 3 0 013 3v1"}]] - [:div {:class "text-sm font-medium text-gray-900 dark:text-white"} "Logout"]]]] - (icon-button* {"_" (hiccup/raw "on click toggle .dark on ")} - [:div.h-4.w-4 - [:div.hidden.dark:block svg/sun] - [:div.dark:hidden svg/moon] - ]) - #_[:button {:id "theme-toggle", :data-tooltip-target "tooltip-toggle", :type "button", :class "text-gray-500 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-700 focus:outline-none focus:ring-4 focus:ring-gray-200 dark:focus:ring-gray-700 rounded-lg text-sm p-2.5" - } - ] - [:div {:id "tooltip-toggle", :role "tooltip", :class "absolute z-10 inline-block px-3 py-2 text-sm font-medium text-white transition-opacity duration-300 bg-gray-900 rounded-lg shadow-sm tooltip opacity-0 invisible", :style "position: absolute; inset: 0px auto auto 0px; margin: 0px; transform: translate(2326px, 63px);", :data-popper-placement "bottom"} [:img {:src "https://flowbite.com/docs/images/people/profile-picture-5.jpg"}] - [:div {:class "tooltip-arrow", :data-popper-arrow "data-popper-arrow", :style "position: absolute; left: 0px; transform: translate(69px);"}]] - [:div {:class "flex items-center ml-3"} - [:div - [:button {:type "button", :class "flex text-sm bg-gray-800 rounded-full focus:ring-4 focus:ring-gray-300 dark:focus:ring-gray-600", :id "user-menu-button-2", :aria-expanded "false", :data-dropdown-toggle "dropdown-2"} - [:span {:class "sr-only"} "Open user menu"] - [:img {:class "w-8 h-8 rounded-full", :src "https://flowbite.com/docs/images/people/profile-picture-5.jpg", :alt "user photo"}]]] - [:div {:class "z-50 hidden my-4 text-base list-none bg-white divide-y divide-gray-100 rounded shadow dark:bg-gray-700 dark:divide-gray-600", :id "dropdown-2", :style "position: absolute; inset: 0px auto auto 0px; margin: 0px; transform: translate(2446px, 61px);", :data-popper-placement "bottom"} - [:div {:class "px-4 py-3", :role "none"} - [:p {:class "text-sm text-gray-900 dark:text-white", :role "none"} "Neil Sims"] - [:p {:class "text-sm font-medium text-gray-900 truncate dark:text-gray-300", :role "none"} "neil.sims@flowbite.com"]] - [:ul {:class "py-1", :role "none"} - [:li - [:a {:href "#", :class "block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 dark:text-gray-300 dark:hover:bg-gray-600 dark:hover:text-white", :role "menuitem"} "Dashboard"]] - [:li - [:a {:href "#", :class "block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 dark:text-gray-300 dark:hover:bg-gray-600 dark:hover:text-white", :role "menuitem"} "Settings"]] - [:li - [:a {:href "#", :class "block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 dark:text-gray-300 dark:hover:bg-gray-600 dark:hover:text-white", :role "menuitem"} "Earnings"]] - [:li - [:a {:href "#", :class "block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 dark:text-gray-300 dark:hover:bg-gray-600 dark:hover:text-white", :role "menuitem"} "Sign out"]]]]]]]]]) - - - -(defn page* [request & {:keys [flash-id]}] - [:div - (navbar*) - [:div.flex.pt-16.overflow-hidden - (sidebar*) - [:div#main-content {:class "relative w-full h-full lg:pl-64 overflow-y-auto px-4 bg-gray-100 dark:bg-gray-900"} - [:div.p-4 - - - - (table* request :flash-id flash-id) - #_[:div#modal-holder] - ]]] - [:script {:lang "text/javascript"} - (hiccup/raw " - const $targetEl = document.getElementById('left-nav'); - - const $triggerEl = document.getElementById('left-nav-toggle'); - - const options = { - onCollapse: () => { - document.getElementById('main-content').classList.remove('lg:pl-64') - }, - onExpand: () => { - document.getElementById('main-content').classList.add('lg:pl-64') - }, - onToggle: () => { - } - }; - - const collapse = new Collapse($targetEl, $triggerEl, options); ")]]) + (com/content-card {} + [:div {:class "flex flex-col px-4 py-3 space-y-3 lg:flex-row lg:items-center lg:justify-between lg:space-y-0 lg:space-x-4 text-gray-800 dark:text-gray-100"} + [:div + [:h1.text-2xl.mb-3.font-bold "1099 Vendor Info"] + [:div {:class "flex items-center flex-1 space-x-4"} + [:h5 + [:span "Total Vendors:"] + [:span {:class "dark:text-white pl-4"} (count companies)]]]] + [:div {:class "flex flex-col flex-shrink-0 space-y-3 md:flex-row md:items-center lg:justify-end md:space-y-0 md:space-x-3"} + (com/button {:color :primary} + (com/button-icon {} svg/refresh) + "Add new product") + (com/button {:color :secondary} + (com/button-icon {} svg/refresh) + "Update stocks 1/250") + (com/icon-button {} + svg/upload)]] + [:div {:class "overflow-x-auto"} + (apply com/data-grid {:headers [(com/data-grid-header {} "Client") + (com/data-grid-header {} "Vendor Name") + (com/data-grid-header {:class "hidden md:table-cell"} "TIN") + (com/data-grid-header {:class "hidden lg:table-cell"} "Address") + (com/data-grid-header {}) + (com/data-grid-header {})]} + (for [[client vendor amount] companies] + (com/data-grid-row + {:class (when (= flash-id + (:db/id vendor)) + "live-added")} + (com/data-grid-cell {} (:client/code client)) + (com/data-grid-cell + {} + [:div.flex.whitespace-nowrap.items-center + [:div [:div (:vendor/name vendor)] + [:div.text-sm.text-gray-400 + (or (-> vendor :vendor/legal-entity-name not-empty) + (str (-> vendor :vendor/legal-entity-first-name) " " + (-> vendor :vendor/legal-entity-middle-name) " " + (-> vendor :vendor/legal-entity-last-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"} + (str/capitalize t99-type)])]) + (com/data-grid-cell + {:class "hidden md:table-cell"} + [:div.flex.gap-4 + (when-let [tin (-> vendor :vendor/legal-entity-tin)] + [:span {:class "text-xs font-medium py-0.5 "} + tin]) + (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"} + (str/capitalize tin-type) + ])]) + (com/data-grid-cell + {:class "hidden lg:table-cell"} + (if (-> vendor :vendor/address :address/street1) + [:div + [:div (-> vendor :vendor/address :address/street1)] " " + [:div + (-> vendor :vendor/address :address/street2)] " " + [:div + (-> vendor :vendor/address :address/city) " " + (-> vendor :vendor/address :address/state) "," + (-> vendor :vendor/address :address/zip)]] + [:p.text-sm.italic.text-gray-400 "No address"])) + (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"} + "Paid $" (Math/round amount)]) + (com/data-grid-right-stack-cell + {} + (if (cannot-overwrite? vendor) + [:div (com/link {:href "mailto:ben@integreatconsult.com"} "Contact Integreat")] + (com/icon-button {:hx-get (bidi/path-for ssr-routes/only-routes + :company-1099-vendor-dialog + :vendor-id (:db/id vendor)) + :hx-target "#modal-content" + :hx-swap "innerHTML"} + [:i.fa.fa-pencil ]))))))] + (com/paginator))])) (defn form-data->map [form-data] (reduce-kv @@ -722,11 +227,11 @@ (defn path->name [k] (cond (keyword? k) - (str (namespace k) "/" (name k)) + (str (namespace k) "/" (name k)) - (seq k) - (str/join "_" (map path->name k)) - :else k)) + (seq k) + (str/join "_" (map path->name k)) + :else k)) (defn vendor-save [{:keys [form-params identity route-params] :as request}] (when-not (cannot-overwrite? (dc/pull (dc/db conn) '[*] (Long/parseLong (:vendor-id route-params)))) @@ -739,37 +244,7 @@ (table* request :flash-id (Long/parseLong (:vendor-id route-params))) :headers {"hx-trigger" "closeDialog"})) -(defn field* [params & rest] - (into - [:div - [:label {:class "block mb-2 text-sm font-medium text-gray-900 dark:text-white"} (:label params)]] - rest)) -(defn text-input* [params] - [:input - {:type "text" - :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" - :autofocus (:autofocus params) - :name (:name params) - :placeholder (:placeholder params) - :value (:value params)}]) - -(defn select* [params & children] - (into - [:select {: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" - :name (:name params)}] - children)) - - - - - -(defn save-button* [params & children] - [:button { :class "text-white bg-green-500 hover:bg-green-700 focus:ring-4 focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center mr-2 dark:bg-green-600 dark:hover:bg-green-700 dark:focus:ring-green-800 inline-flex items-center hover:scale-105 transition duration-300"} - [:div.htmx-indicator.flex.items-center - (svg/spinner {:class "inline w-4 h-4 text-white"}) - [:div.ml-3 "Loading..."]] - (into [:div.htmx-indicator-hidden ] children)]) (defn vendor-dialog [request] (let [vendor (dc/pull (dc/db conn) '[* {:vendor/legal-entity-1099-type [:db/ident] @@ -781,125 +256,101 @@ :request-method :post :vendor-id (Long/parseLong (:vendor-id (:params request)))) :hx-target "#vendor-table" - :hx-swap "outerHTML swap:300ms" - } - (dialog + :hx-swap "outerHTML swap:300ms"} + (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.space-y-6 - [:div.grid.grid-cols-6.gap-4 [:h4.text-xl.border-b.col-span-6 "Address"] [:div.col-span-6 - (field* {:label "Street 1" - } - (text-input* {:name (path->name [:vendor/address :address/street1]) + (com/field {:label "Street 1"} + (com/text-input {:name (path->name [:vendor/address :address/street1]) :value (-> vendor :vendor/address :address/street1) :placeholder "1700 Pennsylvania Ave" - :autofocus true})) - - ] + :autofocus true}))] [:div.col-span-6 - (field* {:label "Street 2" - } - (text-input* {:name (path->name [:vendor/address :address/street2]) + (com/field {:label "Street 2"} + (com/text-input {:name (path->name [:vendor/address :address/street2]) :value (-> vendor :vendor/address :address/street2) :placeholder "Suite 200"}))] - - [:div.col-span-3 - (field* {:label "City" - } - (text-input* {:name (path->name [:vendor/address :address/city]) + (com/field {:label "City"} + (com/text-input {:name (path->name [:vendor/address :address/city]) :value (-> vendor :vendor/address :address/city) :placeholder "Cupertino"}))] - [:div.col-span-1 - (field* {:label "State" - } - (text-input* {:name (path->name [:vendor/address :address/state]) + (com/field {:label "State"} + (com/text-input {:name (path->name [:vendor/address :address/state]) :value (-> vendor :vendor/address :address/state) :placeholder "CA"}))] - [:div.col-span-2 - (field* {:label "Zip" - } - (text-input* {:name (path->name [:vendor/address :address/zip]) + (com/field {:label "Zip"} + (com/text-input {:name (path->name [:vendor/address :address/zip]) :value (-> vendor :vendor/address :address/zip) :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 - (field* {:label "Legal Entity Name" - } - (text-input* {:name (path->name [:vendor/legal-entity-name]) + (com/field {:label "Legal Entity Name"} + (com/text-input {:name (path->name [:vendor/legal-entity-name]) :value (-> vendor :vendor/legal-entity-name) :placeholder "Good Restaurant LLC"}))] - [:div.col-span-6.text-center - " - OR -"] - + [:div.col-span-6.text-center " - OR -"] [:div.col-span-2 - (field* {:label "First Name" - } - (text-input* {:name (path->name [:vendor/legal-entity-first-name]) + (com/field {:label "First Name"} + (com/text-input {:name (path->name [:vendor/legal-entity-first-name]) :value (-> vendor :vendor/legal-entity-first-name) :placeholder "John"}))] [:div.col-span-2 - (field* {:label "Middle Name" - } - (text-input* {:name (path->name [:vendor/legal-entity-middle-name]) + (com/field {:label "Middle Name"} + (com/text-input {:name (path->name [:vendor/legal-entity-middle-name]) :value (-> vendor :vendor/legal-entity-middle-name) :placeholder "C."}))] [:div.col-span-2 - (field* {:label "Last Name" - } - (text-input* {:name (path->name [:vendor/legal-entity-last-name]) + (com/field {:label "Last Name"} + (com/text-input {:name (path->name [:vendor/legal-entity-last-name]) :value (-> vendor :vendor/legal-entity-last-name) :placeholder "Riley"}))] - [:div.col-span-2 - (field* {:label "TIN" - } - (text-input* {:name (path->name [:vendor/legal-entity-tin]) + (com/field {:label "TIN"} + (com/text-input {:name (path->name [:vendor/legal-entity-tin]) :value (-> vendor :vendor/legal-entity-tin) :placeholder "John"}))] [:div.col-span-2 - (field* {:label "TIN Type" - } - (select* {:name (path->name [:vendor/legal-entity-tin-type])} - [:option {:value ""} ""] - [:option {:value "ein" :selected (= (-> vendor :vendor/legal-entity-tin-type :db/ident) :legal-entity-tin-type/ein)} "EIN"] - [:option {:value "ssn" :selected (= (-> vendor :vendor/legal-entity-tin-type :db/ident) :legal-entity-tin-type/ssn)} "SSN"]) - )] + (com/field {:label "TIN Type"} + (com/select {:name (path->name [:vendor/legal-entity-tin-type]) + :allow-blank? true + :value (some-> vendor :vendor/legal-entity-tin-type :db/ident name) + :options [["ein" "EIN"] + ["ssn" "SSN"]]}))] [:div.col-span-2 - (field* {:label "1099 Type" - } - (select* {:name (path->name [:vendor/legal-entity-1099-type])} - [:option {:value ""} ""] - [:option {:value "none" :selected (= (-> vendor :vendor/legal-entity-1099-type :db/ident) :legal-entity-1099-type/none)} "None"] - [:option {:value "misc" :selected (= (-> vendor :vendor/legal-entity-1099-type :db/ident) :legal-entity-1099-type/misc)} "Misc"] - [:option {:value "landlord" :selected (= (-> vendor :vendor/legal-entity-1099-type :db/ident) :legal-entity-1099-type/landlord)} "Landlord"]) - )] + (com/field {:label "1099 Type"} + (com/select {:name (path->name [:vendor/legal-entity-1099-type]) + :allow-blank? true + :value (some-> vendor :vendor/legal-entity-1099-type :db/ident name) + :options [["none" "None"] + ["misc" "Misc"] + ["landlord" "Landlord"]]}))] [:div.col-span-6 - (save-button* {:color :primary} - "Save") - ]]] + (com/button {:color :primary} + "Save")]]] [:div])]] :headers {"hx-trigger" "openDialog"}))) (defn vendor-table [request] - (html-response (page* request))) + (html-response (com/page + {:nav + (com/company-aside-nav)} + (com/breadcrumbs {} + [:a {:href "#"} "My Company"] + [:a {:href "#"} "1099 Vendor Info"]) + (table* request)))) (defn page [{:keys [identity matched-route] :as request}] (base-page request - [:div {:hx-get (bidi/path-for ssr-routes/only-routes - :company-1099-vendor-table - :request-method :get) - :hx-trigger "load, clientSelected from:body" - :hx-swap "innerHTML"} - #_[:div.htmx-indicator - [:div.column.is-4.is-offset-4.has-text-centered - [:div.loader.is-loading.is-active.big.is-centered]]]] - [:div - (company-side-bar matched-route)])) - + (com/page {:nav (com/company-aside-nav)} + (com/breadcrumbs {} + [:a {:href "#"} "My Company"] + [:a {:href "#"} "1099 Vendor Info"]) + (table* request)) + nil)) diff --git a/src/clj/auto_ap/ssr/components.clj b/src/clj/auto_ap/ssr/components.clj new file mode 100644 index 00000000..402fcc6a --- /dev/null +++ b/src/clj/auto_ap/ssr/components.clj @@ -0,0 +1,67 @@ +(ns auto-ap.ssr.components + (:require [auto-ap.ssr.components.breadcrumbs :as breadcrumbs] + [auto-ap.ssr.components.buttons :as buttons] + [auto-ap.ssr.components.dialog :as dialog] + [auto-ap.ssr.components.inputs :as inputs] + [auto-ap.ssr.components.aside :as aside] + [auto-ap.ssr.components.card :as card] + [auto-ap.ssr.components.navbar :as navbar] + [auto-ap.ssr.components.page :as page] + [auto-ap.ssr.components.data-grid :as data-grid])) + + +(def breadcrumbs breadcrumbs/breadcrumbs-) +(def button buttons/button-) +(def button-icon buttons/button-icon-) +(def icon-button buttons/icon-button-) +(def dialog dialog/dialog-) + +(def text-input inputs/text-input-) +(def select inputs/select-) +(def field inputs/field-) + +(def left-aside aside/left-aside-) +(def company-aside-nav aside/company-aside-nav-) +(def content-card card/content-card-) + +(def navbar navbar/navbar-) + +(def page page/page-) + +(def data-grid data-grid/data-grid-) +(def data-grid-header data-grid/header-) +(def data-grid-row data-grid/row-) +(def data-grid-cell data-grid/cell-) +(def data-grid-right-stack-cell data-grid/right-stack-cell-) + +(defn link [{:keys [class href]} & children] + (into [:a {:href href + :class (str "font-medium text-blue-600 dark:text-blue-500 hover:underline " class)}] + children)) + +(defn paginator [] + [:nav {:class "flex flex-col items-start justify-between p-4 space-y-3 md:flex-row md:items-center md:space-y-0", :aria-label "Table navigation"} + [:span {:class "text-sm font-normal text-gray-500 dark:text-gray-400"} + [:span {:class "font-semibold text-gray-900 dark:text-white"} "1-10"] + [:span {:class "font-semibold text-gray-900 dark:text-white"} "1000"]] + [:ul {:class "inline-flex items-stretch -space-x-px"} + [:li + [:a {:href "#", :class "flex items-center justify-center h-full py-1.5 px-3 ml-0 text-gray-500 bg-white rounded-l-lg border border-gray-300 hover:bg-gray-100 hover:text-gray-700 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white"} + [:span {:class "sr-only"} "Previous"] + [:svg {:class "w-5 h-5", :aria-hidden "true", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} + [:path {:fill-rule "evenodd", :d "M12.707 5.293a1 1 0 010 1.414L9.414 10l3.293 3.293a1 1 0 01-1.414 1.414l-4-4a1 1 0 010-1.414l4-4a1 1 0 011.414 0z", :clip-rule "evenodd"}]]]] + [:li + [:a {:href "#", :class "flex items-center justify-center px-3 py-2 text-sm leading-tight text-gray-500 bg-white border border-gray-300 hover:bg-gray-100 hover:text-gray-700 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white"} "1"]] + [:li + [:a {:href "#", :class "flex items-center justify-center px-3 py-2 text-sm leading-tight text-gray-500 bg-white border border-gray-300 hover:bg-gray-100 hover:text-gray-700 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white"} "2"]] + [:li + [:a {:href "#", :aria-current "page", :class "z-10 flex items-center justify-center px-3 py-2 text-sm leading-tight border text-primary-600 bg-primary-50 border-primary-300 hover:bg-primary-100 hover:text-primary-700 dark:border-gray-700 dark:bg-gray-700 dark:text-white"} "3"]] + [:li + [:a {:href "#", :class "flex items-center justify-center px-3 py-2 text-sm leading-tight text-gray-500 bg-white border border-gray-300 hover:bg-gray-100 hover:text-gray-700 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white"} "..."]] + [:li + [:a {:href "#", :class "flex items-center justify-center px-3 py-2 text-sm leading-tight text-gray-500 bg-white border border-gray-300 hover:bg-gray-100 hover:text-gray-700 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white"} "100"]] + [:li + [:a {:href "#", :class "flex items-center justify-center h-full py-1.5 px-3 leading-tight text-gray-500 bg-white rounded-r-lg border border-gray-300 hover:bg-gray-100 hover:text-gray-700 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white"} + [:span {:class "sr-only"} "Next"] + [:svg {:class "w-5 h-5", :aria-hidden "true", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} + [:path {:fill-rule "evenodd", :d "M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z", :clip-rule "evenodd"}]]]]]]) diff --git a/src/clj/auto_ap/ssr/components/aside.clj b/src/clj/auto_ap/ssr/components/aside.clj new file mode 100644 index 00000000..bf630990 --- /dev/null +++ b/src/clj/auto_ap/ssr/components/aside.clj @@ -0,0 +1,202 @@ +(ns auto-ap.ssr.components.aside + (:require [auto-ap.ssr.svg :as svg] + [hiccup2.core :as hiccup])) + +(defn menu-button- [params & children] + [:a (-> params + (dissoc :icon) + (assoc :type "button",) + (update :class str " cursor-pointer flex items-center p-2 w-full text-sm text-gray-600 rounded-lg transition duration-75 group hover:bg-gray-100 dark:text-white dark:hover:bg-gray-700")) + + (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 (:data-collapse-toggle params) + [: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"}]])]) + +(defn sub-menu- [params & children] + [:ul {:id (:id params) :class "hidden py-2 space-y-2"} + (for [c children] + [:li + (update-in c [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")])]) + +(defn left-aside- [{:keys [nav page-specific]} & children] + [:aside {:id "left-nav", :class "fixed top-0 left-0 pt-16 z-20 w-64 h-screen transition-transform -translate-x-full lg:translate-x-0", :aria-labelledby "left-nav" :aria-hidden "true"} + + [:div {:class "overflow-y-auto py-5 px-3 h-full bg-gray-50 border-r border-gray-200 dark:bg-gray-800 dark:border-gray-700"} + nav + + + [:ul {:class "pt-5 mt-5 space-y-2 border-t border-gray-200 dark:border-gray-700"} + #_[:li + [:a {:href "#", :class "flex items-center p-2 text-base font-normal text-gray-900 rounded-lg transition duration-75 hover:bg-gray-100 dark:hover:bg-gray-700 dark:text-white group"} + [:svg {:aria-hidden "true", :class "flex-shrink-0 w-6 h-6 text-gray-400 transition duration-75 dark:text-gray-400 group-hover:text-gray-900 dark:group-hover:text-white", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} + [:path {:d "M9 2a1 1 0 000 2h2a1 1 0 100-2H9z"}] + [:path {:fill-rule "evenodd", :d "M4 5a2 2 0 012-2 3 3 0 003 3h2a3 3 0 003-3 2 2 0 012 2v11a2 2 0 01-2 2H6a2 2 0 01-2-2V5zm3 4a1 1 0 000 2h.01a1 1 0 100-2H7zm3 0a1 1 0 000 2h3a1 1 0 100-2h-3zm-3 4a1 1 0 100 2h.01a1 1 0 100-2H7zm3 0a1 1 0 100 2h3a1 1 0 100-2h-3z", :clip-rule "evenodd"}]] + [:span {:class "ml-3"} "Docs"]]] + #_[:li + [:a {:href "#", :class "flex items-center p-2 text-base font-normal text-gray-900 rounded-lg transition duration-75 hover:bg-gray-100 dark:hover:bg-gray-700 dark:text-white group"} + [:svg {:aria-hidden "true", :class "flex-shrink-0 w-6 h-6 text-gray-400 transition duration-75 dark:text-gray-400 group-hover:text-gray-900 dark:group-hover:text-white", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} + [:path {:d "M7 3a1 1 0 000 2h6a1 1 0 100-2H7zM4 7a1 1 0 011-1h10a1 1 0 110 2H5a1 1 0 01-1-1zM2 11a2 2 0 012-2h12a2 2 0 012 2v4a2 2 0 01-2 2H4a2 2 0 01-2-2v-4z"}]] + [:span {:class "ml-3"} "Components"]]] + #_[:li + [:a {:href "#", :class "flex items-center p-2 text-base font-normal text-gray-900 rounded-lg transition duration-75 hover:bg-gray-100 dark:hover:bg-gray-700 dark:text-white group"} + [:svg {:aria-hidden "true", :class "flex-shrink-0 w-6 h-6 text-gray-400 transition duration-75 dark:text-gray-400 group-hover:text-gray-900 dark:group-hover:text-white", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} + [:path {:fill-rule "evenodd", :d "M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-2 0c0 .993-.241 1.929-.668 2.754l-1.524-1.525a3.997 3.997 0 00.078-2.183l1.562-1.562C15.802 8.249 16 9.1 16 10zm-5.165 3.913l1.58 1.58A5.98 5.98 0 0110 16a5.976 5.976 0 01-2.516-.552l1.562-1.562a4.006 4.006 0 001.789.027zm-4.677-2.796a4.002 4.002 0 01-.041-2.08l-.08.08-1.53-1.533A5.98 5.98 0 004 10c0 .954.223 1.856.619 2.657l1.54-1.54zm1.088-6.45A5.974 5.974 0 0110 4c.954 0 1.856.223 2.657.619l-1.54 1.54a4.002 4.002 0 00-2.346.033L7.246 4.668zM12 10a2 2 0 11-4 0 2 2 0 014 0z", :clip-rule "evenodd"}]] + [:span {:class "ml-3"} "Help"]]]] + page-specific] + #_[:div {:class "hidden absolute bottom-0 left-0 justify-center p-4 space-x-4 w-full lg:flex bg-white dark:bg-gray-800 z-20 border-r border-gray-200 dark:border-gray-700"} + [:a {:href "#", :class "inline-flex justify-center p-2 text-gray-500 rounded cursor-pointer dark:text-gray-400 hover:text-gray-900 dark:hover:text-white hover:bg-gray-100 dark:hover:bg-gray-600"} + [:svg {:aria-hidden "true", :class "w-6 h-6", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} + [:path {:d "M5 4a1 1 0 00-2 0v7.268a2 2 0 000 3.464V16a1 1 0 102 0v-1.268a2 2 0 000-3.464V4zM11 4a1 1 0 10-2 0v1.268a2 2 0 000 3.464V16a1 1 0 102 0V8.732a2 2 0 000-3.464V4zM16 3a1 1 0 011 1v7.268a2 2 0 010 3.464V16a1 1 0 11-2 0v-1.268a2 2 0 010-3.464V4a1 1 0 011-1z"}]]] + [:a {:href "#", :data-tooltip-target "tooltip-settings", :class "inline-flex justify-center p-2 text-gray-500 rounded cursor-pointer dark:text-gray-400 dark:hover:text-white hover:text-gray-900 hover:bg-gray-100 dark:hover:bg-gray-600"} + [: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 "M11.49 3.17c-.38-1.56-2.6-1.56-2.98 0a1.532 1.532 0 01-2.286.948c-1.372-.836-2.942.734-2.106 2.106.54.886.061 2.042-.947 2.287-1.561.379-1.561 2.6 0 2.978a1.532 1.532 0 01.947 2.287c-.836 1.372.734 2.942 2.106 2.106a1.532 1.532 0 012.287.947c.379 1.561 2.6 1.561 2.978 0a1.533 1.533 0 012.287-.947c1.372.836 2.942-.734 2.106-2.106a1.533 1.533 0 01.947-2.287c1.561-.379 1.561-2.6 0-2.978a1.532 1.532 0 01-.947-2.287c.836-1.372-.734-2.942-2.106-2.106a1.532 1.532 0 01-2.287-.947zM10 13a3 3 0 100-6 3 3 0 000 6z", :clip-rule "evenodd"}]]] + [:div {:id "tooltip-settings", :role "tooltip", :class "inline-block absolute invisible z-10 py-2 px-3 text-sm font-medium text-white bg-gray-900 rounded-lg shadow-sm opacity-0 transition-opacity duration-300 tooltip"} "Settings page" + ] + [:button {:type "button", :data-dropdown-toggle "language-dropdown", :class "inline-flex justify-center p-2 text-gray-500 rounded cursor-pointer dark:hover:text-white dark:text-gray-400 hover:text-gray-900 hover:bg-gray-100 dark:hover:bg-gray-600"} + [:svg {:aria-hidden "true", :class "h-5 w-5 rounded-full mt-0.5", :xmlns "http://www.w3.org/2000/svg", :xmlns:xlink "http://www.w3.org/1999/xlink", :viewbox "0 0 3900 3900"} + [:path {:fill "#b22234", :d "M0 0h7410v3900H0z"}] + [:path {:d "M0 450h7410m0 600H0m0 600h7410m0 600H0m0 600h7410m0 600H0", :stroke "#fff", :stroke-width "300"}] + [:path {:fill "#3c3b6e", :d "M0 0h2964v2100H0z"}] + [:g {:fill "#fff"} + [:g {:id "d"} + [:g {:id "c"} + [:g {:id "e"} + [:g {:id "b"} + [:path {:id "a", :d "M247 90l70.534 217.082-184.66-134.164h228.253L176.466 307.082z"}] + [:use {:xlink:href "#a", :y "420"}] + [:use {:xlink:href "#a", :y "840"}] + [:use {:xlink:href "#a", :y "1260"}]] + [:use {:xlink:href "#a", :y "1680"}]] + [:use {:xlink:href "#b", :x "247", :y "210"}]] + [:use {:xlink:href "#c", :x "494"}]] + [:use {:xlink:href "#d", :x "988"}] + [:use {:xlink:href "#c", :x "1976"}] + [:use {:xlink:href "#e", :x "2470"}]]]] + [:div {:class "hidden z-50 my-4 text-base list-none bg-white rounded divide-y divide-gray-100 shadow dark:bg-gray-700", :id "language-dropdown"} + [:ul {:class "py-1", :role "none"} + [:li + [:a {:href "#", :class "block py-2 px-4 text-sm text-gray-700 hover:bg-gray-100 dark:hover:text-white dark:text-gray-300 dark:hover:bg-gray-600", :role "menuitem"} + [:div {:class "inline-flex items-center"} + [:svg {:aria-hidden "true", :class "h-3.5 w-3.5 rounded-full mr-2", :xmlns "http://www.w3.org/2000/svg", :id "flag-icon-css-us", :viewbox "0 0 512 512"} + [:g {:fill-rule "evenodd"} + [:g {:stroke-width "1pt"} + [:path {:fill "#bd3d44", :d "M0 0h247v10H0zm0 20h247v10H0zm0 20h247v10H0zm0 20h247v10H0zm0 20h247v10H0zm0 20h247v10H0zm0 20h247v10H0z", :transform "scale(3.9385)"}] + [:path {:fill "#fff", :d "M0 10h247v10H0zm0 20h247v10H0zm0 20h247v10H0zm0 20h247v10H0zm0 20h247v10H0zm0 20h247v10H0z", :transform "scale(3.9385)"}]] + [:path {:fill "#192f5d", :d "M0 0h98.8v70H0z", :transform "scale(3.9385)"}] + [:path {:fill "#fff", :d "M8.2 3l1 2.8H12L9.7 7.5l.9 2.7-2.4-1.7L6 10.2l.9-2.7-2.4-1.7h3zm16.5 0l.9 2.8h2.9l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm16.5 0l.9 2.8H45l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm16.4 0l1 2.8h2.8l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h3zm16.5 0l.9 2.8h2.9l-2.4 1.7 1 2.7L74 8.5l-2.3 1.7.9-2.7-2.4-1.7h2.9zm16.5 0l.9 2.8h2.9L92 7.5l1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm-74.1 7l.9 2.8h2.9l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm16.4 0l1 2.8h2.8l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h3zm16.5 0l.9 2.8h2.9l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm16.5 0l.9 2.8h2.9l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7H65zm16.4 0l1 2.8H86l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h3zm-74 7l.8 2.8h3l-2.4 1.7.9 2.7-2.4-1.7L6 24.2l.9-2.7-2.4-1.7h3zm16.4 0l.9 2.8h2.9l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h2.9zm16.5 0l.9 2.8H45l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm16.4 0l1 2.8h2.8l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h3zm16.5 0l.9 2.8h2.9l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h2.9zm16.5 0l.9 2.8h2.9L92 21.5l1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm-74.1 7l.9 2.8h2.9l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm16.4 0l1 2.8h2.8l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h3zm16.5 0l.9 2.8h2.9l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h2.9zm16.5 0l.9 2.8h2.9l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7H65zm16.4 0l1 2.8H86l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h3zm-74 7l.8 2.8h3l-2.4 1.7.9 2.7-2.4-1.7L6 38.2l.9-2.7-2.4-1.7h3zm16.4 0l.9 2.8h2.9l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h2.9zm16.5 0l.9 2.8H45l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm16.4 0l1 2.8h2.8l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h3zm16.5 0l.9 2.8h2.9l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h2.9zm16.5 0l.9 2.8h2.9L92 35.5l1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm-74.1 7l.9 2.8h2.9l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm16.4 0l1 2.8h2.8l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h3zm16.5 0l.9 2.8h2.9l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h2.9zm16.5 0l.9 2.8h2.9l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7H65zm16.4 0l1 2.8H86l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h3zm-74 7l.8 2.8h3l-2.4 1.7.9 2.7-2.4-1.7L6 52.2l.9-2.7-2.4-1.7h3zm16.4 0l.9 2.8h2.9l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h2.9zm16.5 0l.9 2.8H45l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm16.4 0l1 2.8h2.8l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h3zm16.5 0l.9 2.8h2.9l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h2.9zm16.5 0l.9 2.8h2.9L92 49.5l1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm-74.1 7l.9 2.8h2.9l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm16.4 0l1 2.8h2.8l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h3zm16.5 0l.9 2.8h2.9l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h2.9zm16.5 0l.9 2.8h2.9l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7H65zm16.4 0l1 2.8H86l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h3zm-74 7l.8 2.8h3l-2.4 1.7.9 2.7-2.4-1.7L6 66.2l.9-2.7-2.4-1.7h3zm16.4 0l.9 2.8h2.9l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h2.9zm16.5 0l.9 2.8H45l-2.4 1.7 1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9zm16.4 0l1 2.8h2.8l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h3zm16.5 0l.9 2.8h2.9l-2.3 1.7.9 2.7-2.4-1.7-2.3 1.7.9-2.7-2.4-1.7h2.9zm16.5 0l.9 2.8h2.9L92 63.5l1 2.7-2.4-1.7-2.4 1.7 1-2.7-2.4-1.7h2.9z", :transform "scale(3.9385)"}]]]" \n English (US)"]]] + [:li + [:a {:href "#", :class "block py-2 px-4 text-sm text-gray-700 hover:bg-gray-100 dark:text-gray-300 dark:hover:text-white dark:hover:bg-gray-600", :role "menuitem"} + [:div {:class "inline-flex items-center"} + [:svg {:aria-hidden "true", :class "h-3.5 w-3.5 rounded-full mr-2", :xmlns "http://www.w3.org/2000/svg", :id "flag-icon-css-de", :viewbox "0 0 512 512"} + [:path {:fill "#ffce00", :d "M0 341.3h512V512H0z"}] + [:path {:d "M0 0h512v170.7H0z"}] + [:path {:fill "#d00", :d "M0 170.7h512v170.6H0z"}]]]]] + [:li + [:a {:href "#", :class "block py-2 px-4 text-sm text-gray-700 hover:bg-gray-100 dark:text-gray-300 dark:hover:text-white dark:hover:bg-gray-600", :role "menuitem"} + [:div {:class "inline-flex items-center"} + [:svg {:aria-hidden "true", :class "h-3.5 w-3.5 rounded-full mr-2", :xmlns "http://www.w3.org/2000/svg", :id "flag-icon-css-it", :viewbox "0 0 512 512"} + [:g {:fill-rule "evenodd", :stroke-width "1pt"} + [:path {:fill "#fff", :d "M0 0h512v512H0z"}] + [:path {:fill "#009246", :d "M0 0h170.7v512H0z"}] + [:path {:fill "#ce2b37", :d "M341.3 0H512v512H341.3z"}]]]]]] + [:li + [:a {:href "#", :class "block py-2 px-4 text-sm text-gray-700 hover:bg-gray-100 dark:hover:text-white dark:text-gray-300 dark:hover:bg-gray-600", :role "menuitem"} + [:div {:class "inline-flex items-center"} + [:svg {:aria-hidden "true", :class "h-3.5 w-3.5 rounded-full mr-2", :xmlns "http://www.w3.org/2000/svg", :xmlns:xlink "http://www.w3.org/1999/xlink", :id "flag-icon-css-cn", :viewbox "0 0 512 512"} + [:defs + [:path {:id "a", :fill "#ffde00", :d "M1-.3L-.7.8 0-1 .6.8-1-.3z"}]] + [:path {:fill "#de2910", :d "M0 0h512v512H0z"}] + [:use {:width "30", :height "20", :transform "matrix(76.8 0 0 76.8 128 128)", :xlink:href "#a"}] + [:use {:width "30", :height "20", :transform "rotate(-121 142.6 -47) scale(25.5827)", :xlink:href "#a"}] + [:use {:width "30", :height "20", :transform "rotate(-98.1 198 -82) scale(25.6)", :xlink:href "#a"}] + [:use {:width "30", :height "20", :transform "rotate(-74 272.4 -114) scale(25.6137)", :xlink:href "#a"}] + [:use {:width "30", :height "20", :transform "matrix(16 -19.968 19.968 16 256 230.4)", :xlink:href "#a"}]]"中文 (繁體)"]]]]]]]) + +(defn main-aside-nav- [] + [:ul {:class "space-y-2"} + + [:li + (menu-button- {:icon svg/pie} + "Dashboard")] + [:li + (menu-button- {:aria-controls "dropdown-invoices", + :data-collapse-toggle "dropdown-invoices" + :icon svg/accounting-invoice-mail} + "Invoices") + (sub-menu- {:id "dropdown-invoices"} + (menu-button- {:href "http://google.com"} + "All") + (menu-button- {:href "http://google.com"} + "Paid") + (menu-button- {:href "http://google.com"} + "Unpaid") + (menu-button- {:href "http://google.com"} + "Voided")) + ] + [:li + (menu-button- {:aria-controls "dropdown-sales", + :data-collapse-toggle "dropdown-sales" + :icon svg/receipt-register-1} + "Sales") + (sub-menu- {:id "dropdown-sales"} + (menu-button- {:href "Sales"} "Sales") + (menu-button- {:href "Sales"} "Expected Deposits") + (menu-button- {:href "Sales"} "Cash Shifts") + (menu-button- {:href "Sales"} "Tenders"))] + [:li + (menu-button- {:aria-controls "dropdown-payments" + :data-collapse-toggle "dropdown-payments" + :icon svg/payments} + "Payments") + (sub-menu- {:id "dropdown-payments"} + (menu-button- {:href "Sales"} "All") + (menu-button- {:href "Sales"} "Pending") + (menu-button- {:href "Sales"} "Cleared") + (menu-button- {:href "Sales"} "Voided"))] + + [:li + (menu-button- {:aria-controls "dropdown-transactions" + :data-collapse-toggle "dropdown-transactions" + :icon svg/bank} + "Transactions") + + (sub-menu- {:id "dropdown-transactions"} + (menu-button- {:href "Sales"} "All") + (menu-button- {:href "Sales"} "Unapproved") + (menu-button- {:href "Sales"} "Client Review") + (menu-button- {:href "Sales"} "Approved") + (menu-button- {:href "Sales"} "Insights"))] + [:li + (menu-button- {:aria-controls "dropdown-ledger" + :data-collapse-toggle "dropdown-ledger" + :icon svg/receipt} + "Ledger") + (sub-menu- {:id "dropdown-ledger"} + (menu-button- {:href "Sales"} "Register") + (menu-button- {:href "Sales"} "Profit & Loss") + (menu-button- {:href "Sales"} "Profit & Loss Detail") + (menu-button- {:href "Sales"} "Cash Flows") + (menu-button- {:href "Sales"} "Balance Sheet") + (menu-button- {:href "Sales"} "External Ledger Import"))]]) + +(defn company-aside-nav- [] + [:ul {:class "space-y-2"} + + [:li + (menu-button- {:icon svg/report} + "Reports")] + [:li + (menu-button- {:icon svg/bank} + "Yodlee Link")] + [:li + (menu-button- {:icon svg/vendors} + "Vendors")] + + [:li + (menu-button- {:icon svg/government-building} + "1099 Vendor Info")]]) diff --git a/src/clj/auto_ap/ssr/components/breadcrumbs.clj b/src/clj/auto_ap/ssr/components/breadcrumbs.clj new file mode 100644 index 00000000..3cbaf6aa --- /dev/null +++ b/src/clj/auto_ap/ssr/components/breadcrumbs.clj @@ -0,0 +1,22 @@ +(ns auto-ap.ssr.components.breadcrumbs + (:require [auto-ap.ssr.svg :as svg])) + +(defn breadcrumbs- [params & steps] + [:div {:class "inline-flex px-5 py-3 text-gray-700 border border-gray-200 rounded-lg bg-white dark:bg-gray-800 dark:border-gray-700"} + [:ul {:class "inline-flex items-center space-x-1 md:space-x-3"} + [:li {:class "inline-flex items-center"} + [:a {:href "#", :class "inline-flex w-4 h-4 mr-2 items-center text-sm font-medium text-gray-700 hover:text-blue-600 dark:text-gray-400 dark:hover:text-white"} + [:div.w-4.h-4 svg/home]]] + (for [p steps] + [:li + [:div {:class "flex items-center"} + + [:div {:class "w-6 h-6 text-gray-400",} + svg/breadcrumb-component] + + (update-in p [1 :class] str " ml-1 text-sm font-medium text-gray-700 hover:text-blue-600 md:ml-2 dark:text-gray-400 dark:hover:text-white")]]) + #_[:li {:aria-current "page"} + [:div {:class "flex items-center"} + [:svg {:aria-hidden "true", :class "w-6 h-6 text-gray-400", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} + [:path {:fill-rule "evenodd", :d "M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z", :clip-rule "evenodd"}]] + [:span {:class "ml-1 text-sm font-medium text-gray-500 md:ml-2 dark:text-gray-400"} "Flowbite"]]]]]) diff --git a/src/clj/auto_ap/ssr/components/buttons.clj b/src/clj/auto_ap/ssr/components/buttons.clj new file mode 100644 index 00000000..36f83a12 --- /dev/null +++ b/src/clj/auto_ap/ssr/components/buttons.clj @@ -0,0 +1,26 @@ +(ns auto-ap.ssr.components.buttons + (:require [auto-ap.ssr.svg :as svg])) + +(defn button-icon- [_ i] + [:div.h-4.w-4 i]) + +(defn button- [params & children] + [:button { :class (cond-> "text-white focus:ring-4 font-bold rounded-lg text-sm px-5 py-2.5 text-center mr-2 inline-flex items-center hover:scale-105 transition duration-100 justify-center" + (= :secondary (:color params)) (str " bg-blue-500 hover:bg-blue-600 focus:ring-blue-300 dark:bg-blue-600 dark:hover:bg-blue-700") + (= :primary (:color params)) (str " bg-green-500 hover:bg-green-600 focus:ring-green-300 dark:bg-green-600 dark:hover:bg-green-700 "))} + [:div.htmx-indicator.flex.items-center + (svg/spinner {:class "inline w-4 h-4 text-white"}) + [:div.ml-3 "Loading..."]] + (into [:div.htmx-indicator-hidden.inline-flex.gap-2.items-center.justify-center ] children)]) + +(defn icon-button- [params & children] + (into + [:button (update params :class str " inline-flex items-center justify-center bg-white dark:bg-gray-600 items-center p-3 text-sm font-medium border border-gray-300 dark:border-gray-700 text-center text-gray-500 hover:text-gray-800 rounded-lg dark:text-gray-400 dark:hover:text-gray-100") + [:div.h-4.w-4 children]])) + +(defn save-button- [params & children] + [:button { :class "text-white bg-green-500 hover:bg-green-700 focus:ring-4 focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center mr-2 dark:bg-green-600 dark:hover:bg-green-700 dark:focus:ring-green-800 inline-flex items-center hover:scale-105 transition duration-300"} + [:div.htmx-indicator.flex.items-center + (svg/spinner {:class "inline w-4 h-4 text-white"}) + [:div.ml-3 "Loading..."]] + (into [:div.htmx-indicator-hidden ] children)]) diff --git a/src/clj/auto_ap/ssr/components/card.clj b/src/clj/auto_ap/ssr/components/card.clj new file mode 100644 index 00000000..64a59bfd --- /dev/null +++ b/src/clj/auto_ap/ssr/components/card.clj @@ -0,0 +1,8 @@ +(ns auto-ap.ssr.components.card) + +(defn content-card- [params & children] + [:section {:class " py-3 sm:py-5"} + [:div {:class "max-w-screen-2xl"} + (into + [:div {:class "relative overflow-hidden shadow-md dark:bg-gray-800 sm:rounded-lg border-2 border-gray-200 dark:border-gray-900 bg-white"}] + children)]]) diff --git a/src/clj/auto_ap/ssr/components/data_grid.clj b/src/clj/auto_ap/ssr/components/data_grid.clj new file mode 100644 index 00000000..f6e33b9e --- /dev/null +++ b/src/clj/auto_ap/ssr/components/data_grid.clj @@ -0,0 +1,34 @@ +(ns auto-ap.ssr.components.data-grid) + +(defn header- [params & rest] + (into [:th.px-4.py-3 {:scope "col" :class (:class params)} ] rest)) + + +(defn row- [params & rest] + (into [:tr {:class (cond-> "border-b dark:border-gray-600 hover:bg-gray-100 dark:hover:bg-gray-700" + + (:class params) (str " " (:class params)))}] rest)) + +(defn cell- [params & rest] + (into [:td.px-4.py-2 {:class (:class params)}] rest)) + +(defn right-stack-cell- [params & rest] + (cell- params (into [:div.flex.flex-row-reverse.items-center.justify-between + rest])) + ) + +(defn checkbox-header- [params & rest] + [:th {:scope "col", :class "p-4"} + [:div {:class "flex items-center"} + [:input {:id "checkbox-all", :type "checkbox", :class "w-4 h-4 bg-gray-100 border-gray-300 rounded text-primary-600 focus:ring-primary-500 dark:focus:ring-primary-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600"}] + [:label {:for "checkbox-all", :class "sr-only"} "checkbox"]]]) + +(defn data-grid- [{:keys [headers]} & rest] + [:table {:class "w-full text-sm text-left text-gray-500 dark:text-gray-400"} + [:thead {:class "text-xs text-gray-800 uppercase bg-gray-50 dark:bg-gray-700 dark:text-gray-400"} + (into + [:tr] + headers)] + (into + [:tbody] + rest)]) diff --git a/src/clj/auto_ap/ssr/components/dialog.clj b/src/clj/auto_ap/ssr/components/dialog.clj new file mode 100644 index 00000000..cc293b3c --- /dev/null +++ b/src/clj/auto_ap/ssr/components/dialog.clj @@ -0,0 +1,8 @@ +(ns auto-ap.ssr.components.dialog) + +(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 {:class "flex items-start justify-between p-4 border-b rounded-t dark:border-gray-600"} header] + [:div {:class "p-6 space-y-6"} + content] + [:div footer]]) diff --git a/src/clj/auto_ap/ssr/components/inputs.clj b/src/clj/auto_ap/ssr/components/inputs.clj new file mode 100644 index 00000000..54e767f9 --- /dev/null +++ b/src/clj/auto_ap/ssr/components/inputs.clj @@ -0,0 +1,27 @@ +(ns auto-ap.ssr.components.inputs) + +(defn select- [params & children] + (into + [:select {: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" + :name (:name params)} + (cond->> + (map (fn [[k v]] + [:option {:value k :selected (= v (:value params))} v]) + (:options params)) + (:allow-blank? params) (conj [:option {:value "" :selected (not (:value params))} ""]))] + children)) + +(defn text-input- [params] + [:input + {:type "text" + :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" + :autofocus (:autofocus params) + :name (:name params) + :placeholder (:placeholder params) + :value (:value params)}]) + +(defn field- [params & rest] + (into + [:div + [:label {:class "block mb-2 text-sm font-medium text-gray-900 dark:text-white"} (:label params)]] + rest)) diff --git a/src/clj/auto_ap/ssr/components/navbar.clj b/src/clj/auto_ap/ssr/components/navbar.clj new file mode 100644 index 00000000..924ec0a5 --- /dev/null +++ b/src/clj/auto_ap/ssr/components/navbar.clj @@ -0,0 +1,110 @@ +(ns auto-ap.ssr.components.navbar + (:require [auto-ap.ssr.components.buttons :refer [icon-button-]] + [auto-ap.ssr.svg :as svg] + [hiccup2.core :as hiccup])) + +(defn navbar- [] + [:nav {:class "fixed z-30 w-full bg-white border-b border-gray-200 dark:bg-gray-800 dark:border-gray-700"} + [:div {:class "px-3 py-3 lg:px-5 lg:pl-3"} + [:div {:class "flex items-center justify-between"} + [:div {:class "flex items-center justify-start"} + [:button { :aria-controls "left-nav", :id "left-nav-toggle" :type "button", :class "inline-flex items-center p-2 mt-2 ml-2 mr-2 text-sm text-gray-500 rounded-lg hover:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-gray-200 dark:text-gray-400 dark:hover:bg-gray-700 dark:focus:ring-gray-600"} + [:span {:class "sr-only"} "Open sidebar"] + [:svg {:class "w-6 h-6", :aria-hidden "true", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} + [:path {:clip-rule "evenodd", :fill-rule "evenodd", :d "M2 4.75A.75.75 0 012.75 4h14.5a.75.75 0 010 1.5H2.75A.75.75 0 012 4.75zm0 10.5a.75.75 0 01.75-.75h7.5a.75.75 0 010 1.5h-7.5a.75.75 0 01-.75-.75zM2 10a.75.75 0 01.75-.75h14.5a.75.75 0 010 1.5H2.75A.75.75 0 012 10z"}]]] + [: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"}] + ] + [:form {:action "#", :method "GET", :class "hidden lg:block lg:pl-3.5"} + [:label {:for "topbar-search", :class "sr-only"} "Search"] + [:div {:class "relative mt-1 lg:w-96"} + [:div {:class "absolute inset-y-0 left-0 flex items-center pl-3 pointer-events-none"} + [: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"} + [: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"}]]] + [: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 {:class "flex items-center gap-4"} + [:div {:class "hidden mr-3 -mb-1 sm:block"} + [: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"} + [:span {:class "sr-only"} "Search"] + [:svg {:class "w-6 h-6", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} + [: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"}]]] + + + (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"} + [: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"} + [:path {:d "M5 3a2 2 0 00-2 2v2a2 2 0 002 2h2a2 2 0 002-2V5a2 2 0 00-2-2H5zM5 11a2 2 0 00-2 2v2a2 2 0 002 2h2a2 2 0 002-2v-2a2 2 0 00-2-2H5zM11 5a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2V5zM11 13a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2v-2z"}]]] + #_(com/icon-button {} + [:div.w-4.h-4 svg/search]) + [:div {:class "z-20 z-50 max-w-sm my-4 overflow-hidden text-base list-none bg-white divide-y divide-gray-100 rounded shadow-lg dark:bg-gray-700 dark:divide-gray-600 hidden", :id "apps-dropdown", :style "position: absolute; inset: 0px auto auto 0px; margin: 0px; transform: translate(1545px, 65px);", :data-popper-placement "bottom"} + [:div {:class "block px-4 py-2 text-base font-medium text-center text-gray-700 bg-gray-50 dark:bg-gray-700 dark:text-gray-400"} ] + [:div {:class "grid grid-cols-3 gap-4 p-4"} + [:a {:href "#", :class "block p-4 text-center rounded-lg hover:bg-gray-100 dark:hover:bg-gray-600"} + [:svg {:class "mx-auto mb-1 text-gray-500 w-7 h-7 dark:text-gray-400", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} + [:path {:fill-rule "evenodd", :d "M10 2a4 4 0 00-4 4v1H5a1 1 0 00-.994.89l-1 9A1 1 0 004 18h12a1 1 0 00.994-1.11l-1-9A1 1 0 0015 7h-1V6a4 4 0 00-4-4zm2 5V6a2 2 0 10-4 0v1h4zm-6 3a1 1 0 112 0 1 1 0 01-2 0zm7-1a1 1 0 100 2 1 1 0 000-2z", :clip-rule "evenodd"}]] + [:div {:class "text-sm font-medium text-gray-900 dark:text-white"} "Sales"]] + [:a {:href "#", :class "block p-4 text-center rounded-lg hover:bg-gray-100 dark:hover:bg-gray-600"} + [:svg {:class "mx-auto mb-1 text-gray-500 w-7 h-7 dark:text-gray-400", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} + [:path {:d "M13 6a3 3 0 11-6 0 3 3 0 016 0zM18 8a2 2 0 11-4 0 2 2 0 014 0zM14 15a4 4 0 00-8 0v3h8v-3zM6 8a2 2 0 11-4 0 2 2 0 014 0zM16 18v-3a5.972 5.972 0 00-.75-2.906A3.005 3.005 0 0119 15v3h-3zM4.75 12.094A5.973 5.973 0 004 15v3H1v-3a3 3 0 013.75-2.906z"}]] + [:div {:class "text-sm font-medium text-gray-900 dark:text-white"} "Users"]] + [:a {:href "#", :class "block p-4 text-center rounded-lg hover:bg-gray-100 dark:hover:bg-gray-600"} + [:svg {:class "mx-auto mb-1 text-gray-500 w-7 h-7 dark:text-gray-400", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} + [:path {:fill-rule "evenodd", :d "M5 3a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2V5a2 2 0 00-2-2H5zm0 2h10v7h-2l-1 2H8l-1-2H5V5z", :clip-rule "evenodd"}]] + [:div {:class "text-sm font-medium text-gray-900 dark:text-white"} "Inbox"]] + [:a {:href "#", :class "block p-4 text-center rounded-lg hover:bg-gray-100 dark:hover:bg-gray-600"} + [:svg {:class "mx-auto mb-1 text-gray-500 w-7 h-7 dark:text-gray-400", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} + [:path {:fill-rule "evenodd", :d "M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-6-3a2 2 0 11-4 0 2 2 0 014 0zm-2 4a5 5 0 00-4.546 2.916A5.986 5.986 0 0010 16a5.986 5.986 0 004.546-2.084A5 5 0 0010 11z", :clip-rule "evenodd"}]] + [:div {:class "text-sm font-medium text-gray-900 dark:text-white"} "Profile"]] + [:a {:href "#", :class "block p-4 text-center rounded-lg hover:bg-gray-100 dark:hover:bg-gray-600"} + [:svg {:class "mx-auto mb-1 text-gray-500 w-7 h-7 dark:text-gray-400", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} + [:path {:fill-rule "evenodd", :d "M11.49 3.17c-.38-1.56-2.6-1.56-2.98 0a1.532 1.532 0 01-2.286.948c-1.372-.836-2.942.734-2.106 2.106.54.886.061 2.042-.947 2.287-1.561.379-1.561 2.6 0 2.978a1.532 1.532 0 01.947 2.287c-.836 1.372.734 2.942 2.106 2.106a1.532 1.532 0 012.287.947c.379 1.561 2.6 1.561 2.978 0a1.533 1.533 0 012.287-.947c1.372.836 2.942-.734 2.106-2.106a1.533 1.533 0 01.947-2.287c1.561-.379 1.561-2.6 0-2.978a1.532 1.532 0 01-.947-2.287c.836-1.372-.734-2.942-2.106-2.106a1.532 1.532 0 01-2.287-.947zM10 13a3 3 0 100-6 3 3 0 000 6z", :clip-rule "evenodd"}]] + [:div {:class "text-sm font-medium text-gray-900 dark:text-white"} "Settings"]] + [:a {:href "#", :class "block p-4 text-center rounded-lg hover:bg-gray-100 dark:hover:bg-gray-600"} + [:svg {:class "mx-auto mb-1 text-gray-500 w-7 h-7 dark:text-gray-400", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} + [:path {:d "M4 3a2 2 0 100 4h12a2 2 0 100-4H4z"}] + [:path {:fill-rule "evenodd", :d "M3 8h14v7a2 2 0 01-2 2H5a2 2 0 01-2-2V8zm5 3a1 1 0 011-1h2a1 1 0 110 2H9a1 1 0 01-1-1z", :clip-rule "evenodd"}]] + [:div {:class "text-sm font-medium text-gray-900 dark:text-white"} "Products"]] + [:a {:href "#", :class "block p-4 text-center rounded-lg hover:bg-gray-100 dark:hover:bg-gray-600"} + [:svg {:class "mx-auto mb-1 text-gray-500 w-7 h-7 dark:text-gray-400", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} + [:path {:d "M8.433 7.418c.155-.103.346-.196.567-.267v1.698a2.305 2.305 0 01-.567-.267C8.07 8.34 8 8.114 8 8c0-.114.07-.34.433-.582zM11 12.849v-1.698c.22.071.412.164.567.267.364.243.433.468.433.582 0 .114-.07.34-.433.582a2.305 2.305 0 01-.567.267z"}] + [:path {:fill-rule "evenodd", :d "M10 18a8 8 0 100-16 8 8 0 000 16zm1-13a1 1 0 10-2 0v.092a4.535 4.535 0 00-1.676.662C6.602 6.234 6 7.009 6 8c0 .99.602 1.765 1.324 2.246.48.32 1.054.545 1.676.662v1.941c-.391-.127-.68-.317-.843-.504a1 1 0 10-1.51 1.31c.562.649 1.413 1.076 2.353 1.253V15a1 1 0 102 0v-.092a4.535 4.535 0 001.676-.662C13.398 13.766 14 12.991 14 12c0-.99-.602-1.765-1.324-2.246A4.535 4.535 0 0011 9.092V7.151c.391.127.68.317.843.504a1 1 0 101.511-1.31c-.563-.649-1.413-1.076-2.354-1.253V5z", :clip-rule "evenodd"}]] + [:div {:class "text-sm font-medium text-gray-900 dark:text-white"} "Pricing"]] + [:a {:href "#", :class "block p-4 text-center rounded-lg hover:bg-gray-100 dark:hover:bg-gray-600"} + [:svg {:class "mx-auto mb-1 text-gray-500 w-7 h-7 dark:text-gray-400", :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} + [:path {:fill-rule "evenodd", :d "M5 2a2 2 0 00-2 2v14l3.5-2 3.5 2 3.5-2 3.5 2V4a2 2 0 00-2-2H5zm2.5 3a1.5 1.5 0 100 3 1.5 1.5 0 000-3zm6.207.293a1 1 0 00-1.414 0l-6 6a1 1 0 101.414 1.414l6-6a1 1 0 000-1.414zM12.5 10a1.5 1.5 0 100 3 1.5 1.5 0 000-3z", :clip-rule "evenodd"}]] + [:div {:class "text-sm font-medium text-gray-900 dark:text-white"} "Billing"]] + [:a {:href "#", :class "block p-4 text-center rounded-lg hover:bg-gray-100 dark:hover:bg-gray-600"} + [:svg {:class "mx-auto mb-1 text-gray-500 w-7 h-7 dark:text-gray-400", :fill "none", :stroke "currentColor", :viewbox "0 0 24 24", :xmlns "http://www.w3.org/2000/svg"} + [:path {:stroke-linecap "round", :stroke-linejoin "round", :stroke-width "2", :d "M11 16l-4-4m0 0l4-4m-4 4h14m-5 4v1a3 3 0 01-3 3H6a3 3 0 01-3-3V7a3 3 0 013-3h7a3 3 0 013 3v1"}]] + [:div {:class "text-sm font-medium text-gray-900 dark:text-white"} "Logout"]]]] + (icon-button- {"_" (hiccup/raw "on click toggle .dark on ")} + [:div.h-4.w-4 + [:div.hidden.dark:block svg/sun] + [:div.dark:hidden svg/moon] + ]) + #_[:button {:id "theme-toggle", :data-tooltip-target "tooltip-toggle", :type "button", :class "text-gray-500 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-700 focus:outline-none focus:ring-4 focus:ring-gray-200 dark:focus:ring-gray-700 rounded-lg text-sm p-2.5" + } + ] + [:div {:id "tooltip-toggle", :role "tooltip", :class "absolute z-10 inline-block px-3 py-2 text-sm font-medium text-white transition-opacity duration-300 bg-gray-900 rounded-lg shadow-sm tooltip opacity-0 invisible", :style "position: absolute; inset: 0px auto auto 0px; margin: 0px; transform: translate(2326px, 63px);", :data-popper-placement "bottom"} [:img {:src "https://flowbite.com/docs/images/people/profile-picture-5.jpg"}] + [:div {:class "tooltip-arrow", :data-popper-arrow "data-popper-arrow", :style "position: absolute; left: 0px; transform: translate(69px);"}]] + [:div {:class "flex items-center ml-3"} + [:div + [:button {:type "button", :class "flex text-sm bg-gray-800 rounded-full focus:ring-4 focus:ring-gray-300 dark:focus:ring-gray-600", :id "user-menu-button-2", :aria-expanded "false", :data-dropdown-toggle "dropdown-2"} + [:span {:class "sr-only"} "Open user menu"] + [:img {:class "w-8 h-8 rounded-full", :src "https://flowbite.com/docs/images/people/profile-picture-5.jpg", :alt "user photo"}]]] + [:div {:class "z-50 hidden my-4 text-base list-none bg-white divide-y divide-gray-100 rounded shadow dark:bg-gray-700 dark:divide-gray-600", :id "dropdown-2", :style "position: absolute; inset: 0px auto auto 0px; margin: 0px; transform: translate(2446px, 61px);", :data-popper-placement "bottom"} + [:div {:class "px-4 py-3", :role "none"} + [:p {:class "text-sm text-gray-900 dark:text-white", :role "none"} "Neil Sims"] + [:p {:class "text-sm font-medium text-gray-900 truncate dark:text-gray-300", :role "none"} "neil.sims@flowbite.com"]] + [:ul {:class "py-1", :role "none"} + [:li + [:a {:href "#", :class "block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 dark:text-gray-300 dark:hover:bg-gray-600 dark:hover:text-white", :role "menuitem"} "Dashboard"]] + [:li + [:a {:href "#", :class "block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 dark:text-gray-300 dark:hover:bg-gray-600 dark:hover:text-white", :role "menuitem"} "Settings"]] + [:li + [:a {:href "#", :class "block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 dark:text-gray-300 dark:hover:bg-gray-600 dark:hover:text-white", :role "menuitem"} "Earnings"]] + [:li + [:a {:href "#", :class "block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 dark:text-gray-300 dark:hover:bg-gray-600 dark:hover:text-white", :role "menuitem"} "Sign out"]]]]]]]]]) diff --git a/src/clj/auto_ap/ssr/components/page.clj b/src/clj/auto_ap/ssr/components/page.clj new file mode 100644 index 00000000..2f588073 --- /dev/null +++ b/src/clj/auto_ap/ssr/components/page.clj @@ -0,0 +1,20 @@ +(ns auto-ap.ssr.components.page + (:require [auto-ap.ssr.components.navbar :refer [navbar-]] + [auto-ap.ssr.components.aside :refer [left-aside-]])) + +(defn page- [{:keys [nav page-specific]} & children] + [:div#app + (navbar-) + [:div.flex.pt-16.overflow-hidden + (left-aside- {:nav nav + :page-specific page-specific}) + + [:div#main-content {:class "relative w-full h-full lg:pl-64 overflow-y-auto px-4 bg-gray-100 dark:bg-gray-900"} + (into + [:div.p-4] + children)]] + [:div#modal-holder.hidden + [: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#modal-content ]]] + [:div {:class "bg-gray-900 bg-opacity-50 dark:bg-opacity-80 fixed inset-0 z-40"}]]]) diff --git a/src/clj/auto_ap/ssr/svg.clj b/src/clj/auto_ap/ssr/svg.clj index c996ecff..a157b6b9 100644 --- a/src/clj/auto_ap/ssr/svg.clj +++ b/src/clj/auto_ap/ssr/svg.clj @@ -94,3 +94,49 @@ (def breadcrumb-component [:svg { :fill "currentColor", :viewbox "0 0 20 20", :xmlns "http://www.w3.org/2000/svg"} [:path {:fill-rule "evenodd", :d "M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z", :clip-rule "evenodd"}]]) + +(def refresh + [:svg {:xmlns "http://www.w3.org/2000/svg", :aria-hidden "true", :fill "none", :viewbox "0 0 24 24", :stroke-width "1.5", :stroke "currentColor"} + [:path {:stroke-linecap "round", :stroke-linejoin "round", :d "M16.023 9.348h4.992v-.001M2.985 19.644v-4.992m0 0h4.992m-4.993 0l3.181 3.183a8.25 8.25 0 0013.803-3.7M4.031 9.865a8.25 8.25 0 0113.803-3.7l3.181 3.182m0-4.991v4.99"}]]) + + +(def upload + [:svg { :xmlns "http://www.w3.org/2000/svg", :fill "none", :viewbox "0 0 24 24", :stroke-width "2", :stroke "currentColor", :aria-hidden "true"} + [:path {:stroke-linecap "round", :stroke-linejoin "round", :d "M3 16.5v2.25A2.25 2.25 0 005.25 21h13.5A2.25 2.25 0 0021 18.75V16.5m-13.5-9L12 3m0 0l4.5 4.5M12 3v13.5"}]]) + +(def vendors + [:svg {:xmlns "http://www.w3.org/2000/svg", :viewbox "0 0 24 24"} + [:defs] + [:title "messages-people-user-dollar"] + [:circle {:cx "4.5", :cy "6.75", :r "3", :fill "none", :stroke "currentColor", :stroke-linecap "round", :stroke-linejoin "round", :stroke-width "1.5px"}] + [:path {:d "M8.25,17.25V15a3.75,3.75,0,0,0-7.5,0v2.25h1.5l.75,6H6l.75-6Z", :fill "none", :stroke "currentColor", :stroke-linecap "round", :stroke-linejoin "round", :stroke-width "1.5px"}] + [:path {:d "M17.625,5.25H15a1.341,1.341,0,0,0-.5,2.587l2.654.826a1.341,1.341,0,0,1-.5,2.587H13.5", :fill "none", :stroke "currentColor", :stroke-linecap "round", :stroke-linejoin "round", :stroke-width "1.5px"}] + [:line {:stroke "currentColor", :fill "none", :stroke-linejoin "round", :y1 "5.25", :stroke-linecap "round", :stroke-width "1.5px", :x1 "15.75", :y2 "3.75", :x2 "15.75"}] + [:line {:stroke "currentColor", :fill "none", :stroke-linejoin "round", :y1 "12.75", :stroke-linecap "round", :stroke-width "1.5px", :x1 "15.75", :y2 "11.25", :x2 "15.75"}] + [:path {:d "M11.251,15.748h3v4.5l4.5-4.5h3a1.5,1.5,0,0,0,1.5-1.5v-12a1.5,1.5,0,0,0-1.5-1.5h-12a1.5,1.5,0,0,0-1.5,1.5", :fill "none", :stroke "currentColor", :stroke-linecap "round", :stroke-linejoin "round", :stroke-width "1.5px"}]]) + +(def report + [:svg {:xmlns "http://www.w3.org/2000/svg", :viewbox "0 0 24 24"} + [:defs] + [:title "app-window-pie-chart"] + [:rect {:y "2.253", :rx "1.5", :stroke "currentColor", :fill "none", :stroke-linejoin "round", :width "21", :stroke-linecap "round", :stroke-width "1.5px", :x "1.51", :ry "1.5", :height "19.5"}] + [:line {:stroke "currentColor", :fill "none", :stroke-linejoin "round", :y1 "6.753", :stroke-linecap "round", :stroke-width "1.5px", :x1 "1.51", :y2 "6.753", :x2 "22.51"}] + [:circle {:cx "9.01", :cy "14.253", :r "4.5", :fill "none", :stroke "currentColor", :stroke-linecap "round", :stroke-linejoin "round", :stroke-width "1.5px"}] + [:polyline {:points "9.01 9.753 9.01 14.253 12.192 17.435", :fill "none", :stroke "currentColor", :stroke-linecap "round", :stroke-linejoin "round", :stroke-width "1.5px"}] + [:line {:stroke "currentColor", :fill "none", :stroke-linejoin "round", :y1 "11.253", :stroke-linecap "round", :stroke-width "1.5px", :x1 "16.51", :y2 "11.253", :x2 "19.51"}] + [:line {:stroke "currentColor", :fill "none", :stroke-linejoin "round", :y1 "14.253", :stroke-linecap "round", :stroke-width "1.5px", :x1 "16.51", :y2 "14.253", :x2 "19.51"}] + [:line {:stroke "currentColor", :fill "none", :stroke-linejoin "round", :y1 "17.253", :stroke-linecap "round", :stroke-width "1.5px", :x1 "16.51", :y2 "17.253", :x2 "19.51"}]]) + +(def government-building + [:svg {:xmlns "http://www.w3.org/2000/svg", :viewbox "0 0 24 24"} + [:g + [:rect {:y "14.25", :stroke "currentColor", :fill "none", :stroke-linejoin "round", :width "3", :stroke-linecap "round", :stroke-width "1.5px", :x "3.5", :height "6"}] + [:rect {:y "14.25", :stroke "currentColor", :fill "none", :stroke-linejoin "round", :width "3", :stroke-linecap "round", :stroke-width "1.5px", :x "10.5", :height "6"}] + [:rect {:y "14.25", :stroke "currentColor", :fill "none", :stroke-linejoin "round", :width "3", :stroke-linecap "round", :stroke-width "1.5px", :x "17.5", :height "6"}] + [:path {:d "M21.75,13.39a.87.87,0,0,1-.86.86H3.11a.86.86,0,0,1-.25-1.69l8.85-2.72a1,1,0,0,1,.58,0l8.85,2.72A.87.87,0,0,1,21.75,13.39Z", :fill "none", :stroke "currentColor", :stroke-linecap "round", :stroke-linejoin "round", :stroke-width "1.5px"}] + [:polyline {:points "15.5 8.25 18 8.25 18 11.6", :fill "none", :stroke "currentColor", :stroke-linecap "round", :stroke-linejoin "round", :stroke-width "1.5px"}] + [:polyline {:points "6 11.6 6 8.25 8.5 8.25", :fill "none", :stroke "currentColor", :stroke-linecap "round", :stroke-linejoin "round", :stroke-width "1.5px"}] + [:path {:d "M6,8.25a6,6,0,0,1,12,0", :fill "none", :stroke "currentColor", :stroke-linecap "round", :stroke-linejoin "round", :stroke-width "1.5px"}] + [: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 "20.25", :stroke-linecap "round", :stroke-width "1.5px", :x1 "2", :y2 "20.25", :x2 "22"}]]]) diff --git a/src/clj/auto_ap/ssr/ui.clj b/src/clj/auto_ap/ssr/ui.clj index e32a7013..1b0b826b 100644 --- a/src/clj/auto_ap/ssr/ui.clj +++ b/src/clj/auto_ap/ssr/ui.clj @@ -45,48 +45,25 @@ [:script {:type "text/javascript", :src "https://cdn.yodlee.com/fastlink/v4/initialize.js", :async "async" }]] [:script {:type "text/javascript", :src "https://cdn.jsdelivr.net/npm/@tarekraafat/autocomplete.js@10.2.7/dist/autoComplete.min.js"}] [:script {:src "https://unpkg.com/dropzone@5/dist/min/dropzone.min.js"}] - [:link {:rel "stylesheet" :href "https://unpkg.com/dropzone@5/dist/min/dropzone.min.css" :type "text/css"}] [:body {"_" (hiccup/raw "on closeDialog transition <#modal-holder .modal-content /> opacity to 0.0 over 300ms then add .hidden to <#modal-holder /> on openDialog remove .hidden from #modal-holder")} - [:div {:id "app"} - [:div - #_[:nav {:class "navbar has-shadow is-fixed-top is-grey"} - - [:div {:class "container"} - [:div {:class "navbar-brand"} - [:a {:class "navbar-item", :href "../"} - [:img {:src "/img/logo.png"}]]] - [:div.navbar-menu {:id "navMenu"} - [:div.navbar-start - [:a.navbar-item {:href "/"} - "Home" ] - [:a.navbar-item {:href (bidi/path-for client-routes/routes :unpaid-invoices)} - "Invoices" ] - [:a.navbar-item {:href (bidi/path-for client-routes/routes :payments)} - "Payments" ] - [:a.navbar-item {:href (bidi/path-for client-routes/routes :sales-orders)} - "POS" ] - [:a.navbar-item {:href (bidi/path-for client-routes/routes :transactions)} - "Transactions" ] - [:a.navbar-item {:href (bidi/path-for client-routes/routes :ledger)} - "Ledger" ]] - [:div.navbar-end - (company-dropdown/dropdown request) - (login-dropdown/dropdown request)]]]] - #_[:div {:class "columns has-shadow", :id "mail-app", :style "margin-bottom: 0px; height: calc(100vh - 46px);"} - [:aside {:class "column aside menu is-2 "} - [:div {:class "main left-nav"} - side-bar-contents]] - [:div {:class "column messages hero ", :id "message-feed", :style "overflow: auto;"} - [:div {:class "inbox-messages"} - contents]]]] - [:div - contents]] - [:div#modal-holder.hidden - [: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#modal-content ]]] - [:div {:class "bg-gray-900 bg-opacity-50 dark:bg-opacity-80 fixed inset-0 z-40"}]] + contents [:script {:src "/js/flowbite.min.js"}] - - ]])) + [:script {:lang "text/javascript"} + (hiccup/raw " + const $targetEl = document.getElementById('left-nav'); + + const $triggerEl = document.getElementById('left-nav-toggle'); + + const options = { + onCollapse: () => { + document.getElementById('main-content').classList.remove('lg:pl-64') + }, + onExpand: () => { + document.getElementById('main-content').classList.add('lg:pl-64') + }, + onToggle: () => { + } + }; + + const collapse = new Collapse($targetEl, $triggerEl, options); ")]]]))