diff --git a/index.html b/index.html
index 030a6ff..4aec152 100644
--- a/index.html
+++ b/index.html
@@ -4,7 +4,7 @@
     <meta charset="UTF-8" />
     <link rel="icon" href="/favicon.ico" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Vite App</title>
+    <title>SNCTF</title>
   </head>
   <body>
     <div id="app"></div>
diff --git a/src/components/socre.vue b/src/components/socre.vue
index c3b220e..841acce 100644
--- a/src/components/socre.vue
+++ b/src/components/socre.vue
@@ -1,5 +1,6 @@
 <template>
 <!--  <div id="myChart"></div>-->
+  <h1 class="title">排名</h1>
   <el-row class="row-bg" justify="center">
     <el-col :span="16">
       <el-table :data="tableData" style="width: 100%" stripe :row-class-name="tableRowClassName">
@@ -35,6 +36,11 @@ export default {
 </script>
 
 <style>
+.title{
+  display: flex;
+  justify-content: center;
+  color: #dddddd;
+}
 .el-table .warning-row {
   --el-table-tr-bg-color: var(--el-color-warning-light-9);
 }
diff --git a/src/components/userlist.vue b/src/components/userlist.vue
new file mode 100644
index 0000000..39bd428
--- /dev/null
+++ b/src/components/userlist.vue
@@ -0,0 +1,48 @@
+<template>
+  <h1 class="title">
+    用户
+  </h1>
+  <el-row class="row-bg" justify="center">
+    <el-col :span="16">
+      <el-table :data="tableData" style="width: 100%" stripe :row-class-name="tableRowClassName">
+        <el-table-column prop="id" label="Id" width="180" />
+        <el-table-column prop="username" label="User" width="180" />
+        <el-table-column prop="affiliation" label="Affiliation" />
+        <el-table-column prop="country" label="Country" />
+        <el-table-column prop="website" label="Website" />
+
+      </el-table>
+    </el-col>
+  </el-row>
+
+</template>
+
+<script>
+
+import axios from "axios";
+
+export default {
+  data(){
+    return{
+      tableData:[],
+    }
+  },
+  mounted() {
+    axios.get('/api/v1/user/users').then(res => {
+      if (res.data.code === 200) {
+        console.log(res.data.data);
+        this.tableData = res.data.data;
+      }
+    })
+  }
+}
+</script>
+
+
+<style lang="less" scoped>
+.title{
+  display: flex;
+  justify-content: center;
+  color: #dddddd;
+}
+</style>
\ No newline at end of file
diff --git a/src/router/index.js b/src/router/index.js
index b052676..3d5150f 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -1,8 +1,11 @@
 import { createRouter, createWebHistory } from 'vue-router'
+import home from "../views/Home.vue";
 import Login from '../views/Login.vue'
 import Challenge from '../views/Challenges.vue'
 import Scoreboard from '../views/Scoreboard.vue'
 import Notification from "../views/Notification.vue";
+import users from "../views/Users.vue";
+
 
 const routerHistory = createWebHistory()
 const router = createRouter({
@@ -15,7 +18,7 @@ const router = createRouter({
         {
             path: '/home',
             name:'Home',
-            component: () => import('../views/Home.vue')
+            component:home,
         },
         {
             path:'/login',
@@ -37,6 +40,11 @@ const router = createRouter({
             path:'/notification',
             name:'Notification',
             component: Notification,
+        },
+        {
+            path:'/users',
+            name:'users',
+            component: users,
         }
     ]
 })
diff --git a/src/views/Users.vue b/src/views/Users.vue
new file mode 100644
index 0000000..5c529f3
--- /dev/null
+++ b/src/views/Users.vue
@@ -0,0 +1,12 @@
+<template>
+  <Navbar></Navbar>
+  <userlist></userlist>
+</template>
+
+<script>
+import Navbar from "../components/Navbar.vue";
+import userlist from "../components/userlist.vue";
+export default {
+  components: {Navbar,userlist},
+}
+</script>
\ No newline at end of file
