eslink-ui-plus/es/search-wrapper-number-range/index.js

vue3 component library, css framework

import{defineComponent as _,ref as F,computed as p,pushScopeId as k,popScopeId as V,resolveComponent as w,openBlock as r,createElementBlock as u,createVNode as C,mergeProps as U,withModifiers as N,createSlots as D,withCtx as h,createElementVNode as m,toDisplayString as T,normalizeClass as x,useCssVars as O,normalizeStyle as j,renderSlot as y,createCommentVNode as d,createBlock as S,createTextVNode as $}from"vue";import{ElInput as P}from"element-plus";var b=_({components:{ElInput:P},props:{prependText:{type:String,default:""},modelValue:{type:String,default:""},hasSuffix:{type:Boolean,default:!1}},emits:["update:modelValue"],setup(e,{emit:n}){const t=F("es-icon-search-line"),o=F(!1),i=p({get(){return e.modelValue},set(A){n("update:modelValue",A)}}),c=()=>{t.value="es-icon-close-line"},l=()=>{t.value="es-icon-search-line"},s=()=>{i.value=""},f=()=>{o.value=!0,c()},I=()=>{c()},M=()=>{o.value||l()},E=()=>{o.value=!1,l()},z=p(()=>i.value===""?"es-icon-search-line":t.value);return{suffixIcon:t,suffixIcon2Clear:c,suffixIcon2Search:l,clearInput:s,suffixIconShow:z,inputModel:i,blur:E,focus:f,mouseout:M,mouseover:I}}});k("data-v-4da67c3c");const q={class:"es-input"},G={class:"es-input__prepend"};V();function H(e,n,t,o,i,c){const l=w("el-input");return r(),u("div",q,[C(l,U(e.$attrs,{modelValue:e.inputModel,"onUpdate:modelValue":n[3]||(n[3]=s=>e.inputModel=s),onFocus:e.focus,onBlur:e.blur,onMouseover:N(e.mouseover,["self"]),onMouseout:N(e.mouseout,["self"])}),D({_:2},[e.prependText!==""?{name:"prepend",fn:h(()=>[m("span",G,T(e.prependText),1)])}:void 0,e.hasSuffix?void 0:{name:"suffix",fn:h(()=>[m("span",{class:x(["el-input__icon",e.suffixIconShow]),onClick:n[0]||(n[0]=(...s)=>e.clearInput&&e.clearInput(...s)),onMouseover:n[1]||(n[1]=(...s)=>e.suffixIcon2Clear&&e.suffixIcon2Clear(...s)),onMouseout:n[2]||(n[2]=(...s)=>e.suffixIcon2Search&&e.suffixIcon2Search(...s))},null,34)])}]),1040,["modelValue","onFocus","onBlur","onMouseover","onMouseout"])])}function B(e,n){n===void 0&&(n={});var t=n.insertAt;if(!(!e||typeof document=="undefined")){var o=document.head||document.getElementsByTagName("head")[0],i=document.createElement("style");i.type="text/css",t==="top"&&o.firstChild?o.insertBefore(i,o.firstChild):o.appendChild(i),i.styleSheet?i.styleSheet.cssText=e:i.appendChild(document.createTextNode(e))}}var J=`.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;
}`;B(J),b.render=H,b.__scopeId="data-v-4da67c3c",b.__file="components/input/index.vue",b.install=e=>{e.component("es-input",b)},k("data-v-2ca3eff0");const K={key:2,class:"button__text"};V();var g=_({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 O(t=>({"2ca3eff0-fontColor":e.fontColor})),(t,o)=>e.type==="icon"?(r(),u("button",{key:0,class:"button__icon es-cursor--pointer",style:j(e.styles),onClick:o[0]||(o[0]=i=>n("click"))},[m("i",{class:x(e.icon)},null,2)],4)):(r(),u("button",{key:1,class:x(["button",[e.type,{plain:e.plain}]]),style:j(e.styles),onClick:o[1]||(o[1]=i=>n("click"))},[e.iconBefore===""?y(t.$slots,"before",{key:0}):d("v-if",!0),e.iconBefore!==""?(r(),u("i",{key:1,class:x(["icon",e.iconBefore])},null,2)):d("v-if",!0),e.text!==""?(r(),u("span",K,T(e.text),1)):y(t.$slots,"default",{key:3}),e.iconAfter!==""?(r(),u("i",{key:4,class:x(["icon",e.iconAfter])},null,2)):d("v-if",!0),e.iconAfter===""?y(t.$slots,"after",{key:5}):d("v-if",!0)],6))}}),L=`.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);
}`;B(L),g.__scopeId="data-v-2ca3eff0",g.__file="components/button/index.vue",g.install=e=>{e.component("es-button",g)};var v=_({components:{EsInput:b,EsButton:g},props:{showBtm:{type:Array,default:()=>["delete","close","update"]},min:{type:[String,Number],default:""},max:{type:[String,Number],default:""}},emits:["done","close","delete","update:min","update:max"],setup(e,{slots:n,emit:t}){const o=p({get(){return String(e.min)},set(a){t("update:min",a)}}),i=p({get(){return String(e.max)},set(a){t("update:max",a)}}),c=p(()=>e.showBtm.length),l=p(()=>{var a;return(a=e.showBtm)==null?void 0:a.includes("delete")}),s=p(()=>{var a;return(a=e.showBtm)==null?void 0:a.includes("close")}),f=p(()=>{var a;return(a=e.showBtm)==null?void 0:a.includes("update")});return{btmVisible:c,deleteVisible:l,closeVisible:s,updateVisible:f,slots:n,update:()=>{t("done")},deleteEvt:()=>{t("delete")},close:()=>{t("close")},minValue:o,maxValue:i,emitMin:a=>{typeof a=="string"&&t("update:min",a)},emitMax:a=>{typeof a=="string"&&t("update:max",a)}}}});k("data-v-33957c90");const Q={class:"es-search-wrapper"},R=m("span",null,"-",-1),W={key:0,class:"es-search-wrapper__content"},X={key:1,class:"es-search-wrapper__bottom"},Y={class:"es-search-wrapper__bottom__left"},Z=$("\u6E05\u7A7A"),ee={class:"es-search-wrapper__bottom__right"},ne=$("\u5173\u95ED"),te=$("\u67E5\u8BE2");V();function oe(e,n,t,o,i,c){const l=w("es-input"),s=w("es-button");return r(),u("div",Q,[C(l,{hasSuffix:"",modelValue:e.minValue,"onUpdate:modelValue":n[0]||(n[0]=f=>e.minValue=f),modelModifiers:{number:!0},placeholder:"\u8BF7\u8F93\u5165\u6700\u5C0F\u503C"},null,8,["modelValue"]),R,C(l,{hasSuffix:"",modelValue:e.maxValue,"onUpdate:modelValue":n[1]||(n[1]=f=>e.maxValue=f),modelModifiers:{number:!0},placeholder:"\u8BF7\u8F93\u5165\u6700\u5927\u503C"},null,8,["modelValue"]),e.slots.content?(r(),u("div",W,[y(e.$slots,"content")])):d("v-if",!0),e.btmVisible?(r(),u("div",X,[m("div",Y,[e.deleteVisible?(r(),S(s,{key:0,type:"error",onClick:e.deleteEvt},{default:h(()=>[Z]),_:1},8,["onClick"])):d("v-if",!0)]),m("div",ee,[e.closeVisible?(r(),S(s,{key:0,plain:"",onClick:e.close},{default:h(()=>[ne]),_:1},8,["onClick"])):d("v-if",!0),e.updateVisible?(r(),S(s,{key:1,class:"es-margin-l--base",onClick:e.update},{default:h(()=>[te]),_:1},8,["onClick"])):d("v-if",!0)])])):d("v-if",!0)])}var ae=`.es-search-wrapper[data-v-33957c90] {
  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-33957c90] {
  width: 100%;
  margin-top: 8px;
}
.es-search-wrapper__bottom[data-v-33957c90] {
  height: 36px;
  margin-top: 8px;
  display: flex;
  justify-content: space-between;
}
.es-search-wrapper__bottom__left[data-v-33957c90] {
  margin-left: 12px;
}
.es-search-wrapper__bottom__right[data-v-33957c90] {
  margin-right: 12px;
}
[data-v-33957c90] .es-input {
  min-width: unset;
}
[data-v-33957c90] .es-option {
  box-shadow: unset !important;
  border-radius: unset !important;
}
[data-v-33957c90] .es-option__content__item {
  width: 100%;
  box-sizing: border-box;
}`;B(ae),v.render=oe,v.__scopeId="data-v-33957c90",v.__file="components/search-wrapper-number-range/index.vue",v.install=e=>{e.component("es-search-wrapper-number-range",v)};export{v as default};