feat:处理创建培训计划的接口

1f8e9e38 · zhangleyuan · da09f281 · 1f8e9e38 · 1f8e9e38 · 1f8e9e38
Commit 1f8e9e38 authored Feb 28, 2021 by zhangleyuan
11 changed files
--- a/src/data-source/course/request-api.ts
+++ b/src/data-source/course/request-api.ts
 /*
 * @Author: wufan
 * @Date: 2020-12-12 11:57:10
- * @LastEditors: wufan
+ * @LastEditors: zhangleyuan
- * @LastEditTime: 2021-01-06 20:18:16
+ * @LastEditTime: 2021-02-28 13:47:38
 * @Description: Description
 * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
 */
@@ -52,6 +52,11 @@ export function turnOnOrOffLiveCloudCourse(params: object) {
 export function delLiveCloudCourse(params: object) {
  return Service.Hades("public/courseCloud/delLiveCloudCourse", params);
 }
+//该接口主要用于培训计划关联直播课的接口（会筛选掉已关联的直播课）
+export function getLiveCloudCourseBasePage(params: object) {
+  return Service.Hades("public/courseCloud/getLiveCloudCourseBasePage", params);
+}
 //视频课相关接口
 export function changeVideoShelfState(params: object) {
  return Service.Hades("public/hades/changeVideoShelfState", params);
@@ -77,3 +82,6 @@ export function videoSchedulePage(params: object) {
 export function videoWatchInfo(params: object) {
  return Service.Hades("public/hades/videoWatchInfo", params);
 }
+export function videoScheduleBasePage(params: object) {
+  return Service.Hades("public/hades/videoScheduleBasePage", params);
+}
\ No newline at end of file
--- a/src/data-source/plan/request-apis.ts
+++ b/src/data-source/plan/request-apis.ts
@@ -2,7 +2,7 @@
 * @Author: zhangleyuan
 * @Date: 2021-02-21 16:08:38
 * @LastEditors: zhangleyuan
- * @LastEditTime: 2021-02-21 16:13:45
+ * @LastEditTime: 2021-02-28 17:51:46
 * @Description: 描述一下
 * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
 */
@@ -11,3 +11,6 @@ import Service from "@/common/js/service";
 export function getTrainingPlanPage(params: object) {
  return Service.Hades("public/hades/getTrainingPlanPage", params);
 }
+export function createTrainingPlan(params: object) {
+  return Service.Hades("public/hades/createTrainingPlan", params);
+}
--- a/src/domains/course-domain/CourseService.ts
+++ b/src/domains/course-domain/CourseService.ts
 /*
 * @Author: wufan
 * @Date: 2020-11-25 18:25:02
- * @LastEditors: wufan
+ * @LastEditors: zhangleyuan
- * @LastEditTime: 2021-01-06 20:17:40
+ * @LastEditTime: 2021-02-28 15:15:37
 * @Description: Description
 * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
 */
 import {
  fetchLecturerData, fetchUserData, exportStudentCourseData, exportPlayBackCourseData, fetchPlaybackList, createLiveCloudCourse, getLiveCloudCoursePage,
-  getLiveCloudCourseDetail, updateLiveCloudCourse, turnOnOrOffLiveCloudCourse, delLiveCloudCourse, changeVideoShelfState, createVideoSchedule, delVideoSchedule, editVideoSchedule, userWatchInfo, videoSchedulePage, videoScheduleDetail, videoWatchInfo, getQrcode
+  getLiveCloudCourseDetail, updateLiveCloudCourse, turnOnOrOffLiveCloudCourse, delLiveCloudCourse, changeVideoShelfState, createVideoSchedule, delVideoSchedule, 
+  editVideoSchedule, userWatchInfo, videoSchedulePage, videoScheduleDetail, videoWatchInfo, getQrcode,getLiveCloudCourseBasePage,videoScheduleBasePage
 } from '@/data-source/course/request-api';
 export default class courseService {
@@ -84,4 +85,10 @@ export default class courseService {
  static videoWatchInfo(params: any) {
    return videoWatchInfo(params);
  }
+  static getLiveCloudCourseBasePage(params: any){
+    return getLiveCloudCourseBasePage(params);
+  }
+  static videoScheduleBasePage(params: any){
+    return videoScheduleBasePage(params);
+  }
 }
\ No newline at end of file
--- a/src/domains/plan-domain/planService.ts
+++ b/src/domains/plan-domain/planService.ts
@@ -2,14 +2,17 @@
 * @Author: zhangleyuan
 * @Date: 2021-02-21 16:15:38
 * @LastEditors: zhangleyuan
- * @LastEditTime: 2021-02-21 16:20:15
+ * @LastEditTime: 2021-02-28 17:52:28
 * @Description: 描述一下
 * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
 */
-import {getTrainingPlanPage} from '@/data-source/plan/request-apis';
+import {getTrainingPlanPage,createTrainingPlan} from '@/data-source/plan/request-apis';
 export default class PlanService {
    // 获取员工列表 
    static getTrainingPlanPage(params: any) {
      return getTrainingPlanPage(params);
    }
+    static createTrainingPlan(params: any) {
+      return createTrainingPlan(params);
+    } 
 }
\ No newline at end of file
--- a/src/modules/plan-manage/AddPlan.jsx
+++ b/src/modules/plan-manage/AddPlan.jsx
@@ -2,17 +2,19 @@
 * @Author: zhangleyuan
 * @Date: 2021-02-20 16:13:39
 * @LastEditors: zhangleyuan
- * @LastEditTime: 2021-02-25 17:49:09
+ * @LastEditTime: 2021-02-28 19:05:50
 * @Description: 描述一下
 * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
 */
 import React, { useEffect, useState } from "react";
-import { Button, message, Modal } from 'antd';
+import { Button, message, Modal} from 'antd';
 import ShowTips from "@/components/ShowTips";
 import Breadcrumbs from "@/components/Breadcrumbs";
 import BasicInfo from './components/BasicInfo';
 import TrainingTask from './components/TrainingTask'
+import PlanService from '@/domains/plan-domain/planService'
+import User from '@/common/js/user';
+import _ from "underscore";
 import './AddPlan.less'
 const DEFAULT_BASIC_DATA = {
    planName:"",
@@ -25,18 +27,47 @@ const DEFAULT_BASIC_DATA = {
 }
 function AddPlan() {
    const [basicData,setBasicData] = useState(DEFAULT_BASIC_DATA);
+    const [taskList,setTaskList] = useState([]);
    function handleChangeBasicInfo(field, value){
-        console.log('field',value);
        setBasicData( {
            ...basicData,
            [field]: value,
+        })
    }
-    )
+    function handleChangeTaskInfo(value){
+        setTaskList(value)
+    }
+    function submitInfo(){
+        const {planName,enableState,selectOperatorList,instro,operateType,percentCompleteLive,percentCompleteVideo} = basicData;
+        if(!planName){
+            message.warning('请输入的培训计划名称');
+           return;
+        }
+        if(taskList.length === 0){
+            message.warning('请输入培训计划内容');
+            return;
+        }
+        const params = {
+            createId:User.getStoreUserId(),
+            enableState,
+            operateIds:_.pluck(selectOperatorList,'id'),
+            operateType,
+            percentCompleteLive,
+            percentCompleteVideo,
+            planName,
+            scheduleMediaRequests:[],
+            storeId:User.getStoreId(),
+            trainingTaskList:taskList
+        } 
+        PlanService.createTrainingPlan(params).then((res) => {
+        });
    }
  return (
    <div className="page add-plan-page">   
        <Breadcrumbs
@@ -56,13 +87,13 @@ function AddPlan() {
                </div>
                <div className="basic-info__wrap">
                    <div className="title">培训任务</div>
-                    <TrainingTask/>
+                    <TrainingTask onChange={handleChangeTaskInfo}/>
                </div>
            </div> 
        </div>
        <div className="footer">
            <Button>取消</Button>
-            <Button type="primary">保存</Button>
+            <Button type="primary" onClick={submitInfo}>保存</Button>
        </div>
    </div>    
  )

--- a/src/modules/plan-manage/PlanPage.jsx
+++ b/src/modules/plan-manage/PlanPage.jsx
@@ -2,7 +2,7 @@
 * @Author: zhangleyuan
 * @Date: 2021-02-20 16:13:39
 * @LastEditors: zhangleyuan
- * @LastEditTime: 2021-02-21 17:26:00
+ * @LastEditTime: 2021-02-28 19:37:07
 * @Description: 描述一下
 * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
 */
@@ -13,27 +13,27 @@ import PlanList from './components/PlanList';
 import PlanService from "@/domains/plan-domain/planService";
 function PlanPage() {
-  const [planListData, setPlanListData] = useState([
+  const [planListData, setPlanListData] = useState([]);
-    {
-      name:'计划名称'
-    },
-    {
-      name:'计划名称'
-    }
-  ]);
  const [query,setQuery] = useState({
    current:1,
-    size:10
+    size:10,
  });
-  const [totalCount,setTotalCount] = useState(0)
+  useEffect(() => {
-  function handleFetchPlanList(_query){
+    handleFetchPlanList();
+  }, [query]);
+  const [totalCount,setTotalCount] = useState(0);
+  function queryChange(){
    const params = {
      ...query,
      ..._query,
    };
    setQuery(params);
-    console.log(params);
+  }
+  function handleFetchPlanList(_query){
+    const params = {
+      ...query,
+      ..._query,
+    };
    //动态获取计划列表
    PlanService.getTrainingPlanPage(params).then((res) => {
      const { result: { records = [], total } } = res;
@@ -51,7 +51,7 @@ function PlanPage() {
            planListData={planListData}
            query={query}
            totalCount={totalCount}
-            onChange={handleFetchPlanList}
+            onChange={queryChange}
          />
        </div>
      </div>

--- a/src/modules/plan-manage/components/PlanList.jsx
+++ b/src/modules/plan-manage/components/PlanList.jsx
@@ -2,7 +2,7 @@
 * @Author: zhangleyuan
 * @Date: 2021-02-20 16:46:46
 * @LastEditors: zhangleyuan
- * @LastEditTime: 2021-02-21 15:46:25
+ * @LastEditTime: 2021-02-28 19:39:39
 * @Description: 描述一下
 * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
 */
@@ -26,20 +26,20 @@ function PlanList(props) {
                render: (val, record) => {
                    return (
                        <div className="plan__name">
-                        培训计划名称培训计划名称
+                            {val}
                        </div>
                    )
                }
            },
            {
                title: '课程总数量',
-                key: 'courseNumber',
+                key: 'courseNum',
-                dataIndex: 'courseNumber',
+                dataIndex: 'courseNum',
                width: '10%',
                render: (val, record) => {
                return (
                    <div className="course-number">
-                        20
+                        {val}
                    </div>
                )
                }

--- a/src/modules/plan-manage/components/PlanOpt.jsx
+++ b/src/modules/plan-manage/components/PlanOpt.jsx
@@ -2,7 +2,7 @@
 * @Author: zhangleyuan
 * @Date: 2021-02-20 16:45:51
 * @LastEditors: zhangleyuan
- * @LastEditTime: 2021-02-22 13:49:41
+ * @LastEditTime: 2021-02-28 15:41:33
 * @Description: 描述一下
 * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
 */
@@ -12,11 +12,17 @@ import { withRouter } from 'react-router-dom';
 import './PlanOpt.less';
 function PlanOpt() {
+  function  handleCreatePlan(){
+    window.RCHistory.push({
+      pathname: '/create-plan?type=add',
+    })
+  }
  return (
    <div className="plan-opt">
      <Button
        type="primary"
        className="mr12"
+        onClick={handleCreatePlan}
      >新建培训计划</Button>
    </div>
  );

--- a/src/modules/plan-manage/components/TrainingTask.jsx
+++ b/src/modules/plan-manage/components/TrainingTask.jsx
@@ -2,15 +2,16 @@
 * @Author: zhangleyuan
 * @Date: 2021-02-20 16:45:51
 * @LastEditors: zhangleyuan
- * @LastEditTime: 2021-02-25 13:42:07
+ * @LastEditTime: 2021-02-28 17:49:30
 * @Description: 描述一下
 * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
 */
 import React from 'react';
 import { Table ,Button,Input,Form} from 'antd';
-import { sortableContainer, sortableElement, sortableHandle } from 'react-sortable-hoc';
+import { sortableContainer, sortableElement, sortableHandle} from 'react-sortable-hoc';
 import { MenuOutlined } from '@ant-design/icons';
 import arrayMove from 'array-move';
+import RelatedCourseModal from '../modal/relatedCourseModal'
 import { withRouter } from 'react-router-dom';
 import './TrainingTask.less';
@@ -90,6 +91,8 @@ class TrainingTask extends React.Component {
    super(props);
    this.state = {
      dataSource: data,
+      selectedTaskIndex:0,
+      relatedCourseModalVisible:false
    };
  }
  parseTaskColumns = ()=>{
@@ -152,9 +155,7 @@ class TrainingTask extends React.Component {
        render: (val, record) => {
          return (
              <div>
-                {record.type==='text'?
+                {record.type==='input'?
-                <span>{val}</span>
-                :
                  <Form>
                  <Form.Item  
                  validateTrigger={['onChange', 'onBlur']}
@@ -166,7 +167,10 @@ class TrainingTask extends React.Component {
                    },
                  ]}>
                    <Input defaultValue={record.courseName} style={{ width: 300 }} placeholder="请输入任务名称（40字以内）"  maxLength={40} onChange={(e) => { this.handleRenameCourseName(e,record)}} onBlur={(e)=>{this.handleCourseNameBlur(e,record)}}/></Form.Item>
-                  </Form>}
+                    </Form>
+                  :
+                  <span>{record.courseName}</span>
+                }
              </div>
          )
        }
@@ -239,13 +243,14 @@ class TrainingTask extends React.Component {
    const { value } = e.target;
    const { dataSource } = this.state;
    record.taskName = value;
+    this.props.onChange(dataSource);
  }
  handleTaskNameBlur = (e,record)=>{
    const { value } = e.target;
    const {dataSource}= this.state; 
    if(value){
      record.type="text";
-      this.setState(dataSource);
+      this.setState({dataSource});
    } 
  }
@@ -253,6 +258,7 @@ class TrainingTask extends React.Component {
    const { value } = e.target;
    const { dataSource } = this.state;
    record.courseName = value;
+    this.props.onChange(this.state.dataSource);
  }
  handleCourseNameBlur = (e,record)=>{
@@ -260,14 +266,14 @@ class TrainingTask extends React.Component {
    const {dataSource}= this.state;
    if(value){
      record.type="text";
-      this.setState(dataSource);
+      this.setState({dataSource});
    } 
  }
  handleDeleteTask = (index)=>{
    const {dataSource}= this.state;
    const newData=[...dataSource];
    newData.splice(index,1);
-    this.setState({dataSource:newData});
+    this.setState({dataSource:newData},()=>{this.props.onChange(this.state.dataSource);});
  }
  handleDeleteCourse = (parentIndex,index)=>{
    const {dataSource}= this.state;
@@ -275,11 +281,37 @@ class TrainingTask extends React.Component {
    const selectData = [...newData[parentIndex].courserList]
    selectData.splice(index,1)
    newData[parentIndex].courserList= selectData;
-    this.setState({dataSource:newData});
+    this.setState({dataSource:newData},()=>{this.props.onChange(this.state.dataSource);});
+  }
+  showRelatedCourseModal = (index)=>{
+    this.setState({
+      selectedTaskIndex:index,
+      relatedCourseModalVisible:true
+    })
  }
+  closeRelatedCourseModal = (index)=>{
+    this.setState({
+      relatedCourseModalVisible:false
+    })
+  }
+  confirmSelectCourse = (selectList) =>{
+    const {dataSource,selectedTaskIndex}= this.state;
+    const newData=[...dataSource];
+    const selectData = [...newData[selectedTaskIndex].courserList]
+    const _selectData =[...selectData,...selectList];
+    newData[selectedTaskIndex].courserList= _selectData;
+    this.setState({
+      relatedCourseModalVisible:false,
+      dataSource:newData
+    },()=>{
+      this.props.onChange(dataSource);
+    })
+  }
  render() {
-    const { dataSource } = this.state;
+    const { dataSource,selectedTaskIndex,relatedCourseModalVisible} = this.state;
    return (
      <div  className="training-task">
        <Table
@@ -302,10 +334,10 @@ class TrainingTask extends React.Component {
                          //   },
                          // }}
                        />
-                        <div><Button><span>+</span><span>关联课程</span></Button></div>
+                        <div><Button onClick={()=>{this.showRelatedCourseModal(index)}}><span>+</span><span>关联课程</span></Button></div>
                  </div>
            }else{
-              return <div><Button><span>+</span><span>关联课程</span></Button></div>;
+              return <div><Button onClick={()=>{this.showRelatedCourseModal(index)}}><span>+</span><span>关联课程</span></Button></div>;
            }
          }}
          // components={{
@@ -316,8 +348,18 @@ class TrainingTask extends React.Component {
          // }}
        />
        <div><Button onClick={()=>this.addTask()}><span>+</span><span>添加任务</span></Button></div>
-      </div>
+        { relatedCourseModalVisible &&
+          <RelatedCourseModal
+            selectedTaskIndex={selectedTaskIndex}
+            data={dataSource}
+            visible={relatedCourseModalVisible}
+            onClose={this.closeRelatedCourseModal}
+            onSelect={this.confirmSelectCourse}
+          />
+        }
+      </div>
    );
  }
 }

--- a/src/modules/plan-manage/modal/relatedCourseModal.jsx
+++ b/src/modules/plan-manage/modal/relatedCourseModal.jsx
--- a/src/modules/plan-manage/modal/relatedCourseModal.less
+++ b/src/modules/plan-manage/modal/relatedCourseModal.less