import React from 'react'
import './index.css'
import { UploadOutlined } from '@ant-design/icons'
import { Button, message, Upload,Input } from 'antd'

const props = {
	name: 'file',
	action: 'https://www.mocky.io/v2/5cc8019d300000980a055e76',
	headers: {
		authorization: 'authorization-text',
	},

	onChange(info) {
		if (info.file.status !== 'uploading') {
			console.log(info.file, info.fileList)
		}

		if (info.file.status === 'done') {
			message.success(`${info.file.name} file uploaded successfully`)
		} else if (info.file.status === 'error') {
			message.error(`${info.file.name} file upload failed.`)
		}
	},
}

export default function EnclosureTabs() {
	return (
		<div className="EnclosureTabs-box">
			<h2>附件</h2>
			<Upload {...props}>
				<Button icon={<UploadOutlined />}>附件上传</Button>
			</Upload>
			<p>
				支持文档，图片，压缩包，视频，音频，设计文件等格式文件。单次上传文件总量请小于50MB。
			</p>

			<h2>个人链接</h2>
			<Input.Group compact>
				<Input
					style={{
						width: 'calc(100% - 70px)',
					}}
					defaultValue="请输入"
				/>
				<Button type="primary">保存</Button>
			</Input.Group>
		</div>
	)
}