@farris/ui-vue
Version:
Farris Vue, a Farris Design based Vue3 component library.
2 lines (1 loc) • 9.73 kB
JavaScript
(function(b,B){typeof exports=="object"&&typeof module<"u"?B(exports,require("../common/index.umd.js"),require("vue"),require("bignumber.js"),require("../locale/index.umd.js")):typeof define=="function"&&define.amd?define(["exports","../common/index.umd.js","vue","bignumber.js","../locale/index.umd.js"],B):(b=typeof globalThis<"u"?globalThis:b||self,B(b["number-spinner"]={},b.common,b.Vue,b.BigNumber,b.locale))})(this,function(b,B,u,V,G){"use strict";const P={id:String,disabled:{type:Boolean,default:!1},readonly:{type:Boolean,default:!1},editable:{type:Boolean,default:!0},formatter:{type:Function},parser:{type:Function},placeholder:{type:String,default:"请输入数字"},step:{type:Number,default:1},max:{type:[Number,String]},min:{type:[Number,String]},showButton:{type:Boolean,default:!0},useThousands:{type:Boolean,default:!0},textAlign:{type:String,default:"left"},autoDecimal:{type:Boolean,default:!0},nullable:{type:Boolean,default:!1},precision:{type:Number,default:0},prefix:{type:String,default:""},suffix:{type:String,default:""},decimalSeparator:{type:String,default:"."},forcePlaceholder:{Type:Boolean,default:!1},groupSeparator:{type:String,default:","},groupSize:{type:Number,default:3},value:{type:[Number,String],default:""},showZero:{type:Boolean,default:!0},modelValue:{type:[Number,String],default:""},focusOnCreated:{type:Boolean,default:!1},selectOnCreated:{type:Boolean,default:!1},keyboard:{type:Boolean,default:!0},bigNumber:{type:Boolean,default:!1},needValid:{type:Boolean,default:!1},updateOn:{type:String,default:"change"}};function R(e,s,y,S){const{format:m}=y,{displayValue:g,getRealValue:w,modelValue:l,onNumberValueChanged:f}=S;function n(){const c=new V(l.value||0);return!((e.max||e.max===0)&&!new V(e.max).isNaN()&&c.gte(new V(e.max))&&(l.value||l.value===0))}function x(){const c=new V(l.value||0);return!((e.min||e.min===0)&&!new V(e.min).isNaN()&&c.lte(new V(e.min))&&(l.value||l.value===0))}function t(c){if(e.readonly||e.disabled)return;const O=c==="up"?n:x,T=c==="up"?"plus":"minus";if(O()){const j=new V(l.value||0)[T](Number(e.step)),D=j.toFixed();g.value=m(D),f(w(j))}}function r(){t("up")}function i(){t("down")}function v(c){r()}function N(c){i()}return{canDownward:x,canUpward:n,downward:i,onClickDownButton:N,onClickUpButton:v,upward:r}}function K(e,s,y){const S=u.computed(()=>({prefix:e.prefix,suffix:e.suffix,decimalSeparator:e.decimalSeparator,groupSeparator:e.useThousands?e.groupSeparator:"",groupSize:e.groupSize})),{getValidNumberObject:m,precision:g}=y;function w(n){return n=n==null||n===""?"":String(n),n=n.replace(new RegExp(e.prefix,"g"),"").replace(new RegExp(e.suffix,"g"),"").replace(/,/g,""),e.groupSeparator&&e.groupSeparator!==","&&(n=n.replace(new RegExp(`\\${e.groupSeparator}`,"g"),"")),e.decimalSeparator&&e.decimalSeparator!=="."&&(n=n.replace(new RegExp(`\\${e.decimalSeparator}`,"g"),".")),n}function l(n,x){return e.precision!==null&&e.precision!==void 0?n.toFormat(g.value,x):n.toFormat(x)}function f(n,x=!0){const t=w(n),r=new V(t,10);let i=r;return x&&(i=m(r)),i.valueOf()==="0"&&!e.showZero||i.isNaN()?"":e.formatter?e.formatter(i.toNumber()):l(i,S.value)}return{cleanFormat:w,format:f}}function E(e,s){const y=u.ref(""),S=u.ref(e.modelValue),m=u.computed(()=>Number(e.precision)||0),g=u.ref(e.bigNumber);function w(t){return t.toFixed(m.value)}function l(t){return isNaN(t)||t===null||t===void 0||t===""}function f(t){const r=l(e.max)?null:new V(String(e.max),10),i=l(e.min)?null:new V(String(e.min),10);return r&&t.gt(r)?r:i&&t.lt(i)?i:t}function n(t,r=!0){if(e.parser)return isNaN(Number(t))?e.parser(t):t;let i=new V(t,10);if(r&&(i=f(i)),i.isNaN()){if(e.nullable)return null;if(e.showZero&&r)return 0;if(!r)return null;const N=new V(""+e.min,10),c=new V(""+e.max,10);if(!N.isNaN())i=N;else if(!c.isNaN())i=c;else return 0}return w(i)}function x(t){let r=g.value?t:Number(t);e.nullable&&t===null&&(r=null),r!==e.modelValue&&(s.emit("update:modelValue",r),s.emit("valueChange",r),s.emit("change",r))}return{displayValue:y,getRealValue:n,modelValue:S,isEmpty:l,onNumberValueChanged:x,precision:m,getValidNumberObject:f,toFixed:w}}function I(e,s,y,S,m){const{cleanFormat:g,format:w}=y,{displayValue:l,getRealValue:f,modelValue:n,isEmpty:x,onNumberValueChanged:t,getValidNumberObject:r,toFixed:i}=S,{downward:v,upward:N}=m,c=u.ref(!1),O=u.computed(()=>l.value);function T(a){var C;if(a.stopPropagation(),c.value=!1,e.readonly||e.disabled)return;const o=(C=a.target)==null?void 0:C.value,d=g(o);let h=f(d,e.needValid);e.needValid&&h!=null&&(h=i(r(new V(h,10)))),l.value=w(h,e.needValid),e.updateOn==="blur"&&t(h),s.emit("blur",{event:a,formatted:l.value,value:n.value})}function q(){const a=n.value;if(x(a)||!e.showZero&&a===0)return"";const o=f(a,e.needValid);if(!o&&o!==0)return"";try{const d=new V(o,10);return d.isNaN()||!d.isFinite()?"":d.toFixed()}catch{return""}}function j(a){if(a.stopPropagation(),c.value=!0,e.readonly||e.disabled)return;const o=f(n.value,e.needValid);l.value=q(),s.emit("focus",{event:a,formatted:o,value:n.value})}function D(a){var C;a.stopPropagation();let o=(C=a.target)==null?void 0:C.value;e.nullable||(o=o||0);const d=g(o);let h=f(d,e.needValid);e.updateOn==="change"&&(e.needValid&&(h=i(r(new V(h,10)))),l.value=o,t(h)),s.emit("input",h)}function J(a){const o=a;return o.value.substring((o==null?void 0:o.selectionStart)||0,(o==null?void 0:o.selectionEnd)||0)}function Q(a){const{key:o,keyCode:d,target:h,ctrlKey:C,metaKey:X,shiftKey:z}=a;if(!h)return;const _=h,F=_.value,Y=Number(e.precision),$=new Set([".","-","%"]),ee=J(h);if($.has(o)&&F.includes(o)&&!ee.includes(o)||e.precision===0&&[110,190].includes(d)){a.preventDefault();return}const te=new Set([46,8,9,27,13,110,190,173]),ne=new Set([65,67,86,88]),ae=new Set([...Array.from({length:5},(k,p)=>35+p),189,109]);if(te.has(d)||ne.has(d)&&(C||X)||ae.has(d))return;if(!(!z&&(d>=48&&d<=57||d>=96&&d<=105))){a.preventDefault();return}if((z||d<48||d>57)&&(d<96||d>105)&&a.preventDefault(),F.includes(".")&&e.precision){const k=F.indexOf("."),p=F.length-k-1;if((_.selectionStart||0)>k&&p>=Y)return a.preventDefault(),!1}}const M=a=>{var h;let o=(h=a.target)==null?void 0:h.value;e.nullable||(o=o||0);const d=g(o);n.value=f(d)};function W(a){return e.keyboard&&a.key==="ArrowDown"&&(a.preventDefault(),M(a),v(),a.stopPropagation()),e.keyboard&&a.key==="ArrowUp"&&(a.preventDefault(),M(a),N(),a.stopPropagation()),Q(a)}return{textBoxValue:O,onBlurTextBox:T,onFocusTextBox:j,onInput:D,onKeyDown:W,isFocus:c}}function A(e,s,y){const{canDownward:S,canUpward:m,onClickDownButton:g,onClickUpButton:w}=y,l=u.computed(()=>({"input-group-append":!0,"btn-group":!0,"btn-group-number":!0})),f=u.computed(()=>({btn:!0,"btn-secondary":!0,"btn-number-flag":!0})),n=u.computed(()=>({cursor:m()?"pointer":"not-allowed","margin-left":0})),x=u.computed(()=>({cursor:S()?"pointer":"not-allowed","margin-left":0}));return()=>u.createVNode("div",{class:l.value},[u.createVNode("button",{class:f.value,style:n.value,onClick:w,disabled:!m()},[u.createVNode("span",{class:"f-icon f-icon-arrow-chevron-up number-arrow-chevron",style:"cursor: inherit"},null)]),u.createVNode("button",{class:f.value,style:x.value,onClick:g,disabled:!S()},[u.createVNode("span",{class:"f-icon f-icon-arrow-chevron-down number-arrow-chevron",style:"cursor: inherit"},null)])])}function L(e){function s(m,g,w){return g===w?G.LocaleService.getLocaleValue(m):g||""}const y=s("numberSpinner.placeholder",e.placeholder,"请输入数字"),S={begin:s("numberSpinner.range.begin",e.beginPlaceholder,"开始数字"),end:s("numberSpinner.range.end",e.endPlaceholder,"结束数字")};return{placeholder:y,range:S}}function U(e,s,y){const S=L(e),m=u.ref(),{onBlurTextBox:g,onFocusTextBox:w,onInput:l,onKeyDown:f,textBoxValue:n}=y,x=u.computed(()=>(e.disabled||e.readonly||!e.editable)&&!e.forcePlaceholder?"":S.placeholder),t=u.computed(()=>({"form-control":!0,"f-utils-fill":!0})),r=u.computed(()=>({"text-align":e.textAlign}));function i(c){c.stopPropagation()}function v(){var c,O;e.selectOnCreated&&((c=m.value)==null||c.select()),e.focusOnCreated&&((O=m.value)==null||O.focus({preventScroll:!0}))}async function N(c){w(c),await u.nextTick,v()}return u.onMounted(async()=>{await u.nextTick,v()}),()=>u.createVNode("input",{ref:m,class:t.value,style:r.value,type:"text",value:n.value,disabled:e.disabled,readonly:e.readonly||!e.editable,placeholder:x.value,onBlur:g,onChange:i,onFocus:N,onInput:l,onKeydown:f,title:n.value},null)}const Z=u.defineComponent({name:"FNumberSpinner",props:P,emits:["update:modelValue","valueChange","change","blur","focus","click","input"],setup(e,s){const y=E(e,s),S=K(e,s,y),m=R(e,s,S,y),g=I(e,s,S,y,m),w=A(e,s,m),{displayValue:l,modelValue:f,getRealValue:n}=y,x=U(e,s,g),{format:t}=S,{isFocus:r}=g,i=u.computed(()=>!e.disabled&&!e.readonly&&e.showButton),v=u.computed(()=>({"input-group":!0,"flex-row":!0,"f-cmp-number-spinner":!0,"f-state-disabled":e.disable,"f-state-readonly":e.readonly&&!e.disable,"f-state-focus":r.value&&!e.readonly&&!e.disable,"spinner-hidden":!i.value}));return u.onMounted(()=>{const N=n(e.modelValue,!1);l.value=t(N,!1)}),u.watch(()=>[e.value],([N])=>{const c=n(N,!1);f.value=c,l.value=t(c,!1)}),u.watch(()=>[e.modelValue],([N])=>{N!==f.value&&(f.value=N,!r.value&&(l.value=t(n(N,!1),!1)))}),u.watch(()=>[e.precision,e.useThousands,e.prefix,e.suffix,e.showZero],()=>{l.value=t(f.value,!1)}),()=>u.createVNode("div",{class:v.value,id:e.id},[x(),i.value&&w()])}}),H=B.withInstall(Z);b.FNumberSpinner=Z,b.default=H,b.getNumberTextBoxRender=U,b.getSpinnerRender=A,b.numberSpinnerProps=P,b.useFormat=K,b.useNumber=E,b.useNumberLocales=L,b.useSpinner=R,b.useTextBox=I,Object.defineProperties(b,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});