import SubAreaTitle from '@/components/SubAreaTitle';
import { Col, Form, Input, Row } from 'antd';

function BasicConfig() {
  return (
    <>
      <SubAreaTitle
        title="基本信息"
        image={require('@/assets/img/mirror-basic.png')}
        style={{ marginBottom: '26px' }}
      ></SubAreaTitle>
      <Row gutter={8}>
        <Col span={10}>
          <Form.Item
            label="实验名称"
            name="name"
            rules={[
              {
                required: true,
                message: '请输入实验名称',
              },
              {
                max: 64,
                message: '实验名称不能超过64个字符',
              },
            ]}
          >
            <Input placeholder="请输入实验名称" maxLength={64} showCount allowClear />
          </Form.Item>
        </Col>
      </Row>
      <Row gutter={8}>
        <Col span={20}>
          <Form.Item
            label="实验描述"
            name="description"
            rules={[
              {
                required: true,
                message: '请输入实验描述',
              },
            ]}
          >
            <Input.TextArea
              autoSize={{ minRows: 2, maxRows: 6 }}
              placeholder="请输入实验描述"
              maxLength={256}
              showCount
              allowClear
            />
          </Form.Item>
        </Col>
      </Row>
    </>
  );
}

export default BasicConfig;