@mescius/wijmo.grid.detail
Version:
UI library for pure JS, Angular, React, Vue and more...
14 lines (13 loc) • 11.2 kB
JavaScript
/*!
*
* Wijmo Library 5.20251.40
* https://developer.mescius.com/wijmo
*
* Copyright(c) MESCIUS inc. All rights reserved.
*
* Licensed under the End-User License Agreement For MESCIUS Wijmo Software.
* us.sales@mescius.com
* https://developer.mescius.com/wijmo/licensing
*
*/
"use strict";var __importStar=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var i in e)Object.hasOwnProperty.call(e,i)&&(t[i]=e[i]);t.default=e;return t};Object.defineProperty(exports,"__esModule",{value:!0});const wijmo_1=require("@mescius/wijmo"),wijmo_grid_1=require("@mescius/wijmo.grid"),selfModule=__importStar(require("@mescius/wijmo.grid.detail"));class DetailRow extends wijmo_grid_1.Row{constructor(e){super();this.isReadOnly=!0}get detail(){return this._detail}set detail(e){this._detail=e}}exports.DetailRow=DetailRow;class DetailMergeManager extends wijmo_grid_1.MergeManager{constructor(e){super();this._originalMergeManager=e.mergeManager}getMergedRange(e,t,i,l=!0){switch(e.cellType){case wijmo_grid_1.CellType.Cell:if(e.rows[t]instanceof DetailRow){e.columns._frozenInternal>0&&e.grid&&(e.grid.cloneFrozenCells=!1);return new wijmo_grid_1.CellRange(t,0,t,e.columns.length-1)}break;case wijmo_grid_1.CellType.RowHeader:let l=_isFrozen(e,t),o=_isNew(e,t),r=e.rows[t].dataItem;!r&&t>0&&e.rows[t]instanceof DetailRow&&(r=e.rows[t-1].dataItem);let s=t;for(;s>0&&e.rows[s-1].dataItem==r&&_isFrozen(e,s-1)==l&&_isNew(e,s-1)==o;)s--;let a=t;for(;a<e.rows.length-1&&e.rows[a+1].dataItem==r&&_isFrozen(e,a+1)==l&&_isNew(e,a+1)==o;)a++;a<e.rows.length-1&&e.rows[a+1]instanceof DetailRow&&_isFrozen(e,a+1)==l&&_isNew(e,a+1)==o&&a++;return s!=a?new wijmo_grid_1.CellRange(s,i,a,i):null}return this._originalMergeManager.getMergedRange(e,t,i,l)}}exports.DetailMergeManager=DetailMergeManager;function _isFrozen(e,t){return t<e.rows._frozenInternal}function _isNew(e,t){return e.rows[t]instanceof wijmo_grid_1._NewRowTemplate}exports.FlexGridDetailProviderClsNames={detail:"wj-detail",detailRow:"wj-detail-row",elemDetail:"wj-elem-detail"};wijmo_1._addCultureInfo("FlexGridDetailProvider",{ariaLabels:{toggleDetail:"Toggle Row Detail"},accessibilityHelperMessage:{showDetail:"Show detail row: {rowIndex}",hideDetail:"Hide detail row: {rowIndex}"}});var KeyAction,DetailVisibilityMode;!function(e){e[e.None=0]="None";e[e.ToggleDetail=1]="ToggleDetail"}(KeyAction=exports.KeyAction||(exports.KeyAction={}));!function(e){e[e.Code=0]="Code";e[e.Selection=1]="Selection";e[e.ExpandSingle=2]="ExpandSingle";e[e.ExpandMulti=3]="ExpandMulti"}(DetailVisibilityMode=exports.DetailVisibilityMode||(exports.DetailVisibilityMode={}));class FlexGridDetailProvider{constructor(e,t){this._maxHeight=null;this._mode=DetailVisibilityMode.ExpandSingle;this._animated=!1;this._keyActionEnter=KeyAction.None;this._g=e;e.mergeManager=new DetailMergeManager(e);e.addEventListener(e.rowHeaders.hostElement,"click",this._hdrClick.bind(this));e.addEventListener(e.rowHeaders.hostElement,"mousedown",t=>{let i=e.editableCollectionView;if(e.activeEditor||i&&i.currentEditItem){this._hdrClick(t);t.preventDefault()}});setTimeout(()=>{e.formatItem.addHandler(this._formatItem,this)},100);e.selectionChanged.addHandler(this._selectionChanged,this);e.resizedRow.addHandler(this._resizedRow,this);e.loadingRows.addHandler(()=>this.hideDetail());e.deletingRow.addHandler((e,t)=>{this.hideDetail(t.row)});e.updatedView.addHandler(this._handleFrozenCells,this);e.cloneFrozenCells=!1;e.draggingRow.addHandler((e,t)=>{if(t.row<e.rows.length-1&&e.rows[t.row+1]instanceof DetailRow){t.cancel=!0;this.hideDetail(t.row)}});e.addEventListener(e.hostElement,"keydown",e=>{if(e.keyCode==wijmo_1.Key.Enter&&this._keyActionEnter==KeyAction.ToggleDetail){let t=this._g.selection.row,i=this._g.activePanel.cellType;this._toggleRowDetail(t)&&i===wijmo_grid_1.CellType.Cell&&e.preventDefault()}},!0);e._root.addEventListener("scroll",()=>{wijmo_1.hasClass(e.activeCell,exports.FlexGridDetailProviderClsNames.detail)&&wijmo_1.Control.sharedState.InvalidScroll||wijmo_1.Control.refreshAll(e._root)});wijmo_1.copy(this,t)}get grid(){return this._g}get detailVisibilityMode(){return this._mode}set detailVisibilityMode(e){if((e=wijmo_1.asEnum(e,DetailVisibilityMode))!=this._mode){this._mode=e;this.hideDetail();this._g.invalidate()}}get maxHeight(){return this._maxHeight}set maxHeight(e){if((e=wijmo_1.asNumber(e,!0))!=this._maxHeight){this._maxHeight=e;this.hideDetail()}}get isAnimated(){return this._animated}set isAnimated(e){e!=this._animated&&(this._animated=wijmo_1.asBoolean(e))}get keyActionEnter(){return this._keyActionEnter}set keyActionEnter(e){this._keyActionEnter=wijmo_1.asEnum(e,KeyAction)}get createDetailCell(){return this._createDetailCellFn}set createDetailCell(e){this._createDetailCellFn=wijmo_1.asFunction(e,!0)}get disposeDetailCell(){return this._disposeDetailCellFn}set disposeDetailCell(e){this._disposeDetailCellFn=wijmo_1.asFunction(e,!0)}get rowHasDetail(){return this._rowHasDetailFn}set rowHasDetail(e){if((e=wijmo_1.asFunction(e,!0))!=this._rowHasDetailFn){this._rowHasDetailFn=e;this.hideDetail();this._g.invalidate()}}getDetailRow(e){let t=this._g.rows,i=this._toIndex(e),l=t[i]?t[i].dataItem:void 0;for(;i<t.length;i++){let e=t[i];if(e instanceof DetailRow)return e;if(e.dataItem!=l)return null}return null}isDetailVisible(e){return null!=this.getDetailRow(e)}isDetailAvailable(e){e=this._toIndex(e);return this._hasDetail(e)}hideDetail(e){let t=this._g,i=t.rows,l=wijmo_1.culture.FlexGridDetailProvider.accessibilityHelperMessage.hideDetail;if(null==e){for(let e=0;e<i.length;e++)i[e]instanceof DetailRow&&this.hideDetail(e);return}let o=this._toIndex(e);if(t.rows._frozenInternal>0&&o<=t.rows._frozenInternal-1){t.rows.frozenDetailChildren-=1;t.rows._frozenInternal-=1}else if(t.rows._frozenInternal<0&&t.rows.isFrozen(o)){t.rows.frozenDetailChildren-=1;t.rows._frozenInternal+=1}for(;!(i[o]instanceof DetailRow)&&o<i.length-1;)o++;let r=i[o];if(r instanceof DetailRow){let e=r.detail.parentElement;if(e){let i=e.querySelectorAll(`.${wijmo_1.ControlClsNames.hostElement}`);for(let e=0;e<i.length;e++){let l=wijmo_1.Control.getControl(i[e]);l&&l.containsFocus()&&t.focus(!0)}}let s=this.disposeDetailCell;!!s&&s(r)||wijmo_1.Control.disposeAll(r.detail);i.removeAt(o);l=wijmo_1.format(l,{rowIndex:o});t.announceShortcut(l)}}showDetail(e,t=!1){let i=this._g,l=i.rows,o=wijmo_1.culture.FlexGridDetailProvider.accessibilityHelperMessage.showDetail,r=this._toIndex(e);if(i.rows._frozenInternal>0&&r<=i.rows._frozenInternal-1){i.rows.frozenDetailChildren+=1;i.rows._frozenInternal+=1}else if(i.rows._frozenInternal<0&&i.rows.isFrozen(r)){i.rows.frozenDetailChildren+=1;i.rows._frozenInternal-=1}r>0&&l[r]instanceof DetailRow&&r--;let s=l[r].dataItem;for(;r<l.length-1&&l[r+1].dataItem==s;)r++;if(t){let e=i.selection,t=!1;for(let i=0;i<l.length-1;i++)if(i!=r&&l[i+1]instanceof DetailRow){this.hideDetail(i);i<r&&r--;if(i<e.row){e.row--;e.row2--;t=!0}}t&&i.select(e,!1)}if(!this.isDetailVisible(r)&&this._hasDetail(r)){let e=new DetailRow(l[r]),t=this._createDetailCell(l[r]);e.detail=t;if(t){l.insert(r+1,e);o=wijmo_1.format(o,{rowIndex:r+1});i.announceShortcut(o);let s=i.containsFocus();if(this._animated){let e=t.style;e.transform="translateY(-100%)";e.opacity="0";wijmo_1.animate(l=>{if(l<1){e.transform="translateY("+(100*-(1-l)).toFixed(0)+"%)";e.opacity=(l*l).toString()}else{e.transform=e.opacity="";wijmo_1.Control.invalidateAll(t);s&&i.scrollIntoView(r,-1)}})}else s&&i.scrollIntoView(r,-1,!0)}}}_sizeDetailRow(e,t=!1){let i=this._g,l=e.detail;wijmo_1.Control.refreshAll(l);const o=t?l.scrollHeight:l.offsetHeight;let r=o+i._cellPadVert+1,s=this._maxHeight;wijmo_1.isNumber(s)&&s>0&&r>s&&(r=s);e.height=r;l.style.height||(l.style.height="100%");let a=l.querySelector(`.${wijmo_grid_1.FlexGridClsNames.hostElement}`);a&&!a.style.height&&(a.style.height="100%");return o}_handleFrozenCells(){let e=this._g,t=e.hostElement,i=`.${wijmo_grid_1.FlexGridClsNames.hostElement}`,l=wijmo_1.Control.getControl(t.querySelector(i));if(l instanceof wijmo_grid_1.FlexGrid&&(l.rows._frozenInternal||l.columns._frozenInternal)){wijmo_1.setCss([e._eTL,e._eBL,e._eCFtr,e._eRHdr,e._eMarquee],{zIndex:"13"});wijmo_1.setCss(e._eCHdr,{zIndex:"14"});let l=t.querySelectorAll(`.${wijmo_grid_1.FlexGridClsNames.frozen}`);for(let e=0;e<l.length;e++){let o=l[e];if(wijmo_1.closest(o,i)==t){let e=parseInt(o.style.zIndex);o.style.zIndex=(e%10+10).toString()}}}}_toIndex(e){return e instanceof wijmo_grid_1.Row?e.index:wijmo_1.asNumber(e)}_hdrClick(e){if(!e.defaultPrevented&&0==e.button&&wijmo_1.closestClass(e.target,FlexGridDetailProvider._WJC_DETAIL)){let t=DetailVisibilityMode;switch(this._mode){case t.ExpandMulti:case t.ExpandSingle:let i=this._g,l=i.hitTest(e.target);l.panel||(l=i.hitTest(e));l.panel&&this._toggleRowDetail(l.row)&&e.preventDefault()}}}_toggleRowDetail(e){if(e>-1){if(this.isDetailVisible(e)){this.hideDetail(e);return!0}if(this._hasDetail(e)){this.showDetail(e,this._mode==DetailVisibilityMode.ExpandSingle);return!0}}return!1}_selectionChanged(e,t){if(this._mode==DetailVisibilityMode.Selection){this._toSel&&clearTimeout(this._toSel);this._toSel=setTimeout(()=>{let t=e._selHdl.selection.row;t>-1?this.showDetail(t,!0):this.hideDetail()},300)}}_formatItem(e,t){let i=this._g,l=t.cell,o=t.getRow(),r=DetailVisibilityMode;if(t.panel==i.cells&&o instanceof DetailRow&&null!=o.detail&&!wijmo_1.hasClass(l,exports.FlexGridDetailProviderClsNames.detail)){wijmo_1.addClass(l,exports.FlexGridDetailProviderClsNames.detail);wijmo_1.addClass(l.parentElement,exports.FlexGridDetailProviderClsNames.detailRow);l.textContent="";l.style.textAlign="";l.className=l.className.replace(/wj\-align\-[\S]+/g,"");l.appendChild(o.detail);null==o.height?0===this._sizeDetailRow(o)&&setTimeout(()=>{this._sizeDetailRow(o,!0)},1):wijmo_1.Control.refreshAll(o.detail)}if(t.panel==i.rowHeaders&&0==t.col&&this._hasDetail(t.row)){l.style.cursor="";switch(this._mode){case r.ExpandMulti:case r.ExpandSingle:let e=this.isDetailVisible(t.row),i=e?"minus":"plus",o=FlexGridDetailProvider._WJC_DETAIL;l.innerHTML=`<div class="${wijmo_1.InputFormElementsClsNames.btn} ${wijmo_1.GlyphClsNames.btnGlyph} `+o+'" role="button" tabindex="-1">'+`<span class="${wijmo_1.GlyphClsNames.glyph}-`+i+'"></span></div>';let s=l.children[0],a=wijmo_1.culture.FlexGridDetailProvider.ariaLabels.toggleDetail;wijmo_1.setAriaLabel(s,a);wijmo_1.setAttribute(s,"aria-expanded",e)}}}_resizedRow(e,t){let i=t.getRow();i instanceof DetailRow&&i.detail&&wijmo_1.Control.refreshAll(i.detail)}_hasDetail(e){let t=this._g.rows[e];return wijmo_1.isFunction(this._rowHasDetailFn)?this._rowHasDetailFn(t):this._isRegularRow(t)}_isRegularRow(e){return!(e instanceof wijmo_grid_1._NewRowTemplate||e instanceof DetailRow)&&!(e instanceof wijmo_grid_1.GroupRow&&!this._g.childItemsPath)}_createDetailCell(e){return this.createDetailCell?this.createDetailCell(e):null}}FlexGridDetailProvider._WJC_DETAIL=exports.FlexGridDetailProviderClsNames.elemDetail;exports.FlexGridDetailProvider=FlexGridDetailProvider;wijmo_1._registerModule("wijmo.grid.detail",selfModule);