diff --git a/userBookRecord.html b/userBookRecord.html
new file mode 100644
index 0000000..8ac7744
--- /dev/null
+++ b/userBookRecord.html
@@ -0,0 +1,75 @@
+<!DOCTYPE html>
+<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
+<head th:replace="userCommon::common-header"></head>
+<body class="sb-nav-fixed">
+<nav th:replace="userCommon::common-navbar"></nav>
+<div id="layoutSidenav">
+    <div th:replace="userCommon::common-sidenav"></div>
+
+    <div id="layoutSidenav_content">
+        <main>
+            <div class="container-fluid px-4">
+                <h1 class="mt-4">预约记录</h1>
+
+                <ol class="breadcrumb mb-4">
+                    <li class="breadcrumb-item"><a th:href="@{/toUserMain}">主页</a></li>
+                    <li class="breadcrumb-item"><a th:href="@{/user/toUserBook}">预约信息</a></li>
+                    <li class="breadcrumb-item active">预约记录</li>
+                </ol>
+
+                <div class="card mb-4">
+                    <div class="card-header">
+                        <i class="fas fa-table me-1"></i>
+                        预约记录
+                    </div>
+                    <div class="card-body">
+                        <table id="datatablesSimple">
+                            <thead>
+                            <tr>
+                                <th>预约时间</th>
+                                <th>预约号</th>
+                                <th>器材</th>
+                                <th>时间</th>
+                                <th>地点</th>
+                                <th>操作</th>
+                            </tr>
+                            </thead>
+
+                            <tbody>
+                            <tr th:each="rec:${recordList}">
+                                <td th:text="${rec.date}">编号</td>
+                                <td th:text="${rec.recordId}">预约号</td>
+                                <td th:text="${rec.recordName}">器材</td>
+                                <td th:text="${rec.recordBegin}">时间</td>
+                                <td th:text="${rec.Location}">地点</td>
+                                <td>
+                                    <a th:href="@{/user/delUserRecord(recordId=${rec.recordId})}"
+                                       style="text-decoration: none">
+                                        <input type="button" class="btn btn-sm btn-outline-danger"
+                                               onclick="return del()" value="删除">
+                                    </a>
+                                </td>
+                            </tr>
+                            </tbody>
+                        </table>
+                    </div>
+                </div>
+            </div>
+        </main>
+        <footer th:replace="userCommon::common-footer"></footer>
+    </div>
+</div>
+
+<div th:include="userCommon::common-scripts"></div>
+<script>
+    function del() {
+        let msg = "确定要删除吗？";
+        if (confirm(msg) == true) {
+            return true;
+        } else {
+            return false;
+        }
+    }
+</script>
+</body>
+</html>
