vxe-pc-ui
Version:
A vue based PC component library
1 lines • 3.13 kB
JavaScript
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}}var _default=exports.default=(0,_comp.defineVxeComponent)({name:"VxeSwitch",props:{modelValue:[String,Number,Boolean],disabled:{type:Boolean,default:null},readonly:{type:Boolean,default:null},size:{type:String,default:()=>(0,_ui.getConfig)().switch.size||(0,_ui.getConfig)().size},openLabel:String,closeLabel:String,openValue:{type:[String,Number,Boolean],default:!0},closeValue:{type:[String,Number,Boolean],default:!1},openIcon:String,closeIcon:String,openActiveIcon:String,closeActiveIcon:String},emits:["update:modelValue","change","focus","blur"],setup(c,e){let l=e.emit,i=(0,_vue.inject)("$xeForm",null),a=(0,_vue.inject)("xeFormItemInfo",null);var t=_xeUtils.default.uniqueId();let v=(0,_ui.useSize)(c).computeSize,d=(0,_vue.reactive)({isActivated:!1,hasAnimat:!1,offsetLeft:0}),n={},p={xID:t,props:c,context:e,reactData:d,internalData:n},m=(0,_vue.ref)(),o={},_=(0,_vue.computed)(()=>{var e=c.disabled;return null===e?!!i&&(i.props.readonly||i.props.disabled):e}),f=(0,_vue.computed)(()=>{var e=c.readonly;return null===e?!!i&&(i.props.readonly||i.props.disabled):e}),h=(0,_vue.computed)(()=>(0,_utils.getFuncText)(c.openLabel)),b=(0,_vue.computed)(()=>(0,_utils.getFuncText)(c.closeLabel)),x=(0,_vue.computed)(()=>c.modelValue===c.openValue),s=e=>{l("update:modelValue",e)},g=e=>{var t=_.value,u=f.value;t||u||(t=x.value,clearTimeout(n.atTimeout),u=t?c.closeValue:c.openValue,d.hasAnimat=!0,s(u),o.dispatchEvent("change",{value:u},e),i&&a&&i.triggerItemEvent(e,a.itemConfig.field,u),n.atTimeout=setTimeout(()=>{d.hasAnimat=!1,n.atTimeout=void 0},400))};let V=e=>{d.isActivated=!0,o.dispatchEvent("focus",{value:c.modelValue},e)},y=e=>{d.isActivated=!1,o.dispatchEvent("blur",{value:c.modelValue},e)};o={dispatchEvent:(e,t,u)=>{l(e,(0,_ui.createEvent)(u,{$switch:p},t))},focus(){var e=m.value;return d.isActivated=!0,e&&e.focus(),(0,_vue.nextTick)()},blur(){var e=m.value;return e&&e.blur(),(d.isActivated=!1,_vue.nextTick)()}},Object.assign(p,o);return p.renderVN=()=>{var{openIcon:e,closeIcon:t,openActiveIcon:u,closeActiveIcon:l}=c,i=v.value,a=x.value,n=h.value,o=b.value,s=_.value,r=f.value;return(0,_vue.h)("div",{class:["vxe-switch",a?"is--on":"is--off",{["size--"+i]:i,"is--disabled":s,"is--readonly":r,"is--animat":d.hasAnimat}]},[(0,_vue.h)("button",{ref:m,class:"vxe-switch--button",type:"button",disabled:s||r,onClick:g,onFocus:V,onBlur:y},[(0,_vue.h)("span",{class:"vxe-switch--label vxe-switch--label-on"},[e?(0,_vue.h)("i",{class:["vxe-switch--label-icon",e]}):(0,_ui.renderEmptyElement)(p),n]),(0,_vue.h)("span",{class:"vxe-switch--label vxe-switch--label-off"},[t?(0,_vue.h)("i",{class:["vxe-switch--label-icon",t]}):(0,_ui.renderEmptyElement)(p),o]),(0,_vue.h)("span",{class:["vxe-switch--icon"]},u||l?[(0,_vue.h)("i",{class:a?u:l})]:[])])])},p},render(){return this.renderVN()}});