|
@@ -1,24 +1,31 @@
|
1
|
1
|
import React from 'react';
|
2
|
|
-import { Button, Form, Row, Col, Card, Input, Modal, List } from 'antd';
|
3
|
|
-import {
|
4
|
|
- DrawerForm,
|
5
|
|
- ProFormGroup,
|
6
|
|
- ProFormText,
|
7
|
|
- ProFormSelect,
|
8
|
|
- ProFormDigit,
|
9
|
|
- ProFormList
|
10
|
|
-} from '@ant-design/pro-components';
|
11
|
|
-import WangEditor from '@/components/Wangeditor';
|
|
2
|
+import { Button, Form, Row, Col, Card, List, Popconfirm } from 'antd';
|
|
3
|
+import QuForm from './QuForm';
|
12
|
4
|
import { postTaCheckItemQu, getTaCheckItemQu } from '@/service/tdlocquestion';
|
13
|
|
-import { getTaCheckItemAn } from '@/service/tacheckiteman';
|
|
5
|
+import { deleteTaCheckItemQu } from '@/service/tacheckitemqu';
|
|
6
|
+import { message } from 'antd';
|
14
|
7
|
|
15
|
8
|
const QuItem = (props) => {
|
16
|
|
- const { qu, onEdit } = props;
|
|
9
|
+ const { qu, onEdit, onDelete } = props;
|
17
|
10
|
|
18
|
|
- const quTitle = `${qu?.sortNo}. [${qu?.quType == 'fill' ? '填空' : '选择'}] ${qu?.title} (分值: ${qu?.computeType} ${qu?.anScore}/${qu?.maxScore})`
|
|
11
|
+ const quTitle = `${qu?.sortNo}. [${qu?.quType == 'fill' ? '填空' : '选择'}] ${qu?.title} (分值: ${qu?.computeType} ${qu?.anScore}/${qu?.maxScore})`
|
19
|
12
|
|
20
|
13
|
return (
|
21
|
|
- <Card title={quTitle} extra={<Button type='link' onClick={onEdit}>修改</Button>} style={{marginTop: '24px'}}>
|
|
14
|
+ <Card
|
|
15
|
+ title={quTitle}
|
|
16
|
+ style={{marginTop: '24px'}}
|
|
17
|
+ extra={(
|
|
18
|
+ <>
|
|
19
|
+ <Button type='link' onClick={onEdit}>修改</Button>
|
|
20
|
+ <Popconfirm
|
|
21
|
+ title="确认进行删除操作?"
|
|
22
|
+ onConfirm={onDelete}
|
|
23
|
+ >
|
|
24
|
+ <Button type='link' danger >删除</Button>
|
|
25
|
+ </Popconfirm>
|
|
26
|
+ </>
|
|
27
|
+ )}
|
|
28
|
+ >
|
22
|
29
|
<Card.Meta
|
23
|
30
|
title={
|
24
|
31
|
qu?.quType != 'fill' ?
|
|
@@ -56,13 +63,8 @@ export default React.forwardRef((props, ref) => {
|
56
|
63
|
const [open, setOpen] = React.useState(false);
|
57
|
64
|
const [quInfo, setQuInfo] = React.useState(false);
|
58
|
65
|
const [list, setList] = React.useState([]);
|
59
|
|
- // const [anList, setAnList] = React.useState([]);
|
60
|
|
- const [form] = Form.useForm();
|
61
|
|
-
|
62
|
|
- const onFinish = async (values) => {
|
63
|
|
- const data = { ...(quInfo || {}), ...values, itemId }
|
64
|
|
- const res = await postTaCheckItemQu(data);
|
65
|
66
|
|
|
67
|
+ const onFinish = (res) => {
|
66
|
68
|
let found = false;
|
67
|
69
|
const newList = list.map(item => {
|
68
|
70
|
if (item.quId === res.quId) {
|
|
@@ -78,9 +80,6 @@ export default React.forwardRef((props, ref) => {
|
78
|
80
|
}
|
79
|
81
|
|
80
|
82
|
setList(list);
|
81
|
|
- onChange(res);
|
82
|
|
-
|
83
|
|
- return true;
|
84
|
83
|
}
|
85
|
84
|
|
86
|
85
|
const onEditQu = (qu) => {
|
|
@@ -88,11 +87,15 @@ export default React.forwardRef((props, ref) => {
|
88
|
87
|
setOpen(true);
|
89
|
88
|
}
|
90
|
89
|
|
91
|
|
- React.useEffect(() => {
|
92
|
|
- if (quInfo) {
|
93
|
|
- form.setFieldsValue(quInfo);
|
|
90
|
+ const onDeleteQu = (qu) => {
|
|
91
|
+ if (qu?.quId) {
|
|
92
|
+ deleteTaCheckItemQu(qu.quId).then(() => {
|
|
93
|
+ setList(list.filter(x => x.quId !== qu.quId));
|
|
94
|
+ })
|
|
95
|
+ } else {
|
|
96
|
+ setList(list.filter(x => x.quId !== qu.quId));
|
94
|
97
|
}
|
95
|
|
- }, [quInfo]);
|
|
98
|
+ }
|
96
|
99
|
|
97
|
100
|
React.useEffect(() => {
|
98
|
101
|
if (itemId) {
|
|
@@ -103,149 +106,26 @@ export default React.forwardRef((props, ref) => {
|
103
|
106
|
}, [itemId]);
|
104
|
107
|
|
105
|
108
|
React.useImperativeHandle(ref, () => ({
|
106
|
|
- add: () => setOpen(true),
|
|
109
|
+ add: () => {
|
|
110
|
+ setQuInfo();
|
|
111
|
+ setOpen(true);
|
|
112
|
+ },
|
107
|
113
|
}), []);
|
108
|
114
|
|
109
|
115
|
return (
|
110
|
|
- <div>
|
111
|
|
- <DrawerForm title="问题维护" open={open} width={800} form={form} onFinish={onFinish} onOpenChange={setOpen}>
|
112
|
|
- <ProFormText
|
113
|
|
- name="title"
|
114
|
|
- label="题干描述"
|
115
|
|
- placeholder="请填写"
|
116
|
|
- rules={[
|
117
|
|
- {
|
118
|
|
- required: true,
|
119
|
|
- message: '请填写题干',
|
120
|
|
- },
|
121
|
|
- ]}
|
122
|
|
- />
|
123
|
|
- <Row gutter={24}>
|
124
|
|
- <Col span={12}>
|
125
|
|
- <ProFormSelect
|
126
|
|
- name="quType"
|
127
|
|
- label="问题类型"
|
128
|
|
- fieldProps={{
|
129
|
|
- style: { width: '100%' }
|
130
|
|
- }}
|
131
|
|
- valueEnum={{
|
132
|
|
- radio: '单选',
|
133
|
|
- fill: '填空'
|
134
|
|
- }}
|
135
|
|
- rules={[
|
136
|
|
- {
|
137
|
|
- required: true,
|
138
|
|
- message: '请选择问题类型',
|
139
|
|
- },
|
140
|
|
- ]}
|
141
|
|
- />
|
142
|
|
- </Col>
|
143
|
|
- <Col span={12}>
|
144
|
|
- <ProFormSelect
|
145
|
|
- name="computeType"
|
146
|
|
- label="计分方式"
|
147
|
|
- fieldProps={{
|
148
|
|
- style: { width: '100%' }
|
149
|
|
- }}
|
150
|
|
- valueEnum={{
|
151
|
|
- '+': '得分',
|
152
|
|
- '-': '扣分'
|
153
|
|
- }}
|
154
|
|
- rules={[
|
155
|
|
- {
|
156
|
|
- required: true,
|
157
|
|
- message: '请选择计分方式',
|
158
|
|
- },
|
159
|
|
- ]}
|
160
|
|
- />
|
161
|
|
- </Col>
|
162
|
|
- </Row>
|
163
|
|
- <Row gutter={24}>
|
164
|
|
- <Col span={12}>
|
165
|
|
- <ProFormDigit
|
166
|
|
- name="maxScore"
|
167
|
|
- label="最 高 分"
|
168
|
|
- min={0}
|
169
|
|
- fieldProps={{ precision: 2 }}
|
170
|
|
- rules={[
|
171
|
|
- {
|
172
|
|
- required: true,
|
173
|
|
- message: '请设置最高分',
|
174
|
|
- },
|
175
|
|
- ]}
|
176
|
|
- />
|
177
|
|
- </Col>
|
178
|
|
- <Col span={12}>
|
179
|
|
- <ProFormDigit
|
180
|
|
- name="anScore"
|
181
|
|
- label="单项计分"
|
182
|
|
- min={0}
|
183
|
|
- fieldProps={{ precision: 2 }}
|
184
|
|
- rules={[
|
185
|
|
- {
|
186
|
|
- required: true,
|
187
|
|
- message: '请设置单项计分',
|
188
|
|
- },
|
189
|
|
- ]}
|
190
|
|
- />
|
191
|
|
- </Col>
|
192
|
|
- </Row>
|
193
|
|
- <Form.Item name="stand" label="评分标准">
|
194
|
|
- <WangEditor
|
195
|
|
- height="200px"
|
196
|
|
- toolbarConfig={{
|
197
|
|
- toolbarKeys: [
|
198
|
|
- 'headerSelect',
|
199
|
|
- 'blockquote',
|
200
|
|
- '|',
|
201
|
|
- 'bold',
|
202
|
|
- 'underline',
|
203
|
|
- 'italic',
|
204
|
|
- 'color',
|
205
|
|
- 'fontSize',
|
206
|
|
- '|',
|
207
|
|
- 'bulletedList',
|
208
|
|
- 'numberedList',
|
209
|
|
- ]
|
210
|
|
- }}
|
211
|
|
- />
|
212
|
|
- </Form.Item>
|
213
|
|
- <ProFormList
|
214
|
|
- name="answerList"
|
215
|
|
- label="选项列表"
|
216
|
|
- copyIconProps={false}
|
217
|
|
- >
|
218
|
|
- <Row gutter={24} style={{width: '730px'}}>
|
219
|
|
- <Col span={6}>
|
220
|
|
- <ProFormText
|
221
|
|
- name="answerCode"
|
222
|
|
- label="选项"
|
223
|
|
- help="类似 A, B, C, D"
|
224
|
|
- />
|
225
|
|
- </Col>
|
226
|
|
- <Col span={6}>
|
227
|
|
- <ProFormDigit
|
228
|
|
- name="score"
|
229
|
|
- label="计分"
|
230
|
|
- min={0}
|
231
|
|
- fieldProps={{ precision: 2 }}
|
232
|
|
- />
|
233
|
|
- </Col>
|
234
|
|
- <Col span={12}>
|
235
|
|
- <ProFormText
|
236
|
|
- name="answer"
|
237
|
|
- label="答案"
|
238
|
|
- placeholder="具体选项内容"
|
239
|
|
- />
|
240
|
|
- </Col>
|
241
|
|
- </Row>
|
242
|
|
- </ProFormList>
|
243
|
|
- </DrawerForm>
|
|
116
|
+ <>
|
|
117
|
+ <QuForm itemId={itemId} quInfo={quInfo} open={open} onOpenChange={setOpen} onChange={onFinish} />
|
244
|
118
|
<List
|
245
|
119
|
itemLayout="horizontal"
|
246
|
120
|
dataSource={list}
|
247
|
|
- renderItem={(item) => <QuItem qu={item} onEdit={() => onEditQu(item)}/>}
|
|
121
|
+ renderItem={(item) => (
|
|
122
|
+ <QuItem
|
|
123
|
+ qu={item}
|
|
124
|
+ onEdit={() => onEditQu(item)}
|
|
125
|
+ onDelete={() => onDeleteQu(item)}
|
|
126
|
+ />
|
|
127
|
+ )}
|
248
|
128
|
/>
|
249
|
|
- </div>
|
|
129
|
+ </>
|
250
|
130
|
)
|
251
|
131
|
});
|