[IBSheet] 시트 우측 마우스 메뉴, 컬럼 정보 저장 (헤더 순서 변경)

헤더 우측 마우스 클릭 시 메뉴 설정하고

컬럼 위치를 변경한 다음 저장할 수 있도록 하는 기능이다.

 

Options = {
        Cfg: {
            StorageSession: 1, // 개인화 기능(컬럼정보 저장) 사용 여부
        },
        Def: {
            Header: { //헤더 영역 행에 대한 설정
                Menu: {
                    Items: [
                        {
                            Name: "컬럼 정보 저장"
                        },
                        {
                            Name: "컬럼 정보 저장 취소"
                        },
                        {
                            Name: "*-"
                        },
                        {
                            Name: "필터행 생성"
                        },
                        {
                            Name: "필터 감추기"
                        }
                    ],
                    OnSave: function (item, data) {
                        var sheet = this.Sheet.Dialog ? this.Sheet.Dialog : this.Sheet;
                        if (item) {
                            var col = item.Owner.Col;
                            switch (item.Name) {
                                case '컬럼 감추기':
                                    if ((sheet.id.indexOf('pivotSheet_') == 0) && item.Owner.Row[col + 'Span'] > 1) {
                                        var rowSpan = item.Owner.Row[col + 'Span'];
                                        var colIdx = sheet.getColIndex(col, true);
                                        for (var i = 0; i < rowSpan; i++) {
                                            var mergedCol = sheet.getColByIndex(colIdx + i, true);
                                            if (sheet.Cols[mergedCol].Visible) sheet.hideCol(mergedCol, 1, null, 0);
                                        }
                                        sheet.rerender();
                                    } else sheet.hideCol(col, 1, null, 1);
                                    break;
                                case '컬럼 감추기 취소':
                                    if ((sheet.id.indexOf('pivotSheet_') == 0) && item.Owner.Row[col + 'Span'] > 1) {
                                        sheet.showCol(null, null, 0);
                                        sheet.rerender();
                                    } else sheet.showCol(null, null, 1);
                                    break;
                                case '컬럼 정보 저장':
                                    this.Sheet.saveCurrentInfo();
                                    break;
                                case '컬럼 정보 저장 취소':
                                    this.Sheet.clearCurrentInfo();
                                    this.Sheet.showMessageTime({
                                        message: "컬럼 정보를 삭제하였습니다.<br>새로고침하시면 초기 설정의 시트를 확인하실 수 있습니다."
                                    });
                                    break;
                                case '필터행 생성':
                                    this.Sheet.showFilterRow();
                                    break;
                                case '필터 감추기':
                                    this.Sheet.hideFilterRow();
                                    break;
                            }
                        }
                    }
                }
            },
            Row: {
            ...
            }
        }
    }
};

 

 

 

 

 

 

 

---

 

 

 

 

 

 

간단한 예제)

 

추가한 시트를 바로 삭제하기

 

 

1. 우측 마우스 클릭 후 삭제 선택

2. 삭제 버튼 클릭

 

    const initOptions = {
        Cfg: {
            PasteFocused: 9,	// 붙여넣기 방법
            MsgLocale: sheetLocale,	// 언어 설정
            Menu: {
                Items: [
                    {Name: "delete", Text:_t("common.btnText.delete"), Value:0}
                ]
            }
        },
        Def: {
            ...
        },
        Cols: [
            ...
            {Header: _t("page.item.gridHeader.remark"), Name: "remark", Type: "String", Align: "center", Width: 200, CanEdit:1}
        ],
        Events: {
            onAfterPaste: function (evtParam) {
                const sheet = evtParam.sheet;
                sheet.addRows(1)
            },
            onClick: function (evtParam) {
            // 삭제 버튼 클릭 시 삭제
                const sheet = evtParam.sheet;
                const clickedRow = evtParam.row;
                if (clickedRow && sheet.getRowKind(clickedRow) === "Data") {
                    if (evtParam.col === 'itemDelete') {
                        sheet.removeRow(clickedRow);
                    }
                }
            },
            onSelectMenu: function (evtParam) {
            // 우측 마우스로 '삭제'클릭 시 삭제
                const sheet = evtParam.sheet;
                const clickedRow = evtParam.row;
                if (clickedRow && sheet.getRowKind(clickedRow) === "Data") {
                    evtParam.result===0? sheet.removeRow(clickedRow): "";
                    // evtParam.result===0? sheet.deleteRow(clickedRow, 1, 0, 0): "";
                }
            }
        },
    }