/** * admin/api */ var mcare_admin_api = function(){ //상속 mcare_admin.call(this); var self = this; //변수 var $wrapper = $(".main-wrapper #wrapper"), $apiType = $("#apiType"), $httpMethodType = $("#httpMethodType"), $dataSourceName = $("#dataSourceName"), $resultType = $("#resultType"), $addItem = $("#add-item"), $baseInfo = $("#baseInfo"), $removeItem = $("#remove-item") $saveItem = $("#save-item"), $reloadItem = $('#reload-item'), $deselectItem = $("#deselect-item"), $reqParams = $("#reqParams"), $wsHeaders = $("#wsHeaders"), $execute_api = $("#execute_api"), $treeView = $("#tree-view"), $apiTabStrip = $("#apiTabStrip"), $apiTypeHelp = $(".apiTypeHelp"), $helpContents = $("#helpContents"), $apiDesc = $("#apiDesc"), $resSampleCl = $("#resSampleCl"), $crudServiceBaseUrl = contextPath + "/admin/api"; this.treeView = null; this.reqParamsGrid = null; this.wsHeadersGrid = null; /** * 초기화 */ this.init = function(){ $wrapper.kendoSplitter({ panes : [ { collapsible : true, resizable : true, size : '240px' }, { collapsible : false } ] }); initTree(); initGrid(); initDropDownList(); //설명 글자수 이벤트 - core에 선언 self.checkDescBytes($apiDesc); addEvent(); }; /** * 이벤트 등록 */ var addEvent = function(){ // api type 변경 이벤트 $apiType.on("change",function(e) { var treeView = self.treeView; var node = treeView.select(), item = treeView.dataItem(node), observer = new kendo.observable( item ); enableApiTypeRow( observer, this.value ); }); // http method 필드 변경 이벤트 $httpMethodType.on("change",function(e) { httpMethodType( this.value, e ); }); // 아이템 추가 $addItem.on("click", function(e) { addItem(e); }); // 아이템 삭제 $removeItem.on("click",function(e) { removeItem(e); }); // 아이템 저장 $saveItem.on("click",function(e) { saveItem(e); }); // 아이템 갱신 (to 모바일 서버) $reloadItem.on("click",function(e) { reloadItem(e); }); // 실행 테스트 이벤트 // $test.on("click",function(e) { // testApi(e); // }); //아이템 선택 해제 $deselectItem.on("click",function(e){ self.treeView.select( null ); }); //도움말 클릭 이벤트 $apiTypeHelp.on("click",function(e){ showHelp(e); }); }; /** * http method 필드 변경 이벤트 */ var httpMethodType = function( value, e ){ var treeView = self.treeView; var node = treeView.select(), item = treeView.dataItem(node); var apiType = item.data.apiType; if( apiType === "SQL" ){ if( value !== "GET" && value !== "" ) { //POST,PUT,DELETE 라면 INT만 $resultType.html("").kendoDropDownList().data("kendoDropDownList"); item.data.resultType = "INT"; } else { //GET 이면 MAP, LIST만 $resultType.html("").kendoDropDownList().data("kendoDropDownList"); item.data.resultType = "MAP"; } } else { //웹서비스, procedure면 전부다 $resultType.html("").kendoDropDownList().data("kendoDropDownList"); item.data.resultType = "MAP"; } }; /** * 아이템 추가 */ var addItem = function(e){ var treeView = self.treeView; addedNodeCheck( e, treeView.dataSource.data().toJSON() ); if( addedNodeArr.length > 0 ) { alert("저장하지 않은 아이템 [ " + addedNodeArr[0].apiName + " ] (이)가 있습니다"); addedNodeArr = []; return false; } var node = treeView.select(), item = treeView.dataItem(node); if( node.length === 0) { alert( "아이템을 선택하세요" ); return false; } if( item.nodeType === "API" ){ alert("카테고리를 선택하여 추가하세요."); return false; } var cat_seq = item.data.catSeq; var cat_name = item.data.catName; var arr = new Array(); arr.push( item.data.pathName ); while ( item.parentNode() ) { item = item.parentNode(); arr.push(item.data.pathName); } var cat_path_name = "/"; for( var n = arr.length; n > 0; n-- ) { cat_path_name += (arr[n-1] + "/"); } treeView.append({ id: "", name: "New api", nodeType: "API", addedNode: true, data: { "apiType": $apiType.val(), "catSeq": cat_seq, "catName": cat_name, "catPathName": cat_path_name, "dataSourceName": "", "apiDesc": "", "httpMethodType": "", "targetName": "", "queryMsg": "", "resultType": "", "reqUrlAddr": "", "reqUrlName": "", "targetUrlAddr":"", "useYn": 1, "reqParams": [], "wsUrl" : "", "wsHeaders": [], "resSampleCl":"" } }, node); // $apiTabStrip.kendoTabStrip().data("kendoTabStrip").activateTab( $baseInfo ); }; /** * 아이템 삭제 */ var removeItem = function(e){ var treeView = self.treeView; kendo.unbind( $wrapper ); var node = treeView.select(), item = treeView.dataItem(node); if( node.length === 0 ) { alert( "선택한 아이템이 없습니다" ); return false; } if( item.nodeType === "CATEGORY" ) { alert( "카테고리는 카테고리 관리에서 삭제가능합니다." ); return false; } if( item.addedNode ) { treeView.remove( node ); return false; } if( item.childCount > 0 ) { alert( "하위 카테고리가 존재하여 삭제할 수 없습니다" ); return false; } if( item.apiCount > 0 ) { alert( "하위 API가 존재하여 삭제할 수 없습니다" ); return false; } if( !confirm("삭제 하시겠습니까?") ) { return false; } kendo.ui.progress( $wrapper, true ); // $.ajax({ // url : $crudServiceBaseUrl + "/remove.json", // data : { apiSeq : item.id }, // type : "POST", // //dataType : "json", // //contentType : "application/json;charset=UTF-8;", // success : function(data){ // if( data.msg !== undefined ){ // alert( "수행 중 에러가 발생하였습니다." ); // console.log( data.msg ); // return false; // } // alert( "삭제 되었습니다." ); // location.reload(true); // }, // error : function(xhr,d,t){ // console.log(xhr); // alert(xhr.responseText); // }, // complete : function(){ // kendo.ui.progress( $wrapper, false ); // } // }); var opt = { url : $crudServiceBaseUrl + "/remove.json", data : { apiSeq : item.id }, type : "POST", complete : function(){ kendo.ui.progress( $wrapper, false ); } }; var success = function(data){ alert( "삭제 되었습니다." ); location.reload(true); }; var error = function(xhr,d,t){ console.log(xhr); alert(xhr.responseText); }; self.ajaxAdmin( opt, success, error ); }; /** * 아이템 저장 */ var saveItem = function(e){ var treeView = self.treeView; var node = treeView.select(), item = treeView.dataItem(node); if( node.length === 0 || item.nodeType === "CATEGORY" ) { alert( "선택한 아이템이 없습니다" ); return false; } if( !fieldValidation(item) ) { return false; } if( item.data.dataSourceName !== null && typeof item.data.dataSourceName === "object" && item.data.dataSourceName.value !== undefined ){ item.data.dataSourceName = item.data.dataSourceName.value; } var reqParamsArr = $reqParams.data("kendoGrid").dataSource.data(); for( var i = 0; i < reqParamsArr.length; i++ ){ var it = reqParamsArr[i], paramName = it.paramName; reqParamsArr[i].paramName = paramName.replace(/\s/gi,''); }; var param = $.extend(true, {}, item.data.toJSON(), { apiSeq: item.id, apiName: item.name, nodeType: "API", reqParams: reqParamsArr, wsHeaders: $wsHeaders.data("kendoGrid").dataSource.data(), url: item.data.catPathName }, null); kendo.ui.progress($wrapper, true); // $.ajax({ // url : $crudServiceBaseUrl + "/save.json", // data : self.util.stringifyJson( param ), // type : "POST", // dataType : "json", // contentType : "application/json;charset=UTF-8;", // success : function(data){ // if( data.msg !== undefined ){ // alert( "수행 중 에러가 발생하였습니다." ); // console.log( data.msg ); // return false; // } // alert( "저장 되었습니다." ); // //location.reload(); // }, // error : function(xhr,d,t){ // console.log(xhr); // alert(xhr.reponseText); // }, // complete : function(){ // kendo.ui.progress( $wrapper, false ); // } // }); var opt = { url : $crudServiceBaseUrl + "/save.json", data : self.util.stringifyJson( param ), type : "POST", dataType : "json", contentType : "application/json;charset=UTF-8;", complete : function(e){ kendo.ui.progress( $wrapper, false ); } }; var success = function(data){ kendo.ui.progress( $wrapper, false ); alert( "저장 되었습니다." ); if (item.addedNode === true) { // 신규 노드만 리로딩 location.reload(true); } self.reqParamsGrid.refresh(); self.wsHeadersGrid.refresh(); // var node = self.treeView.select(), // item = self.treeView.dataItem( node ), // observer = new kendo.observable( item ); // observer.id = data.apiSeq // if( observer.addedNode ){ // delete observer.addedNode; // } // kendo.bind( $wrapper, observer ); //location.reload(true); }; var error = function(xhr,d,t){ console.log(xhr); alert(xhr.responseText); }; self.ajaxAdmin( opt, success, error ); }; /** * 트리 아이템 reload 이벤트 * @private */ var reloadItem = function(e){ kendo.ui.progress( $wrapper, true ); // // $.ajax({ // url : $crudServiceBaseUrl + "/cacheReload.json", // type : "POST", // contentType: "application/json; charset=UTF-8", // success : function(data){ // if( data === 1 ) { // alert("갱신 되었습니다"); // } else { // alert( "수행 중 에러가 발생하였습니다" ); // } // }, // error : function(xhr,d,t){ // console.log(xhr); // console.log(t); // }, // complete : function(){ // kendo.ui.progress( $wrapper, false ); // } // }); var opt = { url : $crudServiceBaseUrl + "/cacheReload.json", type : "POST", contentType: "application/json; charset=UTF-8", complete : function(){ kendo.ui.progress( $wrapper, false ); } }; var success = function(data){ if( data === 1 ) { alert("갱신 되었습니다"); } else { alert( "수행 중 에러가 발생하였습니다" ); } }; var error = function(xhr,d,t){ console.log(xhr); console.log(t); }; self.ajaxAdmin( opt, success, error ); }; /** * 실행 테스트 이벤트 */ var testApi = function(e){ var treeView = self.treeView; var node = treeView.select(), item = treeView.dataItem(node); item.data.reqParams = $reqParams.data("kendoGrid").dataSource.data(); item.data.wsHeaders = $wsHeaders.data("kendoGrid").dataSource.data(); if( item.data.dataSourceName !== null && typeof item.data.dataSourceName === "object" && item.data.dataSourceName.value !== undefined ){ item.data.dataSourceName = item.data.dataSourceName.value; } kendo.ui.progress( $wrapper, true ); // $.ajax({ // url : $crudServiceBaseUrl + "/test.json", // data : self.util.stringifyJson( item.data.toJSON() ), // type : "POST", // dataType : "json", // contentType : "application/json;charset=UTF-8;", // success : function(data){ // if( data.msg !== undefined ){ // alert( data.msg ); // return false; // } // if( $.isEmptyObject(data) ) { // alert( "테스트에 대한 결과 데이터가 없습니다." ); // return false; // } // // var responseData = self.util.stringifyJson(data, null, 2); // // $( "
" ).append( $("
" ).html(responseData) ).kendoWindow({
//    				width : 600,
//    				height : 400,
//    				title : "응답결과",
//    				close : function() {
//    					this.destroy();
//    				}
//    			}).data("kendoWindow").open().center();
//    		},
//    		error :  function(xhr,d,t){
//    			console.log(xhr);
//    			alert("[" + xhr.statusText + "] " + xhr.responseText);
//    		},
//    		complete: function(){
//    			kendo.ui.progress( $wrapper, false );
//    		}
//    	});
		var opt = {
				url : $crudServiceBaseUrl + "/test.json",
	    		data : self.util.stringifyJson( item.data.toJSON() ),
	    		type : "POST",
	    		dataType : "json",
	    		contentType : "application/json;charset=UTF-8;",
        		complete : function(){
        			kendo.ui.progress( $wrapper, false );
        		}
    	};
    	var success = function(data){
    		if( $.isEmptyObject(data) ) {
				alert( "테스트에 대한 결과 데이터가 없습니다." );
				return false;
			}

			var responseData = self.util.stringifyJson(data, null, 2);
			
	    	$( "
" ).append( $("
" ).html(responseData) ).kendoWindow({
				width : 600,
				height : 400,
				title : "응답결과",
				close : function() {
					this.destroy();
				}
			}).data("kendoWindow").open().center();
    	};
    	var error = function(xhr,d,t){
    		console.log(xhr);
			alert("[" + xhr.statusText + "] " + xhr.responseText);
    	};
    	self.ajaxAdmin( opt, success, error );
	};
	/**
	 * 트리 초기화
	 */
	var initTree = function(){
		// 데이터소스	
		var treeDataSource = new kendo.data.HierarchicalDataSource({
	        transport: {
	            read: {
	                url: $crudServiceBaseUrl + "/getList.json",
	                method: "get",
	                dataType: "json",
	                contentType: "application/json"
	            }
	        },
	        schema : {
	        	model : {
	        		id : "id",
					hasChildren : function() {
						if (this.nodeType === "API") {
							return false;
						} else {
							return (this.data.childCount > 0 || this.data.apiCount > 0);
						}
					}
				}
	        }
	    });
		var option = {
				loadOnDemand: false,
				dataSource : treeDataSource,
				dataTextField : "name",
				template : treeTemplate,
				select : treeSelect
			}
		// 트리
		self.treeView = self.tree( $treeView, option );
		/**
		 * 트리 template
		 */
		function treeTemplate(o){
			var span = $("").addClass("k-sprite").attr("data-id", o.item.id );
			if (o.item.nodeType == "API") {
				span.addClass("html");
				return span[0].outerHTML + o.item.name;
			} else { 
				return span[0].outerHTML + o.item.name +' ['+o.item.data.pathName+']';
			}
		};
		/**
		 * 트리 선택 이벤트
		 */
		function treeSelect(o){
			kendo.bind( $wrapper, null );
			
			var item = this.dataItem( o.node ),
				observer = new kendo.observable( item );
			
			if( observer.nodeType === "CATEGORY" ) {				
				$( ".right-pane", $wrapper ).hide();
				return;
			}
			$(".right-pane", $wrapper).show();
			enableApiTypeRow( observer,observer.data.apiType );
			
			observer.getCreateDate = function() {
				if( this.data.createDt ) return new Date(this.data.createDt).toLocaleString();
				return "";
			};
			
			observer.getUpdateDate = function() {
				if(this.data.updateDt) return new Date(this.data.updateDt).toLocaleString();
				return "";
			};
			
			self.reqParamsGrid.dataSource.read({"apiSeq": item.id});
			self.wsHeadersGrid.dataSource.read({"apiSeq": item.id});
			
            kendo.bind( $wrapper, observer );
            
            if( observer.data.apiType === "SQL" ){			
    			if( observer.data.httpMethodType  !== "GET" && observer.data.httpMethodType  !== "" ) {
    				//POST,PUT,DELETE 라면 INT만
    				$resultType.html("").kendoDropDownList()
                	.data("kendoDropDownList").select(function(dataItem) {
        			    return dataItem.text === observer.data.resultType;
            		});
    			} else {
    				//GET 이면 MAP, LIST만
    				$resultType.html("").kendoDropDownList()
                	.data("kendoDropDownList").select(function(dataItem) {
        			    return dataItem.text === observer.data.resultType;
            		});
    			}
    		} else {
    			//웹서비스, procedure면 전부다
    			$resultType.html("").kendoDropDownList()
            	.data("kendoDropDownList").select(function(dataItem) {
    			    return dataItem.text === observer.data.resultType;
        		});
    		}
            //설명 글자수제한 초기화
            $apiDesc.trigger("keyup");
		};
	};
	/**
	 * 그리드 초기화
	 */
	var initGrid = function(){
		
		// 파라미터 그리드
		var paramOption = {
				dataSource : {
					transport: {
			            read: {
			                url: $crudServiceBaseUrl + "/getParamList.json",
			                method: "get",
			                dataType: "json",
			                contentType: "application/json"
			            }
			        },
					schema : {
						model : {
							id : "paramSeq",
							fields : {
								paramName : {type : "string", validation : { required : true }},
								dataType : {type : "string", defaultValue : "STRING"},
								sampleValue : {type : "string"},
								paramDesc : {type : "string"}
							}
						}
					}
				},
				toolbar : [ {name: "create", text: "추가"},{template : ""} ],
				editable : { createAt : "bottom" },
				resizable : true,
				sortable : true,
				columns : [ 
				     {title:"no",template:"#= getNum()#",width:30,attributes: {style: "text-align: center;"}}      
					,{field : "paramName", title : "이름", attributes: {style: "text-align: center;"}}
					,{field : "dataType", title : "타입", editor : reqParamTypeDropDownEditor, template: "#=dataType#", attributes: {style: "text-align: center;"}}
					,{field : "sampleValue", title : "샘플 파라미터", attributes: {style: "text-align: center;"}}
					,{field : "paramDesc", title : "설명", attributes: {style: "text-align: center;"}}
					,{command : "destroy", title : "", attributes: {style: "text-align: center;"}} 
					],
				dataBound : function(){
					resetRowNum();
				}
			};
		self.reqParamsGrid = self.grid ( $reqParams, paramOption );
		
		//테스트 버튼 클릭 이벤트
		$("#execute_api").on("click",function(e){
			testApi(e);
		});
	      
		// 헤더정보 그리드
		var wsHeaderOption = {
				dataSource : {
					transport: {
			            read: {
			                url: $crudServiceBaseUrl + "/getHeaderList.json",
			                method: "get",
			                dataType: "json",
			                contentType: "application/json"
			            
			            }
			        },
					schema : {
						model : {
							id : "headerSeq",
							fields : {
								headerName : {type : "string", defaultValue : "Accept"},
								headerValue : {type : "string", editable : true}
							}
						}
					}
				},
				toolbar : [ {name: "create", text: "추가"} ],
				editable : { createAt : "bottom" },
				resizable : true,
				sortable : true,
				columns : [ 
					 {field : "headerName", title : "이름", editor : wsHeaderTypeDropDownEditor, template: "#=headerName#", attributes: {style: "text-align: center;"}}
					,{field : "headerValue", title : "값", attributes: {style: "text-align: center;"}}
					,{command : "destroy", title : "", attributes: {style: "text-align: center;"}} 
					]
			};
		self.wsHeadersGrid = self.grid( $wsHeaders, wsHeaderOption );
		
		/**
		 * 파라미터 LOV
		 */
		function reqParamTypeDropDownEditor(container, options) {
			$("[data-id='reqParamTypeDropDownEditor']:first").clone().attr("data-bind", "value:" + options.field).appendTo(container).kendoDropDownList();
		}
		
		// 헤더정보 LOV
		/**
		 * 
		 */
		function wsHeaderTypeDropDownEditor(container, options) {
			$("[data-id='wsHeaderTypeDropDownEditor']:first").clone().attr("data-bind", "value:" + options.field).appendTo(container).kendoDropDownList();
		}
	};
	/**
	 * dropdownlist 초기화
	 */
	var initDropDownList = function(){
		// 설명 에디터
		self.dropDownList( $apiType, {} );
		self.dropDownList( $dataSourceName, {} );
		self.dropDownList( $httpMethodType, {} );
		self.dropDownList( $resultType, {} );
	};
	// 저장하지 않은 아이템 배열
	var addedNodeArr = [];
	/**
	 * 저장하지 않은 아이템 확인
	 */
	var addedNodeCheck = function(e, treeViewData) {
		if (treeViewData) {
	    	for (var n = 0; n < treeViewData.length; n++ ) {
				var childData = treeViewData[n];
	   			if (childData.addedNode === true) {
	   				addedNodeArr.push(childData);
	   				return;
	 			} else {
		   			var child = childData.items;
		   			if (child) {
			   			if (child.length > 0) {
			   				addedNodeCheck(e, child);
			   			}
		   			}
	 			}
	   		}
		}
	};

	/**
	 * api type 변경 처리
	 */
 	function enableApiTypeRow(o,v) {
 		if( v === "WEB_SERVICE" ) {
 			var dropDown = $dataSourceName.data("kendoDropDownList");
 			dropDown.select(0);
 			o.data.dataSourceName = null;
 			dropDown.enable(false);
 			
 			$("#query-row").hide();
    		$("#procd-row").hide();
    		$("#ws-row").show();
 		} else {
 			$dataSourceName.data("kendoDropDownList").enable(true);
 			
	 		$("#ws-row").hide();
	 		if( v === "PROCEDURE") {
	    		$("#query-row").hide();
	    		$("#procd-row").show();
	    	} else {
	    		$("#procd-row").hide();
	    		$("#query-row").show();
	    	}
 		}
 	}

 	/**
 	 * 필수값 체크
 	 */
	function fieldValidation(item) {
		if(item.name === "" ) {
			alert( "이름을 입력하세요" );
			return false;
		}
		if( item.data.reqUrlAddr === "" ) {
			alert( "API URI를 입력하세요" );
			return false;
		}
		if( item.data.apiType === "" ) {
			alert( "API 타입을 선택하세요" );
			return false;
		} 
		if( item.data.httpMethodType === "") {
			alert( "HttpMethod 타입을 선택하세요" );
			return false;
		} else {
			if( item.data.httpMethodType === "GET" && item.data.resultType === "INT" ) {
				alert( "HttpMethod 타입이 GET일 경우 응답결과가 [INT] 일 수 없습니다" );
				return false;
			}
		}
		if( item.data.resultType == "" ) {
			alert( "응답결과 타입을 선택하세요" );
			return false;
		} else {
			if( item.data.apiType === "WEB_SERVICE" ) {
				if( item.data.targetUrlAddr === "" ) {
					alert( "URL을 등록하세요" );
					return false;
				}
				if( item.data.resultType === "POST" || item.data.resultType === "DELETE" ) {
					alert( "웹서비스는 POST, DELETE 타입을 지원하지 않습니다" );
					return false;
				}
			} else {
				if( item.data.dataSourceName === "" ) {
					alert( "데이터소스를 선택하세요" );
					return false;
				}
				if( item.data.apiType === "PROCEDURE" ) {
					if( item.data.targetName === "" ) {
						alert( "Procedure를 등록하세요" );
						return false;
					}
				} else { // SQL, MYBATIS, SQL_GROOVY_TEMPLATE, VELOCITY
					if( item.data.queryMsg === "" ) {
						alert( "SQL을 등록하세요" );
						return false;
					}
				}
			}
		}
		if( item.data.resultType === "" ) {
			alert( "응답결과 타입을 선택하세요" );
			return false;
		}
		return true;
	};
	/**
	 * 도움말 보여주기
	 */
	var showHelp = function(e){
		var helpContents = $helpContents.html();
		$( "
" ).html( helpContents ).kendoWindow({ width : 800, height : 600, title : "api타입 도움말", close : function() { this.destroy(); } }).data("kendoWindow").open().center(); } }; var rowNum = 0; function resetRowNum(){ rowNum = 0; } function getNum(){ return ++rowNum; }