xuyue/ojnext
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

first commit.

Browse Source
This commit is contained in:
yuetsh
2023-01-04 10:20:18 +08:00
commit 919fcf5ba9
39 changed files with 4196 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
.gitignore vendored Normal file
View File

@@ -0,0 +1,24 @@
# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
pnpm-debug.log*
lerna-debug.log*
node_modules
dist
dist-ssr
*.local
# Editor directories and files
.vscode/*
!.vscode/extensions.json
.idea
.DS_Store
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?

3
.vscode/extensions.json vendored Normal file
View File

@@ -0,0 +1,3 @@
{
"recommendations": ["Vue.volar", "Vue.vscode-typescript-vue-plugin"]
}

18
README.md Normal file
View File

@@ -0,0 +1,18 @@
# Vue 3 + TypeScript + Vite
This template should help get you started developing with Vue 3 and TypeScript in Vite. The template uses Vue 3 `<script setup>` SFCs, check out the [script setup docs](https://v3.vuejs.org/api/sfc-script-setup.html#sfc-script-setup) to learn more.
## Recommended IDE Setup
- [VS Code](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur) + [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin).
## Type Support For `.vue` Imports in TS
TypeScript cannot handle type information for `.vue` imports by default, so we replace the `tsc` CLI with `vue-tsc` for type checking. In editors, we need [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin) to make the TypeScript language service aware of `.vue` types.
If the standalone TypeScript plugin doesn't feel fast enough to you, Volar has also implemented a [Take Over Mode](https://github.com/johnsoncodehk/volar/discussions/471#discussioncomment-1361669) that is more performant. You can enable it by the following steps:
1. Disable the built-in TypeScript Extension
1. Run `Extensions: Show Built-in Extensions` from VSCode's command palette
2. Find `TypeScript and JavaScript Language Features`, right click and select `Disable (Workspace)`
2. Reload the VSCode window by running `Developer: Reload Window` from the command palette.

5
auto-imports.d.ts vendored Normal file
View File

@@ -0,0 +1,5 @@
// Generated by 'unplugin-auto-import'
export {}
declare global {
}

35
components.d.ts vendored Normal file
View File

@@ -0,0 +1,35 @@
// generated by unplugin-vue-components
// We suggest you to commit this file into source control
// Read more: https://github.com/vuejs/core/pull/3399
import '@vue/runtime-core'
export {}
declare module '@vue/runtime-core' {
export interface GlobalComponents {
ElAlert: typeof import('element-plus/es')['ElAlert']
ElButton: typeof import('element-plus/es')['ElButton']
ElConfigProvider: typeof import('element-plus/es')['ElConfigProvider']
ElContainer: typeof import('element-plus/es')['ElContainer']
ElDialog: typeof import('element-plus/es')['ElDialog']
ElDropdown: typeof import('element-plus/es')['ElDropdown']
ElDropdownItem: typeof import('element-plus/es')['ElDropdownItem']
ElDropdownMenu: typeof import('element-plus/es')['ElDropdownMenu']
ElForm: typeof import('element-plus/es')['ElForm']
ElFormItem: typeof import('element-plus/es')['ElFormItem']
ElHeader: typeof import('element-plus/es')['ElHeader']
ElInput: typeof import('element-plus/es')['ElInput']
ElMain: typeof import('element-plus/es')['ElMain']
ElMenu: typeof import('element-plus/es')['ElMenu']
ElMenuItem: typeof import('element-plus/es')['ElMenuItem']
ElOption: typeof import('element-plus/es')['ElOption']
ElPagination: typeof import('element-plus/es')['ElPagination']
ElSelect: typeof import('element-plus/es')['ElSelect']
ElSpace: typeof import('element-plus/es')['ElSpace']
ElTable: typeof import('element-plus/es')['ElTable']
ElTableColumn: typeof import('element-plus/es')['ElTableColumn']
ElTag: typeof import('element-plus/es')['ElTag']
RouterLink: typeof import('vue-router')['RouterLink']
RouterView: typeof import('vue-router')['RouterView']
}
}

13
index.html Normal file
View File

@@ -0,0 +1,13 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>OJ</title>
</head>
<body>
<div id="app"></div>
<script type="module" src="/src/main.ts"></script>
</body>
</html>

3021
package-lock.json generated Normal file
View File

File diff suppressed because it is too large Load Diff

26
package.json Normal file
View File

@@ -0,0 +1,26 @@
{
"name": "oj-next",
"private": true,
"version": "0.0.0",
"type": "module",
"scripts": {
"start": "vite",
"build": "vue-tsc && vite build",
"preview": "vite preview"
},
"dependencies": {
"axios": "^1.2.2",
"element-plus": "^2.2.28",
"pinia": "^2.0.28",
"vue": "^3.2.45",
"vue-router": "^4.1.6"
},
"devDependencies": {
"@vitejs/plugin-vue": "^4.0.0",
"typescript": "^4.9.3",
"unplugin-auto-import": "^0.12.1",
"unplugin-vue-components": "^0.22.12",
"vite": "^4.0.0",
"vue-tsc": "^1.0.11"
}
}

1
public/vite.svg Normal file
View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.5 KiB

13
src/App.vue Normal file
View File

@@ -0,0 +1,13 @@
<script setup lang="ts">
import zhCn from "element-plus/dist/locale/zh-cn.mjs";
const locale = zhCn;
</script>
<template>
<el-config-provider :locale="locale">
<router-view></router-view>
</el-config-provider>
</template>
<style scoped></style>

10
src/admin/index.vue Normal file
View File

@@ -0,0 +1,10 @@
<script setup lang="ts">
</script>
<template>
<router-view></router-view>
</template>
<style scoped>
</style>

1
src/assets/vue.svg Normal file
View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="37.07" height="36" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 198"><path fill="#41B883" d="M204.8 0H256L128 220.8L0 0h97.92L128 51.2L157.44 0h47.36Z"></path><path fill="#41B883" d="m0 0l128 220.8L256 0h-51.2L128 132.48L50.56 0H0Z"></path><path fill="#35495E" d="M50.56 0L128 133.12L204.8 0h-47.36L128 51.2L97.92 0H50.56Z"></path></svg>
Side by Side

After

Width:  |  Height:  |  Size: 496 B

74
src/main.ts Normal file
View File

@@ -0,0 +1,74 @@
import { createApp } from "vue";
import { createRouter, createWebHistory } from "vue-router";
import { createPinia } from "pinia";
import "element-plus/theme-chalk/display.css";
import App from "./App.vue";
import Home from "./oj/index.vue";
import Problems from "./oj/problem/list.vue";
import storage from "./utils/storage";
import { STORAGE_KEY } from "./utils/constants";
import { useLoginStore } from "./shared/stores/login";
const routes = [
{
path: "/",
component: Home,
children: [
{ path: "", component: Problems },
{
path: "problem/:id",
component: () => import("./oj/problem/detail.vue"),
},
{
path: "status",
component: () => import("./oj/status/list.vue"),
meta: { requiresAuth: true },
},
{
path: "status/:id",
component: () => import("./oj/status/detail.vue"),
},
{
path: "contest",
component: () => import("./oj/contest/list.vue"),
meta: { requiresAuth: true },
},
{
path: "contest/:id",
component: () => import("./oj/contest/detail.vue"),
},
{
path: "rank",
component: () => import("./oj/rank/list.vue"),
},
],
},
{ path: "/admin", component: () => import("./admin/index.vue") },
];
const router = createRouter({
history: createWebHistory(),
routes,
});
router.beforeEach((to, from, next) => {
if (to.matched.some((record) => record.meta.requiresAuth)) {
if (!storage.get(STORAGE_KEY.AUTHED)) {
const login = useLoginStore();
login.show();
next("/");
} else {
next();
}
} else {
next();
}
});
const pinia = createPinia();
const app = createApp(App);
app.use(router);
app.use(pinia);
app.mount("#app");

58
src/oj/api.ts Normal file
View File

@@ -0,0 +1,58 @@
import { getACRate } from "./../utils/functions";
import http from "./../utils/http";
const difficultDict = {
Low: "简单",
Mid: "中等",
High: "困难",
};
function filterResult(result: any) {
const newResult = {
displayID: result._id,
title: result.title,
difficulty: difficultDict[<"Low" | "Mid" | "High">result.difficulty],
tags: result.tags,
submission: result.submission_number,
rate: getACRate(result.accepted_number, result.submission_number),
};
return newResult;
}
export async function getProblemList(
offset = 0,
limit = 10,
searchParams: any = {}
) {
let params: any = {
paging: true,
offset,
limit,
};
Object.keys(searchParams).forEach((element) => {
if (searchParams[element]) {
params[element] = searchParams[element];
}
});
const res = await http.get("problem", {
params,
});
return {
results: res.data.results.map(filterResult),
total: res.data.total,
};
}
export function getProblemTagList() {
return http.get("problem/tags");
}
export function getProblem(id: number) {
return http.get("problem", {
params: { problem_id: id },
});
}
export function getWebsite() {
return http.get("website");
}

68
src/oj/components/header.vue Normal file
View File

@@ -0,0 +1,68 @@
<script setup lang="ts">
import { useLoginStore } from "../../shared/stores/login";
import { useSignupStore } from "../stores/signup";
import { useUserStore } from "../../shared/stores/user";
import { onMounted } from "vue";
import { logout } from "../../shared/api";
import { useRouter } from "vue-router";
const loginStore = useLoginStore();
const signupStore = useSignupStore();
const userStore = useUserStore();
const router = useRouter();
async function handleLogout() {
await logout();
userStore.clearMyProfile();
router.replace("/");
}
function handleDropdown(command: string) {
switch (command) {
case "logout":
handleLogout();
break;
}
}
onMounted(userStore.getMyProfile);
</script>
<template>
<el-menu router mode="horizontal" :default-active="$route.path">
<el-menu-item index="/">题库</el-menu-item>
<el-menu-item index="/contest">竞赛</el-menu-item>
<el-menu-item index="/status">提交</el-menu-item>
<el-menu-item index="/rank">排名</el-menu-item>
</el-menu>
<div v-if="userStore.isLoaded && !userStore.isAuthed" class="actions">
<el-button @click="loginStore.show">登录</el-button>
<el-button @click="signupStore.show">注册</el-button>
</div>
<div v-if="userStore.isLoaded && userStore.isAuthed" class="actions">
<el-dropdown @command="handleDropdown">
<h3>{{ userStore.user.username }}</h3>
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item>我的主页</el-dropdown-item>
<el-dropdown-item>我的提交</el-dropdown-item>
<el-dropdown-item>我的设置</el-dropdown-item>
<el-dropdown-item v-if="userStore.isAdminRole">
后台管理
</el-dropdown-item>
<el-dropdown-item divided command="logout">退出</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
</div>
</template>
<style scoped>
.el-menu {
flex: 1;
}
.actions {
display: flex;
align-items: center;
}
</style>

0
src/oj/contest/detail.vue Normal file
View File

10
src/oj/contest/list.vue Normal file
View File

@@ -0,0 +1,10 @@
<script setup lang="ts">
</script>
<template>
contest list
</template>
<style scoped>
</style>

10
src/oj/contests/index.vue Normal file
View File

@@ -0,0 +1,10 @@
<script setup lang="ts">
</script>
<template>
contests
</template>
<style scoped>
</style>

22
src/oj/index.vue Normal file
View File

@@ -0,0 +1,22 @@
<script setup lang="ts">
import Login from "../shared/user/login.vue";
import Signup from "./user/signup.vue";
import Header from "./components/header.vue";
</script>
<template>
<el-container>
<el-header>
<Header />
</el-header>
<el-main><router-view></router-view></el-main>
<Login />
<Signup />
</el-container>
</template>
<style scoped>
.el-header {
display: flex;
}
</style>

10
src/oj/problem/detail.vue Normal file
View File

@@ -0,0 +1,10 @@
<script setup lang="ts">
</script>
<template>
problem id
</template>
<style scoped>
</style>

211
src/oj/problem/list.vue Normal file
View File

@@ -0,0 +1,211 @@
<script setup lang="ts">
import { onMounted, ref, reactive, watch, VueElement } from "vue";
import { useRoute, useRouter } from "vue-router";
import { filterEmptyValue } from "../../utils/functions";
import { getProblemList, getProblemTagList } from "../api";
const difficultyOptions = [
{ label: "全部", value: "" },
{ label: "简单", value: "Low" },
{ label: "中等", value: "Mid" },
{ label: "困难", value: "High" },
];
const router = useRouter();
const route = useRoute();
const problems = ref([]);
const tags = ref(<{ id: number; name: string }[]>[]);
const total = ref(0);
const query = reactive({
keyword: route.query.keyword || "",
difficulty: route.query.difficulty || "",
tag: route.query.tag || "",
page: parseInt(<string>route.query.page) || 1,
limit: parseInt(<string>route.query.limit) || 10,
});
function getTagColor(tag: string) {
return {
简单: "success",
中等: "",
困难: "danger",
}[tag];
}
async function listTags() {
const res = await getProblemTagList();
tags.value = res.data;
}
async function listProblems() {
query.keyword = route.query.keyword || "";
query.difficulty = route.query.difficulty || "";
query.tag = route.query.tag || "";
query.page = parseInt(<string>route.query.page) || 1;
query.limit = parseInt(<string>route.query.limit) || 10;
if (query.page < 1) query.page = 1;
const offset = (query.page - 1) * query.limit;
const res = await getProblemList(offset, query.limit, {
keyword: query.keyword,
tag: query.tag,
difficulty: query.difficulty,
});
total.value = res.total;
problems.value = res.results;
}
function routePush() {
router.push({
path: "/",
query: filterEmptyValue(query),
});
}
function search() {
query.page = 1;
routePush();
}
function clear() {
query.keyword = "";
query.tag = "";
query.difficulty = "";
query.page = 1;
routePush();
}
watch(() => query.page, routePush);
watch(
() => query.tag || query.difficulty || query.limit,
() => {
query.page = 1;
routePush();
}
);
watch(() => route.query, listProblems);
onMounted(() => {
listTags();
listProblems();
});
</script>
<template>
<el-form :inline="true">
<el-form-item label="难度">
<el-select v-model="query.difficulty">
<el-option
v-for="item in difficultyOptions"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="标签">
<el-select v-model="query.tag" clearable>
<el-option
v-for="item in tags"
:key="item.id"
:label="item.name"
:value="item.name"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="搜索">
<el-input
v-model="query.keyword"
placeholder="输入编号或标题后回车"
clearable
@change="search"
/>
</el-form-item>
<el-form-item>
<el-button type="" @click="clear">重置</el-button>
</el-form-item>
</el-form>
<el-table class="hidden-md-and-up" :data="problems" stripe>
<el-table-column prop="displayID" label="ID" width="80" />
<el-table-column prop="title" label="标题" />
<el-table-column label="难度" width="100">
<template #default="scope">
<el-tag disable-transitions :type="getTagColor(scope.row.difficulty)">
{{ scope.row.difficulty }}
</el-tag>
</template>
</el-table-column>
</el-table>
<el-table class="hidden-sm-and-down pointer" :data="problems" stripe>
<el-table-column prop="my_status" label="状态" width="80">
</el-table-column>
<el-table-column prop="displayID" label="编号" width="100" />
<el-table-column prop="title" label="标题" />
<el-table-column label="难度" width="100">
<template #default="scope">
<el-tag disable-transitions :type="getTagColor(scope.row.difficulty)">
{{ scope.row.difficulty }}
</el-tag>
</template>
</el-table-column>
<el-table-column label="标签" width="200">
<template #default="scope">
<el-space>
<el-tag
disable-transitions
v-for="tag in scope.row.tags"
:key="tag"
type="info"
>{{ tag }}</el-tag
>
</el-space>
</template>
</el-table-column>
<el-table-column prop="submission" label="提交数" width="100" />
<el-table-column prop="rate" label="通过率" width="100" />
</el-table>
<el-pagination
class="right hidden-md-and-up margin"
layout="sizes,prev,next"
background
:total="total"
:page-sizes="[10, 30, 50, 100]"
v-model:page-size="query.limit"
v-model:current-page="query.page"
/>
<el-pagination
class="right margin hidden-sm-and-down"
layout="sizes,prev,pager,next"
background
:total="total"
:page-sizes="[10, 30, 50, 100]"
v-model:page-size="query.limit"
v-model:current-page="query.page"
/>
</template>
<style scoped>
.margin {
margin-top: 24px;
}
.right {
float: right;
}
.pointer {
cursor: pointer;
}
.panel {
width: 400px;
padding: 0 4px;
}
.panel-tag {
margin: 4px;
}
</style>

10
src/oj/rank/list.vue Normal file
View File

@@ -0,0 +1,10 @@
<script setup lang="ts">
</script>
<template>
rank list
</template>
<style scoped>
</style>

0
src/oj/status/detail.vue Normal file
View File

10
src/oj/status/list.vue Normal file
View File

@@ -0,0 +1,10 @@
<script setup lang="ts">
</script>
<template>
status list
</template>
<style scoped>
</style>

16
src/oj/stores/signup.ts Normal file
View File

@@ -0,0 +1,16 @@
import { defineStore } from "pinia";
import { ref } from "vue";
export const useSignupStore = defineStore("signup", () => {
const visible = ref(false);
function show() {
visible.value = true;
}
function hide() {
visible.value = false;
}
return { visible, show, hide };
});

16
src/oj/user/signup.vue Normal file
View File

@@ -0,0 +1,16 @@
<script setup lang="ts">
import { useSignupStore } from "../stores/signup";
const store = useSignupStore();
</script>
<template>
<el-dialog
:close-on-click-modal="false"
:close-on-press-escape="false"
v-model="store.visible"
title="注册"
>
</el-dialog>
</template>
<style scoped></style>

15
src/shared/api.ts Normal file
View File

@@ -0,0 +1,15 @@
import http from "../utils/http";
export function login(data: { username: string; password: string }) {
return http.post("login", data);
}
export function logout() {
return http.get("logout");
}
export function getUserInfo(username: string) {
return http.get("profile", {
params: { username },
});
}

16
src/shared/stores/login.ts Normal file
View File

@@ -0,0 +1,16 @@
import { defineStore } from "pinia";
import { ref } from "vue";
export const useLoginStore = defineStore("login", () => {
const visible = ref(false);
function show() {
visible.value = true;
}
function hide() {
visible.value = false;
}
return { visible, show, hide };
});

51
src/shared/stores/user.ts Normal file
View File

@@ -0,0 +1,51 @@
import { defineStore } from "pinia";
import { computed, ref } from "vue";
import {
PROBLEM_PERMISSION,
STORAGE_KEY,
USER_TYPE,
} from "../../utils/constants";
import storage from "../../utils/storage";
import { getUserInfo } from "../api";
export const useUserStore = defineStore("user", () => {
const profile = ref<any>({});
const isLoaded = ref(false);
const user = computed(() => profile.value.user || {});
const isAuthed = computed(() => !!user.value.email);
const isAdminRole = computed(
() =>
user.value.admin_type === USER_TYPE.ADMIN ||
user.value.admin_type === USER_TYPE.SUPER_ADMIN
);
const isSuperAdmin = computed(
() => user.value.admin_type === USER_TYPE.SUPER_ADMIN
);
const hasProblemPermission = computed(
() => user.value.problem_permission !== PROBLEM_PERMISSION.NONE
);
async function getMyProfile() {
isLoaded.value = false;
const res = await getUserInfo("");
isLoaded.value = true;
profile.value = res.data || {};
storage.set(STORAGE_KEY.AUTHED, !!user.value.email);
}
function clearMyProfile() {
profile.value = {};
storage.clear();
}
return {
profile,
isLoaded,
user,
isAdminRole,
isSuperAdmin,
hasProblemPermission,
isAuthed,
getMyProfile,
clearMyProfile,
};
});

93
src/shared/user/login.vue Normal file
View File

@@ -0,0 +1,93 @@
<script setup lang="ts">
import { FormInstance } from "element-plus";
import { reactive, ref } from "vue";
import { useSignupStore } from "../../oj/stores/signup";
import { login } from "../../shared/api";
import { useLoginStore } from "../stores/login";
import { useUserStore } from "../stores/user";
const loginStore = useLoginStore();
const signupStore = useSignupStore();
const userStore = useUserStore();
const loading = ref(false);
const errorMessage = ref("");
const loginRef = ref<FormInstance>();
const form = reactive({
username: "",
password: "",
});
const rules = reactive({
username: [{ required: true, message: "用户名必填", trigger: "blur" }],
password: [
{ required: true, message: "密码必填", trigger: "blur" },
{ min: 6, max: 20, message: "长度在6到20位之间", trigger: "change" },
],
});
async function submit() {
if (!loginRef.value) return;
await loginRef.value.validate(async (valid) => {
if (valid) {
loading.value = true;
errorMessage.value = "";
try {
await login(form);
loginStore.hide();
await userStore.getMyProfile();
} catch (err) {
errorMessage.value = "用户名或密码不正确";
}
loading.value = false;
}
});
}
function goSignup() {
loginStore.hide();
signupStore.show();
}
</script>
<template>
<el-dialog
style="max-width: 400px"
:close-on-click-modal="false"
:close-on-press-escape="false"
v-model="loginStore.visible"
title="登录"
>
<el-form
ref="loginRef"
:model="form"
:rules="rules"
label-position="right"
label-width="70px"
>
<el-form-item label="用户名" required prop="username">
<el-input v-model="form.username"></el-input>
</el-form-item>
<el-form-item label="密码" required prop="password">
<el-input
v-model="form.password"
type="password"
show-password
@change="submit"
></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" :loading="loading" @click="submit"
>登录</el-button
>
<el-button @click="goSignup">没有账号，立即注册</el-button>
</el-form-item>
<el-alert
v-if="errorMessage"
:title="errorMessage"
show-icon
type="error"
/>
</el-form>
</el-dialog>
</template>
<style scoped></style>

81
src/style.css Normal file
View File

@@ -0,0 +1,81 @@
:root {
font-family: Inter, Avenir, Helvetica, Arial, sans-serif;
font-size: 16px;
line-height: 24px;
font-weight: 400;
color-scheme: light dark;
color: rgba(255, 255, 255, 0.87);
background-color: #242424;
font-synthesis: none;
text-rendering: optimizeLegibility;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
-webkit-text-size-adjust: 100%;
}
a {
font-weight: 500;
color: #646cff;
text-decoration: inherit;
}
a:hover {
color: #535bf2;
}
body {
margin: 0;
display: flex;
place-items: center;
min-width: 320px;
min-height: 100vh;
}
h1 {
font-size: 3.2em;
line-height: 1.1;
}
button {
border-radius: 8px;
border: 1px solid transparent;
padding: 0.6em 1.2em;
font-size: 1em;
font-weight: 500;
font-family: inherit;
background-color: #1a1a1a;
cursor: pointer;
transition: border-color 0.25s;
}
button:hover {
border-color: #646cff;
}
button:focus,
button:focus-visible {
outline: 4px auto -webkit-focus-ring-color;
}
.card {
padding: 2em;
}
#app {
max-width: 1280px;
margin: 0 auto;
padding: 2rem;
text-align: center;
}
@media (prefers-color-scheme: light) {
:root {
color: #213547;
background-color: #ffffff;
}
a:hover {
color: #747bff;
}
button {
background-color: #f9f9f9;
}
}

129
src/utils/constants.ts Normal file
View File

@@ -0,0 +1,129 @@
export const JUDGE_STATUS = {
"-2": {
name: "Compile Error",
short: "CE",
color: "yellow",
type: "warning",
},
"-1": {
name: "Wrong Answer",
short: "WA",
color: "red",
type: "error",
},
"0": {
name: "Accepted",
short: "AC",
color: "green",
type: "success",
},
"1": {
name: "Time Limit Exceeded",
short: "TLE",
color: "red",
type: "error",
},
"2": {
name: "Time Limit Exceeded",
short: "TLE",
color: "red",
type: "error",
},
"3": {
name: "Memory Limit Exceeded",
short: "MLE",
color: "red",
type: "error",
},
"4": {
name: "Runtime Error",
short: "RE",
color: "red",
type: "error",
},
"5": {
name: "System Error",
short: "SE",
color: "red",
type: "error",
},
"6": {
name: "Pending",
color: "yellow",
type: "warning",
},
"7": {
name: "Judging",
color: "blue",
type: "info",
},
"8": {
name: "Partial Accepted",
short: "PAC",
color: "blue",
type: "info",
},
"9": {
name: "Submitting",
color: "yellow",
type: "warning",
},
};
export const CONTEST_STATUS = {
NOT_START: "1",
UNDERWAY: "0",
ENDED: "-1",
};
export const CONTEST_STATUS_REVERSE = {
"1": {
name: "Not Started",
color: "yellow",
},
"0": {
name: "Underway",
color: "green",
},
"-1": {
name: "Ended",
color: "red",
},
};
export const RULE_TYPE = {
ACM: "ACM",
OI: "OI",
};
export const CONTEST_TYPE = {
PUBLIC: "Public",
PRIVATE: "Password Protected",
};
export const USER_TYPE = {
REGULAR_USER: "Regular User",
ADMIN: "Admin",
SUPER_ADMIN: "Super Admin",
};
export const PROBLEM_PERMISSION = {
NONE: "None",
OWN: "Own",
ALL: "All",
};
export const STORAGE_KEY = {
AUTHED: "authed",
PROBLEM_CODE: "problemCode",
USER: "user",
};
export function buildProblemCodeKey(problemID: number, contestID = null) {
if (contestID) {
return `${STORAGE_KEY.PROBLEM_CODE}_${contestID}_${problemID}`;
}
return `${STORAGE_KEY.PROBLEM_CODE}_NaN_${problemID}`;
}
export const GOOGLE_ANALYTICS_ID = "UA-111499601-1";

14
src/utils/functions.ts Normal file
View File

@@ -0,0 +1,14 @@
export function getACRate(acCount: number, totalCount: number) {
let rate = totalCount === 0 ? 0.0 : ((acCount / totalCount) * 100).toFixed(2);
return `${rate}%`;
}
export function filterEmptyValue(object: any) {
let query: any = {};
Object.keys(object).forEach((key) => {
if (object[key] || object[key] === 0 || object[key] === false) {
query[key] = object[key];
}
});
return query;
}

26
src/utils/http.ts Normal file
View File

@@ -0,0 +1,26 @@
import axios from "axios";
const http = axios.create({
baseURL: "/api",
xsrfHeaderName: "X-CSRFToken",
xsrfCookieName: "csrftoken",
});
// TODO
http.interceptors.response.use(
(res) => {
if (res.data.error) {
// 若后端返回为登录，则为session失效，应退出当前登录用户
if (res.data.data.startsWith("Please login")) {
}
return Promise.reject(res.data);
} else {
return Promise.resolve(res.data);
}
},
(err) => {
return Promise.reject(err);
}
);
export default http;

21
src/utils/storage.ts Normal file
View File

@@ -0,0 +1,21 @@
const localStorage = window.localStorage;
export default {
set(key: string, value: any) {
localStorage.setItem(key, JSON.stringify(value));
},
get(key: string) {
const content = localStorage.getItem(key);
if (content) {
return JSON.parse(content);
} else {
return null;
}
},
remove(key: string) {
localStorage.removeItem(key);
},
clear() {
localStorage.clear();
},
};

1
src/vite-env.d.ts vendored Normal file
View File

@@ -0,0 +1 @@
/// <reference types="vite/client" />

18
tsconfig.json Normal file
View File

@@ -0,0 +1,18 @@
{
"compilerOptions": {
"target": "ESNext",
"useDefineForClassFields": true,
"module": "ESNext",
"moduleResolution": "Node",
"strict": true,
"jsx": "preserve",
"resolveJsonModule": true,
"isolatedModules": true,
"esModuleInterop": true,
"lib": ["ESNext", "DOM"],
"skipLibCheck": true,
"noEmit": true
},
"include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"],
"references": [{ "path": "./tsconfig.node.json" }]
}

9
tsconfig.node.json Normal file
View File

@@ -0,0 +1,9 @@
{
"compilerOptions": {
"composite": true,
"module": "ESNext",
"moduleResolution": "Node",
"allowSyntheticDefaultImports": true
},
"include": ["vite.config.ts"]
}

37
vite.config.ts Normal file
View File

@@ -0,0 +1,37 @@
import { defineConfig } from "vite";
import vue from "@vitejs/plugin-vue";
import AutoImport from "unplugin-auto-import/vite";
import Components from "unplugin-vue-components/vite";
import { ElementPlusResolver } from "unplugin-vue-components/resolvers";
const url = "https://oj.hyyz.izhai.net";
// https://vitejs.dev/config/
export default defineConfig({
plugins: [
vue(),
AutoImport({
resolvers: [ElementPlusResolver()],
}),
Components({
resolvers: [ElementPlusResolver()],
}),
],
server: {
proxy: {
"/api": {
target: url,
changeOrigin: true,
headers: {
Referer: url,
},
},
"/public": {
target: url,
changeOrigin: true,
headers: {
Referer: url,
},
},
},
},
});