<%@ page language="java" contentType="text/html; charset=utf-8"%>
<%@ page import="java.io.*"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ include file="/jsp/common/include/localemessage.jsp" %>
<%@ page import="com.eactive.eai.rms.common.login.SessionManager"%>
<%@ page import="com.eactive.eai.common.util.SystemUtil"%>
<%
	response.setHeader("Pragma", "No-cache");
	response.setHeader("Cache-Control", "no-cache");
	response.setHeader("Expires", "0");
%>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<jsp:include page="/jsp/common/include/css.jsp"/>
<jsp:include page="/jsp/common/include/script.jsp"/>
<style type="text/css">
.flex {
	display: flex;
	justify-content: space-between;
}

.checkbox_th {
	width: 30px; 
	padding: 0px;
}

.label_th {
	width: 120px; 
}
.w5 {
	width: 5%;
}
</style>

<script>
var url      = '<c:url value="/onl/admin/service/eaiMsgEasyDelete.json" />';

var returnUrl = getReturnUrlForReturn();

var eaiSvcName= '${param.eaiSvcName }';
var msgType = eaiSvcName.slice(-2);
var eaiSvcDesc= '${param.eaiSvcDesc }'; 
var bzwkSvcKeyName= '${param.bzwkSvcKeyName }'; 
var svcRoutClsName= '${param.svcRoutClsName }'; 
var adptrRoutClsName= '${param.adptrRoutClsName }'; 
var bzwkFldName= '${param.bzwkFldName }'; 
var trans_chngMsgIdName= '${param.trans_chngMsgIdName }'; 
var trans_bascRspnsChngMsgIdName= '${param.trans_bascRspnsChngMsgIdName }'; 
var trans_errRspnsChngMsgIdName= '${param.trans_errRspnsChngMsgIdName }';

var layouts_forSearchEffects = {};

function $node(element) {
	return $(document.createElement(element));
}

function init() {
	
	$.ajax({
		url : url,
		type : "POST",
		data : {
			cmd : "DETAIL_INIT",
			eaiSvcName : eaiSvcName
		},
		dataType : "json",
		success : function(response) {
			
			$("input[name=eaiSevrDstCd]").val(response.EAISEVRDSTCD);
			$("input[name=useYn]").val(response.USEYN);
			$("input[name=eaiBzwkDstcd]").val(response.EAIBZWKDSTCD);
			$("input[name=extBizCd]").val(response.EXTBIZCD);
			$("input[name=svcPrcesDsticName]").val(response.SVCPRCESDSTICNAME);
			$("input[name=svcMotivUseDstcd]").val(response.SVCMOTIVUSEDSTCD);
			
			sync_async_control();
			
			$.when(search_layouts(trans_chngMsgIdName, 'req'), search_layouts(trans_bascRspnsChngMsgIdName, 'res'), search_layouts(trans_errRspnsChngMsgIdName, 'err'))
				.done(function(a1, a2, a3, a4) {
					
					$(".cbox ").attr('disabled', 'disabled');
					// search effects and split data -> load Grid Templates
					
					$.ajax({
						url : url,
						type : "POST",
						data : {
							cmd : "DETAIL_LAYOUT_EFFECT_VALIDATION",
							gridData : JSON.stringify(layouts_forSearchEffects) 
						},
						dataType : "json",
						success : function(response) {
							console.log("DETAIL_LAYOUT_EFFECT_VALIDATION : success");
							var req = response.req;
							var res = response.res;
							var err = response.err;
							if(req != undefined) {
								var sorted = effects_sorting(req, 'req');
								grid_effects('#grid_req_effects_1', sorted.left);
								grid_effects('#grid_req_effects_2', sorted.right);
							}
							if(res != undefined) {
								var sorted = effects_sorting(res, 'res');
								grid_effects('#grid_res_effects_1', sorted.left);
								grid_effects('#grid_res_effects_2', sorted.right);
							}
							if(err != undefined) {
								var sorted = effects_sorting(err, 'err');
								grid_effects('#grid_err_effects_1', sorted.left);
								grid_effects('#grid_err_effects_2', sorted.right);
							}
						},
						error : function(e) {
							console.log("DETAIL_LAYOUT_EFFECT_VALIDATION : fail");
							alert(e.responseText);
						}
					});
					
				});
			
		},
		error : function(e) {
			alert(e.responseText);
		}
	});
	
}

function effects_sorting(obj, location) {
	
	var leftLayoutName = $("#"+location+"_layout_1").val();
	var rightLayoutName = $("#"+location+"_layout_2").val();
	
	var result = {
		left 	: obj.filter((item) => item.LOUTNAME == leftLayoutName),
		right 	: obj.filter((item) => item.LOUTNAME == rightLayoutName)
	};
	
	return result;
}

$(document).ready(function() {
	
	init();
	
	arrowDirectionControl();
	
	grid_b2bExtClasses();
	grid_bzwkFldName();
	
	$("#btn_delete").click(function() {
		
		if(!confirm('정말 삭제하시겠습니까?')) {
			return;
		}
		
		var svcMotivUseDstcd = $("input[name=svcMotivUseDstcd]").val();
		
		if(svcMotivUseDstcd == 'AKON') {
			alert('AKON 미지원');
			return;
		}
		
		var postData = makePostData();
		
		$.ajax({
			url : url,
			type : "POST",
			data : postData,
			dataType : "json",
			success : function(response) {
				alert("삭제되었습니다.");
				$("#btn_previous").click();
			},
			error : function(e) {
				alert(e.responseText);
			}
		});

	});
	
	$("#btn_previous").click(function() {
		goNav(returnUrl);
	});
	
	buttonControl();
});

function sync_async_control() {
	
	var svcMotivUseDstcd = $("input[name=svcMotivUseDstcd]").val();
	
	if(svcMotivUseDstcd == '') {
		alert('인터페이스 사용유형이 지정되지 않았습니다.\n변환과 레이아웃을 불러올 수 없습니다.');
		return;
	}
	
	if(svcMotivUseDstcd == 'SYNC') {
		
		$("#req_transform_wrapper").show();
		$("#res_transform_wrapper").show();
		$("#err_transform_wrapper").show();
		
	} else if (svcMotivUseDstcd = 'ASYN') {
		
		$("#req_transform_wrapper").show();
		$("#res_transform_wrapper").hide();
		$("#err_transform_wrapper").hide();
		
	} else if (svcMotivUseDstcd = 'AKON') {
		
		alert("it's AKON Interface");
		
		$("#req_transform_wrapper").hide();
		$("#res_transform_wrapper").hide();
		$("#err_transform_wrapper").hide();
		
	}
}

function arrowDirectionControl() {
	
	if(msgType == 'S2') {
		
		$(".req_transform_arrow").each(function() {
			$(this).append($node('img').attr('width', '300px;').attr('src', '<c:url value="/img/right_arrow.png"/>'));	
		});
		$(".res_transform_arrow").each(function() {
			$(this).append($node('img').attr('width', '300px;').attr('src', '<c:url value="/img/left_arrow.png"/>'));	
		});
		$(".err_transform_arrow").each(function() {
			$(this).append($node('img').attr('width', '300px;').attr('src', '<c:url value="/img/left_arrow.png"/>'));	
		});
		
		$("#req_layout_1").attr('name', 'req_layout_src');
		$("#req_layout_2").attr('name', 'req_layout_tgt');
		
		$("#res_layout_1").attr('name', 'res_layout_tgt');
		$("#res_layout_2").attr('name', 'res_layout_src');
		
		$("#err_layout_1").attr('name', 'err_layout_tgt');
		$("#err_layout_2").attr('name', 'err_layout_src');
		
	} else if(msgType == 'S1') {
		
		$(".req_transform_arrow").each(function() {
			$(this).append($node('img').attr('width', '300px;').attr('src', '<c:url value="/img/left_arrow.png"/>'));	
		});
		$(".res_transform_arrow").each(function() {
			$(this).append($node('img').attr('width', '300px;').attr('src', '<c:url value="/img/right_arrow.png"/>'));	
		});
		$(".err_transform_arrow").each(function() {
			$(this).append($node('img').attr('width', '300px;').attr('src', '<c:url value="/img/right_arrow.png"/>'));
		});
		
		$("#req_layout_1").attr('name', 'req_layout_tgt');
		$("#req_layout_2").attr('name', 'req_layout_src');
		
		$("#res_layout_1").attr('name', 'res_layout_src');
		$("#res_layout_2").attr('name', 'res_layout_tgt');
		
		$("#err_layout_1").attr('name', 'err_layout_src');
		$("#err_layout_2").attr('name', 'err_layout_tgt');
		
	} else if(msgType == 'R2') {
		
		$(".req_transform_arrow").each(function() {
			$(this).append($node('img').attr('width', '300px;').attr('src', '<c:url value="/img/right_arrow.png"/>'));	
		});
		
		$("#req_layout_1").attr('name', 'req_layout_tgt');
		$("#req_layout_2").attr('name', 'req_layout_src');
		
	} else if(msgType == 'R1') {
		
		$(".req_transform_arrow").each(function() {
			$(this).append($node('img').attr('width', '300px;').attr('src', '<c:url value="/img/left_arrow.png"/>'));	
		});
		
		$("#req_layout_1").attr('name', 'req_layout_src');
		$("#req_layout_2").attr('name', 'req_layout_tgt');
		
	}
	
}

function search_layouts(searchTransName, transType) {
	
	if(searchTransName.trim() == '') {
		return;
	}
	
	return $.ajax({
		url : url,
		type : "POST",
		data : {
			cmd : "DETAIL_LIST_LAYOUT",
			transName : searchTransName
		},
		dataType : "json",
		success : function(response) {
			
			$("input[name="+transType+"_layout_src]").val(response.rows.find(item => item.SOURCRSULTDSTCD == 'SRC_LAYOUT').LOUTNAME);
			$("input[name="+transType+"_layout_tgt]").val(response.rows.find(item => item.SOURCRSULTDSTCD == 'TGT_LAYOUT').LOUTNAME);
			
			var temp = {
				louts : [],
				exceptTransName : searchTransName
			};
			
			response.rows.forEach(function(item) {
				temp.louts.push(item.LOUTNAME);
			});
			
			layouts_forSearchEffects[transType] = temp;
			
		},
		error : function(e) {
			alert(e.responseText);
		}
	});
}

function makePostData() {
	
	var postData = { cmd : "DELETE" };
	
	postData['eaiSvcName'] =  							eaiSvcName;
	postData['bzwkSvcKeyName'] = 						getIfChecked('bzwkSvcKeyName');
	postData['b2bExtList'] =  							JSON.stringify(getGridSelectedRowData('#grid_b2bExtClasses'));
	postData['bzwkFldNameList'] =  						JSON.stringify(getGridSelectedRowData('#grid_bzwkFldName'));
	postData['trans_chngMsgIdName'] =  					getIfChecked('trans_chngMsgIdName');
	postData['trans_bascRspnsChngMsgIdName'] =  		getIfChecked('trans_bascRspnsChngMsgIdName');
	postData['trans_errRspnsChngMsgIdName'] =  			getIfChecked('trans_errRspnsChngMsgIdName');
	postData['layouts_trans_chngMsgIdName'] =  			getIfCheckedLayouts('req');
	postData['layouts_trans_bascRspnsChngMsgIdName'] =  getIfCheckedLayouts('res');
	postData['lauouts_trans_errRspnsChngMsgIdName'] =  	getIfCheckedLayouts('err');
	
	return postData;
}

function getIfChecked(inputName) {
	
	var checkId = '#chk_' + inputName;
	
	if($(checkId).is(':checked')) {
		return $("input[name="+inputName+"]").val();
	} else {
		return '';
	}
	
}

function getIfCheckedLayouts(transType) {
	
	var checkClass = '.chk_' + transType + "_layout";
	var result = [];
	
	$(checkClass).each(function() {
		var $item = $(this);
		if($item.is(':checked')) {
			result.push($("#"+$item.attr('id').replaceAll('chk_', '')).val());
		}
	});
	
	return JSON.stringify(result);
	
}

function grid_b2bExtClasses() {
	
	$('#grid_b2bExtClasses').jqGrid({
		datatype:"json",
		mtype: "POST",
		url: url,
		postData : {
			cmd : 'DETAIL_B2BEXT',
			eaiSvcName : eaiSvcName
		},
		colNames:[
				'처리번호',
				'기관코드 추출 Class',
				'어댑터라우팅 추출 Class',
				],
		colModel:[
				{ name : 'SVCPRCSSNO', align:'center', width : '45px' },
				{ name : 'SVCROUTCLSNAME', align:'left' },
				{ name : 'ADPTRROUTCLSNAME', align:'left' }
				],
        jsonReader: {
             repeatitems:false
        },
	    autoheight: true,
	    height: $("#container").height(),
		autowidth: true,
		viewrecords: true,
		multiselect: true,
		multiboxonly: false,
		rowList : eval('[${rmsDefaultRowList}]'),
		gridComplete:function (d){
			var colModel = $(this).getGridParam("colModel");
			for(var i = 0 ; i< colModel.length; i++){
				$(this).setColProp(colModel[i].name, {sortable : false});	//그리드 헤더 화살표 삭제(정렬X)		
			}
		},
		loadComplete:function (d){
			$("#cb_grid_b2bExtClasses").click();
		},
        loadError: function (jqXHR, textStatus, errorThrown) {
        	var location ='<%=request.getContextPath()%>/';
        	comloadError(jqXHR, textStatus, errorThrown ,location);
    	}
	});
}

function grid_bzwkFldName() {
	
	$('#grid_bzwkFldName').jqGrid({
		datatype:"json",
		mtype: "POST",
		url: url,
		postData : {
			cmd : 'DETAIL_BZWKFLD',
			eaiSvcName : eaiSvcName
		},
		colNames:[
				'용도구분',
				'필드추출 추적키',
				],
		colModel:[
				{ name : 'ETRACTDSTCD', align:'center', width : '30px' },
				{ name : 'BZWKFLDNAME', align:'left' }
				],
        jsonReader: {
             repeatitems:false
        },
	    autoheight: true,
	    height: $("#container").height(),
		autowidth: true,
		viewrecords: true,
		multiselect: true,
		multiboxonly: false,
		rowList : eval('[${rmsDefaultRowList}]'),
		gridComplete:function (d){
			var colModel = $(this).getGridParam("colModel");
			for(var i = 0 ; i< colModel.length; i++){
				$(this).setColProp(colModel[i].name, {sortable : false});	//그리드 헤더 화살표 삭제(정렬X)		
			}
		},
		loadComplete:function (d){
			$("#cb_grid_bzwkFldName").click();
			
			$("tr.ui-state-highlight").on("click", function(event){
				event.stopPropagation();
			});
		},
        loadError: function (jqXHR, textStatus, errorThrown) {
        	var location ='<%=request.getContextPath()%>/';
        	comloadError(jqXHR, textStatus, errorThrown ,location);
    	}
	});
}

function grid_effects(gridTableId, data) {
	
	$(gridTableId).jqGrid({
		datatype:"local",
		data : data,
		colNames:[
					'<%=localeMessage.getString("batInterfaceMan.ifName")%>',
					'변환명',
					'레이아웃명'
                  ],
		colModel:[
				{ name : 'EAISVCNAME'     	, align:'left', width: '100px' },
				{ name : 'CNVSNNAME'     	, align:'left' },
				{ name : 'LOUTNAME'     	, align:'left', width: '100px' }
				],
        jsonReader: {
             repeatitems:false
        },
		pager : $('#pager'),
		page : '${param.page}',
		rowNum : '${rmsDefaultRowNum}',
	    autoheight: true,
	    height: $("#container").height(),
		autowidth: true,
		viewrecords: true,
		multiboxonly: false,
		rowList : eval('[${rmsDefaultRowList}]'),
		gridComplete:function (d){
			var colModel = $(this).getGridParam("colModel");
			for(var i = 0 ; i< colModel.length; i++){
				$(this).setColProp(colModel[i].name, {sortable : false});	//그리드 헤더 화살표 삭제(정렬X)		
			}
		},
		loadComplete:function (d){
			
		},
        loadError: function (jqXHR, textStatus, errorThrown) {
        	var location ='<%=request.getContextPath()%>/';
        	comloadError(jqXHR, textStatus, errorThrown ,location);
    	}
	});
	
	$(gridTableId).jqGrid('setGroupHeaders', {
		useColSpanStyle: true,
		groupHeaders:[
 			{startColumnName: 'EAISVCNAME', numberOfColumns: 3, titleText: '레이아웃 영향도'},
   		]
	});
}

function getGridSelectedRowData(gridTableId) {
	
	var result = [];
	
	var rowIdArray = $(gridTableId).jqGrid('getGridParam', 'selarrrow');
	
	rowIdArray.forEach(function(rowId) {
		result.push($(gridTableId).jqGrid('getRowData', rowId));
	});
	
	return result;
}
</script>
</head>
<body>

	<!-- Main Page Content -->
	
	<div class="right_box">
		<div class="content_top">
			<ul class="path">
				<li><a href="#">${rmsMenuPath}</a></li>					
			</ul>					
		</div><!-- end content_top -->
		<div class="content_middle" id="content_middle">
			<div class="search_wrap">
				<img src="<c:url value="/img/btn_delete.png"/>" alt="" id="btn_delete" level="W" status="DETAIL,NEW"/>
				<img src="<c:url value="/img/btn_previous.png"/>" alt="" id="btn_previous" level="R" status="DETAIL,NEW"/>	
			</div>
			<div class="title">인터페이스 간편삭제 상세</div>
			<table class="search_condition" cellspacing=0;>
				<tbody>
					<tr>
						<th style="width:180px;"><%= localeMessage.getString("eaiMessage.eaiSvcName")%></th>
						<td>
							<input type="text" name="eaiSvcName" value="${param.eaiSvcName }" readonly="readonly">
						</td>	
						<th style="width:180px;"><%= localeMessage.getString("eaiMessage.eaiSvcDesc")%></th>
						<td>
							<input type="text" name="eaiSvcDesc" value="${param.eaiSvcDesc }" readonly="readonly">
						</td>
					</tr>
					<tr>
						<th style="width:180px;">EAI 서버구분 코드</th>
						<td>
							<input type="text" name="eaiSevrDstCd" readonly="readonly">
						</td>	
						<th style="width:180px;">사용구분</th>
						<td>
							<input type="text" name="useYn" readonly="readonly">
						</td>
					</tr>
					<tr>
						<th style="width:180px;">EAI 업무구분 코드</th>
						<td>
							<input type="text" name="eaiBzwkDstcd" readonly="readonly">
						</td>	
						<th style="width:180px;">대외 업무구분 코드</th>
						<td>
							<input type="text" name="extBizCd" readonly="readonly">
						</td>
					</tr>
					<tr>
						<th style="width:180px;">서비스처리유형</th>
						<td>
							<input type="text" name="svcPrcesDsticName" readonly="readonly">
						</td>	
						<th style="width:180px;">인터페이스 사용유형</th>
						<td>
							<input type="text" name="svcMotivUseDstcd" readonly="readonly">
						</td>
					</tr>
				</tbody>
			</table>
			<hr>
			<br>
			<div class="title">인터페이스 요소</div>
			<div class="flex">
				<div style="width: 25%;">
					<table  class="search_condition" cellspacing=0;>
						<tr>
							<th class="checkbox_th"> 
								<input type="checkbox" id="chk_bzwkSvcKeyName" name="chk_bzwkSvcKeyName" checked="checked" disabled="disabled" />
							</th>
							<th class="label_th">
								<label for="chk_bzwkSvcKeyName">업무서비스키</label>
							</th>
							<td>
								<input type="text" name="bzwkSvcKeyName" value="${param.bzwkSvcKeyName }" readonly="readonly">
							</td>
						</tr>
					</table>
				</div>
				<div class="w5"></div>
				<div style="width: 35%">
					<table id="grid_b2bExtClasses"></table>
				</div>
				<div class="w5"></div>
				<div style="width: 30%;">
					<table id="grid_bzwkFldName"></table>
				</div>
			</div>
			<hr>
			<br>
			<div class="title">변환 및 레이아웃</div>
			
			<!-- REQ TRANSFORM START -->
			<div id="req_transform_wrapper">
				<div class="flex">
					<div>
						<table class="search_condition" cellspacing=0; style="width : 320px;">
							<tr>
								<th>
									<input type="checkbox" class="chk_req_layout" id="chk_req_layout_1" name="chk_req_layout_1" />
									<label for="chk_req_layout_1">레이아웃</label>
								</th>
							</tr>
							<tr>
								<td>
									<input type="text" id="req_layout_1" readonly="readonly">
								</td>
							</tr>
						</table>
					</div>
					
					<div class="req_transform_arrow"></div>
					
					<div>
						<table class="search_condition" cellspacing=0; style="width : 320px;">
							<tr>
								<th>
									<input type="checkbox" id="chk_trans_chngMsgIdName" name="chk_trans_chngMsgIdName" />
									<label for="chk_trans_chngMsgIdName">요청변환</label>
								</th>
							</tr>
							<tr>
								<td>
									<input type="text" name="trans_chngMsgIdName" value="${param.trans_chngMsgIdName }" readonly="readonly">
								</td>
							</tr>
						</table>
					</div>
					
					<div class="req_transform_arrow"></div>
					
					<div>
						<table class="search_condition" cellspacing=0; style="width : 320px;">
							<tr>
								<th>
									<input type="checkbox" class="chk_req_layout" id="chk_req_layout_2" name="chk_req_layout_2" />
									<label for="chk_req_layout_2">레이아웃</label>
								</th>
							</tr>
							<tr>
								<td>
									<input type="text" id="req_layout_2" readonly="readonly">
								</td>
							</tr>
						</table>
					</div>
				</div>
				
				<div class="flex">
					<div style="width : 40%;">
						<table id="grid_req_effects_1"></table>
					</div>
					<div style="width : 40%;">
						<table id="grid_req_effects_2"></table>
					</div>
				</div>
				<hr>
				<br>
			
			</div>
			
			<!-- REQ TRANSFORM END -->			
			
			<!-- RES TRANSFORM START -->	
			
			<div id="res_transform_wrapper">
				<div class="flex">
					<div>
						<table class="search_condition" cellspacing=0; style="width : 320px;">
							<tr>
								<th>
									<input type="checkbox" class="chk_res_layout" id="chk_res_layout_1" name="chk_res_layout_1" />
									<label for="chk_res_layout_1">레이아웃</label>
								</th>
							</tr>
							<tr>
								<td>
									<input type="text" id="res_layout_1" readonly="readonly">
								</td>
							</tr>
						</table>
					</div>
					
					<div class="res_transform_arrow"></div>
					
					<div>
						<table class="search_condition" cellspacing=0; style="width : 320px;">
							<tr>
								<th>
									<input type="checkbox" id="chk_trans_bascRspnsChngMsgIdName" name="chk_trans_bascRspnsChngMsgIdName" />
									<label for="chk_trans_bascRspnsChngMsgIdName">응답변환</label>
								</th>
							</tr>
							<tr>
								<td>
									<input type="text" name="trans_bascRspnsChngMsgIdName" value="${param.trans_bascRspnsChngMsgIdName }" readonly="readonly">
								</td>
							</tr>
						</table>
					</div>
					
					<div id="res_transform_arrow" class="res_transform_arrow"></div>
					
					<div>
						<table class="search_condition" cellspacing=0; style="width : 320px;">
							<tr>
								<th>
									<input type="checkbox" class="chk_res_layout" id="chk_res_layout_2" name="res_layout_2" />
									<label for="chk_res_layout_2">레이아웃</label>
								</th>
							</tr>
							<tr>
								<td>
									<input type="text" id="res_layout_2" readonly="readonly">
								</td>
							</tr>
						</table>
					</div>
				</div>
				
				
				<div class="flex">
					<div style="width : 40%;">
						<table id="grid_res_effects_1"></table>
					</div>
					<div style="width : 40%;">
						<table id="grid_res_effects_2"></table>
					</div>
				</div>
				<hr>
				<br>
				
			</div>
			
			<!-- RES TRANSFORM END -->
			
			<!-- ERR TRANSFORM START -->
			
			<div id="err_transform_wrapper">
				<div class="flex">
					<div>
						<table class="search_condition" cellspacing=0; style="width : 320px;">
							<tr>
								<th>
									<input type="checkbox" class="chk_err_layout" id="chk_err_layout_1" name="chk_err_layout_1" />
									<label for="chk_err_layout_1">레이아웃</label>
								</th>
							</tr>
							<tr>
								<td>
									<input type="text" id="err_layout_1" readonly="readonly">
								</td>
							</tr>
						</table>
					</div>
					
					<div class="err_transform_arrow"></div>
					
					<div>
						<table class="search_condition" cellspacing=0; style="width : 320px;">
							<tr>
								<th>
									<input type="checkbox" id="chk_trans_errRspnsChngMsgIdName" name="chk_trans_errRspnsChngMsgIdName" />
									<label for="chk_trans_errRspnsChngMsgIdName">오류변환</label>
								</th>
							</tr>
							<tr>
								<td>
									<input type="text" name="trans_errRspnsChngMsgIdName" value="${param.trans_errRspnsChngMsgIdName }" readonly="readonly">
								</td>
							</tr>
						</table>
					</div>
					
					<div class="err_transform_arrow"></div>
					
					<div>
						<table class="search_condition" cellspacing=0; style="width : 320px;">
							<tr>
								<th>
									<input type="checkbox" class="chk_err_layout" id="chk_err_layout_2" name="chk_err_layout_2" />
									<label for="chk_err_layout_2">레이아웃</label>
								</th>
							</tr>
							<tr>
								<td>
									<input type="text" id="err_layout_2" readonly="readonly">
								</td>
							</tr>
						</table>
					</div>
				</div>
				
				<div class="flex">
					<div style="width : 40%;">
						<table id="grid_err_effects_1"></table>
					</div>
					<div style="width : 40%;">
						<table id="grid_err_effects_2"></table>
					</div>
				</div>
				<hr>
				<br>
			</div>
			<!-- ERR TRANSFORM END -->
			
		</div>
	</div>
	
	<!-- Main Page Content End -->
	
</body>
</html>