import { useState } from "react";

import { DataGrid } from "@rsone/components";
import SearchForm from "@/components/module/SearchForm";
import type { ColumnConfig } from "@/components/type/DataGrid.type";

const NotEnteredStatus = () => {
    const [rowData, setRowData] = useState<Record<string, string | number>[]>([]);

    const columns: ColumnConfig[] = [
        { name: 'sido', fieldName: '시도', header: { text: '시도' }, mergeCells: true, editable: false, sortdisable: true },
        { name: 'sgg', fieldName: '시군구', header: { text: '시군구' }, mergeCells: true, editable: false, sortdisable: true },
        { name: '1', fieldName: '1', header: { text: '시군구' }, mergeCells: true, editable: false, sortdisable: true },
        { name: '2-1', fieldName: '2-1', header: { text: '2-1' }, mergeCells: true, editable: false, sortdisable: true },
        { name: '2-2', fieldName: '2-2', header: { text: '2-2' }, mergeCells: true, editable: false, sortdisable: true },
        { name: '2-3', fieldName: '2-3', header: { text: '2-3' }, mergeCells: true, editable: false, sortdisable: true },
        { name: '2-4', fieldName: '2-4', header: { text: '2-4' }, mergeCells: true, editable: false, sortdisable: true },
        { name: '3-1', fieldName: '3-1', header: { text: '3-1' }, mergeCells: true, editable: false, sortdisable: true },
        { name: '3-2', fieldName: '3-2', header: { text: '3-2' }, mergeCells: true, editable: false, sortdisable: true },
    ];

    const columnLayout = [
        'sido',
        'sgg',
        {
            name: 'groupA',
            hideChildHeaders: false,
            header: { text: '미입력 하수도 통계 세부항목(번호)' },
            items: ['1', '2-1', '2-2', '2-3', '2-4', '3-1', '3-2'],
        },
    ];

    return (
        <>
            <SearchForm />
            <DataGrid columnInfo={{ columns, columnLayout }} rowData={rowData} setRowData={setRowData} isExcelImport={false} fixedColumns={2} rowStartNum={2} />
        </>
    );
};

export default NotEnteredStatus;