UNPKG

@blueking/vxe-table

Version:

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

1 lines 13.8 kB
var _vue=require("vue"),_xeUtils=_interopRequireDefault(require("xe-utils")),_ui=require("../../../ui"),_utils=require("../../../ui/src/utils"),_util=require("../../src/util"),_dom=require("../../../ui/src/dom"),_log=require("../../../ui/src/log");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}let{getConfig,renderer,hooks,getI18n}=_ui.VxeUI,tableEditMethodKeys=["insert","insertAt","insertNextAt","insertChild","insertChildAt","insertChildNextAt","remove","removeCheckboxRow","removeRadioRow","removeCurrentRow","getRecordset","getInsertRecords","getRemoveRecords","getUpdateRecords","getEditRecord","getActiveRecord","getSelectedCell","clearEdit","clearActived","clearSelected","isEditByRow","isActiveByRow","setEditRow","setActiveRow","setEditCell","setActiveCell","setSelectCell"];hooks.add("tableEditModule",{setupTable(x){let{props:R,reactData:C,internalData:_}=x,o=x.getRefMaps().refElem,{computeMouseOpts:c,computeEditOpts:w,computeCheckboxOpts:m,computeTreeOpts:E,computeValidOpts:s}=x.getComputeMaps(),b={},f={},p=(e,t)=>{var{model:l,editRender:r}=t;r&&(l.value=(0,_util.getCellValue)(e,t),l.update=!1)},a=(e,t)=>{var{model:l,editRender:r}=t;r&&l.update&&((0,_util.setCellValue)(e,t,l.value),l.update=!1,l.value=null)},l=()=>{var e=o.value;e&&(e=e.querySelector(".col--selected"))&&(0,_dom.removeClass)(e,"col--selected")};function u(){var{editStore:e,tableColumn:t}=C,l=w.value,e=e.actived;let{row:r,column:o}=e;(r||o)&&("row"===l.mode?t.forEach(e=>a(r,e)):a(r,o))}function I(e,t){let{tableFullTreeData:i,afterFullData:n,fullDataRowIdData:d,fullAllDataRowIdData:s}=_;var l=E.value;let{rowField:u,parentField:c,mapChildrenField:v}=l,g=l.children||l.childrenField,w=t?"push":"unshift";e.forEach(l=>{let t=l[c];var r=(0,_util.getRowid)(x,l),o=t?_xeUtils.default.findTree(i,e=>t===e[u],{children:v}):null;if(o){var o=o.item,a=s[(0,_util.getRowid)(x,o)],a=a?a.level:0;let e=o[g],t=o[v];_xeUtils.default.isArray(e)||(e=o[g]=[]),_xeUtils.default.isArray(t)||(t=o[g]=[]),e[w](l),t[w](l);o={row:l,rowid:r,seq:-1,index:-1,_index:-1,$index:-1,items:e,parent:o,level:a+1,height:0,oTop:0};d[r]=o,s[r]=o}else{"development"===process.env.NODE_ENV&&t&&(0,_log.warnLog)("vxe.error.unableInsert"),n[w](l),i[w](l);a={row:l,rowid:r,seq:-1,index:-1,_index:-1,$index:-1,items:i,parent:null,level:0,height:0,oTop:0};d[r]=a,s[r]=a}})}let d=(t,l,d)=>{let o=R.treeConfig;var{mergeList:e,editStore:r}=C;let{tableFullTreeData:s,afterFullData:a,tableFullData:i,fullDataRowIdData:u,fullAllDataRowIdData:c}=_,v=E.value,{transform:n,rowField:g,mapChildrenField:w}=v,f=v.children||v.childrenField,p=(_xeUtils.default.isArray(t)||(t=[t]),(0,_vue.reactive)(x.defineField(t.map(e=>Object.assign(o&&n?{[w]:[],[f]:[]}:{},e)))));if(_xeUtils.default.eqNull(l))o&&n?I(p,!1):(p.forEach(e=>{var t=(0,_util.getRowid)(x,e),l={row:e,rowid:t,seq:-1,index:-1,_index:-1,$index:-1,items:a,parent:null,level:0,height:0,oTop:0};u[t]=l,c[t]=l,a.unshift(e),i.unshift(e)}),e.forEach(e=>{var t=e.row;0<t&&(e.row=t+p.length)}));else if(-1===l)o&&n?I(p,!0):(p.forEach(e=>{var t=(0,_util.getRowid)(x,e),l={row:e,rowid:t,seq:-1,index:-1,_index:-1,$index:-1,items:a,parent:null,level:0,height:0,oTop:0};u[t]=l,c[t]=l,a.push(e),i.push(e)}),e.forEach(e=>{var{row:t,rowspan:l}=e;t+l>a.length&&(e.rowspan=l+p.length)}));else if(o&&n){let n=_xeUtils.default.findTree(s,e=>l[g]===e[g],{children:w});if(n){let o=n.parent,a=o?o[w]:s;t=c[(0,_util.getRowid)(x,o)];let i=t?t.level:0;if(p.forEach((e,t)=>{var l=(0,_util.getRowid)(x,e);"development"===process.env.NODE_ENV&&e[v.parentField]&&o&&e[v.parentField]!==o[g]&&(0,_log.errLog)("vxe.error.errProp",[v.parentField+"="+e[v.parentField],v.parentField+"="+o[g]]),o&&(e[v.parentField]=o[g]);let r=n.index+t;d&&(r+=1),a.splice(r,0,e);t={row:e,rowid:l,seq:-1,index:-1,_index:-1,$index:-1,items:a,parent:o,level:i+1,height:0,oTop:0};u[l]=t,c[l]=t}),o){t=_xeUtils.default.findTree(s,e=>l[g]===e[g],{children:f});if(t){var h=t.items;let e=t.index;d&&(e+=1),h.splice(e,0,...p)}}}else"development"===process.env.NODE_ENV&&(0,_log.warnLog)("vxe.error.unableInsert"),I(p,!0)}else{if(o)throw new Error(getI18n("vxe.error.noTree",["insert"]));let r=-1;if(_xeUtils.default.isNumber(l)?l<a.length&&(r=l):r=x.findRowIndexOf(a,l),-1===(r=d?Math.min(a.length,r+1):r))throw new Error(getI18n("vxe.error.unableInsert"));a.splice(r,0,...p);t=x.findRowIndexOf(i,l);-1<t?i.splice(t+(d?1:0),0,...p):i.push(...p),e.forEach(e=>{var{row:t,rowspan:l}=e;t>r?e.row=t+p.length:t+l>r&&(e.rowspan=l+p.length)})}let m=r.insertMaps;return p.forEach(e=>{var t=(0,_util.getRowid)(x,e);m[t]=e}),x.cacheRowMap(),x.updateScrollYStatus(),x.handleTableData(o&&n),o&&n||x.updateAfterDataIndex(),x.updateFooter(),x.checkSelectionStatus(),C.scrollYLoad&&x.updateScrollYSpace(),(0,_vue.nextTick)().then(()=>(x.updateCellAreas(),x.recalculate())).then(()=>({row:p.length?p[p.length-1]:null,rows:p}))},r=(e,t,l,r)=>{var o=R.treeConfig;let{transform:a,rowField:i,parentField:n}=E.value;return o&&a?(_xeUtils.default.isArray(e)||(e=[e]),d(e.map(e=>Object.assign({},e,{[n]:t[i]})),l,r)):((0,_log.errLog)("vxe.error.errProp",["tree-config.treeConfig=false","tree-config.treeConfig=true"]),Promise.resolve({row:null,rows:[]}))},h=(e,t)=>{let l=R.mouseConfig;var r=C.editStore,{actived:r,focused:o}=r,{row:a,column:i}=r,n=s.value;let d=c.value;if(a||i){if(t&&(0,_util.getRowid)(x,t)!==(0,_util.getRowid)(x,a))return(0,_vue.nextTick)();u(),r.args=null,r.row=null,r.column=null,x.updateFooter(),x.dispatchEvent("edit-closed",{row:a,rowIndex:x.getRowIndex(a),$rowIndex:x.getVMRowIndex(a),column:i,columnIndex:x.getColumnIndex(i),$columnIndex:x.getVMColumnIndex(i)},e||null)}return(0,_vue.nextTick)(()=>{if(l&&d.area&&x.handleRecalculateCellAreas)return x.handleRecalculateCellAreas()}),n.autoClear&&("full"!==n.msgMode||"obsolete"===getConfig().cellVaildMode)&&x.clearValidate?x.clearValidate():(o.row=null,(o.column=null,_vue.nextTick)())};return b={insert(e){return d(e,null)},insertAt(e,t){return d(e,t)},insertNextAt(e,t){return d(e,t,!0)},insertChild(e,t){return r(e,t,null)},insertChildAt(e,t,l){return r(e,t,l)},insertChildNextAt(e,t,l){return r(e,t,l,!0)},remove(e){var t=R.treeConfig;let{mergeList:l,editStore:r,selectCheckboxMaps:o}=C,{tableFullTreeData:a,afterFullData:i,tableFullData:n}=_;var d=m.value,s=E.value;let{transform:u,mapChildrenField:c}=s,v=s.children||s.childrenField,{actived:g,removeMaps:w}=r,f=Object.assign({},r.insertMaps),p=Object.assign({},C.pendingRowMaps);s=d.checkField;let h=[];if(e?_xeUtils.default.isArray(e)||(e=[e]):e=n,e.forEach(e=>{var t;x.isInsertByRow(e)||(t=(0,_util.getRowid)(x,e),w[t]=e)}),!s){let t=Object.assign({},o);e.forEach(e=>{e=(0,_util.getRowid)(x,e);t[e]&&delete t[e]}),C.selectCheckboxMaps=t}return n===e?(e=h=n.slice(0),_.tableFullData=[],_.afterFullData=[],x.clearMergeCells()):t&&u?e.forEach(e=>{let t=(0,_util.getRowid)(x,e);var l=_xeUtils.default.findTree(a,e=>t===(0,_util.getRowid)(x,e),{children:c}),l=(l&&(l=l.items.splice(l.index,1),h.push(l[0])),_xeUtils.default.findTree(a,e=>t===(0,_util.getRowid)(x,e),{children:v})),l=(l&&l.items.splice(l.index,1),x.findRowIndexOf(i,e));-1<l&&i.splice(l,1)}):e.forEach(e=>{var t=x.findRowIndexOf(n,e);-1<t&&(t=n.splice(t,1),h.push(t[0]));let r=x.findRowIndexOf(i,e);-1<r&&(l.forEach(e=>{var{row:t,rowspan:l}=e;t>r?e.row=t-1:t+l>r&&(e.rowspan=l-1)}),i.splice(r,1))}),g.row&&-1<x.findRowIndexOf(e,g.row)&&b.clearEdit(),e.forEach(e=>{e=(0,_util.getRowid)(x,e);f[e]&&delete f[e],p[e]&&delete p[e]}),r.insertMaps=f,C.pendingRowMaps=p,x.updateFooter(),x.cacheRowMap(),x.handleTableData(t&&u),t&&u||x.updateAfterDataIndex(),x.checkSelectionStatus(),C.scrollYLoad&&x.updateScrollYSpace(),(0,_vue.nextTick)().then(()=>(x.updateCellAreas(),x.recalculate())).then(()=>({row:h.length?h[h.length-1]:null,rows:h}))},removeCheckboxRow(){return b.remove(x.getCheckboxRecords()).then(e=>(x.clearCheckboxRow(),e))},removeRadioRow(){var e=x.getRadioRecord();return b.remove(e||[]).then(e=>(x.clearRadioRow(),e))},removeCurrentRow(){var e=x.getCurrentRecord();return b.remove(e||[]).then(e=>(x.clearCurrentRow(),e))},getRecordset(){var e=b.getRemoveRecords(),t=x.getPendingRecords();let l=e.concat(t);var r=b.getUpdateRecords().filter(t=>!l.some(e=>x.eqRow(e,t)));return{insertRecords:b.getInsertRecords(),removeRecords:e,updateRecords:r,pendingRecords:t}},getInsertRecords(){var e=C.editStore;let l=_.fullAllDataRowIdData;e=e.insertMaps;let r=[];return _xeUtils.default.each(e,(e,t)=>{l[t]&&r.push(e)}),r},getRemoveRecords(){var e=C.editStore,e=e.removeMaps;let t=[];return _xeUtils.default.each(e,e=>{t.push(e)}),t},getUpdateRecords(){var{keepSource:e,treeConfig:t}=R,l=_.tableFullData,r=E.value;return e?(u(),t?_xeUtils.default.filterTree(l,e=>x.isUpdateByRow(e),r):l.filter(e=>x.isUpdateByRow(e))):[]},getActiveRecord(){return"development"===process.env.NODE_ENV&&(0,_log.warnLog)("vxe.error.delFunc",["getActiveRecord","getEditRecord"]),this.getEditRecord()},getEditRecord(){var e=C.editStore,t=_.afterFullData,l=o.value,{args:e,row:r}=e.actived;return e&&-1<x.findRowIndexOf(t,r)&&l.querySelectorAll(".vxe-body--column.col--active").length?Object.assign({},e):null},getSelectedCell(){var e=C.editStore,{args:e,column:t}=e.selected;return e&&t?Object.assign({},e):null},clearActived(e){return"development"===process.env.NODE_ENV&&(0,_log.warnLog)("vxe.error.delFunc",["clearActived","clearEdit"]),this.clearEdit(e)},clearEdit(e){return h(null,e)},clearSelected(){var e=C.editStore,e=e.selected;return e.row=null,e.column=null,l(),(0,_vue.nextTick)()},isActiveByRow(e){return"development"===process.env.NODE_ENV&&(0,_log.warnLog)("vxe.error.delFunc",["isActiveByRow","isEditByRow"]),this.isEditByRow(e)},isEditByRow(e){var t=C.editStore;return t.actived.row===e},setActiveRow(e){return"development"===process.env.NODE_ENV&&(0,_log.warnLog)("vxe.error.delFunc",["setActiveRow","setEditRow"]),b.setEditRow(e)},setEditRow(e,t){var l=_.visibleColumn;let r=_xeUtils.default.find(l,e=>(0,_utils.isEnableConf)(e.editRender));return t&&(r=_xeUtils.default.isString(t)?x.getColumnByField(t):t),x.setEditCell(e,r)},setActiveCell(e,t){return"development"===process.env.NODE_ENV&&(0,_log.warnLog)("vxe.error.delFunc",["setActiveCell","setEditCell"]),b.setEditCell(e,t)},setEditCell(t,e){var l=R.editConfig;let r=_xeUtils.default.isString(e)?x.getColumnByField(e):e;return t&&r&&(0,_utils.isEnableConf)(l)&&(0,_utils.isEnableConf)(r.editRender)?x.scrollToRow(t,r).then(()=>{var e=x.getCellElement(t,r);return e&&(f.handleEdit({row:t,rowIndex:x.getRowIndex(t),column:r,columnIndex:x.getColumnIndex(r),cell:e,$table:x}),_._lastCallTime=Date.now()),(0,_vue.nextTick)()}):(0,_vue.nextTick)()},setSelectCell(e,t){var l=C.tableData,r=w.value,t=_xeUtils.default.isString(t)?x.getColumnByField(t):t;return e&&t&&"manual"!==r.trigger&&-1<(r=x.findRowIndexOf(l,e))&&t&&(l=x.getCellElement(e,t),e={row:e,rowIndex:r,column:t,columnIndex:x.getColumnIndex(t),cell:l},x.handleSelected(e,{})),(0,_vue.nextTick)()}},f={handleEdit(l,r){var{editConfig:e,mouseConfig:o}=R,{editStore:a,tableColumn:i}=C,n=w.value,d=n.mode,{actived:a,focused:t}=a;let{row:s,column:u}=l;var c=u.editRender,v=l.cell||x.getCellElement(s,u),g=n.beforeEditMethod||n.activeMethod;if((l.cell=v)&&(0,_utils.isEnableConf)(e)&&(0,_utils.isEnableConf)(c)&&!x.isPendingByRow(s)){if(a.row!==s||"cell"===d&&a.column!==u){let t="edit-disabled";if(!g||g(Object.assign(Object.assign({},l),{$table:x,$grid:x.xegrid}))){o&&(b.clearSelected(),x.clearCellAreas)&&(x.clearCellAreas(),x.clearCopyCellArea()),x.closeTooltip(),a.column&&h(r),t="edit-activated",u.renderHeight=v.offsetHeight,a.args=l,a.row=s,a.column=u,"row"===d?i.forEach(e=>p(s,e)):p(s,u);let e=n.afterEditMethod;(0,_vue.nextTick)(()=>{f.handleFocus(l,r),e&&e(Object.assign(Object.assign({},l),{$table:x,$grid:x.xegrid}))})}x.dispatchEvent(t,{row:s,rowIndex:x.getRowIndex(s),$rowIndex:x.getVMRowIndex(s),column:u,columnIndex:x.getColumnIndex(u),$columnIndex:x.getVMColumnIndex(u)},r),"edit-activated"===t&&x.dispatchEvent("edit-actived",{row:s,rowIndex:x.getRowIndex(s),$rowIndex:x.getVMRowIndex(s),column:u,columnIndex:x.getColumnIndex(u),$columnIndex:x.getVMColumnIndex(u)},r)}else{e=a.column;o&&(b.clearSelected(),x.clearCellAreas)&&(x.clearCellAreas(),x.clearCopyCellArea()),e!==u&&(c=e.model,c.update&&(0,_util.setCellValue)(s,e,c.value),x.clearValidate)&&x.clearValidate(s,u),u.renderHeight=v.offsetHeight,a.args=l,a.column=u,setTimeout(()=>{f.handleFocus(l,r)})}t.column=null,t.row=null,x.focus()}return(0,_vue.nextTick)()},handleActived(e,t){return f.handleEdit(e,t)},handleClearEdit:h,handleFocus(r){var{row:o,column:a,cell:i}=r,n=a.editRender,d=w.value;if((0,_utils.isEnableConf)(n)){var s=renderer.get(n.name);let e=n.autofocus||n.autoFocus,t=n.autoSelect||n.autoselect,l;d.autoFocus&&(!e&&s&&(e=s.tableAutoFocus||s.tableAutofocus||s.autofocus),!t&&s&&(t=s.tableAutoSelect||s.autoselect),_xeUtils.default.isFunction(e)?l=e(r):e&&(l=!0===e?i.querySelector("input,textarea"):i.querySelector(e))&&l.focus()),l?t?l.select():_dom.browse.msie&&((n=l.createTextRange()).collapse(!1),n.select()):d.autoPos&&!a.fixed&&x.scrollToRow(o,a)}},handleSelected(e,t){var l=R.mouseConfig,r=C.editStore,o=c.value;let a=w.value,{actived:i,selected:n}=r,{row:d,column:s}=e,u=l&&o.selected;return!u||n.row===d&&n.column===s||(i.row!==d||"cell"===a.mode&&i.column!==s)&&(h(t),b.clearSelected(),x.clearCellAreas&&(x.clearCellAreas(),x.clearCopyCellArea()),n.args=e,n.row=d,n.column=s,u&&f.addCellSelectedClass(),x.focus(),t)&&x.dispatchEvent("cell-selected",e,t),(0,_vue.nextTick)()},addCellSelectedClass(){var e=C.editStore,e=e.selected,{row:e,column:t}=e;l(),e&&t&&(e=x.getCellElement(e,t))&&(0,_dom.addClass)(e,"col--selected")}},Object.assign(Object.assign({},b),f)},setupGrid(e){return e.extendTableMethods(tableEditMethodKeys)}});