검색 모달 기능 추가

src/main/java/com/no1/wms/account/AccountController.java

@@ -3,17 +3,22 @@ package com.no1.wms.account;
 import com.no1.wms.utils.ConstantValues;
 import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.stereotype.Controller;
+import org.springframework.web.bind.annotation.GetMapping;
+import org.springframework.web.bind.annotation.PostMapping;
+import org.springframework.web.bind.annotation.RequestMapping;
 import org.springframework.web.bind.annotation.RequestParam;
 import org.springframework.web.servlet.ModelAndView;
 
 import java.util.List;
 
 @Controller
+@RequestMapping("/account")
 public class AccountController {
 
     @Autowired
     AccountService accountService;
 
+    @GetMapping("/list")
     public ModelAndView list(ModelAndView mav, @RequestParam(defaultValue = "") String search, @RequestParam(defaultValue = "0") int start){
 
         List<AccountDto> list = accountService.selectAll(search, start, ConstantValues.PER_PAGE);
@@ -23,4 +28,19 @@ public class AccountController {
         return mav;
     }
 
+    @PostMapping("/create")
+    public ModelAndView create(ModelAndView mav){
+        mav.setViewName("account/create");
+        return mav;
+    }
+
+    @PostMapping("/show_modal")
+    public ModelAndView showModal(ModelAndView mav, @RequestParam String name){
+        //db에서 데이터 가져오는거 필요
+
+        //
+        mav.setViewName(name);
+        return mav;
+    }
+
 }

src/main/java/com/no1/wms/account/AccountDto.java

@@ -1,5 +1,6 @@
 package com.no1.wms.account;
 
+import com.no1.wms.authority.AuthorityDto;
 import com.no1.wms.department.DepartmentDto;
 import com.no1.wms.position.PositionDto;
 import lombok.AllArgsConstructor;
@@ -27,8 +28,14 @@ public class AccountDto {
     private Date birth;
     private String telephone;
     private String address;
-    private DepartmentDto department;
+    private String departmentId;
-    private PositionDto position;
+    private String positionId;
+
+    private DepartmentDto departmentDto;
+    private PositionDto positionDto;
+    private AuthorityDto groupAuthorityDto;
+    private AuthorityDto personalAuthorityDto;
+
     @Builder.Default
     private Boolean activation = true;
 

src/main/java/com/no1/wms/account/AccountService.java

@@ -25,7 +25,9 @@ public class AccountService {
 
     public List<AccountDto> selectAll(String search, int start, int perPage){
         HashMap<String, Object> map = new HashMap<String, Object>();
-
+        map.put("search", search);
+        map.put("start", start);
+        map.put("perPage", perPage);
 
 
 

src/main/java/com/no1/wms/account/DeptAndPositionDto.java

@@ -0,0 +1,17 @@
+package com.no1.wms.account;
+
+import lombok.AllArgsConstructor;
+import lombok.Builder;
+import lombok.Data;
+import lombok.NoArgsConstructor;
+import org.apache.ibatis.type.Alias;
+
+@Data
+@Builder
+@NoArgsConstructor
+@AllArgsConstructor
+@Alias("DeptPositionDto")
+public class DeptAndPositionDto {
+    private String id;
+    private String name;
+}

src/main/resources/mappers/AccountMapper.xml

@@ -1,6 +1,72 @@
 <?xml version="1.0" encoding="UTF-8" ?>
 
 <!DOCTYPE mapper PUBLIC "-//mybatis.org//DTO Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
-<mapper namespace="com.no1.wms.authority.AuthorityMapper">
+<mapper namespace="com.no1.wms.account.AccountMapper">
+    <resultMap id="accountResultMap" type="AccountDto">
+        <id column="id"                     property="id"/>
+        <result column="name"               property="name"/>
+        <result column="employee_number"    property="employeeNumber"/>
+        <result column="password"           property="password"/>
+        <result column="email"              property="email"/>
+        <result column="gender"             property="gender"/>
+        <result column="birth"              property="birth"/>
+        <result column="telephone"          property="telephone"/>
+        <result column="address"            property="address"/>
+        <result column="activation"         property="activation"/>
+        <association property="groupAuthorityDto"  javaType="authorityDto">
+            <id column="auth2.id" property="id" />
+            <result column="group_auth_name" property="name" />
+        </association>
+        <association property="personalAuthorityDto"  javaType="authorityDto">
+            <id column="auth.id" property="id" />
+            <result column="personal_auth_name" property="name" />
+        </association>
+        <association property="departmentDto"  javaType="deptPositionDto">
+            <id column="dept.id" property="id" />
+            <result column="dept_name" property="name" />
+        </association>
+        <association property="positionDto"  javaType="deptPositionDto">
+            <id column="pos.id" property="id" />
+            <result column="pos_name" property="name" />
+        </association>
+    </resultMap>
+    <select id="selectById" resultMap="accountResultMap" parameterType="accountDto">
+        SELECT
+            acc.id, acc.name,
+            acc.employee_number, acc.password, acc.email, acc.gender,
+            acc.birth, acc.telephone, acc.address, acc.activation,
+            auth2.name group_auth_name, auth.name personal_auth_name,
+            dept.name dept_name, pos.name pos_name
+        from account acc join authority auth join authority auth2 join department dept join position pos
+        on acc.personal_authority_id = auth.id and acc.group_authority_id = auth2.id
+        and dept.id = acc.department_id and acc.position_id = pos.id
+        where acc.name like concat('%',#{search},'%')
+    </select>
 
+    <select id="selectAll" resultMap="accountResultMap" parameterType="map">
+        SELECT
+            acc.id, acc.name,
+            acc.employee_number, acc.password, acc.email, acc.gender,
+            acc.birth, acc.telephone, acc.address, acc.activation,
+            auth2.name group_auth_name, auth.name personal_auth_name
+        from account acc join authority auth join authority auth2 on acc.personal_authority_id = auth.id and acc.group_authority_id = auth2.id
+        where acc.name like concat('%',#{search},'%')
+        order by acc.activation desc, acc.id desc limit #{start}, #{perPage}
+    </select>
+    <insert id="insert" parameterType="accountDto">
+        insert into account
+        (
+            id, employee_number, password, email, group_authority_id,
+            personal_authority_id, name, gender, birth, telephone, address,
+            department_id, position_id, activation
+        )
+        VALUES
+        (
+           UUID(), #{employeeNumber}, #{password},
+           #{email}, #{groupAuthorityId},
+           #{personalAuthorityId},#{name},#{gender},
+           #{birth},#{stelephone}, #{address},
+           #{departmentId},#{positionId},#{activation}
+        )
+    </insert>
 </mapper>

src/main/resources/static/css/base.css

@@ -63,4 +63,8 @@
 .col-centered{
     margin: 0 auto;
     float: none;
+}
+
+input:read-only{
+    background-color: #ececec;
 }

src/main/resources/static/dev/authority_list_dev.html

@@ -4,9 +4,9 @@
 
     <meta charset="UTF-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <script src="../../../webapp/WEB-INF/views/authority/base.js"></script>
+    <script src="../../../webapp/WEB-INF/views/account/base.js"></script>
     <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
-    <link rel="stylesheet" href="../../../webapp/WEB-INF/views/authority/base.css">
+    <link rel="stylesheet" href="../../../webapp/WEB-INF/views/account/base.css">
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
     <script src="https://unpkg.com/feather-icons"></script>
 

src/main/resources/static/dev/layout_dev.html

@@ -157,6 +157,7 @@
           //검색 팝업 모달 관련
           const searchModalBootStrap = new bootstrap.Modal("#search_modal");
           $("#search_modal_show_button").on("click", function(){
+
             searchModalBootStrap.show();
           });
 

src/main/webapp/WEB-INF/tiles/tiles.xml

@@ -12,7 +12,7 @@
         <put-attribute name="content" value="" />
     </definition>
 
-    <definition name="*" extends="layout-tiles" template="/WEB-INF/views/base/empty.jsp">
+    <definition name="*" extends="layout-tiles" template="/WEB-INF/views/modal/empty.jsp">
         <put-attribute name="content" value="/WEB-INF/views/modal/{1}.jsp" />
     </definition>
 

src/main/webapp/WEB-INF/views/account/create.jsp

@@ -0,0 +1,89 @@
+<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
+<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
+<!-- 이 안에 내용 복사해서 jsp에 붙여넣기 -->
+<script>
+    /*
+    yes no 모달의 확인 버튼을 누를때 재정의할 function
+
+    yesNoModal.yesFunction = myYesFunction;
+    function myYesFunction(){
+      alert("재정의 됨");
+    }
+    */
+    function showSearchModal(title, val){
+        $("#searchModalLabel").text(title);
+        const data = { name : val};
+        $.ajax({
+            type : 'post',           // 타입 (get, post, put 등등)
+            url : '/account/show_modal',           // 요청할 서버url
+            dataType : 'html',       // 데이터 타입 (html, xml, json, text 등등)
+            data : data,
+            success : function(result) { // 결과 성공 콜백함수
+                $("#search_modal_body").html(result);
+                searchModalBootStrap.show();
+            },
+            error : function(request, status, error) {
+                alert(error)
+            }
+        });
+    }
+</script>
+<div class="container-fluid">
+    <div class="row">
+        <div class="col-12">
+            <div class="mt-5 mb-5 text-center">
+                <h1>사용자 추가</h1>
+            </div>
+            <div>
+                <hr>
+            </div>
+        </div>
+    </div>
+    <div class="row">
+        <div class="col-12">
+            <div class="input-group w-50">
+                <span id='account_name_label' class="input-group-text">사용자 명</span>
+                <input name="name" id="account_name" type="text" class="form-control" placeholder="" aria-label="Username" aria-describedby="account_name_label">
+                <span class="me-5"></span>
+                <span id='employee_number_label' class="input-group-text">사번</span>
+                <input id=employee_number" type="text" class="form-control" placeholder="" aria-label="Username" aria-describedby="employee_number_label">
+            </div>
+            <div class="input-group w-50 mt-3">
+                <span id='account_dept_label' class="input-group-text">부서 명</span>
+                <input readonly id="account_dept" type="text" class="form-control" placeholder="" aria-label="Username" aria-describedby="account_dept_label">
+                <button id="btn_dept" type="button" class="btn btn-primary">검색</button>
+                <span class="me-5"></span>
+                <span id='employee_pos_label' class="input-group-text">직책</span>
+                <input readonly id="employee_pos" type="text" class="form-control" placeholder="" aria-label="Username" aria-describedby="employee_number_pos">
+                <button id="btn_pos" type="button" class="btn btn-primary">검색</button>
+            </div>
+            <div class="input-group w-50 mt-3">
+                <span id='account_group_label' class="input-group-text">권한</span>
+                <input readonly id="account_auth_group_name" type="text" class="form-control" placeholder="" aria-label="Username" aria-describedby="account_group_label">
+                <input hidden name="groupAuthorityId" readonly id="groupAuthorityId" type="text" class="form-control" placeholder="" aria-label="Username" aria-describedby="account_group_label">
+                <button id="account_search_button" class="btn-primary btn" onclick="showSearchModal('권한 검색','auth')">검색</button>
+            </div>
+            <div class="input-group w-50 mt-3">
+                <span id='account_email_label' class="input-group-text">이메일</span>
+                <input id="account_email" type="text" class="form-control" placeholder="" aria-label="Username" aria-describedby="account_email_label">
+                <span class="me-5"></span>
+                <span id='employee_telephone_label' class="input-group-text">전화번호</span>
+                <input id=employee_telephone" type="text" class="form-control" placeholder="" aria-label="Username" aria-describedby="employee_telephone_label">
+            </div>
+            <div class="input-group w-50 mt-3">
+                <span id='account_gender_label' class="input-group-text">성별</span>
+                <input id="account_gender" type="text" class="form-control" placeholder="" aria-label="Username" aria-describedby="account_gender_label">
+                <span class="me-5"></span>
+                <span id='employee_birth_label' class="input-group-text">생일</span>
+                <input id="employee_birth" type="date" class="form-control" placeholder="" aria-label="Username" aria-describedby="employee_birth_label">
+            </div>
+        </div>
+    </div>
+    <div class="row mt-4">
+        <div class="col-12">
+            <button class="btn btn-primary" id="btn_confirm">확인</button>
+            <button class="btn btn-danger" id="btn_exit">뒤로</button>
+        </div>
+    </div>
+</div>
+<!-- 이 안에 내용 복사해서 jsp에 붙여넣기 끝 -->

src/main/webapp/WEB-INF/views/account/dept_modal.html

@@ -0,0 +1,59 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>Title</title>
+    <script src="base.js"></script>
+    <link rel="stylesheet" href="base.css">
+    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
+    <script src="https://unpkg.com/feather-icons"></script>
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous">
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL" crossorigin="anonymous"></script>
+</head>
+<body>
+<script>
+    function onSearchAuth(){
+        //
+    }
+</script>
+<div class="container">
+    <div class="row">
+        <div class="col-12">
+            <h2 class="text-center mt-3">권한 검색</h2>
+            <br>
+            <hr>
+        </div>
+    </div>
+    <div class="row">
+        <div class="col-12">
+            <div id="div_auth_search" class="text-end">
+                <select name="search_select" class="form-select d-inline w-10">
+                    <option selected value="10">10</option>
+                    <option value="20">20</option>
+                    <option value="30">30</option>
+                </select>
+                <input id="search_auth_input" type="text" class="w-30 d-inline form-control" placeholder="검색">
+                <button id="search_auth_btn" type="button" class="btn btn-primary" onclick="onSearchAuth()">검색</button>
+            </div>
+        </div>
+        <div class="col-12">
+            <table class="table">
+                <thead class="table-dark">
+                <tr><th>권한명</th><th></th></tr>
+                </thead>
+                <tbody>
+                <tr>
+                    <td>관리자</td>
+                    <td><button data-tid="1234" class="btn btn-primary">선택</button></td>
+                </tr>
+                <tr>
+                    <td>사원</td>
+                    <td><button data-tid="5678" class="btn btn-primary">선택</button></td>
+                </tr>
+                </tbody>
+            </table>
+        </div>
+    </div>
+</div>
+</body>
+</html>

src/main/webapp/WEB-INF/views/account/list.jsp

@@ -0,0 +1,101 @@
+<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
+<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
+<!-- 이 안에 내용 복사해서 jsp에 붙여넣기 -->
+<link rel="stylesheet" href="authority.css">
+<script>
+    /*
+    yes no 모달의 확인 버튼을 누를때 재정의할 function
+
+    yesNoModal.yesFunction = myYesFunction;
+    function myYesFunction(){
+      alert("재정의 됨");
+    }
+    */
+    $(function() {
+        $("#div_personal_search").hide();
+        $(".nav-item button").on("click", function(obj){
+            const selectedButtonId = $(obj.currentTarget).attr('id');
+            if(selectedButtonId === 'home-tab'){
+                $("#div_group_search").show();
+                $("#div_personal_search").hide();
+            }else{
+                $("#div_group_search").hide();
+                $("#div_personal_search").show();
+            }
+        });
+
+        $(".group_tr").on("click", function(event){
+            read($(event.currentTarget).data("tid"));
+        });
+
+
+
+    });
+
+    function onSearch(isPersonalSearch){
+        let jsonData = {};
+        if(isPersonalSearch){
+            jsonData.searchOption = $("select[name='search_select'] option:selected").val();
+            jsonData.searchValue = $("#search_personal_input").val();
+
+        }else{
+            jsonData.searchValue = $("#search_group_input").val();
+        }
+
+        console.log(JSON.stringify(jsonData));
+    }
+
+    function read(id){
+        $("#formInput").val(id);
+        $("#form").attr("action", "/account/read" );
+        $("#form").trigger("submit");
+
+    }
+
+
+
+</script>
+<div class="container-fluid">
+    <div class="row">
+        <div class="col-12">
+            <div class="mt-5 mb-5 text-center">
+                <h1>그룹 권한 관리</h1><form method="post" action="/account/create"><button class="btn btn-primary" type="submit" id="btn_create">생성</button></form>
+            </div>
+            <div>
+                <hr>
+            </div>
+        </div>
+    </div>
+    <div class="row">
+        <div class="col-12">
+            <div class="container">
+                <div class="row">
+                    <div class="col-12">
+                        <table class="table" >
+                            <thead class="table-dark">
+                            <tr><th>사번</th><th>사용자 명</th><th>활성 여부</th></tr>
+                            </thead>
+                            <tbody>
+                            <c:forEach items="${list }" var="dto" varStatus="status">
+                                <tr class="group_tr" data-tid="${dto.id}">
+                                    <td>${dto.employeeNumber}</td>
+                                    <td>${dto.name}</td>
+                                    <td>
+                                    <c:choose>
+                                        <c:when test="${dto.activation}">O</c:when>
+                                        <c:otherwise>X</c:otherwise>
+                                    </c:choose>
+                                    </td>
+                                </tr>
+                            </c:forEach>
+                            </tbody>
+                        </table>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+<form id="form" method="post">
+    <input name="id" id="formInput" hidden>
+</form>

src/main/webapp/WEB-INF/views/base/layout.jsp

@@ -23,7 +23,7 @@
 <!-- body -->
 <!-- 스크립트 부분 안건들여도됨-->
 <script>
-
+    let searchModalBootStrap;
     $(function(){
         //네비게이션 관련
         const $listNavLink = $("a.nav-link");
@@ -71,17 +71,11 @@
         */
         //yes no 모달 관련 끝
         //검색 팝업 모달 관련
-        const searchModalBootStrap = new bootstrap.Modal("#search_modal");
+        searchModalBootStrap = new bootstrap.Modal("#search_modal");
         $("#search_modal_show_button").on("click", function(){
             searchModalBootStrap.show();
         });
 
-        /*
-        * 검색 팝업 모달 닫는 함수
-        */
-        function hideSearchModal(){
-            searchModalBootStrap.hide();
-        }
 
 
         //검색 팝업 모달 관련 끝
@@ -90,6 +84,13 @@
         //네비게이션 쪽 아이콘만들어 주는 함수
         feather.replace();
     });
+    /*
+       * 검색 팝업 모달 닫는 함수
+       */
+    function hideSearchModal(){
+        searchModalBootStrap.hide();
+    }
+
     function yesNoModalTextDefine(title, body){
         yesNoModal.title = title;
         yesNoModal.body = body;

src/main/webapp/WEB-INF/views/modal/account.jsp

@@ -0,0 +1,31 @@
+<%@ page contentType="text/html; charset=UTF-8"%>
+<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
+<script>
+    function onButtonClick(tag){
+        const $tag = $(tag);
+        const id = $tag.data("tid");
+        const
+    }
+</script>
+<div class="container">
+    <div class="row">
+        <div class="col-12">
+            <table class="table" >
+                <thead class="table-dark">
+                <tr><th>번호</th><th>권한 명</th><th>선택</th></tr>
+                </thead>
+                <tbody>
+                <c:forEach items="${list }" var="dto" varStatus="status">
+                    <c:if test="${dto.isGroupAuthority == true and dto.activation == true}">
+                        <tr class="group_authority_tr">
+                            <td>${status.count}</td>
+                            <td>${dto.name}</td>
+                            <td><button data-tid="${dto.id}" data-tname="${dto.name}" class="btn-primary btn" onclick="onButtonClick(this)">선택</button></td>
+                        </tr>
+                    </c:if>
+                </c:forEach>
+                </tbody>
+            </table>
+        </div>
+    </div>
+</div>

src/main/webapp/WEB-INF/views/modal/auth.jsp

@@ -0,0 +1,49 @@
+<%@ page contentType="text/html; charset=UTF-8"%>
+<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
+<script>
+    function onSearchAuth(){
+        //
+    }
+
+    function onSelectAuth(tag){
+        const $tag = $(tag);
+        const tid = $tag.data('tid');
+        const name = $tag.data('tname');
+
+        $("#account_auth_group_name").val(name);
+        $("#groupAuthorityId").val(tid);
+        hideSearchModal();
+    }
+</script>
+<div class="container">
+    <div class="row">
+        <div class="col-12">
+            <div id="div_auth_search" class="text-end">
+                <select name="search_select" class="form-select d-inline w-10">
+                    <option selected value="10">10</option>
+                    <option value="20">20</option>
+                    <option value="30">30</option>
+                </select>
+                <input id="search_auth_input" type="text" class="w-30 d-inline form-control" placeholder="검색">
+                <button id="search_auth_btn" type="button" class="btn btn-primary" onclick="onSearchAuth()">검색</button>
+            </div>
+        </div>
+        <div class="col-12">
+            <table class="table">
+                <thead class="table-dark">
+                <tr><th>권한명</th><th></th></tr>
+                </thead>
+                <tbody>
+                <tr>
+                    <td>관리자</td>
+                    <td><button data-tid="1234" data-tname="관리자" class="btn btn-primary" onclick="onSelectAuth(this)">선택</button></td>
+                </tr>
+                <tr>
+                    <td>사원</td>
+                    <td><button data-tid="5678"data-tname="사원" class="btn btn-primary" onclick="onSelectAuth(this)">선택</button></td>
+                </tr>
+                </tbody>
+            </table>
+        </div>
+    </div>
+</div>