公共组件

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

+import React, { Component } from 'react'
+import './index.scss'
+
+export default class CommonContainer extends Component {
+  constructor(props) {
+    super(props)
+  }
+  render() {
+    return (
+      <div className='common_container'>
+        <div className='container_top'></div>
+        <div className='container_content'>
+          <div className='title_container'>
+            <i></i>
+            <p>{this.props.title}</p>
+            <i></i>
+          </div>
+          {
+            React.Children.map(this.props.children, function (child) {
+              return <>{child}</>;
+            })
+          }
+        </div>
+        <div className='container_bottom'></div>
+      </div>
+    )
+  }
+}

src/components/activity/newyear-2019/common/commonContainer/index.scss

+.common_container {
+  .title_container {
+    width: 100%;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-content: center;
+    i {
+      width: 230px;
+      height: 2px;
+      background: linear-gradient(
+        90deg,
+        rgba(254, 228, 29, 0) 0%,
+        rgba(254, 228, 29, 0.98) 48%,
+        rgba(254, 228, 29, 0) 100%
+      );
+    }
+    p {
+      font-size: 18px;
+      line-height: 18px;
+      font-weight: 500;
+      color: rgba(254, 228, 29, 1);
+      margin: 8px auto;
+
+      background: linear-gradient(
+        0deg,
+        rgba(254, 228, 29, 1) 23.9013671875%,
+        rgba(255, 204, 0, 1) 50.146484375%,
+        rgba(254, 228, 29, 1) 75%
+      );
+      background-clip: text;
+      -webkit-text-fill-color: transparent;
+    }
+  }
+  .container_top {
+    background: url("https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/H5/m_top_bj.png")
+      center center no-repeat;
+    background-size: 100% 100%;
+    width: 100%;
+    height: 18px;
+  }
+  .container_bottom {
+    background: url("https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/H5/m_bottom_bj.png")
+      center center no-repeat;
+    background-size: 100% 100%;
+    width: 100%;
+    height: 22px;
+  }
+  .container_content {
+    background: url("https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/H5/m_middle_bj.png")
+      center center no-repeat;
+    background-size: 100% 100%;
+    width: 100%;
+    min-height: 25px;
+  }
+}

src/components/activity/newyear-2019/preheat/LiveRoom/index.js

+import React, { Component } from 'react';
+import './index.scss';
+import CommonContainer from './../../common/commonContainer/index'
+
+export default class index extends Component {
+  render() {
+    return (
+      <div>
+        <CommonContainer title='大咖直播'>
+          <div>
+
+          </div>
+        </CommonContainer>
+      </div>
+    )
+  }
+}

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

+import React, { Component } from 'react'
+import './index.scss'
+import LiveRoom from './LiveRoom/index';
+
+export default class index extends Component {
+  render() {
+    return (
+      <div>
+        <LiveRoom />
+      </div>
+    )
+  }
+}

src/router/router-config.js

@@ -233,4 +233,9 @@ export default [
         path: '/activity/newyear-2019/landing',
         component: loadable(() => import(/* webpackChunkName: 'newyear-2019-landing'*/ '@components/activity/newyear-2019/landing/index'))
     },
+    // 双旦活动预热页面
+    {
+        path: '/year/yearIndex',
+        component: loadable(() => import(/* webpackChunkName: 'newyear-yearIndex' */ '@components/activity/newyear-2019/preheat/index'))
+    }
 ]