feat:处理失效课程列表

src/modules/plan-manage/AddPlan.jsx

@@ -2,7 +2,7 @@
  * @Author: zhangleyuan
  * @Author: zhangleyuan
  * @Date: 2021-02-20 16:13:39
  * @Date: 2021-02-20 16:13:39
  * @LastEditors: zhangleyuan
  * @LastEditors: zhangleyuan
- * @LastEditTime: 2021-03-03 10:29:13
+ * @LastEditTime: 2021-03-08 18:19:14
  * @Description: 描述一下
  * @Description: 描述一下
  * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
  * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
  */
  */
@@ -11,7 +11,8 @@ import { Button, message, Modal} from 'antd';
 import ShowTips from "@/components/ShowTips";
 import ShowTips from "@/components/ShowTips";
 import Breadcrumbs from "@/components/Breadcrumbs";
 import Breadcrumbs from "@/components/Breadcrumbs";
 import BasicInfo from './components/BasicInfo';
 import BasicInfo from './components/BasicInfo';
-import TrainingTask from './components/TrainingTask'
+import TrainingTask from './components/TrainingTask';
+import ExpiredCourseList from './components/ExpiredCourseList';
 import PlanService from '@/domains/plan-domain/planService'
 import PlanService from '@/domains/plan-domain/planService'
 import User from '@/common/js/user';
 import User from '@/common/js/user';
 import _ from "underscore";
 import _ from "underscore";
@@ -219,6 +220,12 @@ function AddPlan() {
                         <TrainingTask data={taskList} onChange={handleChangeTaskInfo} />
                         <TrainingTask data={taskList} onChange={handleChangeTaskInfo} />
                     }
                     }
                 </div>
                 </div>
+                { type==='edit' &&
+                    <div className="expired-info__wrap">
+                        <div className="title">失效课程</div>
+                        <ExpiredCourseList />
+                    </div>
+                }
             </div> 
             </div> 
         </div>
         </div>
         <div className="footer">
         <div className="footer">

src/modules/plan-manage/AddPlan.less

@@ -2,15 +2,18 @@
     position:relative !important;
     position:relative !important;
     .box {
     .box {
       margin-bottom: 66px !important;
       margin-bottom: 66px !important;
-    }
-    .add-plan-page__form {
-      margin-top: 16px;
-      .title {
-        font-size: 16px;
-        color: #333;
-        font-weight: 500;
-        line-height: 22px;
-        margin-bottom:8px;
+      .add-plan-page__form {
+        margin-top: 16px;
+        .title {
+          font-size: 16px;
+          color: #333;
+          font-weight: 500;
+          line-height: 22px;
+          margin-bottom:8px;
+        }
+      }
+      .expired-info__wrap{
+        margin-top:16px;
       }
       }
     }
     }
     .footer {
     .footer {

src/modules/plan-manage/components/ExpiredCourseList.jsx

+import React from 'react';
+import { Button } from 'antd';
+import { withRouter } from 'react-router-dom';
+import User from '@/common/js/user';
+import './ExpiredCourseList.less';
+
+
+function ExpiredCourseList() {
+ 
+  return (
+    <div className="expired-course-list">
+        <div className="course-item">
+            <div className="course-left">
+                <div className="course-status">
+                    未成功开课
+                </div>
+                <div className="course-info">
+                    <div className="course-type">
+                        <span>直播课</span>
+                    </div>
+                    <div className="course-instro">
+                        <div className="course-name">
+                            课程名称最多四十个字课程名称最多四十个字课程名称最多四十个字课程名称最多四十个字
+                        </div>
+                        <div className="task-name">
+                            培训名称最多二十个字培训名称最多二十个字
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div className="course-time">
+                上课时间：47238095327
+            </div>
+        </div>
+    </div>
+  );
+}
+export default withRouter(ExpiredCourseList)

src/modules/plan-manage/components/ExpiredCourseList.less

+.expired-course-list{
+    margin:18px 10px 16px;
+    .course-item{
+        display:flex;
+        padding:16px 0;
+        border-bottom:1px solid #E8E8E8;
+        justify-content: space-between;
+        .course-left{
+            display:flex;
+            .course-status{
+                color:#999999;
+                font-size:14px;
+            }
+            .course-info{
+                display:flex;
+
+            }
+        }
+    }
+}
\ No newline at end of file