fix:分类树搜索展开项修改

src/modules/teach-tool/QuestionCategoryManage.jsx

@@ -2,7 +2,7 @@
  * @Author: yuananting
  * @Date: 2021-02-23 18:28:50
  * @LastEditors: yuananting
- * @LastEditTime: 2021-03-18 18:13:26
+ * @LastEditTime: 2021-03-19 14:15:00
  * @Description: 助学工具-题库-主页面分类管理
  * @Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
  */
@@ -34,6 +34,7 @@ class QuestionCategoryManage extends Component {
       treeData: [],
       treeMap: {},
       selectedKeys: ["0"],
+      autoExpandParent: true,
     };
   }
 
@@ -52,22 +53,45 @@ class QuestionCategoryManage extends Component {
     QuestionBankService.queryCategoryTree(query).then((res) => {
       const { result = [] } = res;
       let str = "未分类";
-      if (categoryName && str.indexOf(categoryName) < 0) {
-        this.setState({ treeData: this.renderTreeNodes(result, categoryName) });
-        this.setState({
-          expandedKeys: this.getFirstLevelKeys(result),
-        });
+      if (categoryName) {
+        this.setState({ autoExpandParent: true });
+        if (str.indexOf(categoryName) < 0) {
+          this.setState({
+            treeData: this.renderTreeNodes(result, categoryName),
+          });
+          let nodeId = [];
+          Object.keys(this.state.treeMap).forEach((item) => {
+            nodeId.push(item);
+          });
+          this.setState({ expandedKeys: nodeId });
+        } else {
+          const defaultNode = {
+            id: "0",
+            categoryName: "未分类",
+            categoryCount: 0,
+          };
+          result.unshift(defaultNode);
+          this.setState({
+            treeData: this.renderTreeNodes(result, categoryName),
+          });
+          let nodeId = [];
+          Object.keys(this.state.treeMap).forEach((item) => {
+            nodeId.push(item);
+          });
+          this.setState({ expandedKeys: nodeId });
+        }
       } else {
+        this.setState({ autoExpandParent: false });
         const defaultNode = {
           id: "0",
           categoryName: "未分类",
           categoryCount: 0,
         };
         result.unshift(defaultNode);
-        this.setState({ treeData: this.renderTreeNodes(result, categoryName) });
         this.setState({
-          expandedKeys: this.getFirstLevelKeys(result),
+          treeData: this.renderTreeNodes(result, categoryName),
         });
+        this.setState({ expandedKeys: [] });
       }
     });
   };
@@ -433,29 +457,34 @@ class QuestionCategoryManage extends Component {
       return item;
     });
 
-    // this.getFirstLevelKeys(newTreeData);
-
     let map = {};
-    let getChildren = function (data) {
-      data.forEach((item) => {
-        map[item.id] = item;
-        if (item.sonCategoryList && item.sonCategoryList.length > 0) {
-          getChildren(item.sonCategoryList);
-        }
-      });
-    };
-    getChildren(data);
-    this.setState({ treeMap: map });
+    this.setState({ treeMap: this.getTreeMap(data, map) });
     return newTreeData;
   };
 
+  getTreeMap = (data, map) => {
+    data.forEach((item) => {
+      map[item.id] = item;
+      if (item.sonCategoryList && item.sonCategoryList.length > 0) {
+        this.getTreeMap(item.sonCategoryList, map);
+      }
+    });
+    return map;
+  };
+
   /** 树状选中事件 */
   onSelect = (selectedKeys) => {
     this.setState({ selectedKeys });
   };
 
   render() {
-    const { treeData, expandedKeys, selectedKeys } = this.state;
+    const {
+      treeData,
+      expandedKeys,
+      selectedKeys,
+      autoExpandParent,
+    } = this.state;
+    console.log("autoExpandParent:", autoExpandParent);
     return (
       <div className="page question-category-manage">
         <Breadcrumbs
@@ -497,6 +526,7 @@ class QuestionCategoryManage extends Component {
           <div className="course-category-tree">
             <DirectoryTree
               expandedKeys={expandedKeys}
+              autoExpandParent={autoExpandParent}
               onExpand={this.onExpand}
               selectedKeys={selectedKeys}
               onSelect={this.onSelect}

src/modules/teach-tool/components/QuestionBankSider.jsx

@@ -2,7 +2,7 @@
  * @Author: yuananting
  * @Date: 2021-02-22 10:59:43
  * @LastEditors: yuananting
- * @LastEditTime: 2021-03-18 18:16:16
+ * @LastEditTime: 2021-03-19 14:18:59
  * @Description: 助学工具-题库-题库主页面侧边栏
  * @Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
  */
@@ -26,6 +26,7 @@ class QuestionBankSider extends Component {
       NewEditQuestionBankCategory: null, //新增或编辑分类模态框
       ImportCourseCategory: null, // 引用课程分类模态框
       treeData: this.props.treeData || [],
+      autoExpandParent: false
     };
   }
 
@@ -80,16 +81,36 @@ class QuestionBankSider extends Component {
     };
     QuestionBankService.queryQuestionCategoryTree(query).then((res) => {
       const { categoryList = [], noCategoryCnt = 0 } = res.result;
-
       let str = "未分类";
-      if (categoryName && str.indexOf(categoryName) < 0) {
-        this.setState({
-          treeData: this.renderTreeNodes(categoryList, categoryName),
-        });
-        this.setState({
-          expandedKeys: this.getFirstLevelKeys(categoryList),
-        });
+      if (categoryName) {
+        this.setState({ autoExpandParent: true });
+        if (str.indexOf(categoryName) < 0) {
+          this.setState({
+            treeData: this.renderTreeNodes(categoryList, categoryName),
+          });
+          let nodeId = [];
+          Object.keys(this.state.treeMap).forEach((item) => {
+            nodeId.push(item);
+          });
+          this.setState({ expandedKeys: nodeId });
+        } else {
+          const defaultNode = {
+            id: "0",
+            categoryName: "未分类",
+            categoryCount: noCategoryCnt,
+          };
+          categoryList.unshift(defaultNode);
+          this.setState({
+            treeData: this.renderTreeNodes(categoryList, categoryName),
+          });
+          let nodeId = [];
+          Object.keys(this.state.treeMap).forEach((item) => {
+            nodeId.push(item);
+          });
+          this.setState({ expandedKeys: nodeId });
+        }
       } else {
+        this.setState({ autoExpandParent: false });
         const defaultNode = {
           id: "0",
           categoryName: "未分类",
@@ -99,15 +120,23 @@ class QuestionBankSider extends Component {
         this.setState({
           treeData: this.renderTreeNodes(categoryList, categoryName),
         });
-        this.setState({
-          expandedKeys: this.getFirstLevelKeys(categoryList),
-        });
+        this.setState({ expandedKeys: [] });
+      }
+    });
+  };
+
+  getTreeMap = (data, map) => {
+    data.forEach((item) => {
+      map[item.id] = item;
+      if (item.sonCategoryList && item.sonCategoryList.length > 0) {
+        this.getTreeMap(item.sonCategoryList, map);
       }
     });
+    return map;
   };
 
   renderTreeNodes = (data, value) => {
-    return data.map((item) => {
+    let newTreeData = data.map((item) => {
       item.title = item.categoryName;
       item.key = item.id;
       item.title =
@@ -135,10 +164,13 @@ class QuestionBankSider extends Component {
       }
       return item;
     });
+    let map = {};
+    this.setState({ treeMap: this.getTreeMap(data, map) });
+    return newTreeData;
   };
 
   render() {
-    const { treeData, expandedKeys, selectedKeys } = this.state;
+    const { treeData, expandedKeys, selectedKeys, autoExpandParent } = this.state;
     return (
       <div className="question-bank-sider">
         <div className="sider-title">题目分类</div>
@@ -164,6 +196,7 @@ class QuestionBankSider extends Component {
         <div className="sider-tree">
           <DirectoryTree
             expandedKeys={expandedKeys}
+            autoExpandParent={autoExpandParent}
             onExpand={this.onExpand}
             selectedKeys={selectedKeys}
             onSelect={this.onSelect}