|
@@ -1,65 +1,25 @@
|
1
|
1
|
<template>
|
2
|
2
|
<div style="padding: 20px">
|
3
|
3
|
<h2 style="text-align: center">
|
4
|
|
- 问卷题目{{ questionId!==0 ? "编辑" : "添加" }}
|
|
4
|
+ 问卷题目{{ questionId ? "编辑" : "添加" }}
|
5
|
5
|
</h2>
|
6
|
6
|
<el-form ref="form" :model="form" label-width="90px">
|
7
|
7
|
<el-form-item label="题目:">
|
8
|
|
- <el-input v-model="form.title" placeholder="请输入问题名(必填)">
|
9
|
|
- <el-select slot="prepend" v-model="form.optType" style="width:100px" placeholder="请选择">
|
10
|
|
- <el-option label="单选题" value="single" />
|
11
|
|
- <el-option label="多选题" value="many" />
|
12
|
|
- <el-option label="判断题" value="judgment" />
|
|
8
|
+ <el-input v-model="form.content" placeholder="请输入问题名(必填)">
|
|
9
|
+ <el-select slot="prepend" v-model="form.questionType" style="width:100px" placeholder="请选择">
|
|
10
|
+ <el-option label="单选题" value="radio" />
|
|
11
|
+ <el-option label="多选题" value="checkBox" />
|
|
12
|
+ <el-option label="判断题" value="switch" />
|
|
13
|
+ <el-option label="简答题" value="textarea" />
|
13
|
14
|
</el-select>
|
14
|
15
|
</el-input>
|
15
|
|
- <!-- <el-select
|
16
|
|
- v-else
|
17
|
|
- v-model="nowQuestionId"
|
18
|
|
- filterable
|
19
|
|
- default-first-option
|
20
|
|
- style="width:100%"
|
21
|
|
- placeholder="请选择"
|
22
|
|
- :disabled="questionId!==0"
|
23
|
|
- >
|
24
|
|
- <el-option
|
25
|
|
- v-for="item in questionList"
|
26
|
|
- :key="item.questionId"
|
27
|
|
- :label="item.title"
|
28
|
|
- :value="item.questionId"
|
29
|
|
- />
|
30
|
|
- </el-select> -->
|
31
|
|
- </el-form-item>
|
32
|
|
- <el-form-item label="分数">
|
33
|
|
- <el-input v-model="form.score" type="number" min="1" max="50" />
|
34
|
|
- </el-form-item>
|
35
|
|
- <el-form-item
|
36
|
|
- v-if="questionId!==0"
|
37
|
|
- label="正确选项:"
|
38
|
|
- >
|
39
|
|
- <!-- filterable可搜索 multiple可多选 default-first-option回车可选-->
|
40
|
|
- <el-select
|
41
|
|
- v-model="form.rightAnswer"
|
42
|
|
- disabled
|
43
|
|
- style="width:100%"
|
44
|
|
- multiple
|
45
|
|
- filterable
|
46
|
|
- default-first-option
|
47
|
|
- placeholder="请选择"
|
48
|
|
- >
|
49
|
|
- <el-option
|
50
|
|
- v-for="item in rightList"
|
51
|
|
- :key="item"
|
52
|
|
- :label="item"
|
53
|
|
- :value="item"
|
54
|
|
- />
|
55
|
|
- </el-select>
|
56
|
16
|
</el-form-item>
|
57
|
17
|
<el-form-item>
|
58
|
18
|
<el-button type="primary" @click="onSubmit">确定</el-button>
|
59
|
19
|
<el-button @click="$router.go(-1)">返回</el-button>
|
60
|
20
|
</el-form-item>
|
61
|
21
|
</el-form>
|
62
|
|
- <el-card v-if="questionId!==0" shadow="never" body-style="padding:0" class="box-card">
|
|
22
|
+ <el-card v-if="questionId && form.questionType !== 'textarea'" shadow="never" body-style="padding:0" class="box-card">
|
63
|
23
|
<div slot="header" class="clearfix">
|
64
|
24
|
<h3 style="float:left">答案列表</h3>
|
65
|
25
|
<el-button
|
|
@@ -70,13 +30,14 @@
|
70
|
30
|
>添加答案</el-button>
|
71
|
31
|
</div>
|
72
|
32
|
<ul style="list-style-type: none;margin:24px 0 24px -40px">
|
73
|
|
- <li v-for="answer in answerList" :key="answer.answerId" class="answerli">
|
|
33
|
+ <li v-for="answer in form.answerList" :key="answer.answerId" class="answerli">
|
74
|
34
|
<div style="flex:1;width: 100%;overflow: hidden;display: flex;" @click="handleEdit(answer)">
|
75
|
|
- <span style="width:45px">{{ answer.option }}</span>
|
|
35
|
+ <span style="width:45px">{{ answer.optCode }}</span>
|
76
|
36
|
<span style="flex:1">{{ answer.content }}</span>
|
|
37
|
+ <span style="width:30px">{{ answer.score }}分</span>
|
77
|
38
|
</div>
|
78
|
39
|
<el-popconfirm
|
79
|
|
- style="width:30px"
|
|
40
|
+ style="width:30px;margin-left:8px"
|
80
|
41
|
icon="el-icon-info"
|
81
|
42
|
icon-color="red"
|
82
|
43
|
title="确定删除这个答案吗?"
|
|
@@ -90,7 +51,7 @@
|
90
|
51
|
<QuestionDrawer
|
91
|
52
|
:dialog="dialog"
|
92
|
53
|
:question-id="form.questionId"
|
93
|
|
- :answer-id="answerId"
|
|
54
|
+ :answer="answer"
|
94
|
55
|
:que-id="queId"
|
95
|
56
|
@handleCloseDrawer="handleCloseDrawer"
|
96
|
57
|
@handleEditDrawer="handleEditDrawer"
|
|
@@ -99,8 +60,8 @@
|
99
|
60
|
</template>
|
100
|
61
|
<script>
|
101
|
62
|
|
102
|
|
-import { saveQuestion, UpdateQuestion } from '@/api/question'
|
103
|
|
-import { getAnswerList, deleteAnswer } from '@/api/answer'
|
|
63
|
+import { saveQuestion, UpdateQuestion, getQuestionDetail } from '@/api/question'
|
|
64
|
+import { deleteAnswer } from '@/api/answer'
|
104
|
65
|
import QuestionDrawer from '@/components/Question/drawer.vue'
|
105
|
66
|
|
106
|
67
|
export default {
|
|
@@ -109,7 +70,7 @@ export default {
|
109
|
70
|
},
|
110
|
71
|
props: {
|
111
|
72
|
questionId: {
|
112
|
|
- type: Number,
|
|
73
|
+ type: String,
|
113
|
74
|
required: true
|
114
|
75
|
},
|
115
|
76
|
queId: {
|
|
@@ -120,69 +81,56 @@ export default {
|
120
|
81
|
data() {
|
121
|
82
|
return {
|
122
|
83
|
form: {
|
123
|
|
- title: undefined,
|
124
|
|
- optType: undefined,
|
125
|
|
- rightAnswer: undefined,
|
|
84
|
+ content: undefined,
|
|
85
|
+ questionType: undefined,
|
126
|
86
|
queId: undefined,
|
127
|
|
- score: 0,
|
128
|
|
- status: 1,
|
129
|
|
- questionId: undefined
|
|
87
|
+ questionId: undefined,
|
|
88
|
+ answerList: []
|
130
|
89
|
},
|
131
|
90
|
nowQuestionId: undefined, // 当前问题id用于获取答案列表 和匹配游戏模式传入答案编辑弹窗的questionId
|
132
|
|
- questionList: [], // 用于存储测试模式下选择问题的下拉菜单的数据源
|
133
|
|
- // 答案列表(包括选项 内容 特征词列表)
|
134
|
|
- answerList: [],
|
135
|
|
- answerId: undefined,
|
|
91
|
+ answer: {},
|
136
|
92
|
// 正确答案数据源
|
137
|
|
- rightList: [],
|
138
|
93
|
dialog: false
|
139
|
94
|
}
|
140
|
95
|
},
|
141
|
96
|
watch: {
|
142
|
97
|
// 用于点击左边改变右边的页面
|
143
|
98
|
questionId: function() {
|
144
|
|
- if (this.questionId !== 0) {
|
145
|
|
- // getGameLeverQuestionDetail(this.questionId, { queId: this.queId }).then((res) => {
|
146
|
|
- // this.form = res.data
|
147
|
|
- // this.form.rightAnswer = res.data.rightAnswer?.split(',')
|
|
99
|
+ if (this.questionId) {
|
148
|
100
|
this.nowQuestionId = this.questionId
|
149
|
|
- getAnswerList({ questionId: this.questionId }).then((res) => {
|
150
|
|
- this.answerList = res.data.records
|
|
101
|
+ getQuestionDetail(this.questionId).then((res) => {
|
|
102
|
+ this.form = res.data
|
151
|
103
|
})
|
152
|
|
- // })
|
153
|
104
|
} else {
|
154
|
105
|
this.form = {
|
155
|
|
- title: undefined,
|
156
|
|
- optType: undefined,
|
157
|
|
- score: 0,
|
158
|
|
- status: 1,
|
159
|
|
- queId: undefined,
|
160
|
|
- rightAnswer: undefined,
|
161
|
|
- questionId: undefined
|
|
106
|
+ content: undefined,
|
|
107
|
+ questionType: undefined,
|
|
108
|
+ queId: this.queId,
|
|
109
|
+ questionId: undefined,
|
|
110
|
+ answerList: []
|
162
|
111
|
}
|
163
|
112
|
this.nowQuestionId = undefined
|
164
|
113
|
}
|
165
|
114
|
}
|
166
|
115
|
},
|
167
|
|
- // mounted: function() {
|
168
|
|
- // getQuestionList({ pageSize: 999 }).then((res) => { this.questionList = res.data.records })
|
169
|
|
- // },
|
170
|
116
|
methods: {
|
171
|
117
|
// 添加答案
|
172
|
118
|
onAddAnswer() {
|
173
|
|
- this.answerId = undefined
|
|
119
|
+ this.answer = {}
|
174
|
120
|
this.dialog = true
|
175
|
121
|
},
|
176
|
122
|
// 编辑答案
|
177
|
123
|
handleEdit(val) {
|
178
|
|
- this.answerId = val.answerId
|
|
124
|
+ this.answer = val
|
179
|
125
|
this.dialog = true
|
180
|
126
|
},
|
181
|
127
|
// 删除答案
|
182
|
128
|
handleDelete(val) {
|
183
|
129
|
deleteAnswer(val.answerId).then((res) => {
|
184
|
130
|
this.$message('删除答案成功')
|
185
|
|
- this.handleAnswerList()
|
|
131
|
+ getQuestionDetail(this.questionId).then((res) => {
|
|
132
|
+ this.form = res.data
|
|
133
|
+ })
|
186
|
134
|
})
|
187
|
135
|
},
|
188
|
136
|
// 关闭答案抽屉
|
|
@@ -192,12 +140,8 @@ export default {
|
192
|
140
|
// 编辑答案抽屉成功重新查询列表
|
193
|
141
|
handleEditDrawer(val) {
|
194
|
142
|
this.handleCloseDrawer()
|
195
|
|
- this.handleAnswerList()
|
196
|
|
- },
|
197
|
|
- // 查询当前问题答案列表
|
198
|
|
- handleAnswerList() {
|
199
|
|
- getAnswerList({ questionId: this.nowQuestionId }).then((res) => {
|
200
|
|
- this.answerList = res.data.records
|
|
143
|
+ getQuestionDetail(this.questionId).then((res) => {
|
|
144
|
+ this.form = res.data
|
201
|
145
|
})
|
202
|
146
|
},
|
203
|
147
|
// 转换特征数组数据格式
|
|
@@ -210,8 +154,8 @@ export default {
|
210
|
154
|
},
|
211
|
155
|
// 非空判断方法
|
212
|
156
|
handelNull() {
|
213
|
|
- if (this.form.optType) {
|
214
|
|
- if (this.form.title) {
|
|
157
|
+ if (this.form.questionType) {
|
|
158
|
+ if (this.form.content) {
|
215
|
159
|
return true
|
216
|
160
|
} else {
|
217
|
161
|
this.$message('请输入题目')
|
|
@@ -225,16 +169,13 @@ export default {
|
225
|
169
|
onSubmit() {
|
226
|
170
|
if (this.handelNull()) {
|
227
|
171
|
const data = { ...this.form }
|
228
|
|
- if (this.questionId === 0) {
|
|
172
|
+ if (!this.questionId) {
|
229
|
173
|
saveQuestion({ ...data, queId: this.queId, questionId: this.nowQuestionId }).then((res) => {
|
230
|
174
|
this.$message('添加问题成功')
|
231
|
175
|
this.$emit('handleRefreshQuestion', true)
|
232
|
176
|
this.$emit('handleEditQuestion', res.data.questionId)
|
233
|
177
|
})
|
234
|
178
|
} else {
|
235
|
|
- if (data.rightAnswer) {
|
236
|
|
- data.rightAnswer = data.rightAnswer.toString()
|
237
|
|
- }
|
238
|
179
|
UpdateQuestion({ ...data, queId: this.queId, questionId: this.nowQuestionId }, this.nowQuestionId).then((res) => {
|
239
|
180
|
this.$message('修改问题成功')
|
240
|
181
|
this.$emit('handleRefreshQuestion', true)
|