ll-package
Version:
2 lines (1 loc) • 3.15 kB
JavaScript
;Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const a=require("../../../@babel/runtime/helpers/esm/extends.js"),l=require("vue"),B=require("../vc-util/Dom/addEventListener.js"),b=require("../vc-util/Dom/css.js"),W=require("../_util/classNames.js"),x=require("../_util/getScrollBarSize.js"),k=require("./context/TableContext.js"),C=require("./hooks/useFrame.js"),O=l.defineComponent({name:"StickyScrollBar",inheritAttrs:!1,props:["offsetScroll","container","scrollBodyRef","scrollBodySizeInfo"],emits:["scroll"],setup(t,L){let{emit:g,expose:M}=L;const R=k.useInjectTable(),c=l.shallowRef(0),s=l.shallowRef(0),d=l.shallowRef(0);l.watchEffect(()=>{c.value=t.scrollBodySizeInfo.scrollWidth||0,s.value=t.scrollBodySizeInfo.clientWidth||0,d.value=c.value&&s.value*(s.value/c.value)},{flush:"post"});const H=l.shallowRef(),[v,m]=C.useLayoutState({scrollLeft:0,isHiddenScrollBar:!0}),f=l.ref({delta:0,x:0}),u=l.shallowRef(!1),q=()=>{u.value=!1},$=e=>{f.value={delta:e.pageX-v.value.scrollLeft,x:0},u.value=!0,e.preventDefault()},z=e=>{const{buttons:n}=e||(window==null?void 0:window.event);if(!u.value||n===0){u.value&&(u.value=!1);return}let o=f.value.x+e.pageX-f.value.x-f.value.delta;o<=0&&(o=0),o+d.value>=s.value&&(o=s.value-d.value),g("scroll",{scrollLeft:o/s.value*(c.value+2)}),f.value.x=e.pageX},S=()=>{if(!t.scrollBodyRef.value)return;const e=b.getOffset(t.scrollBodyRef.value).top,n=e+t.scrollBodyRef.value.offsetHeight,o=t.container===window?document.documentElement.scrollTop+window.innerHeight:b.getOffset(t.container).top+t.container.clientHeight;n-x.default()<=o||e>=o-t.offsetScroll?m(r=>a.default(a.default({},r),{isHiddenScrollBar:!0})):m(r=>a.default(a.default({},r),{isHiddenScrollBar:!1}))};M({setScrollLeft:e=>{m(n=>a.default(a.default({},n),{scrollLeft:e/c.value*s.value||0}))}});let h=null,w=null,y=null,i=null;l.onMounted(()=>{h=B.default(document.body,"mouseup",q,!1),w=B.default(document.body,"mousemove",z,!1),y=B.default(window,"resize",S,!1)}),l.onActivated(()=>{l.nextTick(()=>{S()})}),l.onMounted(()=>{setTimeout(()=>{l.watch([d,u],()=>{S()},{immediate:!0,flush:"post"})})}),l.watch(()=>t.container,()=>{i==null||i.remove(),i=B.default(t.container,"scroll",S,!1)},{immediate:!0,flush:"post"}),l.onBeforeUnmount(()=>{h==null||h.remove(),w==null||w.remove(),i==null||i.remove(),y==null||y.remove()}),l.watch(()=>a.default({},v.value),(e,n)=>{e.isHiddenScrollBar!==(n==null?void 0:n.isHiddenScrollBar)&&!e.isHiddenScrollBar&&m(o=>{const r=t.scrollBodyRef.value;return r?a.default(a.default({},o),{scrollLeft:r.scrollLeft/r.scrollWidth*r.clientWidth}):o})},{immediate:!0});const T=x.default();return()=>{if(c.value<=s.value||!d.value||v.value.isHiddenScrollBar)return null;const{prefixCls:e}=R;return l.createVNode("div",{style:{height:`${T}px`,width:`${s.value}px`,bottom:`${t.offsetScroll}px`},class:`${e}-sticky-scroll`},[l.createVNode("div",{onMousedown:$,ref:H,class:W.default(`${e}-sticky-scroll-bar`,{[`${e}-sticky-scroll-bar-active`]:u.value}),style:{width:`${d.value}px`,transform:`translate3d(${v.value.scrollLeft}px, 0, 0)`}},null)])}}});exports.default=O;