提交 9b4d7ac1 authored 作者: 王鹏飞's avatar 王鹏飞

chore: update

上级 c9186115
...@@ -11,6 +11,15 @@ import Sidebar from './Sidebar.vue' ...@@ -11,6 +11,15 @@ import Sidebar from './Sidebar.vue'
import CustomNode from './CustomNode.vue' import CustomNode from './CustomNode.vue'
import CustomEdge from './CustomEdge.vue' import CustomEdge from './CustomEdge.vue'
interface Props {
action: string
role: string
}
const props = withDefaults(defineProps<Props>(), { action: 'edit', role: 'teacher' })
provide('action', props.action)
provide('role', props.role)
let id = 0 let id = 0
const getId = () => `node_${id++}` const getId = () => `node_${id++}`
......
<!-- 定时触发 --> <!-- 定时触发 -->
<script setup> <script setup>
import { useVueFlow } from '@vue-flow/core'
import NodeTemplate from '../NodeTemplate.vue' import NodeTemplate from '../NodeTemplate.vue'
const props = defineProps({ node: Object }) const props = defineProps({ node: Object })
const action = inject('action')
const role = inject('role')
const { findNode } = useVueFlow()
// 设置 // 设置
const settingVisible = ref(false) const settingVisible = ref(false)
const formRef = ref() const formRef = ref()
const form = reactive({ id: '', name: '', type: '' }) const form = reactive({ id: '', name: '', type: '', trigger_type: '单次触发', trigger_time: '', answer_analysis: '' })
watchEffect(() => {
watch(settingVisible, () => {
if (props.node) Object.assign(form, props.node.data) if (props.node) Object.assign(form, props.node.data)
}) })
const rules = ref({}) const rules = ref({})
// 保存 // 保存
function handleSubmit() {} function handleSubmit() {
formRef.value.validate().then(() => {
updateNode()
settingVisible.value = false
})
}
function updateNode() {
const node = findNode(props.node.id)
if (node) Object.assign(node.data, form)
}
function handleClosed() {
formRef.value.resetFields()
}
</script> </script>
<template> <template>
...@@ -24,16 +44,64 @@ function handleSubmit() {} ...@@ -24,16 +44,64 @@ function handleSubmit() {}
{{ node.label }} {{ node.label }}
</NodeTemplate> </NodeTemplate>
<el-dialog title="设置组件" append-to-body width="600px" v-model="settingVisible" v-if="settingVisible"> <el-dialog title="设置组件" append-to-body width="600px" v-model="settingVisible" @close="handleClosed">
<el-form ref="formRef" :model="form" :rules="rules" label-suffix=":"> <el-form ref="formRef" :model="form" :rules="rules" label-suffix=":">
<!-- 学生设置组件 -->
<template v-if="role === 'student'">
<el-row justify="space-between"> <el-row justify="space-between">
<el-form-item label="组件类型"> {{ form.type }} </el-form-item> <el-form-item label="组件类型">{{ form.type }}</el-form-item>
<el-form-item label="组件名称"> <el-form-item label="组件名称">{{ form.name }}</el-form-item>
{{ form.name }}
</el-form-item>
<el-form-item label="分值">{{ form.score }} </el-form-item> <el-form-item label="分值">{{ form.score }} </el-form-item>
</el-row> </el-row>
<slot name="form" :form="form"></slot> <el-form-item label="触发类型" prop="trigger_type">
<el-radio-group v-model="form.trigger_type">
<el-radio label="单次触发" />
<el-radio label="重复触发" />
<el-radio label="立即触发" />
</el-radio-group>
</el-form-item>
<el-form-item label="触发时间" prop="trigger_time">
<el-date-picker v-model="form.trigger_time" type="date" />
</el-form-item>
</template>
<!-- 老师设置组件 -->
<template v-if="role === 'teacher'">
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="组件类型">{{ form.type }}</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="组件名称">{{ form.name }}</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="组件分值" prop="score">
<el-input v-model="form.score" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="已设置组件分值">110</el-form-item>
</el-col>
</el-row>
<el-card header="标准答案" shadow="never">
<el-form-item label="触发类型" prop="trigger_type">
<el-radio-group v-model="form.trigger_type">
<el-radio label="单次触发" />
<el-radio label="重复触发" />
<el-radio label="立即触发" />
</el-radio-group>
</el-form-item>
<el-form-item label="触发时间" prop="trigger_time">
<el-date-picker v-model="form.trigger_time" type="date" />
</el-form-item>
</el-card>
<el-card header="答案解析" shadow="never" style="margin-top: 20px">
<el-form-item prop="answer_analysis">
<el-input v-model="form.answer_analysis" :rows="3" type="textarea" placeholder="请输入答案解析"></el-input>
</el-form-item>
</el-card>
</template>
</el-form> </el-form>
<template #footer> <template #footer>
<el-row justify="center"> <el-row justify="center">
......
...@@ -28,7 +28,7 @@ function handleSubmit() {} ...@@ -28,7 +28,7 @@ function handleSubmit() {}
<template> <template>
<AppCard title="自由旅程"> <AppCard title="自由旅程">
<el-card shadow="never" style="margin-bottom: 20px"></el-card> <el-card shadow="never" style="margin-bottom: 20px"></el-card>
<TripFlow v-model="elements" style="height: 80vh"> <TripFlow v-model="elements" action="edit" role="student" style="height: 80vh">
<template #footer> <template #footer>
<el-row justify="center"> <el-row justify="center">
<el-button type="primary" auto-insert-space @click="handleSubmit">保存</el-button> <el-button type="primary" auto-insert-space @click="handleSubmit">保存</el-button>
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论