''

src/pages/coursegather/detail/AddCourseModal.js

@@ -99,11 +99,14 @@ class AddCourseModal extends React.Component {
       >
         {courseListTotal == 0 && <Empty description={<span className={pageStyle.emptytext}>您还没有创建单课<br />请直接点击“创建专栏”完成创建</span>} />}
         {courseListTotal > 0 &&
-          <Row className={pageStyle.courseListBox}>
+          <Row className={pageStyle.courseListBox} gutter={32}>
             {courseList.map(ele => (
-              <Col span={6} style={{ marginBottom: '10px' }} key={ele.id}>
-                <Checkbox style={{ display: 'flex', alignItems: 'flex-start' }} onChange={() => this.checkedChange(ele.id)} checked={course_ids.indexOf(ele.id) != -1}>
-                  <img className={pageStyle.courseCover} src={imagify(ele.cover)} alt="" />
+              <Col span={12} style={{ marginBottom: '10px' }} key={ele.id}>
+                <Checkbox id="1" style={{ display: 'flex', alignItems: 'flex-start' }} onChange={() => this.checkedChange(ele.id)} checked={course_ids.indexOf(ele.id) != -1}>
+                  <div className={pageStyle.colItem} >
+                    <img className={pageStyle.courseCover} src={ele.cover ? imagify(ele.cover || '') : `${__IMGCDN__}/course/courseDefaultImg.png`} alt="" />
+                    <div className={pageStyle.courseTitle}>{ele.title}</div>
+                  </div>
                 </Checkbox>
               </Col>
             ))}

src/pages/coursegather/detail/AddCourseModal.less

@@ -59,10 +59,22 @@
   text-align: right;
 }
 .courseCover {
-  width: 90px;
-  height: 90px;
+  width: 60px;
+  height: 60px;
   border-radius: 6px;
 }
+.courseTitle {
+  font-size: 16px;
+  text-overflow: -o-ellipsis-lastline;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  display: -webkit-box;
+  -webkit-line-clamp: 5;
+  line-clamp: 5;
+  -webkit-box-orient: vertical;
+  font-size: 14px;
+  line-height: 1.3;
+}
 .active2title {
   font-size: 14px;
   color: #131313;
@@ -72,7 +84,15 @@
   text-align: center;
 }
 .courseListBox {
-  max-height: 300px;
+  max-height: 350px;
   overflow-y: auto;
   padding: 10px 0;
+  .colItem {
+    display: flex;
+    align-items: flex-start;
+    .courseCover {
+      margin-left: 8px;
+      margin-right: 18px;
+    }
+  }
 }
\ No newline at end of file

src/pages/coursegather/detail/CourseBox.js

@@ -84,6 +84,7 @@ class CourseBoxForm extends React.Component {
       singleCourseSubmitting,
       toCreateSingleCourse,
       toEditSingleCourse,
+      cancelEditSingleCourse,
     } = this.props;
     const { getFieldDecorator } = this.props.form;
     const formItemModalLineLayout = {
@@ -142,8 +143,23 @@ class CourseBoxForm extends React.Component {
                             <div>
                               <span className={pageStyle.itemTime}>{item.created_at}</span>
                               <div>
-                                <span className="hreflink" style={{ marginRight: '20px', color: '#2194FF', lineHeight: 1 }}>编辑课件</span>
-                                <span className="hreflink" onClick={() => toEditSingleCourse(item)} style={{ marginRight: '20px', color: '#2194FF', lineHeight: 1 }}>管理课程</span>
+                                <span
+                                  className="hreflink"
+                                  style={{
+                                    marginRight: '16px', color: '#2194FF', lineHeight: 1, whiteSpace: 'nowrap',
+                                  }}
+                                >
+                                    编辑课件
+                                </span>
+                                <span
+                                  className="hreflink"
+                                  onClick={() => toEditSingleCourse(item)}
+                                  style={{
+                                    marginRight: '16px', color: '#2194FF', lineHeight: 1, whiteSpace: 'nowrap',
+                                  }}
+                                >
+                                  管理课程
+                                </span>
                                 <Dropdown
                                   className={pageStyle.editStatus}
                                   overlay={
@@ -158,7 +174,14 @@ class CourseBoxForm extends React.Component {
                                   }
                                   trigger={['click']}
                                 >
-                                  <span className="hreflink" style={{ marginRight: '20px', color: '#2194FF', lineHeight: 1 }}>更多</span>
+                                  <span
+                                    className="hreflink"
+                                    style={{
+                                      marginRight: '16px', color: '#2194FF', lineHeight: 1, whiteSpace: 'nowrap',
+                                  }}
+                                  >
+                                    更多
+                                  </span>
                                 </Dropdown>
                               </div>
                             </div>
@@ -240,7 +263,7 @@ class CourseBoxForm extends React.Component {
             <FormItem {...formItemModalLineLayout}>
               <Button type="primary" htmlType="submit" style={{ marginRight: 20 }} loading={singleCourseSubmitting}>{singleCourseSubmitting ? '保存中...' : '保存'}</Button>
               <Button type="primary" onClick={toAddCourseWare} style={{ marginRight: 20 }}>上传课件</Button>
-              <Button style={{ marginRight: 20 }}>取消</Button>
+              <Button style={{ marginRight: 20 }} onClick={cancelEditSingleCourse}>取消</Button>
             </FormItem>
           </Form>
         }

src/pages/coursegather/detail/index.js

@@ -633,6 +633,23 @@ class StaticCenter extends React.Component {
       },
     });
   }
+  cancelEditSingleCourse = () => {
+    const { dispatch } = this.props;
+    dispatch({
+      type: 'coursegatherdetail/updateState',
+      payload: {
+        isEditSingleCourse: false,
+        editSingleCourseId: 0,
+        editSingleCourseInfo: {
+          id: 0,
+          title: '',
+          start_time: null,
+          cover: '',
+          content: '',
+        },
+      },
+    });
+  }
   toEditSingleCourse = (item) => {
     const { dispatch } = this.props;
     dispatch({
@@ -738,6 +755,7 @@ class StaticCenter extends React.Component {
           singleCourseSubmitting={saveSingleCourseSubmitting}
           toCreateSingleCourse={this.toCreateSingleCourse}
           toEditSingleCourse={this.toEditSingleCourse}
+          cancelEditSingleCourse={this.cancelEditSingleCourse}
         />}
         {tabIndex == 2 && <StaticBox
           staticTotalInfo={staticTotalInfo}

src/pages/coursegather/index/AddCourseModal.less

@@ -59,8 +59,8 @@
   text-align: right;
 }
 .courseCover {
-  width: 90px;
-  height: 90px;
+  width: 60px;
+  height: 60px;
   border-radius: 6px;
 }
 .courseTitle {
@@ -72,7 +72,7 @@
   -webkit-line-clamp: 5;
   line-clamp: 5;
   -webkit-box-orient: vertical;
-  font-size: 16px;
+  font-size: 14px;
   line-height: 1.3;
 }
 .active2title {
@@ -84,7 +84,7 @@
   text-align: center;
 }
 .courseListBox {
-  max-height: 300px;
+  max-height: 350px;
   overflow-y: auto;
   padding: 10px 0;
   .colItem {