2 lines
1.3 KiB
JavaScript
2 lines
1.3 KiB
JavaScript
|
globalThis.Component.register("DatePicker",t=>{t.state=globalThis.NewState({start:"",end:""});const e=()=>{const e=t.closest("AutoForm"),a=t.getAttribute("name"),s=e?.state?.schema?.find(t=>t.name===a);return s?.setting?.rangeEnd||t.rangeEnd||t.getAttribute("rangeend")||""};t.addEventListener("bind",a=>{t.state.start=a.detail||"";const s=t.closest("AutoForm"),n=e();s&&n&&(t.state.end=s.data[n]||"")}),Object.defineProperty(t,"isRange",{get:()=>t.hasAttribute("range")||!!e()}),Object.defineProperty(t,"value",{get:()=>t.state.start,set:e=>{t.state.start=e||""}}),t.updateStart=e=>{t.state.start=e,t.dispatchEvent(new CustomEvent("change",{bubbles:!0,detail:e}))},t.updateEnd=a=>{t.state.end=a;const s=t.closest("AutoForm"),n=e();s&&n&&(s.data[n]=a),t.dispatchEvent(new CustomEvent("change",{bubbles:!0,detail:a}))}},globalThis.Util.makeDom('\n<div class="d-flex align-items-center gap-1 w-100">\n <input type="date" class="form-control h-100" $bind="this.state.start" $onchange="this.updateStart(thisNode.value)">\n <template $if="this.isRange">\n <span class="text-muted mx-1">-</span>\n <input type="date" class="form-control h-100" $bind="this.state.end" $onchange="this.updateEnd(thisNode.value)">\n </template>\n</div>\n')),globalThis.AutoForm&&globalThis.AutoForm.register("DatePicker");
|