vxe-pc-ui
Version:
A vue based PC component library
1 lines • 3.54 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");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}var _default=exports.default=(0,_comp.defineVxeComponent)({name:"VxeTextEllipsis",props:{href:String,target:String,content:[String,Number],lineClamp:[String,Number],status:String,title:[String,Number],loading:Boolean,offsetLength:[String,Number],routerLink:Object,underline:{type:Boolean,default:()=>(0,_ui.getConfig)().textEllipsis.underline},permissionCode:[String,Number],size:{type:String,default:()=>(0,_ui.getConfig)().textEllipsis.size||(0,_ui.getConfig)().size}},emits:["click"],setup(u,e){let l=e.emit;var t=_xeUtils.default.uniqueId();let a=(0,_ui.useSize)(u).computeSize,o=(0,_ui.usePermission)(u).computePermissionInfo,v=(0,_vue.ref)(),p=(0,_vue.ref)(),d=(0,_vue.reactive)({resizeObserver:null,visibleLen:0}),i={refElem:v},f=(0,_vue.computed)(()=>_xeUtils.default.toNumber(u.lineClamp)),c=(0,_vue.computed)(()=>_xeUtils.default.toValueString(u.content)),r=(0,_vue.computed)(()=>u.offsetLength?_xeUtils.default.toNumber(u.offsetLength):0),n=(0,_vue.computed)(()=>{var e=d.visibleLen,t=f.value,i=c.value,l=r.value;return 1<t&&i.length>e?i.slice(0,Math.max(1,e-3+l))+"...":i}),s={},_={xID:t,props:u,context:e,reactData:d,getRefMaps:()=>i,getComputeMaps:()=>s};let m=()=>{var e=v.value,t=p.value,i=c.value,l=f.value;!e||!t||(e=e.clientWidth,t.style.display="block",t.style.position="absolute",t.style.top="-3000px",t.style.left="-3000px",t.textContent=i,t.offsetWidth<(t=Math.floor(e*l)))?d.visibleLen=i.length:(l=>{var e=v.value,r=p.value;if(e&&r){let e=12;try{e=Math.max(10,_xeUtils.default.toNumber(getComputedStyle(r).fontSize))}catch(e){}var n=c.value;let t=Math.floor(l/e);var s=n.slice(0,t);r.textContent=s,d.visibleLen=s.length;let i=0;for(;l>r.clientWidth&&i<30;){i++;var u=Math.floor((l-r.clientWidth)/e);if(!u)break;t+=u,s=n.slice(0,t),r.textContent=s,d.visibleLen=s.length}r.textContent="",r.style.display="",r.style.position="",r.style.top="",r.style.left=""}})(t)},x=()=>{l("click",{})},g=()=>{var e=d.resizeObserver,t=f.value;e||(e=v.value)&&1<t&&window.ResizeObserver&&((t=new window.ResizeObserver(_xeUtils.default.throttle(()=>{m()},300,{leading:!0,trailing:!0}))).observe(e),d.resizeObserver=t)};Object.assign(_,{dispatchEvent:(e,t,i)=>{l(e,(0,_ui.createEvent)(i,{$textEllipsis:_},t))}},{});let h=()=>{var{routerLink:e,href:t,target:i,title:l}=u,r=n.value;return e?(0,_vue.h)((0,_vue.resolveComponent)("router-link"),{class:"vxe-text-ellipsis--link",title:l,target:i,to:e},{default(){return h()}}):t?(0,_vue.h)("a",{class:"vxe-text-ellipsis--link",href:t,target:i,title:l},r):(0,_vue.h)("span",{class:"vxe-text-ellipsis--content"},r)};return(0,_vue.watch)(()=>u.content,()=>{m()}),(0,_vue.watch)(()=>u.lineClamp,()=>{g(),m()}),(0,_vue.onMounted)(()=>{g(),m()}),(0,_vue.onBeforeUnmount)(()=>{var e=d.resizeObserver,t=v.value,i=p.value;i&&(i.textContent=""),e&&(t&&e.unobserve(t),e.disconnect(),d.resizeObserver=null)}),_.renderVN=()=>{var{loading:e,status:t,title:i,underline:l}=u,r=o.value,n=a.value,s=f.value;return r.visible?(0,_vue.h)("div",{ref:v,class:["vxe-text-ellipsis",1<s?"is--multi":"is--single",{["size--"+n]:n,["theme--"+t]:t,"is--underline":l,"is--loading":e}],title:i,onClick:x},[(0,_vue.h)("span",{ref:p,class:"vxe-text-ellipsis--reality"}),h()]):(0,_ui.renderEmptyElement)(_)},_},render(){return this.renderVN()}});