feats

src/pages/question/list/index.jsx

@@ -1,202 +1,141 @@
 import React from 'react';
-import { Button, Form, Row, Col, Card, List } from 'antd';
+import { Row, Col } from 'antd';
 import {
-  ProForm,
   ProFormText,
   ProFormSelect,
   ProFormList,
-  PageContainer
 } from '@ant-design/pro-components';
-import { postTdQuestion, getTdQuestion, deleteTdQuestion, getTdQuestionById } from '@/service/tdquestion';
-
-const QuItem = (props) => {
-  const { qu, onEdit, onDelete } = props;
-
-  const quTitle = `${qu?.quType == 'fill' ? '填空' : '选择'} ${qu?.title}`
-
-  return (
-    <Card title={quTitle}
-      extra={(
-        <>
-          <Button type='link' onClick={onEdit}>修改</Button>
-          <Popconfirm
-            title="确认进行删除操作?"
-            onConfirm={onDelete}
-          >
-            <Button type='link' danger >删除</Button>
-          </Popconfirm>
-        </>
-      )}
-      style={{ marginTop: '24px' }}>
-      <Card.Meta
-        title={
-          qu?.quType != 'fill' ?
-            (
-              <Row gutter={24}>
-                {
-                  (qu || []).map((item) => {
-                    const anStr = `${item.answerCode} ${item.answer}`;
-
-                    return (
-                      <Col span={12} key={item.quId} style={{ height: '32px', lineHeight: '32px', fontWeight: 400 }}>
-                        {anStr}
-                      </Col>
-                    );
-                  })
-                }
-              </Row>
-            ) : null
-        }
-        description={(
-          <>
-            <h3>验收标准</h3>
-            <div dangerouslySetInnerHTML={{ __html: qu?.stand }} />
-          </>
-        )}
-      />
-    </Card>
-  );
-}
+import { postTdQuestion, getTdQuestion, deleteTdQuestion, putTdQuestion } from '@/service/tdquestion';
+import Curd from '@/components/Page/Curd';
 
 export default React.forwardRef((props, ref) => {
-
-  const { itemId, onChange } = props;
-
-  const [open, setOpen] = React.useState(false);
-  const [quInfo, setQuInfo] = React.useState(false);
-  const [list, setList] = React.useState([]);
-  // const [and, setAnd] = React.useState([]);
-  const [form] = Form.useForm();
-
-  const onFinish = async (values) => {
-    const data = { ...(quInfo || {}), ...values, itemId };
-    const res = await postTdQuestion(data).then(x => x);
-    let found = false;
-    const newList = list.map(item => {
-      if (item.quId === res.quId) {
-        found = true;
-        return res;
-      } else {
-        return item
-      }
-    });
-
-    if (!found) {
-      newList.push(res);
-    }
-
-    setList(list);
-    onChange(res);
-
-    return true;
+  const actionRef = React.useRef();
+
+  const columns = [
+    {
+      title: "问题类型",
+      dataIndex: "quType",
+      valueEnum: {
+        1: {
+          text: "单选",
+          status: "radio",
+        },
+        0: {
+          text: "填空题",
+          status: "fill",
+        },
+      },
+    },
+    {
+      title: "问题描述",
+      dataIndex: "title",
+    },
+    {
+      title: "正确答案",
+      dataIndex: "rightAnswers",
+    },
+    {
+      title: "状态",
+      dataIndex: "status",
+      valueEnum: {
+        1: {
+          text: "正常",
+          status: "Processing",
+        },
+        0: {
+          text: "禁用",
+          status: "Error",
+        },
+      },
+    },
+  ]
+
+  const Add = (data) => {
+    postTdQuestion(data).then((res) => {
+      actionRef.current.reload();
+    })
   }
 
-  const onEditQu = (qu) => {
-    setQuInfo(qu);
-    setOpen(true);
+  const Edit = (row, data) => {
+    console.log('fff', data);
+    putTdQuestion(row, data).then((res) => {
+      actionRef.current.reload();
+    })
   }
 
-  const onDeleteQu = (qu) => {
-    if (qu?.quId) {
-      deleteTdQuestion(qu.quId).then(() => {
-        setList(list.filter(x => x.quId !== qu.quId));
-      })
-    } else {
-      setList(list.filter(x => x.quId !== qu.quId));
-    }
+  const Delete = (row) => {
+    deleteTdQuestion(row).then(() => {
+      actionRef.current.reload();
+    })
   }
 
-  React.useEffect(() => {
-    if (quInfo) {
-      form.setFieldsValue(quInfo);
-    }
-  }, [quInfo]);
-
-  // React.useEffect(() => {
-  //   if (itemId) {
-  //     getTdQuestion({ pageSize: 500, itemId }).then((res) => {
-  //       setList(res.records);
-  //     });
-  //   }
-  // }, [itemId]);
-
-  React.useEffect(() => {
-    if (itemId) {
-      getTdQuestionById({ pageSize: 500, itemId }).then((res) => {
-        setList(res.records);
-      });
-    }
-  }, [itemId]);
-
-  React.useImperativeHandle(ref, () => ({
-    add: () => setOpen(true),
-  }), []);
-
   return (
     <div>
-      <Card>
-        <ProForm style={{ width: '800px' }} form={form} onFinish={onFinish} itemId={itemId} quInfo={quInfo} open={open}>
-          <ProFormText
-            name="title"
-            label="问题描述"
-            placeholder="请填写"
-            rules={[
-              {
-                required: true,
-                message: '请填写题干',
-              },
-            ]}
-          />
-          <ProFormSelect
-            name="quType"
-            label="问题类型"
-            fieldProps={{
-              style: { width: '100%' }
-            }}
-            valueEnum={{
-              radio: '单选',
-              fill: '填空'
-            }}
-            rules={[
-              {
-                required: true,
-                message: '请选择问题类型',
-              },
-            ]}
-          />
-          <ProFormList
-            label="选项列表"
-            copyIconProps={false}
-            name="quAnswerList"
-          >
-            <Row gutter={24} style={{ width: '730px' }}>
-              <Col span={6}>
-                <ProFormText
-                  name="answerCode"
-                  label="答案选项"
-                  help="类似 A, B, C, D"
-                />
-              </Col>
-              <Col span={6}>
-                <ProFormText
-                  name="answer"
-                  label="答案"
-                  placeholder="具体选项内容"
-                />
-              </Col>
-            </Row>
-          </ProFormList>
-        </ProForm>
-
-      </Card>
-      <List
-        itemLayout="horizontal"
-        itemId={itemId}
-        quInfo={quInfo}
-        dataSource={list}
-        renderItem={(item) => <QuItem qu={item} onEdit={() => onEditQu(item)} onDelete={() => onDeleteQu(item)} />}
+      <Curd
+        rowKey="quId"
+        columns={columns}
+        search={false}
+        request={{
+          list: getTdQuestion,
+          save: Add,
+          update: Edit,
+          del: Delete,
+        }}
+        renderFormItems={() => (
+          <>
+            <ProFormText
+              name="title"
+              label="问题描述"
+              placeholder="请填写"
+              rules={[
+                {
+                  required: true,
+                  message: '请填写题干',
+                },
+              ]}
+            />
+            <ProFormSelect
+              name="quType"
+              label="问题类型"
+              fieldProps={{
+                style: { width: '100%' }
+              }}
+              valueEnum={{
+                radio: '单选',
+                fill: '填空'
+              }}
+              rules={[
+                {
+                  required: true,
+                  message: '请选择问题类型',
+                },
+              ]}
+            />
+            <ProFormList
+              label="选项列表"
+              copyIconProps={false}
+              name="quAnswerList"
+            >
+              <Row gutter={24} style={{ width: '730px' }}>
+                <Col span={6}>
+                  <ProFormText
+                    name="answerCode"
+                    label="答案选项"
+                    help="类似 A, B, C, D"
+                  />
+                </Col>
+                <Col span={6}>
+                  <ProFormText
+                    name="answer"
+                    label="答案"
+                    placeholder="具体选项内容"
+                  />
+                </Col>
+              </Row>
+            </ProFormList>
+          </>
+        )}
       />
-
     </div>
   )
 });

src/routes/routes.jsx

@@ -79,7 +79,7 @@ export const authRoutes = [
         element: <CheckEdit />,
         meta: {
           hideInMenu: true,
-          title: '模拟测评',
+          title: '模拟测评维护',
           icon: <ProjectOutlined />,
         }
       },