mirror of https://github.com/logseq/logseq
fix(ux): the shui date picker for the schedule editor
parent
d88dcd0fd4
commit
239590d205
|
@ -208,3 +208,13 @@ label.day-enabled {
|
||||||
.dark-theme .datepicker td {
|
.dark-theme .datepicker td {
|
||||||
border-bottom: none;
|
border-bottom: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#time-repeater {
|
||||||
|
input.form-input, select.form-select {
|
||||||
|
@apply h-8 mt-0;
|
||||||
|
}
|
||||||
|
|
||||||
|
select.form-select {
|
||||||
|
@apply leading-none;
|
||||||
|
}
|
||||||
|
}
|
|
@ -18,6 +18,13 @@
|
||||||
:repeater {}})
|
:repeater {}})
|
||||||
(defonce *timestamp (atom default-timestamp-value))
|
(defonce *timestamp (atom default-timestamp-value))
|
||||||
|
|
||||||
|
(defn- date->goog-date
|
||||||
|
[d]
|
||||||
|
(cond
|
||||||
|
(some->> d (instance? js/Date))
|
||||||
|
(goog.date.Date. (.getFullYear d) (.getMonth d) (.getDate d))
|
||||||
|
:else d))
|
||||||
|
|
||||||
(defonce *show-time? (atom false))
|
(defonce *show-time? (atom false))
|
||||||
(rum/defc time-input < rum/reactive
|
(rum/defc time-input < rum/reactive
|
||||||
[default-value]
|
[default-value]
|
||||||
|
@ -46,7 +53,7 @@
|
||||||
[{:keys [num duration kind]}]
|
[{:keys [num duration kind]}]
|
||||||
(let [show? (rum/react *show-repeater?)]
|
(let [show? (rum/react *show-repeater?)]
|
||||||
(if (or show? (and num duration kind))
|
(if (or show? (and num duration kind))
|
||||||
[:div.w.full.flex.flex-row.justify-left
|
[:div.w.full.flex.flex-row.justify-left.items-center
|
||||||
[:input#repeater-num.form-input.w-8.mr-2.px-1.sm:w-20.sm:px-2.text-center
|
[:input#repeater-num.form-input.w-8.mr-2.px-1.sm:w-20.sm:px-2.text-center
|
||||||
{:default-value num
|
{:default-value num
|
||||||
:on-change (fn [event]
|
:on-change (fn [event]
|
||||||
|
@ -90,7 +97,7 @@
|
||||||
[e]
|
[e]
|
||||||
(when e (util/stop e))
|
(when e (util/stop e))
|
||||||
(let [{:keys [repeater] :as timestamp} @*timestamp
|
(let [{:keys [repeater] :as timestamp} @*timestamp
|
||||||
date (:date-picker/date @state/state)
|
date (-> (:date-picker/date @state/state) date->goog-date)
|
||||||
timestamp (assoc timestamp :date (or date (t/today)))
|
timestamp (assoc timestamp :date (or date (t/today)))
|
||||||
kind (if (= "w" (:duration repeater)) "++" ".+")
|
kind (if (= "w" (:duration repeater)) "++" ".+")
|
||||||
timestamp (assoc-in timestamp [:repeater :kind] kind)
|
timestamp (assoc-in timestamp [:repeater :kind] kind)
|
||||||
|
@ -162,7 +169,8 @@
|
||||||
format
|
format
|
||||||
{:command :page-ref})
|
{:command :page-ref})
|
||||||
(state/clear-editor-action!)
|
(state/clear-editor-action!)
|
||||||
(reset! commands/*current-command nil))))]
|
(reset! commands/*current-command nil))
|
||||||
|
(state/set-state! :date-picker/date d)))]
|
||||||
[:div#date-time-picker.flex.flex-col.sm:flex-row
|
[:div#date-time-picker.flex.flex-col.sm:flex-row
|
||||||
;; inline container
|
;; inline container
|
||||||
[:div.border-red-500
|
[:div.border-red-500
|
||||||
|
@ -170,6 +178,7 @@
|
||||||
{:mode "single"
|
{:mode "single"
|
||||||
:initial-focus true
|
:initial-focus true
|
||||||
:show-week-number true
|
:show-week-number true
|
||||||
|
:selected _date
|
||||||
:on-select select-handler!
|
:on-select select-handler!
|
||||||
:on-day-key-down (fn [^js d _ ^js e]
|
:on-day-key-down (fn [^js d _ ^js e]
|
||||||
(when (= "Enter" (.-key e))
|
(when (= "Enter" (.-key e))
|
||||||
|
|
Loading…
Reference in New Issue