add selector

public/react/src/constants/index.js

@@ -4,7 +4,7 @@
  * @Github: 
  * @Date: 2019-11-20 23:10:48
  * @LastEditors  : tangjiang
- * @LastEditTime : 2019-12-30 09:19:52
+ * @LastEditTime : 2019-12-30 14:44:45
  */
 const CONST = {
   jcLabel: {
@@ -15,7 +15,7 @@ const CONST = {
     category: '课程',
     openOrNot: '公开程序',
     timeLimit: '时间限制',
-    // knowledge: '知识点'
+    knowledge: '知识点'
   },
   fontSetting: {
     title: '代码格式',

public/react/src/modules/developer/components/knowledge/index.js

@@ -4,12 +4,14 @@
  * @Github: 
  * @Date: 2019-12-30 13:51:19
  * @LastEditors  : tangjiang
- * @LastEditTime : 2019-12-30 14:28:17
+ * @LastEditTime : 2019-12-30 16:54:30
  */
 import './index.scss';
 import React, { useState } from 'react';
 import { Select } from 'antd';
 
+const { Option } = Select;
+
 function KnowLedge (props) {
 
   const {
@@ -23,8 +25,11 @@ function KnowLedge (props) {
   const [selectValue, setSelectValue] = useState(values);
 
   // 渲染下拉选项
-  const renderOptions = () => {
-
+  const renderOptions = (options = []) => {
+    console.log('下拉选择: ', options);
+    return options.map((opt, i) => (
+      <Option key={`opt_${i}`} value={opt}>{opt}</Option>
+    ));
   }
   const handleSelectChange = (value) => {
     console.log(value);
@@ -34,9 +39,12 @@ function KnowLedge (props) {
   const renderSelect = (options, values) => {
     return (
       <Select
+        mode="multiple"
         placeholder="请选择"
         style={{ width: '100%' }}
         onChange={handleSelectChange}
+        autoClearSearchValue={true}
+        maxTagCount={0}
       >
         {renderOptions(options)}
       </Select>

public/react/src/modules/developer/newOrEditTask/leftpane/editorTab/index.js

@@ -4,7 +4,7 @@
  * @Github: 
  * @Date: 2019-11-20 10:35:40
  * @LastEditors  : tangjiang
- * @LastEditTime : 2019-12-30 11:05:14
+ * @LastEditTime : 2019-12-30 16:42:36
  */
 import './index.scss';
 // import 'katex/dist/katex.css';
@@ -18,6 +18,7 @@ import CONST from '../../../../../constants';
 import { toStore } from 'educoder'; // 保存和读取store值
 // import Wrapper from '../../../../../common/reactQuill';
 import QuillForEditor from '../../../../../common/quillForEditor';
+import KnowLedge from '../../../components/knowledge';
 const scrollIntoView = require('scroll-into-view');
 const {jcLabel} = CONST;
 const FormItem = Form.Item;
@@ -59,7 +60,8 @@ class EditTab extends React.Component {
       scrollHeight: 0, // 滚动元素的高度
       top: 500,
       bottom: 20,
-      offsetTop: 0
+      offsetTop: 0,
+      knowledges: ['HTML', 'CSS', 'JS', 'REACT']
     }
   }
 
@@ -131,8 +133,21 @@ class EditTab extends React.Component {
   }
   // 改变分类
   handleChangeCategory = (value) => {
-    console.log(value);
-    // this.props.validateOjCategory(value);
+    // 课程下拉值变化时， 同步更新知识点
+    const { courseQuestions } = this.props;
+    courseQuestions.forEach(item => {
+      if (value[0] && item.id === value[0]) {
+        item.sub_disciplines && item.sub_disciplines.forEach(c => {
+          if (value[1] && c.id === value[1]) {
+            // tempArr = c.tag_disciplines || [];
+            console.log('+++++', c.tag_disciplines);
+            this.setState({
+              knowledges: c.tag_disciplines || []
+            });
+          }
+        });
+      }
+    });
   }
   // 改变公开程序
   handleChangeOpenOrNot = (value) => {
@@ -154,6 +169,7 @@ class EditTab extends React.Component {
       openTestCodeIndex = [],
       courseQuestions
     } = this.props;
+    const {knowledges} = this.state;
     // 表单label
     const myLabel = (name, subTitle) => {
       if (subTitle) {
@@ -259,8 +275,8 @@ class EditTab extends React.Component {
           obj.value = item.id;
           obj.label = item.name;
           // 当item下还有子元素时，递归调用
-          if (item.sub_disciplines || item.tag_disciplines) {
-            arrs = item.sub_disciplines || item.tag_disciplines;
+          if (item.sub_disciplines) {
+            arrs = item.sub_disciplines;
             obj.children = [];
             loop(arrs, obj.children);
           }
@@ -297,7 +313,6 @@ class EditTab extends React.Component {
       return (
         <Cascader 
           options={tempArr}
-          value={[1,1,1]}
           expandTrigger="hover"
           onChange={this.handleChangeCategory}
         />
@@ -337,10 +352,16 @@ class EditTab extends React.Component {
             { renderCourseQuestion(courseQuestions)}
           </FormItem>
 
-          <FormItem>
-            
+          <FormItem
+            colon={ false }
+            className='input_area flex_100'
+            label={<span>{myLabel(jcLabel['knowledge'])}</span>}
+          >
+            <KnowLedge 
+              options={knowledges}
+            />
           </FormItem>
-
+          
           <FormItem 
             className={`input_area flex_50 flex_50_left`}
             label={<span>{myLabel(jcLabel['timeLimit'], '程序允许时间限制时长，单位：秒')}</span>}