vxe-pc-ui/lib/textarea/src/textarea.min.js

A vue based PC component library

Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _vue=require("vue"),_comp=require("../../ui/src/comp"),_xeUtils=_interopRequireDefault(require("xe-utils")),_ui=require("../../ui"),_utils=require("../../ui/src/utils");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}let autoTxtElem;var _default=exports.default=(0,_comp.defineVxeComponent)({name:"VxeTextarea",props:{modelValue:[String,Number],className:String,immediate:{type:Boolean,default:!0},name:String,readonly:{type:Boolean,default:null},editable:{type:Boolean,default:!0},disabled:{type:Boolean,default:null},placeholder:String,maxLength:[String,Number],trim:{type:Boolean,default:()=>(0,_ui.getConfig)().textarea.trim},rows:{type:[String,Number],default:null},cols:{type:[String,Number],default:null},showWordCount:Boolean,countMethod:Function,autosize:[Boolean,Object],form:String,resize:{type:String,default:()=>(0,_ui.getConfig)().textarea.resize},size:{type:String,default:()=>(0,_ui.getConfig)().textarea.size||(0,_ui.getConfig)().size},maxlength:[String,Number]},emits:["update:modelValue","input","keydown","keyup","click","change","focus","blur","lazy-change"],setup(_,e){let a=e.emit,u=(0,_vue.inject)("$xeForm",null),l=(0,_vue.inject)("xeFormItemInfo",null);var t=_xeUtils.default.uniqueId();let g=(0,_ui.useSize)(_).computeSize,f=(0,_vue.reactive)({inputValue:_.modelValue}),h=(0,_vue.ref)(),b=(0,_vue.ref)(),i={refElem:h,refTextarea:b},r={xID:t,props:_,context:e,reactData:f,getRefMaps:()=>i},n={},y=(0,_vue.computed)(()=>{var e=_.readonly;return null===e?!!u&&u.props.readonly:e}),z=(0,_vue.computed)(()=>{var e=_.disabled;return null===e?!!u&&u.props.disabled:e}),V=(0,_vue.computed)(()=>{var{editable:e,readonly:t}=_;return t||!e}),E=(0,_vue.computed)(()=>{var e=_.placeholder;return(e=e||(0,_ui.getConfig)().textarea.placeholder)?(0,_utils.getFuncText)(e):(0,_ui.getI18n)("vxe.base.pleaseInput")}),N=(0,_vue.computed)(()=>{var{maxLength:e,maxlength:t}=_;return e||t}),T=(0,_vue.computed)(()=>_xeUtils.default.getSize(f.inputValue)),S=(0,_vue.computed)(()=>{var e=T.value,t=N.value;return t&&e>_xeUtils.default.toNumber(t)}),o=(0,_vue.computed)(()=>Object.assign({minRows:1,maxRows:10},(0,_ui.getConfig)().textarea.autosize,_.autosize)),d=()=>{var e,{size:t,autosize:u}=_,a=f.inputValue;u&&((autoTxtElem=autoTxtElem||document.createElement("div")).parentNode||document.body.appendChild(autoTxtElem),u=b.value)&&(e=getComputedStyle(u),autoTxtElem.className=["vxe-textarea--autosize",t?"size--"+t:""].join(" "),autoTxtElem.style.width=u.clientWidth+"px",autoTxtElem.style.padding=e.padding,autoTxtElem.innerText=(""+(a||"　")).replace(/\n$/,"\n　"))},s=()=>{_.autosize&&(0,_vue.nextTick)(()=>{var{minRows:t,maxRows:u}=o.value,a=b.value;if(a){var l=autoTxtElem.clientHeight,i=getComputedStyle(a),r=_xeUtils.default.toNumber(i.lineHeight),i=_xeUtils.default.toNumber(i.paddingTop)+_xeUtils.default.toNumber(i.paddingBottom)+_xeUtils.default.toNumber(i.borderTopWidth)+_xeUtils.default.toNumber(i.borderBottomWidth),l=(l-i)/r,l=l&&/[0-9]/.test(""+l)?l:Math.floor(l)+1;let e=l;l<t?e=t:u<l&&(e=u),a.style.height=e*r+i+"px"}})},w=e=>{var t=f.inputValue;r.dispatchEvent(e.type,{value:t},e)},v=(e,t)=>{_.trim&&(e=(""+(e||"")).trim()),f.inputValue=e,a("update:modelValue",e),_xeUtils.default.toValueString(_.modelValue)!==e&&(n.dispatchEvent("change",{value:e},t),u)&&l&&u.triggerItemEvent(t,l.itemConfig.field,e)},C=e=>{var t=_.immediate,u=e.target.value;f.inputValue=u,t&&v(u,e),r.dispatchEvent("input",{value:u},e),s()},U=e=>{var t=_.immediate;t?w(e):v(f.inputValue,e),r.dispatchEvent("lazy-change",{value:f.inputValue},e)},q=e=>{var t=_.immediate,u=f.inputValue;t||v(u,e),r.dispatchEvent("blur",{value:u},e)};n={dispatchEvent(e,t,u){a(e,(0,_ui.createEvent)(u,{$textarea:r},t))},focus(){return b.value.focus(),(0,_vue.nextTick)()},blur(){return b.value.blur(),(0,_vue.nextTick)()}},Object.assign(r,n),(0,_vue.watch)(()=>_.modelValue,e=>{f.inputValue=e,d()}),(0,_vue.watch)(o,()=>{d(),s()}),(0,_vue.nextTick)(()=>{var e=_.autosize;e&&(d(),s())});return r.renderVN=()=>{var{className:e,resize:t,autosize:u,showWordCount:a,countMethod:l,rows:i,cols:r}=_,n=f.inputValue,o=g.value,d=z.value,s=S.value,v=T.value,p=V.value,m=y.value,c=E.value,x=N.value;return m?(0,_vue.h)("div",{ref:h,class:["vxe-textarea--readonly",e]},n):(0,_vue.h)("div",{ref:h,class:["vxe-textarea",e,{["size--"+o]:o,"is--autosize":u,"is--count":a,"is--disabled":d,"is--rows":!_xeUtils.default.eqNull(i),"is--cols":!_xeUtils.default.eqNull(r)}],spellcheck:!1},[(0,_vue.h)("textarea",{ref:b,class:"vxe-textarea--inner",value:n,name:_.name,placeholder:c,maxlength:x,readonly:p,disabled:d,rows:i,cols:r,style:t?{resize:t}:null,onInput:C,onChange:U,onKeydown:w,onKeyup:w,onClick:w,onFocus:w,onBlur:q}),a?(0,_vue.h)("span",{class:["vxe-textarea--count",{"is--error":s}]},l?""+l({value:n}):v+(x?"/"+x:"")):null])},r},render(){return this.renderVN()}});