大咖直播

src/components/blessingPreheat/live/index.js

@@ -16,9 +16,9 @@ class Live extends Component {
 
   state = {
     tabs: [],
-    lives: {},
+    lives: [],
     preheatLives: [],
-    today: '',
+    todayIndex: '',
     isApp: getParam('version'),
     QRCodeUrl: '',
   }
@@ -27,45 +27,20 @@ class Live extends Component {
   componentDidMount() {
     http.get(`${API.home}/sys/get_live_info`)
       .then(res => {
-        const {data} = res
-        if (data.code == 200) {
-
-          const lives = data.data['data_active'].reduce((accu, current) => {
-            if (!(current.date in accu)) {
-              accu[current.date] = [current]
-            } else {
-              accu[current.date].push(current)
-            }
-            return accu
-          }, {})
-          const preheatLives = data.data['data_hot'].reduce((accu, current) => {
-            if (!(current.date in accu)) {
-              accu[current.date] = [current]
-            } else {
-              accu[current.date].push(current)
-            }
-            return accu
-          }, {})
-
-          let tabs, today
-          if (this.props.isFormal) {
-            tabs = Object.keys(lives).map(item => ({title: item}))
-            today = uniqBy(data.data['data_active'], value => value.date).findIndex(item => item['is_today'])
-          } else {
-            tabs = Object.keys(preheatLives).map(item => ({title: item}))
-            today = uniqBy(data.data['data_hot'], value => value.date).findIndex(item => item['is_today'])
-          }
-
+        const {data, code, msg} = res.data
+        if (code == 200) {
+          let tabs = uniqBy(data, item => item.date)
+          tabs = tabs.map(item => ({title: item.date}))
+          let todayIndex = data.findIndex(item => item['is_today'])
 
           this.setState({
             tabs,
-            lives,
-            today,
-            preheatLives
+            lives: data,
+            todayIndex: todayIndex < 0 ? 0 : todayIndex,
           })
 
         } else {
-          Toast.info(data.msg, 2, null, false)
+          Toast.info(msg, 2, null, false)
         }
 
       })
@@ -73,9 +48,9 @@ class Live extends Component {
 
   toLiveRoom = id => {
     const {history, isLogin} = this.props
-    var _czc = _czc || [];
-    var name = '直播间id=' + id;
-    _czc.push(["_trackEvent", name, 'm端双十一大咖直播-正在直播']);
+    var _czc = _czc || []
+    var name = '直播间id=' + id
+    _czc.push(["_trackEvent", name, 'm端双十一大咖直播-正在直播'])
     if (this.state.isApp) {
       if (isLogin) {
         SendMessageToApp('toLiveRoom', id)
@@ -108,8 +83,8 @@ class Live extends Component {
       history.push('/passport/login')
     }
 
-    var name = '直播间id=' + id;
-    _czc.push(["_trackEvent", name, 'm端双十一大咖直播-立即预约']);
+    var name = '直播间id=' + id
+    _czc.push(["_trackEvent", name, 'm端双十一大咖直播-立即预约'])
 
     http.get(`${API['base-api']}/sys/createLiveQrcode/${id}`)
       .then(res => {
@@ -146,7 +121,7 @@ class Live extends Component {
   }
 
   render() {
-    const {tabs, lives, preheatLives, today} = this.state
+    const {tabs, lives, today} = this.state
     return (
       <div id={'live'}>
         <div className="title">
@@ -167,37 +142,21 @@ class Live extends Component {
               swipeable={false}
             >
               {
-                this.props.isFormal
-                  ? tabs.map((item, index) => {
-                    const todayLives = lives[item.title]
-                    return (
-                      <div key={index}>
-                        {
-                          todayLives && todayLives.map((item, index) => {
-                            return (
-                              <LiveContent item={item} key={index} makeSubscribe={this.makeSubscribe}
-                                           toLiveRoom={this.toLiveRoom}/>
-                            )
-                          })
-                        }
-                      </div>
-                    )
-                  })
-                  : tabs.map((item, index) => {
-                    const todayLives = preheatLives[item.title]
-                    return (
-                      <div key={index}>
-                        {
-                          todayLives && todayLives.map((item, index) => {
-                            return (
-                              <LiveContent item={item} key={index} makeSubscribe={this.makeSubscribe}
-                                           toLiveRoom={this.toLiveRoom}/>
-                            )
-                          })
-                        }
-                      </div>
-                    )
-                  })
+                tabs.map((item, index) => {
+                  const todayLives = lives.filter(liveItem => liveItem.date === item.title)
+                  return (
+                    <div key={index}>
+                      {
+                        todayLives && todayLives.map((item, index) => {
+                          return (
+                            <LiveContent item={item} key={index} makeSubscribe={this.makeSubscribe}
+                                         toLiveRoom={this.toLiveRoom}/>
+                          )
+                        })
+                      }
+                    </div>
+                  )
+                })
               }
             </Tabs>
 

src/components/blessingPreheat/live/index.scss

@@ -182,6 +182,7 @@
         color: #fff;
 
         & .am-tabs-default-bar-tab:nth-last-of-type(2) {
+            width: 21% !important;
             &::after {
                 display: none;
             }
@@ -211,14 +212,17 @@
             }
         }
 
+
         .am-tabs-default-bar-tab-active {
             background: #FFF604;
             border-radius: 0 0 5px 5px;
         }
-        .am-tabs-default-bar-top{
-            .am-tabs-default-bar-content{
+
+        .am-tabs-default-bar-top {
+            .am-tabs-default-bar-content {
                 border: 1px solid rgba(255, 246, 4, 1);
                 border-radius: 0 0 6px 6px;
+                overflow: hidden;
             }
         }