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

update
Some checks failed
Deploy / deploy (build, debian, 22, /root/OJDeploy/data/clientnext) (push) Has been cancelled
Details
Deploy / deploy (build:staging, school, 8822, /root/OJ/data/dist) (push) Has been cancelled
Details

Browse Source
This commit is contained in:
yuetsh
2026-05-25 06:15:04 -06:00
parent 9f18ba900a
commit 1296251c80
15 changed files with 258 additions and 188 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/admin/api.ts
View File

@@ -480,6 +480,10 @@ export function getStuckProblems() {
return http.get("admin/problem/stuck")
}
export function getTopACTrend(params: { since_year: number; until_year: number; min_per_year: number }) {
export function getTopACTrend(params: {
since_year: number
until_year: number
min_per_year: number
}) {
return http.get("admin/problem/top_ac_trend", { params })
}

14
src/admin/problem/TopACTrend.vue
View File

@@ -47,7 +47,7 @@ const minPerYearOptions = [
]
const sinceYear = ref(2023)
const untilYear = ref(new Date().getFullYear()-1)
const untilYear = ref(new Date().getFullYear() - 1)
const minPerYear = ref(100)
const loading = ref(false)
const data = ref<ProblemTrend[]>([])
@@ -126,7 +126,11 @@ function getChartOptions(problem: ProblemTrend) {
async function fetchData() {
loading.value = true
try {
const res = await getTopACTrend({ since_year: sinceYear.value, until_year: untilYear.value, min_per_year: minPerYear.value })
const res = await getTopACTrend({
since_year: sinceYear.value,
until_year: untilYear.value,
min_per_year: minPerYear.value,
})
data.value = res.data
} finally {
loading.value = false
@@ -171,7 +175,11 @@ onMounted(fetchData)
</div>
<div v-else class="grid">
<div v-for="problem in data" :key="problem.problem_id" class="chart-card">
<Line :data="getChartData(problem)" :options="getChartOptions(problem)" :plugins="[acLabelPlugin]" />
<Line
:data="getChartData(problem)"
:options="getChartOptions(problem)"
:plugins="[acLabelPlugin]"
/>
</div>
</div>
</n-spin>

67
src/admin/problem/components/TestcaseGenerator.vue
View File

@@ -26,10 +26,23 @@ const message = useMessage()
let nextId = 0
function makeInitialFiles(): FileEntry[] {
const fromSamples = (props.samples ?? []).map((s) => ({ id: nextId++, in: s.input, out: s.output, error: false }))
const fromSamples = (props.samples ?? []).map((s) => ({
id: nextId++,
in: s.input,
out: s.output,
error: false,
}))
const total = Math.ceil(Math.max(fromSamples.length, 1) / 5) * 5
const extra = total - fromSamples.length
return [...fromSamples, ...Array.from({ length: extra }, () => ({ id: nextId++, in: "", out: "", error: false }))]
return [
...fromSamples,
...Array.from({ length: extra }, () => ({
id: nextId++,
in: "",
out: "",
error: false,
})),
]
}
const files = ref<FileEntry[]>(makeInitialFiles())
@@ -41,11 +54,15 @@ const availableLanguages = computed(() =>
props.answers.map((a) => ({ label: a.language, value: a.language })),
)
const hasAnyAnswerCode = computed(() => props.answers.some((a) => a.code.trim()))
const hasAnyAnswerCode = computed(() =>
props.answers.some((a) => a.code.trim()),
)
// 当前选中语言是否有答案代码（用于控制"先运行"按钮）
const hasAnswerCode = computed(() => {
const answer = props.answers.find((a) => a.language === selectedLanguage.value)
const answer = props.answers.find(
(a) => a.language === selectedLanguage.value,
)
return !!answer?.code.trim()
})
@@ -53,7 +70,10 @@ const hasAnswerCode = computed(() => {
watch(
availableLanguages,
(langs) => {
if (langs.length && !langs.find((l) => l.value === selectedLanguage.value)) {
if (
langs.length &&
!langs.find((l) => l.value === selectedLanguage.value)
) {
selectedLanguage.value = langs[0].value
}
},
@@ -73,11 +93,23 @@ const canUpload = computed(
)
function reset() {
files.value = Array.from({ length: 5 }, () => ({ id: nextId++, in: "", out: "", error: false }))
files.value = Array.from({ length: 5 }, () => ({
id: nextId++,
in: "",
out: "",
error: false,
}))
}
function add(n: number) {
files.value.push(...Array.from({ length: n }, () => ({ id: nextId++, in: "", out: "", error: false })))
files.value.push(
...Array.from({ length: n }, () => ({
id: nextId++,
in: "",
out: "",
error: false,
})),
)
}
function remove(index: number) {
@@ -85,7 +117,9 @@ function remove(index: number) {
}
async function run() {
const answer = props.answers.find((a) => a.language === selectedLanguage.value)
const answer = props.answers.find(
(a) => a.language === selectedLanguage.value,
)
if (!answer?.code.trim()) return
// 过滤空行，去重（按输入内容）
@@ -108,7 +142,11 @@ async function run() {
{ language: selectedLanguage.value, value: answer.code },
files.value[i].in,
)
files.value[i] = { ...files.value[i], out: result.output, error: result.status !== 3 }
files.value[i] = {
...files.value[i],
out: result.output,
error: result.status !== 3,
}
} catch {
files.value[i] = { ...files.value[i], out: "", error: true }
}
@@ -136,7 +174,9 @@ async function upload() {
const baseScore = Math.floor(100 / testcases.length)
const remainder = 100 - baseScore * testcases.length
testcases.forEach((tc, i) => {
tc.score = String(i === testcases.length - 1 ? baseScore + remainder : baseScore)
tc.score = String(
i === testcases.length - 1 ? baseScore + remainder : baseScore,
)
})
emit("uploaded", res.data.id, testcases)
@@ -151,7 +191,12 @@ async function upload() {
<template>
<n-flex vertical>
<n-alert v-if="!hasAnyAnswerCode" type="warning" :show-icon="false" style="margin-bottom: 8px">
<n-alert
v-if="!hasAnyAnswerCode"
type="warning"
:show-icon="false"
style="margin-bottom: 8px"
>
还没有填写答案代码，请先在上方"本题参考答案"中填写至少一种语言的答案，再来生成测试用例
</n-alert>
<n-flex align="center" wrap>

17
src/admin/problem/list.vue
View File

@@ -64,14 +64,20 @@ const columns: DataTableColumn<AdminProblemFiltered>[] = [
key: "difficulty",
width: 80,
render: (row) =>
h(NTag, { type: getTagColor(row.difficulty), size: "small" }, () => DIFFICULTY[row.difficulty]),
h(
NTag,
{ type: getTagColor(row.difficulty), size: "small" },
() => DIFFICULTY[row.difficulty],
),
},
{
title: "标签",
key: "tags",
minWidth: 120,
render: (row) =>
h(NFlex, { size: 4 }, () => row.tags.map((t) => h(NTag, { key: t, size: "small" }, () => t))),
h(NFlex, { size: 4 }, () =>
row.tags.map((t) => h(NTag, { key: t, size: "small" }, () => t)),
),
},
{ title: "出题人", key: "username", width: 120 },
{
@@ -208,7 +214,12 @@ watch(() => [query.page, query.limit, query.author], listProblems)
v-model:limit="query.limit"
v-model:page="query.page"
/>
<Modal v-model:show="show" :count="count" :next-display-id="nextDisplayID" @change="listProblems" />
<Modal
v-model:show="show"
:count="count"
:next-display-id="nextDisplayID"
@change="listProblems"
/>
</template>
<style scoped>

4
src/admin/tutorial/components/ExerciseManager.vue
View File

@@ -282,7 +282,7 @@ function typeTagType(type: string): "success" | "info" | "warning" {
type="textarea"
:rows="10"
placeholder="在此粘贴正确的代码，保存后将自动按行拆分并乱序"
style="font-family: 'Monaco'"
style="font-family: &quot;Monaco&quot;"
/>
</n-form-item>
</template>
@@ -302,7 +302,7 @@ function typeTagType(type: string): "success" | "info" | "warning" {
type="textarea"
:rows="10"
placeholder="用 {{答案}} 标记空位，多个合法答案用 | 分隔，例如：for {{i|idx}} in range(10):"
style="font-family: 'Monaco'"
style="font-family: &quot;Monaco&quot;"
/>
</n-form-item>
</template>

8
src/oj/class/pk.vue
View File

@@ -946,7 +946,13 @@ const radarChartOptions = {
render: (row) =>
h(
'span',
{ style: { color: '#722ed1', fontWeight: '700', fontSize: '15px' } },
{
style: {
color: '#722ed1',
fontWeight: '700',
fontSize: '15px',
},
},
row.composite_score.toFixed(1),
),
},

4
src/oj/learn/components/ExerciseFill.vue
View File

@@ -90,7 +90,9 @@ function inputWidth(idx: number): string {
style="margin: 16px 0; border: 1.5px solid var(--n-border-color)"
>
<template #header>
<n-tag type="warning" size="small" :bordered="false">练一练 · 代码填空</n-tag>
<n-tag type="warning" size="small" :bordered="false"
>练一练 · 代码填空</n-tag
>
</template>
<p style="font-weight: 500; margin-bottom: 12px">{{ data.question }}</p>

47
src/oj/problem/components/PinnedFlowchartTab.vue Normal file
View File

@@ -0,0 +1,47 @@
<script setup lang="ts">
import { usePinnedFlowchartStore } from "shared/store/pinnedFlowchart"
import { useMermaid } from "shared/composables/useMermaid"
const store = usePinnedFlowchartStore()
const { renderError, renderFlowchart } = useMermaid()
const mermaidContainer = useTemplateRef<HTMLElement>("mermaidContainer")
watch(
() => store.mermaidCode,
async (code) => {
if (!code) return
await nextTick()
await renderFlowchart(mermaidContainer.value, code)
},
{ immediate: true },
)
</script>
<template>
<n-flex vertical :size="8" style="padding: 8px 0">
<n-flex justify="end">
<n-button size="small" secondary @click="store.unpin()"
>取消固定</n-button
>
</n-flex>
<n-alert v-if="renderError" type="error" title="渲染失败" size="small">
{{ renderError }}
</n-alert>
<div v-else ref="mermaidContainer" class="flowchart-container"></div>
</n-flex>
</template>
<style scoped>
.flowchart-container {
width: 100%;
min-height: 500px;
display: flex;
justify-content: center;
align-items: flex-start;
}
:deep(.flowchart-container > svg) {
width: 100%;
height: auto;
}
</style>

6
src/oj/problem/components/ProblemContent.vue
View File

@@ -58,11 +58,7 @@ watch(
// AC 或失败次数 >= 3 时加载推荐
watch(
() => [
problem.value?._id,
problem.value?.my_status,
problemStore.failCount,
],
() => [problem.value?._id, problem.value?.my_status, problemStore.failCount],
([, status, failCount]) => {
if (status === 0 || (failCount as number) >= 3) {
loadSimilarProblems()

51
src/oj/problem/components/SubmitFlowchart.vue
View File

@@ -12,7 +12,6 @@ import {
useFlowchartWebSocket,
type FlowchartEvaluationUpdate,
} from "shared/composables/websocket"
import { Icon } from "@iconify/vue"
import { usePinnedFlowchartStore } from "shared/store/pinnedFlowchart"
// API 和状态管理
@@ -74,6 +73,7 @@ const evaluation = ref<Evaluation>({
criteria_details: {},
})
const page = ref(1)
const lastSubmittedMermaidCode = ref("")
const suggestionLines = computed(() =>
splitSuggestionLines(evaluation.value.suggestions),
)
@@ -88,15 +88,15 @@ function splitSuggestionLines(suggestions?: string | null) {
}
// ==================== WebSocket 相关函数 ====================
// 处理 WebSocket 消息
const handleWebSocketMessage = (data: FlowchartEvaluationUpdate) => {
if (data.type === "flowchart_evaluation_completed") {
loading.value = false
latestRating.value = {
score: data.score || 0,
grade: data.grade || "",
const grade = data.grade || ""
latestRating.value = { score: data.score || 0, grade }
message.success(`流程图评分完成！得分: ${data.score}分 (${grade}级)`)
if ((grade === "A" || grade === "S") && lastSubmittedMermaidCode.value) {
pinnedStore.pin(lastSubmittedMermaidCode.value)
}
message.success(`流程图评分完成！得分: ${data.score}分 (${data.grade}级)`)
} else if (data.type === "flowchart_evaluation_failed") {
loading.value = false
message.error(`流程图评分失败: ${data.error}`)
@@ -127,6 +127,7 @@ async function submitFlowchartData() {
}
const mermaidCode = convertToMermaid(flowchartData)
lastSubmittedMermaidCode.value = mermaidCode
const compressed = utoa(JSON.stringify(flowchartData))
loading.value = true
@@ -223,11 +224,6 @@ function closeModal() {
showDetailModal.value = false
}
function pinFlowchart() {
pinnedStore.pin(myMermaidCode.value)
closeModal()
}
function loadToEditor() {
if (myFlowchartZippedStr.value) {
const str = atou(myFlowchartZippedStr.value)
@@ -259,11 +255,17 @@ const getPercentType = (percent: number) => {
}
// ==================== 生命周期钩子 ====================
// 组件挂载时连接 WebSocket 并检查状态
onMounted(async () => {
connect()
await getCurrentSubmission()
page.value = submissionCount.value
const grade = latestRating.value.grade
if ((grade === "A" || grade === "S") && submissionCount.value > 0) {
await getSubmission(submissionCount.value)
if (myMermaidCode.value) {
pinnedStore.pin(myMermaidCode.value)
}
}
})
// 组件卸载时断开连接
@@ -299,26 +301,11 @@ onUnmounted(() => {
<!-- 流程图评分详情模态框 -->
<n-modal v-model:show="showDetailModal" preset="card" style="width: 1000px">
<template #header>
<n-flex align="center" justify="space-between" style="width: 100%">
<n-flex align="center">
<n-text>流程图评分详情</n-text>
<n-text :type="getGradeType(modalRating.grade)">
{{ modalRating.score }}分 {{ modalRating.grade }}级
</n-text>
</n-flex>
<n-button
quaternary
size="small"
:type="pinnedStore.isPinned ? 'primary' : 'default'"
@click="pinFlowchart"
>
<template #icon>
<Icon
:icon="pinnedStore.isPinned ? 'mdi:pin' : 'mdi:pin-outline'"
/>
</template>
{{ pinnedStore.isPinned ? "已固定" : "固定流程图" }}
</n-button>
<n-flex align="center">
<n-text>流程图评分详情</n-text>
<n-text :type="getGradeType(modalRating.grade)">
{{ modalRating.score }}分 {{ modalRating.grade }}级
</n-text>
</n-flex>
</template>
<n-grid :cols="5" :x-gap="16">

33
src/oj/problem/detail.vue
View File

@@ -4,6 +4,7 @@ import { useBreakpoints } from "shared/composables/breakpoints"
import { storeToRefs } from "pinia"
import { useProblemStore } from "oj/store/problem"
import { useScreenModeStore } from "shared/store/screenMode"
import { usePinnedFlowchartStore } from "shared/store/pinnedFlowchart"
const ProblemEditor = defineAsyncComponent(
() => import("./components/ProblemEditor.vue"),
@@ -29,6 +30,9 @@ const ProblemComment = defineAsyncComponent(
const ProblemFlowchart = defineAsyncComponent(
() => import("./components/ProblemFlowchart.vue"),
)
const PinnedFlowchartTab = defineAsyncComponent(
() => import("./components/PinnedFlowchartTab.vue"),
)
interface Props {
problemID: string
@@ -47,6 +51,7 @@ const router = useRouter()
const problemStore = useProblemStore()
const screenModeStore = useScreenModeStore()
const pinnedStore = usePinnedFlowchartStore()
const { problem } = storeToRefs(problemStore)
const { shouldShowProblem } = storeToRefs(screenModeStore)
@@ -57,6 +62,9 @@ const tabOptions = computed(() => {
if (problem.value?.show_flowchart) {
options.push("flowchart")
}
if (pinnedStore.isPinned) {
options.push("pinned")
}
if (isMobile.value) {
options.push("editor")
}
@@ -91,6 +99,13 @@ watch(currentTab, (tab) => {
})
})
watch(
() => pinnedStore.isPinned,
(pinned) => {
if (pinned) currentTab.value = "pinned"
},
)
async function init() {
screenModeStore.resetScreenMode()
try {
@@ -109,6 +124,7 @@ onBeforeUnmount(() => {
problem.value = null
errMsg.value = "无数据"
screenModeStore.resetScreenMode()
pinnedStore.unpin()
})
watch(isMobile, (value) => {
@@ -139,6 +155,13 @@ watch(isMobile, (value) => {
>
<ProblemFlowchart />
</n-tab-pane>
<n-tab-pane
v-if="pinnedStore.isPinned"
name="pinned"
tab="我的流程图"
>
<PinnedFlowchartTab />
</n-tab-pane>
<n-tab-pane
name="info"
tab="题目统计"
@@ -188,6 +211,13 @@ watch(isMobile, (value) => {
>
<ProblemFlowchart />
</n-tab-pane>
<n-tab-pane
v-if="pinnedStore.isPinned"
name="pinned"
tab="我的流程图"
>
<PinnedFlowchartTab />
</n-tab-pane>
<n-tab-pane
name="info"
tab="题目统计"
@@ -222,6 +252,9 @@ watch(isMobile, (value) => {
<n-tab-pane v-if="problem.show_flowchart" name="flowchart" tab="流程">
<ProblemFlowchart />
</n-tab-pane>
<n-tab-pane v-if="pinnedStore.isPinned" name="pinned" tab="我的流程图">
<PinnedFlowchartTab />
</n-tab-pane>
<n-tab-pane name="editor" tab="代码">
<component :is="inProblem ? ProblemEditor : ContestEditor" />
</n-tab-pane>

4
src/oj/submission/components/SubmissionLink.vue
View File

@@ -42,7 +42,9 @@ const props = defineProps<Props>()
defineEmits(["showCode"])
const userStore = useUserStore()
const isOwnSubmission = computed(() => userStore.profile?.user?.id === props.submission.user_id)
const isOwnSubmission = computed(
() => userStore.profile?.user?.id === props.submission.user_id,
)
function goto() {
window.open("/submission/" + props.submission.id, "_blank")

112
src/shared/components/PinnedFlowchartPanel.vue
View File

@@ -1,112 +0,0 @@
<template>
<div
v-if="store.isPinned"
ref="panel"
class="pinned-panel"
:style="{ left: `${x}px`, top: `${y}px` }"
>
<n-card
size="small"
:content-style="collapsed ? 'display:none' : 'padding:8px'"
>
<template #header>
<div ref="handle" class="pinned-handle">
<n-flex align="center" :size="8">
<Icon icon="mdi:pin" style="font-size: 14px" />
<n-text strong style="font-size: 13px">流程图预览</n-text>
</n-flex>
</div>
</template>
<template #header-extra>
<n-flex :size="4">
<n-button quaternary size="small" @click="collapsed = !collapsed">
<template #icon>
<Icon :icon="collapsed ? 'mdi:chevron-up' : 'mdi:chevron-down'" />
</template>
</n-button>
<n-button quaternary size="small" @click="store.unpin()">
<template #icon>
<Icon icon="mdi:close" />
</template>
</n-button>
</n-flex>
</template>
<n-alert v-if="renderError" type="error" title="渲染失败" size="small">
{{ renderError }}
</n-alert>
<div v-else ref="mermaidContainer" class="mermaid-area"></div>
</n-card>
</div>
</template>
<script setup lang="ts">
import { Icon } from "@iconify/vue"
import { usePinnedFlowchartStore } from "shared/store/pinnedFlowchart"
import { useMermaid } from "shared/composables/useMermaid"
const store = usePinnedFlowchartStore()
const { renderError, renderFlowchart, clearError } = useMermaid()
const panelRef = useTemplateRef<HTMLElement>("panel")
const handleRef = useTemplateRef<HTMLElement>("handle")
const mermaidContainer = useTemplateRef<HTMLElement>("mermaidContainer")
const collapsed = ref(false)
const { x, y } = useDraggable(panelRef, {
handle: handleRef,
initialValue: {
x: window.innerWidth - 440,
y: window.innerHeight - 400,
},
})
watch(
() => store.mermaidCode,
async (code) => {
if (!code) return
collapsed.value = false
await nextTick()
await renderFlowchart(mermaidContainer.value, code)
},
{ immediate: true },
)
watch(collapsed, async (val) => {
if (val) {
clearError()
} else if (store.mermaidCode) {
await nextTick()
await renderFlowchart(mermaidContainer.value, store.mermaidCode)
}
})
</script>
<style scoped>
.pinned-panel {
position: fixed;
z-index: 1000;
width: 420px;
}
.pinned-handle {
cursor: grab;
user-select: none;
}
.pinned-handle:active {
cursor: grabbing;
}
.mermaid-area {
height: 340px;
display: flex;
justify-content: center;
align-items: center;
overflow: hidden;
}
:deep(.mermaid-area > svg) {
max-width: 100%;
max-height: 100%;
}
</style>

71
src/shared/components/StatisticsPanel.vue
View File

@@ -23,35 +23,51 @@
</n-button>
</n-flex>
<n-empty v-if="count.total === 0" description="暂无数据" style="margin: 40px 0" />
<n-empty
v-if="count.total === 0"
description="暂无数据"
style="margin: 40px 0"
/>
<template v-if="count.total > 0">
<n-divider style="margin: 16px 0" />
<n-flex justify="space-around">
<div class="stat-item">
<div class="stat-label">总提交</div>
<n-gradient-text type="info" font-size="28">{{ count.total }}</n-gradient-text>
<n-gradient-text type="info" font-size="28">{{
count.total
}}</n-gradient-text>
</div>
<div class="stat-item">
<div class="stat-label">正确提交</div>
<n-gradient-text type="primary" font-size="28">{{ count.accepted }}</n-gradient-text>
<n-gradient-text type="primary" font-size="28">{{
count.accepted
}}</n-gradient-text>
</div>
<div class="stat-item">
<div class="stat-label">正确率</div>
<n-gradient-text type="warning" font-size="28">{{ count.rate }}</n-gradient-text>
<n-gradient-text type="warning" font-size="28">{{
count.rate
}}</n-gradient-text>
</div>
<template v-if="person.count > 0">
<div class="stat-item">
<div class="stat-label">完成人数</div>
<n-gradient-text type="error" font-size="28">{{ list.length }}</n-gradient-text>
<n-gradient-text type="error" font-size="28">{{
list.length
}}</n-gradient-text>
</div>
<div class="stat-item">
<div class="stat-label">班级人数</div>
<n-gradient-text type="warning" font-size="28">{{ adjustedPersonCount }}</n-gradient-text>
<n-gradient-text type="warning" font-size="28">{{
adjustedPersonCount
}}</n-gradient-text>
</div>
<div class="stat-item">
<div class="stat-label">完成度</div>
<n-gradient-text type="success" font-size="28">{{ adjustedPersonRate }}</n-gradient-text>
<n-gradient-text type="success" font-size="28">{{
adjustedPersonRate
}}</n-gradient-text>
</div>
</template>
</n-flex>
@@ -67,7 +83,10 @@
</n-gi>
<n-gi v-if="person.count > 0">
<n-card title="班级完成度">
<Doughnut :data="completionChartData" :options="completionChartOptions" />
<Doughnut
:data="completionChartData"
:options="completionChartOptions"
/>
</n-card>
</n-gi>
</n-grid>
@@ -87,22 +106,40 @@
/>
</n-tab-pane>
<n-tab-pane name="unaccepted" :tab="`未完成（${visibleUnaccepted.length}）`">
<n-tab-pane
name="unaccepted"
:tab="`未完成（${visibleUnaccepted.length}）`"
>
<n-flex align="center" style="margin: 12px 0">
<n-switch v-model:value="hideMode" size="large">
<template #checked>请假隐藏中</template>
<template #unchecked>请假隐藏</template>
</n-switch>
<n-button v-if="hiddenCount > 0" size="small" type="info" @click="showAll">
<n-button
v-if="hiddenCount > 0"
size="small"
type="info"
@click="showAll"
>
恢复 {{ hiddenCount }} 位
</n-button>
</n-flex>
<n-flex size="large" align="center">
<n-gradient-text v-if="visibleUnaccepted.length === 0" font-size="24" type="success">
<n-gradient-text
v-if="visibleUnaccepted.length === 0"
font-size="24"
type="success"
>
全都完成了
</n-gradient-text>
<template v-for="item in visibleUnaccepted" :key="item.username">
<n-tag v-if="hideMode" closable size="large" style="font-size: 20px" @close="hideStudent(item.username)">
<n-tag
v-if="hideMode"
closable
size="large"
style="font-size: 20px"
@close="hideStudent(item.username)"
>
{{ item.real_name }}
</n-tag>
<span v-else style="font-size: 24px">{{ item.real_name }}</span>
@@ -264,7 +301,10 @@ const adjustedPersonCount = computed(() => person.count - hiddenCount.value)
const adjustedPersonRate = computed(() => {
if (adjustedPersonCount.value <= 0) return "0%"
const rate = Math.min(100, (list.value.length / adjustedPersonCount.value) * 100)
const rate = Math.min(
100,
(list.value.length / adjustedPersonCount.value) * 100,
)
return `${Math.round(rate * 100) / 100}%`
})
@@ -321,7 +361,10 @@ const pieChartOptions = {
// 环形图数据 - 班级完成度
const completionChartData = computed(() => {
const completedCount = list.value.length
const uncompletedCount = Math.max(0, adjustedPersonCount.value - completedCount)
const uncompletedCount = Math.max(
0,
adjustedPersonCount.value - completedCount,
)
return {
labels: ["已完成", "未完成"],
datasets: [

2
src/shared/layout/default.vue
View File

@@ -4,7 +4,6 @@ import Header from "../components/Header.vue"
import Login from "../components/Login.vue"
import Signup from "../components/Signup.vue"
import LoginSummaryModal from "../components/LoginSummaryModal.vue"
import PinnedFlowchartPanel from "../components/PinnedFlowchartPanel.vue"
</script>
<template>
@@ -20,7 +19,6 @@ import PinnedFlowchartPanel from "../components/PinnedFlowchartPanel.vue"
<Login />
<Signup />
<LoginSummaryModal />
<PinnedFlowchartPanel />
<Beian />
</n-layout>
</template>