oqpo-view/src/main/webapp/js/app/system/ITP_SYSTEM03010.js

const SYSTEM03010_GRID_ID = '#ITP_SYSTEM03010_jqGrid';
const SYSTEM03010_GRID_LIST = '#ITP_SYSTEM03010_jqGrid_list';
const SYSTEM03010_GRID_PAGER = '#ITP_SYSTEM03010_jqGridPager';
const SYSTEM03010_GRID_EMPTY = '#ITP_SYSTEM03010_jqGridEmpty';

let SYSTEM03010_GRID_LAST_ROW_ID;

let MENU_MENU_SEARCH = '/api/menu/menu-search';
let MENU_INFO_MENU = '/api/menu/info-menu';
let ACT_SAVE_ACTION = '/api/act/save-action';
let ACT_DETAIL_GRID_LIST = '/api/act/detail-grid-list';

require(['config'], function() {
	require([
		'jquery'
	], function($) {
		// 버튼 권한설정
		fn_proc_btn_auth('SYSTEM03010');
		// 공통코드
		fn_make_input_common_cd(CODE_LIST, 'ACT_TP_CD', 'ITP_FORM_SYSTEM03010_ACT_TP_CD', true);
		
		itp_fn_SYSTEM03010_search();
		itp_fn_jqgrid_resize('#ITP_SYSTEM03010_jqGrid', '#ITP_SYSTEM03010_jqGrid_list', 'sm');
		itp_fn_SYSTEM03010_detail_grid.init();
    	itp_fn_fire_window_resize();

		$('#ITP_BTN_SYSTEM03010_SRH').on('click', function() {
			itp_fn_SYSTEM03010_search();
		});

		$('#ITP_AJAX_SYSTEM03010_SRH_CONTAINER').on('click', '.list-group .list-group-item', function() {
			const $this = $(this);
			var itemFn = {
				callBack: function(args) {
					$('#ITP_AJAX_SYSTEM03010_SRH_CONTAINER .list-group .list-group-item').removeClass('active');
					$this.addClass('active');
					const txt = $this.attr('data-itp-param-key');
					itp_fn_SYSTEM03010_detail(txt);
				}
			};
			if (itp_fn_check_grid_is_writing('#ITP_SYSTEM03010_jqGrid')) {
				itp_fn_modal_confirm(ITP_MSG_LOCALE.message.ajax.cancelData, itemFn, $this);
			} else {
				itemFn.callBack($this);
			}
		});

		$('#ITP_BTN_SYSTEM03010_SAVE').on('click', function() {
			const formId = '#ITP_FORM_SYSTEM03010';
			if (itp_fn_grid_validate_row('#ITP_SYSTEM03010_jqGrid')) {
				let gridInsertData = [];
				let gridUpdateData = [];
				let gridDeleteData = [];
				const rowData = $('#ITP_SYSTEM03010_jqGrid').getRowData();
				const keyValue = $(formId + '_MENU_NO').val();
				$.each(rowData, function(key, value) {
					if (value.viewCd != 'R') {
						value.menuNo = keyValue;
						if (value.viewCd == 'C') {
							gridInsertData.push(value);
						} else if (value.viewCd == 'U') {
							gridUpdateData.push(value);
						} else if (value.viewCd == 'D') {
							gridDeleteData.push(value);
						}
					}
				});
				let param = $(formId + '_DETAIL').serializeObject();
				param.gridInsertData = gridInsertData;
				param.gridUpdateData = gridUpdateData;
				param.gridDeleteData = gridDeleteData;
				console.log(param); return;
				var searhFn = function() {
					var keyword = {keyword: $('#ITP_KEYWORD_SYSTEM03010_INPUT').val()};
					var param = $('#ITP_SYSTEM03010_ADV_SRH_FORM').serialize() + '&' + $.param(keyword);
					fn_ajax_call(MENU_MENU_SEARCH, param, itp_fn_SYSTEM03010_search_callback, 'GET');					
				};
				fn_ajax_call(ACT_SAVE_ACTION, JSON.stringify(param), searhFn, 'POST');
			}
		});
		
		$(document).on('change', SYSTEM03010_GRID_ID + ' select[name=actTpCd]', function() {
			var actTpCd = $(this).find('option:selected').val();
			var menuId = $('#ITP_FORM_SYSTEM03010_MENU_ID').val();
			$(this).closest("tr").find("input[name=actId]").val(menuId + '_' + actTpCd);
		});		
	});
});

var itp_fn_SYSTEM03010_search = function() {
	var searhFn = {
		callBack: function(args) {
			var keyword = {keyword: $('#ITP_KEYWORD_SYSTEM03010_INPUT').val()};
			var param = $('#ITP_SYSTEM03010_ADV_SRH_FORM').serialize() + '&' + $.param(keyword);
			fn_ajax_call(MENU_MENU_SEARCH, param, itp_fn_SYSTEM03010_search_callback, 'GET');
		}
	};
	if (itp_fn_check_grid_is_writing('#ITP_SYSTEM03010_jqGrid')) {
		itp_fn_modal_confirm(ITP_MSG_LOCALE.message.ajax.cancelData, searhFn, null);
	} else {
		searhFn.callBack();
	}
};

var itp_fn_SYSTEM03010_search_callback = function(result) {
	
	$('#ITP_SYSTEM03010_TREEVIEW').empty(); 
	
	$.each(result.searchList, function(index, item) {
		if(item.level == 1) { // 최상위메뉴
			$('#ITP_SYSTEM03010_TREEVIEW').append($('#ITP_SYSTEM03010_MENUROWCOPY').val());
			$('#ITP_SYSTEM03010_TREEVIEW li:last').append('<ul id="ITP_SYSTEM03010_LVL2_LIST"></ul>');
			
			$('#ITP_SYSTEM03010_TREEVIEW .list-group-item:first').attr('data-itp-param-key', item.menuNo);
			$('#ITP_SYSTEM03010_TREEVIEW .list-group-item:first').attr('data-level', item.level);
			$('#ITP_SYSTEM03010_TREEVIEW .list-group-item:first').find('.fnMenuNm').html(item.menuNm);
			$('#ITP_SYSTEM03010_TREEVIEW .list-group-item:first').find('.fnUseYnNm').html(item.useYnNm);
		} else if(item.level == 2) { 
			$('#ITP_SYSTEM03010_LVL2_LIST').append($('#ITP_SYSTEM03010_MENUROWCOPY').val());
			$('#ITP_SYSTEM03010_LVL2_LIST .list-group-item:last').attr('data-itp-param-key', item.menuNo);
			$('#ITP_SYSTEM03010_LVL2_LIST .list-group-item:last').attr('data-level', item.level);
			$('#ITP_SYSTEM03010_LVL2_LIST .list-group-item:last').find('.fnMenuNm').html(item.menuNm);
			$('#ITP_SYSTEM03010_LVL2_LIST .list-group-item:last').find('.fnUseYnNm').html(item.useYnNm);
			if(item.bmenuCnt > 0) {
				$('#ITP_SYSTEM03010_LVL2_LIST li:last').append('<ul class="fnLvl3List"></ul>');	
				$('#ITP_SYSTEM03010_LVL2_LIST .fnLvl3List:last').attr('data-menu-no', item.menuNo);	
			} 
		} else if(item.level == 3) {
			$('#ITP_SYSTEM03010_LVL2_LIST li').each(function() {
				if($(this).find('.fnLvl3List').data('menuNo') == item.topMenuNo) {
					$(this).find('.fnLvl3List').append($('#ITP_SYSTEM03010_MENUROWCOPY').val());
					$(this).find('.fnLvl3List .list-group-item:last').attr('data-itp-param-key', item.menuNo);
					$(this).find('.fnLvl3List .list-group-item:last').attr('data-level', item.level);
					$(this).find('.fnLvl3List .list-group-item:last').find('.fnMenuNm').html(item.menuNm);
					$(this).find('.fnLvl3List .list-group-item:last').find('.fnUseYnNm').html(item.useYnNm);
					
					if(item.bmenuCnt > 0) {
						$(this).find('.fnLvl3List li:last').append('<ul class="fnLvl4List"></ul>');
						$(this).find('.fnLvl3List .fnLvl4List:last').attr('data-menu-no', item.menuNo);	
					}
				}
			});
		} else if(item.level == 4) {
			$('#ITP_SYSTEM03010_LVL2_LIST li').each(function() {
				$(this).find('.fnLvl3List li').each(function() {
					if($(this).find('.fnLvl4List').data('menuNo') == item.topMenuNo) {
						$(this).find('.fnLvl4List').append($('#ITP_SYSTEM03010_MENUROWCOPY').val());
						$(this).find('.fnLvl4List .list-group-item:last').attr('data-itp-param-key', item.menuNo);
						$(this).find('.fnLvl4List .list-group-item:last').attr('data-level', item.level);
						$(this).find('.fnLvl4List .list-group-item:last').find('.fnMenuNm').html(item.menuNm);
						$(this).find('.fnLvl4List .list-group-item:last').find('.fnUseYnNm').html(item.useYnNm);	
					}	
				});
			});
		}
	});
	$('#ITP_SYSTEM03010_TREEVIEW').treed();
	
	const item = $('#ITP_SYSTEM03010_TREEVIEW').find('.list-group-item').first();
	const txt = item.attr('data-itp-param-key');
	item.addClass('active');
	itp_fn_SYSTEM03010_detail(txt);
};

var itp_fn_SYSTEM03010_detail = function(key) {
	var menuNo = {menuNo: key};
	var param = $.param(menuNo);						
	fn_ajax_call(MENU_INFO_MENU, param, itp_fn_SYSTEM03010_detail_callback, 'GET');	
};

var itp_fn_SYSTEM03010_detail_callback = function(result) {		
	// 정보표시
	// $('#ITP_FORM_SYSTEM03010_VIEW_CD').val('U');
	$('#ITP_FORM_SYSTEM03010_MENU_NO').val(result.menuNo);
	$('#ITP_FORM_SYSTEM03010_MENU_ID').val(result.menuId);
	$('#ITP_FORM_SYSTEM03010_MENU_NM').val(result.menuNm);
	$('#ITP_FORM_SYSTEM03010_CONN_URL').val(result.connUrl);	
	
	// 코드 상세리스트 조회	
	const key = {menuNo: result.menuNo, gridSize: $.jgrid.defaults.rowNum};
	itp_fn_SYSTEM03010_detail_grid.unload();
	itp_fn_SYSTEM03010_detail_grid.callBack(key);
};

var itp_fn_SYSTEM03010_detail_grid = {
	init: function() {		
		$('body').on('click', function(e) {
			var gridId = SYSTEM03010_GRID_ID.replace('#', '');
			itp_fn_grid_reset_selection(e, SYSTEM03010_GRID_LAST_ROW_ID, gridId, 'SYSTEM03010');
		});

		$('#ITP_BTN_SYSTEM03010_ADDROW').on('click', function() {
			$(SYSTEM03010_GRID_EMPTY).hide();
			SYSTEM03010_GRID_LAST_ROW_ID = itp_fn_grid_add_row(SYSTEM03010_GRID_ID, undefined, ['actionId']);
		});

		$('#ITP_BTN_SYSTEM03010_DELROW').on('click', function() {
		    itp_fn_grid_del_row(SYSTEM03010_GRID_ID);
		});		
	}, 
	callBack: function(args) {				
		$(SYSTEM03010_GRID_ID).jqGrid({
			colModel: [
				{
					index: 'VIEW_CD', name: 'viewCd',
					label: ITP_MSG_LOCALE.label.viewCd,
					width: '10', fixed: false, align: 'center',
					sortable: false, hidden: true
				},
				{
					index: 'MENU_NO', name: 'menuNo',
					label: ITP_MSG_LOCALE.label.menuNumber,
					width: '10', fixed: false, align: 'center',
					sortable: false, hidden: true
				},
				{
					index: 'ACT_ID', name: 'actId',
					label: ITP_MSG_LOCALE.label.actionId,
					width: '12', fixed: false, align: 'center',
					sortable: false, editable: true, edittype: 'text',
					editrules: {required: true},
					editoptions: {maxlength: 30}
				},
				{
					index: 'ACT_TP_CD', name: 'actTpCd',
					label: ITP_MSG_LOCALE.label.actionType,
					width: '7', fixed: false, align: 'center',
					sortable: false, editable: true, formatter: 'select', edittype: 'select',
					editoptions: {value: $('#ITP_FORM_SYSTEM03010_ACT_TP_CD').val()},
					editrules: {required: true}
				},
				{
					index: 'ACT_NM', name: 'actNm',
					label: ITP_MSG_LOCALE.label.actionName,
					width: '13', fixed: false, align: 'center',
					sortable: false, editable: true, edittype: 'text',
					editrules: {required: true},
					editoptions: {maxlength: 128}
				},
				{
					index: 'WRITE_YN', name: 'writeYn',
					label: ITP_MSG_LOCALE.label.writeYn,
					width: '8', fixed: false, align: 'center',
					sortable: false, editable: true, formatter: 'checkbox', edittype: 'checkbox',
					editoptions: {value: 'Y:N', defaultValue: 'Y'},
					editrules: {required: true}
				},
				{
					index: 'USE_YN', name: 'useYn',
					label: ITP_MSG_LOCALE.label.useYn,
					width: '8', fixed: false, align: 'center',
					sortable: false, editable: true, formatter: 'checkbox', edittype: 'checkbox',
					editoptions: {value: 'Y:N', defaultValue: 'Y'},
					editrules: {required: true}
				}
			],
			loadBeforeSend: function(jqXHR) {
			    jqXHR.setRequestHeader('X-AUTH-TOKEN', CONN_KEY);
			},
			postData: JSON.stringify(args),
			url: DOMAIN + ACT_DETAIL_GRID_LIST,
			pager: SYSTEM03010_GRID_PAGER,
			rowNum: '',
			onCellSelect: function(rowId, cellIdx, cellValue) {
				SYSTEM03010_GRID_LAST_ROW_ID = itp_fn_set_data_editable(rowId, cellIdx, SYSTEM03010_GRID_LAST_ROW_ID, SYSTEM03010_GRID_ID, ['actionId']);
		   	},
			loadComplete: function(data) {
				console.log(data);
				itp_fn_grid_load_complete(data, SYSTEM03010_GRID_ID, false, undefined, 'SYSTEM03010');
		    },
		    loadError: function(jqXHR, textStatus, errorThrown) {
		    	itp_fn_grid_load_error(jqXHR, textStatus, errorThrown);
		    }
		}).navGrid(SYSTEM03010_GRID_PAGER, ITP_GRID_NAV_DEFAULTS.navGrid);
	}, 
	unload : function() {
		$.jgrid.gridUnload(SYSTEM03010_GRID_ID); 
	}
};