add submissions.
This commit is contained in:
@@ -1,84 +1,84 @@
|
||||
<script lang="ts" setup>
|
||||
import { TabsPaneContext } from "element-plus"
|
||||
import { SOURCES } from "utils/constants"
|
||||
import { Problem } from "utils/types"
|
||||
import Monaco from "~/shared/Monaco/index.vue"
|
||||
import { useCodeStore } from "oj/store/code"
|
||||
|
||||
import SubmitPanel from "./SubmitPanel.vue"
|
||||
import TestcasePanel from "./TestcasePanel.vue"
|
||||
|
||||
interface Props {
|
||||
problem: Problem
|
||||
}
|
||||
|
||||
const props = defineProps<Props>()
|
||||
|
||||
const { code } = useCodeStore()
|
||||
|
||||
code.language = props.problem.languages[0] || "C"
|
||||
code.value = props.problem.template[code.language] || SOURCES[code.language]
|
||||
|
||||
const tab = ref("test")
|
||||
const submitPanelRef = ref<{ submit: Function }>()
|
||||
|
||||
watch(() => code.language, reset)
|
||||
|
||||
function reset() {
|
||||
code.value = props.problem.template[code.language] || SOURCES[code.language]
|
||||
}
|
||||
|
||||
function change(value: string) {
|
||||
code.value = value
|
||||
}
|
||||
|
||||
function onTab(pane: TabsPaneContext) {
|
||||
if (pane.paneName === "submit") {
|
||||
submitPanelRef && submitPanelRef.value!.submit()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<el-form inline>
|
||||
<el-form-item label="语言" label-width="60">
|
||||
<el-select v-model="code.language" class="language">
|
||||
<el-option v-for="item in problem.languages" :key="item" :value="item">
|
||||
<img class="logo" :src="`/${item}.svg`" alt="logo" />
|
||||
<span>{{ item }}</span>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button @click="reset">重置</el-button>
|
||||
<el-button @click="$router.push(`/status?problem=${problem.id}`)">
|
||||
提交信息
|
||||
</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<Monaco
|
||||
class="editor"
|
||||
:language="code.language"
|
||||
:value="code.value"
|
||||
@change="change"
|
||||
height="calc(100vh - 621px)"
|
||||
/>
|
||||
<el-tabs type="border-card" @tab-click="onTab" v-model="tab">
|
||||
<TestcasePanel />
|
||||
<SubmitPanel ref="submitPanelRef" />
|
||||
</el-tabs>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.language {
|
||||
width: 110px;
|
||||
}
|
||||
|
||||
.editor {
|
||||
min-height: 200px;
|
||||
}
|
||||
|
||||
.logo {
|
||||
width: 12px;
|
||||
}
|
||||
</style>
|
||||
<script lang="ts" setup>
|
||||
import { TabsPaneContext } from "element-plus"
|
||||
import { SOURCES } from "utils/constants"
|
||||
import { Problem } from "utils/types"
|
||||
import Monaco from "~/shared/Monaco/index.vue"
|
||||
import { useCodeStore } from "oj/store/code"
|
||||
|
||||
const SubmitPanel = defineAsyncComponent(() => import("./SubmitPanel.vue"))
|
||||
const TestcasePanel = defineAsyncComponent(() => import("./TestcasePanel.vue"))
|
||||
|
||||
interface Props {
|
||||
problem: Problem
|
||||
}
|
||||
|
||||
const props = defineProps<Props>()
|
||||
|
||||
const { code } = useCodeStore()
|
||||
|
||||
code.language = props.problem.languages[0] || "C"
|
||||
code.value = props.problem.template[code.language] || SOURCES[code.language]
|
||||
|
||||
const tab = ref("test")
|
||||
const submitPanelRef = ref<{ submit: Function }>()
|
||||
|
||||
watch(() => code.language, reset)
|
||||
|
||||
function reset() {
|
||||
code.value = props.problem.template[code.language] || SOURCES[code.language]
|
||||
}
|
||||
|
||||
function change(value: string) {
|
||||
code.value = value
|
||||
}
|
||||
|
||||
function onTab(pane: TabsPaneContext) {
|
||||
if (pane.paneName === "submit") {
|
||||
submitPanelRef && submitPanelRef.value!.submit()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<el-form inline>
|
||||
<el-form-item label="语言" label-width="60">
|
||||
<el-select v-model="code.language" class="language">
|
||||
<el-option v-for="item in problem.languages" :key="item" :value="item">
|
||||
<img class="logo" :src="`/${item}.svg`" alt="logo" />
|
||||
<span>{{ item }}</span>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button @click="reset">重置</el-button>
|
||||
<el-button @click="$router.push(`/status?problem=${problem._id}`)">
|
||||
提交信息
|
||||
</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<Monaco
|
||||
class="editor"
|
||||
:language="code.language"
|
||||
:value="code.value"
|
||||
@change="change"
|
||||
height="calc(100vh - 621px)"
|
||||
/>
|
||||
<el-tabs type="border-card" @tab-click="onTab" v-model="tab">
|
||||
<TestcasePanel />
|
||||
<SubmitPanel ref="submitPanelRef" />
|
||||
</el-tabs>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.language {
|
||||
width: 110px;
|
||||
}
|
||||
|
||||
.editor {
|
||||
min-height: 200px;
|
||||
}
|
||||
|
||||
.logo {
|
||||
width: 12px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,180 +1,180 @@
|
||||
<script setup lang="ts">
|
||||
import { Flag, CloseBold, Select, CopyDocument } from "@element-plus/icons-vue"
|
||||
import copy from "copy-text-to-clipboard"
|
||||
import { useCodeStore } from "oj/store/code"
|
||||
import { SOURCES } from "utils/constants"
|
||||
import { Problem } from "utils/types"
|
||||
import { createTestSubmission } from "utils/judge"
|
||||
import { submissionExists } from "oj/api"
|
||||
|
||||
interface Props {
|
||||
problem: Problem
|
||||
}
|
||||
type Sample = Problem["samples"][number] & {
|
||||
id: number
|
||||
msg: string
|
||||
status: "passed" | "failed" | "not_test"
|
||||
loading: boolean
|
||||
}
|
||||
|
||||
const props = defineProps<Props>()
|
||||
const route = useRoute()
|
||||
const contestID = <string>route.params.contestID
|
||||
const { data: hasSolved, execute } = submissionExists(props.problem.id)
|
||||
if (contestID) {
|
||||
execute()
|
||||
}
|
||||
const samples = ref<Sample[]>(
|
||||
props.problem.samples.map((sample, index) => ({
|
||||
...sample,
|
||||
id: index,
|
||||
msg: "",
|
||||
status: "not_test",
|
||||
loading: false,
|
||||
}))
|
||||
)
|
||||
const { code } = useCodeStore()
|
||||
|
||||
const disabled = computed(
|
||||
() =>
|
||||
!!(
|
||||
code.value.trim() === "" ||
|
||||
code.value === props.problem.template[code.language] ||
|
||||
code.value === SOURCES[code.language]
|
||||
)
|
||||
)
|
||||
async function test(sample: Sample, index: number) {
|
||||
samples.value = samples.value.map((sample) => {
|
||||
if (sample.id === index) {
|
||||
sample.loading = true
|
||||
}
|
||||
return sample
|
||||
})
|
||||
const res = await createTestSubmission(code, sample.input)
|
||||
samples.value = samples.value.map((sample) => {
|
||||
if (sample.id === index) {
|
||||
const status =
|
||||
res.status === 3 && res.output.trim() === sample.output
|
||||
? "passed"
|
||||
: "failed"
|
||||
return {
|
||||
...sample,
|
||||
msg: res.output,
|
||||
status: status,
|
||||
loading: false,
|
||||
}
|
||||
} else {
|
||||
return sample
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
const icon = (status: Sample["status"]) =>
|
||||
({
|
||||
not_test: Flag,
|
||||
failed: CloseBold,
|
||||
passed: Select,
|
||||
}[status])
|
||||
const type = (status: Sample["status"]) =>
|
||||
({
|
||||
not_test: "warning",
|
||||
failed: "danger",
|
||||
passed: "success",
|
||||
}[status])
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<el-alert
|
||||
v-if="problem.my_status === 0 || (contestID && hasSolved)"
|
||||
type="success"
|
||||
:closable="false"
|
||||
center
|
||||
title="🎉 本 题 已 经 被 你 解 决 啦"
|
||||
effect="dark"
|
||||
>
|
||||
</el-alert>
|
||||
|
||||
<h1>{{ problem.title }}</h1>
|
||||
<p class="title">描述</p>
|
||||
<div class="content" v-html="problem.description"></div>
|
||||
|
||||
<p class="title">输入</p>
|
||||
<div class="content" v-html="problem.input_description"></div>
|
||||
|
||||
<p class="title">输出</p>
|
||||
<div class="content" v-html="problem.output_description"></div>
|
||||
|
||||
<div v-if="problem.hint">
|
||||
<p class="title">提示</p>
|
||||
<el-card shadow="never">
|
||||
<div class="content" v-html="problem.hint"></div>
|
||||
</el-card>
|
||||
</div>
|
||||
|
||||
<div v-for="(sample, index) of samples" :key="index">
|
||||
<el-space>
|
||||
<p class="title testcaseTitle">测试用例 {{ index + 1 }}</p>
|
||||
<el-button
|
||||
:icon="icon(sample.status)"
|
||||
:type="type(sample.status)"
|
||||
:disabled="disabled"
|
||||
:loading="sample.loading"
|
||||
circle
|
||||
@click="test(sample, index)"
|
||||
></el-button>
|
||||
</el-space>
|
||||
<el-descriptions border direction="vertical" :column="2">
|
||||
<el-descriptions-item width="50%">
|
||||
<template #label>
|
||||
<el-space>
|
||||
<span>输入</span>
|
||||
<el-icon @click="copy(sample.input)"><CopyDocument /> </el-icon>
|
||||
</el-space>
|
||||
</template>
|
||||
<div class="testcase">{{ sample.input }}</div>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item width="50%">
|
||||
<template #label>
|
||||
<el-space>
|
||||
<span>输出</span>
|
||||
<el-icon @click="copy(sample.output)"><CopyDocument /> </el-icon>
|
||||
</el-space>
|
||||
</template>
|
||||
<div class="testcase">{{ sample.output }}</div>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="运行结果" v-if="sample.status === 'failed'">
|
||||
<div class="testcase">{{ sample.msg }}</div>
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</div>
|
||||
|
||||
<div v-if="problem.source">
|
||||
<p class="title">来源</p>
|
||||
<div class="content" v-html="problem.source"></div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.title {
|
||||
font-size: 20px;
|
||||
margin: 24px 0 16px 0;
|
||||
color: var(--el-color-primary);
|
||||
}
|
||||
|
||||
.testcaseTitle {
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
|
||||
.content {
|
||||
line-height: 2;
|
||||
}
|
||||
|
||||
.label {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.testcase {
|
||||
white-space: pre;
|
||||
}
|
||||
</style>
|
||||
<script setup lang="ts">
|
||||
import { Flag, CloseBold, Select, CopyDocument } from "@element-plus/icons-vue"
|
||||
import copy from "copy-text-to-clipboard"
|
||||
import { useCodeStore } from "oj/store/code"
|
||||
import { SOURCES } from "utils/constants"
|
||||
import { Problem, ProblemStatus } from "utils/types"
|
||||
import { createTestSubmission } from "utils/judge"
|
||||
import { submissionExists } from "oj/api"
|
||||
|
||||
interface Props {
|
||||
problem: Problem
|
||||
}
|
||||
type Sample = Problem["samples"][number] & {
|
||||
id: number
|
||||
msg: string
|
||||
status: ProblemStatus
|
||||
loading: boolean
|
||||
}
|
||||
|
||||
const props = defineProps<Props>()
|
||||
const route = useRoute()
|
||||
const contestID = <string>route.params.contestID
|
||||
const { data: hasSolved, execute } = submissionExists(props.problem.id)
|
||||
if (contestID) {
|
||||
execute()
|
||||
}
|
||||
const samples = ref<Sample[]>(
|
||||
props.problem.samples.map((sample, index) => ({
|
||||
...sample,
|
||||
id: index,
|
||||
msg: "",
|
||||
status: "not_test",
|
||||
loading: false,
|
||||
}))
|
||||
)
|
||||
const { code } = useCodeStore()
|
||||
|
||||
const disabled = computed(
|
||||
() =>
|
||||
!!(
|
||||
code.value.trim() === "" ||
|
||||
code.value === props.problem.template[code.language] ||
|
||||
code.value === SOURCES[code.language]
|
||||
)
|
||||
)
|
||||
async function test(sample: Sample, index: number) {
|
||||
samples.value = samples.value.map((sample) => {
|
||||
if (sample.id === index) {
|
||||
sample.loading = true
|
||||
}
|
||||
return sample
|
||||
})
|
||||
const res = await createTestSubmission(code, sample.input)
|
||||
samples.value = samples.value.map((sample) => {
|
||||
if (sample.id === index) {
|
||||
const status =
|
||||
res.status === 3 && res.output.trim() === sample.output
|
||||
? "passed"
|
||||
: "failed"
|
||||
return {
|
||||
...sample,
|
||||
msg: res.output,
|
||||
status: status,
|
||||
loading: false,
|
||||
}
|
||||
} else {
|
||||
return sample
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
const icon = (status: Sample["status"]) =>
|
||||
({
|
||||
not_test: Flag,
|
||||
failed: CloseBold,
|
||||
passed: Select,
|
||||
}[status])
|
||||
const type = (status: Sample["status"]) =>
|
||||
({
|
||||
not_test: "warning",
|
||||
failed: "danger",
|
||||
passed: "success",
|
||||
}[status])
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<el-alert
|
||||
v-if="problem.my_status === 0 || (contestID && hasSolved)"
|
||||
type="success"
|
||||
:closable="false"
|
||||
center
|
||||
title="🎉 本 题 已 经 被 你 解 决 啦"
|
||||
effect="dark"
|
||||
>
|
||||
</el-alert>
|
||||
|
||||
<h1>{{ problem.title }}</h1>
|
||||
<p class="title">描述</p>
|
||||
<div class="content" v-html="problem.description"></div>
|
||||
|
||||
<p class="title">输入</p>
|
||||
<div class="content" v-html="problem.input_description"></div>
|
||||
|
||||
<p class="title">输出</p>
|
||||
<div class="content" v-html="problem.output_description"></div>
|
||||
|
||||
<div v-if="problem.hint">
|
||||
<p class="title">提示</p>
|
||||
<el-card shadow="never">
|
||||
<div class="content" v-html="problem.hint"></div>
|
||||
</el-card>
|
||||
</div>
|
||||
|
||||
<div v-for="(sample, index) of samples" :key="index">
|
||||
<el-space>
|
||||
<p class="title testcaseTitle">测试用例 {{ index + 1 }}</p>
|
||||
<el-button
|
||||
:icon="icon(sample.status)"
|
||||
:type="type(sample.status)"
|
||||
:disabled="disabled"
|
||||
:loading="sample.loading"
|
||||
circle
|
||||
@click="test(sample, index)"
|
||||
></el-button>
|
||||
</el-space>
|
||||
<el-descriptions border direction="vertical" :column="2">
|
||||
<el-descriptions-item width="50%">
|
||||
<template #label>
|
||||
<el-space>
|
||||
<span>输入</span>
|
||||
<el-icon @click="copy(sample.input)"><CopyDocument /> </el-icon>
|
||||
</el-space>
|
||||
</template>
|
||||
<div class="testcase">{{ sample.input }}</div>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item width="50%">
|
||||
<template #label>
|
||||
<el-space>
|
||||
<span>输出</span>
|
||||
<el-icon @click="copy(sample.output)"><CopyDocument /> </el-icon>
|
||||
</el-space>
|
||||
</template>
|
||||
<div class="testcase">{{ sample.output }}</div>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="运行结果" v-if="sample.status === 'failed'">
|
||||
<div class="testcase">{{ sample.msg }}</div>
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</div>
|
||||
|
||||
<div v-if="problem.source">
|
||||
<p class="title">来源</p>
|
||||
<div class="content" v-html="problem.source"></div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.title {
|
||||
font-size: 20px;
|
||||
margin: 24px 0 16px 0;
|
||||
color: var(--el-color-primary);
|
||||
}
|
||||
|
||||
.testcaseTitle {
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
|
||||
.content {
|
||||
line-height: 2;
|
||||
}
|
||||
|
||||
.label {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.testcase {
|
||||
white-space: pre;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,63 +1,60 @@
|
||||
<script setup lang="ts">
|
||||
import { DIFFICULTY } from "utils/constants"
|
||||
import { getACRate, getTagColor, parseTime } from "utils/functions"
|
||||
import { isDesktop } from "~/shared/composables/breakpoints"
|
||||
import { Problem } from "utils/types"
|
||||
|
||||
interface Props {
|
||||
problem: Problem
|
||||
}
|
||||
defineProps<Props>()
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<el-descriptions border :column="isDesktop ? 3 : 1">
|
||||
<el-descriptions-item label="编号">
|
||||
{{ problem._id }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="出题人">
|
||||
{{ problem.created_by.username }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="创建时间">
|
||||
{{ parseTime(problem.create_time) }}
|
||||
</el-descriptions-item>
|
||||
|
||||
<el-descriptions-item label="时间限制">
|
||||
{{ problem.time_limit }}毫秒
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="内存限制">
|
||||
{{ problem.memory_limit }}MB
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="难度">
|
||||
<el-tag
|
||||
disable-transitions
|
||||
:type="(getTagColor(problem.difficulty) as any)"
|
||||
>
|
||||
{{ DIFFICULTY[problem.difficulty] }}
|
||||
</el-tag>
|
||||
</el-descriptions-item>
|
||||
|
||||
<el-descriptions-item label="提交正确">
|
||||
{{ problem.accepted_number }}次
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="提交错误">
|
||||
{{ problem.submission_number - problem.accepted_number }}次
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="正确率">
|
||||
{{ getACRate(problem.accepted_number, problem.submission_number) }}
|
||||
</el-descriptions-item>
|
||||
|
||||
<el-descriptions-item :span="3" label="标签">
|
||||
<el-space>
|
||||
<el-tag
|
||||
disable-transitions
|
||||
type="info"
|
||||
v-for="tag in problem.tags"
|
||||
:key="tag"
|
||||
>
|
||||
{{ tag }}
|
||||
</el-tag>
|
||||
</el-space>
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { DIFFICULTY } from "utils/constants"
|
||||
import { getACRate, getTagColor, parseTime } from "utils/functions"
|
||||
import { isDesktop } from "~/shared/composables/breakpoints"
|
||||
import { Problem } from "utils/types"
|
||||
|
||||
interface Props {
|
||||
problem: Problem
|
||||
}
|
||||
defineProps<Props>()
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<el-descriptions border :column="isDesktop ? 3 : 1">
|
||||
<el-descriptions-item label="编号">
|
||||
{{ problem._id }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="出题人">
|
||||
{{ problem.created_by.username }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="创建时间">
|
||||
{{ parseTime(problem.create_time) }}
|
||||
</el-descriptions-item>
|
||||
|
||||
<el-descriptions-item label="时间限制">
|
||||
{{ problem.time_limit }}毫秒
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="内存限制">
|
||||
{{ problem.memory_limit }}MB
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="难度">
|
||||
<el-tag disable-transitions :type="getTagColor(problem.difficulty)">
|
||||
{{ DIFFICULTY[problem.difficulty] }}
|
||||
</el-tag>
|
||||
</el-descriptions-item>
|
||||
|
||||
<el-descriptions-item label="提交正确">
|
||||
{{ problem.accepted_number }}次
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="提交错误">
|
||||
{{ problem.submission_number - problem.accepted_number }}次
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="正确率">
|
||||
{{ getACRate(problem.accepted_number, problem.submission_number) }}
|
||||
</el-descriptions-item>
|
||||
|
||||
<el-descriptions-item :span="3" label="标签">
|
||||
<el-space>
|
||||
<el-tag
|
||||
disable-transitions
|
||||
type="info"
|
||||
v-for="tag in problem.tags"
|
||||
:key="tag"
|
||||
>
|
||||
{{ tag }}
|
||||
</el-tag>
|
||||
</el-space>
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</template>
|
||||
|
||||
@@ -1,231 +1,231 @@
|
||||
<script setup lang="ts">
|
||||
import party from "party-js"
|
||||
import { Ref } from "vue"
|
||||
import { SOURCES, JUDGE_STATUS, SubmissionStatus } from "utils/constants"
|
||||
import { submissionMemoryFormat, submissionTimeFormat } from "utils/functions"
|
||||
import { Problem, Submission, SubmitCodePayload } from "utils/types"
|
||||
import { getSubmission, submitCode } from "oj/api"
|
||||
import { useCodeStore } from "oj/store/code"
|
||||
|
||||
import SubmissionResultTag from "../../components/SubmissionResultTag.vue"
|
||||
|
||||
const problem = inject<Ref<Problem>>("problem")
|
||||
const { code } = useCodeStore()
|
||||
|
||||
const route = useRoute()
|
||||
const contestID = <string>route.params.contestID ?? ""
|
||||
|
||||
const submissionId = ref("")
|
||||
const submission = ref<Submission | null>(null)
|
||||
|
||||
const [submitted] = useToggle()
|
||||
|
||||
const { start: submitPending, isPending } = useTimeout(5000, {
|
||||
controls: true,
|
||||
immediate: false,
|
||||
})
|
||||
|
||||
const { start: fetchSubmission } = useTimeoutFn(
|
||||
async () => {
|
||||
const res = await getSubmission(submissionId.value)
|
||||
submission.value = res.data
|
||||
const result = submission.value.result
|
||||
if (
|
||||
result === SubmissionStatus.judging ||
|
||||
result === SubmissionStatus.pending
|
||||
) {
|
||||
fetchSubmission()
|
||||
} else {
|
||||
submitted.value = false
|
||||
}
|
||||
},
|
||||
2000,
|
||||
{ immediate: false }
|
||||
)
|
||||
|
||||
const judging = computed(
|
||||
() =>
|
||||
!!(submission.value && submission.value.result === SubmissionStatus.judging)
|
||||
)
|
||||
|
||||
const pending = computed(
|
||||
() =>
|
||||
!!(submission.value && submission.value.result === SubmissionStatus.pending)
|
||||
)
|
||||
|
||||
const submitting = computed(
|
||||
() =>
|
||||
!!(
|
||||
submission.value &&
|
||||
submission.value.result === SubmissionStatus.submitting
|
||||
)
|
||||
)
|
||||
|
||||
const submitDisabled = computed(() => {
|
||||
const value = code.value
|
||||
if (
|
||||
value.trim() === "" ||
|
||||
value === problem!.value.template[code.language] ||
|
||||
value === SOURCES[code.language]
|
||||
) {
|
||||
return true
|
||||
}
|
||||
if (judging.value || pending.value || submitting.value) {
|
||||
return true
|
||||
}
|
||||
if (submitted.value) {
|
||||
return true
|
||||
}
|
||||
if (isPending.value) {
|
||||
return true
|
||||
}
|
||||
return false
|
||||
})
|
||||
|
||||
const submitLabel = computed(() => {
|
||||
if (submitting.value) {
|
||||
return "正在提交"
|
||||
}
|
||||
if (judging.value || pending.value) {
|
||||
return "正在评分"
|
||||
}
|
||||
if (isPending.value) {
|
||||
return "运行结果"
|
||||
}
|
||||
return "点击提交"
|
||||
})
|
||||
|
||||
const msg = computed(() => {
|
||||
let msg = ""
|
||||
const result = submission.value && submission.value.result
|
||||
if (
|
||||
result === SubmissionStatus.compile_error ||
|
||||
result === SubmissionStatus.runtime_error
|
||||
) {
|
||||
msg += "请仔细检查，看看代码的格式是不是写错了！\n\n"
|
||||
}
|
||||
if (
|
||||
submission.value &&
|
||||
submission.value.statistic_info &&
|
||||
submission.value.statistic_info.err_info
|
||||
) {
|
||||
msg += submission.value.statistic_info.err_info
|
||||
}
|
||||
return msg
|
||||
})
|
||||
|
||||
const infoTable = computed(() => {
|
||||
if (
|
||||
submission.value &&
|
||||
submission.value.result !== SubmissionStatus.accepted &&
|
||||
submission.value.result !== SubmissionStatus.compile_error &&
|
||||
submission.value.result !== SubmissionStatus.runtime_error &&
|
||||
submission.value.info &&
|
||||
submission.value.info.data &&
|
||||
submission.value.info.data.length
|
||||
) {
|
||||
const data = submission.value.info.data
|
||||
if (data.some((item) => item.result === 0)) {
|
||||
return submission.value.info.data
|
||||
} else {
|
||||
return []
|
||||
}
|
||||
} else {
|
||||
return []
|
||||
}
|
||||
})
|
||||
|
||||
async function submit() {
|
||||
const data: SubmitCodePayload = {
|
||||
problem_id: problem!.value.id,
|
||||
language: code.language,
|
||||
code: code.value,
|
||||
}
|
||||
if (contestID) {
|
||||
data.contest_id = parseInt(contestID)
|
||||
}
|
||||
submission.value = { result: 9 } as Submission
|
||||
const res = await submitCode(data)
|
||||
submissionId.value = res.data.submission_id
|
||||
// 防止重复提交
|
||||
submitPending()
|
||||
submitted.value = true
|
||||
// 查询结果
|
||||
fetchSubmission()
|
||||
}
|
||||
|
||||
watch(
|
||||
() => submission?.value?.result,
|
||||
(result) => {
|
||||
if (result === SubmissionStatus.accepted) {
|
||||
party.confetti(document.body, {
|
||||
count: party.variation.range(200, 400),
|
||||
size: party.variation.skew(2, 0.3),
|
||||
})
|
||||
}
|
||||
}
|
||||
)
|
||||
|
||||
defineExpose({ submit })
|
||||
</script>
|
||||
<template>
|
||||
<el-tab-pane :disabled="submitDisabled" name="submit">
|
||||
<template #label>
|
||||
<el-space :size="2">
|
||||
<el-icon>
|
||||
<i-ep-loading v-if="judging || pending || submitting" />
|
||||
<i-ep-bell v-else-if="isPending" />
|
||||
<i-ep-caret-right v-else />
|
||||
</el-icon>
|
||||
<span>{{ submitLabel }}</span>
|
||||
</el-space>
|
||||
</template>
|
||||
<div class="panel">
|
||||
<el-alert
|
||||
v-if="submission"
|
||||
:closable="false"
|
||||
:type="(JUDGE_STATUS[submission.result]['alertType'] as any)"
|
||||
:title="JUDGE_STATUS[submission.result]['name']"
|
||||
>
|
||||
</el-alert>
|
||||
<el-scrollbar v-if="msg" height="354" class="result">
|
||||
<div>{{ msg }}</div>
|
||||
</el-scrollbar>
|
||||
<el-table
|
||||
v-if="infoTable.length"
|
||||
max-height="354"
|
||||
:data="infoTable"
|
||||
stripe
|
||||
>
|
||||
<el-table-column prop="test_case" label="测试用例" align="center" />
|
||||
<el-table-column label="测试状态" width="120" align="center">
|
||||
<template #default="scope">
|
||||
<SubmissionResultTag v-if="scope.row" :result="scope.row.result" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="占用内存" align="center">
|
||||
<template #default="scope">
|
||||
{{ submissionMemoryFormat(scope.row.memory) }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="执行耗时" align="center">
|
||||
<template #default="scope">
|
||||
{{ submissionTimeFormat(scope.row.real_time) }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="signal" label="信号" align="center" />
|
||||
</el-table>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
</template>
|
||||
<style scoped>
|
||||
.panel {
|
||||
height: 400px;
|
||||
}
|
||||
|
||||
.result {
|
||||
margin-top: 12px;
|
||||
white-space: pre;
|
||||
line-height: 1.5;
|
||||
}
|
||||
</style>
|
||||
<script setup lang="ts">
|
||||
import party from "party-js"
|
||||
import { Ref } from "vue"
|
||||
import { SOURCES, JUDGE_STATUS, SubmissionStatus } from "utils/constants"
|
||||
import { submissionMemoryFormat, submissionTimeFormat } from "utils/functions"
|
||||
import { Problem, Submission, SubmitCodePayload } from "utils/types"
|
||||
import { getSubmission, submitCode } from "oj/api"
|
||||
import { useCodeStore } from "oj/store/code"
|
||||
|
||||
import SubmissionResultTag from "../../components/SubmissionResultTag.vue"
|
||||
|
||||
const problem = inject<Ref<Problem>>("problem")
|
||||
const { code } = useCodeStore()
|
||||
|
||||
const route = useRoute()
|
||||
const contestID = <string>route.params.contestID ?? ""
|
||||
|
||||
const submissionId = ref("")
|
||||
const submission = ref<Submission | null>(null)
|
||||
|
||||
const [submitted] = useToggle()
|
||||
|
||||
const { start: submitPending, isPending } = useTimeout(5000, {
|
||||
controls: true,
|
||||
immediate: false,
|
||||
})
|
||||
|
||||
const { start: fetchSubmission } = useTimeoutFn(
|
||||
async () => {
|
||||
const res = await getSubmission(submissionId.value)
|
||||
submission.value = res.data
|
||||
const result = submission.value.result
|
||||
if (
|
||||
result === SubmissionStatus.judging ||
|
||||
result === SubmissionStatus.pending
|
||||
) {
|
||||
fetchSubmission()
|
||||
} else {
|
||||
submitted.value = false
|
||||
}
|
||||
},
|
||||
2000,
|
||||
{ immediate: false }
|
||||
)
|
||||
|
||||
const judging = computed(
|
||||
() =>
|
||||
!!(submission.value && submission.value.result === SubmissionStatus.judging)
|
||||
)
|
||||
|
||||
const pending = computed(
|
||||
() =>
|
||||
!!(submission.value && submission.value.result === SubmissionStatus.pending)
|
||||
)
|
||||
|
||||
const submitting = computed(
|
||||
() =>
|
||||
!!(
|
||||
submission.value &&
|
||||
submission.value.result === SubmissionStatus.submitting
|
||||
)
|
||||
)
|
||||
|
||||
const submitDisabled = computed(() => {
|
||||
const value = code.value
|
||||
if (
|
||||
value.trim() === "" ||
|
||||
value === problem!.value.template[code.language] ||
|
||||
value === SOURCES[code.language]
|
||||
) {
|
||||
return true
|
||||
}
|
||||
if (judging.value || pending.value || submitting.value) {
|
||||
return true
|
||||
}
|
||||
if (submitted.value) {
|
||||
return true
|
||||
}
|
||||
if (isPending.value) {
|
||||
return true
|
||||
}
|
||||
return false
|
||||
})
|
||||
|
||||
const submitLabel = computed(() => {
|
||||
if (submitting.value) {
|
||||
return "正在提交"
|
||||
}
|
||||
if (judging.value || pending.value) {
|
||||
return "正在评分"
|
||||
}
|
||||
if (isPending.value) {
|
||||
return "运行结果"
|
||||
}
|
||||
return "点击提交"
|
||||
})
|
||||
|
||||
const msg = computed(() => {
|
||||
let msg = ""
|
||||
const result = submission.value && submission.value.result
|
||||
if (
|
||||
result === SubmissionStatus.compile_error ||
|
||||
result === SubmissionStatus.runtime_error
|
||||
) {
|
||||
msg += "请仔细检查，看看代码的格式是不是写错了！\n\n"
|
||||
}
|
||||
if (
|
||||
submission.value &&
|
||||
submission.value.statistic_info &&
|
||||
submission.value.statistic_info.err_info
|
||||
) {
|
||||
msg += submission.value.statistic_info.err_info
|
||||
}
|
||||
return msg
|
||||
})
|
||||
|
||||
const infoTable = computed(() => {
|
||||
if (
|
||||
submission.value &&
|
||||
submission.value.result !== SubmissionStatus.accepted &&
|
||||
submission.value.result !== SubmissionStatus.compile_error &&
|
||||
submission.value.result !== SubmissionStatus.runtime_error &&
|
||||
submission.value.info &&
|
||||
submission.value.info.data &&
|
||||
submission.value.info.data.length
|
||||
) {
|
||||
const data = submission.value.info.data
|
||||
if (data.some((item) => item.result === 0)) {
|
||||
return submission.value.info.data
|
||||
} else {
|
||||
return []
|
||||
}
|
||||
} else {
|
||||
return []
|
||||
}
|
||||
})
|
||||
|
||||
async function submit() {
|
||||
const data: SubmitCodePayload = {
|
||||
problem_id: problem!.value.id,
|
||||
language: code.language,
|
||||
code: code.value,
|
||||
}
|
||||
if (contestID) {
|
||||
data.contest_id = parseInt(contestID)
|
||||
}
|
||||
submission.value = { result: 9 } as Submission
|
||||
const res = await submitCode(data)
|
||||
submissionId.value = res.data.submission_id
|
||||
// 防止重复提交
|
||||
submitPending()
|
||||
submitted.value = true
|
||||
// 查询结果
|
||||
fetchSubmission()
|
||||
}
|
||||
|
||||
watch(
|
||||
() => submission?.value?.result,
|
||||
(result) => {
|
||||
if (result === SubmissionStatus.accepted) {
|
||||
party.confetti(document.body, {
|
||||
count: party.variation.range(200, 400),
|
||||
size: party.variation.skew(2, 0.3),
|
||||
})
|
||||
}
|
||||
}
|
||||
)
|
||||
|
||||
defineExpose({ submit })
|
||||
</script>
|
||||
<template>
|
||||
<el-tab-pane :disabled="submitDisabled" name="submit">
|
||||
<template #label>
|
||||
<el-space :size="2">
|
||||
<el-icon>
|
||||
<i-ep-loading v-if="judging || pending || submitting" />
|
||||
<i-ep-bell v-else-if="isPending" />
|
||||
<i-ep-caret-right v-else />
|
||||
</el-icon>
|
||||
<span>{{ submitLabel }}</span>
|
||||
</el-space>
|
||||
</template>
|
||||
<div class="panel">
|
||||
<el-alert
|
||||
v-if="submission"
|
||||
:closable="false"
|
||||
:type="JUDGE_STATUS[submission.result]['alertType']"
|
||||
:title="JUDGE_STATUS[submission.result]['name']"
|
||||
>
|
||||
</el-alert>
|
||||
<el-scrollbar v-if="msg" height="354" class="result">
|
||||
<div>{{ msg }}</div>
|
||||
</el-scrollbar>
|
||||
<el-table
|
||||
v-if="infoTable.length"
|
||||
max-height="354"
|
||||
:data="infoTable"
|
||||
stripe
|
||||
>
|
||||
<el-table-column prop="test_case" label="测试用例" align="center" />
|
||||
<el-table-column label="测试状态" width="120" align="center">
|
||||
<template #default="scope">
|
||||
<SubmissionResultTag v-if="scope.row" :result="scope.row.result" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="占用内存" align="center">
|
||||
<template #default="scope">
|
||||
{{ submissionMemoryFormat(scope.row.memory) }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="执行耗时" align="center">
|
||||
<template #default="scope">
|
||||
{{ submissionTimeFormat(scope.row.real_time) }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="signal" label="信号" align="center" />
|
||||
</el-table>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
</template>
|
||||
<style scoped>
|
||||
.panel {
|
||||
height: 400px;
|
||||
}
|
||||
|
||||
.result {
|
||||
margin-top: 12px;
|
||||
white-space: pre;
|
||||
line-height: 1.5;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,41 +1,41 @@
|
||||
<script setup lang="ts">
|
||||
import { createTestSubmission } from "utils/judge"
|
||||
import { useCodeStore } from "oj/store/code"
|
||||
|
||||
const input = ref("")
|
||||
const result = ref("")
|
||||
const { code } = useCodeStore()
|
||||
|
||||
async function submit() {
|
||||
const res = await createTestSubmission(code, input.value)
|
||||
result.value = res.output
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<el-tab-pane label="测试面板" name="test">
|
||||
<div class="panel">
|
||||
<el-form inline>
|
||||
<el-form-item label="输入">
|
||||
<el-input type="textarea" autosize v-model="input" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button @click="submit">运行</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-scrollbar height="345">
|
||||
<div class="msg">{{ result }}</div>
|
||||
</el-scrollbar>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.panel {
|
||||
height: 400px;
|
||||
}
|
||||
.msg {
|
||||
white-space: pre;
|
||||
line-height: 1.5;
|
||||
}
|
||||
</style>
|
||||
<script setup lang="ts">
|
||||
import { createTestSubmission } from "utils/judge"
|
||||
import { useCodeStore } from "oj/store/code"
|
||||
|
||||
const input = ref("")
|
||||
const result = ref("")
|
||||
const { code } = useCodeStore()
|
||||
|
||||
async function submit() {
|
||||
const res = await createTestSubmission(code, input.value)
|
||||
result.value = res.output
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<el-tab-pane label="测试面板" name="test">
|
||||
<div class="panel">
|
||||
<el-form inline>
|
||||
<el-form-item label="输入">
|
||||
<el-input type="textarea" autosize v-model="input" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button @click="submit">运行</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-scrollbar height="345">
|
||||
<div class="msg">{{ result }}</div>
|
||||
</el-scrollbar>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.panel {
|
||||
height: 400px;
|
||||
}
|
||||
.msg {
|
||||
white-space: pre;
|
||||
line-height: 1.5;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,10 +1,14 @@
|
||||
<script setup lang="ts">
|
||||
import Editor from "./components/Editor.vue"
|
||||
import ProblemContent from "./components/ProblemContent.vue"
|
||||
import ProblemInfo from "./components/ProblemInfo.vue"
|
||||
import { getProblem } from "oj/api"
|
||||
import { isDesktop, isMobile } from "~/shared/composables/breakpoints"
|
||||
import { TabsPaneContext } from "element-plus"
|
||||
|
||||
const Editor = defineAsyncComponent(() => import("./components/Editor.vue"))
|
||||
const ProblemContent = defineAsyncComponent(
|
||||
() => import("./components/ProblemContent.vue")
|
||||
)
|
||||
const ProblemInfo = defineAsyncComponent(
|
||||
() => import("./components/ProblemInfo.vue")
|
||||
)
|
||||
|
||||
interface Props {
|
||||
problemID: string
|
||||
|
||||
@@ -140,12 +140,12 @@ onMounted(listProblems)
|
||||
<el-table-column v-if="isDesktop" label="状态" :width="80">
|
||||
<template #default="scope">
|
||||
<el-icon
|
||||
v-if="scope.row.status === 'done'"
|
||||
v-if="scope.row.status === 'passed'"
|
||||
color="var(--el-color-success)"
|
||||
><i-ep-select
|
||||
/></el-icon>
|
||||
<el-icon
|
||||
v-if="scope.row.status === 'tried'"
|
||||
v-if="scope.row.status === 'failed'"
|
||||
color="var(--el-color-error)"
|
||||
><i-ep-semi-select
|
||||
/></el-icon>
|
||||
@@ -155,10 +155,7 @@ onMounted(listProblems)
|
||||
<el-table-column prop="title" label="标题" />
|
||||
<el-table-column label="难度" width="100">
|
||||
<template #default="scope">
|
||||
<el-tag
|
||||
disable-transitions
|
||||
:type="(getTagColor(scope.row.difficulty) as any)"
|
||||
>
|
||||
<el-tag disable-transitions :type="getTagColor(scope.row.difficulty)">
|
||||
{{ scope.row.difficulty }}
|
||||
</el-tag>
|
||||
</template>
|
||||
|
||||
Reference in New Issue
Block a user