eslink-ui-plus/es/search-input-number/index.js

vue3 component library, css framework

import{defineComponent as w,ref as V,pushScopeId as z,popScopeId as N,resolveComponent as g,openBlock as s,createBlock as y,withCtx as v,createElementVNode as m,normalizeClass as $,normalizeStyle as L,renderSlot as h,createElementBlock as u,toDisplayString as M,useCssVars as U,createCommentVNode as c,computed as b,createVNode as T,mergeProps as P,withModifiers as D,createSlots as O,normalizeProps as W,guardReactiveProps as H,createTextVNode as k,watch as R}from"vue";import{ElPopover as q,ElInput as G}from"element-plus";var S=w({components:{ElPopover:q},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(e,{emit:n,slots:t}){const a=V(!1),o=V(null);return{panelVisible:a,closePanel:()=>{a.value=!1},slots:t,popoverEl:o,emit:n}}});z("data-v-8823a666");const J={key:1,class:"es-search-label__container"},K={key:0,class:"es-search-label__container__label"},Q={key:1,class:"es-search-label__container__label"},X={key:2,class:"es-search-label__container__value"},Y={key:3,class:"es-search-label__container__value"},Z=m("div",{class:"es-search-label__container__icon es-icon-arrow-down-s-fill"},null,-1);N();function ee(e,n,t,a,o,p){const i=g("el-popover");return s(),y(i,{ref:"popoverEl",placement:"bottom-start",offset:6,width:"unset","hide-after":0,"popper-class":`el-popover--no-padding ${e.popoverClass}`,visible:e.panelVisible,"onUpdate:visible":n[0]||(n[0]=l=>e.panelVisible=l),onShow:n[1]||(n[1]=l=>e.emit("open")),onHide:n[2]||(n[2]=l=>e.emit("close"))},{reference:v(()=>[m("div",{class:$(["es-search-label",e.class]),style:L(e.styles)},[e.slots.main?h(e.$slots,"main",{key:0}):(s(),u("div",J,[e.slots.label?(s(),u("div",K,[h(e.$slots,"label")])):(s(),u("div",Q,M(e.label),1)),e.slots.value?(s(),u("div",X,[h(e.$slots,"value")])):(s(),u("div",Y,M(e.value),1)),Z]))],6)]),default:v(()=>[m("div",{class:$(["es-search-label__slot",e.panelClass])},[h(e.$slots,"panel",{closePanel:e.closePanel,popoverEl:e.popoverEl})],2)]),_:3},8,["popper-class","visible"])}function C(e,n){n===void 0&&(n={});var t=n.insertAt;if(!(!e||typeof document=="undefined")){var a=document.head||document.getElementsByTagName("head")[0],o=document.createElement("style");o.type="text/css",t==="top"&&a.firstChild?a.insertBefore(o,a.firstChild):a.appendChild(o),o.styleSheet?o.styleSheet.cssText=e:o.appendChild(document.createTextNode(e))}}var ne=`.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(ne);var te=`.el-popover--no-padding {
  padding: 0 !important;
}
.el-popover.el-popper {
  min-width: unset !important;
}
.el-popper__arrow {
  display: none;
}`;C(te),S.render=ee,S.__scopeId="data-v-8823a666",S.__file="components/search-label/index.vue",S.install=e=>{e.component("es-search-label",S)},z("data-v-2ca3eff0");const ae={key:2,class:"button__text"};N();var E=w({props:{styles:{type:Object,default:()=>({})},type:{type:String,default:"default"},text:{type:String,default:""},plain:{type:Boolean,default:!1},iconBefore:{type:String,default:""},iconAfter:{type:String,default:""},fontColor:{type:String,default:""},icon:{type:String,default:""}},emits:["click"],setup(e,{emit:n}){return U(t=>({"2ca3eff0-fontColor":e.fontColor})),(t,a)=>e.type==="icon"?(s(),u("button",{key:0,class:"button__icon es-cursor--pointer",style:L(e.styles),onClick:a[0]||(a[0]=o=>n("click"))},[m("i",{class:$(e.icon)},null,2)],4)):(s(),u("button",{key:1,class:$(["button",[e.type,{plain:e.plain}]]),style:L(e.styles),onClick:a[1]||(a[1]=o=>n("click"))},[e.iconBefore===""?h(t.$slots,"before",{key:0}):c("v-if",!0),e.iconBefore!==""?(s(),u("i",{key:1,class:$(["icon",e.iconBefore])},null,2)):c("v-if",!0),e.text!==""?(s(),u("span",ae,M(e.text),1)):h(t.$slots,"default",{key:3}),e.iconAfter!==""?(s(),u("i",{key:4,class:$(["icon",e.iconAfter])},null,2)):c("v-if",!0),e.iconAfter===""?h(t.$slots,"after",{key:5}):c("v-if",!0)],6))}}),oe=`.button[data-v-2ca3eff0] {
  padding: 0 12px;
  border-radius: 4px;
  cursor: pointer;
  box-sizing: border-box;
  font-size: 14px;
  height: 30px;
  line-height: 30px;
  --button-font-color: var(--2ca3eff0-fontColor);
}
.button[data-v-2ca3eff0]:disabled {
  cursor: not-allowed;
}
.button__icon[data-v-2ca3eff0] {
  display: inline-block;
}
.button__text[data-v-2ca3eff0] {
  display: inline-block;
  height: 21px;
}
.button.error[data-v-2ca3eff0] {
  background-color: #ea4444;
  color: var(--button-font-color, #ffffff);
}
.button.pure[data-v-2ca3eff0] {
  background-color: unset;
  color: var(--button-font-color, #e4e5ec);
}
.button.default[data-v-2ca3eff0] {
  background: #5075e2;
  color: var(--button-font-color, #ffffff);
}
.button.default[data-v-2ca3eff0]:disabled {
  background: #5075e290;
}
.button.default.plain[data-v-2ca3eff0] {
  border: 1px solid #a7baf1;
  background: #ffffff;
  color: var(--button-font-color, #3e4051);
  box-shadow: 0px 1px 3px rgba(48, 88, 208, 0.1), 0px 2px 1px rgba(48, 88, 208, 0.06), 0px 1px 1px rgba(48, 88, 208, 0.08);
}
.button.error.plain[data-v-2ca3eff0] {
  border: 1px solid #a7baf1;
  background: #ffffff;
  color: var(--button-font-color, #da0000);
}`;C(oe),E.__scopeId="data-v-2ca3eff0",E.__file="components/button/index.vue",E.install=e=>{e.component("es-button",E)};var x=w({components:{ElInput:G},props:{prependText:{type:String,default:""},modelValue:{type:String,default:""},hasSuffix:{type:Boolean,default:!1}},emits:["update:modelValue"],setup(e,{emit:n}){const t=V("es-icon-search-line"),a=V(!1),o=b({get(){return e.modelValue},set(j){n("update:modelValue",j)}}),p=()=>{t.value="es-icon-close-line"},i=()=>{t.value="es-icon-search-line"},l=()=>{o.value=""},r=()=>{a.value=!0,p()},_=()=>{p()},f=()=>{a.value||i()},d=()=>{a.value=!1,i()},F=b(()=>o.value===""?"es-icon-search-line":t.value);return{suffixIcon:t,suffixIcon2Clear:p,suffixIcon2Search:i,clearInput:l,suffixIconShow:F,inputModel:o,blur:d,focus:r,mouseout:f,mouseover:_}}});z("data-v-4da67c3c");const le={class:"es-input"},se={class:"es-input__prepend"};N();function re(e,n,t,a,o,p){const i=g("el-input");return s(),u("div",le,[T(i,P(e.$attrs,{modelValue:e.inputModel,"onUpdate:modelValue":n[3]||(n[3]=l=>e.inputModel=l),onFocus:e.focus,onBlur:e.blur,onMouseover:D(e.mouseover,["self"]),onMouseout:D(e.mouseout,["self"])}),O({_:2},[e.prependText!==""?{name:"prepend",fn:v(()=>[m("span",se,M(e.prependText),1)])}:void 0,e.hasSuffix?void 0:{name:"suffix",fn:v(()=>[m("span",{class:$(["el-input__icon",e.suffixIconShow]),onClick:n[0]||(n[0]=(...l)=>e.clearInput&&e.clearInput(...l)),onMouseover:n[1]||(n[1]=(...l)=>e.suffixIcon2Clear&&e.suffixIcon2Clear(...l)),onMouseout:n[2]||(n[2]=(...l)=>e.suffixIcon2Search&&e.suffixIcon2Search(...l))},null,34)])}]),1040,["modelValue","onFocus","onBlur","onMouseover","onMouseout"])])}var ie=`.es-input[data-v-4da67c3c] {
  display: inline-block;
}
.es-input__prepend[data-v-4da67c3c] {
  color: #9c9eb0;
}
[data-v-4da67c3c] .el-input {
  box-sizing: border-box;
  padding: 5px 12px 0 12px !important;
  line-height: 21px !important;
}
[data-v-4da67c3c] .el-input__inner {
  height: 28px !important;
  border: 0 !important;
  color: #282934 !important;
  line-height: 21px;
  border-bottom: 1px solid #a7baf1 !important;
  border-radius: unset !important;
  padding-right: 18px !important;
  padding-left: 0px !important;
  padding-bottom: 6px;
}
[data-v-4da67c3c] .el-input__suffix {
  position: absolute;
  right: 12px;
  top: 0;
}
[data-v-4da67c3c] .el-input__icon {
  line-height: 32px;
}
[data-v-4da67c3c] .el-input-group__prepend {
  background-color: unset;
  border: 0;
  border-bottom: 1px solid #a7baf1 !important;
  border-radius: 0;
  padding-left: 0;
  line-height: 21px;
  padding-bottom: 6px;
  padding-right: 6px;
}
[data-v-4da67c3c] .el-input__suffix
    .el-input__suffix-inner
    .el-input__icon.es-icon-close-line {
  cursor: pointer;
}`;C(ie),x.render=re,x.__scopeId="data-v-4da67c3c",x.__file="components/input/index.vue",x.install=e=>{e.component("es-input",x)};var B=w({components:{EsButton:E,EsInput:x},props:{showBtm:{type:Array,default:()=>["delete","close","update"]}},emits:["done","close","delete"],setup(e,{slots:n,emit:t}){const a=b(()=>e.showBtm.length),o=b(()=>{var f;return(f=e.showBtm)==null?void 0:f.includes("delete")}),p=b(()=>{var f;return(f=e.showBtm)==null?void 0:f.includes("close")}),i=b(()=>{var f;return(f=e.showBtm)==null?void 0:f.includes("update")});return{btmVisible:a,deleteVisible:o,closeVisible:p,updateVisible:i,slots:n,update:()=>{t("done")},deleteEvt:()=>{t("delete")},close:()=>{t("close")}}}});z("data-v-f553ffa8");const ue={class:"es-search-wrapper"},de={key:0,class:"es-search-wrapper__content"},pe={key:1,class:"es-search-wrapper__bottom"},ce={class:"es-search-wrapper__bottom__left"},fe=k("\u6E05\u7A7A"),ve={class:"es-search-wrapper__bottom__right"},be=k("\u5173\u95ED"),me=k("\u67E5\u8BE2");N();function he(e,n,t,a,o,p){const i=g("es-input"),l=g("es-button");return s(),u("div",ue,[T(i,W(H(e.$attrs)),null,16),e.slots.content?(s(),u("div",de,[h(e.$slots,"content")])):c("v-if",!0),e.btmVisible?(s(),u("div",pe,[m("div",ce,[e.deleteVisible?(s(),y(l,{key:0,type:"error",onClick:e.deleteEvt},{default:v(()=>[fe]),_:1},8,["onClick"])):c("v-if",!0)]),m("div",ve,[e.closeVisible?(s(),y(l,{key:0,plain:"",onClick:e.close},{default:v(()=>[be]),_:1},8,["onClick"])):c("v-if",!0),e.updateVisible?(s(),y(l,{key:1,class:"es-margin-l--base",onClick:e.update},{default:v(()=>[me]),_:1},8,["onClick"])):c("v-if",!0)])])):c("v-if",!0)])}var _e=`.es-search-wrapper[data-v-f553ffa8] {
  display: inline-block;
  background: #ffffff;
  flex-direction: column;
  /* shadow/400 */
  box-shadow: 0px 6px 12px -6px rgba(24, 39, 75, 0.12), 0px 8px 24px -4px rgba(24, 39, 75, 0.08);
  border-radius: 4px;
}
.es-search-wrapper__content[data-v-f553ffa8] {
  width: 100%;
  margin-top: 8px;
}
.es-search-wrapper__bottom[data-v-f553ffa8] {
  height: 36px;
  margin-top: 8px;
  display: flex;
  justify-content: space-between;
}
.es-search-wrapper__bottom__left[data-v-f553ffa8] {
  margin-left: 12px;
}
.es-search-wrapper__bottom__right[data-v-f553ffa8] {
  margin-right: 12px;
}
[data-v-f553ffa8] .es-input {
  width: 100%;
  min-width: 331px;
  padding: 0 12px;
}
[data-v-f553ffa8] .el-input-group {
  display: flex;
}
[data-v-f553ffa8] .el-input__inner {
  flex: 1;
}
[data-v-f553ffa8] .es-option {
  box-shadow: unset !important;
  border-radius: unset !important;
}
[data-v-f553ffa8] .es-option__content__item {
  width: 100%;
  box-sizing: border-box;
}`;C(_e),B.render=he,B.__scopeId="data-v-f553ffa8",B.__file="components/search-wrapper/index.vue",B.install=e=>{e.component("es-search-wrapper",B)};var I=w({components:{EsButton:E,EsInput:x},props:{showBtm:{type:Array,default:()=>["delete","close","update"]},modelValue:String,prependText:String,placeholder:String},emits:["done","close","delete","update:modelValue"],setup(e,{slots:n,emit:t}){const a=b({get(){var d;return(d=e.modelValue)!=null?d:""},set(d){d.length&&/^[1-9][0-9]*$/.test(d)?t("update:modelValue",d):t("update:modelValue","")}}),o=b(()=>e.showBtm.length),p=b(()=>{var d;return(d=e.showBtm)==null?void 0:d.includes("delete")}),i=b(()=>{var d;return(d=e.showBtm)==null?void 0:d.includes("close")}),l=b(()=>{var d;return(d=e.showBtm)==null?void 0:d.includes("update")});return{btmVisible:o,deleteVisible:p,closeVisible:i,updateVisible:l,slots:n,update:()=>{t("done")},deleteEvt:()=>{t("delete")},close:()=>{t("close")},numberValue:a}}});z("data-v-7447c320");const ge={class:"es-search-wrapper"},ye={key:0,class:"es-search-wrapper__content"},$e={key:1,class:"es-search-wrapper__bottom"},xe={class:"es-search-wrapper__bottom__left"},we=k("\u6E05\u7A7A"),Ve={class:"es-search-wrapper__bottom__right"},ke=k("\u5173\u95ED"),Se=k("\u67E5\u8BE2");N();function Ce(e,n,t,a,o,p){const i=g("es-input"),l=g("es-button");return s(),u("div",ge,[T(i,{modelValue:e.numberValue,"onUpdate:modelValue":n[0]||(n[0]=r=>e.numberValue=r),modelModifiers:{trim:!0,number:!0},placeholder:e.placeholder,"prepend-text":e.prependText},null,8,["modelValue","placeholder","prepend-text"]),e.slots.content?(s(),u("div",ye,[h(e.$slots,"content")])):c("v-if",!0),e.btmVisible?(s(),u("div",$e,[m("div",xe,[e.deleteVisible?(s(),y(l,{key:0,type:"error",onClick:e.deleteEvt},{default:v(()=>[we]),_:1},8,["onClick"])):c("v-if",!0)]),m("div",Ve,[e.closeVisible?(s(),y(l,{key:0,plain:!0,onClick:e.close},{default:v(()=>[ke]),_:1},8,["onClick"])):c("v-if",!0),e.updateVisible?(s(),y(l,{key:1,class:"es-margin-l--base",onClick:e.update},{default:v(()=>[Se]),_:1},8,["onClick"])):c("v-if",!0)])])):c("v-if",!0)])}var Ee=`.es-search-wrapper[data-v-7447c320] {
  display: inline-block;
  background: #ffffff;
  flex-direction: column;
  /* shadow/400 */
  box-shadow: 0px 6px 12px -6px rgba(24, 39, 75, 0.12), 0px 8px 24px -4px rgba(24, 39, 75, 0.08);
  border-radius: 4px;
}
.es-search-wrapper__content[data-v-7447c320] {
  width: 100%;
  margin-top: 8px;
}
.es-search-wrapper__bottom[data-v-7447c320] {
  height: 36px;
  margin-top: 8px;
  display: flex;
  justify-content: space-between;
}
.es-search-wrapper__bottom__left[data-v-7447c320] {
  margin-left: 12px;
}
.es-search-wrapper__bottom__right[data-v-7447c320] {
  margin-right: 12px;
}
[data-v-7447c320] .es-input {
  width: 100%;
  min-width: 331px;
}
[data-v-7447c320] .es-option {
  box-shadow: unset !important;
  border-radius: unset !important;
}
[data-v-7447c320] .es-option__content__item {
  width: 100%;
  box-sizing: border-box;
}`;C(Ee),I.render=Ce,I.__scopeId="data-v-7447c320",I.__file="components/search-wrapper-number/index.vue",I.install=e=>{e.component("es-search-wrapper-number",I)};var A=w({components:{EsSearchLabel:S,EsSearchWrapper:B,EsSearchWrapperNumber:I},props:{label:[String,Number],modelValue:[String,Number],placeholder:String,prependText:String,defaultValue:{type:[String,Number],default:null},defaultLabel:{type:String,default:"\u5168\u90E8"},labelFormat:[Function]},emits:["update:modelValue","done","clear","close"],setup(e,{emit:n}){const t=V(""),a=V(""),o=()=>{Number(t.value)===e.defaultValue||t.value===""?a.value=String(e.defaultLabel):a.value=(e==null?void 0:e.labelFormat)?e==null?void 0:e.labelFormat(t.value):t.value},p=r=>{t.value===""?(a.value=e.defaultLabel,n("update:modelValue",e.defaultValue),n("done",e.defaultValue)):(o(),n("update:modelValue",t.value),n("done",t.value),r&&r())};return R(()=>e.modelValue,r=>{Number(r)===e.defaultValue?(t.value="",a.value=e.defaultLabel):(t.value=String(r),o())},{immediate:!0}),{value:t,clearInput:r=>{t.value="",a.value=e.defaultLabel,n("update:modelValue",e.defaultValue),n("clear",e.defaultValue),r&&r()},valueLabel:a,done:p,close:r=>{t.value=String(e.modelValue),Number(t.value)===e.defaultValue?(t.value="",a.value=e.defaultLabel,n("close",e.defaultValue)):(o(),n("close",t.value)),r&&r()}}}});const Be={class:"es-search-input-number"};function Ie(e,n,t,a,o,p){const i=g("es-search-wrapper-number"),l=g("es-search-label");return s(),u("div",Be,[T(l,{label:e.label,value:e.valueLabel},{panel:v(({closePanel:r})=>[T(i,{modelValue:e.value,"onUpdate:modelValue":n[0]||(n[0]=_=>e.value=_),placeholder:e.placeholder,prependText:e.prependText,onDone:_=>e.done(r),onDelete:_=>e.clearInput(r),onClose:_=>e.close(r)},null,8,["modelValue","placeholder","prependText","onDone","onDelete","onClose"])]),_:1},8,["label","value"])])}A.render=Ie,A.__file="components/search-input-number/index.vue",A.install=e=>{e.component("es-search-input-number",A)};export{A as default};