<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
</head>
<body>
<div id="app">
<p>
* 试题分类:
<el-select v-model="selectedOptionclassify" placeholder="请选择"
@change="selectedOptionclassifyOptionChange">
<el-option label="消防安全" value="selectedOptionclassifyform1"></el-option>
<el-option label="临时用电" value="selectedOptionclassifyform2"></el-option>
<el-option label="应急管理" value="selectedOptionclassifyform3"></el-option>
</el-select>
* 题型:
<el-select v-model="selectedOptionType" placeholder="请选择" @change="handleOptionChange">
<el-option label="单选题" value="form1"></el-option>
<el-option label="填空题" value="form4"></el-option>
</el-select>
* 难度:
<el-select v-model="selectedOptiondifficulty" placeholder="请选择"
@change="selectedOptiondifficultyOptionChange">
<el-option label="不限难度" value="selectedOptiondifficultyform1"></el-option>
<el-option label="容易" value="selectedOptiondifficultyform2"></el-option>
<el-option label="中等" value="selectedOptiondifficultyform3"></el-option>
<el-option label="困难" value="selectedOptiondifficultyform4"></el-option>
</el-select>
</p>
<!--单选题-->
<div v-if="selectedOptionType === 'form1'">
<el-form ref="form" :model="form" label-width="80px">
<el-form-item label="* 题干:">
<el-input v-model="form.stem1" placeholder="请在这里输入题干"></el-input>
</el-form-item>
<el-form-item label="* 选项A:">
<el-input v-model="form.AValue" placeholder="请输入内容"></el-input>
<el-radio-group v-model="form.isAnswer1">
<el-radio label="1">设为正确答案</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="* 选项B:">
<el-input v-model="form.AValue" placeholder="请输入内容"></el-input>
<el-radio-group v-model="form.isAnswer1">
<el-radio label="2">设为正确答案</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="* 选项C:">
<el-input v-model="form.AValue" placeholder="请输入内容"></el-input>
<el-radio-group v-model="form.isAnswer1">
<el-radio label="3">设为正确答案</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="* 选项D:">
<el-input v-model="form.AValue" placeholder="请输入内容"></el-input>
<el-radio-group v-model="form.isAnswer1">
<el-radio label="4">设为正确答案</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="答案解析:">
<el-input v-model="form.analysis" placeholder="请在这里输入正确答案解析"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit">保存提交</el-button>
<el-button>取消</el-button>
</el-form-item>
</el-form>
</div>
<!--填空题-->
<div v-else-if="selectedOptionType === 'form4'">
<el-form ref="form" :model="form" label-width="80px">
<el-form-item label="* 题干:">
<el-input v-model="form.stem" placeholder="请在这里输入题干"></el-input>
</el-form-item>
<el-form-item label="答案解析:">
<el-input v-model="form.analysis" placeholder="请在这里输入正确答案解析"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit">保存提交</el-button>
<el-button>取消</el-button>
</el-form-item>
</el-form>
</div>
</div>
<script src="https://unpkg.com/vue@2/dist/vue.js"></script>
<script src="https://unpkg.com/element-ui@2.15.13/lib/index.js"></script>
<script>
new Vue({
el: '#app',
data() {
return {
selectedOptionType: '',
selectedOptiondifficulty: '',
selectedOptionclassify: '',
form1Input: '',
form2Input: '',
form: {
stem: '',
AValue: '',
isAnswer1: '',
isAnswer: '',
isAnswer2: '',
isAnswer3: '',
isAnswer4: '',
analysis: '',
stem1: '',
AValue3: '正确',
muAnswer2: '',
muAnswer1: '',
muAnswer3: '',
muAnswer4: '',
AValue4: '错误',
setA: '',
isAnswer11: ''
}
};
},
methods: {
handleOptionChange() {
// 根据选择的选项进行相应的逻辑处理
},
selectedOptionclassifyOptionChange() {
},
selectedOptiondifficultyOptionChange() {
},
onSubmit() {
}
}
});
</script>
</body>
</html>