merge

package-lock.json

@@ -14199,9 +14199,9 @@
       }
     },
     "swiper": {
-      "version": "4.5.0",
-      "resolved": "https://registry.npmjs.org/swiper/-/swiper-4.5.0.tgz",
-      "integrity": "sha512-jRCd/CGet9kaHwthHdd/sL/YU8CI157PWLyItnIcn/o/jP4haVky3zTF6f9F3JDpmQIw7jdWihISiYx0/oTHsg==",
+      "version": "4.5.1",
+      "resolved": "https://registry.npmjs.org/swiper/-/swiper-4.5.1.tgz",
+      "integrity": "sha512-se6I7PWWu950NAMXXT+ENtF/6SVb8mPyO+bTfNxbQBILSeLqsYp3Ndap+YOA0EczOIUlea274PKejT6gKZDseA==",
       "requires": {
         "dom7": "^2.1.3",
         "ssr-window": "^1.0.1"

package.json

@@ -78,7 +78,7 @@
     "sass-resources-loader": "^2.0.0",
     "socket.io": "^2.2.0",
     "style-loader": "0.23.1",
-    "swiper": "^4.5.0",
+    "swiper": "^4.5.1",
     "terser-webpack-plugin": "1.2.2",
     "url-loader": "1.1.2",
     "video.js": "^7.6.5",

src/assets/css/index.scss

@@ -511,4 +511,4 @@ input[type="radio"]:checked:before {
 .am-modal-alert-content, .am-modal-propmt-content{
   color: #333;
   font-size: 15px;
-}
+}
\ No newline at end of file

src/common/Captcha/index.scss

 .captcha-container {
   position: relative;
   width: 100%;
-  height: 40px;
+  // height: 40px;
 }
 
 .captcha-animation {

src/common/Mask/index.js

+import React, { Component } from 'react';
+import ReactDOM from 'react-dom';
+import classnames from 'classnames';
+import './index.scss';
+
+const Root = document.querySelector('body');
+const events = ['touchmove', 'mousewheel'];
+
+class Mask extends Component {
+
+  constructor(props) {
+    super(props);
+    if(!this.el) {
+      this.el = document.createElement('div');
+    }
+  }
+
+  componentDidMount() {
+    events.forEach(item => {
+      this.el.addEventListener(item, this.preventEvent, {
+          passive: false
+      })
+    })
+    Root.appendChild(this.el);
+  }
+
+  componentWillUnmount() {
+    Root.removeChild(this.el);
+  }
+
+  preventEvent = e => {
+    e.preventDefault();
+  }
+
+  render() {
+    const { visible, handleToHide, className } = this.props;
+    if(visible) {
+      return ReactDOM.createPortal(
+        (
+          <div className="mask">
+            <div className={classnames("mask-content", className)}>
+              {this.props.children}
+            </div>
+            <div className="mask-footer">
+              <i className="mask-button__close" onClick={handleToHide}></i>
+            </div>
+          </div>
+        ),
+        this.el
+      );
+    }else {
+      return null;
+    }
+  }
+}
+
+export default Mask;
\ No newline at end of file

src/common/Mask/index.scss

+.mask {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  color:#fff;
+  background-color: rgba(0, 0, 0, .5);
+  z-index: 999;
+}
+
+.mask-content {
+  min-width: 200px;
+  min-height: 100px;
+  padding: 10px 0;
+  border-radius: 5px;
+  box-sizing: border-box;
+  background-color: #fff;
+}
+
+.mask-footer {
+  margin-top: 33px;
+}
+
+.mask-button__close {
+  display: inline-block;
+  width: 33px;
+  height: 33px;
+  background-size: cover;
+  background-image: url('https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/H5/close-btn.png');
+}
\ No newline at end of file

src/common/addressPopup/index.js

+import React, { Component } from 'react';
+import { http } from '@/utils';
+import { Formik, Form, Field } from 'formik';
+import { Toast } from "antd-mobile";
+import './index.scss';
+
+class AddressPopup extends Component {
+  constructor(props) {
+    super(props)
+    this.state = {
+      isLoading: false,
+      addressInfo: {
+        name: '',
+        phone: '',
+        address: '',
+      },
+    }
+  }
+
+  componentDidMount() {
+    this.fetchUserAddress();
+  }
+
+  // 获取收货信息
+  fetchUserAddress = () => {
+    const { addressInfo } = this.state;
+    http.get(`${API.home}/sys/user_address_info`).then(res => {
+      const {code, data, msg} = res.data;
+      if (code === 200) {
+        this.setState({
+          addressInfo: Object.assign({}, addressInfo, {
+            name: data.name,
+            phone: data.phone,
+            address: data.address,
+          }),
+          isLoading: true,
+        });
+      }
+    });
+  }
+
+  handleToSubmit = (params = {}) => {
+    const { successBindAddress } = this.props;
+    http.post(`${API.home}/sys/update_address`, {
+      act_type: 'treasure',
+      ...params
+    }).then(res => {
+      const {code, msg} = res.data;
+      if (code === 200) {
+        successBindAddress();
+      } else {
+        Toast.info(msg, 2, null, false);
+      }
+    });
+  }
+
+  render() {
+    const { isLoading, addressInfo } = this.state;
+    const {tip, prize, skip = 'default'} = this.props;
+    return (
+      <>
+        {
+          isLoading &&
+          <Formik
+            initialValues={{ 
+              ...addressInfo
+            }}
+            validate={({name, phone, address}) => {
+              const errors = {};
+
+              if (!name) {
+                errors.name = '请输入收件人';
+              }
+              if(!/^1[3-9]\d{9}$/.test(phone)) {
+                errors.phone = '请填写正确格式的手机号';
+              }
+              if (!address) {
+                errors.address = '请输入收货地址';
+              }
+
+              return errors;
+            }}
+            validateOnBlur={false}
+            validateOnChange={false}
+            onSubmit={(values) => {
+              this.handleToSubmit(values);
+            }}
+            render={({errors}) => (
+              <Form className="address-form" data-skip={skip}>
+                <h2 className="address-form__title">收货信息</h2>
+                {
+                  prize ? (
+                    <p className='address__prize'>
+                      您抽中了
+                      <span style={{'color': '#FF4000'}}>{prize}</span>
+                    </p>
+                  ) : (null)
+                }
+                {
+                  tip ? (<div className="address-form__subtitle">{tip}</div>) : (<p className="address-form__desc">请及时填写收货信息，获得实物奖品后将第一时间为您邮寄</p>) 
+                }
+                <Field 
+                  name="name"
+                  render={({ field }) => (
+                    <div className="address-form__item">
+                      <input
+                        {...field}
+                        className="address-form__ipt"
+                        type="text"
+                        placeholder="收件人"
+                      />
+                      {
+                        errors.name &&
+                        <p className="address-form__tip">{errors.name}</p>
+                      }
+                    </div>
+                  )}
+                />
+                <Field 
+                  name="phone"
+                  render={({ field }) => (
+                    <div className="address-form__item">
+                      <input
+                        {...field}
+                        className="address-form__ipt"
+                        type="text"
+                        placeholder="联系方式"
+                      />
+                      {
+                        errors.phone &&
+                        <p className="address-form__tip">{errors.phone}</p>
+                      }
+                    </div>
+                  )}
+                />
+                <Field 
+                  name="address"
+                  render={({ field }) => (
+                    <div className="address-form__item">
+                      <input
+                        {...field}
+                        className="address-form__ipt"
+                        type="text"
+                        placeholder="收货地址"
+                      />
+                      {
+                        errors.address &&
+                        <p className="address-form__tip">{errors.address}</p>
+                      }
+                    </div>
+                  )}
+                />
+                <button 
+                  className="address-form__submit" 
+                  data-status="do"
+                  type="submit"
+                >提交</button>
+              </Form>
+            )}
+          />
+        }
+      </>
+    );
+  }
+}
+
+export default AddressPopup;
\ No newline at end of file

src/common/addressPopup/index.scss

+// 地址弹窗
+[data-skip="default"] {
+
+  .address-form__item {
+    width: 250px;
+  }
+
+  .address-form__submit {
+    width: 120px;
+    height: 34px;
+    margin: 8px auto 0;
+    border-style: none;
+    border-radius: 17px;
+    color: rgba(255, 255, 255, 1);
+    background-color: rgba(82, 92, 101, 0.3);
+
+    &[data-status="do"] {
+      background-color: #0099FF;
+    }
+  }
+}
+
+[data-skip="year"] {
+
+  .address-form__title {
+    margin: 10px 0 0;
+    font-size: 18px;
+    color: #111;
+    text-align: center;
+    line-height: 1;
+  }
+
+  .address-form__subtitle {
+    margin: 0 15px;
+  }
+
+  .address-form__item {
+    width: 270px;
+    margin: 0 15px 10px;
+  }
+  
+  .address-form__ipt {
+    border-radius: 3px;
+  }
+
+  .address-form__submit {
+    width: 270px;
+    height: 44px;
+    margin: 15px auto 0;
+    border: 1px solid #090909;
+    border-radius: 5px;
+    color: #090909;
+    background-color: #FFE319;
+  }
+}
+
+.address-form__desc {
+  // width: 238px;
+  margin: 16px auto 15px;
+  font-size: 12px;
+  color: #999;
+}
+
+.address-form__item {
+  position: relative;
+  width: 250px;
+  margin: 0 auto 16px;
+}
+
+.address-form__ipt {
+  display: block;
+  width: 100%;
+  height: 40px;
+  border: 1px solid rgba(221, 221, 221, 1);
+  font-size: 14px;
+  font-weight: 400;
+  color: rgba(153, 153, 153, 1);
+  text-indent: 10px;
+}
+
+.address-form__tip {
+  position: absolute;
+  bottom: -14px;
+  width: 100%;
+  font-size: 12px;
+  color: #ff0000;
+  line-height: 14px;
+}
+
+.address-form__submit {
+  display: block;
+  font-size: 15px;
+  font-weight: 500;
+  cursor: pointer;
+  outline: none;
+}
\ No newline at end of file

src/common/bindPhone/index.js

+import React, { Component } from 'react';
+import { Formik, Form, Field } from 'formik';
+import { Toast } from 'antd-mobile';
+import { isEmpty } from 'lodash';
+import Captcha from '@/common/Captcha';
+import { http, getParam } from '@/utils';
+import './index.scss';
+
+class BindPhone extends Component {
+  captchaInstance = null;
+
+  constructor(props) {
+    super(props),
+    this.state = {
+      validate: '',
+      seconds: 60,
+      isFirst: true,
+      timer: null,
+      isTimer: false, // 是否开始倒计时
+      accountInfo: {},
+      bindInfo: {},
+      country: {
+        num: '86'
+      }
+    }
+  }
+
+  componentDidMount() {
+    this.initCountryInfo();
+  }
+
+  initCountryInfo = () => {
+    const { country } = this.props;
+    this.setState({
+      country
+    });
+  }
+
+  toFetchCountryNum = () => {
+    const { history, hideBindPhone } = this.props;
+    hideBindPhone();
+    history.push('/country?from=bind');
+  }
+
+  getCaptchaInstance = instance => {
+    this.captchaInstance = instance;
+  }
+
+  onVerify = (err, data) => {
+    if (err) {
+      console.log(err);
+    } else {
+      this.setState({
+        validate: data.validate
+      });
+    }
+  }
+
+  // 获取手机号验证码
+  handleToSend = ({tel, code}) => {
+    let { validate, seconds, isFirst, isTimer, country: {num = '86'} } = this.state;
+    if(validate) {
+      if (!isFirst) {
+        Toast.info('请重新进行滑块验证', 2, null, false);
+        this.captchaInstance.refresh();
+        this.setState({
+            isFirst: true
+        });
+        return
+      }
+      if(!isTimer) {
+        if (!tel) {
+          Toast.info('手机号码不能为空', 2, null, false);
+        }else if(!/^\d+$/.test(tel)) {
+          Toast.info('请输入正确格式的手机号码', 2, null, false);
+        }else {
+
+          // 获取验证码
+          http.post(
+            `${API['passport-api']}/m/personal/bindPhoneSendCode`,
+            {
+              area_code: `00${num}`,
+              phone_num: tel
+            }
+          ).then(res => {
+            const { errno, msg } = res.data;
+            if(errno === 200) {
+              Toast.info('验证码发送成功', 2, null, false);
+
+              // 倒计时
+              this.timer = window.setInterval(() => {
+                if (seconds <= 0) {
+                  window.clearInterval(this.timer);
+                  this.setState({
+                    isTimer: false,
+                    seconds: 60
+                  });
+                }else {
+                  this.setState({
+                    isTimer: true,
+                    seconds: --seconds
+                  });
+                }
+              }, 1000);
+
+              // 滑块
+              this.setState({
+                isFirst: false
+              })
+            }else {
+              Toast.info(msg, 2, null, false);
+            }
+          })
+        }
+      }
+    }
+    return false;
+  }
+
+  // 绑定手机
+  toBindPhone = () => {
+    const { accountInfo: { tel, code }, country: {num = '86'}  } = this.state;
+    const { handleToConfirmPhone, successBindPhone } = this.props;
+    const params = {
+      area_code: `00${num}`,
+      mobile: tel,
+      code: code,
+      act_type: 'treasure', // 宝箱
+    };
+    http.post(
+      `${API.home}/sys/v2/user/bindMobile`,
+      {  
+        ...params,
+        type: 1, // 1：绑定，2：修改绑定
+        is_valid: 1, // is_valid	是否验证 1:验证（默认）,0不验证
+      }
+    ).then(res => {
+      const { code, data, msg } = res.data;
+      if(code === 200 ) {
+        if(data.tip_info) {
+          handleToConfirmPhone(params, data.tip_info);
+        }else {
+          successBindPhone();
+        }
+      }else {
+        Toast.info(msg, 2, null, false);
+      }
+    });
+  }
+
+  render() {
+    const { desc, skip = 'year' } = this.props;
+    const { country, validate, isTimer, seconds } = this.state;
+    return (
+        <Formik
+          initialValues={{
+            tel: '',
+            code: ''
+          }}
+          validate={({tel, code}) => {
+            const errors = {};
+
+            // if (!validateTel(tel)) {
+            if(!/^\d+$/.test(tel)) {
+              errors.tel = '请填写正确格式的手机号';
+            }
+            if (!/[0-9]{6}/.test(code)) {
+              errors.code = '请输入验证码';
+            }
+
+            return errors;
+          }}
+          onSubmit={(values, { setStatus, setSubmitting }) => {
+            this.setState({
+              accountInfo: {
+                ...values
+              }
+            });
+            this.toBindPhone();
+          }}
+          render={({values: {tel, code}, errors}) => (
+            <Form className="popup-form" data-skip={skip}>
+              <h2 className="popup-form__title">绑定手机号</h2>
+              {
+                desc &&
+                <div className="poup-form__desc">{desc}</div>
+              }
+              <div className="popup-form__item">
+                <a className="popup-form__button--num" onClick={this.toFetchCountryNum}>
+                  +{country.num}
+                  <i className="iconfont iconiconfront-69"/>
+                </a>
+                <Field
+                  name="tel"
+                  render={({field}) => {
+                    return (
+                      <input
+                        {...field}
+                        className="popup-form__ipt"
+                        data-type="tel"
+                        type="text"
+                        placeholder="请填写手机号"
+                      />
+                    );
+                  }}
+                />
+              </div>
+              <Captcha
+                getInstance={this.getCaptchaInstance}
+                onVerify={this.onVerify}
+              />
+              <div className="popup-form__item">
+                <Field
+                  name="code"
+                  render={({field}) => {
+                    return (
+                      <input
+                        {...field}
+                        className="popup-form__ipt popup-form__ipt--left"
+                        type="text"
+                        placeholder="输入验证码"
+                      />
+                    );
+                  }}
+                />
+                <button
+                  className="popup-form__button--code"
+                  data-status={(validate && !isTimer)? 'do': ''}
+                  type="button"
+                  onClick={() => this.handleToSend({tel, code})}
+                >
+                  {
+                    isTimer? `重新发送${seconds}s` : '发送验证码'
+                  }
+                </button>
+              </div>
+              <button
+                className="popup-form__button--bundle"
+                data-status={(tel && code && isEmpty(errors))? 'do': 'done'}
+                type="submit"
+              >
+                完成绑定
+              </button>
+            </Form>
+          )}
+        />
+    )
+  }
+}
+
+export default BindPhone;
\ No newline at end of file

src/common/bindPhone/index.scss

+// form 
+// .popup-form {
+//   text-align: center;
+
+  .popup-packet__button--bundle {
+    margin-top: 5px;
+  }
+// }
+
+[data-skip="default"] {
+  .popup-form__item {
+    height: 36px;
+  }
+
+  .popup-form__button--num {
+    border: 1px solid #99D6FF;
+    border-right-style: none;
+    border-radius: 6px 0 0 6px;
+  }
+  
+  .popup-form__button--code {
+    border-radius: 6px;
+  }
+
+  .popup-form__button--bundle {
+    width: 161px;
+    height: 30px;
+    border-radius: 15px;
+    font-size: 13px;
+  }
+  
+  .popup-form__ipt {
+    border: 1px solid #99D6FF;
+    border-radius: 6px;
+
+    &[data-type="tel"] {
+      border-left-style: none;
+      border-radius: 0 6px 6px 0;
+    }
+  }
+}
+
+[data-skip="year"] {
+  .popup-form__title {
+    margin: 10px 0 0;
+    font-size: 18px;
+    color: #111;
+    text-align: center;
+    line-height: 1;
+  }
+
+  .popup-form__item {
+    width: 269px;
+    height: 40px;
+  }
+
+  .popup-form__button--num {
+    border: 1px solid #CDCDCD;
+    border-right-style: none;
+    border-radius: 3px 0 0 3px;
+  }
+
+  .popup-form__button--code {
+    border-radius: 3px;
+  }
+
+  .popup-form__button--bundle {
+    width: 270px;
+    height: 44px;
+    margin-bottom: 14px;
+    border-radius: 5px;
+    font-size: 16px;
+  }
+
+  .popup-form__ipt {
+    border: 1px solid #CDCDCD;
+    border-radius: 3px;
+
+    &[data-type="tel"] {
+      border-left-style: none;
+      border-radius: 0 3px 3px 0;
+    }
+  }
+}
+
+.captcha-container {
+  width: 269px;
+  height: 40px;
+  margin: 0 auto 15px;
+}
+
+.popup-form {
+  // width: 290px;
+  // height: 257px;
+  // padding: 20px 20px 0;
+  box-sizing: border-box;
+}
+
+.popup-form__item {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin: 0 auto 15px;
+  
+  .popup-form__ipt {
+    flex: 1;
+  }
+
+  .popup-form__ipt--left {
+    width: 130px;
+  }
+
+  .popup-form__button--code {
+    margin-left: 10px;
+  }
+}
+
+.popup-form__button--num {
+  display: block;
+  position: relative;
+  height: 36px;
+  padding: 0 8px;
+  box-sizing: border-box;
+  font-size: 14px;
+  color: #333;
+  line-height: 36px;
+
+  &::after {
+    display: block;
+    content: '';
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    width: 1px;
+    height: 14px;
+    margin: auto 0;
+    background-color: #AAAAAA;
+  }
+
+  .iconfont {
+    font-size: 12px;
+    color: #333;
+  }
+}
+
+.popup-form__ipt {
+  height: 36px;
+  padding: 0 8px;
+  box-sizing: border-box;
+  font-size: 12px;
+  color: #999;
+  line-height: 36px;
+  outline: none;
+
+  &[data-type="tel"] {
+    border-left-style: none;
+  }
+}
+
+.popup-form__tip {
+  margin: 0;
+  font-size: 12px;
+  color: #FF3131;
+
+  .iconfont {
+    font-size: 15px;
+    color: #FF3131;
+  }
+}
+
+.popup-form__button--code {
+  width: 110px;
+  height: 36px;
+  padding: 0;
+    border: 1px solid #E5E5E5;
+    box-sizing: border-box;
+  font-size: 13px;
+  color: #999;
+  text-align: center;
+  line-height: 36px;
+  background-color: transparent;
+
+  &[data-status='do'] {
+    border-color: #0099FF;
+    color: #0099FF;
+  }
+}
+
+.popup-form__button--bundle {
+  display: block;
+  padding: 0;
+  margin: 0 auto;
+  border-style: none;
+  color: #2B2B2B;
+  background-color: #F9DB4A;
+  cursor: pointer;
+
+  &[data-status="done"] {
+    color: #fff;
+    background-color: #ABABAB;
+  }
+
+  &[data-status='do'] {
+    color: #fff;
+    background-color: #0099FF;
+  }
+}
\ No newline at end of file

src/common/closable-popup/index.js

@@ -3,11 +3,25 @@ import ReactDOM from 'react-dom'
 import './index.scss'
 import classnames from 'classnames'
 
+const re = /(https?|ftp):\/\/[-A-Za-z0-9+&@#/%?=~_|!:,.;]+[-A-Za-z0-9+&@#/%=~_|]/
+
 function ClosablePopup({
-                         title, content, className, closable = true, close = function () {
-  }
+                         title,
+                         content,
+                         className,
+                         closable = true,
+                         close = function () {
+                         },
+                         clickMaskClose = true,
+                         closeIcon = 'iconiconfront-2',
+                         afterClose = function () {
+                         },
+                         remove = function () {
+
+                         }
                        } = {}) {
 
+
   function unmountComponent() {
     ReactDOM.unmountComponentAtNode(div)
     if (div && div.parentNode) {
@@ -20,22 +34,36 @@ function ClosablePopup({
     if (_c && _c.then) {
       _c.then(() => {
         unmountComponent()
+        afterClose()
       })
     } else {
       unmountComponent()
+      afterClose()
     }
   }
 
+  function clickMask() {
+    if (closable) {
+      return
+    }
+    if (!clickMaskClose) {
+      return
+    }
+    _close()
+  }
 
   const closablePopup = (
-    <div className={'closable-popup-mask'}>
+    <div className={'closable-popup-mask'} onClick={clickMask}>
       <div className={classnames(['popup-container', className])}>
         <div className="title">{title}</div>
         <div className="content">
           {content}
         </div>
         {
-          closable && <i className={'close iconfont iconiconfront-2'} onClick={_close}/>
+          closable &&
+          (re.test(closeIcon)
+            ? <img src={closeIcon} alt="" className={'close-icon'} onClick={_close}/>
+            : <i className={`close iconfont ${closeIcon}`} onClick={_close}/>)
         }
       </div>
     </div>
@@ -47,7 +75,8 @@ function ClosablePopup({
   ReactDOM.render(closablePopup, div)
 
   return {
-    close: _close
+    close: _close,
+    remove: unmountComponent
   }
 }
 

src/common/closable-popup/index.scss

@@ -31,5 +31,16 @@
             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/common/confirmPhone/index.js

+import React, { Component } from 'react';
+import { Toast } from 'antd-mobile';
+import { http } from '@/utils';
+import './index.scss';
+
+class ConfirmPhone extends Component {
+  continueBindPhone = () => {
+    const { data, successBindPhone } = this.props;
+    http.post(
+      `${API.home}/sys/v2/user/bindMobile`,
+      {  
+        ...data,
+        type: 1, // 1：绑定，2：修改绑定
+        is_valid: 0, // is_valid	是否验证 1:验证（默认）,0不验证
+      }
+    ).then(res => {
+      const { code, msg } = res.data;
+      if(code === 200 ) {
+        successBindPhone();
+      }else {
+        Toast.info(msg, 2, null, false);
+      }
+    });
+  }
+
+  render() {
+    const { 
+      bindInfo = { }, 
+      desc, 
+      skip = 'year', 
+      handleToCancle 
+    } = this.props;
+    return (
+      <div className="popup-bind" data-skip={skip}>
+        <h2 className="popup-bind__title">绑定手机号</h2>
+        {
+          desc
+          ? <div className="popup-bind__desc">{desc}</div>
+          : <p className="popup-bind__desc">该手机号已绑定到以下账号，继续绑定将解除以下绑定状态</p>
+        }
+        <ul className="popup-bind__list">
+          {
+            bindInfo['email'] &&
+            <li className="popup-bind__account">
+
+              {/* 邮箱 */}
+              <i className="popup-bind__icon" data-plat="mail"></i>
+              <p className="popup-bind__account--name">{bindInfo['email']}</p>
+            </li>
+          }
+          {
+            bindInfo['wechat_nickname'] &&
+            <li className="popup-bind__account">
+
+              {/* wechat */}
+              <i className="popup-bind__icon" data-plat="wachat"></i>
+              <p className="popup-bind__account--name">{bindInfo['wechat_nickname']}</p>
+            </li>
+          }
+          {
+            bindInfo['qq_nickname'] &&
+            <li className="popup-bind__account">
+
+              {/* qq */}
+              <i className="popup-bind__icon" data-plat="qq"></i>
+              <p className="popup-bind__account--name">{bindInfo['qq_nickname']}</p>
+            </li>
+          }
+          {
+            bindInfo['sina_nickname'] &&
+            <li className="popup-bind__account">
+
+              {/* 微博 */}
+              <i className="popup-bind__icon" data-plat="sina"></i>
+              <p className="popup-bind__account--name">{bindInfo['sina_nickname']}</p>
+            </li>
+          }
+        </ul>
+        <div className="popup-bind__footer">
+          <button
+          className="popup-bind__button popup-bind__button--cancle"
+          onClick={handleToCancle}>取消</button>
+          <button
+          className="popup-bind__button popup-bind__button--confirm"
+          onClick={this.continueBindPhone}>继续绑定</button>
+        </div>
+      </div>
+    )
+  }
+}
+
+export default ConfirmPhone;
\ No newline at end of file

src/common/confirmPhone/index.scss

+[data-skip="default"] {
+  .popup-bind__desc {
+    width: 249px;
+    font-size: 15px;
+    color: #666;
+    line-height: 21px;
+  }
+
+  .popup-bind__account {
+    padding: 4px;
+  }
+
+  .popup-bind__account--name {
+    padding-left: 7px;
+    font-size: 12px;
+    color: #999;
+  }
+
+  .popup-bind__icon {
+    width: 22px;
+    height: 22px;
+  }
+
+  .popup-bind__footer {
+    padding: 0 18px;
+  }
+  
+  .popup-bind__button {
+    width: 105px;
+    height: 30px;
+    border-radius: 15px;
+    font-size: 14px;
+  }
+
+  .popup-bind__button--cancle {
+    border: 1px solid #0099FF;
+    color: #0099FF;
+  }
+
+  .popup-bind__button--confirm {
+    border-style: none;
+    color: #fff;
+    background-color: #0099FF;
+  }
+}
+
+[data-skip="year"] {
+  .popup-bind__title {
+    margin: 10px 0 0;
+    font-size: 18px;
+    color: #111;
+    line-height: 1;
+    text-align: center;
+  }
+
+  .popup-bind__desc {
+    width: 269px;
+    font-size: 12px;
+    color: #FF2121;
+    line-height: 18px;
+  }
+
+  .popup-bind__account {
+    padding: 14px 4px;
+  }
+
+  .popup-bind__account--name {
+    padding-left: 12px;
+    font-size: 15px;
+    color: #090909;
+  }
+
+  .popup-bind__icon {
+    width: 33px;
+    height: 33px;
+  }
+
+  .popup-bind__footer {
+    padding: 0 15px;
+    margin-bottom: 14px;
+  }
+  
+  .popup-bind__button {
+    width: 130px;
+    height: 44px;
+    border-radius: 5px;
+    font-size: 16px;
+  }
+  
+  .popup-bind__button--cancle {
+    border: 1px solid #090909;
+    color: #090909;
+  }
+
+  .popup-bind__button--confirm {
+    border: 1px solid #090909;
+    color: #090909;
+    background-color: #FFE319;
+  }
+}
+
+
+.popup-bind {
+  text-align: center;
+}
+
+.popup-bind__desc {
+  margin: 10px 15px 0;
+  text-align: left;
+}
+
+.popup-bind__list {
+  padding: 0 0 10px;
+}
+
+.popup-bind__account {
+  display: flex;
+  align-items: center;
+  margin: 0 52px;
+  text-align: left;
+
+  &:nth-child(n+2) {
+    border-top: 1px solid #E5E5E5;
+  }
+}
+
+.popup-bind__account--name {
+  margin: 0;
+}
+
+.popup-bind__icon {
+  display: inline-block;
+  background-size: auto 100%;
+  background-repeat: no-repeat;
+  background-position: center;
+
+  &[data-plat="mail"] {
+    background-image: url('https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/H5/icon-mail.png');
+  }
+
+  &[data-plat="sina"] {
+    background-image: url('https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/H5/icon-sina.png');
+  }
+
+  &[data-plat="qq"] {
+    background-image: url('https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/H5/icon-qq.png');
+  }
+
+  &[data-plat="wachat"] {
+    background-image: url('https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/H5/icon-wechat.png');
+  }
+}
+
+.popup-bind__footer {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+
+.popup-bind__button {
+  box-sizing: border-box;
+  cursor: pointer;
+  outline: none;
+}
+
+.popup-bind__button--cancle {
+  background-color: transparent;
+}
\ No newline at end of file

src/components/Index/index.scss

@@ -740,6 +740,10 @@
   //  //}
 }
 
+.index-box + .nav-bar + .year19-index{
+  display: none;
+}
+
 .borderTop {
   width: 100%;
   height: 8px;

src/components/activity/index.scss → src/components/activity/1111/index.scss

@@ -6,13 +6,13 @@
   .banner__con {
     width: 100%;
     height: 170px;
-    background: url('./images/formal-banner.png') center center no-repeat;
+    background: url('images/formal-banner.png') center center no-repeat;
     background-size: 100% 100%;
   }
   .content__con {
     width: 100%;
     height: 454px;
-    background: url('./images/dalibao_bj.png') center center no-repeat;
+    background: url('images/dalibao_bj.png') center center no-repeat;
     background-size: 100% 100%;
     position: relative;
 
@@ -55,7 +55,7 @@
       .img__con {
         width: 88px;
         height: 16px;
-        background: url('./images/value.png') center center no-repeat;
+        background: url('images/value.png') center center no-repeat;
         background-size: 100% 100%;
         margin-left: 4px;
       }
@@ -186,7 +186,7 @@
       font-weight:400;
       color:rgba(255,255,255,1);
       width: 240px;
-      background: url('./images/yaoqh_bj.png') center center no-repeat;
+      background: url('images/yaoqh_bj.png') center center no-repeat;
       background-size: 100% 50%;
       text-align: center;
       text-align-last: center;
@@ -292,7 +292,7 @@
     .share__row {
       width: 60px;
       height: 44px;
-      background: url('./images/throw_icon.png') center center no-repeat;
+      background: url('images/throw_icon.png') center center no-repeat;
       background-size: 100% 100%;
       position: absolute;
       right: 15px;

src/components/activity/newyear-2019/box-container/box-container.scss

+.box-container {
+    position: relative;
+    background: #327443 url("https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/PC/sd_nr_bj2.png") repeat-y;
+    background-size: 100% auto;
+    padding: 14px 0;
+
+    .image-box {
+        height: 100%;
+
+    }
+
+    @mixin common-deco($bg) {
+        content: '';
+        position: absolute;
+        left: 0;
+        width: 100%;
+        height: 14px;
+        display: block;
+        background: url($bg) no-repeat;
+        background-size: 375px auto;
+    }
+
+    &::before {
+        @include common-deco("https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/PC/sd_nr_bj1.png");
+        top: 0;
+    }
+
+    &::after {
+        @include common-deco("https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/PC/sd_nr_bj3.png");
+        bottom: 0;
+    }
+}