upp

src/pages/A6_1ques/A6Qadd/index.module.scss

@@ -39,53 +39,108 @@
 
           // 题目的定制化样式
           .A6Qlist2 {
-            margin-top: 15px;
             width: 100%;
 
             .A6Qlist2Son {
+              margin-top: 20px;
               width: 100%;
               position: relative;
               border-radius: 6px;
               border: 1px solid #ccc;
-              padding: 15px 15px 40px;
+              padding: 15px;
 
               .A6Q2del {
                 position: absolute;
                 top: 0px;
                 left: -50px;
-                cursor: pointer;
+                width: 32px;
+                height: 32px;
+                text-align: center;
+                line-height: 32px;
                 border-radius: 4px;
-                padding: 0px 14px;
                 color: #fff;
-                background-color: #aaaaaa;
-                font-size: 24px;
+                background-color: var(--themeColor);
+                font-size: 20px;
+                cursor: pointer;
               }
 
-              .A6Q2_1{
+              .A6Q2_1 {
                 display: flex;
                 width: 100%;
-                &>div{
-                  &:nth-of-type(1){
-                    &>span{
+
+                &>div {
+                  &:nth-of-type(1) {
+                    &>span {
                       color: #ff4d4f;
                     }
+
                     width: 70px;
                   }
-                  &:nth-of-type(2){
+
+                  &:nth-of-type(2) {
                     width: calc(100% - 70px);
                   }
-                  .A6text{
-                    textarea{
+
+                  .A6text {
+                    textarea {
                       min-height: 70px !important;
                     }
                   }
                 }
               }
-              .A6Q2_2{
+
+              .A6Q2_2 {
                 padding-left: 70px;
                 margin-top: 15px;
+
+                .A6Q2_21main {
+                  .A6Q2_21Son {
+                    margin-top: 15px;
+                    display: flex;
+                    align-items: center;
+
+                    &>div {
+                      &:nth-of-type(1) {
+                        &>span {
+                          color: #ff4d4f;
+                        }
+
+                        width: 70px;
+                      }
+
+                      &:nth-of-type(2) {
+                        width: calc(100% - 350px);
+                      }
+                    }
+
+                    .A6Q2del2 {
+                      margin-left: 15px;
+                      width: 32px;
+                      height: 32px;
+                      text-align: center;
+                      line-height: 32px;
+                      border-radius: 4px;
+                      color: #fff;
+                      background-color: var(--themeColor);
+                      font-size: 20px;
+                      cursor: pointer;
+                    }
+                    .A6Q2skip2{
+                      margin-left: 15px;
+                    }
+                  }
+
+                }
+
+                .A6Q2_22 {
+                  margin-top: 15px;
+                }
               }
             }
+
+            .A6Qlist2SonErr {
+              border-color: #ff4d4f;
+            }
           }
         }
       }

src/pages/A6_1ques/A6Qadd/index.tsx

@@ -1,9 +1,12 @@
-import React, { useCallback, useEffect, useRef, useState } from "react";
+import React, {
+  useCallback,
+  useEffect,
+  useRef,
+} from "react";
 import styles from "./index.module.scss";
-import { A6QInfoType, A6QListType, options1, options2 } from "../data";
+import { A6QInfoType} from "../data";
 import {
   Button,
-  Checkbox,
   DatePicker,
   Form,
   FormInstance,
@@ -13,7 +16,7 @@ import {
 import MyPopconfirm from "@/components/MyPopconfirm";
 import ZRichText from "@/components/ZRichText";
 import dayjs from "dayjs";
-import TextArea from "antd/es/input/TextArea";
+
 
 type Props = {
   sInfo: A6QInfoType;
@@ -38,65 +41,21 @@ function A6Qadd({ sInfo, closeFu }: Props) {
         myTime: dayjs(Date.now()),
         aaaaaaa: 1,
       });
-      setList([
-        {
-          id: 1,
-          name: "",
-          type: "单选",
-          skip: "不需要",
-          custom: false,
-          sList: [
-            { id: 1.1, txt: "" },
-            { id: 1.2, txt: "" },
-          ],
-        },
-      ]);
     }
   }, [getInfoFu, sInfo]);
 
-  // 是否 已经点击过确定
-  const [fileCheck, setFileCheck] = useState(false);
-
   // 富文本的ref
   const ZRichTextRef = useRef<any>(null);
 
-  // 题目的数组
-  const [list, setList] = useState<A6QListType[]>([]);
-
-  // 点击新增题目
-  const addList = useCallback(() => {}, []);
-
-  // 信息的改变
-  const dataChangeFu = useCallback(
-    (
-      e: string | boolean,
-      rank: 1 | 2,
-      id: number,
-      key: "name" | "type" | "skip" | "custom" | "id" | "txt"
-    ) => {
-      let value: string | boolean;
-      if (typeof e === "string") value = e.replace(/\s+/g, "");
-      else value = e;
-      if (rank === 1 && key !== "txt") {
-        setList(
-          list.map((v) => ({
-            ...v,
-            [key]: id === v.id ? value : v[key],
-          }))
-        );
-      }
-    },
-    [list]
-  );
-
   // 没有通过校验
-  const onFinishFailed = useCallback(() => {
-    setFileCheck(true);
-  }, []);
+  const onFinishFailed = useCallback(() => {}, []);
 
   //  通过校验点击确定
   const onFinish = useCallback(async (values: any) => {
-    setFileCheck(true);
+    // 发布日期
+    // const releaseDate = dayjs(values.myTime).format("YYYY-MM-DD");
+
+    console.log("提交拉");
   }, []);
 
   return (
@@ -161,96 +120,6 @@ function A6Qadd({ sInfo, closeFu }: Props) {
             />
           </Form.Item>
 
-          <div className="formRow">
-            <div className="formLeft">
-              <span>* </span>
-              题目：
-            </div>
-            <div className="formRight">
-              <div className="A6Qlist">
-                <div className="A6Qlist1">
-                  <Button type="primary" onClick={addList}>
-                    新增
-                  </Button>
-                  &emsp;
-                  <span>最多支持50题</span>
-                </div>
-                <div className="A6Qlist2">
-                  {list.map((v, i) => (
-                    <div className="A6Qlist2Son" key={v.id}>
-                      {/* 1级 删除 */}
-                      {i === 0 ? null : <div className="A6Q2del"> - </div>}
-
-                      {/* 题目 */}
-                      <div className="A6Q2_1">
-                        <div>
-                          <span>*</span> 题目 {i + 1}
-                        </div>
-                        <div>
-                          <TextArea
-                            value={v.name}
-                            onChange={(e) =>
-                              dataChangeFu(e.target.value, 1, v.id, "name")
-                            }
-                            className="A6text"
-                            placeholder="请输入内容"
-                            showCount
-                            maxLength={200}
-                          />
-                        </div>
-                      </div>
-
-                      <div className="A6Q2_2">
-                        {/* 类型 跳题 自定义 */}
-                        <div className="A6Q2_21">
-                          类型&emsp;
-                          <Select
-                            disabled={v.skip === "选项跳题"}
-                            value={v.type}
-                            onChange={(e) => dataChangeFu(e, 1, v.id, "type")}
-                            placeholder="请选择"
-                            style={{ width: 100 }}
-                            options={options1}
-                          />
-                          &emsp;&emsp;跳题&emsp;
-                          <Select
-                            value={v.skip}
-                            onChange={(e) => dataChangeFu(e, 1, v.id, "skip")}
-                            placeholder="请选择"
-                            style={{ width: 100 }}
-                            options={
-                              v.type === "单选"
-                                ? options2
-                                : options2.filter((c) => c.label !== "选项跳题")
-                            }
-                          />
-                          &emsp;&emsp;
-                          {v.type === "填空" ? null : (
-                            <Checkbox
-                              checked={v.custom}
-                              onChange={(e) =>
-                                dataChangeFu(
-                                  e.target.checked,
-                                  1,
-                                  v.id,
-                                  "custom"
-                                )
-                              }
-                            >
-                              支持填写自定义回答
-                            </Checkbox>
-                          )}
-                        </div>
-
-                        {/* 子选项 */}
-                      </div>
-                    </div>
-                  ))}
-                </div>
-              </div>
-            </div>
-          </div>
-
           {/* 确定和取消按钮 */}
           <Form.Item className="A6QAbtn">
             <Button type="primary" htmlType="submit">

src/pages/A6_1ques/A6Qtopic/QTadd.tsx

@@ -0,0 +1,420 @@
+import React, { useCallback, useEffect, useMemo, useState } from "react";
+import styles from "./index.module.scss";
+import { Button, Checkbox, Input, Modal, Select } from "antd";
+import MyPopconfirm from "@/components/MyPopconfirm";
+import { A6QListType, options1, options2 } from "../data";
+import { MessageFu } from "@/utils/message";
+import TextArea from "antd/es/input/TextArea";
+import { CloseCircleOutlined } from "@ant-design/icons";
+import classNames from "classnames";
+
+const oneObj: A6QListType = {
+  id: 1,
+  name: "",
+  type: "单选",
+  skip: "不需要",
+  custom: false,
+  num: 1,
+  sList: [
+    { id: 1.1, txt: "", skip2: false, num2: 1 },
+    { id: 1.2, txt: "", skip2: false, num2: 1 },
+  ],
+};
+
+type Props = {
+  moId: number;
+  closeFu: () => void;
+  tableLen: number;
+};
+
+function QTadd({ moId, closeFu, tableLen }: Props) {
+  const getInfoFu = useCallback(async (id: number) => {}, []);
+
+  useEffect(() => {
+    if (moId > 0) getInfoFu(moId);
+    else {
+      // 新增
+      setList([oneObj]);
+    }
+  }, [getInfoFu, moId]);
+
+  // 是否 已经点击过确定
+  const [fileCheck, setFileCheck] = useState(false);
+
+  // 题目的数组
+  const [list, setList] = useState<A6QListType[]>([]);
+
+  // 点击新增题目
+  const addListFu = useCallback(
+    (rank: 1 | 2, length?: number) => {
+      if (rank === 1 && list.length + tableLen >= 50)
+        return MessageFu.warning("最多支持50题!");
+      if (length && length >= 6) return MessageFu.warning("最多6个选项!");
+      if (rank === 1) {
+        setList([
+          ...list,
+          {
+            id: Date.now(),
+            name: "",
+            type: "单选",
+            skip: "不需要",
+            custom: false,
+            num: 1,
+            sList: [
+              { id: Date.now(), txt: "", skip2: false, num2: 1 },
+              { id: Date.now() + 1, txt: "", skip2: false, num2: 1 },
+            ],
+          },
+        ]);
+      } else {
+        setList(
+          list.map((v) => ({
+            ...v,
+            sList: [
+              ...v.sList,
+              { id: Date.now(), txt: "", skip2: false, num2: 1 },
+            ],
+          }))
+        );
+      }
+    },
+    [list, tableLen]
+  );
+
+  // 点击删除
+  const delListFu = useCallback(
+    (rank: 1 | 2, id: number) => {
+      if (rank === 1) {
+        setList(list.filter((v) => v.id !== id));
+      } else {
+        setList(
+          list.map((v) => ({
+            ...v,
+            sList: v.sList.filter((v2) => v2.id !== id),
+          }))
+        );
+      }
+    },
+    [list]
+  );
+
+  // 信息的改变(去掉跳题)
+  const dataChangeFu = useCallback(
+    (
+      e: string | boolean,
+      id: number,
+      key: "name" | "type" | "skip" | "custom" | "txt" | "skip2",
+      index: number
+    ) => {
+      let value: string | boolean;
+      if (typeof e === "string") value = e.replace(/\s+/g, "");
+      else value = e;
+
+      let num = index;
+      if (index === 0) num = 2;
+      else num = 1;
+
+      // 第二级信息的改变
+      if (key === "txt" || key === "skip2") {
+        setList(
+          list.map((v) => ({
+            ...v,
+            sList: v.sList.map((v2) => ({
+              ...v2,
+              num2: id === v2.id ? num : v2.num2,
+              [key]: id === v2.id ? value : v2[key],
+            })),
+          }))
+        );
+      } else {
+        // 第一级信息的改变
+
+        setList(
+          list.map((v) => ({
+            ...v,
+            num: id === v.id ? num : v.num,
+            [key]: id === v.id ? value : v[key],
+          }))
+        );
+      }
+    },
+    [list]
+  );
+
+  // 跳题的改变
+  const skipChangeFu = useCallback(
+    (e: number, id: number, len: 1 | 2) => {
+      if (len === 1) {
+        setList(
+          list.map((v) => ({
+            ...v,
+            num: id === v.id ? e : v.num,
+          }))
+        );
+      } else {
+        setList(
+          list.map((v) => ({
+            ...v,
+            sList: v.sList.map((v2) => ({
+              ...v2,
+              num2: v2.id === id ? e : v2.num2,
+            })),
+          }))
+        );
+      }
+    },
+    [list]
+  );
+
+  // 跳题的数组
+  const numList = useMemo(() => {
+    let arr: number[] = [];
+    for (let ii = 0; ii < list.length; ii++) {
+      arr.push(ii + 1);
+    }
+    return arr;
+  }, [list.length]);
+
+  // 单个题目是否全部填写标准
+  const oneFlag = useCallback((info: A6QListType) => {
+    let flag = false;
+
+    if (!info.name) flag = true;
+    else if (info.type !== "填空") {
+      flag = info.sList.some((v) => !v.txt);
+    }
+
+    return flag;
+  }, []);
+
+  // 点击提交
+  const btnOkFu = useCallback(() => {
+    setFileCheck(true);
+
+    // 待完善
+    if (!fileCheck) return MessageFu.warning("请规范填写题目信息!");
+
+    const dom = document.querySelector(".A6Qlist2SonErr");
+    if (dom) return MessageFu.warning("请规范填写题目信息!");
+  }, [fileCheck]);
+
+  return (
+    <Modal
+      wrapClassName={styles.QTadd}
+      open={true}
+      title={
+        <div className="QTatitle">
+          <div>{moId > 0 ? "编辑" : "新增"}题目</div>
+          <div>
+            <span className="QTatitleS">
+              最多支持50题，还能新增{50 - tableLen - list.length}题
+            </span>
+            &emsp;
+            <Button
+              type="primary"
+              onClick={() => addListFu(1)}
+              disabled={tableLen + list.length >= 50}
+            >
+              新增
+            </Button>
+          </div>
+        </div>
+      }
+      footer={
+        [] // 设置footer为空，去掉 取消 确定默认按钮
+      }
+    >
+      <div className="QTmain">
+        <div className="A6Qlist">
+          <div className="A6Qlist2">
+            {list.map((v, i) => (
+              <div
+                className={classNames(
+                  "A6Qlist2Son",
+                  oneFlag(v) && fileCheck ? "A6Qlist2SonErr" : ""
+                )}
+                key={v.id}
+              >
+                {/* 1级 删除 */}
+                {i === 0 ? null : (
+                  <MyPopconfirm
+                    txtK="删除"
+                    onConfirm={() => delListFu(1, v.id)}
+                    Dom={
+                      <div className="A6Q2del">
+                        <CloseCircleOutlined rev={undefined} />
+                      </div>
+                    }
+                  />
+                )}
+
+                {/* 题目 */}
+                <div className="A6Q2_1">
+                  <div>
+                    <span>*</span> 题目 {i + 1}
+                  </div>
+                  <div>
+                    <TextArea
+                      value={v.name}
+                      onChange={(e) =>
+                        dataChangeFu(e.target.value, v.id, "name", i)
+                      }
+                      className="A6text"
+                      placeholder="请输入内容"
+                      showCount
+                      maxLength={200}
+                    />
+                  </div>
+                </div>
+
+                <div className="A6Q2_2">
+                  {/* 类型 跳题 自定义 */}
+                  <div>
+                    类型&emsp;
+                    <Select
+                      disabled={v.skip === "选项跳题"}
+                      value={v.type}
+                      onChange={(e) => dataChangeFu(e, v.id, "type", i)}
+                      placeholder="请选择"
+                      style={{ width: 100 }}
+                      options={options1}
+                    />
+                    &emsp;&emsp;跳题&emsp;
+                    <Select
+                      value={v.skip}
+                      onChange={(e) => dataChangeFu(e, v.id, "skip", i)}
+                      placeholder="请选择"
+                      style={{ width: 100 }}
+                      options={
+                        v.type === "单选"
+                          ? options2
+                          : options2.filter((c) => c.label !== "选项跳题")
+                      }
+                    />
+                    <span hidden={v.skip !== "答完跳题"}>
+                      &emsp;&emsp;跳至第&emsp;
+                      <Select
+                        value={v.num}
+                        onChange={(e) => skipChangeFu(e, v.id, 1)}
+                        placeholder="请选择"
+                        style={{ width: 100 }}
+                        options={numList
+                          .filter((b) => b !== i + 1)
+                          .map((c) => ({
+                            value: c,
+                            label: c,
+                          }))}
+                      />
+                      &emsp;题
+                    </span>
+                    &emsp;&emsp;
+                    {v.type === "填空" ? null : (
+                      <Checkbox
+                        checked={v.custom}
+                        onChange={(e) =>
+                          dataChangeFu(e.target.checked, v.id, "custom", i)
+                        }
+                      >
+                        支持填写自定义回答
+                      </Checkbox>
+                    )}
+                  </div>
+
+                  {/* 子选项 */}
+                  <div className="A6Q2_21main" hidden={v.type === "填空"}>
+                    {v.sList.map((v2, i2) => (
+                      <div className="A6Q2_21Son" key={v2.id}>
+                        <div>
+                          <span>*</span> 选项 {i2 + 1}
+                        </div>
+
+                        <div>
+                          <Input
+                            value={v2.txt}
+                            onChange={(e) =>
+                              dataChangeFu(e.target.value, v2.id, "txt", i2)
+                            }
+                            maxLength={50}
+                            showCount
+                            placeholder="请输入内容"
+                          />
+                        </div>
+
+                        {/* 2级 跳题 */}
+                        <span
+                          className="A6Q2skip2"
+                          hidden={v.skip !== "选项跳题"}
+                        >
+                          <Checkbox
+                            checked={v2.skip2}
+                            onChange={(e) =>
+                              dataChangeFu(e.target.checked, v2.id, "skip2", i)
+                            }
+                          >
+                            跳题
+                          </Checkbox>
+                          <span hidden={!v2.skip2}>
+                            &nbsp;跳至第&nbsp;
+                            <Select
+                              value={v2.num2}
+                              onChange={(e) => skipChangeFu(e, v2.id, 2)}
+                              placeholder="请选择"
+                              style={{ width: 80 }}
+                              options={numList
+                                .filter((b) => b !== i + 1)
+                                .map((c) => ({
+                                  value: c,
+                                  label: c,
+                                }))}
+                            />
+                            &nbsp;题
+                          </span>
+                        </span>
+
+                        {/* 2级 删除 */}
+                        {i2 <= 1 ? null : (
+                          <MyPopconfirm
+                            txtK="删除"
+                            onConfirm={() => delListFu(2, v2.id)}
+                            Dom={
+                              <div className="A6Q2del2">
+                                <CloseCircleOutlined rev={undefined} />
+                              </div>
+                            }
+                          />
+                        )}
+                      </div>
+                    ))}
+                  </div>
+                  {/* 子选项的新增 */}
+                  <div className="A6Q2_22" hidden={v.type === "填空"}>
+                    <Button
+                      onClick={() => addListFu(2, v.sList.length)}
+                      disabled={v.sList.length >= 6}
+                    >
+                      新增选项
+                    </Button>
+                    &emsp;
+                    <span>最多支持6个选项</span>
+                  </div>
+                </div>
+              </div>
+            ))}
+          </div>
+        </div>
+
+        <div className="QTbtn">
+          <Button type="primary" onClick={btnOkFu}>
+            提交
+          </Button>
+          &emsp;
+          <MyPopconfirm txtK="取消" onConfirm={closeFu} />
+        </div>
+      </div>
+    </Modal>
+  );
+}
+
+const MemoQTadd = React.memo(QTadd);
+
+export default MemoQTadd;

src/pages/A6_1ques/A6Qtopic/index.module.scss

@@ -0,0 +1,188 @@
+.A6Qtopic {
+  position: absolute;
+  z-index: 10;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background-color: #fff;
+  border-radius: 10px;
+  padding: 20px;
+
+  :global {
+    .QTtop {
+      text-align: right;
+    }
+
+    .QTtable {
+      height: calc(100% - 30px);
+      margin-top: 15px;
+      overflow: hidden;
+    }
+  }
+}
+
+// 弹窗的样式
+.QTadd {
+  position: relative;
+
+  :global {
+    .ant-modal-close {
+      display: none;
+    }
+
+    .ant-modal {
+      width: 1200px !important;
+      max-width: 1200px !important;
+      top: 50px;
+    }
+
+    .ant-modal-content {
+      padding-bottom: 40px !important;
+    }
+
+    .ant-modal-header {
+      padding-bottom: 10px;
+      border-bottom: 1px solid #ccc;
+    }
+
+    .ant-modal-body {
+      min-height: 300px;
+      max-height: 700px;
+      overflow-y: auto;
+    }
+
+    .QTatitle{
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      .QTatitleS{
+        font-weight: 400;
+        font-size: 14px;
+      }
+    }
+
+    .QTmain {
+      height: 100%;
+      padding: 0 20px;
+
+      .A6Qlist {
+        width: 100%;
+
+        // 题目的定制化样式
+        .A6Qlist2 {
+          width: 100%;
+
+          .A6Qlist2Son {
+            margin-bottom: 20px;
+            width: 100%;
+            position: relative;
+            border-radius: 6px;
+            border: 1px solid #ccc;
+            padding: 15px;
+
+            .A6Q2del {
+              position: absolute;
+              top: 45px;
+              left: 26px;
+              width: 32px;
+              height: 32px;
+              text-align: center;
+              line-height: 32px;
+              border-radius: 4px;
+              color: #fff;
+              background-color: var(--themeColor);
+              font-size: 20px;
+              cursor: pointer;
+            }
+
+            .A6Q2_1 {
+              display: flex;
+              width: 100%;
+
+              &>div {
+                &:nth-of-type(1) {
+                  &>span {
+                    color: #ff4d4f;
+                  }
+
+                  width: 70px;
+                }
+
+                &:nth-of-type(2) {
+                  width: calc(100% - 70px);
+                }
+
+                .A6text {
+                  textarea {
+                    min-height: 70px !important;
+                  }
+                }
+              }
+            }
+
+            .A6Q2_2 {
+              padding-left: 70px;
+              margin-top: 15px;
+
+              .A6Q2_21main {
+                .A6Q2_21Son {
+                  margin-top: 15px;
+                  display: flex;
+                  align-items: center;
+
+                  &>div {
+                    &:nth-of-type(1) {
+                      &>span {
+                        color: #ff4d4f;
+                      }
+
+                      width: 70px;
+                    }
+
+                    &:nth-of-type(2) {
+                      width: calc(100% - 350px);
+                    }
+                  }
+
+                  .A6Q2del2 {
+                    margin-left: 15px;
+                    width: 32px;
+                    height: 32px;
+                    text-align: center;
+                    line-height: 32px;
+                    border-radius: 4px;
+                    color: #fff;
+                    background-color: var(--themeColor);
+                    font-size: 20px;
+                    cursor: pointer;
+                  }
+
+                  .A6Q2skip2 {
+                    margin-left: 15px;
+                  }
+                }
+
+              }
+
+              .A6Q2_22 {
+                margin-top: 15px;
+              }
+            }
+          }
+
+          .A6Qlist2SonErr {
+            border-color: #ff4d4f;
+          }
+        }
+      }
+
+      .QTbtn {
+        position: absolute;
+        left: 50%;
+        bottom: 10px;
+        transform: translateX(-50%);
+      }
+    }
+  }
+}

src/pages/A6_1ques/A6Qtopic/index.tsx

@@ -0,0 +1,50 @@
+import React, { useCallback, useEffect, useState } from "react";
+import styles from "./index.module.scss";
+import { Button } from "antd";
+import QTadd from "./QTadd";
+
+type Props = {
+  sId: number;
+  closeFu: () => void;
+};
+
+function A6Qtopic({ sId, closeFu }: Props) {
+  const getInfoFu = useCallback(async (id: number) => {
+    console.log("题目发送器拿数据");
+  }, []);
+
+  useEffect(() => {
+    getInfoFu(sId);
+  }, [getInfoFu, sId]);
+
+  // 弹窗的显示和隐藏
+  const [moId, setMoId] = useState(0);
+
+  return (
+    <div className={styles.A6Qtopic}>
+      <div className="QTtop">
+        <Button onClick={closeFu}>返回</Button>&emsp;
+        <Button type="primary" onClick={() => setMoId(-1)}>
+          新增
+        </Button>
+      </div>
+      <div className="QTtable">
+        {/* <MyTable
+          yHeight={680}
+          list={tableList}
+          columnsTemp={A1tableCFu(type)}
+          pagingInfo={false}
+          lastBtn={tableLastBtn}
+        /> */}
+      </div>
+      {/* 待完善  tableLen*/}
+      {moId ? (
+        <QTadd moId={moId} closeFu={() => setMoId(0)} tableLen={10} />
+      ) : null}
+    </div>
+  );
+}
+
+const MemoA6Qtopic = React.memo(A6Qtopic);
+
+export default MemoA6Qtopic;

src/pages/A6_1ques/data.ts

@@ -1,6 +1,6 @@
 export type A6QInfoType = {
   id: number;
-  txt: "" | "新增" | "编辑" | "详情";
+  txt: "" | "新增" | "编辑" | "查看" | "题目管理";
 };
 
 // 新增里面的题目列表
@@ -9,11 +9,14 @@ export type A6QListType = {
   name: string;
   type: "单选" | "多选" | "排序" | "填空";
   skip: "不需要" | "答完跳题" | "选项跳题";
+  num: number;
   custom: boolean; //是否支持自定义回答
-  sList?: {
+  sList: {
     //除了填空以外的选项数组
     id: number;
     txt: string;
+    skip2: boolean;
+    num2: number;
   }[];
 };
 

src/pages/A6_1ques/index.tsx

@@ -5,6 +5,8 @@ import { useDispatch } from "react-redux";
 import A6Qadd from "./A6Qadd";
 import { A6QInfoType } from "./data";
 import A6QInfo from "./A6QInfo";
+import A6Qtopic from "./A6Qtopic";
+
 function A6_1ques() {
   const dispatch = useDispatch();
 
@@ -56,14 +58,7 @@ function A6_1ques() {
   return (
     <div className={styles.A6_1ques}>
       <div className="pageTitle">
-        问卷管理{" "}
-        {info.txt
-          ? info.txt === "新增"
-            ? " - 新增"
-            : info.txt === "编辑"
-            ? " - 编辑"
-            : " - 详情"
-          : ""}
+        问卷管理 {info.txt ? ` - ${info.txt}` : ""}
       </div>
 
       {/* 顶部筛选 */}
@@ -93,6 +88,11 @@ function A6_1ques() {
 
       {/* 表格主体 */}
       <div className="A6_1tableBox">
+        <Button onClick={() => setInfo({ id: 1, txt: "编辑" })}>编辑</Button>
+        <Button onClick={() => setInfo({ id: 1, txt: "查看" })}>查看</Button>
+        <Button onClick={() => setInfo({ id: 1, txt: "题目管理" })}>
+          题目管理
+        </Button>
         {/* <MyTable
           yHeight={625}
           list={tableInfo.list}
@@ -108,12 +108,18 @@ function A6_1ques() {
       </div>
 
       {/* 点击新增/编辑出来的页面 */}
-      {info.id ? (
-        info.txt === "详情" ? (
-          <A6QInfo sId={info.id} closeFu={() => setInfo({ id: 0, txt: "" })} />
-        ) : (
-          <A6Qadd sInfo={info} closeFu={() => setInfo({ id: 0, txt: "" })} />
-        )
+      {["编辑", "新增"].includes(info.txt) ? (
+        <A6Qadd sInfo={info} closeFu={() => setInfo({ id: 0, txt: "" })} />
+      ) : null}
+
+      {/* 查看 */}
+      {info.txt === "查看" ? (
+        <A6QInfo sId={info.id} closeFu={() => setInfo({ id: 0, txt: "" })} />
+      ) : null}
+
+      {/* 题目管理 */}
+      {info.txt === "题目管理" ? (
+        <A6Qtopic sId={info.id} closeFu={() => setInfo({ id: 0, txt: "" })} />
       ) : null}
     </div>
   );