vue-amazing-ui
Version:
An Amazing Vue3 UI Components Library, Using TypeScript.
8 lines (7 loc) • 2.31 kB
JavaScript
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),h=require("@vuepic/vue-datepicker");;/* empty css */const w=require("../utils/index.cjs"),g=e.defineComponent({__name:"DatePicker",props:{width:{default:150},size:{default:"middle"},mode:{default:"date"},format:{type:[String,Function],default:void 0},showTime:{type:Boolean,default:!1},showToday:{type:Boolean,default:!1},range:{type:Boolean,default:!1},maxRange:{default:void 0},modelType:{default:"format"}},setup(t){const a=t,{colorPalettes:n,shadowColor:i}=w.useInject("DatePicker"),u=e.computed(()=>typeof a.width=="number"?`${a.width}px`:a.width),c=e.computed(()=>a.mode==="time"),d=e.computed(()=>a.mode==="week"),s=e.computed(()=>a.mode==="month"),m=e.computed(()=>a.mode==="year"),r=e.ref(null),f=e.computed(()=>(a.maxRange??0)*24*60*60*1e3);e.watch(()=>a.maxRange,()=>{r.value=null});function p(){r.value=null}function k(o){r.value=o.getTime()}function y(o){const l=o.getTime();return!!(r.value&&Math.abs(l-r.value)>=f.value)}return(o,l)=>(e.openBlock(),e.createBlock(e.unref(h.VueDatePicker),{class:e.normalizeClass(["datepicker-wrap",{"datepicker-small":t.size==="small","datepicker-large":t.size==="large"}]),style:e.normalizeStyle(`
--datepicker-width: ${u.value};
--datepicker-primary-color: ${e.unref(n)[5]};
--datepicker-primary-color-hover: ${e.unref(n)[4]};
--datepicker-primary-color-focus: ${e.unref(n)[4]};
--datepicker-primary-shadow-color: ${e.unref(i)};
`),position:"left","month-change-on-scroll":!1,"enable-time-picker":t.showTime,"time-picker":c.value,"week-picker":d.value,"month-picker":s.value,"year-picker":m.value,range:t.range,"now-button-label":"今天","show-now-button":t.showToday,"auto-apply":"","text-input":"","model-type":t.modelType,formats:{input:t.format},"day-names":["一","二","三","四","五","六","七"],"disabled-dates":t.range&&t.maxRange?y:[],onRangeStart:k,onClosed:p},null,8,["class","style","enable-time-picker","time-picker","week-picker","month-picker","year-picker","range","show-now-button","model-type","formats","disabled-dates"]))}});exports.default=g;