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

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

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}}let{getI18n,renderer,renderEmptyElement}=_ui.VxeUI,renderType="body";var _default=exports.default=(0,_vue.defineComponent)({name:"VxeTableBody",props:{tableData:Array,tableColumn:Array,fixedColumn:Array,fixedType:{type:String,default:""}},setup(T){let We=(0,_vue.inject)("$xeTable",{}),{xID:z,props:Ge,context:q,reactData:Pe,internalData:Ve}=We,{computeEditOpts:Xe,computeMouseOpts:Ke,computeCellOffsetWidth:Ye,computeAreaOpts:Je,computeDefaultRowHeight:Qe,computeEmptyOpts:A,computeTooltipOpts:Ze,computeRadioOpts:e,computeExpandOpts:le,computeTreeOpts:p,computeCheckboxOpts:el,computeCellOpts:ll,computeValidOpts:tl,computeRowOpts:al,computeColumnOpts:rl,computeRowDragOpts:ol,computeColumnDragOpts:l,computeResizableOpts:il,computeVirtualXOpts:sl,computeVirtualYOpts:dl}=We.getComputeMaps(),$=(0,_vue.ref)(),F=(0,_vue.ref)(),U=(0,_vue.ref)(),H=(0,_vue.ref)(),L=(0,_vue.ref)(),j=(0,_vue.ref)(),N=(0,_vue.ref)(),B=(0,_vue.ref)(),nl=()=>{var e=Ge.delayHover,{lastScrollTime:l,isDragResize:t}=Pe;return!!(t||l&&Date.now()<l+e)},ul=(e,l,t)=>{var{row:a,column:r}=l,o=Ve.afterFullData,i=Ge.treeConfig,s=p.value,{slots:r,treeNode:n}=r,d=Ve.fullAllDataRowIdData;if(r&&r.line)return We.callSlot(r.line,l);r=d[e];let u=0,c=null;return r&&(u=r.level,c=r.items[r.treeIndex-1]),i&&n&&(s.showLine||s.line)?[(0,_vue.h)("div",{key:"tl",class:"vxe-tree--line-wrapper"},[(0,_vue.h)("div",{class:"vxe-tree--line",style:{height:`${We.eqRow(o[0],a)?1:(0,_util.calcTreeLine)(l,c)}px`,bottom:`-${Math.floor(t/2)}px`,left:u*s.indent+(u?2-(0,_util.getOffsetSize)(We):0)+16+"px"}})])]:[]},ae=($,e,l,F,U,t,a,H,r,o,L,j,i)=>{var s=We.xeGrid,{columnKey:N,resizable:n,showOverflow:d,border:B,height:u,treeConfig:W,cellClassName:G,cellStyle:P,align:V,spanMethod:X,mouseConfig:K,editConfig:Y,editRules:c,tooltipConfig:p,padding:v}=Ge,{tableData:g,dragRow:J,overflowX:Q,currentColumn:Z,scrollXLoad:ee,scrollYLoad:h,mergeBodyFlag:le,calcCellHeightFlag:x,resizeHeightFlag:w,resizeWidthFlag:te,editStore:ae,isAllOverflow:re,validErrorMaps:m}=Pe,{fullAllDataRowIdData:_,fullColumnIdData:f,mergeBodyCellMaps:oe,visibleColumn:ie,afterFullData:se,mergeBodyList:ne,scrollXStore:de,scrollYStore:ue}=Ve,ce=ll.value,b=tl.value,pe=el.value,ve=Xe.value,y=Ze.value,ge=il.value,he=sl.value,xe=dl.value,{isAllColumnDrag:ge,isAllRowDrag:we}=ge,C=al.value,D=ol.value,me=Qe.value,x=x?ce.height||C.height:0,{disabledMethod:R,isCrossDrag:_e,isPeerDrag:fe}=D,be=rl.value,ye=Ke.value,Ce=Je.value,De=Ye.value,Ce=Ce.selectCellToRow,{type:Re,cellRender:Ee,editRender:Oe,align:Me,showOverflow:Se,className:Ie,treeNode:ke,rowResize:Te,padding:E,verticalAlign:O,slots:ze}=o,M=ce.verticalAlign,ae=ae.actived,_=_[e]||{},S=o.id,f=f[S]||{},I=Oe||Ee,I=I?renderer.get(I.name):null,qe=I?I.tableCellClassName||I.cellClassName:null,Ae=I?I.tableCellStyle||I.cellStyle:"";let $e=y.showAll;var Fe=f.index,y=f._index,f=(0,_utils.isEnableConf)(Oe),w=w?_.resizeHeight:0;let k=l?o.fixed!==l:o.fixed&&Q;Q=_xeUtils.default.eqNull(E)?null===v?ce.padding:v:E,v=_xeUtils.default.eqNull(Se)?d:Se,E="ellipsis"===v;let T="title"===v,z=!0===v||"tooltip"===v;d=re||T||z||E,Se=_xeUtils.default.isBoolean(o.resizable)?o.resizable:be.resizable||n,v=!!x,n=0<w;let Ue;x={},w=Me||(I?I.tableCellAlign:"")||V,Me=_xeUtils.default.eqNull(O)?M:O,I=m[e+":"+S],V=c&&b.showMessage&&("default"===b.message?u||1<g.length:"inline"===b.message),M={colid:S};let q={$table:We,$grid:s,isEdit:!1,seq:$,rowid:e,row:t,rowIndex:a,$rowIndex:H,_rowIndex:r,column:o,columnIndex:Fe,$columnIndex:L,_columnIndex:y,fixed:l,type:renderType,isHidden:!!k,level:U,visibleData:se,data:g,items:i},A=!1,He=!1,Le=((A=C.drag?"row"===D.trigger||o.dragSort&&"cell"===D.trigger:A)&&(He=!(!R||!R(q))),(T||z||$e||p)&&(x.onMouseenter=e=>{nl()||(T?(0,_dom.updateCellTitle)(e.currentTarget,o):(z||$e)&&We.triggerBodyTooltipEvent(e,q),We.dispatchEvent("cell-mouseenter",Object.assign({cell:e.currentTarget},q),e))}),(z||$e||p)&&(x.onMouseleave=e=>{nl()||((z||$e)&&We.handleTargetLeaveEvent(e),We.dispatchEvent("cell-mouseleave",Object.assign({cell:e.currentTarget},q),e))}),(A||pe.range||K)&&(x.onMousedown=e=>{We.triggerCellMousedownEvent(e,q)}),A&&(x.onMouseup=We.triggerCellMouseupEvent),x.onClick=e=>{We.triggerCellClickEvent(e,q)},!(x.onDblclick=e=>{We.triggerCellDblclickEvent(e,q)}));if(le&&ne.length){O=oe[r+":"+y];if(O){var{rowspan:m,colspan:c}=O;if(!m||!c)return null;1<m&&(Le=!0,M.rowspan=m),1<c&&(Le=!0,M.colspan=c)}}else if(X){var{rowspan:u=1,colspan:s=1}=X(q)||{};if(!u||!s)return null;1<u&&(M.rowspan=u),1<s&&(M.colspan=s)}!(k=k&&Le&&(1<M.colspan||1<M.rowspan)?!1:k)&&Y&&(Oe||Ee)&&(ve.showStatus||ve.showUpdateStatus)&&(Ue=We.isUpdateByRow(t,o.field));$=h&&!d,a=_.resizeHeight||ce.height||C.height||_.height||me,H=L===j.length-1,se=!o.resizeWidth&&("auto"===o.minWidth||"auto"===o.width);let je=!1;Le||J&&(0,_util.getRowid)(We,J)===e||(h&&!W&&!xe.immediate&&(r<ue.visibleStartIndex-ue.preloadSize||r>ue.visibleEndIndex+ue.preloadSize)||ee&&!he.immediate&&!o.fixed&&(y<de.visibleStartIndex-de.preloadSize||y>de.visibleEndIndex+de.preloadSize))&&(je=!0);g={};if(d&&te){let l=M.colspan||0;if(1<l)for(let e=1;e<l;e++){var Ne=ie[Fe+e];Ne&&(l+=Ne.renderWidth)}g.width=o.renderWidth-De*l+"px"}h||d||v||n?g.height=a+"px":g.minHeight=a+"px";i=[];k&&re?i.push((0,_vue.h)("div",{key:"tc",class:["vxe-cell",{"c--title":T,"c--tooltip":z,"c--ellipsis":E}],style:g})):(i.push(...ul(e,q,a),(0,_vue.h)("div",{key:"tc",class:["vxe-cell",{"c--title":T,"c--tooltip":z,"c--ellipsis":E}],style:g,title:T?We.getCellLabel(t,o):null},je?[]:[(0,_vue.h)("div",{colid:S,rowid:e,class:"vxe-cell--wrapper"},o.renderCell(q))])),V&&I&&(D=I.rule,R=ze?ze.valid:null,p=Object.assign(Object.assign(Object.assign({},q),I),{rule:I}),i.push((0,_vue.h)("div",{key:"tcv",class:["vxe-cell--valid-error-tip",(0,_dom.getPropClass)(b.className,p)],style:D&&D.maxWidth?{width:D.maxWidth+"px"}:null},[(0,_vue.h)("div",{class:"vxe-cell--valid-error-wrapper vxe-cell--valid-error-theme-"+(b.theme||"normal")},[R?We.callSlot(R,p):[(0,_vue.h)("span",{class:"vxe-cell--valid-error-msg"},I.content)]])]))));let Be=!1;return K&&ye.area&&Ce&&((y||!0!==Ce)&&Ce!==o.field||(Be=!0)),!k&&Se&&ge&&i.push((0,_vue.h)("div",{key:"tcc",class:["vxe-cell--col-resizable",{"is--line":!B||"none"===B}],onMousedown:e=>We.handleColResizeMousedownEvent(e,l,q),onDblclick:e=>We.handleColResizeDblclickEvent(e,q)})),(Te||we)&&C.resizable&&i.push((0,_vue.h)("div",{key:"tcr",class:"vxe-cell--row-resizable",onMousedown:e=>We.handleRowResizeMousedownEvent(e,q),onDblclick:e=>We.handleRowResizeDblclickEvent(e,q)})),(0,_vue.h)("td",Object.assign(Object.assign(Object.assign({class:["vxe-body--column",S,Me?"col--vertical-"+Me:"",w?"col--"+w:"",Re?"col--"+Re:"",{"col--last":H,"col--tree-node":ke,"col--edit":f,"col--ellipsis":d,"col--cs-height":v,"col--rs-height":n,"col--to-row":Be,"col--auto-height":$,"fixed--width":!se,"fixed--hidden":k,"is--padding":Q,"is--progress":k&&re||je,"is--drag-cell":A&&(_e||fe||!U),"is--drag-disabled":He,"col--dirty":Ue,"col--active":Y&&f&&ae.row===t&&(ae.column===o||"row"===ve.mode),"col--valid-error":!!I,"col--current":Z===o},(0,_dom.getPropClass)(qe,q),(0,_dom.getPropClass)(Ie,q),(0,_dom.getPropClass)(G,q)],key:N||ee||h||be.useKey||C.useKey||be.drag?S:L},M),{style:Object.assign({},_xeUtils.default.isFunction(Ae)?Ae(q):Ae,_xeUtils.default.isFunction(P)?P(q):P)}),x),F&&k?[]:i)},te=(x,w,m,_)=>{let{stripe:f,rowKey:b,highlightHoverRow:y,rowClassName:C,rowStyle:D,editConfig:R,treeConfig:E}=Ge,{hasFixedColumn:O,treeExpandedFlag:M,isColLoading:S,scrollXLoad:I,scrollYLoad:k,isAllOverflow:T,rowExpandedFlag:z,expandColumn:q,selectRadioRow:A,pendingRowFlag:$,isDragColMove:F,rowExpandHeightFlag:U}=Pe,{fullAllDataRowIdData:H,treeExpandedMaps:L,pendingRowMaps:j,rowExpandedMaps:N}=Ve,B=el.value,W=e.value,G=p.value,P=Xe.value,V=al.value,X=rl.value,K=l.value,{transform:Y,seqMode:Q}=G,Z=G.children||G.childrenField,J=[],ee=(0,_util.createHandleGetRowId)(We).handleGetRowId;return m.forEach((t,a)=>{let r=ee(t);var e=H[r]||{};let o=a,i=0,s=-1,n=-1;var l={},d=((V.isHover||y)&&(l.onMouseenter=e=>{nl()||We.triggerHoverEvent(e,{row:t,rowIndex:o})},l.onMouseleave=()=>{nl()||We.clearHoverRow()}),e&&(i=e.level,s=E&&Y&&"increasing"===Q?e._index+1:e.seq,o=e.index,n=e._index),{$table:We,seq:s,rowid:r,fixed:x,type:renderType,level:i,row:t,rowIndex:o,$rowIndex:a,_rowIndex:n}),u=q&&!!z&&!!N[r];let c=!1,p=[],v=!1;R&&(v=We.isInsertByRow(t)),!E||k||Y||(p=t[Z],c=!!M&&p&&0<p.length&&!!L[r]),!V.drag||E&&!Y||(l.onDragstart=We.handleRowDragDragstartEvent,l.onDragend=We.handleRowDragDragendEvent,l.onDragover=We.handleRowDragDragoverEvent);var g=["vxe-body--row",E?"row--level-"+i:"",{"row--stripe":f&&(n+1)%2==0,"is--new":v,"is--expand-row":u,"is--expand-tree":c,"row--new":v&&(P.showStatus||P.showInsertStatus),"row--radio":W.highlight&&We.eqRow(A,t),"row--checked":B.highlight&&We.isCheckedByCheckboxRow(t),"row--pending":!!$&&!!j[r]},(0,_dom.getPropClass)(C,d)];let h=_.map((e,l)=>ae(s,r,x,w,i,t,o,a,n,e,l,_,m));J.push(!S&&X.drag&&K.animation?(0,_vue.h)(_vue.TransitionGroup,Object.assign({name:"vxe-header--col-list"+(F?"":"-disabled"),tag:"tr",class:g,rowid:r,style:D?_xeUtils.default.isFunction(D)?D(d):D:null,key:b||I||k||V.useKey||V.drag||X.drag||E?r:a},l),{default:()=>h}):(0,_vue.h)("tr",Object.assign({class:g,rowid:r,style:D?_xeUtils.default.isFunction(D)?D(d):D:null,key:b||I||k||V.useKey||V.drag||X.drag||E?r:a},l),h)),u&&({height:g,padding:d,mode:l}=le.value,"fixed"===l?J.push((0,_vue.h)("tr",{class:"vxe-body--row-expanded-place",key:"expand_"+r,rowid:r},[(0,_vue.h)("td",{class:"vxe-body--row-expanded-place-column",colspan:_.length,style:{height:`${U?e.expandHeight||g:0}px`}})])):(u={},l=(g&&(u.height=g+"px"),E&&(u.paddingLeft=i*G.indent+30+"px"),q).showOverflow,e=_xeUtils.default.isUndefined(l)||_xeUtils.default.isNull(l)?T:l,l={$table:We,seq:s,column:q,fixed:x,type:renderType,level:i,row:t,rowIndex:o,$rowIndex:a,_rowIndex:n},J.push((0,_vue.h)("tr",{class:["vxe-body--expanded-row",{"is--padding":d}],key:"expand_"+r},[(0,_vue.h)("td",{class:["vxe-body--expanded-column",{"fixed--hidden":x&&!O,"col--ellipsis":e}],colspan:_.length},[(0,_vue.h)("div",{class:["vxe-body--expanded-cell",{"is--ellipsis":g}],style:u},[q.renderData(l)])])])))),c&&J.push(...te(x,w,p,_))}),J};(0,_vue.onMounted)(()=>{(0,_vue.nextTick)(()=>{var e=T.fixedType,l=Ve.elemStore,e=`${e||"main"}-body-`;l[e+"wrapper"]=$,l[e+"scroll"]=F,l[e+"table"]=U,l[e+"colgroup"]=H,l[e+"list"]=L,l[e+"xSpace"]=j,l[e+"ySpace"]=N,l[e+"emptyBlock"]=B})}),(0,_vue.onUnmounted)(()=>{var e=T.fixedType,l=Ve.elemStore,e=`${e||"main"}-body-`;l[e+"wrapper"]=null,l[e+"scroll"]=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()=>{var e=q.slots,l=We.xeGrid;let{fixedColumn:t,fixedType:a,tableColumn:r}=T;var{spanMethod:o,footerSpanMethod:i,mouseConfig:s}=Ge,{isGroup:n,tableData:d,isRowLoading:u,isColLoading:c,overflowX:p,scrollXLoad:v,scrollYLoad:g,isAllOverflow:h,isDragRowMove:x,expandColumn:w,dragRow:m,dragCol:_}=Pe,{visibleColumn:f,fullAllDataRowIdData:b,fullColumnIdData:y}=Ve,C=al.value,D=A.value,R=Ke.value,E=ol.value,O=le.value;let M=d,S=r,I=!1;!(v||g||h)||w&&"fixed"!==O.mode||o||i||(I=!0),c||!a&&p||(S=f),a&&I&&(S=t||[]),g&&m&&2<M.length&&(d=b[(0,_util.getRowid)(We,m)])&&(h=d._index,w=M[0],O=M[M.length-1],o=b[(0,_util.getRowid)(We,w)],i=b[(0,_util.getRowid)(We,O)],o)&&i&&(p=o._index,f=i._index,h<p?M=[m].concat(M):f<h&&(M=M.concat([m]))),a||n||v&&_&&2<S.length&&(g=y[_.id])&&(d=g._index,w=S[0],b=S[S.length-1],O=y[w.id],o=y[b.id],O)&&o&&(i=O._index,p=o._index,d<i?S=[_].concat(S):p<d&&(S=S.concat([_])));let k;f=e?e.empty:null,k=f?We.callSlot(f,{$table:We,$grid:l}):(m=(h=D.name?renderer.get(D.name):null)?h.renderTableEmpty||h.renderTableEmptyView||h.renderEmpty:null)?(0,_vn.getSlotVNs)(m(D,{$table:We})):Ge.emptyText||getI18n("vxe.table.emptyText"),n={onScroll(e){We.triggerBodyScrollEvent(e,a)}};return(0,_vue.h)("div",{ref:$,class:["vxe-table--body-wrapper",a?`fixed-${a}--wrapper`:"body--wrapper"],xid:z},[(0,_vue.h)("div",Object.assign({ref:F,class:"vxe-table--body-inner-wrapper"},n),[a?renderEmptyElement(We):(0,_vue.h)("div",{ref:j,class:"vxe-body--x-space"}),(0,_vue.h)("div",{ref:N,class:"vxe-body--y-space"}),(0,_vue.h)("table",{ref:U,class:"vxe-table--body",xid:z,cellspacing:0,cellpadding:0,border:0},[(0,_vue.h)("colgroup",{ref:H},S.map((e,l)=>(0,_vue.h)("col",{name:e.id,key:l,style:{width:e.renderWidth+"px"}}))),!u&&!c&&C.drag&&E.animation?(0,_vue.h)(_vue.TransitionGroup,{ref:L,name:"vxe-body--row-list"+(x?"":"-disabled"),tag:"tbody"},{default:()=>te(a,I,M,S)}):(0,_vue.h)("tbody",{ref:L},te(a,I,M,S))]),(0,_vue.h)("div",{class:"vxe-table--checkbox-range"}),s&&R.area?(0,_vue.h)("div",{class:"vxe-table--cell-area"},[(0,_vue.h)("span",{class:"vxe-table--cell-main-area"},R.extension?[(0,_vue.h)("span",{class:"vxe-table--cell-main-area-btn",onMousedown(e){We.triggerCellAreaExtendMousedownEvent&&We.triggerCellAreaExtendMousedownEvent(e,{$table:We,fixed:a,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"}),(0,_vue.h)("span",{class:"vxe-table--cell-row-status-area"})]):renderEmptyElement(We),a?renderEmptyElement(We):(0,_vue.h)("div",{class:"vxe-table--empty-block",ref:B},[(0,_vue.h)("div",{class:"vxe-table--empty-content"},k)])])])}}});