feat: 增加二级分类及标签

src/App.tsx

@@ -1,4 +1,4 @@
-import React, { Component, useEffect } from 'react';
+import { useEffect, memo } from 'react';
 import './App.less';
 import { useLocation, useNavigate, Outlet } from 'react-router-dom';
 import PubSub from 'pubsub-js';
@@ -8,67 +8,47 @@ import Head from '@views/imgs/head.jpg'
 import TopMenu from '@components/top-menu'
 
 const { Search } = Input;
-class NavTop extends Component {
-  constructor(props) {
-    super(props);
-    this.state = {
-      userName: '',
-      intervieweEamil: '',
-      headImg: '',
-      isShowTimer: false,
-    };
-  }
 
-  timerRef = React.createRef();
+const NavTop = () => {
+  const { pathname } = window.location;
 
-  componentDidMount() {
+  return (
-
+    <div className="head-navigator-box">
-    PubSub.subscribe('handleToRender', () => {
+      <div className="head-navigator">
-      this.setState({});
+        <div className="head-navigator-left">
-    });
+          <div
-  }
+            className="head-navigator-logo"
-
+            onClick={() =>
-  render() {
+              (window.location.href = '/question-bank')
-    let { headImg, isShowTimer } = this.state;
+            }>
-    const { pathname } = window.location;
+            <img src={Logo} style={{ height: 50 }} />
-    return (
-      <div className="head-navigator-box">
-        <div className="head-navigator">
-          <div className="head-navigator-left">
-            <div
-              className="head-navigator-logo"
-              onClick={() =>
-                (window.location.href = '/question-bank')
-              }>
-              <img src={Logo} style={{ height: 50 }} />
-            </div>
-            <TopMenu />
           </div>
-          <div className="head-navigator-user-box">
+          <TopMenu />
-            <div className="time-box"></div>
+        </div>
-            {'/question-bank' == pathname && (
+        <div className="head-navigator-user-box">
-              <div className="head-navigator-input-box">
+          <div className="time-box"></div>
-                <Search
+          {'/question-bank' == pathname && (
-                  placeholder="请输入感兴趣的内容～"
+            <div className="head-navigator-input-box">
-                  onSearch={(value) => console.log(value)}
+              <Search
-                  style={{ width: 300, borderRadius: '10px' }}
+                placeholder="请输入感兴趣的内容～"
-                />
+                onSearch={(value) => console.log(value)}
-              </div>
+                style={{ width: 300, borderRadius: '10px' }}
-            )}
-            <div className="head-navigator-bell">
-              {/* <Icon type="bell" /> */}
-            </div>
-            <div className="head-navigator-user-img">
-              <img
-                src={Head}
-                style={{ width: 36, height: 36 }}
               />
             </div>
+          )}
+          <div className="head-navigator-bell">
+            {/* <Icon type="bell" /> */}
+          </div>
+          <div className="head-navigator-user-img">
+            <img
+              src={Head}
+              style={{ width: 36, height: 36 }}
+            />
           </div>
         </div>
       </div>
-    );
+    </div>
-  }
+  )
 }
 
 const App = () => {
@@ -87,4 +67,4 @@ const App = () => {
   )
 }
 
-export default App
+export default memo(App)

src/components/category-list/constant.js

@@ -8,23 +8,23 @@ export const filterDifficulty = [
     },
     {
         id: 1,
-        title: 'T4',
+        title: '初级',
     },
     {
         id: 2,
-        title: 'T5',
+        title: '中级',
     },
     {
         id: 3,
-        title: 'T6',
+        title: '高级',
     },
     {
         id: 4,
-        title: 'T7',
+        title: '资深',
     },
     {
         id: 5,
-        title: 'T8',
+        title: '专家',
     },
 ];
 
@@ -33,6 +33,14 @@ export const apiName = {
      * 获取二级和三级标签
      */
     getCategoryLabelInfo: '/admin/question/category/getCategoryLabelInfo',
+
+    /**
+     * 查询大类下分类
+     */
+    queryCategoryByPrimary: '/category/queryCategoryByPrimary',
+
+    // 根据分类查标签
+    queryLabelByCategoryId: '/label/queryLabelByCategoryId'
 };
 
 export const imgObject = {

src/components/category-list/index.jsx

@@ -1,4 +1,4 @@
-import React, { Component, Fragment } from 'react';
+import React, { Component, Fragment, useState, useEffect } from 'react';
 
 import {
     RightOutlined,
@@ -8,7 +8,7 @@ import {
     CaretUpOutlined,
 } from '@ant-design/icons';
 import req from '@utils/request';
-import { Divider } from 'antd';
+import { Divider, Spin } from 'antd';
 import _ from 'lodash';
 import './index.less';
 import { apiName, imgObject } from './constant';
@@ -30,12 +30,263 @@ export const categoryBackImg = {
 
 const categoryShowCount = 4;
 
-export default class CategoryList extends Component {
+const cacheMap = {}
+
+const CategoryList = ({ primaryCategoryId, categoryList, ...props }) => {
+    const [secondCategoryList, setSecondCategoryList] = useState([])
+    const [currentActive, setCurrentActive] = useState(categoryList[0])
+    const [isPutAway, setIsPutAway] = useState(true)
+    const [loading, setLoading] = useState(false)
+
+    const getLabels = (id) => {
+        return new Promise(resolve => {
+            req({
+                method: 'post',
+                url: apiName.queryLabelByCategoryId,
+                data: { categoryId: id }
+            }).then(res => {
+                if (cacheMap[id]) {
+                    resolve(cacheMap[id])
+                } else {
+                    cacheMap[id] = res.data
+                    resolve(res.data)
+                }
+            })
+        })
+    }
+
+    // 获取大类下分类
+    const getCategoryByPrimary = () => {
+        req({
+            method: 'post',
+            url: apiName.queryCategoryByPrimary,
+            data: { categoryType: 2, parentId: currentActive.id }
+        }).then(async res => {
+            let list = res.data
+            for (let i = 0; i < list.length; i++) {
+                list[i].children = await getLabels(list[i].id)
+            }
+            setSecondCategoryList(_.cloneDeep(list))
+        })
+    }
+
+    useEffect(() => {
+        if (primaryCategoryId) {
+            getCategoryByPrimary()
+        }
+    }, [primaryCategoryId])
+
+
+
+    /**
+         * 切换一级分类
+         * @param {*} item
+         * @returns
+         */
+    const onChangeCategory = (item) => () => {
+        if (currentActive.id === item.id) {
+            return;
+        }
+        setCurrentActive(item)
+        props.onChangeCategory(item);
+    };
+
+    /**
+     * 一级分类模块
+     * @returns
+     */
+    const renderFirstContainer = () => {
+        return (
+            <div className="first-category-list">
+                {categoryList.slice(0, 7).map((categoryModuleItem, categoryModuleIndex) => {
+                    return (
+                        <div
+                            className={`first-category-item ${categoryModuleItem.id === currentActive.id &&
+                                'first-category-item-active'
+                                }`}
+                            key={`first_category_${categoryModuleItem.id}`}
+                            style={{
+                                backgroundImage: `url(${categoryBackImg[categoryModuleIndex]})`,
+                            }}
+                            onClick={onChangeCategory(categoryModuleItem)}>
+                            <div className="first-category-item-title">
+                                {categoryModuleItem.categoryName}
+                            </div>
+                            <div className="first-category-item-count">
+                                {categoryModuleItem.count || 50}道题
+                            </div>
+                        </div>
+                    );
+                })}
+                {categoryList.length > 7 && (
+                    <div className="first-category-more">
+                        更多
+                        <RightOutlined />
+                    </div>
+                )}
+            </div>
+        );
+    };
+
+    /**
+     * 选择标签-支持单选（多选）
+     * @param {*} categoryId 一级分类id
+     * @param {*} secondCategoryIndex 二级分类对象index
+     * @param {*} thirdCategoryIndex 三级标签index
+     * @param {*} active 三级标签当前的选中状态
+     * @returns
+     */
+    const onChangeLabel = (secondCategoryIndex, thirdCategoryIndex, active) => () => {
+        const list = _.cloneDeep(secondCategoryList)
+        _.set(list, [secondCategoryIndex, 'children', thirdCategoryIndex, 'active'], !active)
+        setSecondCategoryList(list)
+    };
+
+    /**
+    * 展开/收起
+    * @param {*} secondCategoryIndex
+    * @returns
+    */
+    const onChangeOpenStatus = (secondCategoryIndex, isOpen) => () => {
+        return
+        let { secondCategoryList } = this.state;
+        _.set(secondCategoryList, [secondCategoryIndex, 'isOpen'], !isOpen);
+        this.setState({
+            secondCategoryList,
+        });
+    };
+
+    /**
+     * 展开/收起
+     */
+    const onChangePutAway = () => {
+        return
+        let { isPutAway } = this.state;
+        this.setState({
+            isPutAway: !isPutAway,
+        });
+    };
+
+    /**
+     * 二级分类模块
+     * @returns
+     */
+    const renderSecondContainer = () => {
+        return (
+            <Spin spinning={loading}>
+                <div className="second-category-list">
+                    {secondCategoryList.map((secondCategoryItem, secondCategoryIndex) => {
+                        return (
+                            <div
+                                style={{
+                                    display:
+                                        secondCategoryIndex >= categoryShowCount && isPutAway
+                                            ? 'none'
+                                            : 'flex',
+                                }}
+                                className="second-category-item"
+                                key={`second_category_${secondCategoryItem.id}`}>
+                                <div className="second-category-item-title">
+                                    {secondCategoryItem.categoryName}：
+                                </div>
+                                {secondCategoryItem?.children?.length > 0 && (
+                                    <div className="second-category-item-box">
+                                        <div
+                                            style={{
+                                                height: secondCategoryItem.isOpen ? 'auto' : 43,
+                                            }}
+                                            className="second-category-item-list"
+                                            id={`id_${secondCategoryIndex}`}>
+                                            {secondCategoryItem.children.map(
+                                                (thirdCategoryItem, thirdCategoryIndex) => {
+                                                    return (
+                                                        <div
+                                                            className={`third-category-item ${thirdCategoryItem.active
+                                                                ? 'third-category-item-active'
+                                                                : ''
+                                                                }`}
+                                                            key={`third_category_${thirdCategoryItem.id}`}
+                                                            onClick={onChangeLabel(
+                                                                secondCategoryIndex,
+                                                                thirdCategoryIndex,
+                                                                (thirdCategoryItem.active || false)
+                                                            )}>
+                                                            {thirdCategoryItem.labelName}·
+                                                            {thirdCategoryItem.subjectCount || 0}
+                                                        </div>
+                                                    );
+                                                }
+                                            )}
+                                        </div>
+                                        <div
+                                            id={`second_id_${secondCategoryIndex}`}
+                                            className="second-category-item-status"
+                                            onClick={onChangeOpenStatus(
+                                                secondCategoryIndex,
+                                                secondCategoryItem.isOpen
+                                            )}>
+                                            <div className="second-category-item-type" style={{ fontSize: 12 }}>
+                                                {secondCategoryItem.isOpen ? '收起' : '展开'}
+                                            </div>
+                                            <div className="second-category-item-icon" style={{ fontSize: 12 }}>
+                                                {secondCategoryItem.isOpen ? (
+                                                    <UpOutlined />
+                                                ) : (
+                                                    <DownOutlined />
+                                                )}
+                                            </div>
+                                        </div>
+                                    </div>
+                                )}
+                            </div>
+                        );
+                    })}
+                    {secondCategoryList?.length >= categoryShowCount && (
+                        <Divider
+                            onClick={onChangePutAway}
+                            dashed
+                            style={{
+                                marginTop: 10,
+                                fontSize: 13,
+                            }}>
+                            {isPutAway ? '展开' : '收起'}
+                            {isPutAway ? (
+                                <CaretDownOutlined style={{ marginLeft: 4 }} />
+                            ) : (
+                                <CaretUpOutlined style={{ marginLeft: 4 }} />
+                            )}
+                        </Divider>
+                    )}
+                </div>
+            </Spin>
+
+        );
+    };
+
+    return (
+        <div className="category-box">
+            <Fragment>{categoryList?.length && renderFirstContainer()}</Fragment>
+            <Fragment>
+                {secondCategoryList?.length > 0 && renderSecondContainer()}
+            </Fragment>
+            {/* {!this.props.isHideSec && (
+                <Fragment>
+                    {secondCategoryList?.length > 0 && this.renderSecondContainer()}
+                </Fragment>
+            )} */}
+        </div>
+    )
+}
+
+export default CategoryList
+
+
+class CategoryList1 extends Component {
     constructor(props) {
         super(props);
         this.state = {
             secondCategoryList: [],
-            currentActive: '',
+            currentActive: null,
             isPutAway: true, // 是否收起 默认收起状态
         };
     }
@@ -49,7 +300,7 @@ export default class CategoryList extends Component {
      */
     initCategoryList() {
         const { categoryList, primaryCategoryId } = this.props;
-        let currentActive = primaryCategoryId ?? categoryList[0].primaryCategoryId;
+        let currentActive = primaryCategoryId ?? categoryList[0];
         this.props.onChangeCategory(currentActive);
         this.getSecondCategoryList(currentActive);
     }
@@ -61,8 +312,8 @@ export default class CategoryList extends Component {
         const { categoryListMap } = this.props;
         // 调用接口返回二级三级数据
         let params = {
-            primaryCategoryId: currentActive,
+            parentId: currentActive.id,
-            subjectTypeList: [4],
+            categoryType: 2,
         };
         req({
             method: 'post',
@@ -210,28 +461,13 @@ export default class CategoryList extends Component {
         });
     };
 
-    render() {
+
-        const { categoryList } = this.props;
-        const { secondCategoryList } = this.state;
-        return (
-            <div className="category-box">
-                <Fragment>{categoryList?.length > 0 && this.renderFirstContainer()}</Fragment>
-                {!this.props.isHideSec && (
-                    <Fragment>
-                        {secondCategoryList?.length > 0 && this.renderSecondContainer()}
-                    </Fragment>
-                )}
-            </div>
-        );
-    }
 
     /**
      * 一级分类模块
      * @returns
      */
     renderFirstContainer = () => {
-        const { categoryList } = this.props;
-        const { currentActive } = this.state;
         return (
             <div className="first-category-list">
                 {categoryList.slice(0, 7).map((categoryModuleItem, categoryModuleIndex) => {
@@ -240,7 +476,7 @@ export default class CategoryList extends Component {
                             className={`first-category-item ${categoryModuleItem.primaryCategoryId === currentActive &&
                                 'first-category-item-active'
                                 }`}
-                            key={`first_category_${categoryModuleItem.primaryCategoryId}`}
+                            key={`first_category_${categoryModuleItem.id}`}
                             style={{
                                 backgroundImage: `url(${categoryBackImg[categoryModuleIndex]})`,
                             }}
@@ -358,5 +594,19 @@ export default class CategoryList extends Component {
             </div>
         );
     };
+    render() {
+        const { categoryList } = this.props;
+        const { secondCategoryList } = this.state;
+        return (
+            <div className="category-box">
+                <Fragment>{categoryList?.length > 0 && this.renderFirstContainer()}</Fragment>
+                {!this.props.isHideSec && (
+                    <Fragment>
+                        {secondCategoryList?.length > 0 && this.renderSecondContainer()}
+                    </Fragment>
+                )}
+            </div>
+        );
+    }
 }
 

src/components/category-list/index.less

@@ -91,16 +91,30 @@
                         font-size: 14px;
                         border: 1px solid rgba(0, 0, 0, 0.04);
                         border-radius: 4px;
+                        // @mixin box-backgroundColor($alpha: 1) {
+                        //     background-color: rgba(60, 110, 238, $alpha) !important;
+                        // }
+
+                        // @mixin box-border($width: 1px, $style: solid, $alpha: 1) {
+                        //     border: $width $style rgba(60, 110, 238, $alpha) !important;
+                        // }
+
+                        // @mixin font-color($alpha: 1) {
+                        //     color: rgba(60, 110, 238, $alpha) !important;
+                        // }
                         &:hover {
-                            @include box-backgroundColor(0.1);
+                            background-color: rgba(60, 110, 238, 0.1);
-                            @include box-border();
+                            border: 1px solid rgba(60, 110, 238, 1);
-                            @include font-color();
+                            color:  rgba(60, 110, 238, 1)
                         }
                     }
                     .third-category-item-active {
-                        @include box-backgroundColor(0.1);
+                        // @include box-backgroundColor(0.1);
-                        @include box-border();
+                        // @include box-border();
-                        @include font-color();
+                        // @include font-color();
+                        background-color: rgba(60, 110, 238, 0.1);
+                        border: 1px solid rgba(60, 110, 238, 1);
+                        color:  rgba(60, 110, 238, 1)
                     }
                 }
                 .second-category-item-status {

src/components/top-menu/index.jsx

@@ -1,6 +1,6 @@
 import { message } from 'antd';
-import React, { Component } from 'react'
+import React, { Component, useState, memo } from 'react'
-import { useLocation } from 'react-router-dom';
+import { useLocation, useNavigate } from 'react-router-dom';
 import './index.less'
 // 顶部tab
 const MENULIST = [
@@ -12,7 +12,7 @@ const MENULIST = [
   {
     key: 'prictiseQuestion',
     title: '练题',
-    route: '/question-bank',
+    route: '/brush-question',
   },
   {
     key: 'practiceQuestions',
@@ -31,66 +31,43 @@ const MENULIST = [
 const mapMenu = {
   '/question-bank': 'questionBank',
 }
-class TopMenu extends Component {
-  constructor(props) {
-    super(props)
-    this.state = {
-      currentKey: 'questionBank',
-    }
-  }
 
-  componentDidMount() {
+const TopMenu = () => {
-    // this.setState({
+
-    //   currentKey: mapMenu[this.props.currentRoute] || '',
+  const [currentKey, setCurrentKey] = useState('questionBank')
-    // })
+  const location = useLocation()
-  }
+  const navigate = useNavigate()
 
   /**
    * 切换item
    * @param {*} item
    * @returns
    */
-  changeMenu = (item) => () => {
+  const changeMenu = (item) => () => {
     if (item.key === "questionBank") {
-      return
+      if (location.pathname === '/question-bank') return
+      navigate('/question-bank')
     } else {
       return message.info("敬请期待")
     }
-
-    // 打开新窗口
-    if (item.isOpenNewWindow) {
-      window.open(item.route)
-      return
-    }
-    this.setState(
-      {
-        currentKey: item.key,
-      },
-      () => {
-        this.props.history.push(item.route)
-      }
-    )
   }
 
-  render() {
+  return (
-    const { currentKey } = this.state
+    <div className="top-menu-list">
-    return (
+      {MENULIST.map((item, index) => {
-      <div className="top-menu-list">
+        return (
-        {MENULIST.map((item, index) => {
+          <div
-          return (
+            className={`top-menu-item ${currentKey === item.key ? 'top-menu-item-active' : ''}`}
-            <div
+            key={item.key + index}
-              className={`top-menu-item ${currentKey === item.key ? 'top-menu-item-active' : ''}`}
+            onClick={changeMenu(item)}
-              key={item.key + index}
+          >
-              onClick={this.changeMenu(item)}
+            <div className="top-menu-text">{item.title}</div>
-            >
+            <div className={`top-menu-line ${currentKey === item.key ? 'top-menu-line-active' : ''}`}></div>
-              <div className="top-menu-text">{item.title}</div>
+          </div>
-              <div className={`top-menu-line ${currentKey === item.key ? 'top-menu-line-active' : ''}`}></div>
+        )
-            </div>
+      })}
-          )
+    </div>
-        })}
+  )
-      </div>
-    )
-  }
 }
 
-export default TopMenu
+export default memo(TopMenu)

src/main.tsx

@@ -1,5 +1,4 @@
 import './main.less'
-
 import React from 'react'
 import ReactDOM from 'react-dom/client'
 import router from '@/router'

src/views/question-bank/index.tsx

@@ -1,5 +1,5 @@
 // import { Component } from 'react';
-import { useState, useEffect } from 'react'
+import { useState, useEffect, memo } from 'react'
 import QuestionList from '@components/question-list';
 import CategoryList from '@components/category-list';
 import ContributionList from './components/contribution-list';
@@ -12,9 +12,8 @@ import './index.less';
 
 const QuestionBank = () => {
 
-
     const [firstCategoryList, setFirstCategoryList] = useState([])
-    const [questionList, setQuestionList] = useState(mockDataList)
+    const [questionList, setQuestionList] = useState([])
     const [isShowSpin, setIsShowSpin] = useState(false)
     const [labelList, setLabelList] = useState<string[]>([]); // 选中的标签列表
     const [difficulty, setDiffculty] = useState(0); //困难度（全部）
@@ -46,30 +45,13 @@ const QuestionBank = () => {
             })
     }
 
-    // 获取大类下分类
-    const getCategoryByPrimary = () => {
-        req({
-            method: 'post',
-            url: apiName.queryCategoryByPrimary,
-            data: { categoryType: 1, parentId: 1 }
-        }).then(res => {
-            console.log(res)
-        })
-    }
-
-    useEffect(() => {
-        if (primaryCategoryId) {
-            getCategoryByPrimary()
-        }
-    }, [primaryCategoryId])
-
     /**
     * 切换一级分类
     * @param {*} e
     */
-    const onChangeCategory = (e: string) => {
+    const onChangeCategory = (item: Record<string, any>) => {
         setLabelList([])
-        setPromaryCategoryId(e)
+        setPromaryCategoryId(item.id)
         setPageIndex(1)
     };
 
@@ -82,11 +64,12 @@ const QuestionBank = () => {
         setLabelList(assembleIds)
         setPromaryCategoryId(primaryCategoryId)
         setPageIndex(1)
-        // this.getInterviewSubjectList();
     };
 
     useEffect(() => {
-        getPrimaryCategoryInfo()
+        if (!primaryCategoryId) {
+            getPrimaryCategoryInfo()
+        }
     }, [])
 
     return (
@@ -99,6 +82,7 @@ const QuestionBank = () => {
                                 onChangeCategory={onChangeCategory}
                                 categoryList={firstCategoryList}
                                 onChangeLabel={onChangeLabel}
+                                primaryCategoryId={primaryCategoryId}
                             />
                         )}
                     </div>
@@ -123,131 +107,4 @@ const QuestionBank = () => {
         </div>
     );
 }
-export default QuestionBank
+export default memo(QuestionBank)
-// class QuestionBank extends Component {
-//     constructor(props) {
-//         super(props);
-//         this.state = {
-//             firstCategoryList: [],
-//             questionList: [],
-//             isShowSpin: false,
-//         };
-//     }
-//     labelList = []; // 选中的标签列表
-//     difficulty = 0; //困难度（全部）
-//     total = 0; // 总条数
-//     pageIndex = 1;
-//     primaryCategoryId = ''; //第一个大类id
-
-//     componentDidMount() {
-//         // this.getPrimaryCategoryInfo();
-//         // console.log(this.props.route);
-//     }
-
-
-
-//     /**
-//      * 获取题目列表
-//      */
-//     getInterviewSubjectList() {
-//         let params = {
-//             pageInfo: {
-//                 pageIndex: this.pageIndex,
-//                 pageSize: 10,
-//             },
-//             difficulty: this.difficulty,
-//             primaryCategoryId: this.primaryCategoryId,
-//             assembleIds: this.labelList,
-//         };
-//         req({
-//             method: 'post',
-//             data: params,
-//             url: apiName.getInterviewSubjectList,
-//         })
-//             .then((res) => {
-//                 if (res.data && res.data?.pageList?.length > 0) {
-//                     this.total = res.data.pageInfo.total;
-//                     this.setState({
-//                         questionList: res.data.pageList,
-//                         isShowSpin: false,
-//                     });
-//                 } else {
-//                     this.total = 0;
-//                     this.setState({
-//                         questionList: [],
-//                         isShowSpin: false,
-//                     });
-//                 }
-//             })
-//             .catch((err) => console.log(err));
-//     }
-
-
-
-//     /**
-//      * 切换一级分类
-//      * @param {*} e
-//      */
-//     onChangeCategory = (e) => {
-//         this.labelList = [];
-//         this.primaryCategoryId = e;
-//         this.pageIndex = 1;
-//         this.getInterviewSubjectList();
-//     };
-
-//     /**
-//      * 筛选列表数据
-//      * @param {*} id
-//      */
-//     handleChangeSelect = (id) => {
-//         this.difficulty = id;
-//         this.pageIndex = 1;
-//         this.getInterviewSubjectList();
-//     };
-
-//     /**
-//      * 分页功能
-//      * @param {*} pageIndex 当前页码
-//      */
-//     onChangePagination = (pageIndex) => {
-//         this.pageIndex = pageIndex;
-//         this.getInterviewSubjectList();
-//     };
-
-//     render() {
-//         const { firstCategoryList, questionList, isShowSpin } = this.state;
-//         return (
-//             <div className="question-bank-box">
-//                 <Spin spinning={isShowSpin}>
-//                     <div className="question-box">
-//                         <div className="category-list-box">
-//                             {firstCategoryList?.length > 0 && (
-//                                 <CategoryList
-//                                     onChangeCategory={this.onChangeCategory}
-//                                     categoryList={firstCategoryList}
-//                                     onChangeLabel={this.onChangeLabel}
-//                                 />
-//                             )}
-//                         </div>
-//                         <div className="question-list-box">
-//                             <QuestionList
-//                                 pageIndex={this.pageIndex}
-//                                 total={this.total}
-//                                 questionList={questionList}
-//                                 handleChangeSelect={this.handleChangeSelect}
-//                                 onChangePagination={this.onChangePagination}
-//                                 difficulty={this.difficulty}
-//                                 primaryCategoryId={this.primaryCategoryId}
-//                                 labelList={this.labelList}
-//                             />
-//                         </div>
-//                     </div>
-//                 </Spin>
-//                 <div className="ranking-box">
-//                     <ContributionList />
-//                     <RankingList />
-//                 </div>
-//             </div>
-//         );
-//     }
-// }

src/views/upload-questions/components/kind-editor/index.jsx

@@ -1,11 +1,19 @@
-import React, { Component } from 'react';
+import React, { Component, useRef } from 'react';
 import './index.less';
 
 import Editor from 'wangeditor';
 
+const defaultValueHead = `<div style='font-size:14px !important;line-height:22px !important;margin-bottom: -15px !important;word-break: break-word  !important;'>`;
+const defaultValueFoot = '</div>';
+
+// const KindEditor = () => {
+//     const menuRef = useRef()
+//     const bodyRef = useRef()
+//     const editor = new Editor()
+
+// }
+
 export default class KindEditor extends Component {
-    defaultValueHead = `<div style='font-size:14px !important;line-height:22px !important;margin-bottom: -15px !important;word-break: break-word  !important;'>`;
-    defaultValueFoot = '</div>';
     editor = Editor;
 
     constructor(props) {

src/views/upload-questions/constant.js

@@ -3,9 +3,9 @@
  */
 export const apiName = {
     /**
-     * 获取一级/二级分类
+     * 获取一级
      */
-    getInterviewCategory: '/admin/question/category/getCategory',
+    queryPrimaryCategory: '/subject/category/queryPrimaryCategory',
 
     /**
      * 获取三级分类标签