fix: tui-Grid init fix

src/main/webapp/resources/framework/js/cmm/xit-tui-grid.js

@@ -67,50 +67,6 @@ const customTheme = {
 	}
 }
 
-const defaultOptions = {
-	el: null,
-		//[선택]DataSource 정보(readData|createData|updateData|modifyData|deleteData 등)
-		data: {
-		headers: {
-			AJAX: true
-		},
-		withCredentials: false,
-			initialRequest: false,
-			api: {
-			readData: {
-				contentType: 'application/json',
-					dataType: 'json',
-					method: 'get',
-					initParams: {}
-			}
-		, createData: {url: '', method: 'POST'}
-		, updateData: {url: '', method: 'PUT'}
-		, modifyData: {url: '', method: 'PUT'}
-		, deleteData: {url: '', method: 'DELETE'}
-		}
-	},
-	header: {},                   //[선택]헤더정보(헤더 명칭 및 매핑 field)
-	columns: [],                  //[필수]컬럼정보(헤더 명칭 및 매핑 field)
-		rowHeaders: [],               //[선택]ROW 헤더 타입(rowNum: 순번, checkbox: 체크박스)
-		bodyHeight: 467,              //[선택]Grid 높이 (number(단위: px)|'auto'|'fitToParent')
-		minBodyHeight: 350,           //[선택]Grid 최소 높이 (단위: px)
-		rowHeight: 30,                //[선택]Grid row 높이 (number(단위: px)|'auto' )
-		minRowHeight: 25,             //[선택]Grid row 최소 높이 (단위: px)
-		pageOptions: {
-		useClient: false,
-			page: 1,
-			perPage: 15
-	}, //[선택]한 페이지에 출력할 건수
-	columnOptions: {              //[선택]고정 컬럼
-		//frozenCount: 0 //고정컬럼 갯수
-		frozenBorderWidth: 2 //고정컬럼 보더(border) 두께
-			, resizable: true
-			, minWidth: 100 //최소 사이즈
-	},
-	summary: [],                       //[선택]하단합계
-		treeColumnOptions: {},        //[선택]tree 구조 grid
-};
-
 class CustomRowNumberRenderer {
 	constructor(props) {
 		const el = document.createElement('span');
@@ -135,9 +91,7 @@ class CustomRowNumberRenderer {
 }
 
 const TuiGrid = {
-	//instance: null,
-	elId: null,
-	/*
+	instance: null,
 	defaultOptions: {
 		el: $('#grid'),
 		//[선택]DataSource 정보(readData|createData|updateData|modifyData|deleteData 등)
@@ -181,8 +135,10 @@ const TuiGrid = {
 		summary: [],                       //[선택]하단합계
 		treeColumnOptions: {},        //[선택]tree 구조 grid
 	},
-*/
+
 	of: function(options, dataSource, successCallback) {
+		this.instance = null;
+
 		// rowNum fix
 		options.rowHeaders.filter((r, idx) => {
 			if(r === 'rowNum'){
@@ -194,21 +150,22 @@ const TuiGrid = {
 				}
 			}
 		})
-		const optionObj = $.extend(true, defaultOptions, options, {data: dataSource});
-		optionObj.el = document.getElementById(options.el);
-		this.elId = options.el;
+		const newOptions = $.extend(true, {}, this.defaultOptions, options, {data: dataSource});
+		newOptions.el = document.getElementById(options.el);
+		//this.elId = options.el;
 
-		const instance = new tui.Grid(optionObj);
 		// language
 		tui.Grid.setLanguage('ko');
 		// theme
 		tui.Grid.applyTheme('custom', eval(customTheme));
 		//Grid.applyTheme('custom', customTheme);
 		//Grid.applyTheme('striped');
+		this.instance = new tui.Grid(newOptions);
 
-		instance.on('successResponse', function(ev){
+
+		this.instance.on('successResponse', function(ev){
 			console.log(`successResponse >>>>>>>>>>>>>>>>>> `,ev);
-			const msg = JSON.parse(ev.xhr.response).message;	//tui-grid 기본 format 메시지
+			var msg = JSON.parse(ev.xhr.response).message;	//tui-grid 기본 format 메시지
 			console.log(msg);
 			//if($('#totCnt span')){
 			if(document.getElementById('totCnt')){
@@ -216,7 +173,7 @@ const TuiGrid = {
 				// paging
 				if(res.data.pagination){
 					$('#totCnt span').text(res.data.pagination.totalCount);
-				// no paging
+					// no paging
 				}else{
 					$('#totCnt span').text(res.count)
 				}
@@ -227,36 +184,39 @@ const TuiGrid = {
 			//if(successCallback)	successCallback(ev);
 		});
 		// 결과가 false인 경우 발생한 경우
-		instance.on('failResponse', function(ev){
+		this.instance.on('failResponse', function(ev){
 			console.log(`failResponse >>>>>>>>>>>>>>>>>> `,ev);
 			try {
-				var msg = JSON.parse(ev.xhr.response).message;	//tui-grid 기본 format 메시지
-				if(!msg) {
-					msg = JSON.parse(ev.xhr.response).resp.message;
+				//tui-grid 기본 format 메시지
+				const res = JSON.parse(ev.xhr.response);
+				let msg = '';
+				if(!res?.message) {
+					msg = res.message;
 				}else {
-					alert(msg);
+					alert(res);
 				}
 			} catch (e) {
 				console.error('TuiGrid::failResponse parsing error', e)
 			}
 		});
 		// 오류가 발생한 경우
-		instance.on('errorResponse', function(ev){
+		this.instance.on('errorResponse', function(ev){
 			console.log(`errorResponse >>>>>>>>>>>>>>>>>> `,ev);
 			try {
-				var msg = JSON.parse(ev.xhr.response).message;	//tui-grid 기본 format 메시지
-				if(!msg) {
-					msg = JSON.parse(ev.xhr.response).resp.message;
+				//tui-grid 기본 format 메시지
+				const res = JSON.parse(ev.xhr.response);
+				let msg = '';
+				if(!res?.message) {
+					msg = res.message;
 				}else {
-					alert(msg);
+					alert(res);
 				}
 			} catch (e) {
 				console.error('TuiGrid::errorResponse parsing error', e)
 			}
 		});
 
-		//console.log(optionObj.data.api.readData)
-		return instance;
+		return this.instance;
 	},