单个题目排行榜功能

管理用户路由
他人信息+用户快捷入口
2022-07-18 18:23:34 +08:00 · 2022-07-18 16:34:34 +08:00 · 2022-07-16 02:39:34 +08:00
13 changed files with 230 additions and 39 deletions
--- a/src/App.vue
+++ b/src/App.vue
@@ -7,6 +7,6 @@

 <style>
 body{
- background-color: #2d3039;
+ /*background-color: #2d3039;*/
 }
-</style>
+</style>
--- a/src/components/Navbar.vue
+++ b/src/components/Navbar.vue
@@ -10,9 +10,9 @@
            :default-active="$route.path"
            class="el-menu-demo"
            mode="horizontal"
-            background-color="#2d3039"
-            text-color="#fff"
-            active-text-color="#ffd04b">
+            text-color="#2c3e50"
+            active-text-color="#f39c12">
+          <!--background-color="#2d3039"-->
          <el-menu-item index="/home">Home</el-menu-item>
          <el-menu-item index="/scoreboard">Scoreboard</el-menu-item>
          <el-menu-item index="/users">Users</el-menu-item>
@@ -43,7 +43,7 @@
            <p class="slip">|</p>
          </div>
          <div class="logout">
-            <el-button text color="#626aef" :dark="isDark" @click="logout">退出登录</el-button>
+            <el-button text color="#ffd04b" :dark="isDark" @click="logout">退出登录</el-button>
          </div>
        </div>
        <div v-else class="login">
@@ -153,7 +153,7 @@ export default {
 .wrapper {
  width: 100%;
  height: 100%;
-  background: #2d3039;
+  //background: #2d3039;
 }
 .header {
  position: relative;
@@ -169,7 +169,7 @@ export default {
  height: 29px;
  width: 120px;
  vertical-align: middle;
-  color: #dddddd;
+  color: #2c3e50;
 }
 .header-right {
  float: right;
@@ -186,7 +186,7 @@ export default {

      .user-name{
        margin-right: 10px;
-        color: #dddddd;
+        color: #2c3e50;
      }
    }
    .slip{
@@ -227,7 +227,7 @@ export default {
 .el-menu--horizontal > .el-menu-item {
  font-size: 16px;
  margin: 0 15px;
-  color: white;
+  //color: white;
 }


--- a/src/components/admin/admin-Navbar.vue
+++ b/src/components/admin/admin-Navbar.vue
@@ -9,9 +9,9 @@
            :default-active="$route.path"
            class="el-menu-demo"
            mode="horizontal"
-            background-color="#2d3039"
-            text-color="#fff"
+            text-color="#2c3e50"
            active-text-color="#ffd04b">
+
          <el-menu-item index="/admin/match">比赛管理</el-menu-item>
          <el-menu-item index="/admin/notification">公告管理</el-menu-item>
          <el-menu-item index="/admin/challenges">题目管理</el-menu-item>
@@ -41,7 +41,7 @@
            <p class="slip">|</p>
          </div>
          <div class="logout">
-            <el-button text color="#626aef" @click="$router.push('/home')">返回首页</el-button>
+            <el-button text color="#2c3e50" @click="$router.push('/home')">返回首页</el-button>
          </div>
        </div>

@@ -115,7 +115,7 @@ export default {
 .wrapper {
  width: 100%;
  height: 100%;
-  background: #2d3039;
+  //background: #2d3039;
 }
 .header {
  position: relative;
@@ -131,7 +131,7 @@ export default {
  height: 29px;
  width: 120px;
  vertical-align: middle;
-  color: #dddddd;
+  color: #2c3e50;
 }
 .header-right {
  float: right;
@@ -148,7 +148,7 @@ export default {

      .user-name{
        margin-right: 10px;
-        color: #dddddd;
+        color: #2c3e50;
      }
    }
    .slip{
@@ -189,7 +189,6 @@ export default {
 .el-menu--horizontal > .el-menu-item {
  font-size: 16px;
  margin: 0 15px;
-  color: white;
 }


--- a/src/components/admin/admin-User.vue
+++ b/src/components/admin/admin-User.vue
@@ -0,0 +1,132 @@
+<template>
+  <el-row class="row-bg" justify="center">
+    <el-col :span="20">
+
+      <el-dialog v-model="editUserVisible" title="编辑用户">
+        <el-form :model="formData" ref="vForm"  label-position="left" label-width="80px"
+                 size="default" >
+          <el-form-item label="用户名" prop="username">
+            <el-input v-model="formData.username" placeholder="用户名" disabled></el-input>
+          </el-form-item>
+          <el-form-item label="密码(md5)" prop="password">
+            <el-input v-model="formData.password" placeholder="密码"></el-input>
+          </el-form-item>
+          <el-form-item label="邮箱" prop="email" >
+            <el-input v-model="formData.email" placeholder="邮箱" disabled></el-input>
+          </el-form-item>
+          <el-form-item label="是否被ban" prop="banned">
+            <el-input v-model="formData.banned" placeholder="用户状态"></el-input>
+          </el-form-item>
+          <el-form-item label="是否隐藏" prop="hidden">
+            <el-input v-model="formData.hidden" placeholder="用户状态"></el-input>
+          </el-form-item>
+          <el-form-item label="权限" prop="role">
+            <el-input v-model="formData.role" placeholder="0是普通，1是admin"></el-input>
+          </el-form-item>
+          <el-form-item label="描述" prop="affiliation" >
+            <el-input v-model="formData.affiliation" placeholder="" disabled></el-input>
+          </el-form-item>
+          <el-form-item label="网站" prop="website" >
+            <el-input v-model="formData.website" placeholder="" disabled></el-input>
+          </el-form-item>
+          <el-form-item label="country" prop="country">
+            <el-input v-model="formData.country" placeholder="" disabled></el-input>
+          </el-form-item>
+          <el-button type="primary" @click="edit()">提交</el-button>
+        </el-form>
+      </el-dialog>
+
+      <el-table :data="data" row-key="id" style="width: 100%">
+        <el-table-column label="id" prop="id" column-key="id"/>
+        <el-table-column label="用户名" prop="username"/>
+        <el-table-column label="密码(md5值)" prop="password"/>
+        <el-table-column label="是否被ban" prop="banned"/>
+        <el-table-column label="权限" prop="role"/>
+        <el-table-column label="操作" width="180">
+          <template #default="scope">
+            <el-button link type="primary" size="small" @click="editClick(scope.row)"
+            >编辑</el-button>
+            <el-button link type="primary" size="small" @click="handleClick(scope.row)"
+            >删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+    </el-col>
+  </el-row>
+</template>
+
+<script>
+import axios from 'axios';
+
+export default {
+  data(){
+   return{
+     formData:{
+       id:0,
+       username:"",
+       password:"",
+       email:"",
+       affiliation:"",
+       country:"",
+       website:"",
+       banned:0,
+       hidden:0,
+       role:0,
+       team_id:0,
+     },
+     data:[],
+     editUserVisible:false,
+   }
+  },
+  mounted() {
+    axios.get('/api/v1/admin/users').then(res => {
+      if (res.data.code === 200) {
+        this.data = res.data.data;
+        console.log(this.data);
+      }
+    })
+
+  },
+  methods:{
+    // 修改用户
+    editClick(row){
+      this.editUserVisible=true
+      this.formData.id=row.id
+      this.formData.username=row.username
+      this.formData.password=row.password
+      this.formData.email=row.email
+      this.formData.affiliation=row.affiliation
+      this.formData.country=row.country
+      this.formData.website=row.website
+      this.formData.banned=row.banned
+      this.formData.hidden=row.hidden
+      this.formData.role=row.role
+    },
+    //删除用户
+    handleClick(row){
+      axios.delete('/api/v1/admin/user/'+row.id).then(res => {
+        if (res.data.code === 200) {
+          this.$message({
+            message: '删除成功',
+            type: 'success'
+          });
+          this.data.splice(this.data.indexOf(row),1);
+        }
+      })
+    },
+    edit(){
+      console.log(this.formData)
+      axios.put('/api/v1/admin/user/'+this.formData.id,this.formData).then(res => {
+        if (res.data.code === 200) {
+          this.$message({
+            message: '修改成功',
+            type: 'success'
+          });
+          this.editUserVisible=false
+        }
+      })
+    }
+  }
+}
+
+</script>
--- a/src/components/challenges/challenges.vue
+++ b/src/components/challenges/challenges.vue
@@ -1,18 +1,28 @@
 <template>
  <div class="challenges-all">
    <div class="category">
+      <el-dialog v-model="solvesVisible" :title=challenges.name
+      width="500px">
+        <el-table :data="solves" row-key="id" style="width: 100%">
+          <el-table-column label="用户名" prop="username"/>
+          <el-table-column label="时间" prop="submitted_at"/>
+        </el-table>
+
+      </el-dialog>
+
      <el-container>
        <el-aside width="200px">
        <el-menu
            default-active="2"
-            background-color="#2d3039"
-            text-color="#fff"
-            active-text-color="#ffd04b"
+
+            text-color="#2c3e50"
+            active-text-color="#f39c12"
+
            class="el-menu-vertical-demo"
-            @open="handleOpen"
-            @close="handleClose"
            @select="handleSelect"
        >
+<!--          background-color="#2d3039"-->
+
         <el-menu-item index="Web">
           <span>WEB</span>
         </el-menu-item>
@@ -35,7 +45,7 @@
    <el-scrollbar height="490px">
    <div class="all-card">
      <el-button v-for="(c,index) in data" class="buttons" @click="bcard(index)"
-                 :type="c.is_solved ? 'warning':''" >
+                 :type="c.is_solved ? 'success':''" >
        <div class="card">
        <div class="card-name">
          {{c.name}}
@@ -67,9 +77,14 @@
        <div class="challenges-name" >
          {{challenges.name}}
        </div>
-        <el-tag v-for="tag in tags" class="tag">
+        <div class="tag">
+        <el-tag v-for="tag in tags" class="tttag">
          {{tag}}
        </el-tag>
+        </div>
+        <div class="solves">
+        <el-button @click="solvesbycid" circle ><el-icon><Trophy /></el-icon></el-button>
+        </div>
      </div>
      <div class="middle">
        <div class="challenges-solve">
@@ -117,6 +132,7 @@
                      <el-button>hint</el-button>
                    </template>
                  </el-popover>
+
                </div>

              </el-col>
@@ -131,6 +147,8 @@
  </div>


+
+
 </template>

 <script>
@@ -140,9 +158,14 @@ import {
  Location,
  Setting,
 } from '@element-plus/icons-vue'
+import dayjs from "dayjs";
 import axios from "axios";
 import { ElNotification } from 'element-plus';
+import relativeTime from 'dayjs/plugin/relativeTime'
+import 'dayjs/locale/zh-cn' // +

+dayjs.extend(relativeTime)
+dayjs.locale('zh-cn') //

 export default {
  data() {
@@ -155,6 +178,9 @@ export default {
      challenges:[],
      tags:[],
      attachment:[],
+      solvesVisible:false,
+      solves:[],
+      times:"",
    }
  },
  mounted() {
@@ -172,6 +198,21 @@ export default {
    },

  methods: {
+    //解题数据查询
+    solvesbycid(){
+      this.solvesVisible = true;
+      axios.get('/api/v1/user/solves/cid/'+this.challenges.id).then(res => {
+        if(res.data.code===200){
+          this.solves = res.data.data;
+          if(this.solves == undefined){
+            this.solves = [];
+          }
+          this.solves.forEach(function(item,index) {
+            item.submitted_at=  dayjs(item.submitted_at).fromNow()
+          })
+        }
+      })
+    },
    bcard(index){

      this.challenges = this.data[index]
@@ -261,10 +302,14 @@ export default {
      .challenges-name{
        font-size: 25px;
        font-weight: normal;
+        width: 100px;
      }
      .tag{
-        margin-top: 4px;
-        margin-right: 5px;
+        margin-top: 5px;
+        width: 500px;
+        display: flex;
+      }
+      .solves{
      }
    }
    .middle{
@@ -310,7 +355,7 @@ export default {

      width: 240px;
      height: 100px;
-      //background-color: #ff7f00;
+
      margin-top: 15px;
      .card-name{
        font-size:30px;
--- a/src/components/challenges/scorecard.vue
+++ b/src/components/challenges/scorecard.vue
@@ -48,7 +48,7 @@ export default {
  width: 100%;
  display: flex;
  justify-content:center;
-  background-color: #ff7f00;
+  background-color: #f39c12;
  border-radius: 10px;
  box-shadow: #9e4f00 0px 0px 10px;

@@ -74,4 +74,4 @@ export default {

 }

-</style>
+</style>
--- a/src/components/index/Index.vue
+++ b/src/components/index/Index.vue
@@ -3,7 +3,7 @@
   <div class="title">
     Welcome to SNCTF
   </div>
-    
+
  </div>
 </template>

@@ -19,7 +19,7 @@
    top: 80px;
    width: 100%;
    height: auto;
-    background: #2D3039;
+    //background: #2D3039;
    .title{
      /* Welcome To SNCTF */

@@ -28,7 +28,7 @@
      font-size: 50px;
      font-weight: normal;
      margin-top: 10%;
-      color: #FFFFFF;
+      color: #2c3e50;
    }
  }
-</style>
+</style>
--- a/src/components/socre.vue
+++ b/src/components/socre.vue
@@ -39,7 +39,7 @@ export default {
 .title{
  display: flex;
  justify-content: center;
-  color: #dddddd;
+  color: #2c3e50;
 }
 .el-table .warning-row {
  --el-table-tr-bg-color: var(--el-color-warning-light-9);
--- a/src/components/userid.vue
+++ b/src/components/userid.vue
@@ -15,7 +15,7 @@
        <p>城市：{{userData.country}}</p>
        <p>网站：{{userData.website}}</p>
      </el-dialog>
-      <h1 style="color: #FFFFFF">解题数</h1>
+      <h1 style="color: #2c3e50">解题数</h1>
      <div>
        <el-table :data="formData" style="width: 100%" stripe>
          <el-table-column prop="challenge_name" label="题目" width="180" />
@@ -163,7 +163,7 @@ export default {
    align-items: center;
    //div内标题间隙
    line-height:1px;
-    color: #FFFFFF;
+    color: #2c3e50;

  }

--- a/src/components/userinfo.vue
+++ b/src/components/userinfo.vue
@@ -45,7 +45,7 @@
        </el-form>
        <el-button type="primary" @click="editUser">提交</el-button>
      </el-dialog>
-      <h1 style="color: #FFFFFF">解题数</h1>
+      <h1 style="color: #2c3e50">解题数</h1>
      <div>
        <el-table :data="formData" style="width: 100%" stripe>
          <el-table-column prop="challenge_name" label="题目" width="180" />
@@ -140,7 +140,7 @@ export default {
    align-items: center;
    //div内标题间隙
    line-height:1px;
-    color: #FFFFFF;
+    color: #2c3e50;

  }

--- a/src/components/userlist.vue
+++ b/src/components/userlist.vue
@@ -50,6 +50,6 @@ export default {
 .title{
  display: flex;
  justify-content: center;
-  color: #dddddd;
+  color: #2c3e50;
 }
 </style>
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -83,6 +83,11 @@ const router = createRouter({
                    path:'challenges',
                    name:'AdminChallenges',
                    component: ()=> import('../views/admin/AdminChal.vue'),
+                },
+                {
+                    path:'user',
+                    name:'AdminUsers',
+                    component: ()=> import('../views/admin/AdminUser.vue'),
                }
            ]

--- a/src/views/admin/AdminUser.vue
+++ b/src/views/admin/AdminUser.vue
@@ -0,0 +1,10 @@
+<template>
+  <Auser></Auser>
+</template>
+
+<script>
+import Auser from "../../components/admin/admin-User.vue";
+export default {
+  components: {Auser},
+}
+</script>
Author	SHA1	Message	Date
jiayuqi7813	0bdc6d5cc0	单个题目排行榜功能	2022-07-18 18:23:34 +08:00
jiayuqi7813	5e6bb508f5	管理用户路由	2022-07-18 16:34:34 +08:00
jiayuqi7813	35ebcfc9fb	他人信息+用户快捷入口	2022-07-16 02:39:34 +08:00