index.js 2.85 KB
import React, { Component } from 'react'
import { connect } from 'dva'
import { Link } from 'dva/router'
import shareHide from "../../utils/shareHide";
import {Toast} from "antd-mobile";
import NoData from "../../components/NoData";

import styles from './poster.less';

class Poster extends Component {
  constructor(){
    super()
    this.state={
      posterList: [],
      selIdx: 0,
      filterType: ['鸡汤', '节日', '产品'],
      loadingFlag:true

    }
  }

  componentWillMount(){
    //Toast.loading('loading...',0);
  }
  componentDidMount() {
    document.title = '海报'
    shareHide();
     let key = Number(sessionStorage.getItem("key"));
     if(key == 1){
        this.filter('节日');
     }else if (key == 2) {
        this.filter('产品');
     }else{
        this.filter('鸡汤');
     }
  }
 componentWillUnmount(){
  document.title = ''
 }
  filter(type) {
    Toast.loading('loading...',0)
    const _this = this;
    this.props.dispatch({
      type: 'poster/getPosterList',
      payload: {
        reportType: type,
        agentCode1: window.localStorage.getItem('orgId'),
        agentCode2: window.localStorage.getItem('project')
      },
      callback(res) {
        Toast.hide();
        if (typeof res.data === 'object') {
          _this.setState({
            posterList: res.data,
            loadingFlag:false
          })
        } else {
           _this.setState({
             posterList: [],
             loadingFlag:false
           })
        }
      }
    })
  }


  render() {
   let selIdx = 0;
    if(sessionStorage.getItem("key")){
      selIdx = Number(sessionStorage.getItem("key"))
    }
    const { posterList } = this.state;

    if(this.state.loadingFlag){
      return <div></div>
    }
    return (
      <div className={styles.wrapper}>
        <div className={styles.tabCon}>
          <div className={styles.splitline}></div><ul className={styles.tags}>
          {
            this.state.filterType.map((el, i) => {
              return <li className={selIdx ===i?'on':''} key={i} onClick={() => {
                this.filter(el);
                this.setState({
                  selIdx:i
                })
                sessionStorage.setItem( "key", i);
              }}>{el}</li>
            })
          }
          </ul>

          <ul className={styles.pList}>
            {
             posterList.length>0 ? posterList.map((el, i) => {
                return <li key={i}>
                  <Link to={{
                pathname: "/poster/info",
                    state: {
                      id: el.reportCode,
                      reportImage: el.reportImage
                    }
              }}><img alt="" src={el.reportImage} /></Link>
                </li>
              }): <NoData />
            }
          </ul>
        </div>
      </div>
    )
  }
}


export default connect(({ poster }) => ({ poster }))(Poster)