倒计时

src/components/detail/btnstatus/index.js

@@ -16,12 +16,14 @@ class BtnStatus extends Component {
             is_baoming: 0,
             group_status: 3,
             in_cart: false,
+            countdown: 0,
         }
     }
 
     componentWillReceiveProps(nextProps) {
         this.setState({
-            ...nextProps.data.course_info
+            ...nextProps.data.course_info,
+            countdown: nextProps.countdown,
         });
     }
 
@@ -121,7 +123,7 @@ class BtnStatus extends Component {
             info = this.props.data.course_info
         }
         let barInfo = this.props.barInfo && this.props.barInfo
-
+        const {countdown} = this.state;
         return (
 
             <div>
@@ -187,7 +189,7 @@ class BtnStatus extends Component {
                             <span>课程咨询</span>
                         </a>
                         <div className='btn btn-l bg-E02E24' onClick={this.props.invitedFriends}>
-                            邀请好友参团 23:32:23 后结束
+                            邀请好友参团 {countdown} 后结束
                         </div>
                     </div>
                 }

src/components/detail/group/togroup.js

@@ -78,7 +78,7 @@ class ToGroup extends Component {
     }
 
     componentDidMount() {
-        Promise.all([http.get(`${api['pay-api']}/pdd/goupon_pay_page/15610158875449306780`), http.get(`${api.home}/m/user_info`)]).then(resultList => {
+        Promise.all([http.get(`${api['pay-api']}/pdd/goupon_pay_page/${getParam('id')}`), http.get(`${api.home}/m/user_info`)]).then(resultList => {
             console.log(resultList);
             let res = resultList[0],
             userInfo = resultList[1];

src/components/detail/index.js

@@ -28,11 +28,12 @@ class Detail extends Component {
             singMess: '',
             barInfo: '',
             share: false,
+            countdown: '00:00:00',
         }
     }
 
     componentDidMount() {
-        this.props.fetchCoursesListIfNeeded()
+        this.props.fetchCoursesListIfNeeded();
     }
 
     componentDidUpdate(prevProps) {
@@ -60,6 +61,29 @@ class Detail extends Component {
         }));
     }
 
+    componentWillReceiveProps(nextProps) {
+        let _this = this;
+        if (nextProps.courseInfo.course_info) {
+            let courseInfo = nextProps.courseInfo.course_info;
+            if(courseInfo.group_status === 3 || courseInfo.group_status === 4) {
+                let endTime = courseInfo.pdd_group_info.groupon_member.end_time;
+                let date = endTime * 1000,
+                hours = 0,
+                minutes = 0,
+                seconds = 0;
+                setInterval(() => {
+                    date -= 1000
+                    hours = `${parseInt(date / (60 * 60 * 1000))}`.padStart(2, 0);
+                    minutes = `${parseInt((date - hours * 3600000) / 60000)}`.padStart(2, 0);
+                    seconds = `${parseInt((date - hours * 3600000 - minutes * 60000 ) / 1000)}`.padStart(2, 0);
+                    _this.setState({
+                        countdown: `${hours}:${minutes}:${seconds}`
+                    });
+                }, 1000)
+            }
+        }
+    }
+
     invitedFriends = () => {
         const {course_title,image_name, course_id, pdd_group_info, pdd_group_info: {groupon_member, groupon_member: { number }, price}} = this.props.courseInfo.course_info;
         if(browser.isWeixin) {
@@ -138,20 +162,18 @@ class Detail extends Component {
     }
 
     render() {
-        let courseInfo = '';
-        let service = '';
-        let number = 0;
+        let courseInfo = '',
+        service = '',
+        number = 0,
+        endTime = 0;
         if (this.props.courseInfo.course_info) {
             courseInfo = this.props.courseInfo.course_info;
             service = courseInfo.service;
-            if(courseInfo.group_status !== 0) {
+            if(courseInfo.group_status === 3 || courseInfo.group_status === 4) {
                 number = courseInfo.pdd_group_info.groupon_member.number;
             }
         }
-        const {
-            is_bargain,  // 是否是砍价课程
-        } = this.props;
-        const { share } = this.state;
+        const { share, countdown } = this.state;
         return (
             <div className='detail-box'>
                 <CallApp className='toapp'></CallApp>
@@ -239,7 +261,7 @@ class Detail extends Component {
                 <OutLine data={this.props.courseInfo} toAudition={this.toAudition} toSingleset={this.toSingleset}/>
 
                 {/*课程按钮*/}
-                <BtnStatus data={this.props.courseInfo} barInfo={this.state.barInfo} getBargainInfo={this.getBargainInfo} invitedFriends={this.invitedFriends} history={this.props.history}></BtnStatus>
+                <BtnStatus countdown={countdown} data={this.props.courseInfo} barInfo={this.state.barInfo} getBargainInfo={this.getBargainInfo} invitedFriends={this.invitedFriends} history={this.props.history}></BtnStatus>
 
                 {
                     share ? (