eslink-ui-plus/umd/search-date-range-picker/index.js

vue3 component library, css framework

(function(e,d){typeof exports=="object"&&typeof module!="undefined"?module.exports=d(require("vue"),require("dayjs"),require("element-plus")):typeof define=="function"&&define.amd?define(["vue","dayjs","element-plus"],d):(e=typeof globalThis!="undefined"?globalThis:e||self,e["es-search-date-range-picker"]=d(e.Vue,e.dayjs,e.ElementPlus))})(this,function(e,d,h){"use strict";function y(n){return n&&typeof n=="object"&&"default"in n?n:{default:n}}var _=y(d),i=e.defineComponent({components:{ElPopover:h.ElPopover},props:{styles:{type:Object,default:()=>({})},label:{type:[String,Number],default:""},value:{type:[String,Number],default:""},useSlot:{type:Boolean,default:!0},class:{type:String,default:""},panelClass:{type:String,default:""},popoverClass:{type:String,default:""}},emits:["open","close"],setup(n,{emit:l,slots:r}){const o=e.ref(!1),s=e.ref(null);return{panelVisible:o,closePanel:()=>{o.value=!1},slots:r,popoverEl:s,emit:l}}});e.pushScopeId("data-v-8823a666");const b={key:1,class:"es-search-label__container"},g={key:0,class:"es-search-label__container__label"},k={key:1,class:"es-search-label__container__label"},v={key:2,class:"es-search-label__container__value"},S={key:3,class:"es-search-label__container__value"},E=e.createElementVNode("div",{class:"es-search-label__container__icon es-icon-arrow-down-s-fill"},null,-1);e.popScopeId();function $(n,l,r,o,s,m){const u=e.resolveComponent("el-popover");return e.openBlock(),e.createBlock(u,{ref:"popoverEl",placement:"bottom-start",offset:6,width:"unset","hide-after":0,"popper-class":`el-popover--no-padding ${n.popoverClass}`,visible:n.panelVisible,"onUpdate:visible":l[0]||(l[0]=t=>n.panelVisible=t),onShow:l[1]||(l[1]=t=>n.emit("open")),onHide:l[2]||(l[2]=t=>n.emit("close"))},{reference:e.withCtx(()=>[e.createElementVNode("div",{class:e.normalizeClass(["es-search-label",n.class]),style:e.normalizeStyle(n.styles)},[n.slots.main?e.renderSlot(n.$slots,"main",{key:0}):(e.openBlock(),e.createElementBlock("div",b,[n.slots.label?(e.openBlock(),e.createElementBlock("div",g,[e.renderSlot(n.$slots,"label")])):(e.openBlock(),e.createElementBlock("div",k,e.toDisplayString(n.label),1)),n.slots.value?(e.openBlock(),e.createElementBlock("div",v,[e.renderSlot(n.$slots,"value")])):(e.openBlock(),e.createElementBlock("div",S,e.toDisplayString(n.value),1)),E]))],6)]),default:e.withCtx(()=>[e.createElementVNode("div",{class:e.normalizeClass(["es-search-label__slot",n.panelClass])},[e.renderSlot(n.$slots,"panel",{closePanel:n.closePanel,popoverEl:n.popoverEl})],2)]),_:3},8,["popper-class","visible"])}function c(n,l){l===void 0&&(l={});var r=l.insertAt;if(!(!n||typeof document=="undefined")){var o=document.head||document.getElementsByTagName("head")[0],s=document.createElement("style");s.type="text/css",r==="top"&&o.firstChild?o.insertBefore(s,o.firstChild):o.appendChild(s),s.styleSheet?s.styleSheet.cssText=n:s.appendChild(document.createTextNode(n))}}var C=`.es-search-label[data-v-8823a666] {
  font-size: 14px;
  line-height: 20px;
  display: inline-block;
  cursor: pointer;
}
.es-search-label__container[data-v-8823a666] {
  display: flex;
}
.es-search-label__container__label[data-v-8823a666] {
  color: #7a7c90;
}
.es-search-label__container__icon[data-v-8823a666] {
  width: 16px;
  height: 16px;
  margin-left: 4px;
}
.es-search-label__container__icon[data-v-8823a666]::before {
  color: #a7baf1;
}`;c(C);var D=`.el-popover--no-padding {
  padding: 0 !important;
}
.el-popover.el-popper {
  min-width: unset !important;
}
.el-popper__arrow {
  display: none;
}`;c(D),i.render=$,i.__scopeId="data-v-8823a666",i.__file="components/search-label/index.vue",i.install=n=>{n.component("es-search-label",i)};var p=e.defineComponent({components:{ElDatePicker:h.ElDatePicker,EsSearchLabel:i},props:{label:[String,Number],defaultValue:[String,Number],modelValue:Array,type:{type:String,default:"daterange"}},emits:["update:modelValue","done"],setup(n,{emit:l}){const r=t=>{const a=n.type==="daterange"?"YYYY-MM-DD":"YYYY-MM-DD HH:mm:ss";return t.map(f=>_.default(f).format(a))},o=e.computed({get(){var t;const a=(t=n.modelValue)!=null?t:[];return(a==null?void 0:a.length)===0||a.every(w=>!w)?[]:a},set(t){l("update:modelValue",r(t)),l("done",r(t))}}),s=e.computed(()=>{let t=Array.isArray(o.value)?o.value:[];const a=(t==null?void 0:t.length)===0||t.every(f=>!f);return t=a?[]:t,n.type,a?n.defaultValue:r(t).join(" - ")}),m=e.computed(()=>n.type==="daterange"?"none":"block");return{valueModel:s,datePickerModel:o,setHeaderDisplay:()=>{const t=document.querySelectorAll(".el-date-range-picker__time-header");t&&t.forEach(a=>{a.style.display=m.value})}}}});function V(n,l,r,o,s,m){const u=e.resolveComponent("es-search-label"),t=e.resolveComponent("el-date-picker");return e.openBlock(),e.createElementBlock("div",{class:"es-date-time-range-picker",onClick:l[1]||(l[1]=(...a)=>n.setHeaderDisplay&&n.setHeaderDisplay(...a))},[e.createVNode(u,{label:n.label,value:n.valueModel},null,8,["label","value"]),e.createVNode(t,e.mergeProps({class:"es-date-time-range-picker__input"},n.$attrs,{modelValue:n.datePickerModel,"onUpdate:modelValue":l[0]||(l[0]=a=>n.datePickerModel=a),type:"datetimerange",placement:"bottom-start"}),null,16,["modelValue"])])}var B=`.es-date-time-range-picker[data-v-23894714] {
  position: relative;
}
.es-date-time-range-picker[data-v-23894714] .el-date-editor {
  height: 20px;
  line-height: 20px;
  border: 0;
  padding: 0;
}`;c(B);var Y=`.es-date-time-range-picker__input {
  position: absolute !important;
  left: 0;
  width: 100% !important;
  opacity: 0;
}
.el-range__close-icon,
.el-range__icon {
  display: none !important;
}
.el-date-editor {
  width: unset;
}
.el-range-separator {
  height: 20px !important;
  line-height: 20px !important;
}
.el-date-picker-rewrite {
  position: unset !important;
  box-shadow: unset !important;
  border: 0 !important;
}
.el-date-picker-rewrite .el-popper__arrow {
  display: none;
}`;return c(Y),p.render=V,p.__scopeId="data-v-23894714",p.__file="components/search-date-range-picker/index.vue",p.install=n=>{n.component("es-search-date-range-picker",p)},p});