vxe-pc-ui/lib/number-input/src/number-input.min.js

A vue based PC component library

"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _vue=require("vue"),_xeUtils=_interopRequireDefault(require("xe-utils")),_ui=require("../../ui"),_utils=require("../../ui/src/utils"),_dom=require("../../ui/src/dom"),_vn=require("../..//ui/src/vn"),_util=require("./util");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}var _default=exports.default=(0,_vue.defineComponent)({name:"VxeNumberInput",props:{modelValue:[String,Number],immediate:{type:Boolean,default:!0},name:String,type:{type:String,default:"number"},clearable:{type:Boolean,default:()=>(0,_ui.getConfig)().numberInput.clearable},readonly:{type:Boolean,default:null},disabled:{type:Boolean,default:null},placeholder:String,maxLength:{type:[String,Number],default:()=>(0,_ui.getConfig)().numberInput.maxLength},autoComplete:{type:String,default:"off"},align:String,form:String,className:String,size:{type:String,default:()=>(0,_ui.getConfig)().numberInput.size||(0,_ui.getConfig)().size},min:{type:[String,Number],default:null},max:{type:[String,Number],default:null},step:[String,Number],exponential:{type:Boolean,default:()=>(0,_ui.getConfig)().numberInput.exponential},showCurrency:{type:Boolean,default:()=>(0,_ui.getConfig)().numberInput.showCurrency},currencySymbol:{type:String,default:()=>(0,_ui.getConfig)().numberInput.currencySymbol},controls:{type:Boolean,default:()=>(0,_ui.getConfig)().numberInput.controls},digits:{type:[String,Number],default:null},autoFill:{type:Boolean,default:()=>(0,_ui.getConfig)().numberInput.autoFill},editable:{type:Boolean,default:!0},prefixIcon:String,suffixIcon:String,maxlength:[String,Number],autocomplete:String},emits:["update:modelValue","input","change","keydown","keyup","wheel","click","focus","blur","clear","prev-number","next-number","prefix-click","suffix-click"],setup(h,e){const{slots:V,emit:a}=e,i=(0,_vue.inject)("$xeForm",null),n=(0,_vue.inject)("xeFormItemInfo",null);var u=_xeUtils.default.uniqueId();const w=(0,_ui.useSize)(h)["computeSize"],U=(0,_vue.reactive)({isFocus:!1,isActivated:!1,inputValue:h.modelValue}),r={},I=(0,_vue.ref)(),S=(0,_vue.ref)(),M=(0,_vue.ref)(),O={refElem:I,refInput:S},l={xID:u,props:h,context:e,reactData:U,internalData:r,getRefMaps:()=>O};let o={};const C=(0,_vue.computed)(()=>{var e=h["readonly"];return null===e?!!i&&i.props.readonly:e}),A=(0,_vue.computed)(()=>{var e=h["disabled"];return null===e?!!i&&i.props.disabled:e}),s=(0,_vue.computed)(()=>{var{type:e,digits:t}=h;let u=t;return null===u&&null===(u=(0,_ui.getConfig)().numberInput.digits)&&"amount"===e&&(u=2),_xeUtils.default.toInteger(u)||1}),v=(0,_vue.computed)(()=>{var e=h["type"];return"float"===e||"amount"===e}),R=(0,_vue.computed)(()=>{var e=h["type"],t=s.value,u=v.value,l=h.step;return"integer"===e?_xeUtils.default.toInteger(l)||1:u?_xeUtils.default.toNumber(l)||1/Math.pow(10,t):_xeUtils.default.toNumber(l)||1}),T=(0,_vue.computed)(()=>h.clearable),B=(0,_vue.computed)(()=>{var e=h["editable"];return C.value||!e}),D=(0,_vue.computed)(()=>{var e=h["placeholder"];return(e=e||(0,_ui.getConfig)().numberInput.placeholder)?(0,_utils.getFuncText)(e):(0,_ui.getI18n)("vxe.base.pleaseInput")}),L=(0,_vue.computed)(()=>{var{maxLength:e,maxlength:t}=h;return _xeUtils.default.toNumber(e||t)||16}),d=(0,_vue.computed)(()=>{var e=h["immediate"];return e}),p=(0,_vue.computed)(()=>{var e=h["type"],t=U["inputValue"];return"integer"===e?_xeUtils.default.toInteger((0,_util.handleNumber)(t)):_xeUtils.default.toNumber((0,_util.handleNumber)(t))}),P=(0,_vue.computed)(()=>{var{type:t,showCurrency:u,currencySymbol:l,autoFill:a}=h,i=U["inputValue"],n=s.value;if("amount"!==t)return _xeUtils.default.toString(i);{var t=_xeUtils.default.toNumber(i);let e=_xeUtils.default.commafy(t,{digits:n});return a||([i,t]=e.split("."),t&&(n=t.replace(/0+$/,""),e=n?[i,".",n].join(""):i)),u?""+(l||(0,_ui.getI18n)("vxe.numberInput.currencySymbol")||"")+e:e}}),_=(0,_vue.computed)(()=>{var e=h["min"],t=U["inputValue"],u=p.value;return!(!t&&0!==t||null===e)&&u<=_xeUtils.default.toNumber(e)}),c=(0,_vue.computed)(()=>{var e=h["max"],t=U["inputValue"],u=p.value;return!(!t&&0!==t||null===e)&&u>=_xeUtils.default.toNumber(e)}),m=e=>_xeUtils.default.eqNull(e)?"":""+e,f=e=>{var{exponential:t,autoFill:u}=h,l=L.value,a=s.value;let i="";return v.value?(i=(0,_util.toFloatValueFixed)(e,a),u||(i=m(_xeUtils.default.toNumber(i)))):i=m(e),!t||e!==i&&m(e).toLowerCase()!==_xeUtils.default.toNumber(i).toExponential()?i.slice(0,l):e},b=e=>{var t=U["inputValue"];o.dispatchEvent(e.type,{value:t},e)},g=(e,t,u)=>{var e=(0,_utils.eqEmptyValue)(e)?null:Number(e),l=e!==h.modelValue;l&&(r.isUM=!0,a("update:modelValue",e)),U.inputValue!==t&&(0,_vue.nextTick)(()=>{U.inputValue=t||""}),o.dispatchEvent("input",{value:e},u),l&&(o.dispatchEvent("change",{value:e},u),i)&&n&&i.triggerItemEvent(u,n.itemConfig.field,e)},x=(e,t)=>{var u=d.value,l=(0,_utils.eqEmptyValue)(e)?null:_xeUtils.default.toNumber(e);U.inputValue=e,u?g(l,e,t):o.dispatchEvent("input",{value:l},t)},Y=e=>{var t=e.target.value;x(t,e)},G=e=>{d.value||b(e)},W=e=>{var t;B.value||(t=U["inputValue"],U.inputValue=(0,_utils.eqEmptyValue)(t)?"":""+_xeUtils.default.toNumber(t),U.isFocus=!0,U.isActivated=!0,b(e))},j=e=>{var t;A.value||(t=U["inputValue"],o.dispatchEvent("prefix-click",{value:t},e))},K=(e,t)=>{focus(),g(null,"",e),o.dispatchEvent("clear",{value:t},e)},z=e=>{var t;A.value||(t=U["inputValue"],o.dispatchEvent("suffix-click",{value:t},e))},t=()=>{var u=h["autoFill"],l=U["inputValue"],a=s.value,e=v.value;if(e&&l){let e="",t=null;l&&(e=(0,_util.toFloatValueFixed)(l,a),t=_xeUtils.default.toNumber(e),u||(e=""+t)),l!==t?g(t,e,{type:"init"}):U.inputValue=e}},y=e=>null===h.max||_xeUtils.default.toNumber(e)<=_xeUtils.default.toNumber(h.max),E=e=>null===h.min||_xeUtils.default.toNumber(e)>=_xeUtils.default.toNumber(h.min),N=()=>{var{type:t,min:u,max:l,exponential:a}=h,i=U["inputValue"];if(!B.value)if((0,_utils.eqEmptyValue)(i)){let e=null,t=i;!u&&0!==u||(e=_xeUtils.default.toNumber(u),t=""+e),void g(e,""+(t||""),{type:"check"})}else if(i||u||l){let e="integer"===t?_xeUtils.default.toInteger((0,_util.handleNumber)(i)):_xeUtils.default.toNumber((0,_util.handleNumber)(i));E(e)?y(e)||(e=l):e=u,a&&(t=m(i).toLowerCase())===_xeUtils.default.toNumber(e).toExponential()&&(e=t);l=f(e);g((0,_utils.eqEmptyValue)(l)?null:Number(l),l,{type:"check"})}},$=e=>{var t=U["inputValue"],u=d.value,l=t?Number(t):null;u||g(l,m(t),e),N(),U.isFocus=!1,U.isActivated=!1,o.dispatchEvent("blur",{value:l},e),i&&n&&i.triggerItemEvent(e,n.itemConfig.field,l)},X=(e,t)=>{var{min:u,max:l,type:a}=h,i=U["inputValue"],n=R.value,a="integer"===a?_xeUtils.default.toInteger((0,_util.handleNumber)(i)):_xeUtils.default.toNumber((0,_util.handleNumber)(i)),i=e?_xeUtils.default.add(a,n):_xeUtils.default.subtract(a,n);let r;r=E(i)?y(i)?i:l:u,x(f(r),t)},k=e=>{var t=A.value,u=C.value,l=_.value;q(),t||u||l||X(!1,e),U.isActivated=!0,o.dispatchEvent("next-number",{value:U.inputValue},e)},H=e=>{r.dnTimeout=setTimeout(()=>{k(e),H(e)},60)},F=e=>{var t=A.value,u=C.value,l=c.value;q(),t||u||l||X(!0,e),U.isActivated=!0,o.dispatchEvent("prev-number",{value:U.inputValue},e)},J=e=>{var t=_ui.globalEvents.hasKey(e,_ui.GLOBAL_EVENT_KEYS.ARROW_UP),u=_ui.globalEvents.hasKey(e,_ui.GLOBAL_EVENT_KEYS.ARROW_DOWN);(t||u)&&(e.preventDefault(),(t?F:k)(e))},Q=e=>{var{exponential:t,controls:u}=h,l=B.value,a=e.ctrlKey,i=e.shiftKey,n=e.altKey,r=e.metaKey,o=e.keyCode,s=_ui.globalEvents.hasKey(e,_ui.GLOBAL_EVENT_KEYS.ESCAPE),v=_ui.globalEvents.hasKey(e,_ui.GLOBAL_EVENT_KEYS.ARROW_UP),d=_ui.globalEvents.hasKey(e,_ui.GLOBAL_EVENT_KEYS.ARROW_DOWN);a||i||n||r||!(_ui.globalEvents.hasKey(e,_ui.GLOBAL_EVENT_KEYS.SPACEBAR)||(!t||69!==o)&&65<=o&&o<=90||186<=o&&o<=188||191<=o)||e.preventDefault(),s?N():(v||d)&&u&&!l&&J(e),b(e)},Z=e=>{b(e)},q=()=>{var e=r["dnTimeout"];e&&(clearTimeout(e),r.dnTimeout=void 0)},ee=e=>{r.dnTimeout=setTimeout(()=>{F(e),ee(e)},60)},te=e=>{if(q(),0===e.button){const t=(0,_dom.hasClass)(e.currentTarget,"is--prev");(t?F:k)(e),r.dnTimeout=setTimeout(()=>{(t?ee:H)(e)},500)}},ue=e=>{var t=B.value;h.controls&&!t&&U.isActivated&&(e.stopPropagation(),e.preventDefault(),0<(t=e.deltaY)?k(e):t<0&&F(e)),b(e)},le=e=>{b(e)},ae=e=>{var t=U["isActivated"],u=I.value,l=M.value,a=A.value,i=B.value,n=d.value;a||i||!t||(U.isActivated=(0,_dom.getEventTargetNode)(e,u).flag||(0,_dom.getEventTargetNode)(e,l).flag,U.isActivated)||(n||(a=U["inputValue"],i=a?Number(a):null,g(i,m(a),e)),N())},ie=t=>{var u=h["clearable"],l=A.value,a=B.value;if(!l&&!a){l=_ui.globalEvents.hasKey(t,_ui.GLOBAL_EVENT_KEYS.TAB),a=_ui.globalEvents.hasKey(t,_ui.GLOBAL_EVENT_KEYS.DELETE);let e=U.isActivated;l&&(e&&N(),e=!1,U.isActivated=e),a&&u&&e&&K(t,null)}},ne=()=>{var e=U["isActivated"];e&&N()},re=()=>{var e=h["controls"],t=B.value;return e&&!t?(e=c.value,t=_.value,(0,_vue.h)("div",{class:"vxe-input--control-icon"},[(0,_vue.h)("div",{class:"vxe-input--number-icon"},[(0,_vue.h)("div",{class:["vxe-input--number-btn is--prev",{"is--disabled":e}],onMousedown:te,onMouseup:q,onMouseleave:q},[(0,_vue.h)("i",{class:(0,_ui.getIcon)().NUMBER_INPUT_PREV_NUM})]),(0,_vue.h)("div",{class:["vxe-input--number-btn is--next",{"is--disabled":t}],onMousedown:te,onMouseup:q,onMouseleave:q},[(0,_vue.h)("i",{class:(0,_ui.getIcon)().NUMBER_INPUT_NEXT_NUM})])])])):(0,_vue.createCommentVNode)()};o={dispatchEvent:(e,t,u)=>{a(e,(0,_ui.createEvent)(u,{$numberInput:l},t))},focus(){var e;return B.value||(e=S.value,U.isActivated=!0,e.focus()),(0,_vue.nextTick)()},blur(){return S.value.blur(),(U.isActivated=!1,_vue.nextTick)()},select(){return S.value.select(),(U.isActivated=!1,_vue.nextTick)()}},Object.assign(l,o);return l.renderVN=()=>{var e,t,u,l,a,i,n,r,o,{className:s,controls:v,type:d,align:p,name:_,autocomplete:c,autoComplete:m}=h,{inputValue:f,isFocus:b,isActivated:g}=U,x=w.value,y=A.value,E=C.value,N=P.value;return E?(0,_vue.h)("div",{ref:I,class:["vxe-number-input--readonly","type--"+d,s]},N):(E=B.value,e=L.value,t=D.value,u=T.value,a=h.prefixIcon,l=(l=V.prefix)||a?(0,_vue.h)("div",{class:"vxe-number-input--prefix",onClick:j},[(0,_vue.h)("div",{class:"vxe-number-input--prefix-icon"},l?(0,_vn.getSlotVNs)(l({})):[(0,_vue.h)("i",{class:a})])]):null,a=h.suffixIcon,i=U.inputValue,n=V.suffix,r=A.value,o=T.value,r=(0,_vue.h)("div",{class:["vxe-number-input--suffix",{"is--clear":o&&!r&&!(""===i||_xeUtils.default.eqNull(i))}]},[o?(0,_vue.h)("div",{class:"vxe-number-input--clear-icon",onClick:K},[(0,_vue.h)("i",{class:(0,_ui.getIcon)().INPUT_CLEAR})]):(0,_vue.createCommentVNode)(),re(),n||a?(0,_vue.h)("div",{class:"vxe-number-input--suffix-icon",onClick:z},n?(0,_vn.getSlotVNs)(n({})):[(0,_vue.h)("i",{class:a})]):(0,_vue.createCommentVNode)()]),(0,_vue.h)("div",{ref:I,class:["vxe-number-input","type--"+d,s,{["size--"+x]:x,["is--"+p]:p,"is--controls":v&&!E,"is--prefix":!!l,"is--suffix":!!r,"is--disabled":y,"is--active":g,"show--clear":u&&!y&&!(""===f||_xeUtils.default.eqNull(f))}],spellcheck:!1},[l||(0,_vue.createCommentVNode)(),(0,_vue.h)("div",{class:"vxe-number-input--wrapper"},[(0,_vue.h)("input",{ref:S,class:"vxe-number-input--inner",value:b||"amount"!==d?f:N,name:_,type:"text",placeholder:t,maxlength:e,readonly:E,disabled:y,autocomplete:m||c,onKeydown:Q,onKeyup:Z,onWheel:ue,onClick:le,onInput:Y,onChange:G,onFocus:W,onBlur:$})]),r||(0,_vue.createCommentVNode)()]))},(0,_vue.watch)(()=>h.modelValue,t=>{if(!r.isUM){var u=h["autoFill"],l=U["inputValue"],a=s.value,i=v.value;if((0,_utils.eqEmptyValue)(t))U.inputValue="";else{let e=""+t;i&&(e=(0,_util.toFloatValueFixed)(t,a),u||(e=""+_xeUtils.default.toNumber(e))),e!==l&&(U.inputValue=e)}}r.isUM=!1}),(0,_vue.watch)(()=>h.type,()=>{Object.assign(U,{inputValue:h.modelValue}),t()}),(0,_vue.onMounted)(()=>{_ui.globalEvents.on(l,"mousedown",ae),_ui.globalEvents.on(l,"keydown",ie),_ui.globalEvents.on(l,"blur",ne)}),(0,_vue.onBeforeUnmount)(()=>{U.isFocus=!1,q(),N(),_ui.globalEvents.off(l,"mousedown"),_ui.globalEvents.off(l,"keydown"),_ui.globalEvents.off(l,"blur")}),t(),l},render(){return this.renderVN()}});