Makes an experience for balance sheet multi choice

This commit is contained in:
2024-10-24 22:21:52 -07:00
parent f589b24908
commit f9d02e4798
3 changed files with 76 additions and 13 deletions

View File

@@ -290,9 +290,33 @@
(fc/with-field :date
(com/validated-inline-field {:label "Date"
:errors (fc/field-errors)}
(com/multi-date-input {:placeholder "12/21/2020"
:name (fc/field-name)
:value (fc/field-value)})))
[:div {:x-data (hx/json {:dates (map #(atime/unparse-local % atime/normal-date) (fc/field-value))}) }
[:template {:x-for "v in dates"}
[:input {:type "hidden"
:name (fc/field-name)
:x-model "v"}] ]
(com/a-button {"x-tooltip.on.click.theme.dropdown.placement.bottom.interactive" "{content: ()=> $refs.tooltip.innerHTML, allowHTML: true, appendTo: $root}"}
[:template {:x-if "dates.length == 0"}
[:span.text-left.text-gray-400 "None selected"]]
[:template { :x-if "dates.length < 3 && dates.length > 0"}
[:span.inline-flex.gap-2
[:template {:x-for "v in dates" }
(com/pill {:color :secondary}
[:span {:x-text "v"}])]]]
[:template {:x-if "dates.length >= 3"}
(com/pill {:color :secondary}
[:span {:x-text "dates.length"}]
" dates")]
[:div {:class "w-3 h-3 m-1 inline ml-1 justify-self-end text-gray-500 self-center"}
svg/drop-down])
[:template {:x-ref "tooltip"}
[:div.p-4 {:class "bg-gray-100 dark:bg-gray-600 rounded-lg shadow-2xl w-max z-50 ring-1 p-4"}
[:div.flex.flex-col.gap-2
(com/multi-date-input {:placeholder "12/21/2020"
:x-model "dates" })
(com/a-button {"@click" "dates=getFourWeekPeriods(dates[dates.length -1])"} "13 periods")
(com/a-button {"@click" "dates=[]"} "Clear")]]]]))
(com/button {:color :primary :class "w-32"}
"Run")