vxe-table-ro-test/lib/table/src/body.min.js

一个基于 vue 的 PC 端表格组件，支持增删改查、虚拟树、列拖拽，懒加载、快捷菜单、数据校验、树形结构、打印、导入导出、自定义模板、渲染器、JSON 配置式...

"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _vue=require("vue"),_xeUtils=_interopRequireDefault(require("xe-utils")),_ui=require("../../ui"),_util=require("./util"),_dom=require("../../ui/src/dom"),_utils=require("../../ui/src/utils"),_vn=require("../../ui/src/vn");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}const{getI18n,renderer}=_ui.VxeUI,renderType="body",lineOffsetSizes={mini:3,small:2,medium:1};var _default=exports.default=(0,_vue.defineComponent)({name:"VxeTableBody",props:{tableData:Array,tableColumn:Array,fixedColumn:Array,fixedType:{type:String,default:null}},setup(f){const ne=(0,_vue.inject)("$xeTable",{}),l=(0,_vue.inject)("xesize",null),{xID:w,props:ue,context:y,reactData:ce,internalData:de}=ne,{refTableHeader:_,refTableBody:b,refTableFooter:q,refTableLeftBody:T,refTableRightBody:S,refValidTooltip:j}=ne.getRefMaps(),{computeEditOpts:pe,computeMouseOpts:B,computeSYOpts:ve,computeEmptyOpts:N,computeKeyboardOpts:Y,computeTooltipOpts:me,computeRadioOpts:e,computeExpandOpts:V,computeTreeOpts:d,computeCheckboxOpts:he,computeValidOpts:fe,computeRowOpts:ge,computeColumnOpts:we}=ne.getComputeMaps(),C=(0,_vue.ref)(),O=(0,_vue.ref)(),L=(0,_vue.ref)(),R=(0,_vue.ref)(),H=(0,_vue.ref)(),$=(0,_vue.ref)(),E=(0,_vue.ref)(),p=()=>{if(l){var e=l.value;if(e)return lineOffsetSizes[e]||0}return 0},xe=()=>{var e=ue["delayHover"],{lastScrollTime:l,_isResize:t}=ce;return!!(t||l&&Date.now()<l+e)},v=(e,l)=>{let t=1;if(e){var o=d.value,r=e[o.children||o.childrenField];if(r&&ne.isTreeExpandByRow(e))for(let e=0;e<r.length;e++)t+=v(r[e],l)}return t},ye=e=>{var{row:l,column:t}=e,o=de["afterFullData"],r=ue["treeConfig"],a=d.value,{slots:t,treeNode:s}=t,i=de["fullAllDataRowIdData"],i=i[(0,_util.getRowid)(ne,l)];let n=0,u=0,c=[];return i&&(n=i.level,u=i._index,c=i.items),t&&t.line?ne.callSlot(t.line,e):(i=ne.eqRow(o[0],l),r&&s&&(a.showLine||a.line)?[(0,_vue.h)("div",{class:"vxe-tree--line-wrapper"},[(0,_vue.h)("div",{class:"vxe-tree--line",style:{height:`${i?1:((e,l,t)=>{let o=1;return t&&(o=v(l[t-1],e)),ce.rowHeight*o-(t?1:12-p())})(e,c,u)}px`,left:n*a.indent+(n?2-p():0)+16+"px"}})])]:[])},P=(e,l,t,U,o,r,a,s,i,n,q,j)=>{var{columnKey:B,height:u,showOverflow:c,cellClassName:N,cellStyle:d,align:p,spanMethod:Y,mouseConfig:W,editConfig:F,editRules:v,tooltipConfig:A}=ue,{tableData:V,overflowX:h,scrollYLoad:P,currentColumn:X,mergeList:g,editStore:x,isAllOverflow:K,validErrorMaps:m}=ce,z=de["afterFullData"],f=fe.value,G=he.value,w=pe.value,y=me.value,J=ge.value,_=ve.value,Q=we.value,{type:Z,cellRender:ee,editRender:b,align:T,showOverflow:S,className:le,treeNode:te,slots:oe}=i,x=x["actived"],_=_["rHeight"],C=J["height"],O=i.id,L=b||ee,L=L?renderer.get(L.name):null,re=L?L.tableCellClassName||L.cellClassName:null,R=L?L.tableCellStyle||L.cellStyle:"";const H=y.showAll;var y=ne.getColumnIndex(i),ae=ne.getVTColumnIndex(i),se=(0,_utils.isEnableConf)(b);let $=t?i.fixed!==t:i.fixed&&h;h=_xeUtils.default.isUndefined(S)||_xeUtils.default.isNull(S)?c:S;let E="ellipsis"===h;const M="title"===h,I=!0===h||"tooltip"===h;let D=M||I||E,ie;S={},h=T||(L?L.tableCellAlign:"")||p,T=m[l+":"+O],L=v&&f.showMessage&&("default"===f.message?u||1<V.length:"inline"===f.message),p={colid:O};const k={$table:ne,$grid:ne.xegrid,isEdit:!1,seq:e,rowid:l,row:o,rowIndex:r,$rowIndex:a,_rowIndex:s,column:i,columnIndex:y,$columnIndex:n,_columnIndex:ae,fixed:t,type:renderType,isHidden:$,level:U,visibleData:z,data:V,items:j};if(P&&!D&&(E=D=!0),(M||I||H||A)&&(S.onMouseenter=e=>{xe()||(M?(0,_dom.updateCellTitle)(e.currentTarget,i):(I||H)&&ne.triggerBodyTooltipEvent(e,k),ne.dispatchEvent("cell-mouseenter",Object.assign({cell:e.currentTarget},k),e))}),(I||H||A)&&(S.onMouseleave=e=>{xe()||((I||H)&&ne.handleTargetLeaveEvent(e),ne.dispatchEvent("cell-mouseleave",Object.assign({cell:e.currentTarget},k),e))}),(G.range||W)&&(S.onMousedown=e=>{ne.triggerCellMousedownEvent(e,k)}),S.onClick=e=>{ne.triggerCellClickEvent(e,k)},S.onDblclick=e=>{ne.triggerCellDblclickEvent(e,k)},g.length){m=(0,_util.mergeBodyMethod)(g,s,ae);if(m){var{rowspan:v,colspan:u}=m;if(!v||!u)return null;1<v&&(p.rowspan=v),1<u&&(p.colspan=u)}}else if(Y){var{rowspan:e=1,colspan:l=1}=Y(k)||{};if(!e||!l)return null;1<e&&(p.rowspan=e),1<l&&(p.colspan=l)}!($=$&&g&&(1<p.colspan||1<p.rowspan)?!1:$)&&F&&(b||ee)&&(w.showStatus||w.showUpdateStatus)&&(ie=ne.isUpdateByRow(o,i.field));r=[];return $&&c&&K?r.push((0,_vue.h)("div",{class:["vxe-cell",{"c--title":M,"c--tooltip":I,"c--ellipsis":E}],style:{maxHeight:D&&(_||C)?`${_||C}px`:""}})):(r.push(...ye(k),(0,_vue.h)("div",{class:["vxe-cell",{"c--title":M,"c--tooltip":I,"c--ellipsis":E}],style:{maxHeight:D&&(_||C)?`${_||C}px`:""},title:M?ne.getCellLabel(o,i):null},i.renderCell(k))),L&&T&&(a=T.rule,y=oe?oe.valid:null,t=Object.assign(Object.assign({},k),T),r.push((0,_vue.h)("div",{class:["vxe-cell--valid-error-hint",(0,_dom.getPropClass)(f.className,t)],style:a&&a.maxWidth?{width:a.maxWidth+"px"}:null},y?ne.callSlot(y,t):[(0,_vue.h)("span",{class:"vxe-cell--valid-error-msg"},T.content)])))),(0,_vue.h)("td",Object.assign(Object.assign(Object.assign({class:["vxe-body--column",O,{["col--"+h]:h,["col--"+Z]:Z,"col--last":n===q.length-1,"col--tree-node":te,"col--edit":se,"col--ellipsis":D,"col--height":!!J.height,"fixed--hidden":$,"col--dirty":ie,"col--active":F&&se&&x.row===o&&(x.column===i||"row"===w.mode),"col--valid-error":!!T,"col--current":X===i},(0,_dom.getPropClass)(re,k),(0,_dom.getPropClass)(le,k),(0,_dom.getPropClass)(N,k)],key:B||Q.useKey?O:n},p),{style:Object.assign({height:D&&(_||C)?`${_||C}px`:""},_xeUtils.default.isFunction(R)?R(k):R,_xeUtils.default.isFunction(d)?d(k):d)}),S),r)},A=(x,m,f)=>{const{stripe:w,rowKey:y,highlightHoverRow:_,rowClassName:b,rowStyle:T,showOverflow:S,editConfig:C,treeConfig:O}=ue,{hasFixedColumn:L,treeExpandedMaps:R,scrollYLoad:H,rowExpandedMaps:$,expandColumn:E,selectRadioRow:M,pendingRowMaps:I,pendingRowList:D}=ce,k=de["fullAllDataRowIdData"],U=he.value,q=e.value,j=d.value,B=pe.value,N=ge.value,Y=j["transform"],W=j.children||j.childrenField,F=[];return m.forEach((t,o)=>{var e={};let r;r=ne.getRowIndex(t),(N.isHover||_)&&(e.onMouseenter=e=>{xe()||ne.triggerHoverEvent(e,{row:t,rowIndex:r})},e.onMouseleave=()=>{xe()||ne.clearHoverRow()});const a=(0,_util.getRowid)(ne,t);var l=k[a];let s=0,i=-1,n=0;l&&(s=l.level,i=l.seq,n=l._index);var u,c,d,l={$table:ne,seq:i,rowid:a,fixed:x,type:renderType,level:s,row:t,rowIndex:r,$rowIndex:o,_rowIndex:n},p=E&&!!$[a];let v=!1,h=[],g=!1;C&&(g=ne.isInsertByRow(t)),!O||H||Y||(h=t[W],v=h&&0<h.length&&!!R[a]),F.push((0,_vue.h)("tr",Object.assign({class:["vxe-body--row",O?"row--level-"+s:"",{"row--stripe":w&&(ne.getVTRowIndex(t)+1)%2==0,"is--new":g,"is--expand-row":p,"is--expand-tree":v,"row--new":g&&(B.showStatus||B.showInsertStatus),"row--radio":q.highlight&&ne.eqRow(M,t),"row--checked":U.highlight&&ne.isCheckedByCheckboxRow(t),"row--pending":D.length&&!!I[a]},(0,_dom.getPropClass)(b,l)],rowid:a,style:T?_xeUtils.default.isFunction(T)?T(l):T:null,key:y||N.useKey||O?a:o},e),f.map((e,l)=>P(i,a,x,s,t,r,o,n,e,l,f,m)))),p&&({height:l,padding:p}=V.value,u={},c=(l&&(u.height=l+"px"),O&&(u.paddingLeft=s*j.indent+30+"px"),E)["showOverflow"],c=_xeUtils.default.isUndefined(c)||_xeUtils.default.isNull(c)?S:c,d={$table:ne,seq:i,column:E,fixed:x,type:renderType,level:s,row:t,rowIndex:r,$rowIndex:o,_rowIndex:n},F.push((0,_vue.h)("tr",Object.assign({class:["vxe-body--expanded-row",{"is--padding":p}],key:"expand_"+a,style:T?_xeUtils.default.isFunction(T)?T(d):T:null},e),[(0,_vue.h)("td",{class:{"vxe-body--expanded-column":1,"fixed--hidden":x&&!L,"col--ellipsis":c},colspan:f.length},[(0,_vue.h)("div",{class:{"vxe-body--expanded-cell":1,"is--ellipsis":l},style:u},[E.renderData(d)])])]))),v&&F.push(...A(x,h,f))}),F};let r;const M=(e,l,t,o)=>{(t||o)&&(t&&((0,_util.removeScrollListener)(t),t.scrollTop=l),o&&((0,_util.removeScrollListener)(o),o.scrollTop=l),clearTimeout(r),r=setTimeout(()=>{(0,_util.restoreScrollListener)(t),(0,_util.restoreScrollListener)(o),ce.lastScrollTime=Date.now()},300))},o=e=>{var l=f["fixedType"],t=ue["highlightHoverRow"],{scrollXLoad:o,scrollYLoad:r}=ce,{elemStore:a,lastScrollTop:s,lastScrollLeft:i}=de,n=ge.value,u=_.value,c=b.value,d=q.value,p=T.value,v=S.value,h=j.value,g=C.value,u=u?u.$el:null,d=d?d.$el:null,c=c.$el,p=p?p.$el:null,v=v?v.$el:null,x=a["main-body-ySpace"],x=x?x.value:null,a=a["main-body-xSpace"],a=a?a.value:null,x=(r&&x?x:c).clientHeight,a=(o&&a?a:c).clientWidth;let m=g.scrollTop;g=c.scrollLeft,i=g!==i,s=m!==s;de.lastScrollTop=m,de.lastScrollLeft=g,ce.lastScrollTime=Date.now(),(n.isHover||t)&&ne.clearHoverRow(),p&&"left"===l?(m=p.scrollTop,M(0,m,c,v)):v&&"right"===l?(m=v.scrollTop,M(0,m,c,p)):(i&&(u&&(u.scrollLeft=c.scrollLeft),d)&&(d.scrollLeft=c.scrollLeft),(p||v)&&(ne.checkScrolling(),s)&&M(0,m,p,v)),o&&i&&ne.triggerScrollXEvent(e),r&&s&&ne.triggerScrollYEvent(e),i&&h&&h.reactData.visible&&h.updatePlacement(),ne.dispatchEvent("scroll",{type:renderType,fixed:l,scrollTop:m,scrollLeft:g,scrollHeight:c.scrollHeight,scrollWidth:c.scrollWidth,bodyHeight:x,bodyWidth:a,isX:i,isY:s},e)};let m,I=0,D=0,k=0,U=!1;const h=(r,a,e,s,i)=>{var l=de["elemStore"],{scrollXLoad:t,scrollYLoad:o}=ce,n=b.value,u=T.value,c=S.value;const d=u?u.$el:null,p=c?c.$el:null,v=n.$el;u=l["main-body-ySpace"],c=u?u.value:null,n=l["main-body-xSpace"],u=n?n.value:null;const h=(o&&c?c:v).clientHeight,g=(t&&u?u:v).clientWidth;l=U===a?Math.max(0,I-k):0;U=a,I=Math.abs(a?e-l:e+l),D=0,k=0,clearTimeout(m);const x=()=>{var e,l,t,o;k<I&&(e=f["fixedType"],{scrollTop:o,clientHeight:l,scrollHeight:t}=(D=Math.max(5,Math.floor(1.5*D)),(k+=D)>I&&(D-=k-I),v),o=o+D*(a?-1:1),v.scrollTop=o,d&&(d.scrollTop=o),p&&(p.scrollTop=o),(a?o<t-l:0<=o)&&(m=setTimeout(x,10)),ne.dispatchEvent("scroll",{type:renderType,fixed:e,scrollTop:v.scrollTop,scrollLeft:v.scrollLeft,scrollHeight:v.scrollHeight,scrollWidth:v.scrollWidth,bodyHeight:h,bodyWidth:g,isX:s,isY:i},r))};x()},W=e=>{var{deltaY:l,deltaX:t}=e,o=ue["highlightHoverRow"],r=ce["scrollYLoad"],{lastScrollTop:a,lastScrollLeft:s}=de,i=ge.value,n=b.value,u=C.value,n=n.$el,c=l<0;(c?u.scrollTop<=0:u.scrollTop>=u.scrollHeight-u.clientHeight)||(u=u.scrollTop+l,t=(n=n.scrollLeft+t)!==s,(s=u!==a)&&(e.preventDefault(),de.lastScrollTop=u,de.lastScrollLeft=n,ce.lastScrollTime=Date.now(),(i.isHover||o)&&ne.clearHoverRow(),h(e,c,l,t,s),r)&&ne.triggerScrollYEvent(e))};(0,_vue.onMounted)(()=>{(0,_vue.nextTick)(()=>{var e=f["fixedType"],l=de["elemStore"],e=`${e||"main"}-body-`,t=C.value;l[e+"wrapper"]=C,l[e+"table"]=O,l[e+"colgroup"]=L,l[e+"list"]=R,l[e+"xSpace"]=H,l[e+"ySpace"]=$,l[e+"emptyBlock"]=E,t&&(t.onscroll=o,t._onscroll=o)})}),(0,_vue.onBeforeUnmount)(()=>{var e=C.value;clearTimeout(m),e&&(e._onscroll=null,e.onscroll=null)}),(0,_vue.onUnmounted)(()=>{var e=f["fixedType"],l=de["elemStore"],e=`${e||"main"}-body-`;l[e+"wrapper"]=null,l[e+"table"]=null,l[e+"colgroup"]=null,l[e+"list"]=null,l[e+"xSpace"]=null,l[e+"ySpace"]=null,l[e+"emptyBlock"]=null});return()=>{let{fixedColumn:e,fixedType:l,tableColumn:t}=f;var{keyboardConfig:o,showOverflow:r,spanMethod:a,mouseConfig:s}=ue,{tableData:i,mergeList:n,scrollYLoad:u,isAllOverflow:c}=ce,d=de["visibleColumn"],p=y["slots"],v=ve.value,h=N.value,g=Y.value,x=B.value;l&&(t=ce.expandColumn||!(u||r&&c)||n.length||a||o&&g.isMerge?d:e);let m;u=p?p.empty:null;return m=u?ne.callSlot(u,{$table:ne,$grid:ne.xegrid}):(c=(r=h.name?renderer.get(h.name):null)?r.renderTableEmpty||r.renderTableEmptyView||r.renderEmpty:null)?(0,_vn.getSlotVNs)(c(h,{$table:ne})):ue.emptyText||getI18n("vxe.table.emptyText"),(0,_vue.h)("div",Object.assign({ref:C,class:["vxe-table--body-wrapper",l?`fixed-${l}--wrapper`:"body--wrapper"],xid:w},"wheel"===v.mode?{onWheel:W}:{}),[l?(0,_vue.createCommentVNode)():(0,_vue.h)("div",{ref:H,class:"vxe-body--x-space"}),(0,_vue.h)("div",{ref:$,class:"vxe-body--y-space"}),(0,_vue.h)("table",{ref:O,class:"vxe-table--body",xid:w,cellspacing:0,cellpadding:0,border:0},[(0,_vue.h)("colgroup",{ref:L},t.map((e,l)=>(0,_vue.h)("col",{name:e.id,key:l}))),(0,_vue.h)("tbody",{ref:R},A(l,i,t))]),(0,_vue.h)("div",{class:"vxe-table--checkbox-range"}),s&&x.area?(0,_vue.h)("div",{class:"vxe-table--cell-area"},[(0,_vue.h)("span",{class:"vxe-table--cell-main-area"},x.extension?[(0,_vue.h)("span",{class:"vxe-table--cell-main-area-btn",onMousedown(e){ne.triggerCellExtendMousedownEvent(e,{$table:ne,fixed:l,type:renderType})}})]:[]),(0,_vue.h)("span",{class:"vxe-table--cell-copy-area"}),(0,_vue.h)("span",{class:"vxe-table--cell-extend-area"}),(0,_vue.h)("span",{class:"vxe-table--cell-multi-area"}),(0,_vue.h)("span",{class:"vxe-table--cell-active-area"})]):null,l?null:(0,_vue.h)("div",{class:"vxe-table--empty-block",ref:E},[(0,_vue.h)("div",{class:"vxe-table--empty-content"},m)])])}}});