Compare commits

..

13 Commits

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
jiayuqi7813
7e4c8ff4f4 他人信息+用户快捷入口 2022-07-16 02:17:19 +08:00
jiayuqi7813
368248116b 个人信息页面 2022-07-15 00:05:18 +08:00
jiayuqi7813
c18c63804f 新增题目完成 2022-07-14 00:24:13 +08:00
jiayuqi7813
77f146040f 新增题目管理路由 2022-07-12 03:21:13 +08:00
jiayuqi7813
9de0289462 公告管理完成 2022-07-10 19:58:35 +08:00
jiayuqi7813
6353797544 公告管理 2022-07-10 17:24:05 +08:00
jiayuqi7813
0af9d9a010 完善公告时间戳 2022-07-01 02:10:00 +08:00
jiayuqi7813
2c9b4a7f4f 晚上路由守护,在router.js 2022-06-29 23:43:22 +08:00
jiayuqi7813
bd76fea1ec 路由守护,非登录禁止访问 2022-06-29 01:57:47 +08:00
jiayuqi7813
0a26ce660c 路由守护,非登录禁止访问 2022-06-29 01:57:12 +08:00
23 changed files with 1075 additions and 50 deletions

View File

@@ -7,6 +7,6 @@
<style>
body{
background-color: #2d3039;
/*background-color: #2d3039;*/
}
</style>
</style>

View File

@@ -81,7 +81,6 @@ export default {
password:this.loginForm.password
}
}).then(res=>{
console.log(res.data);
if(res.data.code===200){
this.$router.push('/home')
ElNotification({
@@ -149,4 +148,4 @@ export default {
}
</style>
</style>

View File

@@ -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">
@@ -107,12 +107,14 @@ export default {
mounted(){
axios.get("/api/v1/user/session").then(res => {
if (res.data.code === 200) {
console.log(res)
this.username = res.data.data.username;
this.role = res.data.data.role;
//反正Navbar每次都要请求直接在这请求session然后写入cookie就好了
localStorage.setItem('token',res.data.data.token);
}
}).catch(err => {});
//请求不到就删除token防止变量出现还有遗留的情况非常号解决方案
}).catch(err => {localStorage.removeItem('token');});
},
@@ -151,7 +153,7 @@ export default {
.wrapper {
width: 100%;
height: 100%;
background: #2d3039;
//background: #2d3039;
}
.header {
position: relative;
@@ -167,7 +169,7 @@ export default {
height: 29px;
width: 120px;
vertical-align: middle;
color: #dddddd;
color: #2c3e50;
}
.header-right {
float: right;
@@ -184,7 +186,7 @@ export default {
.user-name{
margin-right: 10px;
color: #dddddd;
color: #2c3e50;
}
}
.slip{
@@ -225,7 +227,7 @@ export default {
.el-menu--horizontal > .el-menu-item {
font-size: 16px;
margin: 0 15px;
color: white;
//color: white;
}

View File

@@ -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>
@@ -53,6 +53,7 @@
<script>
import axios from "axios";
import {ElNotification} from "element-plus";
import router from "../../router";
export default {
data(){
@@ -64,13 +65,18 @@ export default {
mounted(){
axios.get("/api/v1/user/session").then(res => {
if (res.data.code === 200) {
console.log(res)
if (res.data.code === 200 && res.data.data.role === 1) {
this.username = res.data.data.username;
this.role = res.data.data.role;
}
}).catch(err => {});
}).catch(err => {
ElNotification.error({
title: '错误',
message: 'You dont Have Permission',
duration: 0,
});
router.push('/login');
});
},
@@ -109,7 +115,7 @@ export default {
.wrapper {
width: 100%;
height: 100%;
background: #2d3039;
//background: #2d3039;
}
.header {
position: relative;
@@ -125,7 +131,7 @@ export default {
height: 29px;
width: 120px;
vertical-align: middle;
color: #dddddd;
color: #2c3e50;
}
.header-right {
float: right;
@@ -142,7 +148,7 @@ export default {
.user-name{
margin-right: 10px;
color: #dddddd;
color: #2c3e50;
}
}
.slip{
@@ -183,7 +189,6 @@ export default {
.el-menu--horizontal > .el-menu-item {
font-size: 16px;
margin: 0 15px;
color: white;
}

View File

@@ -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>

View File

@@ -0,0 +1,270 @@
<template>
<el-row class="row-bg" justify="center">
<el-col :span="20">
<!--编辑题目的dialog-->
<el-dialog v-model="editchallengeVisible" title="编辑题目">
<el-form :model="formData" ref="vForm" label-position="left" label-width="80px"
size="default" >
<el-form-item label="标题" prop="name">
<el-input v-model="formData.name" placeholder="题目名"></el-input>
</el-form-item>
<el-form-item label="分数" prop="score">
<el-input v-model="formData.score" placeholder="分数"></el-input>
</el-form-item>
<el-form-item label="题目描述" prop="description">
<el-input v-model="formData.description" placeholder="题目描述"></el-input>
</el-form-item>
<el-form-item label="题目类型" prop="category">
<el-input v-model="formData.category" placeholder="题目类型"></el-input>
</el-form-item>
<el-form-item label="flag" prop="flag">
<el-input v-model="formData.flag" placeholder="flag"></el-input>
</el-form-item>
<el-form-item label="题目链接" prop="attachment">
<el-input v-model="formData.attachment[0]" placeholder="题目链接"></el-input>
</el-form-item>
<el-form-item label="题目附件" prop="attachment">
<el-input v-model="formData.attachment[1]" placeholder="题目附件"></el-input>
</el-form-item>
<el-form-item label="tags" prop="tags">
<el-input v-model="formData.tags" placeholder="标签以逗号间隔"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="addHintsConfig">新增提示</el-button>
</el-form-item>
<el-row :gutter="24" v-for="(item, index) in formData.hints">
<el-col :span="15">
<el-form-item :label="'hint'+(index+1)" prop="hints">
<el-input v-model="formData.hints[index]" placeholder="提示"></el-input>
</el-form-item>
</el-col>
<el-col :span="5">
<el-button type="danger" @click="removeHintsConfig(index)">删除</el-button>
</el-col>
</el-row>
<el-form-item label="是否可见" prop="visible">
<el-input v-model="formData.visible" placeholder="是否可见(1是可见,0为不可见)"></el-input>
</el-form-item>
<el-button type="primary" @click="submitChallenge()">提交</el-button>
</el-form>
</el-dialog>
<!--新建题目的dialog-->
<el-dialog v-model="addChallengedialogVisible" title="新建题目">
<el-form :model="challData" ref="vForm" label-position="left" label-width="80px"
size="default" >
<el-form-item label="标题" prop="name">
<el-input v-model="challData.name" placeholder="题目名"></el-input>
</el-form-item>
<el-form-item label="分数" prop="score">
<el-input v-model="challData.score" placeholder="分数"></el-input>
</el-form-item>
<el-form-item label="题目描述" prop="description">
<el-input v-model="challData.description" placeholder="题目描述"></el-input>
</el-form-item>
<el-form-item label="题目类型" prop="category">
<el-input v-model="challData.category" placeholder="题目类型"></el-input>
</el-form-item>
<el-form-item label="flag" prop="flag">
<el-input v-model="challData.flag" placeholder="flag"></el-input>
</el-form-item>
<el-form-item label="题目链接" prop="attachment">
<el-input v-model="challData.attachment[0]" placeholder="题目链接"></el-input>
</el-form-item>
<el-form-item label="题目附件" prop="attachment">
<el-input v-model="challData.attachment[1]" placeholder="题目附件"></el-input>
</el-form-item>
<el-form-item label="tags" prop="tags">
<el-input v-model="challData.tags" placeholder="标签以逗号间隔"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="addChallengeHintsConfig">新增提示</el-button>
</el-form-item>
<el-row :gutter="24" v-for="(item, index) in challData.hints">
<el-col :span="15">
<el-form-item :label="'hint'+(index+1)" prop="hints">
<el-input v-model="challData.hints[index]" placeholder="提示"></el-input>
</el-form-item>
</el-col>
<el-col :span="5">
<el-button type="danger" @click="removeChallengeHintsConfig(index)">删除</el-button>
</el-col>
</el-row>
<el-form-item label="是否可见" prop="visible">
<el-input v-model="challData.visible" placeholder="是否可见(1是可见,0为不可见)"></el-input>
</el-form-item>
<el-button type="primary" @click="addChallenge()">提交</el-button>
</el-form>
</el-dialog>
<el-button type="primary" @click="addChallengedialogVisible=true">新增题目</el-button>
<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="name"/>
<el-table-column label="分类" prop="category" :filters="getfilterCategory()" :filter-method="filterCategory"/>
<el-table-column label="flag" prop="flag"/>
<el-table-column label="分数" prop="score"/>
<el-table-column label="是否可见" prop="visible"
:filters="[
{text:'可见',value:1},
{text:'不可见',value:0},
]"
:filter-method="filterVisible"
/>
<el-table-column fixed="right" label="Operations" width="200">
<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{
tmpid:0,
formData:{
name: "time",
score: 1000,
flag: "flag{this_is_flag}",
description: "测试题",
attachment: [],
category: "Web",
tags: "checkin,ssrf",
hints: [],
visible: 1
},
challData:{
name: "",
score: 0,
flag: "",
description: "",
attachment: [],
category: "",
tags: "",
hints: [],
visible: 0
},
data:[],
editchallengeVisible:false,
addChallengedialogVisible:false
}
},
mounted(){
axios.get('/api/v1/admin/challenges').then(res => {
if (res.data.code === 200) {
this.data = res.data.data;
}
})
},
methods:{
//删除行
removeHintsConfig(index){
this.formData.hints.splice(index,1);
},
removeChallengeHintsConfig(index){
this.challData.hints.splice(index,1);
},
//新建行
addHintsConfig(){
this.formData.hints.push("");
},
addChallengeHintsConfig(){
this.challData.hints.push("");
},
//新建题目
addChallenge(){
console.log(this.challData);
this.challData.score = parseInt(this.challData.score);
axios.post('/api/v1/admin/challenge',this.challData).then(res => {
console.log(res.data);
if (res.data.code === 200) {
this.addChallengedialogVisible = false;
this.$message({
message: '新增成功',
type: 'success'
});
window.location.reload()
}
})
},
//修改题目
submitChallenge(){
console.log(this.formData);
this.editchallengeVisible=false;
axios.put('/api/v1/admin/challenge/'+this.tmpid,this.formData).then(res => {
if (res.data.code === 200) {
this.$message({
message: '修改成功',
type: 'success'
});
}
})
},
// 通过获取id然后获取修改题目内容
editClick(row){
this.editchallengeVisible = true;
this.tmpid = row.id;
this.formData.name = row.name;
this.formData.score = row.score;
this.formData.flag = row.flag;
this.formData.description = row.description;
this.formData.attachment = row.attachment;
this.formData.category = row.category;
this.formData.tags = row.tags;
this.formData.hints = row.hints;
this.formData.visible = row.visible;
console.log(this.formData);
},
// 通过请求分类api获取分类数据
getfilterCategory() {
let apiArr=[
{ text: "Misc", value: "Misc" },
{ text: "Web", value: "Web" },
{ text: "Pwn", value: "Pwn" },
{ text: "Crypto", value: "Crypto" },
{ text: "Reverse", value: "Reverse" },
]
return apiArr
},
//分类筛选
filterCategory(value, row) {
return row.category === value;
},
//是否可见筛选
filterVisible(value, row) {
return row.visible === value;
},
handleClick(row){
axios.delete('/api/v1/admin/challenge/'+row.id).then(res => {
if (res.data.code === 200) {
this.$message({
message: '删除成功',
type: 'success'
});
this.data.splice(this.data.indexOf(row),1);
}
})
}
}
}
</script>

View File

@@ -0,0 +1,95 @@
<template>
<el-row class="row-bg" justify="center">
<el-col :span="20">
<el-button link type="primary" @click="dialogTableVisible = true"
>添加公告</el-button>
<el-dialog v-model="dialogTableVisible" title="新建公告">
<el-form :model="formData" ref="vForm" label-position="left" label-width="80px"
size="default" >
<el-form-item label="公告标题" prop="title">
<el-input v-model="formData.title" placeholder="请输入公告标题"></el-input>
</el-form-item>
<el-form-item label="公告内容" prop="content">
<el-input :rows="4" type="textarea" v-model="formData.content" placeholder="请输入公告内容"></el-input>
</el-form-item>
<el-button type="primary" @click="submitNotice">提交</el-button>
</el-form>
</el-dialog>
<el-table :data="data" style="width: 100%">
<el-table-column label="标题" prop="title"/>
<el-table-column label="内容" prop="content"/>
<el-table-column label="时间" prop="created_at"/>
<el-table-column fixed="right" label="Operations" width="120">
<template #default="scope">
<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";
import * as dayjs from 'dayjs';
import {ElNotification} from "element-plus";
import { reactive, ref } from 'vue'
export default {
data(){
return{
formData:{
title:'',
content:'',
},
data:[],
dialogTableVisible:false,
}
},
mounted() {
axios.get('/api/v1/notice').then(res => {
if (res.data.code === 200) {
console.log(res.data.data);
this.data = res.data.data;
this.data.forEach(function(item,index){
item.created_at = dayjs(item.created_at).format('YYYY-MM-DD HH:mm:ss');
})
this.data.reverse();
}
})
},
methods:{
submitNotice(){
axios.post('/api/v1/admin/notice',this.formData).then(res => {
if (res.data.code === 200) {
this.dialogTableVisible = false;
this.$message({
message: '添加成功',
type: 'success'
});
window.location.reload()
}
})
},
handleClick(row){
axios.delete('/api/v1/admin/notice/'+row.id).then(res => {
if (res.data.code === 200) {
this.data.splice(this.data.indexOf(row),1);
this.$message({
message: '删除成功',
type: 'success'
});
}
})
}
}
}
</script>

View File

@@ -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">
@@ -83,7 +98,7 @@
<div class="attachment"><!-- 附件or连接-->
<div v-if="attachment[0]==''" class="link"></div>
<div v-else class="link">
<el-link type="primary" id="link">题目链接</el-link>
<el-link type="primary" id="link">题目链接</el-link>
</div>
<div v-if="attachment.length<2" class="file"></div>
<div v-else class="file">
@@ -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,9 +178,13 @@ export default {
challenges:[],
tags:[],
attachment:[],
solvesVisible:false,
solves:[],
times:"",
}
},
mounted() {
//虽然已经路由守护了,但是再来一层防止越权
axios.get('/api/v1/user/challenges/all').catch(function (error) {
if (error.response.status == 400) {
ElNotification.error({
@@ -171,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]
@@ -260,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{
@@ -309,7 +355,7 @@ export default {
width: 240px;
height: 100px;
//background-color: #ff7f00;
margin-top: 15px;
.card-name{
font-size:30px;
@@ -336,4 +382,4 @@ export default {
}
</style>
</style>

View File

@@ -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>

View File

@@ -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>

View File

@@ -31,6 +31,7 @@ export default {
this.data.forEach(function(item,index){
item.created_at = dayjs(item.created_at).format('YYYY-MM-DD HH:mm:ss');
})
this.data.reverse();
}
})
}
@@ -41,4 +42,4 @@ export default {
<style>
</style>
</style>

View File

@@ -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);
@@ -48,4 +48,4 @@ export default {
--el-table-tr-bg-color: var(--el-color-success-light-9);
}
</style>
</style>

173
src/components/userid.vue Normal file
View File

@@ -0,0 +1,173 @@
<template>
<el-row class="row-bg" justify="center">
<el-col :span="16">
<div class="userinfo">
<h1>{{name}}</h1>
<h1>{{score}}</h1>
<h1>用户id{{$route.params.id}}</h1>
</div>
<el-button @click="editUserVisible=true" type="primary" circle >
<el-icon><User /></el-icon>
</el-button>
<el-dialog v-model="editUserVisible" title="用户信息">
<p>联系方式{{userData.affiliation}}</p>
<p>城市{{userData.country}}</p>
<p>网站{{userData.website}}</p>
</el-dialog>
<h1 style="color: #2c3e50">解题数</h1>
<div>
<el-table :data="formData" style="width: 100%" stripe>
<el-table-column prop="challenge_name" label="题目" width="180" />
<el-table-column prop="score" label="分数" width="180" />
<el-table-column prop="created_at" label="提交时间" />
</el-table>
</div>
</el-col>
</el-row>
</template>
<script>
import axios from "axios";
import dayjs from 'dayjs';
export default {
data(){
return{
userData:{
affiliation: "",
country: "",
website: "",
name: "",
},
editUserVisible:false,
name: "",
rank:"",
score:0,
id:0,
formData:[],
}
},
methods:{
},
mounted() {
//管理员信息保护
if(this.$route.params.id ==='1'){
this.name = "admin";
this.rank = "管理员";
this.score = "114514";
this.userData.affiliation = "下北泽";
this.id = 1;
this.formData = [
{
challenge_name: "简单题目",
score: "0",
created_at: "2020-01-01"
},
{
challenge_name: "简单题目",
score: "0",
created_at: "2020-01-01"
},
{
challenge_name: "简单题目",
score: "0",
created_at: "2020-01-01"
},
{
challenge_name: "简单题目",
score: "0",
created_at: "2020-01-01"
},
{
challenge_name: "简单题目",
score: "0",
created_at: "2020-01-01"
},
{
challenge_name: "简单题目",
score: "0",
created_at: "2020-01-01"
},
{
challenge_name: "简单题目",
score: "0",
created_at: "2020-01-01"
},
{
challenge_name: "简单题目",
score: "0",
created_at: "2020-01-01"
},
{
challenge_name: "简单题目",
score: "0",
created_at: "2020-01-01"
},
{
challenge_name: "简单题目",
score: "0",
created_at: "2020-01-01"
}
]
}else {
//他人信息
axios.get('/api/v1/user/'+this.$route.params.id).then(res=> {
this.id = res.data.data.id;
this.userData.affiliation= res.data.data.affiliation;
this.userData.country= res.data.data.country;
this.name =this.userData.name= res.data.data.username;
this.userData.website= res.data.data.website;
if(res.data.data.username===""){
this.name = "用户不存在捏";
return
}
})
//获取排名信息
axios.get("/api/v1/score/"+this.$route.params.id).then(res => {
if (res.data.code === 200) {
this.score = res.data.data
}
})
//获取提交记录
axios.get("/api/v1/user/solves/uid/"+this.$route.params.id).then(res=>{
if (res.data.code === 200) {
this.formData = res.data.data;
this.formData.forEach(function(item,index){
item.created_at = dayjs(item.created_at).format('YYYY-MM-DD HH:mm:ss');
})
this.formData.reverse();
}
})
}
}
}
</script>
<style lang="less">
.row-bg{
.userinfo{
//内容垂直居中
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
//div内标题间隙
line-height:1px;
color: #2c3e50;
}
}
</style>

150
src/components/userinfo.vue Normal file
View File

@@ -0,0 +1,150 @@
<template>
<el-row class="row-bg" justify="center">
<el-col :span="16">
<div class="userinfo">
<h1>{{name}}</h1>
<h1>{{rank}}</h1>
<h1>{{score}}</h1>
<h1>用户id{{id}}</h1>
</div>
<el-button @click="editUserVisible=true" type="primary" circle >
<el-icon>
<edit/>
</el-icon></el-button>
<el-dialog v-model="editUserVisible" title="编辑信息">
<el-form :model="userData" ref="vForm" label-position="left" label-width="80px" size="default">
<el-form-item label="用户名" prop="name">
<el-input v-model="userData.name" placeholder="用户名" disabled></el-input>
</el-form-item>
<el-form-item label="邮箱"
:rules="[
{
required: true,
message: 'Please input email address',
trigger: 'blur',
},
{
type: 'email',
message: 'Please input correct email address',
trigger: ['blur', 'change'],
},
]" prop="email" disabled>
<el-input v-model="userData.email" placeholder="邮箱"></el-input>
</el-form-item>
<el-form-item label="联系方式" prop="phone">
<el-input v-model="userData.affiliation" placeholder="联系方式"></el-input>
</el-form-item>
<el-form-item label="所在地" prop="country">
<el-input v-model="userData.country" placeholder="所在地"></el-input>
</el-form-item>
<el-form-item label="网站" prop="website">
<el-input v-model="userData.website" placeholder="website"></el-input>
</el-form-item>
</el-form>
<el-button type="primary" @click="editUser">提交</el-button>
</el-dialog>
<h1 style="color: #2c3e50">解题数</h1>
<div>
<el-table :data="formData" style="width: 100%" stripe>
<el-table-column prop="challenge_name" label="题目" width="180" />
<el-table-column prop="score" label="分数" width="180" />
<el-table-column prop="created_at" label="提交时间" />
</el-table>
</div>
</el-col>
</el-row>
</template>
<script>
import axios from "axios";
import dayjs from 'dayjs';
export default {
data(){
return{
userData:{
affiliation: "",
country: "",
email: "",
website: "",
name: "",
},
editUserVisible:false,
name: "",
rank:"",
score:0,
id:0,
formData:[],
}
},
methods:{
editUser(){
axios.put('/api/v1/user/userinfo',this.userData).then(res=>{
this.editUserVisible=false
this.$message({
message: '修改成功',
type: 'success'
})
})
}
},
mounted() {
//获取相关信息
axios.get("/api/v1/user/session").then(res => {
if (res.data.code === 200) {
this.id = res.data.data.id;
this.userData.affiliation= res.data.data.affiliation;
this.userData.country= res.data.data.country;
this.userData.email= res.data.data.email;
this.name =this.userData.name= res.data.data.username;
this.userData.website= res.data.data.website;
}
//请求不到就删除token防止变量出现还有遗留的情况非常号解决方案
}).catch(err => {localStorage.removeItem('token');});
//获取排名信息
axios.get("/api/v1/user/score/self").then(res => {
if (res.data.code === 200) {
this.score = res.data.data.score;
this.rank = res.data.data.rank;
}
})
//获取提交记录
axios.get("/api/v1/user/solves/self").then(res=>{
if (res.data.code === 200) {
this.formData = res.data.data;
this.formData.forEach(function(item,index){
item.created_at = dayjs(item.created_at).format('YYYY-MM-DD HH:mm:ss');
})
this.formData.reverse();
}
})
}
}
</script>
<style lang="less">
.row-bg{
.userinfo{
//内容垂直居中
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
//div内标题间隙
line-height:1px;
color: #2c3e50;
}
}
</style>

View File

@@ -6,7 +6,14 @@
<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 label="User" width="180">
<template #default="scope">
<el-link type="primary" :href="'/user/'+scope.row.id">
{{scope.row.username}}
</el-link>
</template>
</el-table-column>
<el-table-column prop="affiliation" label="Affiliation" />
<el-table-column prop="country" label="Country" />
<el-table-column prop="website" label="Website" />
@@ -43,6 +50,6 @@ export default {
.title{
display: flex;
justify-content: center;
color: #dddddd;
color: #2c3e50;
}
</style>
</style>

View File

@@ -1,4 +1,5 @@
import { createRouter, createWebHistory } from 'vue-router'
import {ElNotification} from "element-plus";
import home from "../views/Home.vue";
import Login from '../views/Login.vue'
import Challenge from '../views/Challenges.vue'
@@ -29,6 +30,9 @@ const router = createRouter({
path:'/challenges',
name:'Challenges',
component: Challenge,
meta: {
requireAuth: true,
}
},
{
path:'/scoreboard',
@@ -45,11 +49,48 @@ const router = createRouter({
path:'/users',
name:'users',
component: users,
meta: {
requireAuth: true,
}
},
{
path:'/info',
name:'info',
component: () => import('../views/Info.vue'),
meta: {
requireAuth: true,
}
},
{
path:'/user/:id',
name:'user',
component: () => import('../views/Userother.vue'),
meta: {
requireAuth: true,
}
},
{
path:'/admin',
name:'Admin',
component: () => import('../views/admin/index.vue'),
children:[
{
path:'notification',
name:'AdminNotification',
component : () => import('../views/admin/AdminNotice.vue'),
},
{
path:'challenges',
name:'AdminChallenges',
component: ()=> import('../views/admin/AdminChal.vue'),
},
{
path:'user',
name:'AdminUsers',
component: ()=> import('../views/admin/AdminUser.vue'),
}
]
},
{
path:'/404',
@@ -62,4 +103,25 @@ const router = createRouter({
}
]
})
//路由守护,防止非登录用户访问至题目页面
router.beforeEach((to, from, next) => {
if (to.matched.some(record => record.meta.requireAuth)) {
if (localStorage.getItem('token')) {
next()
} else {
ElNotification.error({
title: 'Error',
message: '请先登录'
})
next({
path: '/login',
query: { redirect: to.fullPath }
})
}
} else {
next()
}
}
)
export default router

16
src/views/Info.vue Normal file
View File

@@ -0,0 +1,16 @@
<template>
<Navbar></Navbar>
<userinfo></userinfo>
</template>
<script>
import Navbar from '../components/Navbar.vue'
import Userinfo from "../components/userinfo.vue";
export default {
components: {
Userinfo,
Navbar
}
}
</script>

15
src/views/Userother.vue Normal file
View File

@@ -0,0 +1,15 @@
<template>
<Navbar></Navbar>
<userid></userid>
</template>
<script>
import Navbar from "../components/Navbar.vue";
import userid from '../components/userid.vue'
export default {
components: {
userid,
Navbar
}
}
</script>

View File

@@ -6,7 +6,24 @@
<script>
import Navbar from "../components/Navbar.vue";
import userlist from "../components/userlist.vue";
import axios from "axios";
import {ElNotification} from "element-plus";
export default {
components: {Navbar,userlist},
// mounted() {
// axios.get('/api/v1/user/users').catch(function (error) {
// if (error.response.status === 400) {
// ElNotification.error({
// title: '错误',
// message: '请先登录',
// duration: 0,
// });
// window.location.href = '/login';
// }
// })
// },
}
</script>
</script>

View File

@@ -0,0 +1,12 @@
<template>
<AdminChal></AdminChal>
</template>
<script>
import AdminChal from '../../components/admin/challagne/chal.vue'
export default {
components: {
AdminChal
}
}
</script>

View File

@@ -0,0 +1,11 @@
<template>
<AdminNotification></AdminNotification>
</template>
<script>
import AdminNotification from "../../components/admin/notification.vue";
export default {
components: {AdminNotification},
}
</script>

View File

@@ -0,0 +1,10 @@
<template>
<Auser></Auser>
</template>
<script>
import Auser from "../../components/admin/admin-User.vue";
export default {
components: {Auser},
}
</script>

View File

@@ -1,5 +1,7 @@
<template>
<admin-navbar></admin-navbar>
<router-view/>
</template>
<script>