From a29e302bc2a8756e97b565faa743568786371828 Mon Sep 17 00:00:00 2001 From: "Jonguk. Lim" Date: Tue, 8 Nov 2022 04:30:21 +0900 Subject: [PATCH] fix: grid cell style --- README.md | 22 ++++++++++ .../biz/mng/auth/mngAuthRoleGrantMgtPopup.jsp | 44 +++++++++++-------- .../biz/mng/auth/mngAuthUserMgtForm.jsp | 3 +- .../resources/framework/js/cmm/cmmUtil.js | 16 +++++++ .../framework/js/cmm/xit-tui-grid.js | 3 +- 5 files changed, 67 insertions(+), 21 deletions(-) diff --git a/README.md b/README.md index 3d401ac4..8cfac1cb 100644 --- a/README.md +++ b/README.md @@ -128,3 +128,25 @@ access token : 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 <%@include file="/WEB-INF/jsp/framework/biz-popup-btn.jsp"%> ``` +#### columns style +```js + { + header: '롤 명', + name: 'roleNm', + width: 150, + sortingType: 'desc', + sortable: true, + filter: 'select', + renderer: { + styles: { + //fontWeight: 'bold', + background: (props) => props.value === 'Y' ? 'cyan' : 'red' + }, + attributes: { + 'data-type': 'default', + title: (props) => `title: ${props.formattedValue}` + }, + classNames: ['blue'] + } + } +``` diff --git a/src/main/webapp/WEB-INF/jsp/framework/biz/mng/auth/mngAuthRoleGrantMgtPopup.jsp b/src/main/webapp/WEB-INF/jsp/framework/biz/mng/auth/mngAuthRoleGrantMgtPopup.jsp index d3cc477a..ad67a800 100644 --- a/src/main/webapp/WEB-INF/jsp/framework/biz/mng/auth/mngAuthRoleGrantMgtPopup.jsp +++ b/src/main/webapp/WEB-INF/jsp/framework/biz/mng/auth/mngAuthRoleGrantMgtPopup.jsp @@ -65,6 +65,10 @@ const fnBiz = { search: () => { GRID.reloadData(); + //TODO : onGridUpdated + GRID.on('onGridUpdated', (ev) => { + console.log('%%%%%%%%%%%%%>>>>>>>',ev) + }) // 그리드 레이아웃 새로고침 (로드가 다 되지 않는 경우 그리드가 흰색 화면으로 출력될 때가 있다.)) } ,add: () => { const arrChecks = GRID.getCheckedRows(); @@ -130,10 +134,8 @@ }, { header: '등록여부', + headerCellClass: 'blue', name: 'regYn', - copyOptions: { - useListItemText: true - }, width: 60, align: 'center', sortable: true, @@ -154,13 +156,12 @@ ] } }, - onBeforeChange: function(ev) { //변경 전(ev.value)/후(ev.nextValue) -// console.log('Grade before change:' + ev); - }, - onAfterChange: function(ev) { //변경 전(ev.prevValue)/후(ev.value) -// console.log('Grade after change:' + ev); + //TODO : 컬럼 스타일 : README.md 참조 + renderer: { + styles: { + background: (props) => props.value === 'Y' ? 'cyan' : 'red' + } } - /* //에디터 적용 */ }, { header: '롤 패턴', @@ -206,20 +207,24 @@ el: 'grid', rowHeaders: ['rowNum', 'checkbox'], columns: gridColumns, - pageOptions: { - useClient: true, - perPage: 100 - }, + //TODO : 페이징 미사용시 + //페이지처리 hide + pagination: false, + pageOptions: null, + // pageOptions: { + // useClient: true, + // perPage: 100 + // }, columnOptions: { frozenCount: 3 }, - bodyHeight: 400 + bodyHeight: 400, + onGridMounted: (ev)=>{ + console.log('mounted~~~~~~~~',ev) + } }; const gridDatasource = { //DataSource - /* ----------------------- - * DataSource API Setting - ----------------------- */ initialRequest: true, // 화면 load시 조회 안함 - default api: { readData: { @@ -230,7 +235,10 @@ } }; - GRID = TuiGrid.of(gridOptions, gridDatasource, (res) => { + GRID = TuiGrid.of(gridOptions, gridDatasource, (ev) => { + console.table('---------->>>',ev) + console.log('---------->>>',ev.instance) + console.log('---------->>>',ev.responseData) }); } diff --git a/src/main/webapp/WEB-INF/jsp/framework/biz/mng/auth/mngAuthUserMgtForm.jsp b/src/main/webapp/WEB-INF/jsp/framework/biz/mng/auth/mngAuthUserMgtForm.jsp index b9b4a59a..0733c3ad 100644 --- a/src/main/webapp/WEB-INF/jsp/framework/biz/mng/auth/mngAuthUserMgtForm.jsp +++ b/src/main/webapp/WEB-INF/jsp/framework/biz/mng/auth/mngAuthUserMgtForm.jsp @@ -180,10 +180,9 @@ name: 'authorCode', width: 120, sortable: true, - filter: 'select', formatter: 'listItemText', editor: { - type: "select", + type: "radio", options: { listItems: [ diff --git a/src/main/webapp/resources/framework/js/cmm/cmmUtil.js b/src/main/webapp/resources/framework/js/cmm/cmmUtil.js index 1e6f5938..d5383c56 100644 --- a/src/main/webapp/resources/framework/js/cmm/cmmUtil.js +++ b/src/main/webapp/resources/framework/js/cmm/cmmUtil.js @@ -402,6 +402,14 @@ function setDateFmt(srcDateStr, delimiter = '-') { } } +/** + * 
+ * form의 element data를 json data로 return
+ * form 내의 각 element name 필수
+ *
+ * @param {Object} formObj form Object + * @returns {Object} json Object + */ function getFormJson(formObj) { // Getting an FormData let data = new FormData(formObj); @@ -413,6 +421,14 @@ function getFormJson(formObj) { //console.log(JSON.stringify(serializedFormData)); } +/** + * 
+ * FormData(new FormData(formObj)) 를 json Object로 return
+ * form 내의 각 element의 name 필수
+ *
+ * @param formData new FormData(formObj) 형태의 데이타 + * @returns {Object} json Object + */ function serialize (formData) { let rtnData = {}; diff --git a/src/main/webapp/resources/framework/js/cmm/xit-tui-grid.js b/src/main/webapp/resources/framework/js/cmm/xit-tui-grid.js index 6971ddac..dc584ddc 100644 --- a/src/main/webapp/resources/framework/js/cmm/xit-tui-grid.js +++ b/src/main/webapp/resources/framework/js/cmm/xit-tui-grid.js @@ -157,7 +157,8 @@ const TuiGrid = { console.log('totCnt >>>>> ',$('#totCnt span').text()) } - if(successCallback) successCallback(JSON.parse(ev.xhr.response)); + //if(successCallback) successCallback(JSON.parse(ev.xhr.response)); + if(successCallback) successCallback(ev); }); // 결과가 false인 경우 발생한 경우 this.instance.on('failResponse', function(ev){