349 lines
10 KiB
Vue
349 lines
10 KiB
Vue
<template>
|
|
<div>
|
|
<!-- 使用 el-tabs 组件创建可切换的选项卡 -->
|
|
<el-tabs v-model="activeTab" style="margin-top: 20px;">
|
|
<!-- 第一个 tab - 通用参数 -->
|
|
<el-tab-pane label="通用参数" name="tab1">
|
|
<el-form :model="form" label-width="200px" style="margin-top: 20px;">
|
|
<el-row :gutter="20">
|
|
<el-col :span="12">
|
|
|
|
|
|
<!-- 是否使用监考密码验证 -->
|
|
<el-form-item label="是否使用监考密码验证">
|
|
<el-switch
|
|
v-model="form.isExamPassword"
|
|
active-value="0"
|
|
inactive-value="1"
|
|
active-text="是"
|
|
inactive-text="否"
|
|
@change="handleFormChange" />
|
|
</el-form-item>
|
|
|
|
<!-- 监考密码 -->
|
|
<el-form-item label="监考密码" v-if="form.isExamPassword === '0'">
|
|
<el-input v-model="form.examPassword" placeholder="请输入监考密码" @input="handleFormChange" />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="是否显示试卷编号">
|
|
<el-switch
|
|
v-model="form.isNumber"
|
|
active-value="0"
|
|
inactive-value="1"
|
|
active-text="是"
|
|
inactive-text="否"
|
|
@change="handleFormChange" />
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
<el-row :gutter="20">
|
|
<el-col :span="12">
|
|
<el-form-item label="是否显示解析按钮">
|
|
<el-switch
|
|
v-model="form.isContent"
|
|
active-value="0"
|
|
inactive-value="1"
|
|
active-text="是"
|
|
inactive-text="否"
|
|
@change="handleFormChange" />
|
|
</el-form-item>
|
|
</el-col>
|
|
|
|
<el-col :span="12">
|
|
<el-form-item label="考生答题时是否显示试题编号">
|
|
<el-switch
|
|
v-model="form.isAnswerId"
|
|
active-value="0"
|
|
inactive-value="1"
|
|
active-text="是"
|
|
inactive-text="否"
|
|
@change="handleFormChange" />
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
|
|
<el-row :gutter="20">
|
|
<el-col :span="12">
|
|
<el-form-item label="是否启用考场设置">
|
|
<el-switch
|
|
v-model="form.isSession"
|
|
active-value="0"
|
|
inactive-value="1"
|
|
active-text="是"
|
|
inactive-text="否"
|
|
@change="handleFormChange" />
|
|
</el-form-item>
|
|
</el-col>
|
|
|
|
|
|
<el-col :span="12">
|
|
<el-form-item label="是否显示答案按钮">
|
|
<el-switch
|
|
v-model="form.isAnswer"
|
|
active-value="0"
|
|
inactive-value="1"
|
|
active-text="是"
|
|
inactive-text="否"
|
|
@change="handleFormChange" />
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
<el-row :gutter="20">
|
|
<el-col :span="12">
|
|
|
|
<!-- 练习成绩保存 -->
|
|
<el-form-item label="练习成绩保存">
|
|
<el-radio-group v-model="form.saveGrades" @change="handleFormChange">
|
|
<el-radio label="0">最高成绩</el-radio>
|
|
<el-radio label="1">最新成绩</el-radio>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
</el-col>
|
|
|
|
<el-col :span="12">
|
|
<el-form-item label="是否显示重答按钮">
|
|
<el-switch
|
|
v-model="form.isRepeat"
|
|
active-value="0"
|
|
inactive-value="1"
|
|
active-text="是"
|
|
inactive-text="否"
|
|
@change="handleFormChange" />
|
|
</el-form-item>
|
|
|
|
</el-col>
|
|
</el-row>
|
|
<el-row :gutter="20">
|
|
<el-col :span="12">
|
|
<el-form-item label="是否有测评时长限制">
|
|
<el-switch
|
|
v-model="form.isTime"
|
|
active-value="0"
|
|
inactive-value="1"
|
|
active-text="是"
|
|
inactive-text="否"
|
|
@change="handleFormChange" />
|
|
</el-form-item>
|
|
</el-col>
|
|
|
|
|
|
|
|
|
|
<el-col :span="12">
|
|
<el-form-item label="学生是否可以查看试卷">
|
|
<el-switch
|
|
v-model="form.isLook"
|
|
active-value="0"
|
|
inactive-value="1"
|
|
active-text="是"
|
|
inactive-text="否"
|
|
@change="handleFormChange" />
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
|
|
<el-row :gutter="20">
|
|
|
|
<el-col :span="12">
|
|
<el-form-item label="测评时长" >
|
|
<el-time-picker
|
|
v-model="form.examTime"
|
|
value-format="HH:mm:ss"
|
|
placeholder="请设置测评时长"
|
|
class="ele-fluid"
|
|
@change="handleFormChange"
|
|
/>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="定时检查与学生端联通性，每">
|
|
<el-input-number v-model="form.isConnect" label="分钟" @change="handleFormChange" />
|
|
<span>分钟传一次,断联直接交卷</span>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
|
|
</el-form>
|
|
</el-tab-pane>
|
|
<!-- 第二个 tab - 试卷答题文件 -->
|
|
<el-tab-pane label="试卷答题文件" name="tab2">
|
|
<el-form :model="form" label-width="200px" style="margin-top: 20px;">
|
|
<!-- 学生文件存放系统盘 -->
|
|
<el-form-item label="驱动器为学生文件存放系统盘">
|
|
<el-radio-group v-model="form.driver" @change="handleFormChange">
|
|
<el-radio label="C">C</el-radio>
|
|
<el-radio label="D">D</el-radio>
|
|
<el-radio label="E">E</el-radio>
|
|
<el-radio label="F">F</el-radio>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
|
|
<!-- 考试目录名称 -->
|
|
<el-form-item label="考试目录名称">
|
|
<el-input v-model="form.directory" placeholder="请输入考试目录名称" @input="handleFormChange" />
|
|
</el-form-item>
|
|
|
|
<!-- 定时上传考试目录 -->
|
|
<el-form-item label="定时上传考试目录每">
|
|
<el-input-number v-model="form.uploadTime" :min="1" label="分钟" @change="handleFormChange" />
|
|
<span>分钟传一次</span>
|
|
</el-form-item>
|
|
|
|
<!-- 完成考试后是否删除考试目录 -->
|
|
<el-form-item label="完成考试后是否删除考试目录">
|
|
<el-radio-group v-model="form.isDel" @change="handleFormChange">
|
|
<el-radio label="0">是</el-radio>
|
|
<el-radio label="1">否</el-radio>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
</el-form>
|
|
</el-tab-pane>
|
|
|
|
|
|
|
|
|
|
|
|
<el-tab-pane label="防作弊功能" name="tab3">
|
|
<el-form :model="form" label-width="200px" style="margin-top: 20px;">
|
|
|
|
|
|
<el-row :gutter="20">
|
|
<el-col :span="12">
|
|
<!-- 禁止学生使用U盘 -->
|
|
<el-form-item label="禁止学生使用U盘">
|
|
<el-switch
|
|
v-model="form.usb"
|
|
active-value="0"
|
|
inactive-value="1"
|
|
active-text="是"
|
|
inactive-text="否"
|
|
@change="handleFormChange" />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="是否可以文件共享">
|
|
<el-switch
|
|
v-model="form.isFile"
|
|
active-value="0"
|
|
inactive-value="1"
|
|
active-text="是"
|
|
inactive-text="否"
|
|
@change="handleFormChange" />
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
|
|
<el-row :gutter="20">
|
|
<el-col :span="12">
|
|
<!-- 禁止学生使用U盘 -->
|
|
<el-form-item label="禁用外网">
|
|
<el-switch
|
|
v-model="form.isNet"
|
|
active-value="0"
|
|
inactive-value="1"
|
|
active-text="是"
|
|
inactive-text="否"
|
|
@change="handleFormChange" />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="禁止截屏">
|
|
<el-switch
|
|
v-model="form.isScreen"
|
|
active-value="0"
|
|
inactive-value="1"
|
|
active-text="是"
|
|
inactive-text="否"
|
|
@change="handleFormChange" />
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
</el-form>
|
|
</el-tab-pane>
|
|
<el-tab-pane label="考试注意事项提醒" name="tab4">
|
|
<div class="block" @blur.capture="handleFormChange">
|
|
<Editor v-model="form.warn" height="250px" />
|
|
</div>
|
|
</el-tab-pane>
|
|
|
|
</el-tabs>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref, onMounted } from 'vue'
|
|
import { getParam, updateParam } from '@/api/system/param' // 引入后台请求方法
|
|
|
|
const props = defineProps({
|
|
taskId: {
|
|
type: String,
|
|
default: ''
|
|
}
|
|
})
|
|
|
|
// 字段初始值设置为空或空字符串
|
|
const form = ref({
|
|
isAnswerId:'',
|
|
isContent:'',
|
|
isNumber:'',
|
|
isExamPassword: '', // 是否使用监考密码验证
|
|
examPassword: '', // 监考密码
|
|
usb: '', // 是否禁止U盘
|
|
saveGrades: '', // 成绩保存方式
|
|
driver: '', // 存放系统盘
|
|
directory: '', // 考试目录名称
|
|
uploadTime: '', // 上传间隔时间
|
|
isDel: '',
|
|
isRepeat:'', // 是否删除目录
|
|
isAnswer:'',
|
|
isLook:'',
|
|
isConnect:'',
|
|
isFile:'',
|
|
isNet:'',
|
|
isScreen:'',
|
|
warn:''
|
|
})
|
|
|
|
const activeTab = ref('tab1')
|
|
|
|
// 页面加载时用 taskId 请求后端并赋值
|
|
onMounted(async () => {
|
|
if (props.taskId) {
|
|
try {
|
|
const res = await getParam({ taskId: props.taskId })
|
|
const data = res || {}
|
|
console.log('任务详情：', data)
|
|
|
|
// 用 Object.assign 将后端数据合并到 form
|
|
Object.assign(form.value, data)
|
|
} catch (error) {
|
|
console.error('获取任务详情失败', error)
|
|
}
|
|
}
|
|
})
|
|
|
|
// 表单变化时触发请求
|
|
const handleFormChange = async () => {
|
|
if (form.value.isExamPassword === '1') {
|
|
form.value.examPassword = ''
|
|
}
|
|
try {
|
|
// 发送请求以更新数据
|
|
const response = await updateParam(form.value)
|
|
console.log('更新结果:', response)
|
|
} catch (error) {
|
|
console.error('更新数据失败', error)
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
/* 可以为 tab 设置额外的样式，具体根据需求定制 */
|
|
</style>
|