@@ -1,161 +0,0 @@
|
||||
<script lang="ts" setup>
|
||||
import { atou } from "utils/functions"
|
||||
import { useMermaid } from "shared/composables/useMermaid"
|
||||
import { Evaluation } from "../composables/useFlowchart"
|
||||
|
||||
interface Props {
|
||||
evaluation: Evaluation | null
|
||||
myFlowchartZippedStr: string
|
||||
myMermaidCode: string
|
||||
}
|
||||
|
||||
const props = defineProps<Props>()
|
||||
|
||||
const emit = defineEmits<{
|
||||
loadToEditor: [data: any]
|
||||
}>()
|
||||
|
||||
const showDetailModal = ref(false)
|
||||
|
||||
// mermaid 渲染相关
|
||||
const mermaidContainer = useTemplateRef<HTMLElement>("mermaidContainer")
|
||||
|
||||
// 使用 mermaid composable
|
||||
const { renderError, renderFlowchart } = useMermaid()
|
||||
|
||||
// 根据分数获取标签类型
|
||||
const getScoreType = (score: number) => {
|
||||
if (score >= 90) return "success"
|
||||
if (score >= 80) return "info"
|
||||
if (score >= 70) return "warning"
|
||||
return "error"
|
||||
}
|
||||
|
||||
async function openDetailModal() {
|
||||
showDetailModal.value = true
|
||||
await nextTick()
|
||||
await renderFlowchart(mermaidContainer.value, props.myMermaidCode)
|
||||
}
|
||||
|
||||
function closeModal() {
|
||||
showDetailModal.value = false
|
||||
}
|
||||
|
||||
function loadToEditor() {
|
||||
if (props.myFlowchartZippedStr) {
|
||||
const str = atou(props.myFlowchartZippedStr)
|
||||
const json = JSON.parse(str)
|
||||
const processedData = {
|
||||
nodes: json.nodes || [],
|
||||
edges: json.edges || [],
|
||||
}
|
||||
emit("loadToEditor", processedData)
|
||||
}
|
||||
closeModal()
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div>
|
||||
<!-- 评分结果显示 -->
|
||||
<n-button
|
||||
secondary
|
||||
v-if="evaluation"
|
||||
@click="openDetailModal"
|
||||
:type="getScoreType(evaluation.score)"
|
||||
>
|
||||
{{ evaluation.score }}分 {{ evaluation.grade }}级
|
||||
</n-button>
|
||||
|
||||
<!-- 详情弹框 -->
|
||||
<n-modal
|
||||
v-model:show="showDetailModal"
|
||||
preset="card"
|
||||
title="评分详情"
|
||||
style="width: 1000px"
|
||||
>
|
||||
<n-grid :cols="5" :x-gap="16">
|
||||
<n-gi :span="3">
|
||||
<n-card title="流程图预览">
|
||||
<n-alert v-if="renderError" type="error" title="流程图渲染失败">
|
||||
<template #default>
|
||||
{{ renderError }}
|
||||
</template>
|
||||
</n-alert>
|
||||
<div v-else ref="mermaidContainer" class="flowchart"></div>
|
||||
</n-card>
|
||||
<n-flex style="margin-top: 16px" justify="center">
|
||||
<n-button @click="loadToEditor" type="primary">
|
||||
加载到流程图编辑器
|
||||
</n-button>
|
||||
</n-flex>
|
||||
</n-gi>
|
||||
<n-gi :span="2">
|
||||
<n-card
|
||||
v-if="evaluation?.feedback"
|
||||
size="small"
|
||||
title="AI反馈"
|
||||
style="margin-bottom: 16px"
|
||||
>
|
||||
<n-text>{{ evaluation.feedback }}</n-text>
|
||||
</n-card>
|
||||
|
||||
<!-- 建议部分 -->
|
||||
<n-card
|
||||
v-if="evaluation?.suggestions"
|
||||
size="small"
|
||||
title="改进建议"
|
||||
style="margin-bottom: 16px"
|
||||
>
|
||||
<n-text>{{ evaluation.suggestions }}</n-text>
|
||||
</n-card>
|
||||
|
||||
<!-- 详细评分部分 -->
|
||||
<n-card
|
||||
v-if="evaluation?.criteria_details"
|
||||
size="small"
|
||||
title="详细评分"
|
||||
>
|
||||
<div
|
||||
v-for="(detail, key) in evaluation.criteria_details"
|
||||
:key="key"
|
||||
style="margin-bottom: 12px"
|
||||
>
|
||||
<n-flex
|
||||
justify="space-between"
|
||||
align="center"
|
||||
style="margin-bottom: 4px"
|
||||
>
|
||||
<n-text strong>{{ key }}</n-text>
|
||||
<n-tag
|
||||
:type="getScoreType(detail.score || 0)"
|
||||
size="small"
|
||||
round
|
||||
>
|
||||
{{ detail.score || 0 }}分 / {{ detail.max }}分
|
||||
</n-tag>
|
||||
</n-flex>
|
||||
<n-text v-if="detail.comment" depth="3" style="font-size: 12px">
|
||||
{{ detail.comment }}
|
||||
</n-text>
|
||||
</div>
|
||||
</n-card>
|
||||
</n-gi>
|
||||
</n-grid>
|
||||
</n-modal>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.flowchart {
|
||||
height: 500px;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
:deep(.flowchart > svg) {
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
@@ -1,52 +1,212 @@
|
||||
<script lang="ts" setup>
|
||||
import { toRefs } from "vue"
|
||||
|
||||
// 工具函数
|
||||
import { atou, utoa } from "utils/functions"
|
||||
|
||||
// 组合式函数
|
||||
import { useBreakpoints } from "shared/composables/breakpoints"
|
||||
import { useFlowchart } from "../composables/useFlowchart"
|
||||
import FlowchartEvaluationDisplay from "./FlowchartEvaluationDisplay.vue"
|
||||
import { useMermaid } from "shared/composables/useMermaid"
|
||||
import { useMermaidConverter } from "../composables/useMermaidConverter"
|
||||
import {
|
||||
useFlowchartWebSocket,
|
||||
type FlowchartEvaluationUpdate,
|
||||
} from "shared/composables/websocket"
|
||||
|
||||
const { isDesktop } = useBreakpoints()
|
||||
// API 和状态管理
|
||||
import { getCurrentProblemFlowchartSubmission, submitFlowchart } from "oj/api"
|
||||
import { useProblemStore } from "oj/store/problem"
|
||||
|
||||
// ==================== 类型定义 ====================
|
||||
interface Rating {
|
||||
score: number
|
||||
grade: string
|
||||
}
|
||||
|
||||
interface Evaluation extends Rating {
|
||||
feedback: string
|
||||
suggestions: string
|
||||
criteria_details: {
|
||||
[key: string]: { score: number; max: number; comment: string }
|
||||
}
|
||||
}
|
||||
|
||||
// ==================== 组合式函数和响应式变量 ====================
|
||||
// 通过inject获取FlowchartEditor组件的引用
|
||||
const flowchartEditorRef = inject<any>("flowchartEditorRef")
|
||||
const mermaidContainer = useTemplateRef<HTMLElement>("mermaidContainer")
|
||||
|
||||
// 使用合并后的逻辑
|
||||
const {
|
||||
evaluation,
|
||||
loading,
|
||||
submissionCount,
|
||||
myFlowchartZippedStr,
|
||||
myMermaidCode,
|
||||
connect,
|
||||
disconnect,
|
||||
checkCurrentSubmissionStatus,
|
||||
submitFlowchartData,
|
||||
} = useFlowchart()
|
||||
// 基础组合式函数
|
||||
const message = useMessage()
|
||||
const problemStore = useProblemStore()
|
||||
const { problem } = toRefs(problemStore)
|
||||
const { isDesktop } = useBreakpoints()
|
||||
const { convertToMermaid } = useMermaidConverter()
|
||||
const { renderError, renderFlowchart } = useMermaid()
|
||||
|
||||
// 组件挂载时连接 WebSocket 并检查状态
|
||||
onMounted(() => {
|
||||
connect()
|
||||
checkCurrentSubmissionStatus()
|
||||
// 状态管理
|
||||
const loading = ref(false)
|
||||
const rating = ref<Rating | null>(null)
|
||||
const submissionCount = ref(0)
|
||||
const myFlowchartZippedStr = ref("")
|
||||
const myMermaidCode = ref("")
|
||||
const showDetailModal = ref(false)
|
||||
const evaluation = ref<Evaluation | null>(null)
|
||||
|
||||
// ==================== WebSocket 相关函数 ====================
|
||||
// 处理 WebSocket 消息
|
||||
const handleWebSocketMessage = (data: FlowchartEvaluationUpdate) => {
|
||||
console.log("收到流程图评分更新:", data)
|
||||
|
||||
if (data.type === "flowchart_evaluation_completed") {
|
||||
loading.value = false
|
||||
rating.value = {
|
||||
score: data.score || 0,
|
||||
grade: data.grade || "",
|
||||
}
|
||||
message.success(`流程图评分完成！得分: ${data.score}分 (${data.grade}级)`)
|
||||
} else if (data.type === "flowchart_evaluation_failed") {
|
||||
console.log("处理评分失败消息")
|
||||
loading.value = false
|
||||
message.error(`流程图评分失败: ${data.error}`)
|
||||
} else {
|
||||
console.log("未知的消息类型:", data.type)
|
||||
}
|
||||
}
|
||||
|
||||
// 创建 WebSocket 连接
|
||||
const { connect, disconnect, subscribe } = useFlowchartWebSocket(
|
||||
handleWebSocketMessage,
|
||||
)
|
||||
|
||||
// 订阅提交更新
|
||||
function subscribeToSubmission(submissionId: string) {
|
||||
console.log("开始订阅WebSocket更新")
|
||||
subscribe(submissionId)
|
||||
}
|
||||
|
||||
// ==================== 提交相关函数 ====================
|
||||
// 提交流程图
|
||||
async function submitFlowchartData(flowchartEditorRef: any) {
|
||||
if (!flowchartEditorRef?.value) return
|
||||
|
||||
// 获取流程图的JSON数据
|
||||
const flowchartData = flowchartEditorRef.value.getFlowchartData()
|
||||
|
||||
if (flowchartData.nodes.length === 0 || flowchartData.edges.length === 0) {
|
||||
message.error("流程图节点或边不能为空")
|
||||
return
|
||||
}
|
||||
|
||||
const mermaidCode = convertToMermaid(flowchartData)
|
||||
const compressed = utoa(JSON.stringify(flowchartData))
|
||||
|
||||
loading.value = true
|
||||
rating.value = { score: 0, grade: "" }
|
||||
|
||||
try {
|
||||
const response = await submitFlowchart({
|
||||
problem_id: problem.value!.id,
|
||||
mermaid_code: mermaidCode,
|
||||
flowchart_data: {
|
||||
compressed: true,
|
||||
data: compressed,
|
||||
},
|
||||
})
|
||||
|
||||
// 组件卸载时断开连接
|
||||
onUnmounted(() => {
|
||||
disconnect()
|
||||
})
|
||||
// 获取提交ID并订阅更新
|
||||
const submissionId = response.data.submission_id
|
||||
|
||||
if (submissionId) {
|
||||
subscribeToSubmission(submissionId)
|
||||
}
|
||||
|
||||
message.success("流程图已提交，请耐心等待评分")
|
||||
} catch (error) {
|
||||
loading.value = false
|
||||
message.error("流程图提交失败")
|
||||
console.error("提交流程图失败:", error)
|
||||
}
|
||||
}
|
||||
|
||||
// 提交函数
|
||||
function submit() {
|
||||
submitFlowchartData(flowchartEditorRef)
|
||||
}
|
||||
|
||||
// 处理加载到编辑器
|
||||
function handleLoadToEditor(data: any) {
|
||||
// ==================== 数据获取和处理函数 ====================
|
||||
async function getSubmission() {
|
||||
if (!problem.value?.id) return
|
||||
const { data } = await getCurrentProblemFlowchartSubmission(problem.value.id)
|
||||
const submission = data.submission
|
||||
myMermaidCode.value = submission.mermaid_code
|
||||
myFlowchartZippedStr.value = submission.flowchart_data.data
|
||||
if (submission && submission.status === 2) {
|
||||
rating.value = {
|
||||
score: submission.ai_score,
|
||||
grade: submission.ai_grade,
|
||||
}
|
||||
evaluation.value = {
|
||||
score: submission.ai_score,
|
||||
grade: submission.ai_grade,
|
||||
feedback: submission.ai_feedback,
|
||||
suggestions: submission.ai_suggestions,
|
||||
criteria_details: submission.ai_criteria_details,
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// ==================== 模态框相关函数 ====================
|
||||
async function openDetailModal() {
|
||||
showDetailModal.value = true
|
||||
await getSubmission()
|
||||
renderFlowchart(mermaidContainer.value, myMermaidCode.value)
|
||||
}
|
||||
|
||||
function closeModal() {
|
||||
showDetailModal.value = false
|
||||
}
|
||||
|
||||
function loadToEditor() {
|
||||
if (myFlowchartZippedStr.value) {
|
||||
const str = atou(myFlowchartZippedStr.value)
|
||||
const json = JSON.parse(str)
|
||||
const processedData = {
|
||||
nodes: json.nodes || [],
|
||||
edges: json.edges || [],
|
||||
}
|
||||
if (flowchartEditorRef?.value) {
|
||||
flowchartEditorRef.value.setFlowchartData(data)
|
||||
flowchartEditorRef.value.setFlowchartData(processedData)
|
||||
}
|
||||
}
|
||||
closeModal()
|
||||
}
|
||||
|
||||
// ==================== 工具函数 ====================
|
||||
const getScoreType = (score: number) => {
|
||||
if (score >= 90) return "success"
|
||||
if (score >= 80) return "info"
|
||||
if (score >= 70) return "warning"
|
||||
return "error"
|
||||
}
|
||||
|
||||
// ==================== 生命周期钩子 ====================
|
||||
// 组件挂载时连接 WebSocket 并检查状态
|
||||
onMounted(() => {
|
||||
connect()
|
||||
getSubmission()
|
||||
})
|
||||
|
||||
// 组件卸载时断开连接
|
||||
onUnmounted(() => {
|
||||
disconnect()
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<!-- 主要操作区域 -->
|
||||
<n-flex align="center">
|
||||
<!-- 提交按钮 -->
|
||||
<n-button
|
||||
:size="isDesktop ? 'medium' : 'small'"
|
||||
type="primary"
|
||||
@@ -57,17 +217,120 @@ function handleLoadToEditor(data: any) {
|
||||
{{ loading ? "评分中..." : "提交流程图" }}
|
||||
</n-button>
|
||||
|
||||
<!-- 显示提交次数 -->
|
||||
<!-- 提交次数显示 -->
|
||||
<n-button secondary v-if="submissionCount > 0" type="info">
|
||||
{{ submissionCount }} 次
|
||||
</n-button>
|
||||
|
||||
<!-- 评分结果显示组件 -->
|
||||
<FlowchartEvaluationDisplay
|
||||
:evaluation="evaluation"
|
||||
:my-flowchart-zipped-str="myFlowchartZippedStr"
|
||||
:my-mermaid-code="myMermaidCode"
|
||||
@load-to-editor="handleLoadToEditor"
|
||||
/>
|
||||
<!-- 评分结果按钮 -->
|
||||
<n-button
|
||||
secondary
|
||||
v-if="rating"
|
||||
@click="openDetailModal"
|
||||
:type="getScoreType(rating.score)"
|
||||
>
|
||||
{{ rating.score }}分 {{ rating.grade }}级
|
||||
</n-button>
|
||||
|
||||
<!-- 评分详情模态框 -->
|
||||
<n-modal
|
||||
v-model:show="showDetailModal"
|
||||
preset="card"
|
||||
title="评分详情"
|
||||
style="width: 1000px"
|
||||
>
|
||||
<n-grid :cols="5" :x-gap="16">
|
||||
<!-- 左侧：流程图预览区域 -->
|
||||
<n-gi :span="3">
|
||||
<n-card title="流程图预览">
|
||||
<!-- 错误提示 -->
|
||||
<n-alert v-if="renderError" type="error" title="流程图渲染失败">
|
||||
<template #default>
|
||||
{{ renderError }}
|
||||
</template>
|
||||
</n-alert>
|
||||
<!-- 流程图容器 -->
|
||||
<div v-else ref="mermaidContainer" class="flowchart"></div>
|
||||
</n-card>
|
||||
<!-- 加载到编辑器按钮 -->
|
||||
<n-flex style="margin-top: 16px" justify="center">
|
||||
<n-button @click="loadToEditor" type="primary">
|
||||
加载到流程图编辑器
|
||||
</n-button>
|
||||
</n-flex>
|
||||
</n-gi>
|
||||
|
||||
<!-- 右侧：评分详情区域 -->
|
||||
<n-gi :span="2">
|
||||
<!-- AI反馈 -->
|
||||
<n-card
|
||||
v-if="evaluation?.feedback"
|
||||
size="small"
|
||||
title="AI反馈"
|
||||
style="margin-bottom: 16px"
|
||||
>
|
||||
<n-text>{{ evaluation.feedback }}</n-text>
|
||||
</n-card>score
|
||||
|
||||
<!-- 改进建议 -->
|
||||
<n-card
|
||||
v-if="evaluation?.suggestions"
|
||||
size="small"
|
||||
title="改进建议"
|
||||
style="margin-bottom: 16px"
|
||||
>
|
||||
<n-text>{{ evaluation.suggestions }}</n-text>
|
||||
</n-card>
|
||||
|
||||
<!-- 详细评分 -->
|
||||
<n-card
|
||||
v-if="evaluation?.criteria_details"
|
||||
size="small"
|
||||
title="详细评分"
|
||||
>
|
||||
<div
|
||||
v-for="(detail, key) in evaluation.criteria_details"
|
||||
:key="key"
|
||||
style="margin-bottom: 12px"
|
||||
>
|
||||
<!-- 评分项标题和分数 -->
|
||||
<n-flex
|
||||
justify="space-between"
|
||||
align="center"
|
||||
style="margin-bottom: 4px"
|
||||
>
|
||||
<n-text strong>{{ key }}</n-text>
|
||||
<n-tag
|
||||
:type="getScoreType(detail.score || 0)"
|
||||
size="small"
|
||||
round
|
||||
>
|
||||
{{ detail.score || 0 }}分 / {{ detail.max }}分
|
||||
</n-tag>
|
||||
</n-flex>
|
||||
<!-- 评分项详细说明 -->
|
||||
<n-text v-if="detail.comment" depth="3" style="font-size: 12px">
|
||||
{{ detail.comment }}
|
||||
</n-text>
|
||||
</div>
|
||||
</n-card>
|
||||
</n-gi>
|
||||
</n-grid>
|
||||
</n-modal>
|
||||
</n-flex>
|
||||
</template>
|
||||
<style scoped>
|
||||
/* ==================== 流程图样式 ==================== */
|
||||
.flowchart {
|
||||
height: 500px;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 确保 SVG 图表占满容器 */
|
||||
:deep(.flowchart > svg) {
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,172 +0,0 @@
|
||||
import { ref } from "vue"
|
||||
import { useMessage } from "naive-ui"
|
||||
import { toRefs } from "vue"
|
||||
import { submitFlowchart, getCurrentProblemFlowchartSubmission } from "oj/api"
|
||||
import { useProblemStore } from "oj/store/problem"
|
||||
import { utoa } from "utils/functions"
|
||||
import { useMermaidConverter } from "./useMermaidConverter"
|
||||
import {
|
||||
useFlowchartWebSocket,
|
||||
type FlowchartEvaluationUpdate,
|
||||
} from "shared/composables/websocket"
|
||||
|
||||
export interface Evaluation {
|
||||
score: number
|
||||
grade: string
|
||||
feedback: string
|
||||
suggestions: string
|
||||
criteria_details: {
|
||||
[key: string]: { score: number; max: number; comment: string }
|
||||
}
|
||||
}
|
||||
|
||||
export function useFlowchart() {
|
||||
const message = useMessage()
|
||||
const problemStore = useProblemStore()
|
||||
const { problem } = toRefs(problemStore)
|
||||
|
||||
const { convertToMermaid } = useMermaidConverter()
|
||||
|
||||
// 评估相关状态
|
||||
const evaluation = ref<Evaluation | null>(null)
|
||||
const loading = ref(false)
|
||||
|
||||
// 提交相关状态
|
||||
const submissionCount = ref(0)
|
||||
const myFlowchartZippedStr = ref("")
|
||||
const myMermaidCode = ref("")
|
||||
|
||||
// 处理 WebSocket 消息
|
||||
const handleWebSocketMessage = (data: FlowchartEvaluationUpdate) => {
|
||||
console.log("收到流程图评分更新:", data)
|
||||
|
||||
if (data.type === "flowchart_evaluation_completed") {
|
||||
loading.value = false
|
||||
evaluation.value = {
|
||||
score: data.score || 0,
|
||||
grade: data.grade || "",
|
||||
feedback: data.feedback || "",
|
||||
suggestions: data.suggestions || "",
|
||||
criteria_details: data.criteria_details || {},
|
||||
}
|
||||
message.success(`流程图评分完成！得分: ${data.score}分 (${data.grade}级)`)
|
||||
} else if (data.type === "flowchart_evaluation_failed") {
|
||||
console.log("处理评分失败消息")
|
||||
loading.value = false
|
||||
message.error(`流程图评分失败: ${data.error}`)
|
||||
} else {
|
||||
console.log("未知的消息类型:", data.type)
|
||||
}
|
||||
}
|
||||
|
||||
// 创建 WebSocket 连接
|
||||
const { connect, disconnect, subscribe } = useFlowchartWebSocket(
|
||||
handleWebSocketMessage,
|
||||
)
|
||||
|
||||
// 订阅提交更新
|
||||
const subscribeToSubmission = (submissionId: string) => {
|
||||
console.log("开始订阅WebSocket更新")
|
||||
subscribe(submissionId)
|
||||
}
|
||||
|
||||
// 清除结果
|
||||
const clearResult = () => {
|
||||
evaluation.value = null
|
||||
}
|
||||
|
||||
// 设置加载状态
|
||||
const setLoading = (value: boolean) => {
|
||||
loading.value = value
|
||||
}
|
||||
|
||||
// 设置评估结果
|
||||
const setEvaluation = (result: Evaluation) => {
|
||||
evaluation.value = result
|
||||
}
|
||||
|
||||
// 检查当前问题的流程图提交状态
|
||||
const checkCurrentSubmissionStatus = async () => {
|
||||
if (!problem.value?.id) return
|
||||
|
||||
const { data } = await getCurrentProblemFlowchartSubmission(
|
||||
problem.value.id,
|
||||
)
|
||||
const submission = data.submission
|
||||
submissionCount.value = data.count
|
||||
if (submission && submission.status === 2) {
|
||||
myFlowchartZippedStr.value = data.submission.flowchart_data.data
|
||||
myMermaidCode.value = data.submission.mermaid_code
|
||||
submissionCount.value += 1
|
||||
setEvaluation({
|
||||
score: submission.ai_score,
|
||||
grade: submission.ai_grade,
|
||||
feedback: submission.ai_feedback,
|
||||
suggestions: submission.ai_suggestions,
|
||||
criteria_details: submission.ai_criteria_details,
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
// 提交流程图
|
||||
const submitFlowchartData = async (flowchartEditorRef: any) => {
|
||||
if (!flowchartEditorRef?.value) return
|
||||
|
||||
// 获取流程图的JSON数据
|
||||
const flowchartData = flowchartEditorRef.value.getFlowchartData()
|
||||
|
||||
if (flowchartData.nodes.length === 0 || flowchartData.edges.length === 0) {
|
||||
message.error("流程图节点或边不能为空")
|
||||
return
|
||||
}
|
||||
|
||||
const mermaidCode = convertToMermaid(flowchartData)
|
||||
const compressed = utoa(JSON.stringify(flowchartData))
|
||||
|
||||
setLoading(true)
|
||||
clearResult() // 清除之前的结果
|
||||
|
||||
try {
|
||||
const response = await submitFlowchart({
|
||||
problem_id: problem.value!.id,
|
||||
mermaid_code: mermaidCode,
|
||||
flowchart_data: {
|
||||
compressed: true,
|
||||
data: compressed,
|
||||
},
|
||||
})
|
||||
|
||||
// 获取提交ID并订阅更新
|
||||
const submissionId = response.data.submission_id
|
||||
|
||||
if (submissionId) {
|
||||
subscribeToSubmission(submissionId)
|
||||
}
|
||||
|
||||
message.success("流程图已提交，请耐心等待评分")
|
||||
} catch (error) {
|
||||
setLoading(false)
|
||||
message.error("流程图提交失败")
|
||||
console.error("提交流程图失败:", error)
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
// 评估相关
|
||||
evaluation,
|
||||
loading,
|
||||
connect,
|
||||
disconnect,
|
||||
subscribeToSubmission,
|
||||
clearResult,
|
||||
setLoading,
|
||||
setEvaluation,
|
||||
|
||||
// 提交相关
|
||||
submissionCount,
|
||||
myFlowchartZippedStr,
|
||||
myMermaidCode,
|
||||
checkCurrentSubmissionStatus,
|
||||
submitFlowchartData,
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user