// 核心库
import React from 'react'
import { connect } from 'dva'
// 组件库
import { Form, Table, Tabs } from 'antd'
import { Search, LayoutCard } from '@woowalker/feui'
// 工具库
import { initFilter, addRuleAndGroups } from '../../../utils/common'

const { TabPane } = Tabs;

class EmEnergyValMonthPage extends React.Component {
  constructor(props) {
    super(props)
    this.state = {
      searchRules: [],
      listTable: [],
    }
  }

  componentDidMount() {
    this.getTableData()
  }

  handleSearch = (value) => {
    this.setState({
      searchRules: value
    }, () => {
      this.getTableData(value)
    })
  }

  getTableData = (value) => {
    const { login, dispatch } = this.props
    const json = initFilter(login.OrgId)
    addRuleAndGroups(json, value)

    dispatch({
      type: 'app/getDataByPost',
      url: 'EM/EMEnergyVal/GetMonthValData',
      payload: json,
      onlyData: false,
      onComplete: (res) => {
        if (res && res.IsSuccessful && res.Data) {
          const { listTable } = res.Data
          const currState = {
            listTable: listTable
          }
          this.setState(currState)
        }
      }
    })
  };

  render() {
    const { formId, formCode } = this.props

    return (
      <>
        <Search
          formId={formId}
          formCode={formCode}
          onSearch={this.handleSearch}
        />
        <LayoutCard>
          <Tabs defaultActiveKey="0">
            {
              this.state.listTable.map((item, l) => {
                const columns = []
                item.ListTableHead.forEach((n, i) => {
                  var item2 = {
                    title: n.Title, dataIndex: n.DataIndex
                  };
                  columns.push(item2);
                });
                return (
                  <TabPane tab={item.Time} key={l}>
                    <Table size="small" columns={columns} dataSource={item.DicList} pagination={false} bordered />
                  </TabPane>
                )
              })
            }
          </Tabs>
        </LayoutCard>
      </>
    )
  }

}

EmEnergyValMonthPage.propTypes = {
}

export default connect(({ login, loading, EMemOrder, custom, app }) => ({ login, loading, EMemOrder, custom, app }))(Form.create()(EmEnergyValMonthPage))
