vxe-pc-ui
Version:
A vue based PC component library
1 lines • 5.09 kB
JavaScript
;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"),_vn=require("../..//ui/src/vn");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}var _default=exports.default=(0,_vue.defineComponent)({name:"VxePasswordInput",props:{modelValue:String,immediate:{type:Boolean,default:!0},name:String,clearable:{type:Boolean,default:()=>(0,_ui.getConfig)().passwordInput.clearable},readonly:Boolean,disabled:Boolean,maxLength:[String,Number],placeholder:String,autoComplete:{type:String,default:"off"},className:String,size:{type:String,default:()=>(0,_ui.getConfig)().passwordInput.size||(0,_ui.getConfig)().size},prefixIcon:String,suffixIcon:String,controls:{type:Boolean,default:()=>(0,_ui.getConfig)().passwordInput.controls},autocomplete:String},emits:["update:modelValue","input","change","click","focus","blur","clear","toggle-visible","prefix-click","suffix-click"],setup(m,e){const{emit:i,slots:g}=e,u=(0,_vue.inject)("$xeForm",null),a=(0,_vue.inject)("xeFormItemInfo",null);var t=_xeUtils.default.uniqueId();const x=(0,_ui.useSize)(m)["computeSize"],h=(0,_vue.reactive)({showPwd:!1,isActivated:!1,inputValue:m.modelValue}),w=(0,_vue.ref)(),I=(0,_vue.ref)(),l={refElem:w,refInput:I},n={xID:t,props:m,context:e,reactData:h,getRefMaps:()=>l};let r={};const V=(0,_vue.computed)(()=>m.clearable),C=(0,_vue.computed)(()=>{var e=m["readonly"];return e}),b=(0,_vue.computed)(()=>{var e=m["placeholder"];return(e=e||(0,_ui.getConfig)().passwordInput.placeholder)?(0,_utils.getFuncText)(e):(0,_ui.getI18n)("vxe.base.pleaseInput")}),S=(0,_vue.computed)(()=>{var e=h["showPwd"];return e?"text":"password"}),s=(0,_vue.computed)(()=>{var e=m["immediate"];return e}),o=e=>{var t=h["inputValue"];r.dispatchEvent(e.type,{value:t},e)},v=(e,t)=>{var u=s.value;h.inputValue=e,u?c(e,t):r.dispatchEvent("input",{value:e},t)},E=e=>{var t=e.target.value;v(t,e)},c=(e,t)=>{h.inputValue=e,i("update:modelValue",e),r.dispatchEvent("input",{value:e},t),_xeUtils.default.toValueString(m.modelValue)!==e&&(r.dispatchEvent("change",{value:e},t),u)&&a&&u.triggerItemEvent(t,a.itemConfig.field,e)},N=e=>{o(e);var t=h["inputValue"];u&&a&&u.triggerItemEvent(e,a.itemConfig.field,t)},P=e=>{h.isActivated=!0,o(e)},k=e=>{var t=h["inputValue"];r.dispatchEvent("blur",{value:t},e),u&&a&&u.triggerItemEvent(e,a.itemConfig.field,t)},d=e=>{var{readonly:t,disabled:u}=m,i=h["showPwd"];u||t||(h.showPwd=!i),r.dispatchEvent("toggle-visible",{visible:h.showPwd},e)},y=e=>{o(e)},q=(e,t)=>{focus(),c("",e),r.dispatchEvent("clear",{value:t},e)},A=e=>{var t=m["disabled"];t||(t=h["inputValue"],r.dispatchEvent("suffix-click",{value:t},e))},D=e=>{var t=m["disabled"];t||(t=h["inputValue"],r.dispatchEvent("prefix-click",{value:t},e))},U=()=>{var e=h["showPwd"];return(0,_vue.h)("div",{class:"vxe-password-input--control-icon",onClick:d},[(0,_vue.h)("i",{class:["vxe-password-input--password-icon",e?(0,_ui.getIcon)().PASSWORD_INPUT_SHOW_PWD:(0,_ui.getIcon)().PASSWORD_INPUT_HIDE_PWD]})])};r={dispatchEvent(e,t,u){i(e,(0,_ui.createEvent)(u,{$passwordInput:n},t))},focus(){var e=I.value;return h.isActivated=!0,e.focus(),(0,_vue.nextTick)()},blur(){return I.value.blur(),(h.isActivated=!1,_vue.nextTick)()},select(){return I.value.select(),(h.isActivated=!1,_vue.nextTick)()}},Object.assign(n,r),(0,_vue.watch)(()=>m.modelValue,e=>{h.inputValue=e});return n.renderVN=()=>{var{className:e,name:t,disabled:u,readonly:i,autocomplete:a,autoComplete:l,maxLength:n}=m,{inputValue:r,isActivated:s}=h,o=x.value,v=C.value,c=S.value,d=b.value,p=V.value,_=(f=m.prefixIcon,(_=g.prefix)||f?(0,_vue.h)("div",{class:"vxe-password-input--prefix",onClick:D},[(0,_vue.h)("div",{class:"vxe-password-input--prefix-icon"},_?(0,_vn.getSlotVNs)(_({})):[(0,_vue.h)("i",{class:f})])]):null),f=(()=>{var{disabled:e,suffixIcon:t,controls:u}=m,i=h["inputValue"],a=g.suffix,l=V.value;return l||u||a||t?(0,_vue.h)("div",{class:["vxe-password-input--suffix",{"is--clear":l&&!e&&!(""===i||_xeUtils.default.eqNull(i))}]},[l?(0,_vue.h)("div",{class:"vxe-password-input--clear-icon",onClick:q},[(0,_vue.h)("i",{class:(0,_ui.getIcon)().INPUT_CLEAR})]):(0,_vue.createCommentVNode)(),(u?U:(0,_vue.createCommentVNode))(),a||t?(0,_vue.h)("div",{class:"vxe-password-input--suffix-icon",onClick:A},a?(0,_vn.getSlotVNs)(a({})):[(0,_vue.h)("i",{class:t})]):(0,_vue.createCommentVNode)()]):null})();return(0,_vue.h)("div",{ref:w,class:["vxe-password-input",e,{["size--"+o]:o,"is--prefix":!!_,"is--suffix":!!f,"is--readonly":i,"is--disabled":u,"is--active":s,"show--clear":p&&!u&&!(""===r||_xeUtils.default.eqNull(r))}],spellcheck:!1},[_||(0,_vue.createCommentVNode)(),(0,_vue.h)("div",{class:"vxe-password-input--wrapper"},[(0,_vue.h)("input",{ref:I,class:"vxe-password-input--inner",value:r,name:t,type:c,placeholder:d,readonly:v,disabled:u,autocomplete:a||l,maxlength:n,onClick:y,onInput:E,onChange:N,onFocus:P,onBlur:k})]),f||(0,_vue.createCommentVNode)()])},n},render(){return this.renderVN()}});