blessing rank modify

src/components/blessingPreheat/coursePopup/index.js

 import React, { Component } from 'react';
 import { http } from "@/utils";
+import { Link } from 'react-router-dom';
 import './index.scss';
 
 class CoursePopup extends Component {
@@ -46,13 +47,17 @@ class CoursePopup extends Component {
           <div className="course-popup__list">
             {
               courseList.map(item => (
-                <a href="" className="course-popup__item" key={item.course_id}>
+                <Link 
+                  to={`/detail?id=${item.course_id}`} 
+                  className="course-popup__item" 
+                  key={item.course_id}
+                >
                   <span className="course-popup__name">{item.course_title}</span>
                   {
                     item.blessing && 
                     <span>+2点</span>
                   }
-                </a>
+                </Link>
               ))
             }
           </div>

src/components/blessingRank/index.js

@@ -6,7 +6,13 @@ class BlessingRank extends Component {
   constructor(props) {
     super(props);
     this.state = {
-      rankList: []
+      rankList: [],
+      rules: [
+        '1、排行榜名次以2019年11月13日24点七月在线公布的排行榜为准，榜单确认后，得奖小伙伴请及时填写邮寄信息，7个自然日内不填写，视为主动放弃奖品；',
+        '2、福气值只在本活动期间享受抽奖、提高中奖概率、购课优化、增加AI水平测试等福利；',
+        '3、如有发现恶意刷榜，刷虚假数据等行为将取消其领奖资格；',
+        '4、本活动解释权归北京七月在线科技有限公司所有。',
+      ],
     }
   }
 
@@ -30,13 +36,12 @@ class BlessingRank extends Component {
   }
 
   render() {
-    const { rankList } = this.state;
+    const { rankList, rules } = this.state;
     return (
       <>
-        <div className="rank__banner">
-
-        </div>
+        <div className="rank__banner"></div>
         <div className="rank__body">
+          <button className="rank__address">填写收货地址></button>
           <div className="rank__table">
             <dl className="rank__table-header">
               <dd className="rank__table-column">排名</dd>
@@ -73,13 +78,11 @@ class BlessingRank extends Component {
           </div>
           <div className="rank__rule">
             <h2 className="rank__rule-title">活动规则</h2>
-            <p className="rank__rule-desc">1. 11月5日至11月13日之间每人有一次测试机会，可通过“集福气”活动额外获得2次测试机会；</p>
-            <p className="rank__rule-desc">2. 单次测试时间为一小时，超时自动提交试卷；</p>
-            <p className="rank__rule-desc">3. 试卷内容为Python基础（8道题*3分）、机器学习（12道题*3分）、深度学习（10道题*4分），总分100分；</p>
-            <p className="rank__rule-desc">4. 无固定试卷，参与测试时从试题库中随机抽题组卷；</p>
-            <p className="rank__rule-desc">5. 排行榜实时更新，分数相同则用时短者排名更高，多次测试保留最高分；</p>
-            <p className="rank__rule-desc">6. 如发现某账号有作弊嫌疑，七月在线有权清空账号测试成绩；</p>
-            <p className="rank__rule-desc">7. 活动最终解释权归七月在线所有。</p>
+            {
+              rules.map((item, index) => (
+                <p className="rank__rule-desc" key={index}>{item}</p>
+              ))
+            }
           </div>
         </div>
       </>

src/components/blessingRank/index.scss

@@ -5,15 +5,31 @@
 }
 
 .rank__body {
-  padding: 0 5px 39px;
+  padding: 20px 5px 39px;
   background-color: #5327FA;
 }
 
+.rank__address {
+  display: block;
+  width: 133px;
+  height: 26px;
+  margin: 0 auto 10px;
+  padding: 0;
+  border: 1px solid #FFF604;
+  border-radius: 13px;
+  box-sizing: border-box;
+  font-size: 13px;
+  color: #FFF604;
+  line-height: 26px;
+  background-color: transparent;
+  outline: none;
+  cursor: pointer;
+}
+
 .rank__table {
   display: table;
   width: 100%;
   margin: 0 0 20px;
-  padding: 25px 0 0;
   border-radius: 5px;
   overflow: hidden;
 }