notid/integreat
1
0
Fork 0
Code Issues Pull Requests 2 Actions Packages Projects Releases Wiki Activity

Makes company 1099 page work better and faster

Browse Source
This commit is contained in:
Bryce Covert
2023-05-12 12:27:48 -07:00
parent 0e814a8a4a
commit e78c73e093
15 changed files with 519 additions and 444 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
src/clj/auto_ap/ssr/components/dialog.clj
View File

@@ -1,9 +1,44 @@
(ns auto-ap.ssr.components.dialog)
(ns auto-ap.ssr.components.dialog
(:require [hiccup2.core :as hiccup]))
(defn dialog- [header content footer]
[:div#modal-content
(defn modal- [params & children]
[:div
[:div#modal-holder { :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 hidden" :aria-hidden true
"_" (hiccup/raw "on closeModal transition <#modal-holder .modal-content /> opacity to 0.0 over 300ms then call hideModal()")}
[:div {:class "relative w-full max-w-2xl max-h-full"}
(into [:div#modal-content]
children)]
]
[:script {:lang "text/javascript"}
(hiccup/raw "
var modal_element = document.getElementById('modal-holder');
var modal_options = {
placement: 'center',
backdrop: 'dynamic',
backdropClasess: 'bg-gray-900 bg-opacity-50 dark:bg-opacity-80 fixed inset-0 z-40',
closable: true,
onOpen: function() {
modal_element.dispatchEvent('openModal');
},
onHide: function() {
modal_element.outerHTML='<div id=\"modal-holder\"></div>';
},
};
var curModal = new Modal(modal_element, modal_options);
curModal.show();
function hideModal() {
curModal.hide();
}
")
]])
(defn modal-card- [params header content footer]
[:div#modal-card
[: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]]])
[:div footer]]
])

34
src/clj/auto_ap/ssr/components/navbar.clj
View File

@@ -3,9 +3,10 @@
[auto-ap.ssr.svg :as svg]
[hiccup2.core :as hiccup]
[bidi.bidi :as bidi]
[auto-ap.ssr-routes :as ssr-routes]))
[auto-ap.ssr-routes :as ssr-routes]
[auto-ap.ssr.company-dropdown :as cd]))
(defn navbar- []
(defn navbar- [{:keys [client identity]}]
[: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"}
@@ -17,36 +18,31 @@
[: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"}]
]
[:button.mt-1.lg:w-96.relative.hidden.lg:block {:class "bg-gray-50 hover:bg-gray-200 dark:hover:bg-gray-700 border border-gray-300 text-gray-900 sm:text-sm rounded-lg focus:ring-primary-500 focus:border-primary-500 w-full pl-10 py-4 pr-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500 gap-4 "
:hx-get (bidi/path-for ssr-routes/only-routes
:search)
:hx-target "#modal-content"
:hx-swap "innerHTML"}
]
[:div {:class "flex items-center gap-4"}
[:button.mt-1.lg:w-96.relative.hidden.lg:block {:class "bg-gray-50 hover:bg-gray-200 dark:hover:bg-gray-700 border border-gray-300 text-gray-900 sm:text-sm rounded-lg focus:ring-primary-500 focus:border-primary-500 w-full pl-10 py-4 pr-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500 gap-4 "
:hx-get (bidi/path-for ssr-routes/only-routes
:search)
:hx-target "#modal-holder"
:hx-swap "outerHTML"}
[:div {:class "absolute inset-y-0 left-0 flex items-center pl-3 pointer-events-none text-gray-500"}
[:div.w-4.h-4 svg/search]
[:span.ml-2 "Search"]]]]
[:div {:class "flex items-center gap-4"}
[:span.ml-2 "Search"]]]
[:div {:class "hidden mr-3 -mb-1 sm:block"}
[:span]]
(icon-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"
:hx-get (bidi/path-for ssr-routes/only-routes
:search)
:hx-target "#modal-content"
:hx-swap "innerHTML"}
:hx-target "#modal-holder"
:hx-swap "outerHTML"}
svg/search)
#_[:button
[:div.w-4.h-4 svg/search]]
(cd/dropdown {:client client :identity identity})
#_[: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"}

19
src/clj/auto_ap/ssr/components/page.clj
View File

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