Makes an okay experience of editing vendors through a wizard
This commit is contained in:
@@ -8,7 +8,8 @@
|
||||
[auto-ap.routes.admin.transaction-rules :as transaction-rules]
|
||||
[auto-ap.ssr.hiccup-helper :as hh]
|
||||
[auto-ap.routes.admin.import-batch :as ib-routes]
|
||||
[auto-ap.routes.admin.excel-invoices :as ei-routes]))
|
||||
[auto-ap.routes.admin.excel-invoices :as ei-routes]
|
||||
[auto-ap.routes.admin.vendors :as v-routes]))
|
||||
|
||||
(defn menu-button- [params & children]
|
||||
[:div
|
||||
@@ -203,9 +204,8 @@
|
||||
"Clients")]
|
||||
[:li
|
||||
(menu-button- {:icon svg/vendors
|
||||
:href (bidi/path-for client-routes/routes
|
||||
:admin-vendors)
|
||||
:target "_new"}
|
||||
:href (bidi/path-for ssr-routes/only-routes
|
||||
::v-routes/page)}
|
||||
"Vendors")]
|
||||
[:li
|
||||
(menu-button- {:icon svg/user
|
||||
|
||||
@@ -6,28 +6,31 @@
|
||||
(defn modal- [params & children]
|
||||
[:div (-> params
|
||||
(assoc "@click.outside" "open=false"
|
||||
:x-data (hx/json {:index 0 :hidingIndex -1 :unexpectedError false})
|
||||
:x-data (hx/json {:index 0 :hidingIndex -1 :unexpectedError false :transitioning false})
|
||||
"x-on:htmx:response-error" "unexpectedError=true"
|
||||
"x-on:htmx:before-request" "unexpectedError=false"
|
||||
:x-ref "modalStack"
|
||||
"@modalnext"
|
||||
"$refs.modalStack.children[index].setAttribute('x-transition:leave-end', '-translate-x-full scale-0 opacity-0' );
|
||||
"@modalnext.window"
|
||||
" $refs.modalStack.children[index].setAttribute('x-transition:leave-end', '-translate-x-full scale-0 opacity-0' );
|
||||
$refs.modalStack.children[index + 1].setAttribute('x-transition:enter-start', 'translate-x-full scale-0 opacity-0' );
|
||||
hidingIndex = index;
|
||||
setTimeout(() => {index ++; hidingIndex = -1 }, 150)"
|
||||
setTimeout(() => {index ++; transitioning=true; hidingIndex = -1; }, 150);
|
||||
setTimeout(() => transitioning=false, 320)"
|
||||
|
||||
"@modalprevious"
|
||||
"$refs.modalStack.children[index].setAttribute('x-transition:leave-end', 'translate-x-full scale-0 opacity-0' );
|
||||
"@modalprevious.window"
|
||||
" $refs.modalStack.children[index].setAttribute('x-transition:leave-end', 'translate-x-full scale-0 opacity-0' );
|
||||
$refs.modalStack.children[index - 1].setAttribute('x-transition:enter-start', '-translate-x-full scale-0 opacity-0' );
|
||||
hidingIndex = index;
|
||||
setTimeout(() => { index --; hidingIndex = -1; }, 150)"
|
||||
setTimeout(() => { index --; hidingIndex = -1; transitioning=true; }, 150);
|
||||
setTimeout(() => transitioning=false, 320)"
|
||||
|
||||
"@modalpop"
|
||||
"$refs.modalStack.children[index].setAttribute('x-transition:leave-end', 'translate-x-full scale-0 opacity-0' );
|
||||
"@modalpop.window"
|
||||
" $refs.modalStack.children[index].setAttribute('x-transition:leave-end', 'translate-x-full scale-0 opacity-0' );
|
||||
$refs.modalStack.children[index - 1].setAttribute('x-transition:enter-start', '-translate-x-full scale-0 opacity-0' );
|
||||
hidingIndex = index;
|
||||
setTimeout(() => index --, 150)
|
||||
setTimeout(() => { $refs.modalStack.removeChild($refs.modalStack.children[index+1]); hidingIndex=-1; }, 300)
|
||||
setTimeout(() => {index --; transitioning=true;}, 150);
|
||||
setTimeout(() => { $refs.modalStack.removeChild($refs.modalStack.children[index+1]); hidingIndex=-1; }, 300);
|
||||
setTimeout(() => transitioning=false, 320)
|
||||
"
|
||||
)
|
||||
(update :class (fnil hh/add-class "") "w-full h-full modal-stack"))
|
||||
@@ -58,6 +61,7 @@
|
||||
{:class "bg-white rounded-lg shadow dark:bg-gray-700 dark:text-white modal-content flex flex-col h-full"
|
||||
:x-data (hx/json {:i index})
|
||||
:x-show "index == i && hidingIndex != i"
|
||||
"x-trap" "index == i && hidingIndex == -1 && !transitioning"
|
||||
"x-transition:enter" "transition duration-150",
|
||||
"x-transition:enter-end" "translate-x-0 scale-100 opacity-100",
|
||||
"x-transition:leave" "transition duration-150",
|
||||
|
||||
@@ -55,7 +55,6 @@
|
||||
[:a {:class (-> (hh/add-class (or (:class params) "") default-input-classes)
|
||||
(hh/add-class "cursor-pointer"))
|
||||
"@click.prevent" "open = !open; popper.update()"
|
||||
"@keydown.enter.prevent.stop" "open = !open; popper.update()"
|
||||
"@keydown.down.prevent.stop" "open = true; popper.update()"
|
||||
"@keydown.backspace" "value = {value: '', label: '' }"
|
||||
:tabindex 0
|
||||
@@ -101,7 +100,7 @@
|
||||
"placeholder" (:placeholder params)
|
||||
"@keydown.down.prevent" "active ++; active = active >= elements.length - 1 ? elements.length - 1 : active"
|
||||
"@keydown.up.prevent" "active --; active = active < 0 ? 0 : active"
|
||||
"@keydown.enter.prevent" "open = false; value = elements.length > 0 ? $data.elements[active] : {'value': '', label: ''};"
|
||||
"@keydown.enter.prevent.stop" "open = false; value = elements.length > 0 ? $data.elements[active] : {'value': '', label: ''};"
|
||||
"x-init" "$watch('search', s => { if($el.value.length > 2) {fetch(baseUrl + s).then(data=>data.json()).then(data => {elements = data; active=-1}) }})"}]
|
||||
[:div.dropdown-options {:class "rounded-b-lg overflow-hidden"}
|
||||
[:template {:x-for "(element, index) in elements"}
|
||||
@@ -131,7 +130,9 @@
|
||||
(dissoc :error?)
|
||||
(assoc :type "text")
|
||||
(update
|
||||
:class (fnil hh/add-class "") default-input-classes)
|
||||
:class #(-> ""
|
||||
(hh/add-class default-input-classes)
|
||||
(hh/add-class %)))
|
||||
(update :class #(str % (use-size size))))])
|
||||
|
||||
(defn money-input- [{:keys [size] :as params}]
|
||||
@@ -204,5 +205,10 @@
|
||||
[:input {:type "hidden" :value value :name name}])
|
||||
|
||||
(defn checkbox- [params & rest]
|
||||
[:input (merge params {:type "checkbox" :class (hh/add-class default-checkbox-classes (:class params ""))})
|
||||
rest])
|
||||
(if (seq rest)
|
||||
[:label {:class "text-sm text-gray-800 dark:text-gray-300"}
|
||||
[:input (merge params {:type "checkbox" :class (hh/add-class default-checkbox-classes (:class params ""))})]
|
||||
[:span.ml-2
|
||||
rest]]
|
||||
[:input (merge params {:type "checkbox" :class (hh/add-class default-checkbox-classes (:class params ""))})
|
||||
]))
|
||||
|
||||
Reference in New Issue
Block a user