import React , { useEffect , useState } from 'react';
import moment from "moment";
import { Button ,Spin , Pagination , Popconfirm } from 'antd';
import { Link } from 'react-router-dom';
import Nodata from '../Nodata';
import axios from 'axios';

const limit = 10;
function BlockchainExHistory(props){
  const [ list , setList ] = useState([]);
  let user = props.current_user;

  useEffect(()=>{
    if(user && user.login){
      getInfo();
    }
  },[])

  function getInfo(){
    const url = `/users/blockchain/get_history_trades`;
    axios.get(url,{
      params:{
        "user_id": user.user_id
      }
    }).then(result=>{
      if(result && result.data){
        setList(result.data.results);
      }
    }).catch(error=>{
      console.log(error);
    })
  }

  return(
    <div style={{minHeight:"400px"}}>
        {
          list && list.length > 0 ?
            <ul className="CIList">
              <li>
                <span>
                  <span hidden={true}></span>
                  <span className="blockchain_username ml20">{"卖家名"}</span>
                  <span className="blockchain_proj ml20">{"项目创建者/项目名"}</span>
                  <span className="blockchain_proj ml20">{"token数量:价值"}</span>
                  <span className="blockchain_username ml20">{"买家名"}</span>
                  <span className="blockchain_time ml20">{"交易创建时间"}</span>
                  <span className="blockchain_time ml20">{"交易截止时间"}</span>
                </span>
              </li>
              {list.map((item,key)=>{
                return(
                  <li key={key}>
                    <span>
                      <span id={key} hidden={true}>{item[3].id}</span>
                      <span className="blockchain_username ml20">{item[0].login}</span>
                      <span className="blockchain_proj ml20">{item[1].login + "/" + item[2].name}</span>
                      <span className="blockchain_proj ml20">{item[3].token_num + ":" + item[3].money}</span>
                      <span className="blockchain_username ml20">{item[4].login}</span>
                      <span className="blockchain_time ml20">{moment(item[3].created_at).format('YYYY-MM-DD HH:mm:ss')}</span>
                      <span className="blockchain_time ml20">{moment(item[3].updated_at).format('YYYY-MM-DD HH:mm:ss')}</span>
                    </span>
                  </li>
                )
              })}
            </ul>
            :<Nodata _html="无历史交易"/>
        }
    </div>
  )
}
export default BlockchainExHistory;
