From b36bce38e1ed18506eeeac779b1ee2c0b7df533a Mon Sep 17 00:00:00 2001
From: m-shimizu <26-m-e-stella-tecnica@it-college.jp>
Date: Wed, 21 Oct 2026 16:26:55 +0900
Subject: [PATCH] FR-09

---
 .../main/resources/templates/complete.html    |   2 +-
 .../templates/employeeRegistConfirm.html      |  99 +++++++-----
 .../templates/employeeRegistInput.html        | 152 ++++++++++++------
 3 files changed, 163 insertions(+), 90 deletions(-)

diff --git a/book-rent/src/main/resources/templates/complete.html b/book-rent/src/main/resources/templates/complete.html
index 9e84135..e597e2e 100644
--- a/book-rent/src/main/resources/templates/complete.html
+++ b/book-rent/src/main/resources/templates/complete.html
@@ -12,7 +12,7 @@
   <div class="info" th:text="${message} ?: '処理が完了しました。'"></div>
   <p>
     <a class="btn" th:href="@{${backUrl}}" th:text="${backLabel}">戻る</a>
-    <a class="btn sub" th:href="@{/menu}">メニューに戻る</a>
+<!--    <a class="btn sub" th:href="@{/menu}">メニューに戻る</a>-->
   </p>
 </main>
 </body>
diff --git a/book-rent/src/main/resources/templates/employeeRegistConfirm.html b/book-rent/src/main/resources/templates/employeeRegistConfirm.html
index 865f6c6..84cd239 100644
--- a/book-rent/src/main/resources/templates/employeeRegistConfirm.html
+++ b/book-rent/src/main/resources/templates/employeeRegistConfirm.html
@@ -1,16 +1,22 @@
+
 <!DOCTYPE html>
 <html xmlns:th="http://www.thymeleaf.org">
+
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>社員登録確認画面</title>
+    <title>社員登録確認</title>
     <link rel="stylesheet" th:href="@{/css/style.css}">
 </head>
+
 <body>
+
     <!-- 共通ヘッダー -->
     <div th:replace="~{fragments/header :: header}"></div>
+
     <main>
-        <h1>社員登録確認</h1>
+        <h2>社員登録確認</h2>
+
         <!-- エラーメッセージ -->
         <div class="error"
              th:if="${errors != null and !errors.isEmpty()}">
@@ -18,62 +24,77 @@
                th:text="${error}">
             </p>
         </div>
+
+        <!-- 登録内容確認 -->
         <div class="card">
+
             <p>以下の内容で登録します。内容を確認してください。</p>
-            <!-- 登録ボタン -->
+
             <form th:action="@{/admin/employees/new/execute}"
                   th:object="${form}"
                   method="post">
+
+                <!-- 登録内容一覧 -->
                 <table>
-                    <tr>
-                        <th>社員名</th>
-                        <td th:text="*{nmEmployee}"></td>
-                    </tr>
-                    <tr>
-                        <th>社員名よみ</th>
-                        <td th:text="*{knEmployee}"></td>
-                    </tr>
-                    <tr>
-                        <th>メールアドレス</th>
-                        <td th:text="*{mailAddress}"></td>
-                    </tr>
-                    <tr>
-                        <th>パスワード</th>
-                        <td>********</td>
-                    </tr>
-                    <tr>
-                        <th>権限</th>
-                        <td th:text="*{flgAdmin == '1' ? '管理者' : '一般'}"></td>
-                    </tr>
+                    <tbody>
+                        <tr>
+                            <th>社員名</th>
+                            <td th:text="*{nmEmployee}"></td>
+                        </tr>
+
+                        <tr>
+                            <th>社員名よみ</th>
+                            <td th:text="*{knEmployee}"></td>
+                        </tr>
+
+                        <tr>
+                            <th>メールアドレス</th>
+                            <td th:text="*{mailAddress}"></td>
+                        </tr>
+
+                        <tr>
+                            <th>パスワード</th>
+                            <td>********</td>
+                        </tr>
+
+                        <tr>
+                            <th>権限</th>
+                            <td th:text="*{flgAdmin == '1' ? '管理者' : '一般'}"></td>
+                        </tr>
+                    </tbody>
                 </table>
+
                 <!-- 登録処理に必要な値を引き継ぐ -->
                 <input type="hidden" th:field="*{nmEmployee}">
                 <input type="hidden" th:field="*{knEmployee}">
                 <input type="hidden" th:field="*{mailAddress}">
                 <input type="hidden" th:field="*{password}">
                 <input type="hidden" th:field="*{flgAdmin}">
-                <div class="actions">
+
+                <!-- ボタン：左に戻る、右に登録 -->
+                <div style="display: flex;
+                            justify-content: space-between;
+                            align-items: center;
+                            width: 100%;
+                            margin-top: 20px;">
+
+                    <!-- 社員情報入力に戻る -->
+                    <a class="btn sub"
+                       th:href="@{/admin/employees/new}">
+                        社員情報入力に戻る
+                    </a>
+
+                    <!-- 登録 -->
                     <button type="submit" class="btn">
                         登録
                     </button>
+
                 </div>
+
             </form>
-            <!-- 入力画面へ戻る -->
-            <form th:action="@{/admin/employees/new/input}"
-                  th:object="${form}"
-                  method="post">
-                <input type="hidden" th:field="*{nmEmployee}">
-                <input type="hidden" th:field="*{knEmployee}">
-                <input type="hidden" th:field="*{mailAddress}">
-                <input type="hidden" th:field="*{password}">
-                <input type="hidden" th:field="*{flgAdmin}">
-                <div class="back-link">
-                    <button type="submit" class="sub">
-                        社員情報入力に戻る
-                    </button>
-                </div>
-            </form>
+
         </div>
     </main>
+
 </body>
 </html>
\ No newline at end of file
diff --git a/book-rent/src/main/resources/templates/employeeRegistInput.html b/book-rent/src/main/resources/templates/employeeRegistInput.html
index d59be27..6a0d209 100644
--- a/book-rent/src/main/resources/templates/employeeRegistInput.html
+++ b/book-rent/src/main/resources/templates/employeeRegistInput.html
@@ -1,69 +1,121 @@
+
 <!DOCTYPE html>
 <html xmlns:th="http://www.thymeleaf.org">
+
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>社員登録画面</title>
+    <title>社員登録</title>
     <link rel="stylesheet" th:href="@{/css/style.css}">
 </head>
+
 <body>
+
     <!-- 共通ヘッダー -->
     <div th:replace="~{fragments/header :: header}"></div>
-    <!-- 社員登録入力画面 -->
+
     <main>
         <h2>社員登録</h2>
+
         <!-- 入力エラー表示 -->
-        <div th:if="${errors != null and !errors.isEmpty()}">
+        <div class="error"
+             th:if="${errors != null and !errors.isEmpty()}">
             <p th:each="error : ${errors}"
-               th:text="${error}"
-               class="error">
+               th:text="${error}">
             </p>
         </div>
-        <form th:action="@{/admin/employees/new/confirm}"
-              th:object="${form}"
-              method="post">
-            <div>
-                <label for="nmEmployee">社員名</label>
-                <input type="text"
-                       id="nmEmployee"
-                       th:field="*{nmEmployee}">
-            </div>
-            <div>
-                <label for="knEmployee">社員名よみ</label>
-                <input type="text"
-                       id="knEmployee"
-                       th:field="*{knEmployee}">
-            </div>
-            <div>
-                <label for="mailAddress">メールアドレス</label>
-                <input type="email"
-                       id="mailAddress"
-                       th:field="*{mailAddress}">
-            </div>
-            <div>
-                <label for="password">パスワード</label>
-                <input type="password"
-                       id="password"
-                       th:field="*{password}">
-            </div>
-            <fieldset>
-                <legend>権限</legend>
-                <label>
-                    <input type="radio"
-                           th:field="*{flgAdmin}"
-                           value="0">
-                    一般
-                </label>
-                <label>
-                    <input type="radio"
-                           th:field="*{flgAdmin}"
-                           value="1">
-                    管理者
-                </label>
-            </fieldset>
-            <button type="submit">登録確認</button>
-        </form>
-        <a th:href="@{/menu}">メニューへ戻る</a>
+
+        <!-- 社員登録フォーム -->
+        <div class="card">
+
+            <form th:action="@{/admin/employees/new/confirm}"
+                  th:object="${form}"
+                  method="post">
+
+                <!-- 社員名 -->
+                <div>
+                    <label for="nmEmployee">社員名</label>
+                    <input type="text"
+                           id="nmEmployee"
+                           th:field="*{nmEmployee}">
+                </div>
+
+                <!-- 社員名よみ -->
+                <div>
+                    <label for="knEmployee">社員名よみ</label>
+                    <input type="text"
+                           id="knEmployee"
+                           th:field="*{knEmployee}">
+                </div>
+
+                <!-- メールアドレス -->
+                <div>
+                    <label for="mailAddress">メールアドレス</label>
+                    <input type="email"
+                           id="mailAddress"
+                           th:field="*{mailAddress}">
+                </div>
+
+                <!-- パスワード -->
+                <div>
+                    <label for="password">パスワード</label>
+                    <input type="password"
+                           id="password"
+                           th:field="*{password}">
+                </div>
+
+                <!-- 権限：枠線なし・横並び -->
+                <div style="border: none;
+                            display: flex;
+                            flex-direction: row;
+                            align-items: center;
+                            gap: 25px;
+                            margin: 15px 0 25px;">
+
+                    <label style="display: inline-flex;
+                                  align-items: center;
+                                  gap: 5px;
+                                  white-space: nowrap;">
+                        <input type="radio"
+                               th:field="*{flgAdmin}"
+                               value="1">
+                        管理者
+                    </label>
+
+                    <label style="display: inline-flex;
+                                  align-items: center;
+                                  gap: 5px;
+                                  white-space: nowrap;">
+                        <input type="radio"
+                               th:field="*{flgAdmin}"
+                               value="0">
+                        一般ユーザー
+                    </label>
+
+                </div>
+
+                <!-- ボタン：左に戻る・右に確認 -->
+                <div style="display: flex;
+                            justify-content: space-between;
+                            align-items: center;
+                            width: 100%;
+                            margin-top: 20px;">
+
+                    <a class="btn sub"
+                       th:href="@{/menu}">
+                        メニューに戻る
+                    </a>
+
+                    <button type="submit" class="btn">
+                        確認
+                    </button>
+
+                </div>
+
+            </form>
+
+        </div>
     </main>
+
 </body>
 </html>
\ No newline at end of file