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