import React, { useState } from 'react';
import { Form, Input, Button, DatePicker } from 'antd';
import styles from './RegulationCompliance.less';

const RegulationCompliance = () => {
    const [form] = Form.useForm();

    const handleSearch = (values) => {
        console.log('搜索参数:', values);
        // TODO: 实现搜索功能
    };

    const handleReset = () => {
        form.resetFields();
        // TODO: 重置搜索
    };

    return (
        <div className={styles.regulationContainer}>
            {/* 第一块：搜索表单 */}
            <div className={styles.searchSection}>
                <Form form={form} layout="inline" onFinish={handleSearch}>
                    <Form.Item label="法规名称" name="regulationName">
                        <Input placeholder="请输入" style={{ width: 160, borderRadius: '2px' }} />
                    </Form.Item>
                    <Form.Item label="发布部门" name="regulationNumber">
                        <Input placeholder="请输入" style={{ width: 160, borderRadius: '2px' }} />
                    </Form.Item>
                    <Form.Item label="发布日期" name="publishDate">
                        <DatePicker placeholder="请选择" style={{ width: 160, borderRadius: '2px' }} />
                    </Form.Item>
                    <Form.Item>
                        <Button 
                            type="primary" 
                            htmlType="submit"
                            style={{ backgroundColor: '#00D48A', borderColor: '#00D48A', color: '#fff', borderRadius: '4px' }}
                        >
                            查询
                        </Button>
                    </Form.Item>
                    <Form.Item>
                        <Button onClick={handleReset} style={{ borderRadius: '4px' }}>
                            重置
                        </Button>
                    </Form.Item>
                </Form>
            </div>

            {/* 第二块：表格区域（待开发） */}
            <div className={styles.tableSection}>
                <div className={styles.developingTip}>待开发</div>
            </div>
        </div>
    );
};

export default RegulationCompliance;