分享页

src/common/closable-popup/index.scss

 .closable-popup-mask {
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    justify-content: center;
     position: fixed;
     top: 0;
     left: 0;
@@ -12,26 +8,39 @@
     z-index: 999;
 
     .popup-container {
+        position: absolute;
+        top: 165px;
+        left: 50%;
+        transform: translateX(-50%);
+        width: 300px;
         padding: 20px 10px;
         border-radius: 10px;
-        background-color: #fff;
+        background: #fff;
 
         .title {
             font-size: 16px;
             color: #525C65;
             text-align: center;
         }
-    }
 
-    .close {
-        font-size: 36px;
-        color: #fff;
-    }
+        .close {
+            position: absolute;
+            bottom: -74px;
+            left: 50%;
+            transform: translateX(-50%);
+            font-size: 36px;
+            color: #fff;
+        }
 
-    .close-icon {
-        width: 33px;
-        height: 33px;
-        font-size: 36px;
-        color: #fff;
+        .close-icon {
+            position: absolute;
+            bottom: -66px;
+            left: 50%;
+            width: 33px;
+            height: 33px;
+            transform: translateX(-50%);
+            font-size: 36px;
+            color: #fff;
+        }
     }
 }

src/components/activity/newyear-2019/common/prizes/index.js

@@ -2,6 +2,8 @@ import React, { Component } from 'react'
 import { http } from "@/utils"
 import './prizes.scss'
 import { Popup } from "@common/index"
+import { Toast } from "antd-mobile"
+
 
 import Loadable from '@loadable/component'
 
@@ -13,6 +15,7 @@ class Prizes extends Component {
   prizeList
   bg
   innerBox
+  closeIcon = 'https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/H5/close-btn.png'
 
   state = {
     prizes: [],

src/components/activity/newyear-2019/common/prizes/prizes.scss

@@ -153,7 +153,7 @@
 
             .progress-bar {
                 position: relative;
-                flex: 0 1 50px;
+                flex: 0 1 45px;
                 height: 2px;
                 background: #fff;
 

src/components/activity/newyear-2019/landing/index.js

 import React, { Component } from 'react'
 import BoxContainer from '../box-container/container'
-import { Toast } from "antd-mobile"
+import { Toast, WhiteSpace } from "antd-mobile"
 import { Popup } from "@common/index"
 import { connect } from "react-redux"
 import Prizes from "@components/activity/newyear-2019/common/prizes"
 import BulletScreen from "@components/activity/newyear-2019/common/user-bullet-screen"
 import './landing.scss'
-import { browser, getParam, http } from "@/utils"
+import { browser, getParam, http, wxShare } from "@/utils"
+import { Link } from "react-router-dom"
+import QRCode from "qrcode"
+import YearCourse from '../preheat/YearCourse'
+
 
 class Landing extends Component {
 
 
   closeIcon = 'https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/H5/close-btn.png'
-  createTeamSuccessPopupInstance = null
+  createTeamSuccessPopup = null
+  joinSuccessPopup = null
   swiper = null
 
   state = {
     teamData: {
-      member: [
-        {
-          head_img: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/default/robot.png',
-          is_captain: 1
-        },
-        {
-          head_img: 'http://img2.imgtn.bdimg.com/it/u=2138045196,3587715336&fm=26&gp=0.jpg',
-          is_captain: 0
-        },
-
-      ]
+      member: []
     },
     origin: getParam('origin'),
     treasure_code: getParam('treasure_code'),
@@ -55,7 +50,7 @@ class Landing extends Component {
           })
 
           let searchParams = new URLSearchParams(window.location.search)
-          if (searchParams.get('origin') === '1') {
+          if (searchParams.get('origin') === '1' && !browser.isWeixin) {
             searchParams.set('origin', '2')
             window.history.replaceState(null, '', `landing?${searchParams.toString()}`)
           }
@@ -116,8 +111,9 @@ class Landing extends Component {
       })
   }
 
-  joinSuccess = ({status, team_num, lack_member, is_team}) => {
-    Popup({
+  joinSuccess = (id, status, {team_num, lack_member, is_team}) => {
+    const {history} = this.props
+    this.joinSuccessPopup = Popup({
       title: <div className={'join-success'}>
         <img src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/H5/check-icon.png" alt=""/>
         <div>成功加入队伍</div>
@@ -136,7 +132,12 @@ class Landing extends Component {
         {
           status === 2
             ? <img style={{width: '150px', marginTop: '23px'}}
-                   src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/PC/treasure-box.png" alt=""/>
+                   src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/PC/treasure-box.png"
+                   alt=""
+                   onClick={() => {
+                     history.push(`/year/yearTreasure?id=${id}`)
+                   }}
+            />
             : is_team
             ? <button type='button'
                       onClick={this.inviteMembers.bind(this, this.state.teamData['my_team']['treasure_code'])}>继续组队</button>
@@ -151,15 +152,24 @@ class Landing extends Component {
   }
 
   inviteMembers = (treasure_code) => {
-    const {history, match} = this.props
+    const {history, match, user, location} = this.props
+    if (browser.isWeixin) {
+      wxShare({
+        title: `@${user.data.username} 邀您一起组队拿豪礼！`,
+        desc: `加我我的队伍，机械键盘，纸质书籍等超多奖品等你拿！`,
+        link: encodeURIComponent(`${window.location.origin}/${location.pathname}?treasure_code=${treasure_code}&origin=2`),
+        imgUrl: 'https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newIndex/community/tou5_bj.png'
+      })
+    }
     sessionStorage.setItem('showShareTip', '1')
     history.replace(`${match.path}?treasure_code=${treasure_code}&origin=${1}`)
-    this.createTeamSuccessPopupInstance && this.createTeamSuccessPopupInstance.remove()
+    this.createTeamSuccessPopup && this.createTeamSuccessPopup.remove() && (this.createTeamSuccessPopup = null)
     this.fetchPageData({treasure_code, origin: 1})
   }
 
-  createTeamSuccess = ({member, team_num, lack_member, treasure_code}) => {
+  createTeamSuccess = ({my_team: {member, team_num, lack_member, treasure_code}}) => {
     let isFollow = false
+    this.joinSuccessPopup && this.joinSuccessPopup.remove() && (this.joinSuccessPopup = null)
     http.get(`${API.home}/sys/user/isFollowWeChat`)
       .then(res => {
         const {errno, status} = res.data
@@ -167,7 +177,7 @@ class Landing extends Component {
           isFollow = true
         }
       })
-    this.createTeamSuccessPopupInstance = Popup({
+    this.createTeamSuccessPopup = Popup({
       title: '创建成功',
       className: 'landing-create-success',
       content: <div>
@@ -204,25 +214,32 @@ class Landing extends Component {
   }
 
   remind = (type = 'create', treasure_code) => {
-    const {match, history} = this.props
-    Popup({
-      title: '提醒服务',
-      className: 'landing-remind',
-      closeIcon: this.closeIcon,
-      content: <div>
-        <div className="des">{type === 'create' ? '有好友加入队伍后第一时间通知我~' : '获得宝箱时第一时间通知我~'}</div>
-        <img src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/tinypng-common/right_weixin.png" alt=""/>
-        <div className="des">长按识别/扫码 关注【七月在线】服务号即可预约</div>
-      </div>,
-      close: () => new Promise(resolve => {
-        history.replace(`${match.path}?treasure_code=${treasure_code}&origin=1`)
-        this.fetchPageData({
-          treasure_code,
-          origin: '1'
+    const {match, history, user} = this.props
+    http.get(`${API["base-api"]}/wx/user_temporary_qrcode/${user.data.uid}`)
+      .then(res => {
+        const {data} = res.data
+        return data.url
+      })
+    QRCode.toDataURL('http://m.julyedu.com')
+      .then(url => {
+        Popup({
+          title: '提醒服务',
+          className: 'landing-remind',
+          closeIcon: this.closeIcon,
+          content: <div>
+            <div className="des">{type === 'create' ? '有好友加入队伍后第一时间通知我~' : '获得宝箱时第一时间通知我~'}</div>
+            <img src={url} alt=""/>
+            <div className="des">长按识别/扫码 关注【七月在线】服务号即可预约</div>
+          </div>,
+          close: () => {
+            history.replace(`${match.path}?treasure_code=${treasure_code}&origin=1`)
+            this.fetchPageData({
+              treasure_code,
+              origin: '1'
+            })
+          }
         })
-        resolve()
       })
-    })
   }
 
   unpackTreasureBox = () => {
@@ -266,6 +283,7 @@ class Landing extends Component {
       closable: false,
       close: () => {
         sessionStorage.removeItem('showShareTip')
+        this.remind()
       }
     })
   }
@@ -330,7 +348,7 @@ class Landing extends Component {
     return (
       <div id={'landing'}>
         <div id="to-square">
-          前往活动会场，享更多福利！ >>
+          <Link to='/year/yearindex'>前往活动会场，享更多福利！ >></Link>
         </div>
         <BoxContainer>
           <i className="snow-deco"/>
@@ -339,10 +357,8 @@ class Landing extends Component {
           {
             status === 1 && <div className="des">邀请好友加入队伍，开宝箱领取丰厚奖品~</div>
           }
-          {
-            status === 2 || status === 3 && <div className="des">加入我的<span>{team_num}</span>号队伍，一起开宝箱领取丰厚奖品~</div>
-          }
-          <Prizes showSystemNotices={true}/>
+          <div className="des">加入我的<span>{team_num}</span>号队伍，一起开宝箱领取丰厚奖品~</div>
+          <Prizes showSystemNotices={false}/>
           <BulletScreen/>
           <div className="group">
             <ul className={'member'}>
@@ -464,6 +480,8 @@ class Landing extends Component {
             }
           </div>
         </BoxContainer>
+        <WhiteSpace size={'xl'}/>
+        <YearCourse></YearCourse>
       </div>
     )
   }

src/components/activity/newyear-2019/landing/landing.scss

@@ -69,8 +69,6 @@
     }
 
 
-
-
     .group {
         ul.member {
             display: flex;
@@ -168,30 +166,37 @@
         }
     }
 
-    .activity-end{
+    .activity-end {
         display: flex;
         flex-flow: column;
         align-items: center;
         margin-top: 26px;
         font-size: 14px;
         color: #FFE300;
-        div:first-child{
+
+        div:first-child {
             margin-bottom: 5px;
         }
-        div:nth-child(2){
+
+        div:nth-child(2) {
             margin-bottom: 19px;
         }
-        img{
+
+        img {
             width: 120px;
             height: 120px;
             margin-bottom: 12px;
         }
-        div:last-child{
+
+        div:last-child {
             color: #fff;
             font-size: 12px;
         }
     }
 
+    .am-whitespace.am-whitespace-xl {
+        height: 35px;
+    }
 }
 
 .popup-container {
@@ -342,6 +347,10 @@
         font-size: 14px;
         color: #666;
     }
+
+    button {
+
+    }
 }
 
 .landing-unpack-treasure-box {
@@ -436,6 +445,7 @@
     color: #111;
 
     &.popup-container {
+        position: absolute;
         width: 270px;
         text-align: center;
         top: 114px;