bug修改

src/models/onlineclasses.js

@@ -60,6 +60,7 @@ export default {
     },
     commentListTotal: 0,
     coursewareSubmitting: false,
+    singleTabIndex: 2,
   },
   subscriptions: {
     setup({ dispatch, history }) {  // eslint-disable-line
@@ -310,7 +311,7 @@ export default {
     * findCourse({ payload }, { call, put, select }) {
       const { sid } = yield select(state => state.webapp);
       const { id } = payload;
-      const { addCourseObj } = yield select(state => state.onlineclasses);
+      const { addCourseObj, singleClassTab } = yield select(state => state.onlineclasses);
       const data = yield call(onlineAjax.findCourse, {
         id,
         type: 1,
@@ -320,6 +321,7 @@ export default {
         yield put({
           type: 'updateState',
           payload: {
+            singleTabIndex: singleClassTab || 2,
             addCourseObj: {
               id: data.data.id,
               title: data.data.title,
@@ -554,8 +556,32 @@ export default {
       }
     },
     * goEditCourse({ payload }, { call, put, select }) {
-      const { id } = payload;
+      const { id, type } = payload;
+      yield put({
+        type: 'updateState',
+        payload: {
+          singleClassTab: 2,
+        },
+      });
+      yield put(routerRedux.push(`/sjd/singleclass/detail/${id}`));
+      // yield delay(1000);
+    },
+    * goEditCourseStatic({ payload }, { call, put, select }) {
+      const { id, type } = payload;
+      yield put({
+        type: 'updateState',
+        payload: {
+          singleClassTab: 1,
+        },
+      });
       yield put(routerRedux.push(`/sjd/singleclass/detail/${id}`));
+      // yield put({
+      //   type: 'findCourse',
+      //   payload: {
+      //     id,
+      //   },
+      // });
+      // yield delay(1000);
     },
     * queryimagesignature({ payload }, { call, put, select }) {
       const { userInfo, sid } = yield select(state => state.webapp);
@@ -914,6 +940,7 @@ export default {
           },
           commentListTotal: 0,
           coursewareSubmitting: false,
+          singleTabIndex: 2,
         },
       });
     },

src/pages/coursegather/detail/CourseDetail.js

@@ -262,7 +262,7 @@ class CourseDetailForm extends React.Component {
     );
     return (
       <div className={pageStyle.container}>
-        <Form hideRequiredMark className={pageStyle.modalform} labelAlign="left" onSubmit={this.save}>
+        <Form className={pageStyle.modalform} labelAlign="left" onSubmit={this.save}>
           <FormItem {...formItemModalLineLayout} label="封面" className={pageStyle.imgFormItem}>
             {
               addCourseObj.cover ?
@@ -312,7 +312,6 @@ class CourseDetailForm extends React.Component {
             {getFieldDecorator('remark', {
               initialValue: addCourseObj.remark,
             })(<Input style={{ width: 424, marginRight: 30 }} placeholder="请输入课程简述" />)}
-            <span className="ant-form-text">分享课程给好友时，作为描述信息在标题下方显示</span>
           </FormItem>
           <FormItem {...formItemModalLineLayout} label="学习人数">
             {getFieldDecorator('study_count', {
@@ -325,7 +324,7 @@ class CourseDetailForm extends React.Component {
                 },
               ],
             })(<InputNumber max={999999} style={{ width: 424, marginRight: 30 }} placeholder="请输入学习人数" />)}
-            <span style={{ marginLeft: 0 }} className="ant-form-text">设置学习人数基数，让学员更有东西学习喔</span>
+            <span style={{ marginLeft: 0 }} className="ant-form-text">设置学习人数基数，让学员更有兴趣学习喔</span>
           </FormItem>
           <FormItem {...formItemModalLineLayout} label="课程类型">
             <div className={pageStyle.courseType}>{addCourseObj.is_encrypt == 1 ? `加密 密码:${addCourseObj.password}` : '未加密'}</div>

src/pages/coursegather/index/AddCourseModal.js

@@ -74,7 +74,7 @@ class AddCourseModalForm extends React.Component {
       save({
         title,
         charge_type,
-        is_encrypt: is_encrypt && is_encrypt === true ? 1 : 2,
+        is_encrypt,
         password,
         course_ids: course_ids.join(','),
       }, () => {
@@ -188,15 +188,25 @@ class AddCourseModalForm extends React.Component {
                         ],
                       })(<Input placeholder="请输入标题" />)}
                   </FormItem>
-                  <FormItem>
+                  <FormItem className={pageStyle.firstItem} {...formItemModalLineLayout}>
                     {getFieldDecorator('is_encrypt', {
-                      // initialValue: 2,
-                      valuePropName: 'checked',
-                    })(<Checkbox><span className={pageStyle.tip}>设置密码</span></Checkbox>)}
+                      initialValue: '2',
+                      rules: [
+                        {
+                          required: true,
+                          message: '请选择是否加密',
+                        },
+                      ],
+                    })(
+                      <Radio.Group>
+                        <Radio value="1">加密</Radio>
+                        <Radio value="2">不加密</Radio>
+                      </Radio.Group>,
+                    )}
                   </FormItem>
                   {
                     Number(getFieldValue('is_encrypt')) === 1 ?
-                      <FormItem {...formItemModalLineLayout} colon={false}>
+                      <FormItem {...formItemModalLineLayout}>
                         {getFieldDecorator('password', {
                           initialValue: '',
                           rules: [
@@ -207,7 +217,7 @@ class AddCourseModalForm extends React.Component {
                             },
                           ],
                         })(
-                          <Input style={{ width: 260 }} placeholder="请输入4-8位数字密码" min={0} />,
+                          <Input style={{ width: 200 }} maxLength={8} placeholder="请输入4-8位数字密码" />,
                         )}
                       </FormItem> : ''
                   }

src/pages/coursegather/index/Card.js

 import React from 'react';
-import { Icon } from 'antd';
+import { Icon, Row, Col } from 'antd';
 import pageStyle from './Card.less';
 import { imagify } from '../../../utils';
 const MediaCard = (props) => {
@@ -8,23 +8,25 @@ const MediaCard = (props) => {
     method,
   } = props;
   return (
-    <div className={pageStyle.box} {...props} onClick={() => method.gogatherdetail(info.id)} title={info.title}>
-      {
-        info.cover ? <img className={pageStyle.image} src={imagify(info.cover)} alt="" /> :
-        <img className={pageStyle.image} src={`${__IMGCDN__}course/courseDefaultImg.png`} alt="" />
-      }
-      <div className={pageStyle.infobox}>
-        <div className={pageStyle.topbox}>
-          <div className={pageStyle.title}>{info.title}</div>
-          <div className={pageStyle.time}>{info.created_at}</div>
-        </div>
-        <div className={pageStyle.bottombox}>
-          <div className={pageStyle.bluedot} />
-          <div className={pageStyle.coursecount}><span style={{ color: 'red', paddingRight: '2px' }}>{info.sub_courses_count}</span>个课程</div>
+    <Col xs={24} sm={24} md={12} lg={12} xl={8}>
+      <div className={pageStyle.box} {...props} onClick={() => method.gogatherdetail(info.id)} title={info.title}>
+        {
+            info.cover ? <img className={pageStyle.image} src={imagify(info.cover)} alt="" /> :
+            <img className={pageStyle.image} src={`${__IMGCDN__}course/courseDefaultImg.png`} alt="" />
+          }
+        <div className={pageStyle.infobox}>
+          <div className={pageStyle.topbox}>
+            <div className={pageStyle.title}>{info.title}</div>
+            <div className={pageStyle.time}>{info.created_at}</div>
+          </div>
+          <div className={pageStyle.bottombox}>
+            <div className={pageStyle.bluedot} />
+            <div className={pageStyle.coursecount}><span style={{ color: 'red', paddingRight: '2px' }}>{info.sub_courses_count}</span>个课程</div>
+          </div>
         </div>
+        {info.status == 2 && <img className={pageStyle.notpublishicon} src={`${__IMGCDN__}course/notpublish_a.png`} alt="" />}
       </div>
-      {info.status == 2 && <img className={pageStyle.notpublishicon} src={`${__IMGCDN__}course/notpublish_a.png`} alt="" />}
-    </div>
+    </Col>
   );
 };
 export default MediaCard;

src/pages/coursegather/index/Card.less

 .box {
-    border-radius: 8px;
     overflow: hidden;
-    width: 340px;
-    height: 110px;
+    //width: 455px;
+    height: 125px;
     border-radius: 6px;
     box-shadow:0px 0px 10px 0px rgba(0, 0, 0, 0.08);
     background:rgba(255,255,255,1);
-    padding: 10px;
+    padding: 17px;
     display: flex;
     position: relative;
     cursor: pointer;
@@ -18,14 +17,14 @@
         bottom: 7px;
     }
     .image {
-        width: 160px;
+        width: 166px;
         height: 90px;
         border-radius: 6px;
         display: block;
         margin-right: 17px;
     }
     .infobox {
-        width: 187px;
+        width: 240px;
         display: flex;
         flex-direction: column;
         justify-content: space-between;
@@ -33,7 +32,6 @@
             .title {
                 color: #575757;
                 font-size: 16px;
-                text-overflow: -o-ellipsis-lastline;
                 overflow: hidden;
                 text-overflow: ellipsis;
                 display: -webkit-box;
@@ -63,4 +61,4 @@
             }
         }
     }
-}
\ No newline at end of file
+}

src/pages/coursegather/index/index.js

@@ -114,19 +114,21 @@ class StaticCenter extends React.Component {
         {gatherListTotal > 0 &&
           <div>
             <div className={pageStyle.mediaCardBox}>
-              {gatherList.map(ele => (
-                <Card
-                  method={{
+              <Row gutter={16}>
+                {gatherList.map(ele => (
+                  <Card
+                    method={{
                     gogatherdetail: (id) => {
                       this.gogatherdetail(id);
                     },
                   }}
-                  type={1}
-                  key={ele.id}
-                  info={ele}
-                  style={{ marginRight: '20px', marginBottom: '20px' }}
-                />
+                    type={1}
+                    key={ele.id}
+                    info={ele}
+                    style={{ marginBottom: '20px' }}
+                  />
               ))}
+              </Row>
             </div>
             <div className={pageStyle.tablefooterbox}>
               <span className="tablefooterstatic">共{gatherListTotal}条数据</span>

src/pages/onlineclasses/singleclass/AddCourseModal.js

@@ -11,7 +11,7 @@ import {
   Col,
   Input,
   Card,
-  Avatar,
+  InputNumber,
   DatePicker,
   Modal,
   message, Checkbox, Radio,
@@ -83,7 +83,7 @@ class AddCourseModalForm extends React.Component {
           payload: {
             title,
             charge_type,
-            is_encrypt: is_encrypt && is_encrypt === true ? 1 : 2,
+            is_encrypt,
             type,
             password,
             start_time: moment(time).format('YYYY-MM-DD HH:mm'),
@@ -184,10 +184,21 @@ class AddCourseModalForm extends React.Component {
             {getFieldDecorator('charge_type', { initialValue: 1 })(<Input type="hidden" />)}
             <div className={pageStyle.modalbody} hidden={isActive !== 2}>
               <div>
-                <FormItem>
+                <FormItem className={pageStyle.firstItem} {...formItemModalLineLayout}>
                   {getFieldDecorator('is_encrypt', {
-                    valuePropName: 'Unchecked',
-                  })(<Checkbox><span className={pageStyle.tip}>设置密码</span></Checkbox>)}
+                    initialValue: '2',
+                    rules: [
+                      {
+                        required: true,
+                        message: '请选择是否加密',
+                      },
+                    ],
+                  })(
+                    <Radio.Group>
+                      <Radio value="1">加密</Radio>
+                      <Radio value="2">不加密</Radio>
+                    </Radio.Group>,
+                  )}
                 </FormItem>
                 {
                   Number(getFieldValue('is_encrypt')) === 1 ?

src/pages/onlineclasses/singleclass/CourseDetail.js

@@ -330,7 +330,7 @@ class CourseDetailForm extends React.Component {
     );
     return (
       <div className={pageStyle.container}>
-        <Form hideRequiredMark className={pageStyle.modalform} labelAlign="left" onSubmit={this.save}>
+        <Form className={pageStyle.modalform} labelAlign="left" onSubmit={this.save}>
           <FormItem {...formItemModalLineLayout} label="封面" className={pageStyle.imgFormItem}>
             {
               addCourseObj.cover ?
@@ -380,7 +380,6 @@ class CourseDetailForm extends React.Component {
             {getFieldDecorator('remark', {
               initialValue: addCourseObj.remark,
             })(<Input style={{ width: 424, marginRight: 30 }} placeholder="请输入课程简述" />)}
-            <span className="ant-form-text">分享课程给好友时，作为描述信息在标题下方显示</span>
           </FormItem>
           <FormItem {...formItemModalLineLayout} label="学习人数">
             {getFieldDecorator('study_count', {
@@ -393,7 +392,7 @@ class CourseDetailForm extends React.Component {
                 },
               ],
             })(<InputNumber min={0} max={999999} style={{ width: 424, marginRight: 30 }} placeholder="请输入学习人数" />)}
-            <span style={{ marginLeft: 0 }} className="ant-form-text">设置学习人数基数，让学员更有东西学习喔</span>
+            <span style={{ marginLeft: 0 }} className="ant-form-text">设置学习人数基数，让学员更有兴趣学习喔</span>
           </FormItem>
           <FormItem {...formItemModalLineLayout} label="课程类型">
             <div className={pageStyle.courseType}>{addCourseObj.is_encrypt == 1 ? `加密 密码:${addCourseObj.password}` : '未加密'}</div>
@@ -406,7 +405,7 @@ class CourseDetailForm extends React.Component {
               initialValue: addCourseObj.start_time ? moment(addCourseObj.start_time, 'YYYY-MM-DD HH:mm') : null,
               rules: [
                 {
-                  required: true,
+                  required: false,
                   message: '请选择时间',
                 },
               ],

src/pages/onlineclasses/singleclass/StaticBox.js

@@ -58,7 +58,7 @@ class StaticBox extends React.Component {
     const courseChart = courseChartData;
     const dataChart = [];
     const month = courseChart.dates || [];
-    const visitorCount = courseChart.visitor_count || 0;
+    const visitorCount = courseChart.visitor_count || [];
     for (let i = 0; i < month.length && i < visitorCount.length; i++) {
       dataChart.push({ month: month[i], count: visitorCount[i], name: '访问人数' });
     }

src/pages/onlineclasses/singleclass/index.js

@@ -72,12 +72,23 @@ class ClassMgtForm extends React.Component {
       },
     });
   }
-  goEditCourse = (id) => {
+  goEditCourse = (id, type) => {
     const { dispatch } = this.props;
     dispatch({
       type: 'onlineclasses/goEditCourse',
       payload: {
         id,
+        type,
+      },
+    });
+  }
+  goEditCourseStatic = (id, type) => {
+    const { dispatch } = this.props;
+    dispatch({
+      type: 'onlineclasses/goEditCourseStatic',
+      payload: {
+        id,
+        type,
       },
     });
   }
@@ -294,8 +305,8 @@ class ClassMgtForm extends React.Component {
                         <Card.Meta
                           style={{ padding: 0 }}
                           avatar={
-                            item.cover ? <img className={pageStyle.itemImg} alt="图片" src={imagify(item.cover)} /> :
-                            <img className={pageStyle.itemImg} src={`${__IMGCDN__}course/courseDefaultImg.png`} alt="" />}
+                            item.cover ? <img onClick={() => this.goEditCourseStatic(item.id, 1)} className={pageStyle.itemImg} alt="图片" src={imagify(item.cover)} /> :
+                            <img onClick={() => this.goEditCourseStatic(item.id, 1)} className={pageStyle.itemImg} src={`${__IMGCDN__}course/courseDefaultImg.png`} alt="" />}
                           title={
                             <div className={pageStyle.itemTitleWrap}>
                               <div className={pageStyle.itemTitle}>{item.title}</div>
@@ -307,7 +318,7 @@ class ClassMgtForm extends React.Component {
                               <div className={pageStyle.itemTime}>{item.created_at}</div>
                               <div>
                                 <span title={(item.content && JSON.parse(item.content) && JSON.parse(item.content).src) ? JSON.parse(item.content).properties.name : ''} className="hreflink" style={{ paddingRight: '20px', color: '#2194FF', lineHeight: 1 }} onClick={() => this.toUploadCourseWare(item)}>{(item.content && JSON.parse(item.content) && JSON.parse(item.content).src) ? '编辑课件' : '上传课件'}</span>
-                                <span className="hreflink" style={{ color: '#2194FF', lineHeight: 1 }} onClick={() => this.goEditCourse(item.id)}>管理课程</span>
+                                <span className="hreflink" style={{ color: '#2194FF', lineHeight: 1 }} onClick={() => this.goEditCourse(item.id, 2)}>管理课程</span>
                               </div>
                             </div>
                           }

src/pages/onlineclasses/singleclass/index.less

@@ -34,6 +34,7 @@
                 width: 166px;
                 height: 90px;
                 border-radius: 6px;
+                cursor: pointer;
             }
             .itemTitleWrap {
                 position: relative;

src/pages/onlineclasses/singleclass/singleDetail.js

@@ -212,6 +212,15 @@ class singleDetailForm extends React.Component {
       choosedPoster: '',
     });
   }
+  changeTab = (key) => {
+    const { dispatch } = this.props;
+    dispatch({
+      type: 'onlineclasses/updateState',
+      payload: {
+        singleTabIndex: key,
+      },
+    });
+  }
   render() {
     const {
       form: { getFieldDecorator, getFieldValue },
@@ -221,7 +230,9 @@ class singleDetailForm extends React.Component {
       queryParams,
       materialVisible2,
       coursewareSubmitting,
+      singleTabIndex,
     } = this.props;
+    console.log(singleTabIndex, 'singleTabIndex');
     const formItemModalLineLayout = {
       labelCol: {
         xs: { span: 24 },
@@ -255,16 +266,16 @@ class singleDetailForm extends React.Component {
             <div className={`${pageStyle.tip} ${addCourseObj.status === 2 && pageStyle.tipnotpublist}`}>{addCourseObj.status === 1 ? '已发布' : '未发布'}</div> 创建于：{addCourseObj.created_at}
           </div>
         </div>
-        <Tabs className={pageStyle.tabs} defaultActiveKey="1" onChange={this.callback} animated={false}>
-          <TabPane tab="课程详情" key="1">
+        <Tabs className={pageStyle.tabs} activeKey={`${singleTabIndex}`} onChange={this.changeTab} animated={false}>
+          <TabPane tab="数据分析" key="1">
+            <StaticBox />
+          </TabPane>
+          <TabPane tab="课程详情" key="2">
             <CourseDetail
               toChangePsd={this.toChangePsd}
               choosePoster={this.choosePoster}
             />
           </TabPane>
-          <TabPane tab="数据分析" key="2">
-            <StaticBox />
-          </TabPane>
           <TabPane tab="留言管理" key="3">
             <CommentList />
           </TabPane>
@@ -296,9 +307,12 @@ class singleDetailForm extends React.Component {
           onOk={this.savePoster}
           onCancel={this.closePoster}
           width={800}
+          bodyStyle={{
+            padding: '20px 20px',
+          }}
         >
           <Radio.Group onChange={this.posterChange} value={this.state.choosedPoster || addCourseObj.poster}>
-            <Row className={`${pageStyle.posterSetBox} posterSetBox`}>
+            <Row className={`${pageStyle.posterSetBox} posterSetBox`} gutter={16}>
               <Col span={6} style={{ marginBottom: '10px' }}>
                 <Radio id="1" style={{ display: 'flex', alignItems: 'flex-start' }} value="qingxiao/biz/image/course/poster/1.png">
                   <img className={pageStyle.posterImg} src={`${__IMGCDN__}course/poster/1.png`} alt="" />
@@ -339,6 +353,7 @@ function mapStateToProps(state) {
     materiaListTotal,
     queryParams,
     coursewareSubmitting,
+    singleTabIndex,
   } = state.onlineclasses;
   return {
     addCourseObj,
@@ -347,6 +362,7 @@ function mapStateToProps(state) {
     materiaListTotal,
     queryParams,
     coursewareSubmitting,
+    singleTabIndex,
   };
 }
 export default connect(mapStateToProps)(singleDetail);

src/pages/onlineclasses/singleclass/singleDetail.less

@@ -54,6 +54,29 @@
         border-bottom: none;
         box-shadow: 0px 6px 6px 0px rgba(0, 0, 0, 0.04);
       }
+      .ant-tabs-nav {
+        margin-left: 20px;
+      }
+      .ant-tabs-nav .ant-tabs-tab:hover {
+        color: #1890FF;
+        font-weight: 700;
+      }
+      .ant-tabs-nav .ant-tabs-tab:active {
+        color: #1890FF;
+        font-weight: 700;
+      }
+      .ant-tabs-nav .ant-tabs-tab-active {
+        color: #1890FF;
+        font-weight: 700;
+        font-size: 16px;
+      }
+      .ant-tabs-nav .ant-tabs-tab {
+        font-size: 16px;
+        padding: 26px 11px 18px;
+      }
+      .ant-tabs-ink-bar {
+        height: 3px;
+      }
     }
   }
 }