"use client"
import { SelectBox } from '@common/business_components/ui';
import React, { useState } from 'react'
import FileUploadForm from './fileUploadForm';
import { yearOptions } from '../lib/utils';

const operFileUploadForm = ({ title, onSubmit }: { title: string, onSubmit: (files: string, year: string, quarter: string, code:string, id:string) => void }) => {
    const [atflCd, setAtflCd] = useState<string | null>(null);
    const [atflId, setAtflId] = useState<string | null>(null);


    const quater = [{ text: '1분기', val: '1' }, { text: '2분기', val: '2' }, { text: '3분기', val: '3' }, { text: '4분기', val: '4' }]
    const [selectedYear, setSelectedYear] = useState<string>(yearOptions[0]?.val || '');
    const [selectedQuarter, setSelectedQuarter] = useState<string>(quater[0]?.val || '');

    return (
        <div>
            <div className='card-header'>
                <h3 className="text-2xl font-medium">{title}</h3>
            </div>
            <div className="card p-6">
                <div className="grid grid-col-2 items-center space-x-4">
                    <div className='flex'>
                        <SelectBox
                            className="w-50 mr-3 ml-4"
                            selectClass="rounded-lg bg-white"
                            label="년도"
                            selectArray={yearOptions}
                            onSelectValue={(value: string | number) => setSelectedYear(String(value))}
                        /><SelectBox
                            className="w-50"
                            selectClass="rounded-lg bg-white"
                            label="분기"
                            selectArray={quater}
                            onSelectValue={(value: string | number) => setSelectedQuarter(String(value))}
                        />
                        <FileUploadForm
                             onSubmit={(files, year, quarter, code, id) => {
                                onSubmit(files, (selectedYear ?? year) || '', (selectedQuarter ?? quarter) || '', code, id);
                            }}
                            showButton={true}
                            showPreview={true}
                            accept={""} />
                    </div>
                </div>
            </div>
        </div>
    )
}

export default operFileUploadForm