/**
 * Created by baoyinghai on 6/9/17.
 */
import React from 'react';
import { push } from 'react-router-redux';
import { dispatch } from '../../../../framework/service/DispatchService';
import { iconWrapper } from '../../../../framework/utils/IconHelper';
import { CONTAINER_PRE } from '../../../../framework/entrance/routes';
import { saveProcessMenuCode, saveEnterMenuId } from '../../../../framework/service/SessionStorage';
import { isApply, isReview } from '../../../../framework/utils/ProcessHelper';
import { getMenu } from '../../../../framework/service/CacheService';
import { getMenuItemAndPathByFunc } from '../../../../framework/utils/MenuHelper';
import { Tabs } from '../../../mxa';
import "./chart-flow.less";

const reg = /^(.*\w+)(Review|Apply)(List\/.*)$/;

const TabPane = Tabs.TabPane;

const FLOW_TYPE = {
  ApplyToDo: '待处理',
  ApplyReturn: '被退回',
  ReviewToDo: '待审核'
};


export default class FlowComp extends React.Component {

  constructor(props) {
    super(props);
    this.state = {
      activeKey: "0"
    };
  }

  _changeToNormalLink = link => {
    return link.replace(reg, "$1Review$3");
  };

  _getMenuBindParameters = link => {
    const ret = {};
    if (isApply(link)) {
      ret.menu = 'BPMApply.QueryToDo';
    } else if (isReview(link)) {
      ret.menu = 'BPMReview.QueryToDo';
    }
    return ret;
  };

  jumpToFlow = uri => {
    const hyperLink  = uri;// this._changeToNormalLink(uri);// hyperLink.replace();
    const { linkInfo } = getMenuItemAndPathByFunc(item => item.actionLink === hyperLink, getMenu());
    if (!linkInfo) {
      console.log('menu info is null!!');
      return ;
    }
    const bindParameters = this._getMenuBindParameters(hyperLink);
    saveProcessMenuCode(bindParameters.menu);
    saveEnterMenuId(linkInfo.menuCode);
    dispatch(push({ pathname: '/' + CONTAINER_PRE + hyperLink, state: { ...bindParameters } }));
  };

  renderTab = (type, index) => {
    const { dataSource = [] } = this.props;
    const data = dataSource.filter(d => d.taskType === type);
    return (
      <TabPane tab={FLOW_TYPE[type]} key={index}>
        <div className="task-wrapper">
          <div className="content-wrapper">
            {data.map(record => {
              return (
                <div className="one-record-wrapper" onClick={() => this.jumpToFlow(record.hyperLink)}>
                  <div className="one-record">
                    <span className="desc">{record.comment}</span>
                    {iconWrapper('icon-arrow')}
                    {record.quantity && (<div className="item-num">{record.quantity}</div>)}
                  </div>
                </div>
              );
            })}
          </div>
        </div>
      </TabPane>
    );
  };

  _onChange = e => {
    this.setState({
      activeKey: e
    });
  };

  render() {
    return (
      <Tabs defaultActiveKey={this.state.activeKey} size="small" onChange={this._onChange}>
        {Object.keys(FLOW_TYPE).map(this.renderTab)}
      </Tabs>
    );
  }

}

// const keyMap = {
//   // x: 'x轴',
//   // y: 'y轴',
//   // lname: '折线标题'
//   desc: '描述字段名',
//   flowType: '流程类型字段名',
//   actionLink: '链接地址'
// };

export const FlowSetting = {
  getKeys: keys => [],
};
