mindol1004/MangKyu-erros
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add AddUser ViewPage

Browse Source
This commit is contained in:
MangKyu
2021-12-26 00:05:57 +09:00
parent 7242523f59
commit 3d235ffe49
5 changed files with 232 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
src/main/java/com/mangkyu/employment/interview/app/user/controller/WebUserController.java Normal file
View File

@@ -0,0 +1,28 @@
package com.mangkyu.employment.interview.app.user.controller;
import com.mangkyu.employment.interview.app.quiz.constants.QuizConstants;
import com.mangkyu.employment.interview.enums.common.EnumMapperKey;
import com.mangkyu.employment.interview.enums.factory.EnumMapperFactory;
import com.mangkyu.employment.interview.enums.value.QuizLevel;
import lombok.RequiredArgsConstructor;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
@Controller
@RequiredArgsConstructor
public class WebUserController {
private final EnumMapperFactory factory;
@GetMapping("/user/addView")
public String addUserPage(final Model model) {
model.addAttribute("quizLevelList", factory.get(EnumMapperKey.QUIZ_LEVEL));
model.addAttribute("quizCategoryList", factory.get(EnumMapperKey.QUIZ_CATEGORY));
model.addAttribute("quizDayList", factory.get(EnumMapperKey.QUIZ_DAY));
model.addAttribute("minQuizSize", QuizConstants.MINIMUM_QUIZ_SIZE);
model.addAttribute("maxQuizSize", QuizConstants.MAXIMUM_QUIZ_SIZE);
return "user/addUser";
}
}

22
src/main/resources/static/js/common/combobox.js Normal file
View File

@@ -0,0 +1,22 @@
/*Dropdown Menu*/
$('.combo-dropdown').click(function () {
$(this).attr('tabindex', 1).focus();
$(this).toggleClass('active');
$(this).find('.combo-dropdown-menu').slideToggle(300);
});
$('.combo-dropdown').focusout(function () {
$(this).removeClass('active');
$(this).find('.combo-dropdown-menu').slideUp(300);
});
$('.combo-dropdown .combo-dropdown-menu li').click(function () {
$(this).parents('.combo-dropdown').find('span').text($(this).text());
$(this).parents('.combo-dropdown').find('input').attr('value', $(this).attr('id'));
});
/*End Dropdown Menu*/
$('.combo-dropdown-menu li').click(function () {
var input = '<strong>' + $(this).parents('.combo-dropdown').find('input').val() + '</strong>',
msg = '<span class="msg">Hidden input value: ';
$('.msg').html(msg + input + '</span>');
});

5
src/main/resources/static/js/common/jquery-1.12.4.min.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

76
src/main/resources/static/js/user/add.js Normal file
View File

@@ -0,0 +1,76 @@
$(document).ready(function () {
$("#btn-add-user").click(function () {
addUser();
});
});
function addUser() {
const quizLevel = $('#quiz-level').val(),
email = $("#email").val(),
quizSize = $("#quizSize").val(),
quizDaySet = findQuizDaySet(),
quizCategorySet = findQuizCategorySet();
if (!quizLevel) {
alert("Input quizLevel");
return false;
} else if (!email) {
alert("Input email");
return false;
} else if (!quizSize) {
alert("Input quizSize");
return false;
} else if (quizDaySet.length <= 0) {
alert("Select quizDaySet");
return false;
} else if (quizCategorySet.length <= 0) {
alert("Select quizCategorySet");
return false;
}
$.ajax({
url: '/user',
type: 'POST',
contentType: 'application/json',
data: JSON.stringify({
'email': email,
'quizLevel': quizLevel,
'quizSize': quizSize,
'quizDaySet': quizDaySet,
'quizCategorySet': quizCategorySet
}),
success: function () {
alert("사용자 추가 성공")
},
error: function () {
alert("사용자 추가 실패");
}
});
}
function findQuizDaySet() {
const quizDaySet = [];
$("#quiz-day-set input").each(function () {
const quizDay = $(this);
if (quizDay.is(':checked')) {
quizDaySet.push(quizDay.val())
}
});
return quizDaySet;
}
function findQuizCategorySet() {
const quizCategorySet = [];
$("#quiz-category-set input").each(function () {
const quizCategory = $(this);
if (quizCategory.is(':checked')) {
quizCategorySet.push(quizCategory.val())
}
});
return quizCategorySet;
}

101
src/main/resources/templates/user/addUser.html Normal file
View File

@@ -0,0 +1,101 @@
<!doctype html>
<html xmlns:th="http://www.thymeleaf.org"
class="no-js" lang="ko">
<head>
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<title>InterviewSubscription</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- CSS here -->
<link rel="stylesheet" href="/static/css/bootstrap.min.css">
<link rel="stylesheet" href="/static/css/owl.carousel.min.css">
<link rel="stylesheet" href="/static/css/magnific-popup.css">
<link rel="stylesheet" href="/static/css/font-awesome.min.css">
<link rel="stylesheet" href="/static/css/themify-icons.css">
<link rel="stylesheet" href="/static/css/nice-select.css">
<link rel="stylesheet" href="/static/css/flaticon.css">
<link rel="stylesheet" href="/static/css/gijgo.css">
<link rel="stylesheet" href="/static/css/animate.css">
<link rel="stylesheet" href="/static/css/slicknav.css">
<link rel="stylesheet" href="/static/css/style.css">
<link rel="stylesheet" href="/static/css/combobox.css">
</head>
<body>
<section class="contact-section">
<div class="container">
<div class="row">
<div class="col-12x">
<h2 class="contact-title">Add User</h2>
<div class="row">
<div class="col-12">
<div class="form-group">
<div class="combo-dropdown">
<div class="select">
<span>Select QuizLevel</span>
<i class="fa fa-chevron-left"></i>
<input type="hidden" id="quiz-level">
</div>
<ul class="combo-dropdown-menu" id="quiz-level-dropdown">
<li th:each="quizLevel:${quizLevelList}" th:text="${quizLevel.code}"
th:id="${quizLevel.code}" th:name="${quizLevel.code}">Quiz Level
</li>
</ul>
</div>
</div>
</div>
<div class="col-12">
<div class="form-group">
<input class="form-control" name="email" id="email" type="text"
onfocus="this.placeholder = ''" onblur="this.placeholder = 'Enter email'"
placeholder="Enter email">
</div>
</div>
<div class="col-12">
<div class="form-group">
<input class="form-control" name="quizSize" id="quizSize" type="number"
th:min="${minQuizSize}" step="1" th:max="${maxQuizSize}"
onfocus="this.placeholder = ''" onblur="this.placeholder = 'Enter quizSize'"
placeholder="Enter quizSize">
</div>
</div>
<div class="col-sm-6" id="quiz-day-set">
<div th:each="quizDay:${quizDayList}" >
<input type="checkbox" th:text="${quizDay.code}"
th:id="${quizDay.code}"
th:name="${quizDay.code}" th:value="${quizDay.code}" checked>
</br>
</div>
</div>
<div class="col-sm-6" id="quiz-category-set">
<div th:each="quizCategory:${quizCategoryList}">
<input type="checkbox" th:text="${quizCategory.code}"
th:id="${quizCategory.code}"
th:name="${quizCategory.code}" th:value="${quizCategory.code}" checked>
<br/>
</div>
</div>
</div>
<div class="form-group mt-3">
<button type="submit" class="button boxed-btn" id="btn-add-user">Add</button>
</div>
</div>
</div>
</div>
</section>
<!-- JS here -->
<script src="/static/js/common/jquery-1.12.4.min.js"></script>
<script src="/static/js/common/combobox.js"></script>
<script src="/static/js/user/add.js"></script>
</body>
</html>