홈 화면 안내/공지 반응형 적용 회원가입 페이지 생성

src/main/java/com/example/ili_web/board/controller/BoardController.java

@@ -153,6 +153,13 @@ public class BoardController {
         return ResponseEntity.ok(boardService.updateComment(req));
     }
 
+    /**
+     * method -> getBoardChart
+     * description -> 관리자 페이지 게시판 차트 데이터
+     * @return -> List
+     * date -> 2024.03.28
+     * @author -> 김주한
+     **/
     @GetMapping("/board/chart")
     public ResponseEntity<List<Long>> getBoardChart() {
         return ResponseEntity.ok(boardService.getBoardChart());

src/main/java/com/example/ili_web/main/controller/MainController.java

@@ -89,16 +89,43 @@ public class MainController {
         return HTML_PATH + "contact-inner/logi-advice.html";
     }
 
+    /**
+     method -> admin
+     description -> 로그인 페이지
+     @author -> 김주한
+     @return -> html
+     date -> 2024.03.27
+     **/
     @GetMapping("/admin")
     public String admin () {
         log.info("========== Move to Admin ==========");
         return HTML_PATH + "admin/login.html";
     }
 
+    /**
+     method -> backOffice
+     description -> 관리자 페이지
+     @author -> 김주한
+     @return -> html
+     date -> 2024.03.27
+     **/
     @GetMapping("/admin/backoffice")
     public String backOffice () {
         log.info("========== Move to backOffice ==========");
         /*return HTML_PATH + "admin/backoffice.html";*/
         return HTML_PATH + "admin/backoffice.html";
     }
+
+    /**
+     method -> joinForm
+     description -> 회원가입 페이지
+     @author -> 김주한
+     @return -> html
+     date -> 2024.04.01
+     **/
+    @GetMapping("/join")
+    public String joinForm() {
+        log.info("========== Move to join ==========");
+        return HTML_PATH + "admin/join.html";
+    }
 }

src/main/java/com/example/ili_web/member/controller/MemberController.java

@@ -1,5 +1,6 @@
 package com.example.ili_web.member.controller;
 
+import com.example.ili_web.member.dto.JoinReq;
 import com.example.ili_web.member.dto.LoginReq;
 import com.example.ili_web.member.service.MemberService;
 import lombok.AllArgsConstructor;
@@ -7,6 +8,7 @@ import lombok.extern.slf4j.Slf4j;
 import org.springframework.http.ResponseEntity;
 import org.springframework.security.crypto.password.PasswordEncoder;
 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.RequestBody;
 
@@ -16,8 +18,10 @@ import org.springframework.web.bind.annotation.RequestBody;
 public class MemberController {
 
     private final MemberService memberService;
-    /*@PostMapping("/login")
-    public ResponseEntity login (@RequestBody LoginReq req) {
-        return memberService.login(req);
+
+
+    /*@PostMapping("/join")
+    public ResponseEntity join (@RequestBody JoinReq req) {
+        return memberService.join(req);
     }*/
 }

src/main/java/com/example/ili_web/member/dto/JoinReq.java

@@ -0,0 +1,16 @@
+package com.example.ili_web.member.dto;
+
+import lombok.Data;
+
+@Data
+public class JoinReq {
+    private String id;
+    private String password;
+    private String name;
+    private String email;
+    private String address;
+    private String role;
+    private String useYn;
+    private String regDt;
+    private String upDt;
+}

src/main/java/com/example/ili_web/member/service/MemberService.java

@@ -1,6 +1,7 @@
 package com.example.ili_web.member.service;
 
 import com.example.ili_web.member.domain.Member;
+import com.example.ili_web.member.dto.JoinReq;
 import com.example.ili_web.member.dto.LoginReq;
 import com.example.ili_web.member.repository.MemberRepository;
 import lombok.AllArgsConstructor;
@@ -29,4 +30,8 @@ public class MemberService {
             }
         }
     }
+
+    public ResponseEntity join(JoinReq req) {
+        return ResponseEntity.ok(null);
+    }
 }

src/main/resources/application.properties

@@ -1,5 +1,5 @@
 #spring.autoconfigure.exclude=org.springframework.boot.autoconfigure.jdbc.DataSourceAutoConfiguration,org.springframework.boot.autoconfigure.orm.jpa.HibernateJpaAutoConfiguration
-logging.level.org.springframework.web=TRACE
+logging.level.org.springframework.web=INFO
 #local
 spring.datasource.url=jdbc:mysql://103.55.191.37:3306/iliweb_test?rewriteBatchedStatements=true&profileSQL=true&logger=Slf4JLogger&maxQuerySizeToLog=999999
 #server

src/main/resources/static/js/admin/adminChart.js

@@ -43,4 +43,6 @@ async function getData() {
     return data;
 }
 
-drewChart();
+drewChart().catch(error => {
+    location.href = '/';
+});

src/main/resources/static/js/admin/login.js

@@ -1,11 +1,14 @@
 async function login () {
     const id = document.getElementById('member_id').value;
     const pw = document.getElementById('member_password').value;
-    const form = document.getElementById('loginForm');
+    const form = document.getElementById('login_form');
     if (id && pw) {
         form.submit();
     } else {
         alert('입력된 정보를 확인하세요.');
     }
+}
 
+function goToJoin () {
+    location.href = '/join';
 }

src/main/resources/static/js/contact/advice.js

@@ -101,7 +101,6 @@ function initFile(input) {
 
 async function bindDetail(id) {
     const data = await getDetail(id);
-    console.log(data.comment)
     if (data.comment != null) {
         data.content = `${data.content}\n\n\n----------답변----------\n\n\n${data.comment}`;
     }

src/main/resources/static/js/contact/getList.js

@@ -1,16 +1,17 @@
 async function getList(type, page) {
     try {
-        return await axios.post('/api/v1/board/list', {type , page, size : 5});
+        return await axios.post('/api/v1/board/list', {type, page, size: 5});
     } catch (e) {
 
     }
 }
 
-function goToDetail (title, userName, regDt, content) {
-    document.getElementById('nt_dt').innerHTML = `<strong>일시:</strong> ${regDt}`;
-    document.getElementById('nt_name').innerHTML = `<strong>작성자:</strong> ${userName}`;
-    document.getElementById('nt_title').innerHTML = `<strong>제목:</strong> ${title}`;
-    document.getElementById('nt_content').innerText = content;
+async function goToDetail(id) {
+    const data = await getDetail(id);
+    document.getElementById('nt_dt').innerHTML = `<strong>일시:</strong> ${data.regDt}`;
+    document.getElementById('nt_name').innerHTML = `<strong>작성자:</strong> ${data.userName}`;
+    document.getElementById('nt_title').innerHTML = `<strong>제목:</strong> ${data.title}`;
+    document.getElementById('nt_content').innerText = data.content;
 }
 
 document.addEventListener('DOMContentLoaded', async function () {

src/main/resources/static/js/contact/makeHtml.js

@@ -5,7 +5,7 @@ function makeTable(list, target, code) {
     for (let data of list) {
         html += '<tr>';
         html += `<td>${data.regDt}</td>`
-        html += code !== 'LG' ? `<td><a href="javascript:void(0);" onclick="goToDetail('${data.title}', '${data.userName}', '${data.regDt}', '${data.content}')">${data.title}</a></td>`
+        html += code !== 'LG' ? `<td><a href="javascript:void(0);" onclick="goToDetail('${data.id}', '${data.type}')">${data.title}</a></td>`
             : `<td><a href="javascript:void(0);" onclick="openModal('auth_modal', '${data.id}')">${data.title}</a></td>`
         html += `<td>${data.userName}</td>`
         html += '</tr>';

src/main/resources/templates/html/admin/join.html

@@ -0,0 +1,56 @@
+<!doctype html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <meta name="description" content="">
+    <meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
+    <meta name="generator" content="Hugo 0.84.0">
+    <title>(주)국제종합물류</title>
+
+    <link rel="canonical" href="https://getbootstrap.com/docs/5.0/examples/sign-in/">
+
+
+
+    <!-- Bootstrap core CSS -->
+    <link href="/css/login.css" rel="stylesheet">
+    <link href="/css/bootstrap.min.css" rel="stylesheet">
+
+</head>
+<body class="text-center">
+
+<main class="form-signin">
+    <form action="/login" method="post" enctype="multipart/form-data" id="join_form">
+        <img class="mb-4" src="/image/logo.png" alt="" width="200" height="57">
+        <h1 class="h3 mb-3 fw-normal">회원가입</h1>
+
+        <div class="form-floating">
+            <input type="email" class="form-control" id="member_id" placeholder="name@example.com" name="userId">
+            <label for="member_id">아이디</label>
+        </div>
+        <div class="form-floating">
+            <input type="password" class="form-control" id="member_password" placeholder="Password" name="password">
+            <label for="member_password">비밀번호</label>
+        </div>
+        <div class="form-floating">
+            <input type="password" class="form-control" id="member_name" placeholder="Password" name="password">
+            <label for="member_password">비밀번호</label>
+        </div>
+        <div class="form-floating">
+            <input type="password" class="form-control" id="member_email" placeholder="Password" name="password">
+            <label for="member_password">비밀번호</label>
+        </div>
+        <div class="form-floating">
+            <input type="password" class="form-control" id="member_address" placeholder="Password" name="password">
+            <label for="member_password">비밀번호</label>
+        </div>
+
+        <div class="form-floating" style="display: flex;justify-content: space-between;margin-top: 20px">
+            <button class="w-100 btn btn-lg btn-success" type="button" onclick="goToJoin()">가입신청</button>
+        </div>
+    </form>
+</main>
+</body>
+<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
+<script src="/js/admin/login.js"></script>
+</html>

src/main/resources/templates/html/admin/login.html

@@ -20,7 +20,7 @@
 <body class="text-center">
 
 <main class="form-signin">
-    <form action="/login" method="post" enctype="multipart/form-data" id="loginForm">
+    <form action="/login" method="post" enctype="multipart/form-data" id="login_form">
         <img class="mb-4" src="/image/logo.png" alt="" width="200" height="57">
         <h1 class="h3 mb-3 fw-normal">로그인</h1>
 
@@ -33,10 +33,10 @@
             <label for="member_password">비밀번호</label>
         </div>
 
-        <div class="checkbox mb-3">
-
+        <div class="form-floating" style="display: flex;justify-content: space-between;margin-top: 20px">
+            <button class="w-100 btn btn-lg btn-primary" type="button" onclick="login()">로그인</button>
+            <button class="w-100 btn btn-lg btn-success" type="button" onclick="goToJoin()">회원가입</button>
         </div>
-        <button class="w-100 btn btn-lg btn-primary" type="button" onclick="login()">Sign in</button>
     </form>
 </main>
 </body>

src/main/resources/templates/html/common/header.html

@@ -7,7 +7,7 @@
             <span class="navbar-toggler-icon"></span>
         </button>
         <div class="collapse navbar-collapse" id="navbarCollapse">
-            <ul class="navbar-nav me-auto mb-2 mb-md-0">
+            <ul class="navbar-nav me-auto mb-2 mb-lg-0">
                 <li class="nav-item">
                     <a aria-current="page" class="nav-link fw-bold text-dark" href="/about">회사소개</a>
                 </li>

src/main/resources/templates/html/contact-inner/logi-advice.html

@@ -97,7 +97,8 @@
             </div>
         </div>
         <div class="row" id="advice_detail" style="display: none">
-            <div class="container my-5">
+
+
                     <input type="hidden" name="type" value="LG">
                     <div class="row g-3">
                         <div class="col-md-6 form-floating h-3">

src/main/resources/templates/html/contact-inner/notice.html

@@ -8,7 +8,7 @@
     </div>
 </div>
 <!-- Grid -->
-<div class="row" style="height: 300px;">
+<div class="row" style="display: flex;">
     <!-- 왼쪽 영역: 문의 목록 표시 -->
     <div class="col-md-6">
         <h3 class="text-center">공지 목록</h3>
@@ -25,35 +25,26 @@
             </tbody>
         </table>
         <nav aria-label="Page navigation" id="page_tag">
-           <!-- <ul class="pagination justify-content-center">
-                <li class="page-item disabled">
-                    <a aria-disabled="true" class="page-link" href="#" tabindex="-1">Previous</a>
-                </li>
-                <li class="page-item"><a class="page-link" href="#">1</a></li>
-                <li class="page-item"><a class="page-link" href="#">2</a></li>
-                <li class="page-item"><a class="page-link" href="#">3</a></li>
-                <li class="page-item">
-                    <a class="page-link" href="#">Next</a>
-                </li>
-            </ul>-->
         </nav>
     </div>
     <!-- 오른쪽 영역: 문의 내용 표시 -->
     <div class="col-md-6">
         <h3 class="text-center">내용</h3>
         <div class="row">
-
-            <div class="col">
-                <!-- 일시, 제목, 작성자 표시 -->
-                <p id="nt_dt"></p>
-                <p id="nt_title"></p>
-                <p id="nt_name"></p>
-            </div>
-            <!-- 내용 표시 textarea -->
-            <div class="row">
-                <!-- 내용 표시 textarea -->
+            <div class="container my-5">
                 <div class="col">
-                    <textarea id="nt_content" class="form-control" rows="5" readonly placeholder="문의 내용을 여기에 표시합니다."></textarea>
+                    <!-- 일시, 제목, 작성자 표시 -->
+                    <p id="nt_dt"></p>
+                    <p id="nt_title"></p>
+                    <p id="nt_name"></p>
+                </div>
+                <!-- 내용 표시 textarea -->
+                <div class="row">
+                    <!-- 내용 표시 textarea -->
+                    <div class="col">
+                        <textarea class="form-control" id="nt_content" placeholder="문의 내용을 여기에 표시합니다." readonly
+                                  rows="5"></textarea>
+                    </div>
                 </div>
             </div>
         </div>