领取页

src/components/activity/give-courses/assistance/assistance.scss

@@ -125,6 +125,9 @@
             z-index: 999;
             color: #15006A;
             @include px2px(font-size, 20);
+            -webkit-appearance: none;
+            outline: 0;
+            border: none;
         }
     }
 
@@ -261,8 +264,11 @@
             }
 
             .course-wrap {
+                padding: 0 10px;
                 overflow: hidden;
-
+                display: flex;
+                justify-content: space-between;
+                flex-flow: wrap;
                 li {
                     display: inline-block;
                     width: px2rem(160);
@@ -355,10 +361,9 @@
                 .text1 {
                     color: $color_333;
                     @include px2px(font-size, 36);
-                    margin: 0 auto;
                     text-align: center;
-                    margin-bottom: 20px;
-                    margin-top: 15px;
+                    margin: 15px auto 20px;
+                    padding: 0 10px;
                 }
 
                 .text2 {
@@ -457,4 +462,8 @@
 
     }
 
+    .iconfont{
+        font-size: 30px;
+    }
+
 }

src/components/activity/give-courses/index.js

@@ -29,14 +29,14 @@ class GiveCourses extends Component {
         if (errno === 200) {
 
           this.setState({
-            banner: data.active_info.m_banner,
+            banner: data["active_info"]["m_banner"],
             courses: data.course_info,
-            rule: data.active_info.rule,
-            awardstext: data.active_info.awards_text.split('\n\n'),
-            query: data.active_info.activity_name
+            rule: data["active_info"]["rule"],
+            awardstext: data["active_info"]["awards_text"].split('\n\n'),
+            query: data["active_info"]["activity_name"]
           })
 
-          this.isRouter(data.active_info.activity_name)
+          this.isRouter(data["active_info"]["activity_name"])
 
         } else {
           showToast(msg)
@@ -44,9 +44,9 @@ class GiveCourses extends Component {
       })
 
     this.getRankList()
-    this.getMarqueeList();
-    setInterval(this.showMarquee, 5000);
-    setInterval(this.getMarqueeList, 60000);
+    this.getMarqueeList()
+    setInterval(this.showMarquee, 5000)
+    setInterval(this.getMarqueeList, 60000)
   }
 
   getRankList = () => {
@@ -61,8 +61,8 @@ class GiveCourses extends Component {
               second: data.list[1],
               third: data.list[2],
               other: data.list.slice(3, 50),
-              isMyList: data.nickname,
-              myList: data.nickname && data
+              isMyList: data["nickname"],
+              myList: data["nickname"] && data
             }
           })
         } else {
@@ -102,7 +102,7 @@ class GiveCourses extends Component {
   }
 
   isRouter = param => {
-    if(decodeURIComponent(getParam('activename')) != param){
+    if (decodeURIComponent(getParam('activename')) != param) {
       this.props.history.push('/')
     }
   }
@@ -136,8 +136,8 @@ class GiveCourses extends Component {
                     <li className='course-title'>
                       <a href="javascript:">{course.course_title}</a>
                     </li>
-                    <li className='course-teacher'><span className='tag'>讲师</span>{course.teachers}</li>
-                    <li className='course-time'><span className='tag'>开课时间</span>{course.start_time}</li>
+                    <li className='course-teacher'><span className='tag'>讲师</span>{course["teachers"]}</li>
+                    <li className='course-time'><span className='tag'>开课时间</span>{course["start_time"]}</li>
                     <li className='toreceive' onClick={() => {
                       this.setState({isShow: true})
                     }}>免费领取课程
@@ -158,8 +158,8 @@ class GiveCourses extends Component {
                     return (
                       <li key={index}>
                         <img src={item.head_img} alt=""/>
-                        <span>{item.nickname}</span>
-                        {item.word}
+                        <span>{item["nickname"]}</span>
+                        {item["word"]}
                       </li>
                     )
                   })
@@ -201,8 +201,8 @@ class GiveCourses extends Component {
                 ?
                 <tr>
                   <td><img src="//julyedu-cdn.oss-cn-beijing.aliyuncs.com/2018_1111/jin1_icon.png" alt=""/></td>
-                  <td><img src={ranklist.first.head_img} alt=""/><span>{ranklist.first.name}</span></td>
-                  <td>{ranklist.first.num}</td>
+                  <td><img src={rankList.first.head_img} alt=""/><span>{rankList.first.name}</span></td>
+                  <td>{rankList.first.num}</td>
                 </tr>
                 : null
             }
@@ -212,8 +212,8 @@ class GiveCourses extends Component {
                 ?
                 <tr>
                   <td><img src="//julyedu-cdn.oss-cn-beijing.aliyuncs.com/2018_1111/yin2_icon.png" alt=""/></td>
-                  <td><img src={ranklist.second.head_img} alt=""/><span>{ranklist.second.name}</span></td>
-                  <td>{ranklist.second.num}</td>
+                  <td><img src={rankList.second.head_img} alt=""/><span>{rankList.second.name}</span></td>
+                  <td>{rankList.second.num}</td>
                 </tr>
                 : null
             }
@@ -223,8 +223,8 @@ class GiveCourses extends Component {
                 ?
                 <tr>
                   <td><img src="//julyedu-cdn.oss-cn-beijing.aliyuncs.com/2018_1111/tong_icon.png" alt=""/></td>
-                  <td><img src={ranklist.third.head_img} alt=""/><span>{ranklist.third.name}</span></td>
-                  <td>{ranklist.third.num}</td>
+                  <td><img src={rankList.third.head_img} alt=""/><span>{rankList.third.name}</span></td>
+                  <td>{rankList.third.num}</td>
                 </tr>
                 : null
             }
@@ -245,15 +245,15 @@ class GiveCourses extends Component {
             {
               rankList.isMyList &&
               <tr className="ismylist">
-                <td>{rankList.myList.ranking}</td>
-                <td><img src={rankList.myList.head_img} alt=""/><span>{rankList.myList.nickname}</span></td>
-                <td>{rankList.myList.inviter_num}</td>
+                <td>{rankList.myList["ranking"]}</td>
+                <td><img src={rankList.myList.head_img} alt=""/><span>{rankList.myList["nickname"]}</span></td>
+                <td>{rankList.myList["inviter_num"]}</td>
               </tr>
             }
 
             </tbody>
           </table>
-          <p className="btm"></p>
+          <p className="btm"/>
         </div>
 
         <p className="julynotice">*本活动最终解释权归七月在线所有*</p>