import React, { Component } from 'react';
import classnames from 'classnames';
import './nav.scss';

class TreasureNav extends Component {
  constructor(props) {
    super(props);
    this.state = {
      curIndex: 1,
      navs: [
        {
          id: 'year-treasure',
          name: '组队开宝箱'
        },
        {
          id: 'year-course',
          name: '重磅好课'
        },
        {
          id: 'year-free',
          name: '免费专区'
        },
        {
          id: 'year-group',
          name: '一元拼团'
        },
        {
          id: 'year-discount',
          name: '一折起购专区'
        },
      ]
    };
  }

  render() {
    const { curIndex, navs } = this.state;
    return (
      <div className="treasure-nav" data-skip="nav">
        {
          navs.map((item, index) => (
            <a 
              href="" 
              className={classnames("treasure-nav__item",{'active': index === curIndex})} 
              key={item.id}
            >{item.name}</a>
          ))
        }
      </div>
    )
  }
}

export default TreasureNav;