API 신청관리 승인상태 변경처리 - 개별처리, 기관별 처리
parent
23c591c1df
commit
a7975cc2e0
|
|
@ -69,7 +69,6 @@ public class ApiKeyManagementController {
|
|||
|
||||
return result;
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* API 관리 > API신청 승인상태 변경
|
||||
|
|
@ -82,12 +81,16 @@ public class ApiKeyManagementController {
|
|||
*/
|
||||
@ResponseBody
|
||||
@RequestMapping(value = "/admins/mgmtApiKey/approve.do", method = RequestMethod.POST)
|
||||
public HashMap<String, Object> modMgmtApiKeyApprove(@RequestParam(value="apiSeq") int apiSeq, ModelMap model, HttpServletResponse response, HttpServletRequest request) throws Exception {
|
||||
public HashMap<String, Object> modMgmtApiKeyApprove(
|
||||
@RequestParam(value="seqArr", required=false) List<Integer> seqArr,
|
||||
@RequestParam(value="approveYn", required=false) String approveYn,
|
||||
@RequestParam(value="otype", required=false) String otype, ModelMap model, HttpServletResponse response, HttpServletRequest request) throws Exception {
|
||||
HashMap<String, Object> result = new HashMap<String, Object>();
|
||||
|
||||
HashMap<String,Object> params = new HashMap<>();
|
||||
params.put("apiSeq", apiSeq);
|
||||
params.put("approveYn", "Y");
|
||||
params.put("seqArr", seqArr);
|
||||
params.put("approveYn", approveYn);
|
||||
params.put("otype", otype);
|
||||
|
||||
apiKeyManagementService.updateWebApiKeyApprove(params);
|
||||
|
||||
|
|
|
|||
|
|
@ -34,7 +34,20 @@
|
|||
<if test="approveYn != null and approveYn !=''">
|
||||
APPROVE_YN = #{approveYn}
|
||||
</if>
|
||||
WHERE API_SEQ IN (#{apiSeq})
|
||||
<where>
|
||||
<!-- seqArr 조건 -->
|
||||
<if test="seqArr != null and seqArr.size() > 0">
|
||||
API_SEQ IN
|
||||
<foreach item="item" index="index" collection="seqArr" open="(" separator=", " close=")">
|
||||
#{item}
|
||||
</foreach>
|
||||
</if>
|
||||
|
||||
<!-- otype 조건 -->
|
||||
<if test="otype != null and otype != ''">
|
||||
AND USER_TYPE = #{otype}
|
||||
</if>
|
||||
</where>
|
||||
</update>
|
||||
|
||||
<!-- 사용자 API 신청 삭제하기 -->
|
||||
|
|
|
|||
|
|
@ -13,7 +13,6 @@
|
|||
|
||||
<!-- MUI + Chart.js + jQuery -->
|
||||
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
|
||||
<!-- <link href="https://cdn.jsdelivr.net/npm/@mui/material@5.15.14/dist/material.min.css" rel="stylesheet"> -->
|
||||
<style>
|
||||
body { font-family: 'Pretendard', 'Roboto', sans-serif; background-color: #f5f6fa; color: #333; margin: 0; padding: 20px; }
|
||||
|
||||
|
|
|
|||
|
|
@ -8,7 +8,6 @@
|
|||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
||||
<!-- MUI + Chart.js + jQuery -->
|
||||
<link href="https://cdn.jsdelivr.net/npm/@mui/material@5.15.14/dist/material.min.css" rel="stylesheet">
|
||||
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
|
||||
<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
|
||||
|
||||
|
|
@ -16,8 +15,83 @@
|
|||
body { font-family: 'Pretendard', 'Roboto', sans-serif; background-color: #f5f6fa; margin: 0; padding: 20px; }
|
||||
|
||||
.text-center {text-align: center}
|
||||
|
||||
/* 승인 토글스위치 */
|
||||
/* 스위치들을 한 줄에 나란히 */
|
||||
.switch-group {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 15px; /* 스위치 간 간격 */
|
||||
}
|
||||
.molit-g-switch,.mois-g-switch, .mof-g-switch {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 5px;
|
||||
margin-right: 10px;
|
||||
|
||||
}
|
||||
/* 스위치 디자인 */
|
||||
.mui-switch {
|
||||
position: relative;
|
||||
flex-shrink: 0; /* 스위치 크기 줄어들지 않게 */
|
||||
display: inline-block;
|
||||
width: 48px;
|
||||
height: 26px;
|
||||
}
|
||||
|
||||
.mui-switch input {
|
||||
opacity: 0;
|
||||
width: 0;
|
||||
height: 0;
|
||||
}
|
||||
|
||||
.mui-slider {
|
||||
position: absolute;
|
||||
cursor: pointer;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background-color: #ccc;
|
||||
transition: 0.4s;
|
||||
border-radius: 34px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: ${''}; /* 가운데 맞춤 */
|
||||
}
|
||||
|
||||
.mui-slider:before {
|
||||
position: absolute;
|
||||
content: "OFF";
|
||||
color: #fff;
|
||||
font-size: 10px;
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
left: 3px;
|
||||
bottom: 3px;
|
||||
background-color: #999;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
border-radius: 50%;
|
||||
transition: 0.4s;
|
||||
}
|
||||
|
||||
input:checked + .mui-slider {
|
||||
background-color: #4A90E2;
|
||||
}
|
||||
|
||||
input:checked + .mui-slider:before {
|
||||
transform: translateX(22px);
|
||||
content: "ON";
|
||||
background-color: #1A73E8;
|
||||
}
|
||||
|
||||
/* API 신청 내역 테이블 */
|
||||
.table-container {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between; /* 제목 왼쪽, 스위치 오른쪽 */
|
||||
margin-top: 25px; background: #fff; border-radius: 12px; padding: 20px;
|
||||
box-shadow: 0 2px 8px rgba(0,0,0,0.05);
|
||||
}
|
||||
|
|
@ -56,6 +130,29 @@
|
|||
<!-- API 신청 테이블 -->
|
||||
<div class="table-container home-trainning">
|
||||
<h3>API 신청 내역</h3>
|
||||
|
||||
<div class="switch-group">
|
||||
<div class="molit-g-switch">국토교통부
|
||||
<label class="mui-switch">
|
||||
<input type="checkbox" class="globalSwitch" data-otype="국토교통부" onchange="toggleApproveKey(this)" checked>
|
||||
<span class="mui-slider"></span>
|
||||
</label>
|
||||
</div>
|
||||
<div class="mois-g-switch">행정안전부
|
||||
<label class="mui-switch">
|
||||
<input type="checkbox" class="globalSwitch" data-otype="행정안전부" onchange="toggleApproveKey(this)" checked>
|
||||
<span class="mui-slider"></span>
|
||||
</label>
|
||||
</div>
|
||||
<div class="mof-g-switch">해양수산부
|
||||
<label class="mui-switch">
|
||||
<input type="checkbox" class="globalSwitch" data-otype="해양수산부" onchange="toggleApproveKey(this)" checked>
|
||||
<span class="mui-slider"></span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="table-container home-trainning">
|
||||
<table class="Table_Main course-list-table">
|
||||
<colgroup>
|
||||
<col style="width: 3%">
|
||||
|
|
@ -121,13 +218,9 @@
|
|||
});
|
||||
}
|
||||
function drawApiKeyList(item) {
|
||||
// 승인 상태에 따른 표시
|
||||
let approveHtml = "";
|
||||
if (item.approveYn == "Y") {
|
||||
approveHtml = "승인됨";
|
||||
} else {
|
||||
approveHtml = `<button class="approve-btn" data-id="\${item.apiSeq}" onclick="approveKey(this);">승인</button>`;
|
||||
}
|
||||
|
||||
// approveYn 이 "Y"이면 체크 상태, 아니면 체크 해제
|
||||
const isChecked = item.approveYn === "Y" ? "checked" : "";
|
||||
// HTML 문자열 생성
|
||||
const html = `
|
||||
<tr data-idx="\${item.apiSeq}">
|
||||
|
|
@ -137,20 +230,41 @@
|
|||
<td>\${item.apiKey}</td>
|
||||
<td class="text-center">\${item.startDt}</td>
|
||||
<td class="text-center">\${item.endDt}</td>
|
||||
<td class="text-center">\${approveHtml}</td>
|
||||
<td class="text-center approve-switch">
|
||||
<label class="mui-switch">
|
||||
<input type="checkbox" class="key-toggle" data-seq="\${item.apiSeq}" onchange="toggleApproveKey(this)" \${isChecked}>
|
||||
<span class="mui-slider"></span>
|
||||
</label></td>
|
||||
<td class="text-center"><button class="approve-btn" data-id="\${item.apiSeq}" onclick="revokeKey(this);">삭제</button></td>
|
||||
</tr>
|
||||
`;
|
||||
return html;
|
||||
}
|
||||
|
||||
|
||||
// 승인처리하기
|
||||
function approveKey(e) {
|
||||
let apiSeq = $(e).data("id")
|
||||
function toggleApproveKey(ele) {
|
||||
let apiSeq = $(ele).data("seq")
|
||||
let seqArr = [];
|
||||
let otype = !$(ele).data("otype") ? '' : $(ele).data("otype"); // 일괄변경 스위치 클릭한 경우
|
||||
let approve = $(ele).is(":checked") ? "Y" : "N";
|
||||
|
||||
if (otype == '') {
|
||||
seqArr.push($(ele).data("seq"));
|
||||
}
|
||||
|
||||
|
||||
// if (btnType == 'globalSwitch') {
|
||||
// $('.approve-switch').each(function(i, el) {
|
||||
// const idx = $(el).data('seq');
|
||||
// seqArr.push(idx);
|
||||
// });
|
||||
// } else {
|
||||
// seqArr.push($(ele).data("seq"));
|
||||
// }
|
||||
$.ajax({
|
||||
type : "POST",
|
||||
url : "/admins/mgmtApiKey/approve.do" ,
|
||||
data : {apiSeq:apiSeq},
|
||||
data : {seqArr:seqArr, approveYn: approve, otype: otype},
|
||||
traditional: true,
|
||||
dataType :"json",
|
||||
success : function(res){ // res.code, res.msg, res.data
|
||||
|
|
|
|||
|
|
@ -14,7 +14,6 @@
|
|||
|
||||
<!-- MUI + Chart.js + jQuery -->
|
||||
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
|
||||
<link href="https://cdn.jsdelivr.net/npm/@mui/material@5.15.14/dist/material.min.css" rel="stylesheet">
|
||||
<style>
|
||||
body { font-family: 'Pretendard', 'Roboto', sans-serif; background-color: #f5f6fa; margin: 0; padding: 20px; }
|
||||
|
||||
|
|
@ -479,7 +478,6 @@
|
|||
// API 호출 로그 목록 조회
|
||||
function getMgmtApiChart(){
|
||||
var chartDate = $('#chartDate').val();
|
||||
console.log($('#chartDate').val())
|
||||
$.ajax({
|
||||
type : "POST",
|
||||
url : "/admins/mgmtApi/charts.do" ,
|
||||
|
|
|
|||
Loading…
Reference in New Issue