CodeSiri/Project

[Googoos🕊] 05. Spring | 회원 관리자 페이지 - 회원 권한 관리 & 회고 | MyBatis, SpringMVC

Dev다D 2021. 6. 12. 23:35
반응형
Googoos의 관리자 페이지 중 회원 관리를 구현했다.
관리자 페이지에서는 일반 회원을 정지 회원으로 변경할 수 있다.

 

01. memberMapper.xml 
<update id="disableMember" parameterType="java.util.HashMap">
    UPDATE member
    SET authority = 3
    WHERE authority = 1
</update>

 authority는 1 - 일반회원 , 2 - 관리자, 3 - 정지 회원으로 진행하였다. 따라서, 위와 같은 Mapper로 구현했다.

 

 

02. MemberRepository & MemberService
int disableMember(Map<String, String> disable);

 

 

03. MemberServiceImpl
@Override
public int disableMember(Map<String, String> disable) {
    return memberRepository.disableMember(disable);
}

 

04. MemberAdminController
package com.mygg.mygg.controller;

import com.mygg.mygg.service.MemberService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestParam;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpSession;
import java.util.Map;

@Controller
public class MemberAdminController {

    private final MemberService memberService;

    @Autowired
    public MemberAdminController(MemberService memberService) {
        this.memberService = memberService;
    }

    // Member List
    @GetMapping(value ={"/member/admin/{member_page}", "/member/admin"})
    public String memberList(@PathVariable(required = false) Integer member_page, Model model, HttpServletRequest request) {

        HttpSession httpSession = request.getSession();
        Double total = memberService.getTotal();
        int totalPage = (int) Math.ceil(total / 20);

        // "authority" 1 - 일반회원 2 - 운영자
        if ((int)httpSession.getAttribute("authority") != 2) {
            String referer = request.getHeader("Referer");
            return "redirect:" + referer;
        }

        if (member_page != null) {
            model.addAttribute("members", memberService.memberList((member_page - 1) * 10 * 2));
            model.addAttribute("totalPage", totalPage);
        } else {
            member_page = 1;
            model.addAttribute("members", memberService.memberList((member_page - 1) * 10 * 2));
            model.addAttribute("totalPage", totalPage);
        }
        return "/member/admin";
    }

    @PostMapping("/admin/update")
    public String disableMember(@RequestParam Map<String, String> disable) {
        memberService.disableMember(disable);
        return "redirect:/member/admin";
    }

}

 회원 권한 변경과 AdminPage의 페이징을 구현한다.

 

 

05. amdin.html
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.w3.org/1999/xhtml" xmlns:sec="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>어드민</title>
    <link rel="stylesheet" type="text/css" href="/css/header.css">
</head>
<script type="text/javascript" src="https://code.jquery.com/jquery-1.12.4.min.js" ></script>
<style>
    .table{
        border:1px solid;
        width: 1100px;
    }
    thead{
        border-bottom: 1px solid gray;
    }
    .member{
        border:1px solid;
    }
    .member:hover{
        transition: all 0.3s;
        background:#DED369;
    }
    #search{
        border:1px solid lightgray;
    }
    .container{
        display: flex;
        justify-content: center;
    }
    .memberCenter{
        text-align: center;
    }

</style>
<body>
<div th:replace="/fixed/header :: header"></div>
<h1>회원 목록 페이지</h1>
<hr>
<div class="container">
    <form action="/admin/update" method="POST">
        <table class="table" id="table">

            <thead>
            <tr>
                <th>id</th>
                <th>email</th>
                <th>name</th>
                <th>nickname</th>
                <th>phone_number</th>
                <th>gender</th>
                <th>age</th>
                <th>location</th>
                <th>authority</th>
                <th>정지 회원 처리</th>
            </tr>
            </thead>
            <tbody class="tbody" id="tbody">
            <tr th:each="member :${members}" class="member">
                <td th:text="${member.id}" class="memberCenter"></td>
                <td th:text="${member.email}" class="memberCenter"></td>
                <td th:text="${member.name}" class="memberCenter"></td>
                <td th:text="${member.nickname}" class="memberCenter"></td>
                <td th:text="${member.phone_number}" class="memberCenter"></td>
                <td th:text="${member.gender}" class="memberCenter"></td>
                <td th:text="${member.age}" class="memberCenter"></td>
                <td th:text="${member.location}" class="memberCenter"></td>
                <td th:text="${member.authority}" class="memberCenter"></td>
                <td><input type="submit" class="submit" id="submit" value="정지"></td>
            </tr>
            </tbody>
        </table>
    </form>
</div>

</body>
</html>

 

06. 테스트 확인

 

 

 authority가 1이고 정지 버튼을 누르면 3으로 변경된다. 다만, 2일 경우에는 관리자이므로 변경되지 않는다.

 

 

 

전체 소스코드는 GitHub 참고

 

codesiri/Googoos

Googoos🕊 | Final Project. Contribute to codesiri/Googoos development by creating an account on GitHub.

github.com

 

 

아주 짧은 회고

내가 담당하게 된 부분은 회원가입/로그인/로그아웃/관리자 권한 관리이다.

지난번 미니 프로젝트에서는 게시판 CRUD를 맡게 되어 이번에는 회원가입 Flow를 담당하고 싶어서 진행하게 됐다.

처음 회원가입 페이지를 만들 때 인풋 박스만 있는 CSS가 엉망진창인 것을 만들다 보니 당황스럽기도 하고 이게 맞나 싶기도 했다...

(디자인의 힘이란 정말 강력한 것 같다.)

회원가입이 진행되고 로그인/로그아웃을 만들 때는 정말 신기했다. 내가 구현을 했다니?라는 생각도 들고

또한 OAuth를 같이 진행하면서 구글 로그인도 진행해보았는데 생각보다 구현하기 쉬워서 놀랐다. (책을 읽으면서 해본 것이긴 하지만)

요즘 어떤 사이트를 가도 소셜 로그인이 있는데 이런 방식으로 구현한 것이구나!!!라고 깨달음을 얻었다.

회원 목록 페이지를 보면서 지난 회사에서 사용했던 회원 목록 페이지를 떠올리면서 만들었다.

어떤 회사를 다니고 무슨 직무에서 일을 하던 밑거름이 되어 어디서 쓰일지 모르니 항상 최선을 다하며 일해야겠다고 생각이 들었다 ㅋㅋㅋ 

 

반응형