detail

src/components/bargainMiddlePage/bargain-middle-page.scss

@@ -68,12 +68,15 @@
       }
 
       .v-list-item {
-        padding-right: 7px;
-        margin-bottom: 7px;
-        margin-top: 0;
+        padding: 15px 7px 10px 10px;
 
         .cover {
           margin-right: 10px;
+
+          img {
+            width: 125px;
+            height: 90px;
+          }
         }
 
         .content {
@@ -155,6 +158,7 @@
         .button {
           display: flex;
           justify-content: center;
+          margin-top: 10px;
         }
 
         button {
@@ -166,6 +170,7 @@
           border: none;
           color: $bg_ff3131;
           -webkit-appearance: none;
+          font-size: 16px;
         }
 
         .invalid-btn {
@@ -338,4 +343,113 @@
     vertical-align: middle;
   }
 
+}
+
+.bargain-public-number, .bargain-first, .bargain-second, .not-bargain {
+  width: 300px;
+  padding: 20px 0;
+  background-color: $bg_fff;
+  border-radius: 3px;
+  text-align: center;
+  margin: 200px auto 20px auto;
+  position: relative;
+
+  .ff4 {
+    color: $color_FF4000;
+  }
+
+  .status-title {
+    font-size: 16px;
+    height: 16px;
+    line-height: 16px;
+  }
+
+  .status-dec {
+    font-size: 12px;
+    color: $color_666;
+    height: 12px;
+    line-height: 12px;
+  }
+
+  button {
+    width: 260px;
+    height: 30px;
+    background-color: $bg_FADD29;
+    color: $color_FF4000;
+    font-size: 16px;
+    border: none;
+    position: absolute;
+    bottom: 20px;
+    left: 20px;
+  }
+
+  .top-img {
+    position: absolute;
+    width: 135px;
+    height: 67px;
+    top: -67px;
+    margin-left: -67px;
+  }
+
+}
+
+.bargain-public-number {
+  height: 185px;
+
+  .avait {
+    position: absolute;
+    top: -20px;
+    margin-left: -20px;
+    width: 40px;
+    height: 40px;
+    border-radius: 50%;
+  }
+
+  .status-title {
+    margin-top: 10px;
+  }
+
+  .status-dec {
+    margin-top: 10px;
+  }
+
+  .public-number-img {
+    width: 86px;
+    height: 86px;
+    margin-top: 15px;
+  }
+
+}
+
+.bargain-first {
+  height: 145px;
+
+  .status-dec {
+    margin-top: 15px;
+  }
+}
+
+.bargain-second {
+  height: 105px;
+}
+
+.not-bargain {
+  height: 205px;
+  padding: 15px 20px 20px 20px;
+
+  .middle-img {
+    width: 51px;
+    height: 51px;
+  }
+
+  .status-title {
+    height: 37px;
+    line-height: 20px;
+    font-size: 15px;
+    margin-top: 10px;
+  }
+
+  .status-dec {
+    margin-top: 15px;
+  }
 }
\ No newline at end of file

src/components/detail/bargain/bargain.scss

@@ -82,13 +82,34 @@
       font-size: 12px;
       text-align: center;
       line-height: 48px;
+
+      .time {
+        display: inline-block;
+        width: 20px;
+        height: 18px;
+        background: $bg_666;
+        border-radius: 2px;
+        text-align: center;
+        line-height: 18px;
+        font-size: $font_12;
+        color: $white;
+      }
+
+      .hour {
+        margin-left: 7px;
+      }
+
+      .sec {
+        margin-right: 5px;
+      }
+
     }
 
   }
 
   .status-inner {
     width: 350px;
-    height: 124px;
+    height: 130px;
     padding: 0 10px;
     background: $white;
     border-radius: 3px;
@@ -111,6 +132,10 @@
         color: $white;
       }
 
+      .over {
+        color: $color_999;
+      }
+
       .time {
         display: inline-block;
         width: 20px;
@@ -332,6 +357,15 @@
   border-radius: 3px;
   text-align: center;
   margin: 200px auto 20px auto;
+  position: relative;
+
+  .top-img {
+    position: absolute;
+    width: 135px;
+    height: 67px;
+    top: -67px;
+    margin-left: -67px;
+  }
 
   .top-tip {
     font-size: 16px;
@@ -397,4 +431,5 @@
     color: $color_666;
   }
 
-}
+}
\ No newline at end of file
+

src/components/detail/bargain/bargainInfo/bargain-info.scss

-.bargain-info {
+.bargain-bind-iphone {
     position: absolute;
     top: 50%;
     left: 50%;

src/components/detail/btnstatus/index.js

-import React, {Component} from 'react';
-import {api, getParam, http} from "@/utils";
-import {Toast} from 'antd-mobile';
+import React, {Component} from 'react'
+import {api, getParam, http} from "@/utils"
+import {Toast} from 'antd-mobile'
 import {Link} from 'react-router-dom'
-import {getCourses} from "@/components/detail/actions";
-import {connect} from "react-redux";
-
-
+import {getCourses} from "@/components/detail/actions"
+import {connect} from "react-redux"
 import './index.scss'
 
 
@@ -17,27 +15,37 @@ class BtnStatus extends Component {
         }
     }
 
-    // 加入购物车
-    toCart = () => {
+    // 加入购物车 type：1 加入购物车，2加入购物车并跳转到购物车页面去支付
+    toCart = (type) => {
+        console.log(type)
         let data = {
             course_id: getParam('id')
         }
         http.post(`${api.home}/m/cart/add`, data).then((res) => {
             if (res.data.code === 200) {
-                Toast.info('已加入购物车', 2);
-                // window.location.reload()
-                this.props.getCourses();
+                if (type === 1) {
+                    Toast.info('已加入购物车', 2)
+                    this.props.getCourses()
+                } else {
+                   // window.location.href = '/shopcart'
+                }
+
+            } else if (res.data.code === 15001) {
+              //  window.location.href = '/shopcart'
             } else {
                 Toast.info(res.data.msg, 2);
             }
         })
     }
 
+
     render() {
         let info = ''
         if (this.props.data && this.props.data.course_info) {
             info = this.props.data.course_info
         }
+        let barInfo = this.props.barInfo && this.props.barInfo
+
         return (
 
             <div>
@@ -55,7 +63,7 @@ class BtnStatus extends Component {
                         }
                         {
                             !info.in_cart &&
-                            <button className='btn btn-s bg-FCCD05' onClick={this.toCart}>加入购物车</button>
+                            <button className='btn btn-s bg-FCCD05' onClick={e => this.toCart(1)}>加入购物车</button>
 
                         }
                         <Link to='/order' className='btn btn-s bg-FD7700'>立即报名</Link>
@@ -75,7 +83,7 @@ class BtnStatus extends Component {
                 }
                 {/*拼团 未开团*/}
                 {
-                    info.is_baoming === 0 && info.group_status === 4&&
+                    info.is_baoming === 0 && info.group_status === 4 &&
                     <div className='btns-box'>
                         <a className='consult consult-s' href="https://q.url.cn/AB8aue?_type=wpa&qidian=true">
                             <i className='iconfont iconerji'></i>
@@ -107,27 +115,27 @@ class BtnStatus extends Component {
 
                 {/*砍价*/}
                 {
-                    this.props.status === 3 &&
+                    this.props.data && this.props.data.is_bargain &&
                     <div className='btns-box'>
                         <a className='consult consult-s' href="https://q.url.cn/AB8aue?_type=wpa&qidian=true">
                             <i className='iconfont iconerji'></i>
                             <span>课程咨询</span>
                         </a>
                         <button className='btn btn-s bg-F4AAA7'>
-                            <span>¥149</span>
-                            <span>直接购买</span>
+                            <span>¥{info.price1}</span>
+                            <span onClick={e => this.toCart(2)}>直接购买</span>
                         </button>
                         {
-                            this.state.isbuy === 0 &&
-                            <button className='btn btn-s bg-E02E24'>
+                            barInfo.bargain_status === 2 &&
+                            <button className='btn btn-s bg-E02E24' >
                                 我要砍价
                             </button>
                         }
                         {
-                            this.state.isbuy === 1 &&
+                            (barInfo.bargain_status === 0 || barInfo.bargain_status === 1) &&
                             <button className='btn btn-s bg-E02E24'>
                                 <span>¥1</span>
-                                <span>去支付</span>
+                                <span onClick={e => this.toCart(2)}>去支付</span>
                             </button>
                         }
                     </div>
@@ -151,4 +159,4 @@ class BtnStatus extends Component {
 export default connect(
     null,
     {getCourses}
-)(BtnStatus);
+)(BtnStatus)
\ No newline at end of file

src/components/detail/index.js

@@ -11,6 +11,8 @@ import BtnStatus from "./btnstatus"
 import Carouselw from "./carousel"
 import {connect} from "react-redux"
 import {fetchCoursesListIfNeeded} from "./actions"
+import {api, getParam, http} from "@/utils";
+import {Toast} from "antd-mobile";
 
 
 class Detail extends Component {
@@ -23,12 +25,14 @@ class Detail extends Component {
             auditionBox: false,
             singleBox: false,
             shareRank: false,
-            singMess: ''
+            singMess: '',
+            barInfo: '',
         }
     }
 
     componentDidMount() {
         this.props.fetchCoursesListIfNeeded()
+        this.getBargainInfo()
     }
 
     componentDidUpdate() {
@@ -53,6 +57,23 @@ class Detail extends Component {
     }
 
 
+    //获取砍价信息
+    getBargainInfo = () => {
+        let data = {
+            courseId: getParam('id')
+        }
+        http.post(`${api.home}/m/bargain/courseDetail`, data).then((res) => {
+            if (res.data.code === 200) {
+                this.setState({
+                    barInfo: res.data.data
+                })
+            } else {
+                Toast.info(res.data.msg, 2)
+            }
+        })
+    }
+
+
     // 自组件传给父组件的boxHide
     boxHide = (val) => {
         this.setState({auditionBox: val, singleBox: val})
@@ -152,7 +173,7 @@ class Detail extends Component {
                 <OutLine data={this.props.courseInfo} toAudition={this.toAudition} toSingleset={this.toSingleset}/>
 
                 {/*课程按钮*/}
-                <BtnStatus data={this.props.courseInfo}></BtnStatus>
+                <BtnStatus data={this.props.courseInfo} barInfo={this.state.barInfo} ></BtnStatus>
             </div>
         )
     }

src/components/preferential/index.js

@@ -106,7 +106,7 @@ class Preferential extends Component {
                                             </p>
                                             <p className='contact text-overflow-2'>{item.course_desc}</p>
                                             <div className='des'>
-                                                {item.is_buy &&
+                                                {!item.is_buy &&
                                                 <p className="course-price">
                                                     {this.state.courseStatus === 0 &&
                                                     <span className='price'>特惠价：</span>
@@ -115,7 +115,7 @@ class Preferential extends Component {
                                                     <span className="old">¥{item.price0}</span>
                                                 </p>
                                                 }
-                                                {!item.is_buy &&
+                                                {item.is_buy &&
                                                 <a href="/#" className="isbuy">已购买</a>
                                                 }
                                             </div>

src/setupProxy.js

@@ -12,7 +12,7 @@ module.exports = function (app) {
                 pathRewrite: {
                     [`^${config[item]['development']}`]: ''
                 },
-                // cookieDomainRewrite: 'localhost',
+                cookieDomainRewrite: 'localhost',
                 ...config[item]['proxy']
             }
         ))