<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="ko">
<head>
<title>Welcome</title>
<%@ include file="/WEB-INF/include/include-header.jspf" %>
<style type="text/css">
	.table td, .table th {
		padding: 5px;
	}
</style>
<script src="<c:url value='/vendor/contextMenu/js/jquery.contextMenu.min.js' />"></script>
<script src="<c:url value='/vendor/contextMenu/js/jquery.ui.position.min.js' />"></script>
<link rel="stylesheet" href="<c:url value='/vendor/contextMenu/css/jquery.contextMenu.min.css' />">
</head>
<body>
    <form id="frm" autocomplete="off">
    	<input type="hidden" id="param1" name="param1">
    	<input type="hidden" id="param2" name="param2"> 
    	<br>
    	<button class="context-menu-one" type="button" id="btnSearch">
			<i class="fas fa-search"></i><span> </span>조회
		</button>&nbsp;
    </form>
    <table id="table"></table>
</body>
<script>
	//[조회] 버튼 누르기 
	$("#btnSearch").click(function(e) {
		if(setValue()){
			loadData();
			//popup();
		}
	});

	function setValue(){
		var rtn = true;
		
		try {
			$('#param1').val("M000000001");
			$('#param2').val("5");
		}
		catch(error) {
			rtn = false;
		}
		return rtn;
	}

	$(function() {
        $.contextMenu({
            selector: '.context-menu-one', 
            callback: function(key, options) {
                //var m = "clicked: " + key;
                //window.console && console.log(m) || alert(m); 
            },
            items: {
                "copy": {name: "복사", icon: "copy"},
            	"cut": {name: "잘라내기", icon: "cut"},
                "paste": {name: "붙이기", icon: "paste"},
                "delete": {name: "삭제", icon: "delete"}
            }
        });
        $('.context-menu-one').on('click', function(e){
            console.log('clicked', this);
        })    
    });
/*
                "edit": {name: "Edit", icon: "edit"},
                "cut": {name: "Cut", icon: "cut"},
               copy: {name: "Copy", icon: "copy"},
                "paste": {name: "Paste", icon: "paste"},
                "delete": {name: "Delete", icon: "delete"},
                "sep1": "---------",
                "quit": {name: "Quit", icon: function(){
                    return 'context-menu-icon context-menu-icon-quit';
 */

	function popup(){
		goPage_Popup('<c:url value='C:\Program Files (x86)\I4WAY\SoftPhone\websocket_client_Genesys.html'/>', '850', '500','no', 'main_agentsearch');
	}

	var popupX = (document.body.offsetWidth / 2) - (900 / 2);
	//&nbsp;만들 팝업창 좌우 크기의 1/2 만큼 보정값으로 빼주었음

	var popupY= (document.body.offsetHeight / 2) - (600 / 2);
	//&nbsp;만들 팝업창 상하 크기의 1/2 만큼 보정값으로 빼주었음
	
	//팝업화면 띄우기 
	function goPage_Popup(pagename, Wsize, Hsize, ScrollYn, scrnm){
		var id=window.open(pagename,scrnm,"toolbar=no,directories=no, width="+Wsize+", height="+Hsize+", top="+popupY+", left="+popupX+", scrollbars="+ScrollYn+", status=no,resizable=no, menubar=no");  	
		id.focus(); 
	}
	
	function loadData() {
		var queryString = $("#frm").serialize();
	    $.ajax({
	        type : "post",
	        url : "<c:url value='/getTestList'/>",
	        data : queryString,
	        dataType : "json",
	        success : function(result_data){
	        	$('#table').bootstrapTable('load', result_data.list);
	        },
	        error : function(xhr, status, error){
	            alert("Error : " + error);
	        }
	    });
	}

	$('#table').bootstrapTable({
	  	pagination: true,
	  	search: true,
	  	columns: [{
	    	field: 'SCR_ID',
	    	title: '아이디',
	    	sortable: true	    	
	  	}, {
	    	field: 'SCR_NAME',
	    	title: '이름',
	    	sortable: true,
	    	class: 'context-menu-one'
	  	}, {
	    	field: 'TITLE',
	    	title: '제목',
	    	sortable: true	
	  	}, {
	    	field: 'SCR_LINK',
	    	title: '링크',
	    	sortable: true	
	  	}, {
	    	field: 'GRADE',
	    	title: '등급',
	    	sortable: true	
	  	}, {
	    	field: 'USE_YN',
	    	title: '사용여부',
	    	sortable: true	
	  	}, {
	    	field: 'DEPTH',
	    	title: 'Depth',
	    	sortable: true	
	  	}, {
	    	field: 'P_ID',
	    	title: 'PID',
	    	sortable: false	
	  	}, {
	    	field: 'ORDER_NO',
	    	title: '정렬순서',
	    	sortable: true	
	  	}, {
	    	field: 'FOLDER',
	    	title: '폴더',
	    	sortable: false	
	  	}]
	})
	
</script>
</html> 