vexip-ui/lib/components/date-picker/date-panel.vue2.cjs

A Vue 3 UI library, Highly customizability, full TypeScript, performance pretty good

"use strict";const e=require("vue");require("../button/index.cjs");require("../calendar-panel/index.cjs");require("../icon/index.cjs");require("../resize-observer/index.cjs");require("./time-wheel.vue.cjs");const q=require("@vexip-ui/config"),g=require("@vexip-ui/utils"),de=require("@vexip-ui/hooks"),me=require("./symbol.cjs"),fe=require("../resize-observer/resize-observer.cjs"),N=require("../icon/icon.cjs"),he=require("../calendar/calendar-panel.vue2.cjs"),F=require("./time-wheel.vue2.cjs"),L=require("../button/button.cjs"),ve=["aria-labelledby"],ye=["title","onClick"],ge=["onClick","onMouseenter"],be=["onClick","onMouseenter"],ke=e.defineComponent({name:"DatePanel",__name:"date-panel",props:{type:{default:"date",validator:o=>me.datePickerTypes.includes(o)},enabled:{type:Object,default:()=>({})},startValue:{type:Object,default:null},endValue:{type:Object,default:null},shortcuts:{type:Array,default:()=>[]},confirmText:{type:String,default:null},cancelText:{type:String,default:null},today:{type:[Number,String,Date],default:()=>new Date},disabledDate:{type:Function,default:()=>!1},noAction:{type:Boolean,default:!1},steps:{type:Array,default:()=>[1,1,1]},range:{type:Boolean,default:!1},startActivated:{type:Object,default:()=>({})},endActivated:{type:Object,default:()=>({})},min:{type:[Number,String,Date],default:null},max:{type:[Number,String,Date],default:null},disabledTime:{type:Object,default:()=>({})},hasError:{type:Boolean,default:!1},locale:{type:Object,default:()=>({})},selectingType:{type:String,default:"start"},weekStart:{type:Number,default:null},staticWheel:{type:Boolean,default:!1},shortcutsPlacement:{type:String,default:"left"},labeledBy:{type:String,default:void 0}},emits:["click","shortcut","toggle-col","change","cancel","confirm","hover","type-change","time-change"],setup(o,{expose:j,emit:O}){const a=o,v=O,r=q.useNameHelper("date-picker"),y=q.useIcons(),{isRtl:w}=de.useRtl(),E=g.toDate(a.today),H=g.range(12,1,1),d=e.ref(a.type==="year"?"year":a.type==="month"?"month":"date"),s=e.ref(E.getFullYear()),m=e.ref(E.getMonth()+1),f=e.ref(0),b=e.ref(0),h=e.ref([]),C=e.reactive({width:0,height:0}),I=e.computed(()=>{const{width:t,height:n}=C;switch(a.shortcutsPlacement){case"top":return{paddingTop:`${n}px`};case"right":return{paddingRight:`${t}px`};case"bottom":return{paddingBottom:`${n}px`};default:return{paddingLeft:`${t}px`}}}),A=e.computed(()=>{const t=a.startActivated;return t.year&&t.month&&t.date}),W=e.computed(()=>{const t=a.endActivated;return t.year&&t.month&&t.date}),G=e.computed(()=>a.type==="datetime"),J=e.computed(()=>a.range?A.value||W.value?[B("start"),B("end")]:["",""]:A.value?B("start"):""),K=e.computed(()=>[a.locale.week7,a.locale.week1,a.locale.week2,a.locale.week3,a.locale.week4,a.locale.week5,a.locale.week6].map(t=>t.slice(0,2)));e.watch(s,t=>{h.value=g.range(12,Math.floor(t/10)*10,1)},{immediate:!0}),e.onMounted(()=>{T("start")}),j({refreshCalendar:T});function B(t){const n=t==="start"?a.startValue:a.endValue;return n?`${n.year}-${n.month}-${n.date}`:""}function $(t){return a.locale[`month${t}`]}function V(t){d.value=t}function M(t,n){if(t==="year")s.value+=n;else{m.value+=n;const l=new Date(s.value,m.value-1,1);s.value=l.getFullYear(),m.value=l.getMonth()+1}}function Q(t){v("click",t)}function U(t){const{value:n,name:l}=a.shortcuts[t];v("shortcut",l,g.callIfFunc(n))}function X(t){D([t.getFullYear(),t.getMonth()+1,t.getDate()])}function Z(t){S(t)||(s.value=t,a.type!=="year"?V("month"):D([t,1,1]))}function _(t){p(t)||(m.value=t,a.type!=="month"?V("date"):D([s.value,t,1]))}function D(t){v("change",t)}function ee(t,n){v("time-change","start",t,n)}function te(t,n){v("time-change","end",t,n)}function ae(){d.value==="year"?h.value=g.range(12,h.value[0]-10,1):M("year",-1)}function ne(){d.value==="year"?h.value=g.range(12,h.value[10],1):M("year",1)}function le(){v("cancel")}function re(){v("confirm")}function oe(t){v("hover",t)}function Y(t){return t?a.startActivated.year&&a.startValue.year===t||a.endActivated.year&&a.endValue.year===t:!1}function x(t){if(!t)return!1;const n=100*s.value+t;return a.startActivated.month&&100*a.startValue.year+a.startValue.month===n||a.endActivated.month&&100*a.endValue.year+a.endValue.month===n}function S(t){if(a.type==="year")return a.disabledDate(new Date(t,0));for(let n=1;n<=12;++n)if(!p(n,t))return!1;return!0}function p(t,n=s.value){if(a.type==="year")return!1;if(a.type==="month")return a.disabledDate(new Date(n,t-1));const l=new Date(n,t-1),u=new Date(n,t,0).getDate();for(let c=1;c<=u;++c)if(l.setDate(c),!a.disabledDate(l))return!1;return!0}function ie(t){f.value=S(t)?0:t}function se(t){b.value=p(t)?0:t}function P(t){if(!a.range||!f.value&&!a.startActivated.year&&!a.endActivated.year)return!1;const n=a.startValue.year,l=a.endValue.year;let i,u;if(!f.value&&a.startActivated.year&&a.endActivated.year)i=Math.min(n,l),u=Math.max(n,l);else if(f.value){if(!a.startActivated.year&&!a.endActivated.year)return!1;if(!a.startActivated.year||!a.endActivated.year){const c=a.startActivated.year?n:l;i=Math.min(f.value,c),u=Math.max(f.value,c)}else{const c=Math.min(n,l),k=Math.max(n,l);i=Math.min(f.value,c),u=Math.max(f.value,k)}}else return!1;return t>=i&&t<=u}function R(t){if(!a.range||!b.value&&!a.startActivated.month&&!a.endActivated.month)return!1;const n=100*a.startValue.year+a.startValue.month,l=100*a.endValue.year+a.endValue.month;let i,u;if(!b.value&&a.startActivated.month&&a.endActivated.month)i=Math.min(n,l),u=Math.max(n,l);else if(b.value){if(!a.startActivated.month&&!a.endActivated.month)return!1;const k=100*s.value+b.value;if(!a.startActivated.month||!a.endActivated.month){const z=a.startActivated.month?n:l;i=Math.min(k,z),u=Math.max(k,z)}else{const z=Math.min(n,l),ce=Math.max(n,l);i=Math.min(k,z),u=Math.max(k,ce)}}else return!1;const c=100*s.value+t;return c>=i&&c<=u}function T(t){const n=g.toDate(a.today);t==="start"?(s.value=a.startActivated.year?a.startValue.year:n.getFullYear(),m.value=a.startActivated.month?a.startValue.month:n.getMonth()+1):(s.value=a.endActivated.year?a.endValue.year:n.getFullYear(),m.value=a.endActivated.month?a.endValue.month:n.getMonth()+1)}function ue(t){var l;const n=(l=t.borderBoxSize)==null?void 0:l[0];n?(C.width=n.inlineSize,C.height=n.blockSize):(C.width=t.contentRect.width,C.height=t.contentRect.height)}return(t,n)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass({[e.unref(r).be("panel")]:!0,[e.unref(r).bem("panel","vertical")]:o.shortcuts.length&&(o.shortcutsPlacement==="top"||o.shortcutsPlacement==="bottom")}),"aria-labelledby":o.labeledBy,style:e.normalizeStyle(I.value),onClick:Q},[o.shortcuts.length?(e.openBlock(),e.createBlock(e.unref(fe),{key:0,"on-resize":ue},{default:e.withCtx(()=>[e.createElementVNode("div",{class:e.normalizeClass([e.unref(r).be("list"),e.unref(r).bem("list","sub"),e.unref(r).be("shortcuts"),e.unref(r).bem("shortcuts",o.shortcutsPlacement)])},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(o.shortcuts,(l,i)=>(e.openBlock(),e.createElementBlock("div",{key:i,class:e.normalizeClass(e.unref(r).be("shortcut")),title:l.name,onClick:u=>U(i)},e.toDisplayString(l.name),11,ye))),128))],2)]),_:1})):e.createCommentVNode("",!0),e.createElementVNode("div",{class:e.normalizeClass(e.unref(r).be("list")),role:"application"},[e.createElementVNode("div",{class:e.normalizeClass(e.unref(r).be("panel-body"))},[e.createElementVNode("div",{class:e.normalizeClass(e.unref(r).be("date-panel"))},[e.createElementVNode("div",{class:e.normalizeClass(e.unref(r).be("header"))},[e.createElementVNode("div",{class:e.normalizeClass([e.unref(r).be("arrow"),e.unref(r).be("prev-year")]),onClick:ae},[e.createVNode(e.unref(N),e.normalizeProps(e.guardReactiveProps(e.unref(w)?e.unref(y).anglesRight:e.unref(y).anglesLeft)),null,16)],2),e.withDirectives(e.createElementVNode("div",{class:e.normalizeClass([e.unref(r).be("arrow"),e.unref(r).be("prev-month")]),onClick:n[0]||(n[0]=l=>M("month",-1))},[e.createVNode(e.unref(N),e.normalizeProps(e.guardReactiveProps(e.unref(w)?e.unref(y).angleRight:e.unref(y).angleLeft)),null,16)],2),[[e.vShow,d.value==="date"]]),e.createElementVNode("div",{class:e.normalizeClass(e.unref(r).be("year-month"))},[e.renderSlot(t.$slots,"title",{panel:d.value,yearStart:h.value[0],year:s.value,month:m.value,togglePanel:V},()=>[e.createElementVNode("div",{key:"year",class:e.normalizeClass(e.unref(r).be("year")),onClick:n[1]||(n[1]=e.withModifiers(l=>V("year"),["stop"]))},[d.value==="year"?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[e.createTextVNode(e.toDisplayString(`${h.value[0]}${o.locale.year} - ${h.value[9]}${o.locale.year}`),1)],64)):(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[e.createTextVNode(e.toDisplayString(`${s.value}${o.locale.year}`),1)],64))],2),e.withDirectives(e.createElementVNode("div",{class:e.normalizeClass(e.unref(r).be("month")),onClick:n[2]||(n[2]=e.withModifiers(l=>V("month"),["stop"]))},e.toDisplayString($(m.value)),3),[[e.vShow,d.value==="date"]])])],2),e.withDirectives(e.createElementVNode("div",{class:e.normalizeClass([e.unref(r).be("arrow"),e.unref(r).be("next-month")]),onClick:n[3]||(n[3]=l=>M("month",1))},[e.createVNode(e.unref(N),e.normalizeProps(e.guardReactiveProps(e.unref(w)?e.unref(y).angleLeft:e.unref(y).angleRight)),null,16)],2),[[e.vShow,d.value==="date"]]),e.createElementVNode("div",{class:e.normalizeClass([e.unref(r).be("arrow"),e.unref(r).be("next-year")]),onClick:ne},[e.createVNode(e.unref(N),e.normalizeProps(e.guardReactiveProps(e.unref(w)?e.unref(y).anglesLeft:e.unref(y).anglesRight)),null,16)],2)],2),e.createElementVNode("div",{class:e.normalizeClass(e.unref(r).be("calendar"))},[d.value==="year"?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(e.unref(r).be("year-panel")),onMouseleave:n[4]||(n[4]=l=>f.value=0)},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(h.value,(l,i)=>(e.openBlock(),e.createElementBlock("div",{key:i,class:e.normalizeClass({[e.unref(r).be("year-item")]:!0,[e.unref(r).bem("year-item","selected")]:Y(l),[e.unref(r).bem("year-item","next")]:i>9,[e.unref(r).bem("year-item","disabled")]:S(l),[e.unref(r).bem("year-item","in-range")]:P(l)}),onClick:e.withModifiers(u=>Z(l),["stop"]),onMouseenter:u=>ie(l)},[e.createElementVNode("div",{class:e.normalizeClass(e.unref(r).be("year-label"))},[e.renderSlot(t.$slots,"year",{year:l,selected:Y(l),isNext:i>9,disabled:S(l),inRange:P(l)},()=>[e.createElementVNode("div",{class:e.normalizeClass(e.unref(r).be("year-label-inner"))},e.toDisplayString(l),3)])],2)],42,ge))),128))],34)):d.value==="month"?(e.openBlock(),e.createElementBlock("div",{key:1,class:e.normalizeClass(e.unref(r).be("month-panel")),onMouseleave:n[5]||(n[5]=l=>b.value=0)},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(H),l=>(e.openBlock(),e.createElementBlock("div",{key:l,class:e.normalizeClass({[e.unref(r).be("month-item")]:!0,[e.unref(r).bem("month-item","selected")]:x(l),[e.unref(r).bem("month-item","disabled")]:p(l),[e.unref(r).bem("month-item","in-range")]:R(l)}),onClick:e.withModifiers(i=>_(l),["stop"]),onMouseenter:i=>se(l)},[e.createElementVNode("div",{class:e.normalizeClass(e.unref(r).be("month-label"))},[e.renderSlot(t.$slots,"month",{year:s.value,month:l,selected:x(l),disabled:p(l),inRange:R(l)},()=>[e.createElementVNode("div",{class:e.normalizeClass(e.unref(r).be("month-label-inner"))},e.toDisplayString($(l)),3)])],2)],42,be))),128))],34)):(e.openBlock(),e.createBlock(e.unref(he),{key:2,inherit:"",value:J.value,year:s.value,month:m.value,"value-type":o.selectingType,"disabled-date":o.disabledDate,range:o.range,min:o.min,max:o.max,"week-start":o.weekStart,"week-days":K.value,onSelect:X,onHover:oe},e.createSlots({_:2},[t.$slots.week?{name:"week",fn:e.withCtx(l=>[e.renderSlot(t.$slots,"week",e.normalizeProps(e.guardReactiveProps(l)))]),key:"0"}:void 0,t.$slots.date?{name:"itemContent",fn:e.withCtx(l=>[e.renderSlot(t.$slots,"date",e.normalizeProps(e.guardReactiveProps(l)))]),key:"1"}:void 0]),1032,["value","year","month","value-type","disabled-date","range","min","max","week-start","week-days"]))],2)],2),G.value?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(e.unref(r).be("time-panel"))},[e.createElementVNode("div",{class:e.normalizeClass([e.unref(r).be("header"),e.unref(r).bem("header","time")])},[o.range?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[e.createElementVNode("div",{class:e.normalizeClass(e.unref(r).be("title"))},e.toDisplayString(o.locale.startTime),3),e.createElementVNode("div",{class:e.normalizeClass(e.unref(r).be("title"))},e.toDisplayString(o.locale.endTime),3)],64)):e.createCommentVNode("",!0)],2),e.createElementVNode("div",{class:e.normalizeClass(e.unref(r).be("wheel"))},[e.createVNode(F,{hour:o.startValue.hour,minute:o.startValue.minute,second:o.startValue.second,candidate:3,steps:o.steps,"disabled-time":o.disabledTime,"no-transition":o.staticWheel,onChange:ee},null,8,["hour","minute","second","steps","disabled-time","no-transition"]),o.range?(e.openBlock(),e.createBlock(F,{key:0,hour:o.endValue.hour,minute:o.endValue.minute,second:o.endValue.second,candidate:3,steps:o.steps,"disabled-time":o.disabledTime,"no-transition":o.staticWheel,onChange:te},null,8,["hour","minute","second","steps","disabled-time","no-transition"])):e.createCommentVNode("",!0)],2)],2)):e.createCommentVNode("",!0)],2),o.noAction?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(e.unref(r).be("action"))},[e.createVNode(e.unref(L),{inherit:"",text:"",size:"small",onClick:le},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(o.cancelText||o.locale.cancel),1)]),_:1}),e.createVNode(e.unref(L),{inherit:"",type:"primary",size:"small",disabled:o.hasError,onClick:re},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(o.confirmText||o.locale.confirm),1)]),_:1},8,["disabled"])],2))],2)],14,ve))}});module.exports=ke;
//# sourceMappingURL=date-panel.vue2.cjs.map