import React, { Component } from 'react'
import {Tabs,Table,message,Divider,Pagination} from 'antd';
import './index.css'
import  request from '../../../utils/request'
import qs from 'qs'

export default class AutoimmuneDiseases extends Component {
    state={
        ClinicalIndicationData:[],
        total_num:0,
        
        searchData:{
            clinicalIndication:qs.parse(this.props.location.search.slice(1)).clinicalIndication,
            pageNum:1,
            pageSize:10
        }
    }
    componentDidMount(){
        this.getClinicalIndicationList()
      }
      getPdid(e){
        let data={
          dataid:e,
          defaultActiveKey:'Antibody'
          
        }
  
        this.props.history.push({ pathname: '/home/SearchDetails', search: qs.stringify(data)})
  
      }
      clinicalIndicationPdid(e){
        let data={
          dataid:e,
          defaultActiveKey:'ClinicalIndication'
          
        }
  
        this.props.history.push({ pathname: '/home/SearchDetails', search: qs.stringify(data)})
  
      }
      TargetPdid(e){
        let data={
          dataid:e,
          defaultActiveKey:'Antigen'
          
        }
  
        this.props.history.push({ pathname: '/home/SearchDetails', search: qs.stringify(data)})
  
      }
    getClinicalIndicationList(){
        const{id}=this.state
        this.setState({loading:true})
        request.post('/therapeutic/clinical-indication/page-list',this.state.searchData)
        .then(res => {
          console.log(res)
          if (res.data.code===0) {
            console.log(res.data.data);
            this.setState({total_num:Number(res.data.data.total)})
            
            this.setState({ClinicalIndicationData:res.data.data.records})
            this.setState({loading:false}
              )
           
          }else{
            message.error(res.data.msg);
          }
        })
        .catch(err => {
          console.error(err); 
        })
    
      }
      onShowSizeChange=(current, pageSize)=>{
        let searchData = this.state.searchData;
        searchData.pageNum=current
        searchData.pageSize=pageSize
        this.setState({
          searchData
        })
        
        this.getClinicalIndicationList()
      }
      onChange=(current, pageSize)=>{
       
          let searchData = this.state.searchData;
          searchData.pageNum=current
          searchData.pageSize=pageSize
          this.setState({
            searchData
          })
          
          this.getClinicalIndicationList()

        }
  render() {
      const{ClinicalIndicationData,total_num}=this.state
      const columns = [
        {
          title: 'clinicalIndication',
          dataIndex: 'clinicalIndication',
          key: 'clinicalIndication',
          render: text => <a>{text}</a>,
        },
        {
          title: 'Antibody',
          dataIndex: 'antibodyName',
          key: 'antibodyName',
          render: (text, record )=> <a onClick={()=>this.getPdid(record.therapeuticId)} >{text}</a>,
        },
        {
          title: 'Antigen',
          dataIndex: 'target',
          key: 'target',
          render: (text, record )=><a onClick={()=>this.TargetPdid(record.therapeuticId)}>{text}</a>,
        },
        {
          title: 'Status',
          dataIndex: 'developmentStatus',
          key: 'developmentStatus',
        },
        {
          title: 'Company',
          key: 'company',
          dataIndex: 'company',
       
        },
      ];
    return (
      <div className='AutoimmuneDiseases-div'>
        {/* <div className='title-div'>
        Clinical indication： Autoimmune diseases
        </div> */}
        <div className='center-div'>
        <Table  rowKey='id' style={{backgroundColor: '#fff'}} columns={columns} pagination={false} dataSource={ClinicalIndicationData} />
        </div>
        <div className='bottom-div'>
        <Pagination
            showSizeChanger
            onShowSizeChange={this.onShowSizeChange}
            onChange={this.onChange}
            total={total_num}
          />
        </div>
      </div>
    )
  }
}
