diff --git a/webapp/manage.html b/webapp/manage.html
index 1b25cf57d26b7e8f5ce2714aed8c42715636e242..a2c73f1d8c19012c4b0fa749a7e60e93b046d399 100644
--- a/webapp/manage.html
+++ b/webapp/manage.html
@@ -1,4 +1,184 @@
 <!DOCTYPE html>
+<<<<<<< HEAD
+<html>
+<head>
+  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <title>数据可视化</title>
+  <link rel="stylesheet" href="css/components.css" />
+  <meta name="Keywords" content="">
+  <meta name="Description" content="">
+<style>
+* {
+  box-sizing: border-box;
+}
+
+body {
+  font-family: Arial;
+  padding: 10px;
+  background: #f1f1f1;
+}
+
+/* 页眉/Blog 标题 */
+.header {
+  padding: 30px;
+  text-align: center;
+  background: white;
+}
+.header-right{
+  white-space: nowrap;
+  /* 自动向右对齐 */
+  margin-left: auto;
+  font-size: 16px;
+  float:none
+}
+
+.header h1 {
+  font-size: 50px;
+}
+
+/* 设置上导航栏的样式 */
+.topnav {
+  overflow: hidden;
+  background-color: #333;
+}
+
+/* 设置 topnav 链接的样式 */
+.topnav a {
+  float: left;
+  display: block;
+  color: #f2f2f2;
+  text-align: center;
+  padding: 14px 16px;
+  text-decoration: none;
+}
+
+/* 改变鼠标悬停时的颜色 */
+.topnav a:hover {
+  background-color: #ddd;
+  color: black;
+}
+
+/* 创建两个不相等的彼此并排的浮动列 */
+/* 左列 */
+.leftcolumn {   
+  float: left;
+  width: 75%;
+}
+
+/* 右列 */
+.rightcolumn {
+  float: left;
+  width: 25%;
+  background-color: #f1f1f1;
+  padding-left: 20px;
+}
+
+/* 伪图像 */
+.fakeimg {
+  background-color: #aaa;
+  width: 100%;
+  padding: 20px;
+}
+
+/* 为文章添加卡片效果 */
+.card {
+  background-color: white;
+  padding: 20px;
+  margin-top: 20px;
+}
+
+/* 清除列之后的浮动 */
+.row:after {
+  content: "";
+  display: table;
+  clear: both;
+}
+
+/* 页脚 */
+.footer {
+  padding: 20px;
+  text-align: center;
+  background: #ddd;
+  margin-top: 20px;
+}
+
+/* 响应式布局 - 当屏幕的宽度小于 800 像素时，使两列堆叠而不是并排 */
+@media screen and (max-width: 800px) {
+  .leftcolumn, .rightcolumn {   
+    width: 100%;
+    padding: 0;
+  }
+}
+
+/* 响应式布局 - 当屏幕的宽度小于 400 像素时，使导航链接堆叠而不是并排 */
+@media screen and (max-width: 400px) {
+  .topnav a {
+    float: none;
+    width: 100%;
+  }
+}
+</style>
+</head>
+<body>
+
+<div class="header">
+  <h1>数据可视化项目</h1>
+  <p>数据可视化</p>
+  
+</div>
+
+<div class="topnav">
+  <a href="#">1</a>
+  <a href="#">2</a>
+  <a href="#">3</a>
+  <div>
+    <span style="float:left" id="ORGNAME"></span>
+    <a style="float:right" href="#" @click="onLogout">注销</a>
+</div>
+</div>
+
+<div class="row">
+  <div class="leftcolumn">
+    <div class="card">
+      <h2>数据1</h2>
+      <h5>Title description, 2021</h5>
+      <div class="fakeimg" style="height:200px;">Image</div>
+      <p>Some..</p>
+      <p>bala</p>
+    </div>
+    <div class="card">
+      <h2></h2>
+      <h5>Title description,2021</h5>
+      <div class="fakeimg" style="height:200px;">Image</div>
+      <p>Some..</p>
+      <p>balabala</p>
+    </div>
+  </div>
+  <div class="rightcolumn">
+    <div class="card">
+      <h2>About</h2>
+      <div class="fakeimg" style="height:100px;">Image</div>
+      <p>可视化结果：</p>
+    </div>
+    <div class="card">
+      <h3>pic</h3>
+      <div class="fakeimg"><p>Image</p></div>
+      <div class="fakeimg"><p>Image</p></div>
+      <div class="fakeimg"><p>Image</p></div>
+    </div>
+    <div class="card">
+      <h3>Follow</h3>
+      <p>Some..</p>
+    </div>
+  </div>
+</div>
+
+<div class="footer">
+  <h2>Footer</h2>
+</div>
+<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
+=======
 <html lang="en">
 <head>
     <meta charset="UTF-8">
@@ -186,6 +366,7 @@
         
     </script>
     <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
+>>>>>>> 1bc58e1ab6b5de16e0bc9c97a76d42123768aff9
     <!-- Axios库，提供AjaxHttp请求 -->
     <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
     <!-- 用于转换Json到表单格式 -->
