Periods selector
This commit is contained in:
@@ -152,53 +152,7 @@
|
||||
(fc/with-field :periods
|
||||
(com/validated-inline-field {:label "Periods"
|
||||
:errors (fc/field-errors)}
|
||||
[:div {:x-data (hx/json {:periods (map (fn [p]
|
||||
{:start (atime/unparse-local (:start p) atime/normal-date)
|
||||
:end (atime/unparse-local (:end p) atime/normal-date)})
|
||||
(fc/field-value))
|
||||
:source_date (-> (fc/field-value)
|
||||
first
|
||||
:end
|
||||
(atime/unparse-local atime/normal-date))})
|
||||
|
||||
:x-init "$watch('periods', ds => source_date= ds.length > 0 ? ds[0].end : null)"}
|
||||
[:template {:x-for "(v,n) in periods"}
|
||||
[:div
|
||||
(fc/with-field 0
|
||||
(fc/with-field :start
|
||||
[:input {:type "hidden"
|
||||
":name" "'periods[' + n + '][start]'"
|
||||
:x-model "v.start"}]))
|
||||
(fc/with-field 0
|
||||
(fc/with-field :end
|
||||
[:input {:type "hidden"
|
||||
":name" "'periods[' + n + '][end]'"
|
||||
:x-model "v.end"}]))]]
|
||||
(com/a-button {"x-tooltip.on.click.theme.dropdown.placement.bottom.interactive" "{content: ()=> $refs.tooltip.innerHTML, allowHTML: true, appendTo: $root}"
|
||||
:indicator? false}
|
||||
[:template {:x-if "periods.length == 0"}
|
||||
[:span.text-left.text-gray-400 "None selected"]]
|
||||
[:template { :x-if "periods.length < 3 && periods.length > 0"}
|
||||
[:span.inline-flex.gap-2
|
||||
[:template {:x-for "p in periods"}
|
||||
(com/pill {:color :secondary}
|
||||
[:span {:x-text "p.start"}]
|
||||
" - "
|
||||
[:span {:x-text "p.end"}])]]]
|
||||
[:template {:x-if "periods.length >= 3"}
|
||||
(com/pill {:color :secondary}
|
||||
[:span {:x-text "periods.length"}]
|
||||
" periods selected")]
|
||||
[: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/calendar-input {:placeholder "12/21/2020" :x-model "source_date"})
|
||||
(com/a-button {"@click" "periods=getFourWeekPeriodsPeriods(source_date)"} "13 periods")
|
||||
(com/a-button {"@click" "periods=[calendarYearPeriod(source_date)]"} "Calendar year")
|
||||
(com/a-button {"@click" "periods=[lastYearPeriod(source_date)]"} "Full year")
|
||||
(com/a-button {"@click" "periods=[]"} "Clear")]]]]))
|
||||
(com/periods-dropdown {:value (fc/field-value)})))
|
||||
|
||||
(com/button {:color :primary :class "w-32"}
|
||||
"Run")
|
||||
|
||||
Reference in New Issue
Block a user