feat:题库代码优化

f48a2dd4 · yuananting · 3935654b · f48a2dd4 · f48a2dd4 · f48a2dd4
Commit f48a2dd4 authored Mar 29, 2021 by yuananting
23 changed files
--- a/src/modules/teach-tool/components/CourseCategoryManage.jsx
+++ b/src/modules/teach-tool/components/CourseCategoryManage.jsx
--- a/src/modules/teach-tool/components/CourseCategoryManage.less
+++ b/src/modules/teach-tool/components/CourseCategoryManage.less
-/*
+.course-category-manage {
- * @Author: yuananting
- * @Date: 2021-02-23 19:41:42
- * @LastEditors: yuananting
- * @LastEditTime: 2021-03-27 13:49:00
- * @Description: 助学工具-题库-课程分类管理样式
- * @Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
- */
- .course-category-manage {
  position: relative;
  .search-condition {
    width: 30%;
@@ -22,7 +14,7 @@
    position: relative;
    margin-top: 16px;
    width: 900px;
-    border: 1px solid #E8E8E8;
+    border: 1px solid #e8e8e8;
    .ant-tree.ant-tree-directory {
      font-size: 14px;
      font-weight: 400;
@@ -75,6 +67,6 @@
  }
  .ant-tree.ant-tree-directory .ant-tree-treenode:hover::before {
-    background-color: #F3F6FA;
+    background-color: #f3f6fa;
  }
 }
--- a/src/modules/teach-tool/components/CourseCategorySiderTree.jsx
+++ b/src/modules/teach-tool/components/CourseCategorySiderTree.jsx
@@ -2,8 +2,8 @@
 * @Author: yuananting
 * @Date: 2021-02-22 10:59:43
 * @LastEditors: yuananting
- * @LastEditTime: 2021-03-27 13:51:43
+ * @LastEditTime: 2021-03-29 16:17:53
- * @Description: 助学工具-题库-课程分类侧边栏
+ * @Description: 助学工具-课程分类侧边栏
 * @Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
 */
 import React, { Component } from "react";
@@ -18,14 +18,8 @@ const { DirectoryTree } = Tree;
 class CourseCategorySiderTree extends Component {
  constructor(props) {
    super(props);
-    const categoryId = getParameterByName("categoryId");
    this.state = {
-      selectedKeys: categoryId
+      selectedKeys: [getParameterByName("categoryId") || "null"],
-        ? categoryId === "null"
-          ? ["0"]
-          : [categoryId]
-        : ["0"],
-      searchValue: null,
      treeData: this.props.treeData || [],
      autoExpandParent: false,
    };
@@ -33,11 +27,9 @@ class CourseCategorySiderTree extends Component {
  componentDidMount() {
    this.queryCategoryTree("change");
-    this.props.getSelectedCategoryId(
+    this.props.getSelectedCategoryId([
-      getParameterByName("categoryId")
+      getParameterByName("categoryId") || "null",
-        ? [getParameterByName("categoryId")]
+    ]);
-        : ["0"]
-    );
  }
  shouldComponentUpdate(nextProps, nextState) {
@@ -51,28 +43,6 @@ class CourseCategorySiderTree extends Component {
    return true;
  }
-  /** 获取树状第一级key 设置默认展开第一项 */
-  getFirstLevelKeys = (data) => {
-    let firstLevelKeys = [];
-    data.forEach((item) => {
-      if (item.categoryLevel === 0) {
-        firstLevelKeys.push(item.key);
-      }
-    });
-    return firstLevelKeys;
-  };
-  /** 树状展开事件 */
-  onExpand = (expandedKeys) => {
-    this.setState({ expandedKeys });
-  };
-  /** 树状选中事件 */
-  onSelect = (selectedKeys) => {
-    this.setState({ selectedKeys });
-    this.props.getSelectedCategoryId(selectedKeys);
-  };
  // 查询分类树
  queryCategoryTree = (type, categoryName) => {
    let query = {
@@ -99,7 +69,7 @@ class CourseCategorySiderTree extends Component {
          }
        } else {
          const defaultNode = {
-            id: "0",
+            id: "null",
            categoryName: "未分类",
            categoryCount: noCategoryCnt,
            parentId: "0",
@@ -120,7 +90,7 @@ class CourseCategorySiderTree extends Component {
      } else {
        this.setState({ autoExpandParent: false });
        const defaultNode = {
-          id: "0",
+          id: "null",
          categoryName: "未分类",
          categoryCount: noCategoryCnt,
          parentId: "0",
@@ -137,6 +107,7 @@ class CourseCategorySiderTree extends Component {
    });
  };
+  // 树结构平铺
  getTreeMap = (data, map) => {
    data.forEach((item) => {
      map[item.id] = item;
@@ -147,6 +118,18 @@ class CourseCategorySiderTree extends Component {
    return map;
  };
+  // 树状展开事件
+  onExpand = (expandedKeys) => {
+    this.setState({ expandedKeys });
+  };
+  // 树状选中事件
+  onSelect = (selectedKeys) => {
+    this.setState({ selectedKeys });
+    this.props.getSelectedCategoryId(selectedKeys);
+  };
+  // 树节点渲染-内容处理
  renderTreeNodes = (data, value) => {
    let newTreeData = data.map((item) => {
      item.title = item.categoryName;
@@ -164,13 +147,27 @@ class CourseCategorySiderTree extends Component {
      item.icon =
        item.categoryName === "未分类" ? (
          <img
-            style={{ width: "24px", height: "24px", opacity: !value || (value && item.categoryName.indexOf(value) > -1) ? 1 : 0.5 }}
+            style={{
+              width: "24px",
+              height: "24px",
+              opacity:
+                !value || (value && item.categoryName.indexOf(value) > -1)
+                  ? 1
+                  : 0.5,
+            }}
            src="https://image.xiaomaiketang.com/xm/defaultCategory.png"
            alt=""
          />
        ) : (
          <img
-            style={{ width: "24px", height: "24px", opacity: !value || (value && item.categoryName.indexOf(value) > -1) ? 1 : 0.5  }}
+            style={{
+              width: "24px",
+              height: "24px",
+              opacity:
+                !value || (value && item.categoryName.indexOf(value) > -1)
+                  ? 1
+                  : 0.5,
+            }}
            src="https://image.xiaomaiketang.com/xm/hasCategory.png"
            alt=""
          />

--- a/src/modules/teach-tool/components/CourseCategorySiderTree.less
+++ b/src/modules/teach-tool/components/CourseCategorySiderTree.less
-/*
+.category-tree-sider {
- * @Author: yuananting
- * @Date: 2021-02-22 12:02:34
- * @LastEditors: yuananting
- * @LastEditTime: 2021-03-27 13:52:19
- * @Description: 助学工具-题库-课程分类侧边栏样式
- * @Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
- */
- .category-tree-sider {
  position: relative;
  .sider-title {
    height: 22px;
@@ -68,6 +60,6 @@
  }
  .ant-tree.ant-tree-directory .ant-tree-treenode:hover::before {
-    background-color: #F3F6FA;
+    background-color: #f3f6fa;
  }
 }
--- a/src/modules/teach-tool/examination-paper/NewExaminationPaper.jsx
+++ b/src/modules/teach-tool/examination-paper/NewExaminationPaper.jsx
@@ -2,18 +2,29 @@
 * @Author: yuananting
 * @Date: 2021-03-27 16:15:13
 * @LastEditors: yuananting
- * @LastEditTime: 2021-03-27 18:19:13
+ * @LastEditTime: 2021-03-29 10:54:49
 * @Description: 助学工具-新建试卷
 * @Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
 */
 import React, { Component } from "react";
-import { Form, Button, Select, Input, Space, Table } from "antd";
+import {
+  Form,
+  Button,
+  Select,
+  Input,
+  Space,
+  Table,
+  InputNumber,
+  ConfigProvider,
+  Empty,
+} from "antd";
 import { PlusOutlined } from "@ant-design/icons";
 import ShowTips from "@/components/ShowTips";
 import Breadcrumbs from "@/components/Breadcrumbs";
+import { PageControl } from "@/components";
 import "./NewExaminationPaper.less";
+import SelectQuestionModal from "./modal/SelectQuestionModal";
-const { TextArea } = Input;
 const formItemLayout = {
  labelCol: {
    xs: { span: 24 },
@@ -25,6 +36,42 @@ const formItemLayout = {
  },
 };
 class NewExaminationPaper extends Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      current: 1,
+      size: 10,
+      total: 20,
+    };
+  }
+  // 自定义表格空状态
+  customizeRenderEmpty = () => {
+    return (
+      <Empty
+        image="https://image.xiaomaiketang.com/xm/emptyTable.png"
+        imageStyle={{
+          height: 100,
+        }}
+        description={"请在右上角选择出题方式添加题"}
+      ></Empty>
+    );
+  };
+  // 选择题目
+  chooseQuestion = () => {
+    const m = (
+      <SelectQuestionModal
+        close={() => {
+          this.setState({
+            SelectQuestionModal: null,
+          });
+        }}
+      />
+    );
+    this.setState({ SelectQuestionModal: m });
+  }
  render() {
    const columns = [
      {
@@ -36,12 +83,24 @@ class NewExaminationPaper extends Component {
        dataIndex: "questionType",
        filters: [
          {
-            text: "London",
+            text: "单选题",
-            value: "London",
+            value: "SINGLE_CHOICE",
          },
          {
-            text: "New York",
+            text: "多选题",
-            value: "New York",
+            value: "MULTI_CHOICE",
+          },
+          {
+            text: "判断题",
+            value: "JUDGE",
+          },
+          {
+            text: "填空题",
+            value: "GAP_FILLING",
+          },
+          {
+            text: "不定项选择题",
+            value: "INDEFINITE_CHOICE",
          },
        ],
        filterMultiple: false,
@@ -50,37 +109,35 @@ class NewExaminationPaper extends Component {
      {
        title: "题目",
        dataIndex: "questionContent",
-      },
-    ];
-    const data = [
-      {
-        key: "1",
-        name: "John Brown",
-        age: 32,
-        address: "New York No. 1 Lake Park",
      },
      {
-        key: "2",
+        title: "分值",
-        name: "Jim Green",
+        dataIndex: "score",
-        age: 42,
+        render: (val) => {
-        address: "London No. 1 Lake Park",
+          return <InputNumber min={1} max={100} defaultValue={2} />;
+        },
      },
      {
-        key: "3",
+        dataIndex: "extraScore",
-        name: "Joe Black",
+        render: (val) => {
-        age: 32,
+          return (
-        address: "Sidney No. 1 Lake Park",
+            <div>
+              漏选得
+              <InputNumber defaultValue={0} />
+            </div>
+          );
+        },
      },
      {
-        key: "4",
+        title: "操作",
-        name: "Jim Red",
+        dataIndex: "operate",
-        age: 32,
+        render: (val, record) => <span>移除</span>,
-        address: "London No. 2 Lake Park",
      },
    ];
+    const data = [];
+    const { current, size, total, SelectQuestionModal } = this.state;
    return (
      <div className="page new-examination-paper">
        <Breadcrumbs navList={"新建试卷"} goBack={() => this.handleGoBack()} />
@@ -105,13 +162,42 @@ class NewExaminationPaper extends Component {
            >
              <h1 style={{ fontSize: 16 }}>题目管理</h1>
              <Space>
-                <Button icon={<PlusOutlined />}>自选题目</Button>
+                <Button icon={<PlusOutlined />} onClick={this.chooseQuestion}>自选题目</Button>
                <Button icon={<PlusOutlined />}>系统抽题</Button>
                <Button icon={<PlusOutlined />}>一人一卷</Button>
              </Space>
            </div>
            <Form.Item>
-              <Table columns={columns} dataSource={data} />
+              <div>
+                总计40分，共20题。
+                单选题5题，共10分；多选题2题，共4分；判断题3题，共6分，填空题5题，共10分，不定项选择题5题，共10分
+              </div>
+              <ConfigProvider renderEmpty={this.customizeRenderEmpty}>
+                <Table columns={columns} dataSource={data} pagination={false} />
+              </ConfigProvider>
+              <div className="box-footer">
+                <PageControl
+                  current={current - 1}
+                  pageSize={size}
+                  total={total}
+                  toPage={(page) => {
+                    const _query = { ...query, current: page + 1 };
+                    this.setState({ query: _query }, () =>
+                      this.queryQuestionPageList()
+                    );
+                  }}
+                  showSizeChanger={true}
+                  onShowSizeChange={this.onShowSizeChange}
+                />
+              </div>
+            </Form.Item>
+            <Form.Item label="及格线：">
+              <div>
+                <InputNumber min={1} defaultValue={60} /> %
+                <span style={{ marginLeft: 20 }}>
+                  总分（0）*及格线（60%）=及格分数（0）
+                </span>
+              </div>
            </Form.Item>
          </Form>
        </div>
@@ -120,6 +206,7 @@ class NewExaminationPaper extends Component {
          <Button>预览</Button>
          <Button type="primary">保存</Button>
        </div>
+        {SelectQuestionModal}
      </div>
    );
  }

--- a/src/modules/teach-tool/examination-paper/components/ExaminationPaperContent.jsx
+++ b/src/modules/teach-tool/examination-paper/components/ExaminationPaperContent.jsx
@@ -2,7 +2,7 @@
 * @Author: yuananting
 * @Date: 2021-02-25 11:23:47
 * @LastEditors: yuananting
- * @LastEditTime: 2021-03-27 16:54:25
+ * @LastEditTime: 2021-03-29 13:57:20
 * @Description: 助学工具-题库-题目管理主页面列表数据
 * @Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
 */
@@ -335,8 +335,6 @@ class ExaminationPaperContent extends Component {
              />
            </div>
          )}
-          {/* {this.state.QuestionPreviewModal} */}
-          {/* {this.state.ImportQuestionModal} */}
        </div>
      </div>
    );

--- a/src/modules/teach-tool/examination-paper/components/SelectQuestionContent.jsx
+++ b/src/modules/teach-tool/examination-paper/components/SelectQuestionContent.jsx
--- a/src/modules/teach-tool/examination-paper/components/SelectQuestionContent.less
+++ b/src/modules/teach-tool/examination-paper/components/SelectQuestionContent.less
+/*
+ * @Author: yuananting
+ * @Date: 2021-02-25 11:26:28
+ * @LastEditors: yuananting
+ * @LastEditTime: 2021-03-29 13:39:28
+ * @Description: 助学工具-题库-题目管理右侧内容样式
+ * @Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
+ */
+.select-question-content {
+  .select-question-filter {
+    position: relative;
+    .search-condition {
+      width: calc(100% - 80px);
+      display: flex;
+      align-items: center;
+      flex-wrap: wrap;
+      &__item {
+        width: 30%;
+        margin-right: 3%;
+        margin-bottom: 16px;
+        .search-label {
+          vertical-align: middle;
+          display: inline-block;
+          height: 32px;
+          line-height: 32px;
+        }
+      }
+    }
+    .reset-fold-area {
+      position: absolute;
+      right: 12px;
+      .resetBtn {
+        color: #999999;
+        font-size: 18px;
+        margin-right: 8px;
+      }
+      .fold-btn {
+        font-size: 14px;
+        color: #666666;
+        line-height: 20px;
+        .fold-icon {
+          font-size: 12px;
+          margin-left: 4px;
+        }
+      }
+    }
+  }
+  .data-icon {
+    cursor: pointer;
+  }
+  .question-manage-list {
+    position: relative;
+    margin-top: 16px;
+    .empty-list-tip {
+      color: #ffb714;
+      cursor: pointer;
+    }
+    .record-name {
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+    }
+    .record-operate {
+      display: flex;
+      &__item {
+        color: #5289fa;
+        cursor: pointer;
+        &.split {
+          margin: 0 8px;
+          color: #bfbfbf;
+        }
+      }
+    }
+  }
+}
+.tool-list {
+  .ant-tooltip-inner {
+    max-width: 700px !important;
+  }
+}
--- a/src/modules/teach-tool/examination-paper/modal/SelectQuestionModal.jsx
+++ b/src/modules/teach-tool/examination-paper/modal/SelectQuestionModal.jsx
+/*
+ * @Author: yuananting
+ * @Date: 2021-03-29 10:52:26
+ * @LastEditors: yuananting
+ * @LastEditTime: 2021-03-29 14:09:08
+ * @Description: 助学工具-新建试卷-选择题目弹窗
+ * @Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
+ */
+import React, { Component } from "react";
+import { Modal } from "antd";
+import CourseCategorySiderTree from "../../components/CourseCategorySiderTree";
+import SelectQuestionContent from "../components/SelectQuestionContent";
+import "./SelectQuestionModal.less"
+class SelectQuestionModal extends Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      updatedCategoryId: null,
+      selectedCategoryId: null,
+    };
+  }
+  getCategoryIdFromSider = (selectedCategoryId) => {
+    if (selectedCategoryId && selectedCategoryId.length > 0) {
+      this.setState({ selectedCategoryId: selectedCategoryId[0] });
+    }
+  };
+  updatedSiderTreeFromList = (updatedCategoryId) => {
+    this.setState({ updatedCategoryId });
+  };
+  render() {
+    const { updatedCategoryId, selectedCategoryId } = this.state;
+    return (
+      <Modal
+        title="选择题目"
+        visible={true}
+        width={1200}
+        // onOk={handleOk}
+        onCancel={this.props.close}
+        className="select-question-modal"
+      >
+        <div className="box content-body">
+          <div
+            style={{ borderRight: "0.5px solid #EEEEEE", paddingRight: "4px" }}
+          >
+            <div className="sider">
+              <CourseCategorySiderTree
+                getSelectedCategoryId={this.getCategoryIdFromSider.bind(this)}
+                updatedCategoryId
+              />
+            </div>
+          </div>
+          <div className="content">
+            <SelectQuestionContent
+              updatedSiderTree={this.updatedSiderTreeFromList.bind(this)}
+              selectedCategoryId
+            />
+          </div>
+        </div>
+      </Modal>
+    );
+  }
+}
+export default SelectQuestionModal;
--- a/src/modules/teach-tool/examination-paper/modal/SelectQuestionModal.less
+++ b/src/modules/teach-tool/examination-paper/modal/SelectQuestionModal.less
+.select-question-modal {
+  .content-body {
+    display: flex;
+    .site-layout-background {
+      background: #fff;
+    }
+    .sider {
+      min-width: 244px;
+    }
+    .content {
+      width: 100%;
+      margin-left: 24px;
+      height: calc(100vh - 160px);
+    }
+  }
+}
\ No newline at end of file
--- a/src/modules/teach-tool/modal/NewEditCourseCategoryModal.jsx
+++ b/src/modules/teach-tool/modal/NewEditCourseCategoryModal.jsx
@@ -2,12 +2,12 @@
 * @Author: yuananting
 * @Date: 2021-02-22 17:51:28
 * @LastEditors: yuananting
- * @LastEditTime: 2021-03-27 14:08:47
+ * @LastEditTime: 2021-03-29 19:37:03
- * @Description: 助学工具-题库-新建编辑课程分类模态框
+ * @Description: 助学工具-新建编辑课程分类模态框
 * @Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
 */
 import React, { Component } from "react";
-import { Modal, Form, Input, message } from "antd";
+import { Modal, Form, Input } from "antd";
 import User from "@/common/js/user";
 import QuestionBankService from "@/domains/question-bank-domain/QuestionBankService";
 class NewEditCourseCategoryModal extends Component {
@@ -51,7 +51,7 @@ class NewEditCourseCategoryModal extends Component {
      //新增
      params.categoryName = categoryName;
      if (addLevelType === "equal") {
-        params.parentId = node ? node.parentId : 0
+        params.parentId = node ? node.parentId : 0;
        params.categoryLevel = node ? node.categoryLevel : 0;
      } else {
        params.parentId = node.id;
@@ -86,29 +86,51 @@ class NewEditCourseCategoryModal extends Component {
    }
  };
+  // 校验是否重名
+  checkExist = (sameLevelNodes, categoryName) => {
+    if (sameLevelNodes.length > 0 && sameLevelNodes[0].parentId === "0") {
+      if (categoryName === "未分类") {
+        return true;
+      }
+    }
+    var result = null;
+    sameLevelNodes.forEach((item) => {
+      if (result != null) {
+        return result;
+      }
+      if (item.categoryName === categoryName) {
+        result = item;
+      }
+    });
+    return result;
+  };
+  // 查询同级节点
  getEqualLevelNodes = (data, parentId) => {
    let nodes = [];
    data.forEach((item) => {
      if (item.parentId === parentId) {
        nodes.push(item);
      }
-      if (item.children) {
+      if (item.sonCategoryList) {
-        nodes.push(...this.getEqualLevelNodes(item.children, parentId));
+        nodes.push(...this.getEqualLevelNodes(item.sonCategoryList, parentId));
      }
    });
    return nodes;
  };
+  // 查询子级节点
  getChildLevelNodes = (data, id) => {
    let nodes = [];
    data.forEach((item) => {
-      if (item.id === id && item.children) {
+      if (item.id === id && item.sonCategoryList) {
-        nodes.push(...item.children);
+        nodes.push(...item.sonCategoryList);
      }
-      if (item.children) {
+      if (item.sonCategoryList) {
-        nodes.push(...this.getChildLevelNodes(item.children, id));
+        nodes.push(...this.getChildLevelNodes(item.sonCategoryList, id));
      }
    });
+    console.log(nodes)
    return nodes;
  };
@@ -123,28 +145,9 @@ class NewEditCourseCategoryModal extends Component {
    return sameLevelNodes;
  };
-  // 查询是否重名
-  checkExist = (sameLevelNodes, categoryName) => {
-    if ((sameLevelNodes.length > 0 && sameLevelNodes[0].parentId === "0")) {
-      if (categoryName === "未分类") {
-        return true;
-      }
-    }
-    var result = null;
-    sameLevelNodes.forEach((item) => {
-      if (result != null) {
-        return result;
-      }
-      if (item.categoryName === categoryName) {
-        result = item;
-      }
-    });
-    return result;
-  };
  render() {
-    const { title, label, treeData, addLevelType } = this.props;
+    const { title, label, addLevelType } = this.props;
-    const { categoryName } = this.state;
+    const { categoryName, treeData } = this.state;
    const _that = this;
    return (
      <Modal
@@ -182,7 +185,7 @@ class NewEditCourseCategoryModal extends Component {
              defaultValue={categoryName}
              placeholder={`请输入${title}，最多10个字`}
              maxLength={10}
-              autoComplete="off" 
+              autoComplete="off"
              onChange={(e) => {
                this.setState({
                  categoryName: e.target.value,

--- a/src/modules/teach-tool/question-bank/AddNewQuestion.jsx
+++ b/src/modules/teach-tool/question-bank/AddNewQuestion.jsx
@@ -2,8 +2,8 @@
 * @Author: yuananting
 * @Date: 2021-02-25 13:46:35
 * @LastEditors: yuananting
- * @LastEditTime: 2021-03-27 14:42:23
+ * @LastEditTime: 2021-03-29 20:24:01
- * @Description: 助学工具-题库-题目管理-新增题目
+ * @Description: 助学工具-题库-新建题目
 * @Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
 */
 import React, { Component } from "react";
@@ -59,6 +59,7 @@ class AddNewQuestion extends Component {
    return p;
  };
+  // 编辑题目时获取相应题目详情
  queryQuestionDetails = () => {
    let query = {
      id: getParameterByName("id"),
@@ -104,6 +105,7 @@ class AddNewQuestion extends Component {
    });
  };
+  // 保存并继续添加时重新构建题目结构
  handleRest = (type) => {
    this.setState({ currentOperate: "add" });
    switch (type) {
@@ -147,6 +149,67 @@ class AddNewQuestion extends Component {
    chooseOptions.push(defineJudgeOptionInfo(content));
  };
+  // 取消编辑并返回上一级路由
+  handleGoBack = () => {
+    Modal.confirm({
+      title: "确定要返回吗？",
+      content: "返回后，本次编辑的内容将不被保存",
+      okText: "确认返回",
+      cancelText: "留在本页",
+      icon: (
+        <span className="icon iconfont default-confirm-icon">&#xe6f4;</span>
+      ),
+      onOk: () => {
+        window.RCHistory.push({
+          pathname: `/question-bank-index?categoryId=${getParameterByName("categoryId")}`,
+        });
+      },
+    });
+  };
+  // 校验保存题目
+  confirmSaveQuestion = (next) => {
+    const {
+      singleChoiceContent,
+      multiChoiceContent,
+      judgeContent,
+      gapFillingContent,
+      indefiniteChoiceContent,
+    } = this.state;
+    switch (this.state.activeKey) {
+      case "SINGLE_CHOICE":
+        if (this.singleChoiceRef.checkInput() === 0) {
+          this.saveCurrentQuestion(singleChoiceContent, "SINGLE_CHOICE", next);
+        }
+        break;
+      case "MULTI_CHOICE":
+        if (this.multiChoiceRef.checkInput() === 0) {
+          this.saveCurrentQuestion(multiChoiceContent, "MULTI_CHOICE", next);
+        }
+        break;
+      case "JUDGE":
+        if (this.judgeRef.checkInput() === 0) {
+          this.saveCurrentQuestion(judgeContent, "JUDGE", next);
+        }
+        break;
+      case "GAP_FILLING":
+        if (this.gapRef.checkInput() === 0) {
+          this.saveCurrentQuestion(gapFillingContent, "GAP_FILLING", next);
+        }
+        break;
+      case "INDEFINITE_CHOICE":
+        if (this.indefiniteRef.checkInput() === 0) {
+          this.saveCurrentQuestion(
+            indefiniteChoiceContent,
+            "INDEFINITE_CHOICE",
+            next
+          );
+        }
+        break;
+    }
+  };
+  // 确认保存题目
  saveCurrentQuestion = (content, type, next) => {
    content.questionStemList.map((item, index) => {
      item.sort = index;
@@ -169,7 +232,7 @@ class AddNewQuestion extends Component {
      params = {
        ...content,
        id: getParameterByName("id"),
-        categoryId: categoryId || null,
+        categoryId: categoryId === "null" ? null : categoryId,
        source: 0,
        tenantId: User.getStoreId(),
        userId: User.getStoreUserId(),
@@ -183,7 +246,7 @@ class AddNewQuestion extends Component {
          }
          if (next === "close") {
            window.RCHistory.push({
-              pathname: `/question-bank-index?categoryId=${params.categoryId}`,
+              pathname: `/question-bank-index?categoryId=${categoryId}`,
            });
          }
        }
@@ -191,7 +254,7 @@ class AddNewQuestion extends Component {
    } else {
      params = {
        ...content,
-        categoryId: getParameterByName("categoryId"),
+        categoryId,
        source: 0,
        tenantId: User.getStoreId(),
        userId: User.getStoreUserId(),
@@ -204,7 +267,7 @@ class AddNewQuestion extends Component {
          }
          if (next === "close") {
            window.RCHistory.push({
-              pathname: `/question-bank-index?categoryId=${params.categoryId}`,
+              pathname: `/question-bank-index?categoryId=${categoryId}`,
            });
          }
        }
@@ -212,63 +275,6 @@ class AddNewQuestion extends Component {
    }
  };
-  // 取消编辑并返回上一级路由
-  handleGoBack = () => {
-    Modal.confirm({
-      title: "确定要返回吗？",
-      content: "返回后，本次编辑的内容将不被保存",
-      okText: "确认返回",
-      cancelText: "留在本页",
-      icon: (
-        <span className="icon iconfont default-confirm-icon">&#xe6f4;</span>
-      ),
-      onOk: () => {
-        window.RCHistory.goBack();
-      },
-    });
-  };
-  confirmSaveQuestion = (next) => {
-    const {
-      singleChoiceContent,
-      multiChoiceContent,
-      judgeContent,
-      gapFillingContent,
-      indefiniteChoiceContent,
-    } = this.state;
-    switch (this.state.activeKey) {
-      case "SINGLE_CHOICE":
-        if (this.singleChoiceRef.checkInput() === 0) {
-          this.saveCurrentQuestion(singleChoiceContent, "SINGLE_CHOICE", next);
-        }
-        break;
-      case "MULTI_CHOICE":
-        if (this.multiChoiceRef.checkInput() === 0) {
-          this.saveCurrentQuestion(multiChoiceContent, "MULTI_CHOICE", next);
-        }
-        break;
-      case "JUDGE":
-        if (this.judgeRef.checkInput() === 0) {
-          this.saveCurrentQuestion(judgeContent, "JUDGE", next);
-        }
-        break;
-      case "GAP_FILLING":
-        if (this.gapRef.checkInput() === 0) {
-          this.saveCurrentQuestion(gapFillingContent, "GAP_FILLING", next);
-        }
-        break;
-      case "INDEFINITE_CHOICE":
-        if (this.indefiniteRef.checkInput() === 0) {
-          this.saveCurrentQuestion(
-            indefiniteChoiceContent,
-            "INDEFINITE_CHOICE",
-            next
-          );
-        }
-        break;
-    }
-  };
  handleLogger = (en, cn) => {
    const { onLogger } = this.props;
    onLogger && onLogger(en, cn);
@@ -308,7 +314,13 @@ class AddNewQuestion extends Component {
            <TabPane
              tab={
                <span>
-                  <span className="icon iconfont" style={{ color: activeKey === "SINGLE_CHOICE" ? "#ffb714" : "#CCCCCC" }}>
+                  <span
+                    className="icon iconfont"
+                    style={{
+                      color:
+                        activeKey === "SINGLE_CHOICE" ? "#ffb714" : "#CCCCCC",
+                    }}
+                  >
                    &#xe7fa;{" "}
                  </span>
                  <span>单选题</span>
@@ -331,7 +343,13 @@ class AddNewQuestion extends Component {
            <TabPane
              tab={
                <span>
-                  <span className="icon iconfont" style={{ color: activeKey === "MULTI_CHOICE" ? "#ffb714" : "#CCCCCC" }}>
+                  <span
+                    className="icon iconfont"
+                    style={{
+                      color:
+                        activeKey === "MULTI_CHOICE" ? "#ffb714" : "#CCCCCC",
+                    }}
+                  >
                    &#xe7fb;{" "}
                  </span>
                  <span>多选题</span>
@@ -354,7 +372,12 @@ class AddNewQuestion extends Component {
            <TabPane
              tab={
                <span>
-                  <span className="icon iconfont" style={{ color: activeKey === "JUDGE" ? "#ffb714" : "#CCCCCC" }}>
+                  <span
+                    className="icon iconfont"
+                    style={{
+                      color: activeKey === "JUDGE" ? "#ffb714" : "#CCCCCC",
+                    }}
+                  >
                    &#xe7fc;{" "}
                  </span>
                  <span>判断题</span>
@@ -376,7 +399,13 @@ class AddNewQuestion extends Component {
            <TabPane
              tab={
                <span>
-                  <span className="icon iconfont" style={{ color: activeKey === "GAP_FILLING" ? "#ffb714" : "#CCCCCC" }}>
+                  <span
+                    className="icon iconfont"
+                    style={{
+                      color:
+                        activeKey === "GAP_FILLING" ? "#ffb714" : "#CCCCCC",
+                    }}
+                  >
                    &#xe7fd;{" "}
                  </span>
                  <span>填空题</span>
@@ -398,12 +427,25 @@ class AddNewQuestion extends Component {
            <TabPane
              tab={
                <span>
-                  <span className="icon iconfont" style={{ color: activeKey === "INDEFINITE_CHOICE" ? "#ffb714" : "#CCCCCC" }}>
+                  <span
+                    className="icon iconfont"
+                    style={{
+                      color:
+                        activeKey === "INDEFINITE_CHOICE"
+                          ? "#ffb714"
+                          : "#CCCCCC",
+                    }}
+                  >
                    &#xe7fe;{" "}
                  </span>
                  <span>不定项选择题 </span>
                  <Tooltip title="至少有一项正确，至多不限的选择题，多项选择题的一种特殊形式">
-                    <span className="icon iconfont" style={{ color: "#BFBFBF" }}>&#xe7c4;</span>
+                    <span
+                      className="icon iconfont"
+                      style={{ color: "#BFBFBF" }}
+                    >
+                      &#xe7c4;
+                    </span>
                  </Tooltip>
                </span>
              }

--- a/src/modules/teach-tool/question-bank/AddNewQuestion.less
+++ b/src/modules/teach-tool/question-bank/AddNewQuestion.less
-/*
+.add-new-question {
- * @Author: yuananting
- * @Date: 2021-02-25 13:52:01
- * @LastEditors: yuananting
- * @LastEditTime: 2021-03-18 09:32:11
- * @Description: 助学工具-题库-题目管理-新增题目样式
- * @Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
- */
- .add-new-question {
  position: relative !important;
  .box {
    margin-bottom: 66px !important;

--- a/src/modules/teach-tool/question-bank/QuestionBankIndex.jsx
+++ b/src/modules/teach-tool/question-bank/QuestionBankIndex.jsx
@@ -2,11 +2,10 @@
 * @Author: yuananting
 * @Date: 2021-02-21 17:51:01
 * @LastEditors: yuananting
- * @LastEditTime: 2021-03-27 14:58:13
+ * @LastEditTime: 2021-03-29 16:11:41
 * @Description: 助学工具-题库-题库主页面
 * @Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
 */
 import React, { Component } from "react";
 import "./QuestionBankIndex.less";
 import CourseCategorySiderTree from "../components/CourseCategorySiderTree";
@@ -15,13 +14,9 @@ import QuestionManageContent from "./components/QuestionManageContent";
 class QuestionBankIndex extends Component {
  constructor(props) {
    super(props);
-    this.state = {
+    this.state = {};
-      selectedCategoryId: "",
-    };
  }
-  componentDidMount() {}
  getCategoryIdFromSider = (selectedCategoryId) => {
    if (selectedCategoryId && selectedCategoryId.length > 0) {
      this.setState({ selectedCategoryId: selectedCategoryId[0] });

--- a/src/modules/teach-tool/question-bank/QuestionBankIndex.less
+++ b/src/modules/teach-tool/question-bank/QuestionBankIndex.less
-/*
+.question-bank-index {
- * @Author: yuananting
- * @Date: 2021-02-21 18:27:43
- * @LastEditors: yuananting
- * @LastEditTime: 2021-03-24 16:15:03
- * @Description: 助学工具-题库-题库主页面样式
- * @Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
- */
- .question-bank-index {
  .content-body {
    display: flex;
    .site-layout-background {

--- a/src/modules/teach-tool/question-bank/components/NewQuestionTab.jsx
+++ b/src/modules/teach-tool/question-bank/components/NewQuestionTab.jsx
--- a/src/modules/teach-tool/question-bank/components/NewQuestionTab.less
+++ b/src/modules/teach-tool/question-bank/components/NewQuestionTab.less
@@ -175,12 +175,6 @@
    margin-right: 187px;
  }
-  // .question-item_options {
-  //   display: flex;
-  //   align-items: center;
-  //   padding-bottom: 15px;
-  // }
  .question-item_options__list {
    flex: 1;
    position: relative;
@@ -440,38 +434,3 @@
    }
  }
 }
-.question_skeleton {
-  background: linear-gradient(90deg, #f2f2f2 25%, #e6e6e6 37%, #f2f2f2 63%);
-  background-size: 400% 100%;
-  animation: question-editor_skeleton__loading 1.4s ease infinite;
-}
-.question_skeleton__editor {
-  min-height: 33px;
-  max-height: 140px;
-  overflow: hidden;
-}
-.question_skeleton__img {
-  width: 88px;
-  height: 88px;
-}
-.question_skeleton__voice {
-  height: 48px;
-  width: 280px;
-}
-.question_skeleton__video {
-  width: 100%;
-  height: 100%;
-}
-@keyframes question-editor_skeleton__loading {
-  0% {
-    background-position: 100% 50%;
-  }
-  100% {
-    background-position: 0 50%;
-  }
-}
--- a/src/modules/teach-tool/question-bank/components/QuestionManageContent.jsx
+++ b/src/modules/teach-tool/question-bank/components/QuestionManageContent.jsx
--- a/src/modules/teach-tool/question-bank/components/QuestionManageContent.less
+++ b/src/modules/teach-tool/question-bank/components/QuestionManageContent.less
-/*
- * @Author: yuananting
- * @Date: 2021-02-25 11:26:28
- * @LastEditors: yuananting
- * @LastEditTime: 2021-03-25 14:32:01
- * @Description: 助学工具-题库-题目管理右侧内容样式
- * @Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
- */
 .question-manage-content {
  .question-manage-filter {
    position: relative;
@@ -81,8 +73,3 @@
    max-width: 700px !important;
  }
 }
-.fill-line {
-  padding: 0 10px;
-  border-bottom: 1px solid;
-}
--- a/src/modules/teach-tool/question-bank/modal/BatchImportQuestionModal.jsx
+++ b/src/modules/teach-tool/question-bank/modal/BatchImportQuestionModal.jsx
 /*
- * @Author: zhangyi
+ * @Author: yuananting
- * @Date: 2019-12-09 10:29:55
+ * @Date: 2021-03-27 11:15:03
- * @Last Modified by: mikey.wanghaofeng
+ * @LastEditors: yuananting
- * @Last Modified time: 2020-09-25 11:03:47
+ * @LastEditTime: 2021-03-29 16:22:28
+ * @Description: 助学工具-题库-批量导入题目
+ * @Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
 */
 import React, { Component } from "react";
 import { Modal, Button, message, Spin } from "antd";
 import "./BatchImportQuestionModal.less";

--- a/src/modules/teach-tool/question-bank/modal/BatchImportQuestionModal.less
+++ b/src/modules/teach-tool/question-bank/modal/BatchImportQuestionModal.less
-@import '@/core/mixins.less';
+@import "@/core/mixins.less";
 .import-score-modal {
  .step-section {
    margin-bottom: 24px;
@@ -48,7 +48,7 @@
      }
    }
    .file-box :hover {
-      background-color: #FFF8E8;
+      background-color: #fff8e8;
      .del-img {
        visibility: visible !important;
      }
@@ -63,7 +63,7 @@
    }
    .down-btn {
      text-align: left;
-      color: #5289FA;
+      color: #5289fa;
      font-size: 12px;
      display: block;
      margin-top: 8px;
@@ -73,18 +73,18 @@
      width: 200px;
      .ant-upload-list-item-name {
        .text-overflow-ellipsis();
-        width:70%;
+        width: 70%;
      }
    }
  }
  .import-status-box {
-    height:430px;
+    height: 430px;
    overflow: hidden;
    .status-content {
-      margin:auto;
+      margin: auto;
      text-align: center;
-      margin-top:100px;
+      margin-top: 100px;
-      >img {
+      > img {
        width: 76px;
      }
      .status {
@@ -97,9 +97,9 @@
        color: #666666;
        margin-bottom: 16px;
        .num {
-          color: #FC9C6B;
+          color: #fc9c6b;
        }
      }
    }
  }
 }
\ No newline at end of file
--- a/src/modules/teach-tool/question-bank/modal/QuestionPreviewModal.jsx
+++ b/src/modules/teach-tool/question-bank/modal/QuestionPreviewModal.jsx
+/*
+ * @Author: yuananting
+ * @Date: 2021-03-27 11:15:03
+ * @LastEditors: yuananting
+ * @LastEditTime: 2021-03-29 16:19:35
+ * @Description: 助学工具-题库-预览题目
+ * @Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
+ */
 import React, { Component } from "react";
 import { Modal } from "antd";
 import User from "@/common/js/user";
@@ -42,6 +50,7 @@ class QuestionPreviewModal extends Component {
    });
  };
+  // 查看图片或视频
  handleScanFile = (scanFileType, scanFileAddress) => {
    this.setState({
      showScanFile: true,
@@ -50,13 +59,6 @@ class QuestionPreviewModal extends Component {
    });
  };
-  transferStemDocument = (txt) => {
-    const template = `<p class='content'>${txt}</p>`;
-    let doc = new DOMParser().parseFromString(template, "text/html");
-    let p = doc.querySelector(".content");
-    return p;
-  };
  render() {
    const {
      showScanFile,
@@ -225,7 +227,10 @@ class QuestionPreviewModal extends Component {
                          )}
                          {["JUDGE"].includes(questionTypeEnum) &&
                            _.map(questionOptionContentList, (item, index) => {
-                              item.content = item.content.replace(/<\/?[^>]*>/g, "");
+                              item.content = item.content.replace(
+                                /<\/?[^>]*>/g,
+                                ""
+                              );
                              return <span key={index}>{item.content}</span>;
                            })}
                        </div>

--- a/src/modules/teach-tool/question-bank/modal/QuestionPreviewModal.less
+++ b/src/modules/teach-tool/question-bank/modal/QuestionPreviewModal.less
@@ -17,7 +17,7 @@
  }
  .question-stem {
    margin-bottom: 16px;
-    border-bottom: 1px solid #E8E8E8;
+    border-bottom: 1px solid #e8e8e8;
    padding-bottom: 16px;
    &__title {
      height: 22px;
@@ -140,7 +140,7 @@
  }
  .question-answer {
    margin-bottom: 16px;
-    border-bottom: 1px solid #E8E8E8;
+    border-bottom: 1px solid #e8e8e8;
    padding-bottom: 16px;
    img {
      max-width: 88px;