i-framework-lite/.svn/pristine/ab/ab5f58a3bea1bb442dadc374266...

424 lines
13 KiB
Plaintext

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%
String cntx = request.getContextPath();
%>
<!doctype html>
<html lang="ko">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<%@ include file="/WEB-INF/include/include-header3.jspf" %>
<!-- Multi Select-->
<link href="<c:url value='/vendor/bootstrap-multiselect-2.0/dist/css/bootstrap-multiselect.css' />" rel="stylesheet">
<script src="<c:url value='/vendor/bootstrap-multiselect-2.0/dist/js/bootstrap-multiselect.js' />"></script>
<style type="text/css">
.col-sm-3 {
position: relative;
width: 100%;
padding-right: 15px;
padding-left: 15px;
padding-top: 15px;
padding-bottom: 15px;
}
.valign-wrapper {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}
.bd-example {
position: relative;
padding: 5px;
border: solid #dee2e6;
margin-right: 0;
margin-left: 0;
border-width: 1px;
border-radius: .25rem .25rem .25rem .25rem;
}
.mb-3, .my-3 {
margin-bottom: 0rem!important;
}
</style>
<meta name="theme-color" content="#7952b3">
<title>user info</title>
</head>
<body>
<form name="frm">
<input type="hidden" class="form-control" id="use_yn" name="use_yn">
<input type="hidden" class="form-control" id="p_code" name="p_code">
<input type="hidden" class="form-control" id="grade" name="grade">
<input type="hidden" class="form-control" id="center_id" name="center_id">
<div class="container-fluid">
<div class="row">
<div class="col-4">
<div>
<i class="far fa-caret-square-right"></i>&nbsp;<label class="form-label" style="font-size: 1.3em; font-weight: 700;">유저목록</label>
</div>
<table
id="table"
class="table-sm"
data-virtual-scroll="true"
data-sort-name="id"
data-sort-order="asc"
data-sortable="true"
data-pagination="false"
data-search="false"
data-single-select="true"
data-click-to-select="true"
data-show-toggle="false"
data-use-row-attr-func="true"
data-reorderable-rows="false"
style="text-align: center;">
<thead style="text-align: center;">
<tr>
<th data-field="USER_ID" data-width="25%">유저ID</th>
<th data-field="USER_NAME" data-width="25%">유저명</th>
<th data-field="PASSWD" data-visible="false">비밀번호</th>
<th data-field="CENTER_ID" data-width="40%" data-visible="false">센터정보</th>
<th data-field="GRADE" data-visible="false">권한</th>
<th data-field="GRADE_NM" data-width="25%">권한</th>
<th data-field="CUSTOM1" data-visible="false">커스텀1</th>
<th data-field="CUSTOM2" data-visible="false">커스텀2</th>
</tr>
</thead>
</table>
</div>
<div class="col-6">
<div class="col-md">
<i class="far fa-caret-square-right"></i>&nbsp;<label class="form-label" style="font-size: 1.3em; font-weight: 700;">유저상세</label>
</div>
<div class="bd-example">
<div class="row mb-3">
<div class="col-11">
<div class="row mb-3">
<label for="user_id" class="col-sm-3 col-form-label">유저ID</label>
<div class="col-sm-9 valign-wrapper">
<input type="text" class="form-control" id="user_id" name="user_id" autocomplete="new-password">
</div>
</div>
</div>
<div class="col-1"></div>
<div class="col-11">
<div class="row mb-3">
<label for="user_name" class="col-sm-3 col-form-label">센터명</label>
<div class="col-sm-9 valign-wrapper">
<input type="text" class="form-control" id="user_name" name="user_name" autocomplete="new-password">
</div>
</div>
</div>
<div class="col-1"></div>
<div class="col-11">
<div class="row mb-3">
<label for="passwd" class="col-sm-3 col-form-label">비밀번호</label>
<div class="col-sm-9 valign-wrapper">
<input type="password" class="form-control" id="passwd" name="passwd" autocomplete="new-password">
</div>
</div>
</div>
<div class="col-1"></div>
<div class="col-11">
<div class="row mb-3">
<label for="passwd" class="col-sm-3 col-form-label">센터</label>
<div class="col-sm-9 valign-wrapper">
<div id="div-cbo_Team" style="display: inline-block;">
<script type="text/javascript">
$(document).ready(function() {
$('#selCenter').multiselect({
maxHeight: 300
,enableFiltering: false
,numberDisplayed: 4
,includeSelectAllOption: false
//,onChange: function(option, checked, select) {
// $('#selCenter').multiselect('refresh');
//}
});
});
</script>
<select id="selCenter" name="selCenter" style="width: 100px" multiple="multiple">
</select>
</div>
</div>
</div>
</div>
<div class="col-1"></div>
<div class="col-11">
<div class="row mb-3">
<label for="center_order" class="col-sm-3 col-form-label">권한</label>
<div class="col-sm-3 valign-wrapper">
<select id="selGrade" name="selGrade" style="width: 100px">
</select>
</div>
</div>
</div>
<div class="col-1"></div>
<div class="col-11">
<div class="row mb-3">
<label for="custom1" class="col-sm-3 col-form-label">커스텀1</label>
<div class="col-sm-9 valign-wrapper">
<input type="text" class="form-control" id="custom1" name="custom1">
</div>
</div>
</div>
<div class="col-1"></div>
<div class="col-11">
<div class="row mb-3">
<label for="custom2" class="col-sm-3 col-form-label">커스텀2</label>
<div class="col-sm-9 valign-wrapper">
<input type="text" class="form-control" id="custom2" name="custom2">
</div>
</div>
</div>
<div class="col-1"></div>
</div>
</div>
<br>
<div class="col-md">
<button type="button" class="btn btn-sm btn-primary" id="btnSave">저장</button>
<button type="button" class="btn btn-secondary btn-sm" id="btnCancel">취소</button>
</div>
</div>
</div>
</div>
</form>
<script>
$("#btnSave").click(function(e) {
setData();
if(updateCheck()){
updateInfo();
}else{
insertInfo();
}
});
function updateCheck(){
var updateflag = false;
var user_id = $('#user_id').val();
var dataarray = $('#table').bootstrapTable('getData');
for (var i=0; i<dataarray.length; i++){
if(user_id == dataarray[i].USER_ID){
updateflag = true;
}
}
return updateflag;
}
function updateInfo(){
var queryString = $("form[name=frm]").serialize() ;
$.ajax({
url:"<c:url value='/updateUserInfo'/>",
data : queryString,
type:"post",
datatype:"json",
success:function(args){
$('#table').bootstrapTable('load', args.list);
alert("저장됐습니다");
},
error : function(x,o,e){
var msg = "에러발생 \n" + x.status + " : " + o + " : " + e;
alert(msg);
}
});
}
function insertInfo(){
var queryString = $("form[name=frm]").serialize() ;
$.ajax({
url:"<c:url value='/insertUserInfo'/>",
data : queryString,
type:"post",
datatype:"json",
success:function(args){
$('#table').bootstrapTable('load', args.list);
alert("저장됐습니다");
},
error : function(x,o,e){
var msg = "에러발생 \n" + x.status + " : " + o + " : " + e;
alert(msg);
}
});
}
function setData(){
var tmp_center_id = "";
var tgtsel = document.getElementById('selCenter'); //센터 멀티셀렉트
for(var i=0; i<tgtsel.length; i++){
if(tgtsel.options[i].selected){
tmp_center_id +=tgtsel.options[i].value + ","; //선택된 상담그룹을 문자열로 만들었다.
}
}
$('#center_id').val(tmp_center_id);
$('#grade').val($("#selGrade > option:selected").val());
}
function resetElements(){
$('#center_id').val("");
$('#user_id').val("");
$('#user_name').val("");
$('#passwd').val("");
$('#grade').val("");
$('#custom1').val("");
$('#custom2').val("");
}
$(function() {
$('#dbid').val("0");
$('#table').bootstrapTable();
getCenterList();
getGradeList();
getData();
});
function setImage(img_type, id, name, file, path){
if(img_type == "B"){
$('#bg_info').val(id);
$('#bg_path').val(path);
$('#bg_file').val(file);
$('#bg_nm').val(name);
$("#bg_img").attr("src", "/" + path + file+ "");
}else if(img_type == "C"){
$('#ci_info').val(id);
$('#ci_path').val(path);
$('#ci_file').val(file);
$('#ci_nm').val(name);
$("#ci_img").attr("src", "/" + path + file+ "");
}
}
function fn_openPop(obj){
//document.frm.IDX.value = obj[0].id;
fncPop_Click();
}
function fncPopup(imgtype){
goPage_Popup('<%=cntx%>/image_selector?IMG_TYPE=' + imgtype, '880', '500','no', 'pop_image_' + imgtype);
}
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 getData(){
var queryString = $("form[name=frm]").serialize() ;
$.ajax({
url:"<c:url value='/getUserInfo_Manage'/>",
data : queryString,
type:"post",
datatype:"json",
success:function(args){
$('#table').bootstrapTable('load', args.list);
resetElements();
},
error : function(x,o,e){
var msg = "에러발생 \n" + x.status + " : " + o + " : " + e;
alert(msg);
}
});
}
//센터 목록을 조회한다
function getCenterList(){
document.getElementById('use_yn').value = "ALL";
var queryString = $("form[name=frm]").serialize() ;
$.ajax({
url:"<%=cntx%>/getCenterInfo_Manage",
type:"post",
data : queryString,
datatype:"json",
success:function(args){
$('#selCenter').multiselect();
var data = [];
for(var j=0; j<args.list.length; j++){
var group = {label: args.list[j].CENTER_NAME,
value: args.list[j].CENTER_ID
};
data.push(group);
}
$('#selCenter').multiselect('dataprovider', data);
},
error : function(x,o,e){
var msg = "에러발생 \n" + x.status + " : " + o + " : " + e;
alert(msg);
}
});
}
//권한 리스트 조회
function getGradeList(){
document.getElementById('use_yn').value = "ALL";
document.getElementById('p_code').value = "A002";
var queryString = $("form[name=frm]").serialize() ;
$.ajax({
url:"<%=cntx%>/getComCode",
type:"post",
data : queryString,
datatype:"json",
success:function(args){
var frm1 = document.frm;
for(var i=0; i<args.list.length; i++){
op = new Option();
op.value = args.list[i].CODE;
op.text = args.list[i].CODE_NAME;
frm1.selGrade.options.add(op);
}
},
error : function(x,o,e){
var msg = "에러발생 \n" + x.status + " : " + o + " : " + e;
alert(msg);
}
});
}
//Table onClick이벤트시 유저 데이터 세팅
$('#table').bootstrapTable({
onClickRow: function (row, el, field) {
$('#user_id').val(row.USER_ID);
$('#user_name').val(row.USER_NAME);
$('#passwd').val(row.PASSWD);
var center_ids = row.CENTER_ID.split(',');
var tmpArr = [];
for(var h=0;h<$('#selCenter option').length;h++){
$("#selCenter option:eq("+h+")").removeAttr("selected");
}
for(var i=0;i<$('#selCenter option').length;i++){
var selvar = $("#selCenter option:eq("+i+")").val();
for(var j=0;j<center_ids.length;j++){
if(selvar == center_ids[j]){
$("#selCenter option:eq("+i+")").attr("selected", "selected");
tmpArr.push(i+1);
}
}
}
//$('#selCenter').multiselect("select", tmpArr, true);
$('#selCenter').multiselect('refresh');
//$('#selCenter').multiselect('updateButtonText');
$('#selGrade').val(row.GRADE);
$('#custom1').val(row.CUSTOM1);
$('#custom2').val(row.CUSTOM2);
}
});
</script>
</body>
</html>