カタカナに変更するときに入力値が異常になる問題の解決

src/main/java/com/example/rhizome/app/domain/service/impl/RegisterDepartmentImpl.java

@@ -0,0 +1,37 @@
+package com.example.rhizome.app.domain.service.impl;
+
+import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.stereotype.Service;
+import org.springframework.transaction.annotation.Transactional;
+
+import com.example.rhizome.app.domain.model.Department;
+import com.example.rhizome.app.domain.service.RegisterDepartment;
+import com.example.rhizome.app.infra.entity.DepartmentEntity;
+import com.example.rhizome.app.infra.repository.DepartmentRepository;
+
+/**
+ * department テーブルの登録系の機能を集約させるサービスクラスです。
+ */
+@Service
+@Transactional
+public class RegisterDepartmentImpl implements RegisterDepartment {
+
+	DepartmentRepository departmentRepository;
+
+	@Autowired
+	public RegisterDepartmentImpl(DepartmentRepository departmentRepository) {
+		this.departmentRepository = departmentRepository;
+	}
+
+	/**
+	 * department インスタンスの内容を登録する
+	 *
+	 * @param department 登録対象のデータ
+	 */
+
+	@Override
+	public void registerDepartment(Department department) {
+		// TODO 自動生成されたメソッド・スタブ
+		departmentRepository.save(DepartmentEntity.convertFrom(department));
+	}
+}

src/main/java/com/example/rhizome/app/presentation/controller/InsertDepartmentConfirmController.java

@@ -0,0 +1,132 @@
+package com.example.rhizome.app.presentation.controller;
+
+import static com.example.rhizome.app.presentation.controller.pageproperty.TransitionTargetPageNameKeyword.*;
+
+import java.util.List;
+import java.util.logging.Level;
+import java.util.logging.Logger;
+
+import javax.servlet.http.HttpSession;
+
+import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.stereotype.Controller;
+import org.springframework.ui.Model;
+import org.springframework.web.bind.annotation.ModelAttribute;
+import org.springframework.web.bind.annotation.RequestMapping;
+import org.springframework.web.bind.annotation.RequestMethod;
+
+import com.example.rhizome.aop.aspect.PermissionCheck;
+import com.example.rhizome.aop.aspect.SessionCheck;
+import com.example.rhizome.app.domain.model.Department;
+import com.example.rhizome.app.domain.model.SearchConditionDepartment;
+import com.example.rhizome.app.domain.service.SearchDepartment;
+import com.example.rhizome.app.domain.service.SearchEmployee;
+import com.example.rhizome.app.domain.service.impl.SearchDepartmentImpl;
+import com.example.rhizome.app.domain.service.impl.SearchEmployeeImpl;
+import com.example.rhizome.app.presentation.controller.pageproperty.PageReturnAttributeKeyword;
+import com.example.rhizome.app.presentation.controller.pageproperty.TransitionTargetPageNameKeyword;
+import com.example.rhizome.app.presentation.form.DepartmentForm;
+import com.example.rhizome.app.presentation.form.InsertDepartmentForm;
+import com.example.rhizome.app.presentation.form.MessageForm;
+
+/**
+ * 新規登録者情報チェック用のコントローラ
+ */
+@Controller
+public class InsertDepartmentConfirmController {
+
+	// ログ出力用インスタンス
+	private final static Logger LOGGER = Logger.getLogger(InsertDepartmentConfirmController.class.getName());
+
+	// エラーメッセージ用の定数フィールド
+	private final static String SEVERE_ERROR_MESSAGE = "エラーが発生しました！";
+
+	HttpSession httpSession;
+	SearchDepartment searchDepartment;
+	SearchEmployee searchEmployee;
+
+	@Autowired
+	public InsertDepartmentConfirmController(
+			HttpSession httpSession,
+			SearchDepartmentImpl searchDepartment,
+			SearchEmployeeImpl searchEmployee) {
+		this.httpSession = httpSession;
+		this.searchDepartment = searchDepartment;
+		this.searchEmployee = searchEmployee;
+	}
+
+	@ModelAttribute
+	public InsertDepartmentForm insertDepartmentForm() {
+		return new InsertDepartmentForm();
+	}
+
+	/**
+	 * 登録情報のチェックを行う
+	 *
+	 * @param insertDepartmentForm 登録情報
+	 * @param model              ビューにデータを渡すためのコンテナ
+	 * @return 遷移先の画面
+	 */
+	@PermissionCheck
+	@SessionCheck
+	@RequestMapping(value = INSERT_DEPARTMENT_CONFIRM, method = RequestMethod.POST)
+	public String insertEmployeeConfirm(InsertDepartmentForm insertDepartmentForm, Model model) {
+
+		try {
+			// 部署一覧を取得し、画面に返す用のクラスに詰め替える
+			// 作成した部署一覧をセット
+			model.addAttribute(
+					PageReturnAttributeKeyword.DEPARTMENT_FORM_LIST,
+					DepartmentForm.convertFrom(
+							searchDepartment.selectAll()));
+
+			// 登録用パラメータチェック
+			List<String> error = insertDepartmentForm.validateParameter();
+
+			// 入力内容に誤りがあるか
+			if (!error.isEmpty()) {
+				// 誤りがあった場合
+				// 誤りがあった箇所のエラーメッセージを表示
+				model.addAttribute(PageReturnAttributeKeyword.MESSAGE_ERROR,
+						new MessageForm(String.join(", ", error) + "が不正です。"));
+				// 画面に返す為の登録情報をセット
+				model.addAttribute(PageReturnAttributeKeyword.INSERT_DEPARTMENT_FORM, insertDepartmentForm);
+				// 登録画面に遷移
+				return TransitionTargetPageNameKeyword.INSERT_DEPARTMENT_INPUT_HTML;
+			}
+
+			final String DUPLICATION = "既に登録済みのメールアドレスです。";
+
+			// 登録対象のメールアドレスを元に検索
+			List<Department> departmetList = searchDepartment
+					.searchBy(new SearchConditionDepartment(null, insertDepartmentForm.getNmDepartment()));
+
+			// 検索結果があるか
+			if (!departmetList.isEmpty()) {
+				// 検索した結果0件ではない場合
+				// 重複を許さないため、エラー処理
+				model.addAttribute(PageReturnAttributeKeyword.MESSAGE_ERROR, new MessageForm(DUPLICATION));
+				// 画面に返す為の登録情報をセット
+				model.addAttribute(PageReturnAttributeKeyword.INSERT_DEPARTMENT_FORM, insertDepartmentForm);
+				// 登録画面に遷移
+				return TransitionTargetPageNameKeyword.INSERT_DEPARTMENT_INPUT_HTML;
+			}
+
+			// 登録確認ページに遷移
+			model.addAttribute(PageReturnAttributeKeyword.INSERT_DEPARTMENT_FORM, insertDepartmentForm);
+			// 登録確認画面に遷移
+			return TransitionTargetPageNameKeyword.INSERT_DEPARTMENT_CONFIRM_HTML;
+
+		} catch (Exception e) {
+			// ログイン情報の破棄
+			httpSession.invalidate();
+
+			e.printStackTrace();
+
+			// エラーログ出力
+			LOGGER.log(Level.SEVERE, SEVERE_ERROR_MESSAGE, e);
+			// エラー画面遷移
+			return TransitionTargetPageNameKeyword.ERROR_HTML;
+		}
+	}
+}

src/main/java/com/example/rhizome/app/presentation/controller/InsertDepartmentController.java

@@ -0,0 +1,146 @@
+package com.example.rhizome.app.presentation.controller;
+
+import static com.example.rhizome.app.presentation.controller.pageproperty.TransitionTargetPageNameKeyword.*;
+
+import java.util.ArrayList;
+import java.util.List;
+import java.util.logging.Level;
+import java.util.logging.Logger;
+
+import javax.servlet.http.HttpSession;
+
+import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.stereotype.Controller;
+import org.springframework.ui.Model;
+import org.springframework.web.bind.annotation.ModelAttribute;
+import org.springframework.web.bind.annotation.RequestMapping;
+import org.springframework.web.bind.annotation.RequestMethod;
+
+import com.example.rhizome.aop.aspect.PermissionCheck;
+import com.example.rhizome.aop.aspect.SessionCheck;
+import com.example.rhizome.app.domain.service.RegisterDepartment;
+import com.example.rhizome.app.domain.service.SearchDepartment;
+import com.example.rhizome.app.domain.service.impl.RegisterDepartmentImpl;
+import com.example.rhizome.app.domain.service.impl.SearchDepartmentImpl;
+import com.example.rhizome.app.presentation.controller.pageproperty.PageReturnAttributeKeyword;
+import com.example.rhizome.app.presentation.controller.pageproperty.TransitionTargetPageNameKeyword;
+import com.example.rhizome.app.presentation.form.DepartmentForm;
+import com.example.rhizome.app.presentation.form.InsertDepartmentForm;
+import com.example.rhizome.app.presentation.form.MessageForm;
+
+/**
+ * 新規登録用のコントローラ
+ */
+@Controller
+public class InsertDepartmentController {
+
+	// ログ出力用インスタンス
+	private final static Logger LOGGER = Logger.getLogger(InsertDepartmentController.class.getName());
+
+	// エラーメッセージ用の定数フィールド
+	private final static String SEVERE_ERROR_MESSAGE = "エラーが発生しました！";
+
+	HttpSession httpSession;
+	RegisterDepartment registerDepartment;
+	SearchDepartment searchDepartment;
+
+	@Autowired
+	public InsertDepartmentController(HttpSession httpSession, RegisterDepartmentImpl registerDepartment,
+			SearchDepartmentImpl searchDepartment) {
+		this.httpSession = httpSession;
+		this.registerDepartment = registerDepartment;
+		this.searchDepartment = searchDepartment;
+	}
+
+	@ModelAttribute
+	public InsertDepartmentForm insertDepartmentForm() {
+		return new InsertDepartmentForm();
+	}
+
+	/**
+	 * 新規登録画面表示処理
+	 *
+	 * @param insertEmployeeForm 登録情報
+	 * @param model              ビューにデータを渡すためのコンテナ
+	 * @return 遷移先の画面
+	 */
+	@PermissionCheck
+	@SessionCheck
+	@RequestMapping(value = INSERT_DEPARTMENT, method = RequestMethod.POST)
+	public String insertEmployee(InsertDepartmentForm insertDepartmentForm, Model model) {
+
+		try {
+			// 部署一覧を取得し、画面に返す用のクラスに詰め替える
+			// 作成した部署一覧をセット
+			model.addAttribute(
+					PageReturnAttributeKeyword.DEPARTMENT_FORM_LIST,
+					DepartmentForm.convertFrom(
+							searchDepartment.selectAll()));
+
+			// Confirm画面から渡ってきた値をチェック
+			List<String> error = validateParameter(
+					insertDepartmentForm.getNmDepartment());
+
+			// エラーが1件以上有る場合
+			if (!error.isEmpty()) {
+				// エラー内容を画面に表示
+				model.addAttribute(PageReturnAttributeKeyword.MESSAGE_ERROR,
+						new MessageForm(String.join(", ", error) + "が不正です。"));
+				// 登録画面に遷移
+				return TransitionTargetPageNameKeyword.INSERT_DEPARTMENT_INPUT_HTML;
+			}
+
+			// 登録処理
+			registerDepartment.registerDepartment(InsertDepartmentForm.convertTo(insertDepartmentForm));
+			// 登録結果画面に遷移
+			return TransitionTargetPageNameKeyword.INSERT_DEPARTMENT_RESULT_HTML;
+
+		} catch (Exception e) {
+			// ログイン情報の破棄
+			httpSession.invalidate();
+
+			e.printStackTrace();
+
+			// エラーログ出力
+			LOGGER.log(Level.SEVERE, SEVERE_ERROR_MESSAGE, e);
+			// エラー画面遷移
+			return TransitionTargetPageNameKeyword.ERROR_HTML;
+		}
+	}
+
+	/**
+	 * @param departmentName 登録対象の名前
+	 * @return エラーが有った場合はエラー文言、無ければ空のリストが返る
+	 */
+	private List<String> validateParameter(
+			String departmentName) {
+
+		final String DEPARTMENT_NAME_NULL_BLANK = "部署名";
+
+		List<String> error = new ArrayList<>();
+
+		// null or 空文字判定
+		if (isNullOrBlank(departmentName)) {
+			// エラー内容を追加
+			error.add(DEPARTMENT_NAME_NULL_BLANK);
+		}
+
+		return error;
+
+	}
+
+	/**
+	 * 仮引数を null or 空 判定する
+	 *
+	 * @param str 判定対象の文字列
+	 * @return true:null or 空 false:null or 空 では無い
+	 */
+	private static boolean isNullOrBlank(String str) {
+		if (null == str) {
+			return true;
+		}
+
+		return str.isBlank();
+	}
+
+}

src/main/java/com/example/rhizome/app/presentation/controller/InsertDepartmentInputController.java

@@ -0,0 +1,90 @@
+package com.example.rhizome.app.presentation.controller;
+
+import static com.example.rhizome.app.presentation.controller.pageproperty.TransitionTargetPageNameKeyword.*;
+
+import java.util.logging.Level;
+import java.util.logging.Logger;
+
+import javax.servlet.http.HttpSession;
+
+import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.stereotype.Controller;
+import org.springframework.ui.Model;
+import org.springframework.web.bind.annotation.ModelAttribute;
+import org.springframework.web.bind.annotation.RequestMapping;
+import org.springframework.web.bind.annotation.RequestMethod;
+
+import com.example.rhizome.aop.aspect.PermissionCheck;
+import com.example.rhizome.aop.aspect.SessionCheck;
+import com.example.rhizome.app.domain.service.RegisterEmployee;
+import com.example.rhizome.app.domain.service.SearchDepartment;
+import com.example.rhizome.app.presentation.controller.pageproperty.PageReturnAttributeKeyword;
+import com.example.rhizome.app.presentation.controller.pageproperty.TransitionTargetPageNameKeyword;
+import com.example.rhizome.app.presentation.form.DepartmentForm;
+import com.example.rhizome.app.presentation.form.InsertDepartmentForm;;
+
+/**
+ * 登録画面表示用コントローラ
+ */
+@Controller
+public class InsertDepartmentInputController {
+
+	// ログ出力用インスタンス
+	private final static Logger LOGGER = Logger.getLogger(InsertDepartmentInputController.class.getName());
+
+	// エラーメッセージ用の定数フィールド
+	private final static String SEVERE_ERROR_MESSAGE = "エラーが発生しました！";
+
+	HttpSession httpSession;
+	RegisterEmployee registerEmployee;
+	SearchDepartment searchDepartment;
+
+	@Autowired
+	public InsertDepartmentInputController(HttpSession httpSession, RegisterEmployee registerEmployee,
+			SearchDepartment searchDepartment) {
+		this.httpSession = httpSession;
+		this.registerEmployee = registerEmployee;
+		this.searchDepartment = searchDepartment;
+	}
+
+	@ModelAttribute
+	public InsertDepartmentForm insertEmployeeForm() {
+		return new InsertDepartmentForm();
+	}
+
+	/**
+	 * 登録画面表示処理
+	 *
+	 * @param insertEmployeeForm 登録画面のフォーム
+	 * @param model              ビューにデータを渡すためのコンテナ
+	 * @return 遷移先の画面
+	 */
+	@SessionCheck
+	@PermissionCheck
+	@RequestMapping(value = INSERT_DEPARTMENT_INPUT, method = RequestMethod.POST)
+	public String insertDepartmentInput(InsertDepartmentForm insertDepartmentForm, Model model) {
+
+		try {
+			// 部署コードリストを作成し、画面に返す値としてセット
+			model.addAttribute(PageReturnAttributeKeyword.DEPARTMENT_FORM_LIST,
+					DepartmentForm.convertFrom(searchDepartment.selectAll()));
+
+			// パラメータをセット
+			model.addAttribute(PageReturnAttributeKeyword.INSERT_DEPARTMENT_FORM, insertDepartmentForm);
+
+			// 登録画面に遷移
+			return TransitionTargetPageNameKeyword.INSERT_DEPARTMENT_INPUT_HTML;
+
+		} catch (Exception e) {
+			// ログイン情報の破棄
+			httpSession.invalidate();
+
+			e.printStackTrace();
+
+			// エラーログ出力
+			LOGGER.log(Level.SEVERE, SEVERE_ERROR_MESSAGE, e);
+			// エラー画面遷移
+			return TransitionTargetPageNameKeyword.ERROR_HTML;
+		}
+	}
+}

src/main/java/com/example/rhizome/app/presentation/controller/pageproperty/PageReturnAttributeKeyword.java

@@ -16,5 +16,6 @@ public class PageReturnAttributeKeyword {
 	public static final String UPDATE_PERSONAL_EMPLOYEE_USER_FORM = "updatePersonalEmployeeUserForm";
 	public static final String EMPLOYEE_INFO_FORM_LIST = "employeeInfoFormList";
 	public static final String UPDATE_DEPARTMENT_INFO_FORM = "updateDepartmentInfoForm";
+	public static final String INSERT_DEPARTMENT_FORM = "insertDepartmentForm";
 
 }

src/main/java/com/example/rhizome/app/presentation/controller/pageproperty/TransitionTargetPageNameKeyword.java

@@ -49,13 +49,17 @@ public class TransitionTargetPageNameKeyword {
 	// HTML
 	public static final String SELECT_DEPARTMENT_HTML = "selectDepartment";
 	public static final String UPDATE_DEPARTMENT_INPUT_HTML = "updateDepartmentInput";
+	public static final String INSERT_DEPARTMENT_INPUT_HTML = "insertDepartmentInput";
+	public static final String INSERT_DEPARTMENT_CONFIRM_HTML = "insertDepartmentConfirm";
+	public static final String INSERT_DEPARTMENT_RESULT_HTML = "insertDepartmentResult";
+
 	// Controller
 	public static final String SELECT_DEPARTMENT_INFO = "/selectDepartmentInfo";
 	public static final String SELECT_DEPARTMENT_INFO_FORM_EMPTY = "/departmentAll";
 	public static final String DELETE_DEPARTMENT = "/deleteDepartment";
-	public static final String INSERT_DEPARTMENT_INPUT = "/";
+	public static final String INSERT_DEPARTMENT_INPUT = "/insertDepartmentInput";
-	public static final String INSERT_DEPARTMENT_CONFIRM = "/";
+	public static final String INSERT_DEPARTMENT_CONFIRM = "/insertDepartmentConfirm";
-	public static final String INSERT_DEPARTMENT = "/";
+	public static final String INSERT_DEPARTMENT = "/insertDepartment";
 	public static final String SHOW_UPDATE_DAPERTMENT = "/showUpdateDepartment";
 	public static final String UPDATE_DEPARTMENT_RESULT = "/updateDepartmentResult";
 
@@ -85,7 +89,10 @@ public class TransitionTargetPageNameKeyword {
 				SELECT_DEPARTMENT_INFO_FORM_EMPTY,
 				DELETE_DEPARTMENT,
 				SHOW_UPDATE_DAPERTMENT,
-				UPDATE_DEPARTMENT_RESULT);
+				UPDATE_DEPARTMENT_RESULT,
+				INSERT_DEPARTMENT_INPUT,
+				INSERT_DEPARTMENT_CONFIRM,
+				INSERT_DEPARTMENT);
 	}
 
 	/**

src/main/java/com/example/rhizome/app/presentation/form/InsertDepartmentForm.java

@@ -0,0 +1,69 @@
+package com.example.rhizome.app.presentation.form;
+
+import java.util.ArrayList;
+import java.util.List;
+
+import com.example.rhizome.app.domain.model.Department;
+
+import lombok.AllArgsConstructor;
+import lombok.Data;
+import lombok.NoArgsConstructor;
+
+/**
+ * 画面から渡ってきた登録内容をまとめ、再度画面に表示する為のクラス
+ */
+@Data
+@AllArgsConstructor
+@NoArgsConstructor
+public class InsertDepartmentForm {
+
+	/**
+	 * 部署名
+	 */
+	private String nmDepartment;
+
+	/**
+	 * 仮引数を null or 空 判定する
+	 *
+	 * @param str 判定対象の文字列
+	 * @return true:null or 空 false:null or 空 では無い
+	 */
+	private static boolean isNullOrBlank(String str) {
+		if (null == str) {
+			return true;
+		}
+
+		return str.isBlank();
+	}
+
+	/**
+	 * 画面から渡ってきた登録内容をまとめ、ビジネスモデルに変換
+	 *
+	 * @param insertEmployeeForm 画面から渡ってきた登録内容
+	 * @return ビジネスモデルのインスタンス
+	 */
+	public static Department convertTo(InsertDepartmentForm InsertDepartmentForm) {
+		return new Department(
+				null,
+				InsertDepartmentForm.getNmDepartment());
+	}
+
+	/**
+	 * 登録データのValidationを行う
+	 *
+	 * @return エラーが有った場合はエラー文言、無ければ空のリストが返る
+	 */
+	public List<String> validateParameter() {
+		final String DEPARTMENT_NAME_NULL_BLANK = "部署名";
+
+		List<String> error = new ArrayList<>();
+
+		if (isNullOrBlank(nmDepartment)) {
+			error.add(DEPARTMENT_NAME_NULL_BLANK);
+		}
+
+		return error;
+
+	}
+
+}

src/main/resources/templates/insertDepartmentConfirm.html

@@ -0,0 +1,88 @@
+<!DOCTYPE html>
+<html xmlns:th="http://www.thymeleaf.org">
+
+<head>
+
+    <meta content="text/html; charset=UTF-8" http-equiv="Content-Type">
+    <!-- 外部のスクリプトファイルを読み込む -->
+    <script th:src="@{/js/common.js}"></script>
+    <!-- CSSの読み込み -->
+    <link rel="stylesheet" th:href="@{/css/all.css}">
+    <link rel=stylesheet th:href="@{/css/style.css}" type="text/css">
+    <title>登録内容確認</title>
+</head>
+
+<body>
+<h1>登録内容確認　　　
+    <div class="rightSection">
+        <span class="loginInfo">ログイン者名：<span th:text="${session.loginUser.nmEmployee}"></span></span>
+        <button class="logoutButton" onclick="logoutSubmit()">ログアウト</button>
+    </div>
+</h1>
+
+<form action="insertDepartment"
+      id="insertForm"
+      method="post"
+      th:object="${insertDepartmentForm}">
+
+    <div class="msgBox error" th:if="${messageError != null}">
+        <span class="error" th:each="message : ${messageError.message}" th:text="${message}"></span>
+    </div>
+    <table>
+        <tr>
+            <th class="header">部署ID</th>
+            <td>
+                <label>
+                    <input class="readOnly"
+                           name="idDepartment"
+                           readonly="readonly"
+                           type="text"
+                           value="自動で設定されます"/>
+                </label>
+            </td>
+        </tr>
+        <tr>
+            <th class="header">部署名</th>
+            <td>
+                <label>
+                    <input class="readOnly"
+                           name="nmDepartment"
+                           readonly="readonly"
+                           th:value="*{nmDepartment}"
+                           type="text"/>
+                </label>
+            </td>
+        </tr>
+
+        <tr>
+            <td class="btnArea" colspan="2">
+                <input type="submit" value="登録"/>
+            </td>
+        </tr>
+    </table>
+    <a href="javascript:onClickEdit()">登録内容の編集</a>　|　<a href="showMenu">メニューに戻る</a>
+</form>
+
+<script type="text/javascript">
+    function onClickEdit() {
+        const form = document.getElementById('insertForm');
+        form.setAttribute('method', 'post');
+        form.setAttribute('action', 'insertDepartmentInput');
+
+        // 確認画面から編集画面に戻ってきたときのフラグ（未使用）
+        const inputField = document.createElement("input");
+        inputField.setAttribute("type", "hidden");
+        inputField.setAttribute("name", "backFlg");
+        inputField.setAttribute("value", "edit");
+
+        form.appendChild(inputField);
+
+        // フォームをDOMに追加
+        document.body.appendChild(form);
+
+        form.submit();
+    }
+</script>
+
+</body>
+</html>

src/main/resources/templates/insertDepartmentInput.html

@@ -0,0 +1,67 @@
+<!DOCTYPE html>
+<html xmlns:th="http://www.thymeleaf.org">
+
+<head>
+
+    <meta content="text/html; charset=UTF-8" http-equiv="Content-Type">
+    <!-- 外部のスクリプトファイルを読み込む -->
+    <script th:src="@{/js/common.js}"></script>
+    <!-- CSSの読み込み -->
+    <link rel="stylesheet" th:href="@{/css/all.css}">
+    <link rel=stylesheet th:href="@{/css/style.css}" type="text/css">
+    <title>部署登録</title>
+</head>
+
+<body>
+<h1>
+    部署登録　　　
+    <div class="rightSection">
+        <span class="loginInfo">ログイン者名：<span th:text="${session.loginUser.nmEmployee}"></span></span>
+        <button class="logoutButton" onclick="logoutSubmit()">ログアウト</button>
+    </div>
+</h1>
+<form action="insertDepartmentConfirm"
+      method="post"
+      th:object="${insertDepartmentForm}">
+
+    <div class="msgBox error" th:if="${messageError} != null">
+        <span class="error" th:text="${messageError.message}"></span>
+    </div>
+
+    <table>
+        <tr>
+            <th class="header">部署ID</th>
+            <td>
+                <label>
+                    <input class="readOnly"
+                           readonly="readonly"
+                           type="text"
+                           value="自動で設定されます"
+                    />
+                </label>
+            </td>
+        </tr>
+        <tr>
+            <th class="header">部署名</th>
+            <td>
+                <label>
+                    <input maxlength="50"
+                           placeholder="部署名"
+                           required="required"
+                           th:field="*{nmDepartment}"
+                           type="text"
+                    />
+                </label>
+            </td>
+        </tr>
+
+        <tr>
+            <td class="btnArea" colspan="2">
+                <input type="submit" value="登録確認"/>
+            </td>
+        </tr>
+    </table>
+</form>
+<a href="showMenu">メニューに戻る</a>
+</body>
+</html>

src/main/resources/templates/insertDepartmentResult.html

@@ -0,0 +1,40 @@
+<!DOCTYPE html>
+<html xmlns:th="http://www.thymeleaf.org">
+
+<head>
+
+    <meta content="text/html; charset=UTF-8" http-equiv="Content-Type">
+    <!-- 外部のスクリプトファイルを読み込む -->
+    <script th:src="@{/js/common.js}"></script>
+    <!-- CSSの読み込み -->
+    <link rel="stylesheet" th:href="@{/css/all.css}">
+    <link rel=stylesheet th:href="@{/css/style.css}" type="text/css">
+    <title>社員登録完了</title>
+</head>
+
+<body>
+<h2>社員登録が完了しました</h2>
+<br/>
+<a href="javascript:insertSubmit()">続けて登録する</a>　|　<a href="showMenu">メニューに戻る</a>
+</body>
+<script type="text/javascript">
+    function insertSubmit() {
+        const form = document.createElement('form');
+        form.setAttribute('method', 'post');
+        form.setAttribute('action', 'insertDepartmentInput');
+
+        // 動的送信用のHidden
+        // 動的にFormを作成する場合は何かしら送信しないと、正しく動作しない
+        const inputField = document.createElement("input");
+        inputField.setAttribute("type", "hidden");
+        inputField.setAttribute("value", "select");
+
+        form.appendChild(inputField);
+
+        // フォームをDOMに追加
+        document.body.appendChild(form);
+
+        form.submit();
+    }
+</script>
+</html>

src/main/resources/templates/insertEmployeeInput.html

@@ -59,7 +59,7 @@
             <td>
                 <label>
                     <input maxlength="50"
-                           oninput="convertToKatakana(this)"
+                           onchange="convertToKatakana(this)"
                            placeholder="フリガナ"
                            required="required"
                            th:field="*{knEmployee}"

src/main/resources/templates/menu.html

@@ -39,7 +39,7 @@
     </tr>
 
     <tr>
-        <td><a class="menuClass" href="javascript:insertEmployeeSubmit()"><i class="fas fa-plus"></i> 部署登録 </a></td>
+        <td><a class="menuClass" href="javascript:insertDepartmentSubmit()"><i class="fas fa-plus"></i> 部署登録 </a></td>
         <td class="description">新規で部署追加を行います。</td>
     </tr>