import React , { forwardRef, useEffect, useState } from 'react';
import { Modal , Form , Checkbox , Input , Table } from 'antd';
import Upload from './Upload';
import { AlignCenter } from '../Component/layout';
import axios from 'axios';
const { TextArea } = Input;

const data = [
  {name:"sdfkjsfj.pdf",loadNum:"10",citeNum:"15",time:"2021-04-01 10:45"},
  {name:"sdfkjsfj.pdf",loadNum:"10",citeNum:"15",time:"2021-04-01 10:45"},
  {name:"sdfkjsfj.pdf",loadNum:"10",citeNum:"15",time:"2021-04-01 10:45"}
]
const https = 'https://testfiles.trustie.net';
function UploadSource({ form , visible , onCancel , onOk , showNotification ,owner,projectsId}){
  const [ tableData , setTableData ] = useState(data);
  const [ fileId , setFilesId ] = useState(undefined);
  const [ fileName , setFileName ] = useState(undefined);
  const { getFieldDecorator, validateFields , setFieldsValue } = form;

  // 上传附件后得到的文件id数组
  function UploadFunc(id,name){
    setFilesId(id);
    setFileName(name);
  }

  const columns = [
    {
      dataIndex:"name",
      key:"name",
      title:"资源名称",
      width:"45%",
      ellipsis:true,
      render:(value,item,key)=>{
        return <AlignCenter>
          <div className="task-hide" style={{maxWidth:key===0 ? "250px":"100%"}}>{value}</div>
          { key === 0 && <span className="currentTip">当前版本</span> }
        </AlignCenter>
      }
    },
    {
      dataIndex:"loadNum",
      key:"loadNum",
      title:"下载数",
      width:"15%",
      className:"edu-txt-center"
    },
    {
      dataIndex:"citeNum",
      key:"citeNum",
      title:"引用数",
      width:"15%",
      className:"edu-txt-center"
    },
    {
      dataIndex:"time",
      key:"time",
      title:"上传时间",
      width:"25%"
    }
  ]

  // 确定
  function submit(){
    if(fileId){
      validateFields((error,values)=>{
        if(!error){
          postInfo(values);
        }
      })
    }else{
      showNotification("请先上传文件！");
    }
  }

  function postInfo(values){
    const url = https+`/api/project/achievement/`;
    
    axios.post(url,{
      fileId:`${fileId}`,
      fileName,
      login:owner,
      projectId:projectsId,
      ...values
    }).then(result=>{
      if(result && result.data){
        onOk();
      }
    }).catch(error=>{})
  }
  return(
    <Modal 
      title={"上传资源"}
      closable={false}
      visible={visible}
      onCancel={onCancel}
      onOk={submit}
      cancelText="取消"
      okText="确定"
      width="600px"
      centered
    >
      <div>
        <Form>
          <Table className="versionTable" columns={columns} dataSource={tableData} pagination={false} size={"small"}/>
          <Form.Item>
            {getFieldDecorator("tagNames",{
              rules:[]
            })(
              <Checkbox.Group>
                <Checkbox value="软件版本">软件版本</Checkbox>
                <Checkbox value="文档">文档</Checkbox>
                <Checkbox value="代码">代码</Checkbox>
                <Checkbox value="媒体">媒体</Checkbox>
                <Checkbox value="论文">论文</Checkbox>
                <Checkbox value="其它">其它</Checkbox>
              </Checkbox.Group>
            )}
          </Form.Item>
          <Upload 
            className="commentStyle"
            load={UploadFunc}
            size={100}
            showNotification={showNotification}
            actionUrl= {https}
          />
          <Form.Item className="mt20">
            {getFieldDecorator("remark",{
              rules:[]
            })(
              <TextArea rows={4} placeholder="请输入资源描述" />
            )}
          </Form.Item>
        </Form>
      </div>
    </Modal>
  )
}
export default UploadSource;
