diff --git a/frontend/src/config/router.config.js b/frontend/src/config/router.config.js
index bf1af29..c806ee3 100644
--- a/frontend/src/config/router.config.js
+++ b/frontend/src/config/router.config.js
@@ -128,8 +128,53 @@ export const routerMap = [
       {
         path: '/help',
         name: 'help',
-        component: () => import(/* webpackChunkName: "help" */ '../views/help/Help'),
-        meta: { title: '帮助', icon: 'question-circle', permission: ['ADMIN', 'TEACHER'] }
+        component: PageView,
+        meta: { title: '帮助', icon: 'question-circle', permission: ['ADMIN', 'TEACHER'] },
+        redirect: 'help/general',
+        children: [
+          {
+            path: 'general',
+            name: 'helpGeneral',
+            component: () => import(/* webpackChunkName: "help" */ '../views/help/Help'),
+            meta: { title: '概述', permission: ['ADMIN', 'TEACHER'] }
+          },
+          {
+            path: 'user',
+            name: 'helpUser',
+            component: () => import(/* webpackChunkName: "help" */ '../views/help/User'),
+            meta: { title: '用户', permission: ['ADMIN', 'TEACHER'] }
+          },
+          {
+            path: 'dashboard',
+            name: 'helpDashboard',
+            component: () => import(/* webpackChunkName: "help" */ '../views/help/Dashboard'),
+            meta: { title: '预约概览', permission: ['ADMIN', 'TEACHER'] }
+          },
+          {
+            path: 'booking',
+            name: 'helpBooking',
+            component: () => import(/* webpackChunkName: "help" */ '../views/help/Booking'),
+            meta: { title: '预约管理', permission: ['ADMIN', 'TEACHER'] }
+          },
+          {
+            path: 'room',
+            name: 'helpRoom',
+            component: () => import(/* webpackChunkName: "help" */ '../views/help/Room'),
+            meta: { title: '房间管理', permission: ['ADMIN'] }
+          },
+          {
+            path: 'account',
+            name: 'helpAccount',
+            component: () => import(/* webpackChunkName: "help" */ '../views/help/Account'),
+            meta: { title: '用户管理', permission: ['ADMIN', 'TEACHER'] }
+          },
+          {
+            path: 'setting',
+            name: 'helpSetting',
+            component: () => import(/* webpackChunkName: "help" */ '../views/help/Setting'),
+            meta: { title: '设置', permission: ['ADMIN', 'TEACHER'] }
+          }
+        ]
       }
     ]
   },
diff --git a/frontend/src/views/help/Account.vue b/frontend/src/views/help/Account.vue
new file mode 100644
index 0000000..ff240e2
--- /dev/null
+++ b/frontend/src/views/help/Account.vue
@@ -0,0 +1,70 @@
+<template>
+  <a-card class="markdown-body">
+    <h3>1. 用户列表</h3>
+    <p><img
+      src='./img/账户管理0.png'
+      alt='账户管理0' referrerPolicy='no-referrer'/></p>
+    <p>该页面显示所有的用户信息</p>
+    <ol start=''>
+      <li>按照角色筛选<img
+        src='./img/账户管理1.png'
+        alt='账户管理1' referrerPolicy='no-referrer'/></li>
+      <li>排序<img
+        src='./img/账户管理2.png'
+        alt='账户管理2' referrerPolicy='no-referrer'/></li>
+      <li>按照用户ID、用户名、邮箱模糊搜索</li>
+    </ol>
+    <h3>2. 新建用户</h3>
+    <p><img
+      src='./img/账户管理3.png'
+      alt='账户管理3' referrerPolicy='no-referrer'/></p>
+    <ol start=''>
+      <li><p>用户名</p>
+        <p>不能重复，可以由数字，特殊字符，中文，英文组成</p>
+      </li>
+      <li><p>密码</p>
+        <blockquote><p>密码要求：</p>
+          <ol start=''>
+            <li>不能为纯数字密码</li>
+            <li>不能与用户名相似</li>
+            <li>不能小于8位</li>
+            <li>不能是常见密码</li>
+          </ol>
+          <p><a href='https://docs.djangoproject.com/en/2.1/topics/auth/passwords/#password-validation'>详情参考</a></p>
+        </blockquote>
+      </li>
+      <li><p>确认密码</p>
+        <p>与密码相同</p>
+      </li>
+      <li><p>角色</p>
+        <blockquote><p>管理员：拥有全部权限。</p>
+          <p>教师：能够添加学生，每次预约可以选择多个座位。</p>
+          <p>学生：普通权限，每次只能选择一个时间段。</p>
+        </blockquote>
+      </li>
+      <li><p>状态</p>
+        <p>有效、无效。标识该用户能不能登录。（无论是本系统还是微信小程序等）</p>
+      </li>
+      <li><p>邮箱</p>
+        <p>用户邮箱。</p>
+      </li>
+      <li><p>积分</p>
+        <p>用户的初始积分。大于0的正整数。</p>
+      </li>
+    </ol>
+    <h3>3. 用户编辑</h3>
+    <p><img
+      src='./img/账户管理4.png'
+      alt='账户管理4' referrerPolicy='no-referrer'/></p>
+  </a-card>
+</template>
+
+<script>
+export default {
+  name: 'Account'
+}
+</script>
+
+<style scoped>
+  @import "css/markdown.css";
+</style>
\ No newline at end of file
diff --git a/frontend/src/views/help/Booking.vue b/frontend/src/views/help/Booking.vue
new file mode 100644
index 0000000..5b8b778
--- /dev/null
+++ b/frontend/src/views/help/Booking.vue
@@ -0,0 +1,123 @@
+<template>
+  <a-card class="markdown-body">
+    <h3>1. 预约列表</h3>
+    <p><img
+      src='./img/预约管理0.png'
+      alt='预约管理0' referrerPolicy='no-referrer'/></p>
+    <p>该页面显示所有的预约记录</p>
+    <ol start=''>
+      <li><p>筛选</p>
+        <ol start=''>
+          <li>按照日期筛选<img
+            src='./img/预约管理1.png'
+            alt='预约管理1' referrerPolicy='no-referrer'/></li>
+          <li>按照预约开始结束时间筛选<img
+            src='./img/预约管理2.png'
+            alt='预约管理2' referrerPolicy='no-referrer'/></li>
+          <li>按照房间筛选<img
+            src='./img/预约管理3.png'
+            alt='预约管理3' referrerPolicy='no-referrer'/></li>
+          <li>按照状态筛选<img
+            src='./img/预约管理4.png'
+            alt='预约管理4' referrerPolicy='no-referrer'/></li>
+
+        </ol>
+      </li>
+      <li><p>排序<img
+        src='./img/预约管理5.png'
+        alt='预约管理5' referrerPolicy='no-referrer'/></p>
+      </li>
+      <li><p>按照预约ID、用户名、房间名、日期模糊搜索。</p>
+      </li>
+      <li><p>点击<code>重置</code>将所有筛选、排序、搜索条件清空。</p>
+      </li>
+      <li><p>点击<code>新建预约</code>，跳转到新建预约界面。</p>
+      </li>
+      <li><p>点击列表中<code>编辑</code>，跳转到该条预约的详情页面。</p>
+      </li>
+
+    </ol>
+    <h3>2. 预约详情</h3>
+    <p><img
+      src='./img/预约管理6.png'
+      alt='预约管理6' referrerPolicy='no-referrer'/></p>
+    <p><img
+      src='./img/预约管理7.png'
+      alt='预约管理7' referrerPolicy='no-referrer'/></p>
+    <ol start=''>
+      <li><p>预约信息</p>
+        <p>显示该条预约的详细信息。</p>
+        <blockquote><p>预约状态</p>
+          <ol start=''>
+            <li>正在申请</li>
+
+          </ol>
+          <p>预约申请已经提交到系统，但是系统还未确定是否有效。</p>
+          <ol start='2'>
+            <li>申请成功</li>
+
+          </ol>
+          <p>预约申请有效。</p>
+          <ol start='3'>
+            <li>申请失败</li>
+
+          </ol>
+          <p>预约申请与其他申请在时间上冲突，系统判定无效。（有消息队列确保申请顺序，<a href=''>FIFO</a>）</p>
+          <ol start='4'>
+            <li>被取消</li>
+
+          </ol>
+          <p>该预约申请被人为取消。</p>
+        </blockquote>
+      </li>
+      <li><p>取消预约</p>
+      </li>
+
+    </ol>
+    <p>填写取消原因，点击<code>取消预约</code>即可。</p>
+    <p><code>取消人</code>是当前登录用户。</p>
+    <p>该过程不可逆！！！</p>
+    <p><img
+      src='./img/预约管理8.png'
+      alt='预约管理8' referrerPolicy='no-referrer'/></p>
+    <h3>3. 新建预约</h3>
+    <p><img
+      src='./img/预约管理9.png'
+      alt='预约管理9' referrerPolicy='no-referrer'/></p>
+    <p>该界面主要用于教师选择多个座位给自己的学生。该座位可以由教师或者其学生签到签离。</p>
+    <ol start=''>
+      <li><p>房间</p>
+        <p>选择指定的房间。</p>
+      </li>
+      <li><p>日期</p>
+        <p>选择预约日期。受到设置中<code>提前预约时间</code>的限制。</p>
+      </li>
+      <li><p>开始时间</p>
+        <p>选择开始时间。受到设置中<code>开始时间</code>的限制。</p>
+      </li>
+      <li><p>结束时间</p>
+        <p>选择结束时间。受到设置中<code>结束时间</code>的限制。</p>
+      </li>
+      <li><p>座位</p>
+        <p>选择房间、日期、开始时间、结束时间后，会自动显示对应的座位状态。</p>
+        <p>白色方框是可选座位；红色方框是改时间端这个座位有占用的情况，所以不可选；蓝色方框是已选则的座位。</p>
+        <p>可以多选。</p>
+      </li>
+      <li><p>预约人</p>
+        <p>可以通过搜索关键字选择用户，但用户角色只能是教师。<img
+          src='./img/预约管理10.png'
+          alt='预约管理10' referrerPolicy='no-referrer'/></p>
+      </li>
+    </ol>
+  </a-card>
+</template>
+
+<script>
+export default {
+  name: 'Booking'
+}
+</script>
+
+<style scoped>
+  @import "css/markdown.css";
+</style>
\ No newline at end of file
diff --git a/frontend/src/views/help/Dashboard.vue b/frontend/src/views/help/Dashboard.vue
new file mode 100644
index 0000000..caebe1b
--- /dev/null
+++ b/frontend/src/views/help/Dashboard.vue
@@ -0,0 +1,62 @@
+<template>
+  <a-card class="markdown-body">
+    <h3>1. 全部房间概览</h3>
+    <p><img
+      src='./img/全部房间概览0.png'
+      alt='全部房间概览0' referrerPolicy='no-referrer'/></p>
+    <p>登陆后，该页面展示全部房间的预约状态</p>
+    <ol start=''>
+      <li>最上面是日期选择栏，可以前后跳转也可以点击中间的日期直接选择。<img
+        src='./img/全部房间概览1.png'
+        alt='全部房间概览1' referrerPolicy='no-referrer'/></li>
+      <li>中间的每个方块表示一个房间，第一行是房间名，第二行是这一天该房间预约的条数，剩余时间段百分比，点击即可进入该房间详细预约概览。</li>
+      <li>状态栏显示全部房间的预约条数与剩余时间段百分比，右侧有自动刷新选项，每分钟自动刷新一次。</li>
+
+    </ol>
+    <h3>2. 指定房间概览</h3>
+    <p><img
+      src='./img/指定房间概览0.png'
+      alt='指定房间概览0' referrerPolicy='no-referrer'/></p>
+    <ol start=''>
+      <li><p>最上面是日期选择栏，可以前后跳转也可以点击中间的日期直接选择。</p>
+      </li>
+      <li><p>中间是时间段选择表</p>
+        <ol start=''>
+          <li>横向表头是时间段，纵向表头是座位名</li>
+          <li>中间的白色方框代表可以选择的时间段；红色方框代表已经被预约的时间段，不可以选择；蓝色方框代表选择的时间段。</li>
+          <li>鼠标悬停红色方框会显示该时间段的预约信息。<img
+            src='./img/指定房间预约概览3.png'
+            alt='指定房间预约概览3' referrerPolicy='no-referrer'/></li>
+          <li>选择一个座位的两个白色方框，会自动选中两个中的所有连续方框。</li>
+          <li>一次只能选择一个座位的一个连续时间段。</li>
+
+        </ol>
+      </li>
+      <li><p>点击新建预约跳转到确认新建页面。</p>
+      </li>
+      <li><p>状态栏显示该房间的预约条数与剩余时间段百分比，右侧有自动刷新选项，每分钟自动刷新一次。</p>
+      </li>
+    </ol>
+    <h3>3. 新建预约</h3>
+    <p><img
+      src='./img/指定房间概览1.png'
+      alt='指定房间概览1' referrerPolicy='no-referrer'/></p>
+    <p>该页面显示预约的详情</p>
+    <p>选择预约人，可以输入预约人关键字进行查找</p>
+    <p>
+      <img
+        src='./img/指定房间概览2.png'
+        alt='指定房间概览2' referrerPolicy='no-referrer'/></p>
+    <p>点击提交申请</p>
+  </a-card>
+</template>
+
+<script>
+export default {
+  name: 'Dashboard'
+}
+</script>
+
+<style scoped>
+  @import "css/markdown.css";
+</style>
\ No newline at end of file
diff --git a/frontend/src/views/help/Help.vue b/frontend/src/views/help/Help.vue
index c44afcf..c2f07ac 100644
--- a/frontend/src/views/help/Help.vue
+++ b/frontend/src/views/help/Help.vue
@@ -1,19 +1,37 @@
 <template>
-  <page-layout title="帮助">
-  </page-layout>
+  <a-card class="markdown-body">
+    <p>这是山东大学（威海）机电与信息工程学院竞赛活动室预约系统的<code>管理后台</code>，网站管理员，活动室管理员，各竞赛指导教师可以登陆本系统，管理预约信息，房间信息，账户信息等。</p>
+    <p>指导教师</p>
+    <ul>
+      <li>袁灏</li>
+      <li>王文玉</li>
+      <li>姜斌</li>
+    </ul>
+    <p>开发人员</p>
+    <ul>
+      <li>张家豪 <a href='https://github.com/DavidZhang73'>GitHub</a></li>
+    </ul>
+    <p>技术栈</p>
+    <ul>
+      <li><a href='https://docs.djangoproject.com/'>Django</a></li>
+      <li><a href='https://cn.vuejs.org/'>Vue.js</a></li>
+    </ul>
+    <p>代码托管</p>
+    <ul>
+      <li><a href=''>GitHub</a></li>
+      <li><a href='http://git.davidz.cn/david/BookingService'>David-GitTea</a></li>
+    </ul>
+    <p>&nbsp;</p>
+  </a-card>
 </template>
 
 <script>
-import PageLayout from '../../components/page/PageLayout'
-
 export default {
   name: 'Help',
-  components: {
-    PageLayout
-  }
+  components: {}
 }
 </script>
 
-<style scoped lang="less">
-
+<style scoped>
+  @import "css/markdown.css";
 </style>
diff --git a/frontend/src/views/help/Room.vue b/frontend/src/views/help/Room.vue
new file mode 100644
index 0000000..a641761
--- /dev/null
+++ b/frontend/src/views/help/Room.vue
@@ -0,0 +1,41 @@
+<template>
+  <a-card class="markdown-body">
+    <h3>1. 房间列表</h3>
+    <p><img
+      src='./img/房间管理0.png'
+      alt='房间管理0' referrerPolicy='no-referrer'/></p>
+    <p>该页面显示所有的房间信息</p>
+    <p>点击<code>新建</code>，跳转到新建页面</p>
+    <p>点击列表中的<code>编辑</code>，跳转到该房间的编辑页面，点击<code>座位管理</code>，跳转到座位列表页面，点击<code>二维码</code>下载该房间的二维码</p>
+    <h3>2. 新建房间</h3>
+    <p><img
+      src='./img/房间管理1.png'
+      alt='房间管理1' referrerPolicy='no-referrer'/></p>
+    <h3>3. 编辑房间</h3>
+    <p><img
+      src='./img/房间管理2.png'
+      alt='房间管理2' referrerPolicy='no-referrer'/></p>
+    <h3>4. 座位列表</h3>
+    <p><img
+      src='./img/房间管理3.png'
+      alt='房间管理3' referrerPolicy='no-referrer'/></p>
+    <p>座位二维码样例</p>
+    <p><img
+      src='./img/seat.png'
+      alt='seat' referrerPolicy='no-referrer'/></p>
+    <p>房间二维码样例</p>
+    <p><img
+      src='./img/room.png'
+      alt='room' referrerPolicy='no-referrer'/></p>
+  </a-card>
+</template>
+
+<script>
+export default {
+  name: 'Room'
+}
+</script>
+
+<style scoped>
+  @import "css/markdown.css";
+</style>
\ No newline at end of file
diff --git a/frontend/src/views/help/Setting.vue b/frontend/src/views/help/Setting.vue
new file mode 100644
index 0000000..feff88a
--- /dev/null
+++ b/frontend/src/views/help/Setting.vue
@@ -0,0 +1,78 @@
+<template>
+  <a-card class="markdown-body">
+    <h3>1. 全局设置</h3>
+    <p>有两套主题，分别是</p>
+    <ul>
+      <li>Light</li>
+    </ul>
+    <p><img
+      src='./img/全局设置0.png'
+      alt='全局设置0' referrerPolicy='no-referrer'/></p>
+    <ul>
+      <li>Dark</li>
+    </ul>
+    <p><img
+      src='./img/全局设置1.png'
+      alt='全局设置1' referrerPolicy='no-referrer'/></p>
+    <h3>2. 用户设置</h3>
+    <p><img
+      src='./img/用户设置0.png'
+      alt='用户设置0' referrerPolicy='no-referrer'/></p>
+    <ol start=''>
+      <li>上传用户头像</li>
+    </ol>
+    <blockquote><p>头像要求：</p>
+      <ol start=''>
+        <li>常见图片格式 （<code>JPG</code>，<code>JPEG</code>，<code>GIF</code>，<code>PNG</code>，<code>BMP</code> 等，所有符合<code>image/*</code>的格式）
+        </li>
+        <li>文件大小小于10MB</li>
+      </ol>
+    </blockquote>
+    <ol start='2'>
+      <li>重置用户密码</li>
+    </ol>
+    <blockquote><p>密码要求：</p>
+      <ol start=''>
+        <li>不能为纯数字密码</li>
+        <li>不能与用户名相似</li>
+        <li>不能小于8位</li>
+        <li>不能是常见密码</li>
+      </ol>
+      <p><a href='https://docs.djangoproject.com/en/2.1/topics/auth/passwords/#password-validation'>详情参考</a></p>
+    </blockquote>
+    <h3>3. 预约设置</h3>
+    <p><img
+      src='./img/预约设置0.png'
+      alt='预约设置0' referrerPolicy='no-referrer'/></p>
+    <ol start=''>
+      <li><p>提前预约时间</p>
+        <p>指定本系统可以提前预约的最大时长，以天为单位，大于0的正整数。例如填写<code>30</code>天，即从今天起到第三十天均为可预约的日期。</p>
+      </li>
+      <li><p>预约间隔</p>
+        <p>每天可选时间段的最小间隔，可以为<code>30分钟</code>或<code>60分钟</code>。例如<code>30分钟</code>，即9点到9点30为一个最小时间段。</p>
+      </li>
+      <li><p>开始时间</p>
+        <p>即每天开始预约的时间。受到预约间隔选项的限制。</p>
+      </li>
+      <li><p>结束时间</p>
+        <p>即每天结束预约的时间。受到预约间隔选项的限制。</p>
+      </li>
+      <li><p>惩罚积分数</p>
+        <p>用户没能在预约的时间签到，或没有规定时间内签离时，扣除的积分数。大于0的正整数。</p>
+      </li>
+      <li><p>奖励积分数</p>
+        <p>用户在规定时间内签到，签离时奖励的积分数量。大于0的正整数。</p>
+      </li>
+    </ol>
+  </a-card>
+</template>
+
+<script>
+export default {
+  name: 'Setting'
+}
+</script>
+
+<style scoped>
+  @import "css/markdown.css";
+</style>
\ No newline at end of file
diff --git a/frontend/src/views/help/User.vue b/frontend/src/views/help/User.vue
new file mode 100644
index 0000000..4b3a043
--- /dev/null
+++ b/frontend/src/views/help/User.vue
@@ -0,0 +1,26 @@
+<template>
+  <a-card class="markdown-body">
+    <h2>1. 登陆</h2>
+    <p>
+      <img src='./img/登陆0.png' alt='登陆0' referrerPolicy='no-referrer'/></p>
+    <p>正确输入用户名和密码</p>
+    <p>
+      <img src='./img/登陆1.png' alt='登陆1' referrerPolicy='no-referrer'/></p>
+    <p>后台验证用户密码和权限</p>
+    <p>
+      <img src='./img/登陆2.png' alt='登陆2' referrerPolicy='no-referrer'/></p>
+    <h2>2. 登出</h2>
+    <p>
+      <img src='./img/登陆3.png' alt='登陆3' referrerPolicy='no-referrer'/></p>
+  </a-card>
+</template>
+
+<script>
+export default {
+  name: 'User'
+}
+</script>
+
+<style scoped>
+  @import "css/markdown.css";
+</style>
\ No newline at end of file
diff --git a/frontend/src/views/help/css/markdown.css b/frontend/src/views/help/css/markdown.css
new file mode 100644
index 0000000..210be4e
--- /dev/null
+++ b/frontend/src/views/help/css/markdown.css
@@ -0,0 +1,972 @@
+@font-face {
+  font-family: octicons-link;
+  src: url(data:font/woff;charset=utf-8;base64,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) format('woff');
+}
+
+.markdown-body .octicon {
+  display: inline-block;
+  fill: currentColor;
+  vertical-align: text-bottom;
+}
+
+.markdown-body .anchor {
+  float: left;
+  line-height: 1;
+  margin-left: -20px;
+  padding-right: 4px;
+}
+
+.markdown-body .anchor:focus {
+  outline: none;
+}
+
+.markdown-body h1 .octicon-link,
+.markdown-body h2 .octicon-link,
+.markdown-body h3 .octicon-link,
+.markdown-body h4 .octicon-link,
+.markdown-body h5 .octicon-link,
+.markdown-body h6 .octicon-link {
+  color: #1b1f23;
+  vertical-align: middle;
+  visibility: hidden;
+}
+
+.markdown-body h1:hover .anchor,
+.markdown-body h2:hover .anchor,
+.markdown-body h3:hover .anchor,
+.markdown-body h4:hover .anchor,
+.markdown-body h5:hover .anchor,
+.markdown-body h6:hover .anchor {
+  text-decoration: none;
+}
+
+.markdown-body h1:hover .anchor .octicon-link,
+.markdown-body h2:hover .anchor .octicon-link,
+.markdown-body h3:hover .anchor .octicon-link,
+.markdown-body h4:hover .anchor .octicon-link,
+.markdown-body h5:hover .anchor .octicon-link,
+.markdown-body h6:hover .anchor .octicon-link {
+  visibility: visible;
+}
+
+.markdown-body {
+  -ms-text-size-adjust: 100%;
+  -webkit-text-size-adjust: 100%;
+  color: #24292e;
+  line-height: 1.5;
+  font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  font-size: 16px;
+  line-height: 1.5;
+  word-wrap: break-word;
+}
+
+.markdown-body .pl-c {
+  color: #6a737d;
+}
+
+.markdown-body .pl-c1,
+.markdown-body .pl-s .pl-v {
+  color: #005cc5;
+}
+
+.markdown-body .pl-e,
+.markdown-body .pl-en {
+  color: #6f42c1;
+}
+
+.markdown-body .pl-s .pl-s1,
+.markdown-body .pl-smi {
+  color: #24292e;
+}
+
+.markdown-body .pl-ent {
+  color: #22863a;
+}
+
+.markdown-body .pl-k {
+  color: #d73a49;
+}
+
+.markdown-body .pl-pds,
+.markdown-body .pl-s,
+.markdown-body .pl-s .pl-pse .pl-s1,
+.markdown-body .pl-sr,
+.markdown-body .pl-sr .pl-cce,
+.markdown-body .pl-sr .pl-sra,
+.markdown-body .pl-sr .pl-sre {
+  color: #032f62;
+}
+
+.markdown-body .pl-smw,
+.markdown-body .pl-v {
+  color: #e36209;
+}
+
+.markdown-body .pl-bu {
+  color: #b31d28;
+}
+
+.markdown-body .pl-ii {
+  background-color: #b31d28;
+  color: #fafbfc;
+}
+
+.markdown-body .pl-c2 {
+  background-color: #d73a49;
+  color: #fafbfc;
+}
+
+.markdown-body .pl-c2:before {
+  content: "^M";
+}
+
+.markdown-body .pl-sr .pl-cce {
+  color: #22863a;
+  font-weight: 700;
+}
+
+.markdown-body .pl-ml {
+  color: #735c0f;
+}
+
+.markdown-body .pl-mh,
+.markdown-body .pl-mh .pl-en,
+.markdown-body .pl-ms {
+  color: #005cc5;
+  font-weight: 700;
+}
+
+.markdown-body .pl-mi {
+  color: #24292e;
+  font-style: italic;
+}
+
+.markdown-body .pl-mb {
+  color: #24292e;
+  font-weight: 700;
+}
+
+.markdown-body .pl-md {
+  background-color: #ffeef0;
+  color: #b31d28;
+}
+
+.markdown-body .pl-mi1 {
+  background-color: #f0fff4;
+  color: #22863a;
+}
+
+.markdown-body .pl-mc {
+  background-color: #ffebda;
+  color: #e36209;
+}
+
+.markdown-body .pl-mi2 {
+  background-color: #005cc5;
+  color: #f6f8fa;
+}
+
+.markdown-body .pl-mdr {
+  color: #6f42c1;
+  font-weight: 700;
+}
+
+.markdown-body .pl-ba {
+  color: #586069;
+}
+
+.markdown-body .pl-sg {
+  color: #959da5;
+}
+
+.markdown-body .pl-corl {
+  color: #032f62;
+  text-decoration: underline;
+}
+
+.markdown-body details {
+  display: block;
+}
+
+.markdown-body summary {
+  display: list-item;
+}
+
+.markdown-body a {
+  background-color: transparent;
+}
+
+.markdown-body a:active,
+.markdown-body a:hover {
+  outline-width: 0;
+}
+
+.markdown-body strong {
+  font-weight: inherit;
+  font-weight: bolder;
+}
+
+.markdown-body h1 {
+  font-size: 2em;
+  margin: .67em 0;
+}
+
+.markdown-body img {
+  border-style: none;
+}
+
+.markdown-body code,
+.markdown-body kbd,
+.markdown-body pre {
+  font-family: monospace, monospace;
+  font-size: 1em;
+}
+
+.markdown-body hr {
+  box-sizing: content-box;
+  height: 0;
+  overflow: visible;
+}
+
+.markdown-body input {
+  font: inherit;
+  margin: 0;
+}
+
+.markdown-body input {
+  overflow: visible;
+}
+
+.markdown-body [type=checkbox] {
+  box-sizing: border-box;
+  padding: 0;
+}
+
+.markdown-body * {
+  box-sizing: border-box;
+}
+
+.markdown-body input {
+  font-family: inherit;
+  font-size: inherit;
+  line-height: inherit;
+}
+
+.markdown-body a {
+  color: #0366d6;
+  text-decoration: none;
+}
+
+.markdown-body a:hover {
+  text-decoration: underline;
+}
+
+.markdown-body strong {
+  font-weight: 600;
+}
+
+.markdown-body hr {
+  background: transparent;
+  border: 0;
+  border-bottom: 1px solid #dfe2e5;
+  height: 0;
+  margin: 15px 0;
+  overflow: hidden;
+}
+
+.markdown-body hr:before {
+  content: "";
+  display: table;
+}
+
+.markdown-body hr:after {
+  clear: both;
+  content: "";
+  display: table;
+}
+
+.markdown-body table {
+  border-collapse: collapse;
+  border-spacing: 0;
+}
+
+.markdown-body td,
+.markdown-body th {
+  padding: 0;
+}
+
+.markdown-body details summary {
+  cursor: pointer;
+}
+
+.markdown-body h1,
+.markdown-body h2,
+.markdown-body h3,
+.markdown-body h4,
+.markdown-body h5,
+.markdown-body h6 {
+  margin-bottom: 0;
+  margin-top: 0;
+}
+
+.markdown-body h1 {
+  font-size: 32px;
+}
+
+.markdown-body h1,
+.markdown-body h2 {
+  font-weight: 600;
+}
+
+.markdown-body h2 {
+  font-size: 24px;
+}
+
+.markdown-body h3 {
+  font-size: 20px;
+}
+
+.markdown-body h3,
+.markdown-body h4 {
+  font-weight: 600;
+}
+
+.markdown-body h4 {
+  font-size: 16px;
+}
+
+.markdown-body h5 {
+  font-size: 14px;
+}
+
+.markdown-body h5,
+.markdown-body h6 {
+  font-weight: 600;
+}
+
+.markdown-body h6 {
+  font-size: 12px;
+}
+
+.markdown-body p {
+  margin-bottom: 10px;
+  margin-top: 0;
+}
+
+.markdown-body blockquote {
+  margin: 0;
+}
+
+.markdown-body ol,
+.markdown-body ul {
+  margin-bottom: 0;
+  margin-top: 0;
+  padding-left: 0;
+}
+
+.markdown-body ol ol,
+.markdown-body ul ol {
+  list-style-type: lower-roman;
+}
+
+.markdown-body ol ol ol,
+.markdown-body ol ul ol,
+.markdown-body ul ol ol,
+.markdown-body ul ul ol {
+  list-style-type: lower-alpha;
+}
+
+.markdown-body dd {
+  margin-left: 0;
+}
+
+.markdown-body code,
+.markdown-body pre {
+  font-family: SFMono-Regular, Consolas, Liberation Mono, Menlo, Courier, monospace;
+  font-size: 12px;
+}
+
+.markdown-body pre {
+  margin-bottom: 0;
+  margin-top: 0;
+}
+
+.markdown-body input::-webkit-inner-spin-button,
+.markdown-body input::-webkit-outer-spin-button {
+  -webkit-appearance: none;
+  appearance: none;
+  margin: 0;
+}
+
+.markdown-body .border {
+  border: 1px solid #e1e4e8 !important;
+}
+
+.markdown-body .border-0 {
+  border: 0 !important;
+}
+
+.markdown-body .border-bottom {
+  border-bottom: 1px solid #e1e4e8 !important;
+}
+
+.markdown-body .rounded-1 {
+  border-radius: 3px !important;
+}
+
+.markdown-body .bg-white {
+  background-color: #fff !important;
+}
+
+.markdown-body .bg-gray-light {
+  background-color: #fafbfc !important;
+}
+
+.markdown-body .text-gray-light {
+  color: #6a737d !important;
+}
+
+.markdown-body .mb-0 {
+  margin-bottom: 0 !important;
+}
+
+.markdown-body .my-2 {
+  margin-bottom: 8px !important;
+  margin-top: 8px !important;
+}
+
+.markdown-body .pl-0 {
+  padding-left: 0 !important;
+}
+
+.markdown-body .py-0 {
+  padding-bottom: 0 !important;
+  padding-top: 0 !important;
+}
+
+.markdown-body .pl-1 {
+  padding-left: 4px !important;
+}
+
+.markdown-body .pl-2 {
+  padding-left: 8px !important;
+}
+
+.markdown-body .py-2 {
+  padding-bottom: 8px !important;
+  padding-top: 8px !important;
+}
+
+.markdown-body .pl-3,
+.markdown-body .px-3 {
+  padding-left: 16px !important;
+}
+
+.markdown-body .px-3 {
+  padding-right: 16px !important;
+}
+
+.markdown-body .pl-4 {
+  padding-left: 24px !important;
+}
+
+.markdown-body .pl-5 {
+  padding-left: 32px !important;
+}
+
+.markdown-body .pl-6 {
+  padding-left: 40px !important;
+}
+
+.markdown-body .f6 {
+  font-size: 12px !important;
+}
+
+.markdown-body .lh-condensed {
+  line-height: 1.25 !important;
+}
+
+.markdown-body .text-bold {
+  font-weight: 600 !important;
+}
+
+.markdown-body:before {
+  content: "";
+  display: table;
+}
+
+.markdown-body:after {
+  clear: both;
+  content: "";
+  display: table;
+}
+
+.markdown-body > :first-child {
+  margin-top: 0 !important;
+}
+
+.markdown-body > :last-child {
+  margin-bottom: 0 !important;
+}
+
+.markdown-body a:not([href]) {
+  color: inherit;
+  text-decoration: none;
+}
+
+.markdown-body blockquote,
+.markdown-body dl,
+.markdown-body ol,
+.markdown-body p,
+.markdown-body pre,
+.markdown-body table,
+.markdown-body ul {
+  margin-bottom: 16px;
+  margin-top: 0;
+}
+
+.markdown-body hr {
+  background-color: #e1e4e8;
+  border: 0;
+  height: .25em;
+  margin: 24px 0;
+  padding: 0;
+}
+
+.markdown-body blockquote {
+  border-left: .25em solid #dfe2e5;
+  color: #6a737d;
+  padding: 0 1em;
+}
+
+.markdown-body blockquote > :first-child {
+  margin-top: 0;
+}
+
+.markdown-body blockquote > :last-child {
+  margin-bottom: 0;
+}
+
+.markdown-body kbd {
+  background-color: #fafbfc;
+  border: 1px solid #c6cbd1;
+  border-bottom-color: #959da5;
+  border-radius: 3px;
+  box-shadow: inset 0 -1px 0 #959da5;
+  color: #444d56;
+  display: inline-block;
+  font-size: 11px;
+  line-height: 10px;
+  padding: 3px 5px;
+  vertical-align: middle;
+}
+
+.markdown-body h1,
+.markdown-body h2,
+.markdown-body h3,
+.markdown-body h4,
+.markdown-body h5,
+.markdown-body h6 {
+  font-weight: 600;
+  line-height: 1.25;
+  margin-bottom: 16px;
+  margin-top: 24px;
+}
+
+.markdown-body h1 {
+  font-size: 2em;
+}
+
+.markdown-body h1,
+.markdown-body h2 {
+  border-bottom: 1px solid #eaecef;
+  padding-bottom: .3em;
+}
+
+.markdown-body h2 {
+  font-size: 1.5em;
+}
+
+.markdown-body h3 {
+  font-size: 1.25em;
+}
+
+.markdown-body h4 {
+  font-size: 1em;
+}
+
+.markdown-body h5 {
+  font-size: .875em;
+}
+
+.markdown-body h6 {
+  color: #6a737d;
+  font-size: .85em;
+}
+
+.markdown-body ol,
+.markdown-body ul {
+  padding-left: 2em;
+}
+
+.markdown-body ol ol,
+.markdown-body ol ul,
+.markdown-body ul ol,
+.markdown-body ul ul {
+  margin-bottom: 0;
+  margin-top: 0;
+}
+
+.markdown-body li {
+  word-wrap: break-all;
+}
+
+.markdown-body li > p {
+  margin-top: 16px;
+}
+
+.markdown-body li + li {
+  margin-top: .25em;
+}
+
+.markdown-body dl {
+  padding: 0;
+}
+
+.markdown-body dl dt {
+  font-size: 1em;
+  font-style: italic;
+  font-weight: 600;
+  margin-top: 16px;
+  padding: 0;
+}
+
+.markdown-body dl dd {
+  margin-bottom: 16px;
+  padding: 0 16px;
+}
+
+.markdown-body table {
+  display: block;
+  overflow: auto;
+  width: 100%;
+}
+
+.markdown-body table th {
+  font-weight: 600;
+}
+
+.markdown-body table td,
+.markdown-body table th {
+  border: 1px solid #dfe2e5;
+  padding: 6px 13px;
+}
+
+.markdown-body table tr {
+  background-color: #fff;
+  border-top: 1px solid #c6cbd1;
+}
+
+.markdown-body table tr:nth-child(2n) {
+  background-color: #f6f8fa;
+}
+
+.markdown-body img {
+  background-color: #fff;
+  box-sizing: content-box;
+  max-width: 100%;
+}
+
+.markdown-body img[align=right] {
+  padding-left: 20px;
+}
+
+.markdown-body img[align=left] {
+  padding-right: 20px;
+}
+
+.markdown-body code {
+  background-color: rgba(27, 31, 35, .05);
+  border-radius: 3px;
+  font-size: 85%;
+  margin: 0;
+  padding: .2em .4em;
+}
+
+.markdown-body pre {
+  word-wrap: normal;
+}
+
+.markdown-body pre > code {
+  background: transparent;
+  border: 0;
+  font-size: 100%;
+  margin: 0;
+  padding: 0;
+  white-space: pre;
+  word-break: normal;
+}
+
+.markdown-body .highlight {
+  margin-bottom: 16px;
+}
+
+.markdown-body .highlight pre {
+  margin-bottom: 0;
+  word-break: normal;
+}
+
+.markdown-body .highlight pre,
+.markdown-body pre {
+  background-color: #f6f8fa;
+  border-radius: 3px;
+  font-size: 85%;
+  line-height: 1.45;
+  overflow: auto;
+  padding: 16px;
+}
+
+.markdown-body pre code {
+  background-color: transparent;
+  border: 0;
+  display: inline;
+  line-height: inherit;
+  margin: 0;
+  max-width: auto;
+  overflow: visible;
+  padding: 0;
+  word-wrap: normal;
+}
+
+.markdown-body .commit-tease-sha {
+  color: #444d56;
+  display: inline-block;
+  font-family: SFMono-Regular, Consolas, Liberation Mono, Menlo, Courier, monospace;
+  font-size: 90%;
+}
+
+.markdown-body .blob-wrapper {
+  border-bottom-left-radius: 3px;
+  border-bottom-right-radius: 3px;
+  overflow-x: auto;
+  overflow-y: hidden;
+}
+
+.markdown-body .blob-wrapper-embedded {
+  max-height: 240px;
+  overflow-y: auto;
+}
+
+.markdown-body .blob-num {
+  -moz-user-select: none;
+  -ms-user-select: none;
+  -webkit-user-select: none;
+  color: rgba(27, 31, 35, .3);
+  cursor: pointer;
+  font-family: SFMono-Regular, Consolas, Liberation Mono, Menlo, Courier, monospace;
+  font-size: 12px;
+  line-height: 20px;
+  min-width: 50px;
+  padding-left: 10px;
+  padding-right: 10px;
+  text-align: right;
+  user-select: none;
+  vertical-align: top;
+  white-space: nowrap;
+  width: 1%;
+}
+
+.markdown-body .blob-num:hover {
+  color: rgba(27, 31, 35, .6);
+}
+
+.markdown-body .blob-num:before {
+  content: attr(data-line-number);
+}
+
+.markdown-body .blob-code {
+  line-height: 20px;
+  padding-left: 10px;
+  padding-right: 10px;
+  position: relative;
+  vertical-align: top;
+}
+
+.markdown-body .blob-code-inner {
+  color: #24292e;
+  font-family: SFMono-Regular, Consolas, Liberation Mono, Menlo, Courier, monospace;
+  font-size: 12px;
+  overflow: visible;
+  white-space: pre;
+  word-wrap: normal;
+}
+
+.markdown-body .pl-token.active,
+.markdown-body .pl-token:hover {
+  background: #ffea7f;
+  cursor: pointer;
+}
+
+.markdown-body kbd {
+  background-color: #fafbfc;
+  border: 1px solid #d1d5da;
+  border-bottom-color: #c6cbd1;
+  border-radius: 3px;
+  box-shadow: inset 0 -1px 0 #c6cbd1;
+  color: #444d56;
+  display: inline-block;
+  font: 11px SFMono-Regular, Consolas, Liberation Mono, Menlo, Courier, monospace;
+  line-height: 10px;
+  padding: 3px 5px;
+  vertical-align: middle;
+}
+
+.markdown-body :checked + .radio-label {
+  border-color: #0366d6;
+  position: relative;
+  z-index: 1;
+}
+
+.markdown-body .tab-size[data-tab-size="1"] {
+  -moz-tab-size: 1;
+  tab-size: 1;
+}
+
+.markdown-body .tab-size[data-tab-size="2"] {
+  -moz-tab-size: 2;
+  tab-size: 2;
+}
+
+.markdown-body .tab-size[data-tab-size="3"] {
+  -moz-tab-size: 3;
+  tab-size: 3;
+}
+
+.markdown-body .tab-size[data-tab-size="4"] {
+  -moz-tab-size: 4;
+  tab-size: 4;
+}
+
+.markdown-body .tab-size[data-tab-size="5"] {
+  -moz-tab-size: 5;
+  tab-size: 5;
+}
+
+.markdown-body .tab-size[data-tab-size="6"] {
+  -moz-tab-size: 6;
+  tab-size: 6;
+}
+
+.markdown-body .tab-size[data-tab-size="7"] {
+  -moz-tab-size: 7;
+  tab-size: 7;
+}
+
+.markdown-body .tab-size[data-tab-size="8"] {
+  -moz-tab-size: 8;
+  tab-size: 8;
+}
+
+.markdown-body .tab-size[data-tab-size="9"] {
+  -moz-tab-size: 9;
+  tab-size: 9;
+}
+
+.markdown-body .tab-size[data-tab-size="10"] {
+  -moz-tab-size: 10;
+  tab-size: 10;
+}
+
+.markdown-body .tab-size[data-tab-size="11"] {
+  -moz-tab-size: 11;
+  tab-size: 11;
+}
+
+.markdown-body .tab-size[data-tab-size="12"] {
+  -moz-tab-size: 12;
+  tab-size: 12;
+}
+
+.markdown-body .task-list-item {
+  list-style-type: none;
+}
+
+.markdown-body .task-list-item + .task-list-item {
+  margin-top: 3px;
+}
+
+.markdown-body .task-list-item input {
+  margin: 0 .2em .25em -1.6em;
+  vertical-align: middle;
+}
+
+.markdown-body hr {
+  border-bottom-color: #eee;
+}
+
+.markdown-body .pl-0 {
+  padding-left: 0 !important;
+}
+
+.markdown-body .pl-1 {
+  padding-left: 4px !important;
+}
+
+.markdown-body .pl-2 {
+  padding-left: 8px !important;
+}
+
+.markdown-body .pl-3 {
+  padding-left: 16px !important;
+}
+
+.markdown-body .pl-4 {
+  padding-left: 24px !important;
+}
+
+.markdown-body .pl-5 {
+  padding-left: 32px !important;
+}
+
+.markdown-body .pl-6 {
+  padding-left: 40px !important;
+}
+
+.markdown-body .pl-7 {
+  padding-left: 48px !important;
+}
+
+.markdown-body .pl-8 {
+  padding-left: 64px !important;
+}
+
+.markdown-body .pl-9 {
+  padding-left: 80px !important;
+}
+
+.markdown-body .pl-10 {
+  padding-left: 96px !important;
+}
+
+.markdown-body .pl-11 {
+  padding-left: 112px !important;
+}
+
+.markdown-body .pl-12 {
+  padding-left: 128px !important;
+}
+
+/* custom */
+.markdown-body img {
+  margin: 0;
+  padding: 0;
+  display: block;
+  width: 80%;
+}
+
+@media (max-width: 767px) {
+  .markdown-body img {
+    width: 100%;
+  }
+}
+
diff --git a/frontend/src/views/help/img/room.png b/frontend/src/views/help/img/room.png
new file mode 100644
index 0000000..922b4c6
Binary files /dev/null and b/frontend/src/views/help/img/room.png differ
diff --git a/frontend/src/views/help/img/seat.png b/frontend/src/views/help/img/seat.png
new file mode 100644
index 0000000..4b38105
Binary files /dev/null and b/frontend/src/views/help/img/seat.png differ
diff --git a/frontend/src/views/help/img/全局设置0.png b/frontend/src/views/help/img/全局设置0.png
new file mode 100644
index 0000000..9901e60
Binary files /dev/null and b/frontend/src/views/help/img/全局设置0.png differ
diff --git a/frontend/src/views/help/img/全局设置1.png b/frontend/src/views/help/img/全局设置1.png
new file mode 100644
index 0000000..53dd7d5
Binary files /dev/null and b/frontend/src/views/help/img/全局设置1.png differ
diff --git a/frontend/src/views/help/img/全部房间概览0.png b/frontend/src/views/help/img/全部房间概览0.png
new file mode 100644
index 0000000..70c860d
Binary files /dev/null and b/frontend/src/views/help/img/全部房间概览0.png differ
diff --git a/frontend/src/views/help/img/全部房间概览1.png b/frontend/src/views/help/img/全部房间概览1.png
new file mode 100644
index 0000000..91cdc0b
Binary files /dev/null and b/frontend/src/views/help/img/全部房间概览1.png differ
diff --git a/frontend/src/views/help/img/房间管理0.png b/frontend/src/views/help/img/房间管理0.png
new file mode 100644
index 0000000..7bba9fc
Binary files /dev/null and b/frontend/src/views/help/img/房间管理0.png differ
diff --git a/frontend/src/views/help/img/房间管理1.png b/frontend/src/views/help/img/房间管理1.png
new file mode 100644
index 0000000..1dfd276
Binary files /dev/null and b/frontend/src/views/help/img/房间管理1.png differ
diff --git a/frontend/src/views/help/img/房间管理2.png b/frontend/src/views/help/img/房间管理2.png
new file mode 100644
index 0000000..a3766d0
Binary files /dev/null and b/frontend/src/views/help/img/房间管理2.png differ
diff --git a/frontend/src/views/help/img/房间管理3.png b/frontend/src/views/help/img/房间管理3.png
new file mode 100644
index 0000000..ebd6fcc
Binary files /dev/null and b/frontend/src/views/help/img/房间管理3.png differ
diff --git a/frontend/src/views/help/img/指定房间概览0.png b/frontend/src/views/help/img/指定房间概览0.png
new file mode 100644
index 0000000..4812fce
Binary files /dev/null and b/frontend/src/views/help/img/指定房间概览0.png differ
diff --git a/frontend/src/views/help/img/指定房间概览1.png b/frontend/src/views/help/img/指定房间概览1.png
new file mode 100644
index 0000000..a34a3f2
Binary files /dev/null and b/frontend/src/views/help/img/指定房间概览1.png differ
diff --git a/frontend/src/views/help/img/指定房间概览2.png b/frontend/src/views/help/img/指定房间概览2.png
new file mode 100644
index 0000000..191d4fd
Binary files /dev/null and b/frontend/src/views/help/img/指定房间概览2.png differ
diff --git a/frontend/src/views/help/img/指定房间预约概览3.png b/frontend/src/views/help/img/指定房间预约概览3.png
new file mode 100644
index 0000000..2c03ec7
Binary files /dev/null and b/frontend/src/views/help/img/指定房间预约概览3.png differ
diff --git a/frontend/src/views/help/img/用户设置0.png b/frontend/src/views/help/img/用户设置0.png
new file mode 100644
index 0000000..92a1bb8
Binary files /dev/null and b/frontend/src/views/help/img/用户设置0.png differ
diff --git a/frontend/src/views/help/img/登陆0.png b/frontend/src/views/help/img/登陆0.png
new file mode 100644
index 0000000..9e0c92b
Binary files /dev/null and b/frontend/src/views/help/img/登陆0.png differ
diff --git a/frontend/src/views/help/img/登陆1.png b/frontend/src/views/help/img/登陆1.png
new file mode 100644
index 0000000..c4efb9c
Binary files /dev/null and b/frontend/src/views/help/img/登陆1.png differ
diff --git a/frontend/src/views/help/img/登陆2.png b/frontend/src/views/help/img/登陆2.png
new file mode 100644
index 0000000..30f5f6f
Binary files /dev/null and b/frontend/src/views/help/img/登陆2.png differ
diff --git a/frontend/src/views/help/img/登陆3.png b/frontend/src/views/help/img/登陆3.png
new file mode 100644
index 0000000..61f8866
Binary files /dev/null and b/frontend/src/views/help/img/登陆3.png differ
diff --git a/frontend/src/views/help/img/账户管理0.png b/frontend/src/views/help/img/账户管理0.png
new file mode 100644
index 0000000..990ec3f
Binary files /dev/null and b/frontend/src/views/help/img/账户管理0.png differ
diff --git a/frontend/src/views/help/img/账户管理1.png b/frontend/src/views/help/img/账户管理1.png
new file mode 100644
index 0000000..85c0be5
Binary files /dev/null and b/frontend/src/views/help/img/账户管理1.png differ
diff --git a/frontend/src/views/help/img/账户管理2.png b/frontend/src/views/help/img/账户管理2.png
new file mode 100644
index 0000000..c3145cf
Binary files /dev/null and b/frontend/src/views/help/img/账户管理2.png differ
diff --git a/frontend/src/views/help/img/账户管理3.png b/frontend/src/views/help/img/账户管理3.png
new file mode 100644
index 0000000..6bab92f
Binary files /dev/null and b/frontend/src/views/help/img/账户管理3.png differ
diff --git a/frontend/src/views/help/img/账户管理4.png b/frontend/src/views/help/img/账户管理4.png
new file mode 100644
index 0000000..7090d78
Binary files /dev/null and b/frontend/src/views/help/img/账户管理4.png differ
diff --git a/frontend/src/views/help/img/预约管理0.png b/frontend/src/views/help/img/预约管理0.png
new file mode 100644
index 0000000..3ca51b0
Binary files /dev/null and b/frontend/src/views/help/img/预约管理0.png differ
diff --git a/frontend/src/views/help/img/预约管理1.png b/frontend/src/views/help/img/预约管理1.png
new file mode 100644
index 0000000..3b3691d
Binary files /dev/null and b/frontend/src/views/help/img/预约管理1.png differ
diff --git a/frontend/src/views/help/img/预约管理10.png b/frontend/src/views/help/img/预约管理10.png
new file mode 100644
index 0000000..acf0b75
Binary files /dev/null and b/frontend/src/views/help/img/预约管理10.png differ
diff --git a/frontend/src/views/help/img/预约管理2.png b/frontend/src/views/help/img/预约管理2.png
new file mode 100644
index 0000000..858a81b
Binary files /dev/null and b/frontend/src/views/help/img/预约管理2.png differ
diff --git a/frontend/src/views/help/img/预约管理3.png b/frontend/src/views/help/img/预约管理3.png
new file mode 100644
index 0000000..435fcbd
Binary files /dev/null and b/frontend/src/views/help/img/预约管理3.png differ
diff --git a/frontend/src/views/help/img/预约管理4.png b/frontend/src/views/help/img/预约管理4.png
new file mode 100644
index 0000000..63ad378
Binary files /dev/null and b/frontend/src/views/help/img/预约管理4.png differ
diff --git a/frontend/src/views/help/img/预约管理5.png b/frontend/src/views/help/img/预约管理5.png
new file mode 100644
index 0000000..2864ee7
Binary files /dev/null and b/frontend/src/views/help/img/预约管理5.png differ
diff --git a/frontend/src/views/help/img/预约管理6.png b/frontend/src/views/help/img/预约管理6.png
new file mode 100644
index 0000000..24803e4
Binary files /dev/null and b/frontend/src/views/help/img/预约管理6.png differ
diff --git a/frontend/src/views/help/img/预约管理7.png b/frontend/src/views/help/img/预约管理7.png
new file mode 100644
index 0000000..2af6df8
Binary files /dev/null and b/frontend/src/views/help/img/预约管理7.png differ
diff --git a/frontend/src/views/help/img/预约管理8.png b/frontend/src/views/help/img/预约管理8.png
new file mode 100644
index 0000000..3ff3870
Binary files /dev/null and b/frontend/src/views/help/img/预约管理8.png differ
diff --git a/frontend/src/views/help/img/预约管理9.png b/frontend/src/views/help/img/预约管理9.png
new file mode 100644
index 0000000..8cb5ebf
Binary files /dev/null and b/frontend/src/views/help/img/预约管理9.png differ
diff --git a/frontend/src/views/help/img/预约设置0.png b/frontend/src/views/help/img/预约设置0.png
new file mode 100644
index 0000000..7994608
Binary files /dev/null and b/frontend/src/views/help/img/预约设置0.png differ