2

book-rent/src/main/java/com/example/demo/controller/BookController.java

@@ -1,5 +1,6 @@
 package com.example.demo.controller;
 
+
 public class BookController {
 	
 }

book-rent/src/main/resources/templates/bookList.html

@@ -7,10 +7,15 @@
 </head>
 
 <body>
+	
+	<div th:replace="~{fragments/header :: header}"></div>
+	<main>
 	<form action="selectBook" method="post" th:object="${searchConditionBookForm}">
 		<div class="msgBox error" th:if="${messageError} != null">
 			<span class="error" th:text="${messageError.message}"></span>
 		</div>
+
+		<!--検索入力欄-->
 		<table>
 			<tr>
 				<th class="header">書籍名</th>
@@ -18,7 +23,11 @@
 			</tr>
 			<tr>
 				<th class="header">出版社</th>
-	            <td><!-- ★部署名の入力欄（type="text"）を作る --></td>
+				<td><input placeholder="出版社" th:field="*{publisher}" type="text"></td>
+			</tr>
+			<tr>
+				<th class="header">特記事項</th>
+				<td><input placeholder="特記事項" th:field="*{note}" type="text"></td>
 			</tr>
 			<tr>
 				<td class="btnArea" colspan="2"><input type="submit" value="検索" /></td>
@@ -26,13 +35,75 @@
 			</tr>
 		</table>
 	</form>
-	
+	<div class="header-spacing"></div>
 	<a href="showMenu">メニューに戻る</a>
+	<div class="header-spacing"></div>
 	<h1><span>検索結果</span></h1>
+	<div class="header-spacing"></div>
+	<th:block th:if="${messageInfo != null}">
+		<script th:inline="javascript">
+			alert([[${messageInfo.message}]]);
+		</script>
+	</th:block>
+	<div class="header-spacing"></div>
+	<th:block th:if="${employeeInfoFormList != null and employeeInfoFormList.size() > 0}">
 
 	<!-- ★検索結果が1件以上：表(部署ID・部署名)を th:each で繰り返す。変数は departmentFormList -->
+	<table class="table-grid table-striped table-hover">
+		<thead>
+			<tr>
+				<th>蔵書ID</th>				
+				<th>ISBN</th>
+				<th>書籍名</th>
+				<th>書籍名よみ</th>
+				<th>出版社</th>
+				<th>特記事項</th>
+				<th>操作</th>
+			</tr>
+		</thead>
+		<tbody>
+			<tr th:each="BookCollection : ${BookCollectionList}">
+				<td th:text="${BookCollection.idBook}"></td>
+				<td th:text="${BookCollection.isbn}"></td>
+				<td th:text="${BookCollection.nmBook}"></td>
+				<td th:text="${BookCollection.knBook}"></td>
+				<td th:text="${BookCollection.publisher}"></td>
+				<td th:text="${BookCollection.note}"></td>
+				<td th:text="${BookCollection.nmDepartment}"></td>
+				<td>
+				    <!-- 更新フォーム -->
+		            <form action="showUpdateEmployee" method="post" style="display: inline;">
+	                    <input name="idEmployee" th:value="${employeeInfoForm.idEmployee}" type="hidden">
+			            <input type="submit" value="更新">
+	                </form>
+		            <!-- 削除フォーム -->
+				    <form action="deleteEmployee" method="post" onsubmit="return confirm('本当に削除しますか？');"
+				                      style="display: inline;">
+				         <input name="idEmployee" th:value="${employeeInfoForm.idEmployee}" type="hidden">
+				         <input type="submit" value="削除">
+				    </form>
+				</td>
+			 </tr>
+	    </tbody>
+	</table>
+</th:block>
 	<!-- ★0件：「検索結果はありません。」を表示 -->
-
+	<th:block th:if="${employeeInfoFormList == null or employeeInfoFormList.size() == 0}">
+		検索結果はありません。
+	</th:block>
+	</main>
 </body>
+<script type="text/javascript">
+
+    function clearInput() {
+        document.getElementById('idEmployee').value = '';
+        document.getElementById('nmEmployee').value = '';
+        document.getElementById('knEmployee').value = '';
+        document.getElementById('mailAddress').value = '';
+        document.getElementById('idDepartment').selectedIndex = 0;
+    }
+
+
+</script>
 
 </html>