This commit is contained in:
2023-04-04 11:46:28 +08:00
parent ae621b7dd2
commit 2066cb441b
18 changed files with 210 additions and 105 deletions

View File

@@ -1,7 +1,7 @@
<script setup lang="ts">
import { parseTime } from "utils/functions"
import { useContestStore } from "oj/store/contest"
import ContestTypeVue from "~/shared/ContestType.vue"
import ContestType from "~/shared/ContestType.vue"
const contestStore = useContestStore()
</script>
@@ -27,7 +27,7 @@ const contestStore = useContestStore()
{{ parseTime(contestStore.contest.end_time, "YYYY年M月D日 hh:mm:ss") }}
</n-descriptions-item>
<n-descriptions-item label="比赛类型">
<ContestTypeVue :contest="contestStore.contest" />
<ContestType :contest="contestStore.contest" />
</n-descriptions-item>
<n-descriptions-item label="发起人">
{{ contestStore.contest.created_by.username }}

View File

@@ -29,14 +29,17 @@ const passwordFormVisible = computed(
</script>
<template>
<div v-if="contestStore.contest">
<n-space class="title" align="center" justify="space-between">
<n-space vertical v-if="contestStore.contest">
<n-space align="center" justify="space-between">
<n-space align="center">
<h2 class="contestTitle">{{ contestStore.contest.title }}</h2>
<n-icon size="large" v-if="contestStore.isPrivate" class="lockIcon">
<i-ep-lock />
</n-icon>
<n-tag :type="CONTEST_STATUS[contestStore.contestStatus]['type']">
<n-tag
size="small"
:type="CONTEST_STATUS[contestStore.contestStatus]['type']"
>
{{ contestStore.countdown }}
</n-tag>
</n-space>
@@ -67,14 +70,10 @@ const passwordFormVisible = computed(
</n-form-item>
</n-form>
<router-view></router-view>
</div>
</n-space>
</template>
<style scoped>
.title {
margin-bottom: 16px;
}
.contestTitle {
font-weight: 500;
margin: 0;

View File

@@ -119,31 +119,29 @@ function rowProps(row: Contest) {
}
</script>
<template>
<n-form label-placement="left" :inline="isDesktop">
<n-form-item label="状态">
<n-select
class="select"
:options="options"
v-model:value="query.status"
/>
</n-form-item>
<n-form-item label="搜索比赛标题">
<n-input placeholder="输入后回车或点击搜索" clearable @change="search" />
</n-form-item>
<n-form-item>
<n-space>
<n-button @click="search(query.keyword)">搜索</n-button>
<n-button @click="clear">重置</n-button>
</n-space>
</n-form-item>
</n-form>
<n-data-table
size="small"
striped
:columns="columns"
:data="data"
:row-props="rowProps"
/>
<n-space>
<n-form :show-feedback="false" label-placement="left" inline>
<n-form-item label="比赛状态">
<n-select
class="select"
:options="options"
v-model:value="query.status"
/>
</n-form-item>
<n-form-item label="搜索">
<n-input clearable @change="search" />
</n-form-item>
</n-form>
<n-form label-placement="left" inline>
<n-form-item>
<n-space>
<n-button @click="search(query.keyword)">搜索</n-button>
<n-button @click="clear">重置</n-button>
</n-space>
</n-form-item>
</n-form>
</n-space>
<n-data-table striped :columns="columns" :data="data" :row-props="rowProps" />
<Pagination
v-model:limit="query.limit"
v-model:page="query.page"

View File

@@ -34,7 +34,6 @@ function rowProps(row: ProblemFiltered) {
<template>
<n-data-table
striped
size="small"
:data="contestStore.problems"
:columns="problemsColumns"
:row-props="rowProps"

View File

@@ -165,7 +165,6 @@ onMounted(() => {
striped
:single-line="false"
:scroll-x="1200"
size="small"
:columns="columns"
:data="data"
/>

View File

@@ -1,5 +1,4 @@
<script setup lang="ts">
import { Promotion, CloseBold, Select } from "@element-plus/icons-vue"
import Copy from "~/shared/Copy.vue"
import { code } from "oj/composables/code"
import { SOURCES } from "utils/constants"
@@ -78,18 +77,22 @@ async function test(sample: Sample, index: number) {
})
}
const icon = (status: ProblemStatus) =>
({
not_test: Promotion,
failed: CloseBold,
passed: Select,
}[status])
const type = (status: ProblemStatus) =>
({
function label(status: ProblemStatus, loading: boolean) {
if (loading) return "测试中"
return {
not_test: "测试",
failed: "不通过",
passed: "通过",
}[status]
}
function type(status: ProblemStatus) {
return {
not_test: "",
failed: "error",
passed: "success",
}[status] as "warning" | "error" | "success")
}[status] as "warning" | "error" | "success"
}
</script>
<template>
@@ -120,15 +123,12 @@ const type = (status: ProblemStatus) =>
<n-tooltip trigger="hover">
<template #trigger>
<n-button
size="small"
:type="type(sample.status)"
:disabled="disabled"
:loading="sample.loading"
circle
@click="test(sample, index)"
>
<template #icon>
<component :is="icon(sample.status)"></component>
</template>
{{ label(sample.status, sample.loading) }}
</n-button>
</template>
点击测试

View File

@@ -65,7 +65,7 @@ const options = {
</n-descriptions-item>
<n-descriptions-item :span="3" label="标签">
<n-space>
<n-tag type="info" v-for="tag in problem.tags" :key="tag">
<n-tag size="small" type="info" v-for="tag in problem.tags" :key="tag">
{{ tag }}
</n-tag>
</n-space>

View File

@@ -227,7 +227,6 @@ watch(
<n-card v-if="msg" embedded class="msg">{{ msg }}</n-card>
<n-data-table
v-if="infoTable.length"
size="small"
striped
:data="infoTable"
:columns="columns"

View File

@@ -2,7 +2,6 @@
import { useUserStore } from "~/shared/store/user"
import { filterEmptyValue, getTagColor } from "utils/functions"
import { ProblemFiltered } from "utils/types"
import { isMobile } from "~/shared/composables/breakpoints"
import { getProblemList, getRandomProblemID } from "oj/api"
import Pagination from "~/shared/Pagination.vue"
import { DataTableColumn, NSpace, NTag } from "naive-ui"
@@ -169,8 +168,8 @@ function rowProps(row: ProblemFiltered) {
</script>
<template>
<n-space :vertical="isMobile">
<n-form inline label-placement="left">
<n-space>
<n-form :show-feedback="false" inline label-placement="left">
<n-form-item label="难度">
<n-select
class="select"
@@ -178,12 +177,8 @@ function rowProps(row: ProblemFiltered) {
:options="difficultyOptions"
/>
</n-form-item>
<n-form-item>
<n-input
placeholder="输入编号或标题后回车"
clearable
@change="search"
/>
<n-form-item label="搜索">
<n-input clearable @change="search" />
</n-form-item>
</n-form>
<n-form inline label-placement="left">
@@ -212,7 +207,6 @@ function rowProps(row: ProblemFiltered) {
<n-data-table
class="table"
striped
size="small"
:data="problems"
:columns="columns"
:row-props="rowProps"

View File

@@ -69,6 +69,7 @@ const data = computed(() => ({
}))
const options = {
maintainAspectRatio: false,
plugins: {
title: {
text: "全校前十名的用户(不包括超管)",
@@ -79,10 +80,13 @@ const options = {
}
</script>
<template>
<Bar class="chart" :data="data" :options="options" />
<div class="chart">
<Bar :data="data" :options="options" />
</div>
</template>
<style scoped>
.chart {
margin-bottom: 24px;
height: 400px;
margin-bottom: 20px;
}
</style>

View File

@@ -73,7 +73,7 @@ onMounted(listRanks)
<template>
<Chart v-if="!!chart.length" :rankData="chart" />
<n-data-table striped size="small" :data="data" :columns="columns" />
<n-data-table striped :data="data" :columns="columns" />
<Pagination
:total="total"
v-model:page="query.page"

View File

@@ -67,7 +67,12 @@ onMounted(init)
</n-alert>
<n-card embedded>
<n-space justify="end">
<n-button type="primary" @click="handleCopy(submission!.code)">
<n-button
quaternary
class="copyBtn"
type="primary"
@click="handleCopy(submission!.code)"
>
{{ copied ? "已复制" : "复制代码" }}
</n-button>
</n-space>
@@ -90,4 +95,8 @@ onMounted(init)
.code {
font-size: 20px;
}
.copyBtn {
margin-bottom: 16px;
}
</style>

View File

@@ -128,6 +128,7 @@ const columns = computed(() => {
{
title: "编号",
key: "id",
minWidth: 160,
render: (row) => {
if (row.show_link) {
return h(
@@ -215,6 +216,7 @@ const columns = computed(() => {
h(
NButton,
{
quaternary: true,
size: "small",
type: "primary",
onClick: () => rejudge(row.id),
@@ -227,28 +229,32 @@ const columns = computed(() => {
})
</script>
<template>
<n-form :inline="isDesktop" label-placement="left">
<n-form-item label="提交状态">
<n-select
class="select"
v-model:value="query.result"
:options="options"
/>
</n-form-item>
<n-form-item label="只看自己">
<n-switch v-model:value="query.myself" />
</n-form-item>
<n-form-item label="搜索用户">
<n-input @change="search" clearable placeholder="输入后回车或点击搜索" />
</n-form-item>
<n-form-item>
<n-space>
<n-button @click="search(query.username)">搜索</n-button>
<n-button @click="clear">重置</n-button>
</n-space>
</n-form-item>
</n-form>
<n-data-table striped size="small" :columns="columns" :data="submissions" />
<n-space>
<n-form :show-feedback="false" inline label-placement="left">
<n-form-item label="提交状态">
<n-select
class="select"
v-model:value="query.result"
:options="options"
/>
</n-form-item>
<n-form-item label="只看自己">
<n-switch v-model:value="query.myself" />
</n-form-item>
</n-form>
<n-form inline label-placement="left">
<n-form-item label="搜索用户">
<n-input clearable @change="search" />
</n-form-item>
<n-form-item>
<n-space>
<n-button @click="search(query.username)">搜索</n-button>
<n-button @click="clear">重置</n-button>
</n-space>
</n-form-item>
</n-form>
</n-space>
<n-data-table striped :columns="columns" :data="submissions" />
<Pagination
:total="total"
v-model:limit="query.limit"

View File

@@ -6,7 +6,7 @@ import type { FormRules } from "naive-ui"
const userStore = useUserStore()
const loginRef = ref()
const [isLoading] = useToggle()
const [isLoading, toggleLoading] = useToggle()
const msg = ref("")
const form = reactive({
username: "",
@@ -21,11 +21,11 @@ const rules: FormRules = {
}
async function submit() {
loginRef.value?.validate(async (errors: FormRules | undefined) => {
loginRef.value!.validate(async (errors: FormRules | undefined) => {
if (!errors) {
try {
msg.value = ""
isLoading.value = true
toggleLoading(true)
await login(form)
} catch (err: any) {
if (err.data === "Your account has been disabled") {
@@ -36,7 +36,7 @@ async function submit() {
msg.value = "无法登录"
}
} finally {
isLoading.value = false
toggleLoading(false)
}
if (!msg.value) {
toggleLogin(false)
@@ -85,7 +85,7 @@ function goSignup() {
<n-button type="primary" :loading="isLoading" @click="submit">
登录
</n-button>
<n-button @click="goSignup">没有账号立即注册</n-button>
<n-button @click="goSignup">没有账号立即注册</n-button>
</n-space>
</n-form-item>
</n-form>

View File

@@ -41,7 +41,7 @@ watch(page, () => emit("update:page", page))
</template>
<style scoped>
.margin {
margin-top: 24px;
margin: 20px 0;
}
.right {
float: right;

View File

@@ -1,16 +1,43 @@
<script setup lang="ts">
import type { FormRules } from "naive-ui"
import { getCaptcha, signup, login } from "./api"
import { signupModal, toggleLogin, toggleSignup } from "./composables/modal"
import { useUserStore } from "./store/user"
import type { FormItemRule, FormRules } from "naive-ui"
const userStore = useUserStore()
const signupRef = ref()
const captchaSrc = ref("")
const form = reactive({
username: "",
email: "",
password: "",
passwordAgain: "",
email: "",
captcha: "",
})
const rules: FormRules = {}
const [isLoading] = useToggle()
const rules: FormRules = {
username: [{ required: true, message: "用户名必填", trigger: "blur" }],
email: [{ required: true, message: "邮箱必填", trigger: "blur" }],
password: [
{ required: true, message: "密码必填", trigger: "blur" },
{ min: 6, max: 20, message: "长度在 6 到 20 位之间", trigger: "input" },
],
passwordAgain: [
{ required: true, message: "密码必填", trigger: "blur" },
{ min: 6, max: 20, message: "长度在 6 到 20 位之间", trigger: "input" },
{
validator: (_: FormItemRule, value: string) => value === form.password,
message: "两次密码输入不一致",
trigger: "blur",
},
],
captcha: [
{ required: true, message: "验证码必填", trigger: "blur", min: 1, max: 10 },
],
}
const [isLoading, toggleLoading] = useToggle()
const msg = ref("")
function goLogin() {
@@ -18,7 +45,50 @@ function goLogin() {
toggleSignup(false)
}
function submit() {}
function submit() {
signupRef.value!.validate(async (errors: FormRules | undefined) => {
if (!errors) {
try {
msg.value = ""
toggleLoading(true)
await signup({
username: form.username,
email: form.email,
password: form.password,
captcha: form.captcha,
})
} catch (err: any) {
if (err.data === "Invalid captcha") {
msg.value = "验证码不正确"
} else if (err.data === "Username already exists") {
msg.value = "用户名已存在"
} else if (err.data === "Email already exists") {
msg.value = "邮箱已存在"
} else {
msg.value = "无法注册"
}
getCaptchaSrc()
form.captcha = ""
} finally {
toggleLoading(false)
}
if (!msg.value) {
toggleSignup(false)
await login({ username: form.username, password: form.password })
userStore.getMyProfile()
}
}
})
}
async function getCaptchaSrc() {
const res = await getCaptcha()
captchaSrc.value = res.data
}
watch(signupModal, (v) => {
if (v) getCaptchaSrc()
})
</script>
<template>
@@ -55,7 +125,7 @@ function submit() {}
name="signup password"
/>
</n-form-item>
<n-form-item label="确认密码" path="password">
<n-form-item label="确认密码" path="passwordAgain">
<n-input
v-model:value="form.passwordAgain"
clearable
@@ -63,11 +133,21 @@ function submit() {}
name="signup password again"
/>
</n-form-item>
<n-form-item label="验证码" path="captcha">
<n-space>
<n-input
v-model:value="form.captcha"
clearable
name="signup captcha"
/>
<img class="captcha" :src="captchaSrc" @click="getCaptchaSrc" />
</n-space>
</n-form-item>
<n-alert v-if="msg" type="error" :show-icon="false"> {{ msg }}</n-alert>
<n-form-item>
<n-space>
<n-button type="primary" :loading="isLoading" @click="submit">
登录
注册
</n-button>
<n-button @click="goLogin">已经注册现在登录</n-button>
</n-space>
@@ -76,4 +156,9 @@ function submit() {}
</n-modal>
</template>
<style scoped></style>
<style scoped>
.captcha {
height: 34px;
cursor: pointer;
}
</style>

View File

@@ -5,6 +5,15 @@ export function login(data: { username: string; password: string }) {
return http.post("login", data)
}
export function signup(data: {
username: string
email: string
password: string
captcha: string
}) {
return http.post("register", data)
}
export function logout() {
return http.get("logout")
}
@@ -16,3 +25,7 @@ export function getProfile(username: string = "") {
export function getProblemTagList() {
return http.get<Tag[]>("problem/tags")
}
export function getCaptcha() {
return http.get("captcha")
}

View File

@@ -5,7 +5,7 @@ import Header from "../Header.vue"
</script>
<template>
<n-layout>
<n-layout position="absolute">
<n-layout-header bordered class="header">
<Header />
</n-layout-header>