|
@@ -1,60 +1,124 @@
|
|
|
<template>
|
|
|
- <div id="detail">
|
|
|
- <detail-frame title="题库详情页" returns="./index">
|
|
|
+ <div id="lookdetail">
|
|
|
+ <detail-frame title="作业题详情页" returns="./index">
|
|
|
<data-form :fields="fields" :rules="rules" @save="handleSave" :isNew="isNew">
|
|
|
<template #options="{item}">
|
|
|
- <template v-if="item.model === 'type'">
|
|
|
- <el-option label="问答" value="2"></el-option>
|
|
|
- <el-option label="多选" value="1"></el-option>
|
|
|
- <el-option label="单选" value="0"></el-option>
|
|
|
- </template>
|
|
|
- </template>
|
|
|
- <template #radios="{item}">
|
|
|
<template v-if="item.model === 'state'">
|
|
|
- <el-radio label="1">使用</el-radio>
|
|
|
- <el-radio label="0">弃用</el-radio>
|
|
|
+ <el-option label="弃用" value="0"></el-option>
|
|
|
+ <el-option label="正常" value="1"></el-option>
|
|
|
</template>
|
|
|
</template>
|
|
|
+ <template #custom="{ item, form, fieldChange }">
|
|
|
+ <el-button type="text" @click="dialogFormVisible = true">选择题类型</el-button>
|
|
|
+ <el-dialog title="选择题类型" :visible.sync="dialogFormVisible">
|
|
|
+ <el-form :model="form">
|
|
|
+ <template>
|
|
|
+ <el-tabs v-model="activeName" @tab-click="handleClick">
|
|
|
+ <el-tab-pane label="单选" name="first">
|
|
|
+ <el-button type="text" @click="dialogFormVisible1 = true">增加</el-button>
|
|
|
+
|
|
|
+ <el-dialog title="增加页面" :visible.sync="dialogFormVisible1">
|
|
|
+ <el-form :model="form" label-width="80px">
|
|
|
+ <el-form-item label="序号" :label-width="formLabelWidth">
|
|
|
+ <el-input v-model="form.zuoyeid" autocomplete="off" placeholder="请输入序号" prop="zuoyeid"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="名称" :label-width="formLabelWidth">
|
|
|
+ <el-input v-model="form.zuoyename" autocomplete="off" placeholder="请输入名称" prop="zuoyename"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="答案" :label-width="formLabelWidth">
|
|
|
+ <el-input v-model="form.answer" autocomplete="off" placeholder="请输入答案" prop="answer"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <div slot="footer" class="dialog-footer">
|
|
|
+ <el-button @click="dialogFormVisible1 = false">取 消</el-button>
|
|
|
+ <el-button type="primary" @click="dialogFormVisible1 = false">确 定</el-button>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+ <data-table :fields="fieldss" :data="index" :opera="opera" @edit="toEdit"></data-table>
|
|
|
+ </el-tab-pane>
|
|
|
+ <el-tab-pane label="多选" name="first"></el-tab-pane>
|
|
|
+ <el-tab-pane label="问答" name="third">
|
|
|
+ <el-form ref="form" :model="form" label-width="80px">
|
|
|
+ <el-form-item label="问答">
|
|
|
+ <el-input v-model="form.duoxuan" placeholder="请输入问答题"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </el-tab-pane>
|
|
|
+ </el-tabs>
|
|
|
+ </template>
|
|
|
+ </el-form>
|
|
|
+ <div slot="footer" class="dialog-footer">
|
|
|
+ <el-button @click="dialogFormVisible = false">取 消</el-button>
|
|
|
+ <el-button type="primary" @click="dialogFormVisible = false">确 定</el-button>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+ </template>
|
|
|
</data-form>
|
|
|
</detail-frame>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
+import dataTable from '@frame/layout/admin/data-table';
|
|
|
import detailFrame from '@frame/layout/admin/detail-frame';
|
|
|
import dataForm from '@frame/components/form';
|
|
|
+import upload from '@frame/components/upload';
|
|
|
export default {
|
|
|
metaInfo: { title: '题库详情页' },
|
|
|
- name: 'detail',
|
|
|
+ name: 'lookdetail',
|
|
|
props: {},
|
|
|
components: {
|
|
|
detailFrame,
|
|
|
dataForm,
|
|
|
+ dataTable,
|
|
|
},
|
|
|
data: () => ({
|
|
|
+ opera: [
|
|
|
+ {
|
|
|
+ label: '编辑',
|
|
|
+ icon: 'el-icon-edit',
|
|
|
+ method: 'edit',
|
|
|
+ },
|
|
|
+ ],
|
|
|
+
|
|
|
+ activeName: '',
|
|
|
+ dialogTableVisible: false,
|
|
|
+ dialogTableVisible1: false,
|
|
|
+ dialogFormVisible: false,
|
|
|
+ dialogFormVisible1: false,
|
|
|
+ form: {
|
|
|
+ duoxuan: '',
|
|
|
+ name: '',
|
|
|
+ region: '',
|
|
|
+ date1: '',
|
|
|
+ date2: '',
|
|
|
+ delivery: false,
|
|
|
+ type: [],
|
|
|
+ zuoyeid: '',
|
|
|
+ zuoyename: '',
|
|
|
+ answer: '',
|
|
|
+ },
|
|
|
+ formLabelWidth: '120px',
|
|
|
+ fieldss: [
|
|
|
+ { label: '序号', required: true, model: 'zuoyeid' },
|
|
|
+ { label: '名称', required: true, model: 'zuoyename' },
|
|
|
+ { label: '答案', required: true, model: 'answer' },
|
|
|
+ ],
|
|
|
+
|
|
|
+ index: [{ zuoyeid: '1' }],
|
|
|
fields: [
|
|
|
- { label: '题名', required: true, model: 'name' },
|
|
|
- { label: '类别', required: true, model: 'type', type: `select` },
|
|
|
- { label: '状态', model: 'state', type: `radio` },
|
|
|
- { label: '选项序号', required: true, model: 'optionid' },
|
|
|
- { label: '选项名称', required: true, model: 'optionname' },
|
|
|
+ { label: '题名', required: true, model: 'title' },
|
|
|
+ { label: '状态', required: true, model: 'state', type: `select` },
|
|
|
+ { label: '题型', required: true, model: 'type', type: 'tixing', custom: true },
|
|
|
],
|
|
|
rules: {
|
|
|
- name: [{ required: true, message: '请输入题名' }],
|
|
|
- type: [{ required: true, message: '请选择类别' }],
|
|
|
+ zuoyeid: [{ required: true, message: '请输入序号', trigger: 'blur' }],
|
|
|
+ zuoyename: [{ required: true, message: '请输入名称', trigger: 'blur' }],
|
|
|
+ answer: [{ required: true, message: '请输入答案', trigger: 'blur' }],
|
|
|
+ name: [{ required: true, message: '请输入作业姓名' }],
|
|
|
state: [{ required: true, message: '请选择状态' }],
|
|
|
- optionid: [{ required: true, message: '请选择选项序号' }],
|
|
|
- optionname: [{ required: true, message: '请选择选项名称' }],
|
|
|
-
|
|
|
- tel: [
|
|
|
- { required: true, message: '请输入电话' },
|
|
|
- { min: 11, max: 11, message: '请输入11位电话号码', trigger: 'blur' },
|
|
|
- ],
|
|
|
- aid: [{ required: true, message: '请输入紧急联系人' }],
|
|
|
- aid_tel: [
|
|
|
- { required: true, message: '请输入紧急联系人电话' },
|
|
|
- { min: 11, max: 11, message: '请输入11位电话号码', trigger: 'blur' },
|
|
|
- ],
|
|
|
+ tixing: [{ required: true, message: '请选择题类型' }],
|
|
|
+ title: [{ required: true, message: '请选择标题' }],
|
|
|
},
|
|
|
}),
|
|
|
created() {},
|
|
@@ -64,6 +128,18 @@ export default {
|
|
|
},
|
|
|
},
|
|
|
methods: {
|
|
|
+ search({ skip = 0, limit = 15, ...info } = {}) {
|
|
|
+ console.log(`in search`);
|
|
|
+ },
|
|
|
+ toEdit(data) {
|
|
|
+ console.log(`in toEdit`);
|
|
|
+ console.log(data);
|
|
|
+ },
|
|
|
+ handleClick(tab, event) {
|
|
|
+ console.log(tab, event);
|
|
|
+ },
|
|
|
+
|
|
|
+ uploadSuccess() {},
|
|
|
async handleSave({ isNew, data }) {
|
|
|
console.log(isNew);
|
|
|
console.log(data);
|
|
@@ -72,4 +148,29 @@ export default {
|
|
|
};
|
|
|
</script>
|
|
|
|
|
|
-<style lang="less" scoped></style>
|
|
|
+<style lang="less" scoped>
|
|
|
+/deep/.el-tabs__nav-wrap::after {
|
|
|
+ content: '';
|
|
|
+ position: absolute;
|
|
|
+ left: 0;
|
|
|
+ bottom: 0;
|
|
|
+ width: 100%;
|
|
|
+ height: 2px;
|
|
|
+ background-color: #ffffff;
|
|
|
+ z-index: 1;
|
|
|
+}
|
|
|
+
|
|
|
+/deep/.el-tabs__active-bar {
|
|
|
+ position: absolute;
|
|
|
+ bottom: 0;
|
|
|
+ left: 0;
|
|
|
+ height: 2px;
|
|
|
+ background-color: #ffffff;
|
|
|
+}
|
|
|
+/deep/.el-tabs__item.is-active {
|
|
|
+ color: #303133;
|
|
|
+}
|
|
|
+/deep/.el-input__inner {
|
|
|
+ margin: 0 0 20px 0;
|
|
|
+}
|
|
|
+</style>
|