"use client";
import { useAccess } from "@/lib/access";

import { use } from "react";
import { useEffect,useState } from "react";
import { useLang } from "@/lib/lang";
import { useConfig } from "@/lib/config";
import { useData,useFormRefs, Frame, Box, ButtonContainer, Button, CheckBox } from "@/Theme/Midone";
import { useRouter } from 'next/navigation';

export default function View({params}){
    const {laraAdmin } = useConfig();
    const {Lang} = useLang();
    let component = useFormRefs();
    const { get, getNeedles } = useData();
    let [needles, setNeedles] = useState()
    let [checked, setChecked] = useState({status:null, key:Math.random()})
    const formUrl = "/yearSemesters"; 
    const [isLoading, setIsLoading] = useState(false);

    // let id = 2 , url = laraAdmin+formUrl+"/"+id;
    let id = use(params).id , url = laraAdmin+formUrl+"/"+id;
    useEffect(() => { get(url, component, "info"); }, []);
    useEffect(() => { setChecked({ status: component?.state?.info?.archiving_user_id }); }, [component?.state?.info]);
    useEffect(() => { setChecked({ status: needles?.archiving_user_id }); }, [needles]);
    const archive = ()=>{
        let result = window.confirm(Lang('public.alert_archive'));
        if(result == true) {
            setIsLoading(true);
            getNeedles(`${laraAdmin}${formUrl}/archive-report/${id}`,(data) => {
                setNeedles;
                setIsLoading(false); // پایان لودینگ
            });
            //  setNeedles);
        }
            
    }
    const create = ()=>{
        let result = window.confirm(Lang('public.alert_create'));
        if(result == true) {
            setIsLoading(true);
            getNeedles(`${laraAdmin}${formUrl}/create-report/${id}`, (data) => {
                setIsLoading(false); // پایان لودینگ
            });
        }
    }
    const router = useRouter();
    const back = () => {
        router.back();
    };
    let data = component?.state?.info;

    return(
        <> <Frame>
                <Box key={"x"+checked.key}>
                    <div className="tiny-slider py-5 col-span-12" style={{ filter: isLoading ? 'blur(4px)' : 'none', opacity: isLoading ? 0.8 : 1,transition: 'all 0.3s ease'}}>
                        <div className="px-5 text-center sm:text-right">
                            <div className="font-medium text-lg">{Lang(["public.yearSemesters"])} : {data?.year+"-"+data?.semester}</div>
                            <div className="mt-5"> {Lang(["public.start","public.term"])+" : "+(data?.start_date)}</div>
                            <div className="mt-3"> {Lang(["public.end","public.term"])+" : "+(data?.end_date)}</div>
                        </div>
                        {/* <div className="col-span-6 px-5 mt-5">
                            {(checked.status)?
                                <div className="alert alert-outline-success alert-dismissible show flex items-center mb-2">
                                    {Lang('public.text2_archive_reports')}
                                    <br />
                                    {data?.archiving_user && Lang('public.archive_by')+" , "+data?.archiving_user?.firstname+" "+data?.archiving_user?.lastname}
                                </div>
                            :
                                <>
                                
                                    <CheckBox className="" label="title_archive_reports" id="archive" name={Lang('public.text_archive_reports')}
                                        checked={checked.status} refItem={[component, "archive_reports"]} onChange={()=>archive()} />
                                    <CheckBox className="" label="title_create_reports" id="create" name={Lang('public.text_create_reports')}
                                        refItem={[component, "create_reports"]} onChange={()=>create()} />
                                </>
                            }
                        </div> */}
                    </div>
                </Box>
           
            </Frame>
            <ButtonContainer>
                <Button className="btn btn-success mr-1 ml-1 w-24 " label="title_create_reports" onClick={()=>create()} />
                <Button className="btn btn-warning mr-1 ml-1 w-24 " label="title_archive_reports" onClick={()=>archive()} />
                <Button label="back" onClick={back} />
            </ButtonContainer>
        </>
    );
}