전문레이아웃 매핑 화면 오픈시 validation

WebContent/jsp/onl/admin/rule/transformManDetail.jsp

@@ -144,6 +144,11 @@
 				LIST_TRANSFORM_ITEM = listTransformItem(tgt, cnvsnName, tgtLoutIoId, tgtLoutType, src);
 				LIST_LAYOUT_ITEM = listLayoutItem(src, srcLoutIoId, srcLoutType);
 
+				// 소스/타겟 그리드가 모두 로드된 후, 소스에 없는 아이템이 매핑된 타겟 항목을 표시
+				$.when(LIST_TRANSFORM_ITEM, LIST_LAYOUT_ITEM).done(function () {
+					validateMapping();
+				});
+
 				console.debug('LIST_TRANSFORM_SOURCE_RESULT done');
 			}).fail(function (e) {
 				alert(e.responseText);
@@ -342,6 +347,50 @@
 			return LIST_TRANSFORM_ITEM;
 		}
 
+		// 소스에 없는(삭제/변경된) 아이템이 타겟에 매핑되어 있으면 빨간색으로 표시하고 ISVALIDMAPPING을 false로 체크
+		function validateMapping() {
+			var sourceData = sourceGrid.getRowData();
+			var validPaths = {};
+			for (var i = 0; i < sourceData.length; i++) {
+				validPaths[sourceData[i]['LOUTITEMPATH'].replace(/\[\*\]/g, "")] = true;
+			}
+
+			var targetData = targetGrid.getRowData();
+			for (var j = 0; j < targetData.length; j++) {
+				var rowData = targetData[j];
+				var cnvsnSrcItems = $.trim(rowData['CNVSNSRCITEMS']);
+				if (cnvsnSrcItems == "") continue;
+
+				var invalid = false;
+				var srcItems = cnvsnSrcItems.split(',');
+				for (var k = 0; k < srcItems.length; k++) {
+					var matchPath = srcItems[k].replace(/\[\*\]/g, "");
+					if (!validPaths[matchPath]) {
+						invalid = true;
+						break;
+					}
+				}
+
+				if (invalid) {
+					// 연결 정보가 없음 (jqGridOnConnection의 미연결 처리와 동일하게 매핑 데이터를 초기화)
+					targetGrid.jqGrid('setCell', rowData['id'], 'CNVSNCMDNAME', null);
+					targetGrid.jqGrid('setCell', rowData['id'], 'CNVSNRSULTITEMPATHNAME', null);
+					targetGrid.jqGrid('setCell', rowData['id'], 'CNVSNITEMSERNO', null);
+					targetGrid.jqGrid('setCell', rowData['id'], 'CNVSNITEMBASCVAL', null);
+					targetGrid.jqGrid('setCell', rowData['id'], 'CNVSNSRCITEMS', null);
+					targetGrid.jqGrid('setCell', rowData['id'], 'ISVALIDMAPPING', false);
+					targetGrid.jqGrid('setCell', rowData['id'], 'loutItemName', '', {color:'red'});
+					if (isValidMapping) {
+						isValidMapping = false;
+						// alert은 1회
+						alert('<%=localeMessage.getString("transformManDetail.alert8")%>');
+					}
+				} else {
+					targetGrid.jqGrid('setCell', rowData['id'], 'ISVALIDMAPPING', true);
+				}
+			}
+		}
+
 
 		function addGroupTag(group, data) {
 			Object.keys(group)
@@ -874,12 +923,19 @@
 				}
 
 				$('textarea[name=CNVSNCMDNAME]').val(cnvsnCmdName);
+
 				$('textarea[name=CNVSNRSULTITEMPATHNAME]').val(addArrayTag(targetRow['loutItemType'], addGroupTag(tgtGroup, targetRow['LOUTITEMPATH'])));
 				$('input[name=CNVSNITEMSERNO]').val(targetRow['loutItemSerno']);
 
 				setTgtCell();
 			});
 
+			$("#resetCmd").click(function(){
+				$('#functionComboDialog').val('');
+				$('#srcItemComboDialog').val([]);
+				$('textarea[name=CNVSNCMDNAME]').val('');
+			});
+
 			$("#btn_delete").click(function(){
             	if(!confirm("삭제하시겠습니까?")){
    				 return;
@@ -1281,13 +1337,14 @@
 						<tr>
 							<th style="width:13%; min-width:130px;"><%=localeMessage.getString("transformManDetail.transCmdName")%></th>
 							<td>
-								<div class="select-style" style="display:inline-block; width:calc((100% - 70px)*0.3);">
+								<div class="select-style" style="display:inline-block; width:calc((100% - 130px)*0.3);">
 									<select id="functionComboDialog" name="functionComboDialog" style="width:100%; box-sizing:border-box; padding-right:15px;"></select>
 								</div>
-								<div class="select-style" style="display:inline-block; width:calc((100% - 70px)*0.7);">
+								<div class="select-style" style="display:inline-block; width:calc((100% - 130px)*0.7);">
 									<select id="srcItemComboDialog" name="srcItemComboDialog" multiple size="1" style="width:100%; box-sizing:border-box; padding-right:15px;"></select>
 								</div>
 								<button type="button" class="cssbtn smallBtn2" id="addCmd" name="addCmd" style="vertical-align:middle; font-weight:bold;"><i class="material-icons">add</i><%= localeMessage.getString("button.add") %></button>
+								<button type="button" class="cssbtn smallBtn2" id="resetCmd" name="resetCmd" style="vertical-align:middle; font-weight:bold;"><i class="material-icons">refresh</i><%= localeMessage.getString("button.reset") %></button>
 							</td>
 						</tr>
 						<tr height="40px">