vhb-table
Version:
一个基于 vue 的 PC 端表格组件,支持增删改查、虚拟列表、虚拟树、懒加载、快捷菜单、数据校验、树形结构、打印导出、表单渲染、数据分页、弹窗、自定义模板、渲染器、贼灵活的配置项、扩展接口等...
1 lines • 15.1 kB
JavaScript
"use strict";function _typeof(e){return(_typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _xeUtils=_interopRequireDefault(require("xe-utils")),_conf=_interopRequireDefault(require("../../v-h-b-table/src/conf")),_vHBTable=_interopRequireDefault(require("../../v-h-b-table")),_utils=_interopRequireWildcard(require("../../tools/utils")),_util=require("./util"),_dom=_interopRequireDefault(require("../../tools/dom"));function _getRequireWildcardCache(e){if("function"!=typeof WeakMap)return null;var l=new WeakMap,t=new WeakMap;return(_getRequireWildcardCache=function(e){return e?t:l})(e)}function _interopRequireWildcard(e,l){if(!l&&e&&e.__esModule)return e;if(null===e||"object"!==_typeof(e)&&"function"!=typeof e)return{default:e};var t=_getRequireWildcardCache(l);if(t&&t.has(e))return t.get(e);var r={},o=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var i in e)if("default"!==i&&Object.prototype.hasOwnProperty.call(e,i)){var n=o?Object.getOwnPropertyDescriptor(e,i):null;n&&(n.get||n.set)?Object.defineProperty(r,i,n):r[i]=e[i]}return r.default=e,t&&t.set(e,r),r}function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function _defineProperty(e,l,t){return l in e?Object.defineProperty(e,l,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[l]=t,e}function _toConsumableArray(e){return _arrayWithoutHoles(e)||_iterableToArray(e)||_unsupportedIterableToArray(e)||_nonIterableSpread()}function _nonIterableSpread(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function _unsupportedIterableToArray(e,l){if(e){if("string"==typeof e)return _arrayLikeToArray(e,l);var t=Object.prototype.toString.call(e).slice(8,-1);return"Object"===t&&e.constructor&&(t=e.constructor.name),"Map"===t||"Set"===t?Array.from(e):"Arguments"===t||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t)?_arrayLikeToArray(e,l):void 0}}function _iterableToArray(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}function _arrayWithoutHoles(e){if(Array.isArray(e))return _arrayLikeToArray(e)}function _arrayLikeToArray(e,l){(null==l||l>e.length)&&(l=e.length);for(var t=0,r=new Array(l);t<l;t++)r[t]=e[t];return r}var scrollProcessTimeout,renderType="body";function isOperateMouse(e){return e._isResize||e.lastScrollTime&&Date.now()<e.lastScrollTime+e.delayHover}function renderLine(e,l,t,r){var o=r.row,i=r.column,n=t.treeOpts,a=t.treeConfig,s=t.fullAllDataRowIdData,c=i.slots,d=i.treeNode,u=s[(0,_util.getRowid)(t,o)],p=0,h=0,f=[];return u&&(p=u.level,h=u._index,f=u.items),c&&c.line?t.callSlot(c.line,r,e):a&&d&&n.line?[e("div",{class:"vhb-tree--line-wrapper"},[e("div",{class:"vhb-tree--line",style:{height:"".concat((0,_util.calcTreeLine)(r,f,h),"px"),left:"".concat(p*n.indent+(p?2-(0,_util.getOffsetSize)(t):0)+16,"px")}})])]:[]}function renderColumn(e,l,t,r,o,i,n,a,s,c,d,u,p,h,f){var y,b,v=t.$listeners,g=t.afterFullData,m=t.tableData,w=t.height,x=t.columnKey,_=t.overflowX,T=t.sYOpts,S=t.scrollXLoad,O=t.scrollYLoad,C=t.highlightCurrentRow,L=t.showOverflow,$=t.isAllOverflow,H=t.align,R=t.currentColumn,k=t.cellClassName,I=t.cellStyle,A=t.mergeList,E=t.spanMethod,W=t.radioOpts,Y=t.checkboxOpts,P=t.expandOpts,D=t.treeOpts,M=t.tooltipOpts,B=t.mouseConfig,q=t.editConfig,j=t.editOpts,U=t.editRules,X=t.validOpts,N=t.editStore,z=t.validStore,F=t.tooltipConfig,K=t.rowOpts,V=t.columnOpts,G=u.type,J=u.cellRender,Q=u.editRender,Z=u.align,ee=u.showOverflow,le=u.className,te=u.treeNode,re=N.actived,oe=T.rHeight,ie=K.height,ne=M.showAll||M.enabled,ae=t.getColumnIndex(u),se=t.getVTColumnIndex(u),ce=(0,_utils.isEnableConf)(Q),de=i?u.fixed!==i:u.fixed&&_,ue=_xeUtils.default.isUndefined(ee)||_xeUtils.default.isNull(ee)?L:ee,pe="ellipsis"===ue,he="title"===ue,fe=!0===ue||"tooltip"===ue,ye=he||fe||pe,be={},ve=Z||H,ge=z.row===a&&z.column===u,me=U&&X.showMessage&&("default"===X.message?w||1<m.length:"inline"===X.message),we={colid:u.id},xe=v["cell-mouseenter"],_e=v["cell-mouseleave"],Te=Q&&q&&"dblclick"===j.trigger,Se={$table:t,seq:r,rowid:o,row:a,rowIndex:s,$rowIndex:c,_rowIndex:d,column:u,columnIndex:ae,$columnIndex:p,_columnIndex:se,fixed:i,type:renderType,isHidden:de,level:n,visibleData:g,data:m,items:f};if(!S&&!O||ye||(pe=ye=!0),(he||fe||ne||xe||F)&&(be.mouseenter=function(e){isOperateMouse(t)||(he?_dom.default.updateCellTitle(e.currentTarget,u):(fe||ne)&&t.triggerBodyTooltipEvent(e,Se),xe&&t.emitEvent("cell-mouseenter",Object.assign({cell:e.currentTarget},Se),e))}),(fe||ne||_e||F)&&(be.mouseleave=function(e){isOperateMouse(t)||((fe||ne)&&t.handleTargetLeaveEvent(e),_e&&t.emitEvent("cell-mouseleave",Object.assign({cell:e.currentTarget},Se),e))}),(Y.range||B)&&(be.mousedown=function(e){t.triggerCellMousedownEvent(e,Se)}),(K.isCurrent||C||v["cell-click"]||Q&&q||"row"===P.trigger||"cell"===P.trigger||"row"===W.trigger||"radio"===u.type&&"cell"===W.trigger||"row"===Y.trigger||"checkbox"===u.type&&"cell"===Y.trigger||"row"===D.trigger||u.treeNode&&"cell"===D.trigger)&&(be.click=function(e){t.triggerCellClickEvent(e,Se)}),(Te||v["cell-dblclick"])&&(be.dblclick=function(e){t.triggerCellDblclickEvent(e,Se)}),A.length){var Oe=(0,_util.mergeBodyMethod)(A,d,se);if(Oe){var Ce=Oe.rowspan,Le=Oe.colspan;if(!Ce||!Le)return null;1<Ce&&(we.rowspan=Ce),1<Le&&(we.colspan=Le)}}else if(E){var $e=E(Se)||{},He=$e.rowspan,Re=void 0===He?1:He,ke=$e.colspan,Ie=void 0===ke?1:ke;if(!Re||!Ie)return null;1<Re&&(we.rowspan=Re),1<Ie&&(we.colspan=Ie)}de&&A&&(1<we.colspan||1<we.rowspan)&&(de=!1),!de&&q&&(Q||J)&&(j.showStatus||j.showUpdateStatus)&&(b=t.isUpdateByRow(a,u.property));var Ae=[];return de&&(L?$:L)?Ae.push(e("div",{class:["vhb-cell",{"c--title":he,"c--tooltip":fe,"c--ellipsis":pe}],style:{maxHeight:ye&&(oe||ie)?"".concat(oe||ie,"px"):""}})):(Ae.push.apply(Ae,_toConsumableArray(renderLine(e,l,t,Se)).concat([e("div",{class:["vhb-cell",{"c--title":he,"c--tooltip":fe,"c--ellipsis":pe}],style:{maxHeight:ye&&(oe||ie)?"".concat(oe||ie,"px"):""},attrs:{title:he?t.getCellLabel(a,u):null}},u.renderCell(e,Se))])),me&&ge&&Ae.push(e("div",{class:"vhb-cell--valid",style:z.rule&&z.rule.maxWidth?{width:"".concat(z.rule.maxWidth,"px")}:null},[e("span",{class:"vhb-cell--valid-msg"},z.content)]))),e("td",{class:["vhb-body--column",u.id,(y={},_defineProperty(y,"col--".concat(ve),ve),_defineProperty(y,"col--".concat(G),G),_defineProperty(y,"col--last",p===h.length-1),_defineProperty(y,"col--tree-node",te),_defineProperty(y,"col--edit",ce),_defineProperty(y,"col--ellipsis",ye),_defineProperty(y,"fixed--hidden",de),_defineProperty(y,"col--dirty",b),_defineProperty(y,"col--actived",q&&ce&&re.row===a&&(re.column===u||"row"===j.mode)),_defineProperty(y,"col--valid-error",ge),_defineProperty(y,"col--current",R===u),y),_utils.default.getClass(le,Se),_utils.default.getClass(k,Se)],key:x||V.useKey?u.id:p,attrs:we,style:Object.assign({height:ye&&(oe||ie)?"".concat(oe||ie,"px"):""},I?_xeUtils.default.isFunction(I)?I(Se):I:null),on:be},Ae)}function renderRows(b,v,g,m,w,x){var _=g.stripe,T=g.rowKey,S=g.highlightHoverRow,O=g.rowClassName,C=g.rowStyle,L=g.editConfig,$=g.showOverflow,H=g.treeConfig,R=g.treeOpts,k=g.editOpts,I=g.treeExpandeds,A=g.scrollYLoad,E=g.editStore,W=g.rowExpandeds,Y=g.radioOpts,P=g.checkboxOpts,D=g.expandColumn,M=g.hasFixedColumn,B=g.fullAllDataRowIdData,q=g.rowOpts,j=[];return w.forEach(function(t,r){var o,e={},i=g.getVTRowIndex(t);o=g.getRowIndex(t),(q.isHover||S)&&(e.mouseenter=function(e){isOperateMouse(g)||g.triggerHoverEvent(e,{row:t,rowIndex:o})},e.mouseleave=function(){isOperateMouse(g)||g.clearHoverRow()});var n=(0,_util.getRowid)(g,t),l=B[n],a=l?l.level:0,s=l?l.seq:-1,c={$table:g,seq:s,rowid:n,fixed:m,type:renderType,level:a,row:t,rowIndex:o,$rowIndex:r},d=!1;if(L&&(d=-1<E.insertList.indexOf(t)),j.push(b("tr",{class:["vhb-body--row",{"row--stripe":_&&(g.getVTRowIndex(t)+1)%2==0,"is--new":d,"row--new":d&&(k.showStatus||k.showInsertStatus),"row--radio":Y.highlight&&g.selectRow===t,"row--checked":P.highlight&&g.isCheckedByCheckboxRow(t)},O?_xeUtils.default.isFunction(O)?O(c):O:""],attrs:{rowid:n},style:C?_xeUtils.default.isFunction(C)?C(c):C:null,key:T||q.useKey||H?n:r,on:e},x.map(function(e,l){return renderColumn(b,v,g,s,n,m,a,t,o,r,i,e,l,x,w)}))),D&&W.length&&-1<W.indexOf(t)){var u;H&&(u={paddingLeft:"".concat(a*R.indent+30,"px")});var p=D.showOverflow,h=_xeUtils.default.isUndefined(p)||_xeUtils.default.isNull(p)?$:p,f={$table:g,seq:s,column:D,fixed:m,type:renderType,level:a,row:t,rowIndex:o,$rowIndex:r};j.push(b("tr",{class:"vhb-body--expanded-row",key:"expand_".concat(n),style:C?_xeUtils.default.isFunction(C)?C(f):C:null,on:e},[b("td",{class:["vhb-body--expanded-column",{"fixed--hidden":m&&!M,"col--ellipsis":h}],attrs:{colspan:x.length}},[b("div",{class:"vhb-body--expanded-cell",style:u},[D.renderData(b,f)])])]))}if(H&&!A&&!R.transform&&I.length){var y=t[R.children];y&&y.length&&-1<I.indexOf(t)&&j.push.apply(j,_toConsumableArray(renderRows(b,v,g,m,y,x)))}}),j}function syncBodyScroll(e,l,t,r,o){(r||o)&&(r&&((0,_util.removeScrollListener)(r),r.scrollTop=t),o&&((0,_util.removeScrollListener)(o),o.scrollTop=t),clearTimeout(scrollProcessTimeout),scrollProcessTimeout=setTimeout(function(){(0,_util.restoreScrollListener)(r),(0,_util.restoreScrollListener)(o)},300))}var _default={name:"VhbTableBody",props:{tableData:Array,tableColumn:Array,fixedColumn:Array,size:String,fixedType:String},data:function(){return{wheelTime:null,wheelYSize:0,wheelYInterval:0,wheelYTotal:0}},mounted:function(){var e=this.$parent,l=this.$el,t=this.$refs,r=this.fixedType,o=e.elemStore,i="".concat(r||"main","-body-");o["".concat(i,"wrapper")]=l,o["".concat(i,"table")]=t.table,o["".concat(i,"colgroup")]=t.colgroup,o["".concat(i,"list")]=t.tbody,o["".concat(i,"xSpace")]=t.xSpace,o["".concat(i,"ySpace")]=t.ySpace,o["".concat(i,"emptyBlock")]=t.emptyBlock,this.$el.onscroll=this.scrollEvent,this.$el._onscroll=this.scrollEvent},beforeDestroy:function(){clearTimeout(this.wheelTime),this.$el._onscroll=null,this.$el.onscroll=null},destroyed:function(){var e=this.$parent,l=this.fixedType,t=e.elemStore,r="".concat(l||"main","-body-");t["".concat(r,"wrapper")]=null,t["".concat(r,"table")]=null,t["".concat(r,"colgroup")]=null,t["".concat(r,"list")]=null,t["".concat(r,"xSpace")]=null,t["".concat(r,"ySpace")]=null,t["".concat(r,"emptyBlock")]=null},render:function(t){var e,l=this._e,r=this.$parent,o=this.fixedColumn,i=this.fixedType,n=r.$scopedSlots,a=r.tId,s=r.tableData,c=r.tableColumn,d=r.visibleColumn,u=r.showOverflow,p=r.keyboardConfig,h=r.keyboardOpts,f=r.mergeList,y=r.spanMethod,b=r.scrollXLoad,v=r.scrollYLoad,g=r.isAllOverflow,m=r.emptyOpts,w=r.mouseConfig,x=r.mouseOpts,_=r.sYOpts;if(i&&(c=b||v||(u?g:u)?f.length||y||p&&h.isMerge?d:o:d),n.empty)e=n.empty.call(this,{$table:r},t);else{var T=m.name?_vHBTable.default.renderer.get(m.name):null,S=T?T.renderEmpty:null;e=S?S.call(this,t,m,{$table:r}):r.emptyText||_conf.default.i18n("vhb.table.emptyText")}return t("div",{class:["vhb-table--body-wrapper",i?"fixed-".concat(i,"--wrapper"):"body--wrapper"],attrs:{xid:a},on:v&&"wheel"===_.mode?{wheel:this.wheelEvent}:{}},[i?l():t("div",{class:"vhb-body--x-space",ref:"xSpace"}),t("div",{class:"vhb-body--y-space",ref:"ySpace"}),t("table",{class:"vhb-table--body",attrs:{xid:a,cellspacing:0,cellpadding:0,border:0},ref:"table"},[t("colgroup",{ref:"colgroup"},c.map(function(e,l){return t("col",{attrs:{name:e.id},key:l})})),t("tbody",{ref:"tbody"},renderRows(t,this,r,i,s,c))]),t("div",{class:"vhb-table--checkbox-range"}),w&&x.area?t("div",{class:"vhb-table--cell-area"},[t("span",{class:"vhb-table--cell-main-area"},x.extension?[t("span",{class:"vhb-table--cell-main-area-btn",on:{mousedown:function(e){r.triggerCellExtendMousedownEvent(e,{$table:r,fixed:i,type:renderType})}}})]:null),t("span",{class:"vhb-table--cell-copy-area"}),t("span",{class:"vhb-table--cell-extend-area"}),t("span",{class:"vhb-table--cell-multi-area"}),t("span",{class:"vhb-table--cell-active-area"})]):null,i?null:t("div",{class:"vhb-table--empty-block",ref:"emptyBlock"},[t("div",{class:"vhb-table--empty-content"},e)])])},methods:{scrollEvent:function(e){var l=this.$el,t=this.$parent,r=this.fixedType,o=t.$refs,i=t.elemStore,n=t.highlightHoverRow,a=t.scrollXLoad,s=t.scrollYLoad,c=t.lastScrollTop,d=t.lastScrollLeft,u=t.rowOpts,p=o.tableHeader,h=o.tableBody,f=o.leftBody,y=o.rightBody,b=o.tableFooter,v=o.validTip,g=p?p.$el:null,m=b?b.$el:null,w=h.$el,x=f?f.$el:null,_=y?y.$el:null,T=i["main-body-ySpace"],S=i["main-body-xSpace"],O=s&&T?T.clientHeight:w.clientHeight,C=a&&S?S.clientWidth:w.clientWidth,L=l.scrollTop,$=w.scrollLeft,H=$!==d,R=L!==c;t.lastScrollTop=L,t.lastScrollLeft=$,t.lastScrollTime=Date.now(),(u.isHover||n)&&t.clearHoverRow(),x&&"left"===r?syncBodyScroll(t,r,L=x.scrollTop,w,_):_&&"right"===r?syncBodyScroll(t,r,L=_.scrollTop,w,x):(H&&(g&&(g.scrollLeft=w.scrollLeft),m&&(m.scrollLeft=w.scrollLeft)),(x||_)&&(t.checkScrolling(),R&&syncBodyScroll(t,r,L,x,_))),a&&H&&t.triggerScrollXEvent(e),s&&R&&t.triggerScrollYEvent(e),H&&v&&v.visible&&v.updatePlacement(),t.emitEvent("scroll",{type:renderType,fixed:r,scrollTop:L,scrollLeft:$,scrollHeight:w.scrollHeight,scrollWidth:w.scrollWidth,bodyHeight:O,bodyWidth:C,isX:H,isY:R},e)},handleWheel:function(c,d,e,u,p){var h=this,f=this.$parent,l=f.$refs,t=f.elemStore,r=f.scrollYLoad,o=f.scrollXLoad,i=l.tableBody,n=l.leftBody,a=l.rightBody,y=i.$el,b=n?n.$el:null,v=a?a.$el:null,s=this.isPrevWheelTop===d?Math.max(0,this.wheelYSize-this.wheelYTotal):0,g=t["main-body-ySpace"],m=t["main-body-xSpace"],w=r&&g?g.clientHeight:y.clientHeight,x=o&&m?m.clientWidth:y.clientWidth;this.isPrevWheelTop=d,this.wheelYSize=Math.abs(d?e-s:e+s),this.wheelYInterval=0,this.wheelYTotal=0,clearTimeout(this.wheelTime);!function e(){var l=h.fixedType,t=h.wheelYTotal,r=h.wheelYSize,o=h.wheelYInterval;if(t<r){r<(t+=o=Math.max(5,Math.floor(1.5*o)))&&(o-=t-r);var i=y.scrollTop,n=y.clientHeight,a=y.scrollHeight,s=i+o*(d?-1:1);y.scrollTop=s,b&&(b.scrollTop=s),v&&(v.scrollTop=s),(d?s<a-n:0<=s)&&(h.wheelTime=setTimeout(e,10)),h.wheelYTotal=t,h.wheelYInterval=o,f.emitEvent("scroll",{type:renderType,fixed:l,scrollTop:y.scrollTop,scrollLeft:y.scrollLeft,scrollHeight:y.scrollHeight,scrollWidth:y.scrollWidth,bodyHeight:w,bodyWidth:x,isX:u,isY:p},c)}}()},wheelEvent:function(e){var l=e.deltaY,t=e.deltaX,r=this.$el,o=this.$parent,i=o.$refs,n=o.highlightHoverRow,a=o.scrollYLoad,s=o.lastScrollTop,c=o.lastScrollLeft,d=o.rowOpts,u=i.tableBody.$el,p=l,h=t,f=p<0;if(!(f?r.scrollTop<=0:r.scrollTop>=r.scrollHeight-r.clientHeight)){var y=r.scrollTop+p,b=u.scrollLeft+h,v=b!==c,g=y!==s;g&&(e.preventDefault(),o.lastScrollTop=y,o.lastScrollLeft=b,o.lastScrollTime=Date.now(),(d.isHover||n)&&o.clearHoverRow(),this.handleWheel(e,f,p,v,g),a&&o.triggerScrollYEvent(e))}}}};exports.default=_default;