// import React, { useEffect, useState} from 'react';
// import {Button, Card, Col, DatePicker, Form, Input, Row} from 'antd';
// import {Link, useHistory} from 'react-router-dom';
// import {AlertMessages} from '@gtpl/shared-utils/alert-messages';
// import {HolidaysCalendarDto} from '@gtpl/shared-models/hrms';
// import { HolidaysCalendarService } from '@gtpl/shared-services/hrms';

// import './holidays-calender.css';
// import moment from 'moment';

// /* eslint-disable-next-line */

// export interface HolidaysCalenderProps {
//   holidaysCalendarData: HolidaysCalendarDto;
//   updateHoliday: (holidayName: HolidaysCalendarDto) => void;
//   isUpdate: boolean;
//   closeForm: () => void;
// }

// export function HolidaysCalender(
//   props: HolidaysCalenderProps
// ) {

//   const [form] = Form.useForm();
//   let history = useHistory();
//   const holidaysCalendarService = new HolidaysCalendarService()
//   const dateFormat = "YYYY-MM-DD";
//   const today = moment();
//   const [disable, setDisable] = useState<boolean>(false)

//   useEffect(() => {
//     if(props.holidaysCalendarData){
//       console.log(props.holidaysCalendarData)
//     }
//   }, [props.holidaysCalendarData])

//   let createdUser = "";

//   if(!props.isUpdate){
//     createdUser = localStorage.getItem("createdUser");
//   }

//   const createHoliday = (Data: HolidaysCalendarDto) => {
//     setDisable(true)
//     holidaysCalendarService.createHoliday(Data).then(res => {
//       setDisable(false)
//       if(res.status) {
//         AlertMessages.getSuccessMessage('Holiday created successfully');
//         history.push('/holidays-calendar-view');
//         onReset();
//       } else {
//         if(res.intlCode){
//           AlertMessages.getErrorMessage(res.internalMessage);
//         } else {
//           AlertMessages.getErrorMessage(res.internalMessage);
//         }
//       }
//     }).catch(err => {
//       setDisable(false)
//       AlertMessages.getErrorMessage(err.message);
//     })
//   }
//   const onReset=()=>{
//     console.log('');
//     form.resetFields();
//      }
//     const saveData = (values: HolidaysCalendarDto) => {
//       setDisable(false)
//       if(props.isUpdate){
//         console.log(values);
//         props.updateHoliday(values);
//       }else {
//         setDisable(false)
//         console.log(values);
//         createHoliday(values);
//       }
//     };
//   return (

//       <Card title={<span style={{color:'white'}}>Holidays Calendar</span>} style={{textAlign:'center'}} headStyle={{backgroundColor: '#69c0ff', border: 0 }} extra={props.isUpdate==true?"":<Link to='/holidays-calendar-view' ><Button className='panel_button' >View </Button></Link>}
//     >
//     <Form layout = "vertical" form={form} onFinish={saveData} initialValues={props.holidaysCalendarData}>
//         <Form.Item 
//         name ="holidayId" style={{display:"none"}} >
//           <Input hidden/>
//         </Form.Item>
//         <Form.Item style={{display:"none"}} name="createdUser"  initialValue={createdUser}>
//           <Input hidden/>
//         </Form.Item>
//       <Row gutter={24}>
//         <Col xs={{span:24}} sm={{span:24}} md={{span:6}} lg={{span:6}} xl={{span:6}}>
//           <Form.Item
//                 name="holidayName"
//                 label="Holiday Name"
//                 rules={[
//                   {
//                     required: true,
//                     message:"Enter valid Holiday Name."
//                   },
//                   {
//                     pattern: /^[^-\s\\0-9\[\]()*!@#$^&_\-+/%=`~{}:";'<>,.?|][a-zA-Z ]*$/,
//                     message: `Should contain only alphabets.`
//                   }
//                 ]}>
//                 <Input/>
//           </Form.Item>
//         </Col>
//         <Col xs={{span:24}} sm={{span:24}} md={{span:6}} lg={{span:6}} xl={{span:6}}>
//           <Form.Item
//                   name="holidayDate" 
//                   label="Holiday Date" rules={[{ required: true }]} >
//                  <DatePicker onChange={(val) => { moment(val).format('YYYY-MM-DD') }} style={{ width: '100%' }} />

//           </Form.Item>
//         </Col>
//         {/* <Col xs={{span:24}} sm={{span:24}} md={{span:6}} lg={{span:6}} xl={{span:6}}>
//           <Form.Item
//                  name="holidayYear" label="Holiday Year" rules={[{ required: true }]} >
//                 <DatePicker onChange={(val) => { moment(val).format('YYYY') }} style={{ width: '100%' }} picker={'year'} />

//           </Form.Item>
//         </Col> */}
//       </Row>


//         <Col span={24} style={{ textAlign: 'right' }}>
//           <Button type="primary"disabled={disable} htmlType="submit" >
//             Submit
//           </Button>
//           {(props.isUpdate!==true) &&
//           <Button htmlType="button" style={{ margin: '0 14px' }} onClick={onReset}>
//             Reset
//           </Button>
//           }
//         </Col>

//     </Form>
//    </Card>
//   );
// }



// export default HolidaysCalender;




import { Button, Card, Col, Form, Row } from 'antd';
import { useState } from 'react';
import * as XLSX from 'xlsx';
import Papa from 'papaparse';

import { Link, useHistory } from 'react-router-dom';

import React from 'react';
import { AlertMessages } from '@gtpl/shared-utils/alert-messages';
import { Excel } from 'antd-table-saveas-excel';
import { FileExcelFilled } from '@ant-design/icons';
import { bankNamesServices } from 'libs/shared-services/masters/src/lib/vendor-banks.service';
import { VendorBanksModelDtoReq } from '@gtpl/shared-models/masters';
import { HolidaysCalendarService } from '@gtpl/shared-services/hrms';
import { HolidayCalenderModelDtoReq } from 'libs/shared-models/hrms/src/lib/holidays-calendar/holiday-calendar-model';
import moment from 'moment';
import { IExcelColumn } from 'antd-table-saveas-excel/app';

export const HolidaysCalender = () => {
  const [selectedFile, setSelectedFile] = useState(null);
  const [form] = Form.useForm();
  const [data, setData] = useState();
  const [columns, setColumns] = useState([]);
  const [values, setValues] = useState([]);
  const service = new HolidaysCalendarService();
  const [loading, setLoading] = useState(false);
  const [] = useState(null);
  const history = useHistory();

  const importExcel = (file: any[]) => {
    var data = new Uint8Array(file);
    var wb = XLSX.read(data, { type: 'array', cellDates: true });
    let sheet: any[] = [];
    for (const Sheet in wb.Sheets) {
      if (Sheet) {
        if (wb.Sheets.hasOwnProperty(Sheet)) {
          sheet.push(
            XLSX.utils.sheet_to_json(wb.Sheets[Sheet], { raw: true, header: 1 })
          );
        }
      }
    }
    return sheet;
  };

  // const handleFileChange = (event) => {
  //   const file = event.target.files[0];
  //   if (file && file.type === 'text/csv') {
  //     setSelectedFile(event.target.files[0]);
  //     Papa.parse(event.target.files[0], {
  //       header: true,
  //       complete: function (result) {
  //         {
  //           const columnArray = [];
  //           const valueArray = [];

  //           result.data.map((d) => {
  //             columnArray.push(Object.keys(d));
  //             valueArray.push(Object.values(d));
  //           });
  //           setData(result.data);
  //           setColumns(columnArray[0]);
  //           setValues(valueArray);
  //         }
  //       },
  //       skipEmptyLines: true,
  //     });
  //   } else if (
  //     file &&
  //     file.type ===
  //       'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
  //   ) {
  //     setSelectedFile(event.target.files[0]);
  //     let csvData;
  //     var reader = new FileReader();
  //     reader.readAsArrayBuffer(file);
  //     reader.onload = async (data) => {
  //       let csvData1: any = reader.result;
  //       csvData = importExcel(csvData1);

  //       const filteredNestedData = csvData.filter((innerData) =>
  //         innerData.some((row) => row.length > 0)
  //       );

  //       const output = filteredNestedData.map((innerData) => {
  //         const header = innerData[0];
  //         return innerData
  //           .slice(1)
  //           .map((row) => {
  //             if (row.every((value) => value === '')) {
  //               return null;
  //             }
  //             return row.reduce((acc, value, index) => {
  //               acc[header[index]] = value;
  //               return acc;
  //             }, {});
  //           })
  //           .filter((row) => row !== null);
  //       });
  //       setData(output[0]);
  //     };
  //   } else {
  //     alert('Please select a valid .csv file.');
  //     setSelectedFile(null);
  //   }
  // };

  //   const handleFileChange = (event) => {
  //     const file = event.target.files[0];
  //     if (file && file.type === 'text/csv') {
  //         setSelectedFile(event.target.files[0]);
  //         Papa.parse(event.target.files[0], {
  //             header: true,
  //             complete: function (result) {
  //                 const columnArray = [];
  //                 const valueArray = [];

  //                 result.data.map((d) => {
  //                     columnArray.push(Object.keys(d));
  //                     valueArray.push(Object.values(d));
  //                 });

  //                 setData(result.data);
  //                 setColumns(columnArray[0]);
  //                 setValues(valueArray);
  //             },
  //             skipEmptyLines: true,
  //         });
  //     } else if (file && file.type === 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet') {
  //         setSelectedFile(event.target.files[0]);
  //         let csvData;
  //         var reader = new FileReader();
  //         reader.readAsArrayBuffer(file);
  //         reader.onload = async (data) => {
  //             let csvData1:any = reader.result;
  //             csvData = importExcel(csvData1);

  //             // Ensure csvData is parsed to array properly
  //             if (typeof csvData === 'string') {
  //                 csvData = JSON.parse(csvData);
  //             }

  //             const filteredNestedData = csvData.filter((innerData) => innerData.some((row) => row.length > 0));

  //             const output = filteredNestedData.map((innerData) => {
  //                 const header = innerData[0];
  //                 return innerData
  //                     .slice(1)
  //                     .map((row) => {
  //                         if (row.every((value) => value === '')) {
  //                             return null;
  //                         }
  //                         return row.reduce((acc, value, index) => {
  //                             acc[header[index]] = value;
  //                             return acc;
  //                         }, {});
  //                     })
  //                     .filter((row) => row !== null);
  //             });

  //             // Convert date format here
  //           //   output[0].forEach((holiday) => {
  //           //     holiday["Holiday Date"] = moment(holiday["Holiday Date"], 'DD-MM-YYYY').add(1, 'day').format('YYYY-MM-DD');
  //           // });
  //           output[0].forEach((holiday) => {
  //             const holidayDate = holiday["Holiday Date"];
  //             console.log(holidayDate,'111')
  //             // No need for if condition, assuming holidayDate is always a string or Date
  //             holiday["Holiday Date"] = moment(holidayDate).add(1, 'day').format('YYYY-MM-DD');
  //         });
  //         console.log(output,'opppppppppp')

  //             setData(output[0]);
  //         };
  //     } else {
  //         alert('Please select a valid .csv file.');
  //         setSelectedFile(null);
  //     }
  // };


  const handleFileChange = (event) => {
    const file = event.target.files[0];
    if (file && file.type === 'text/csv') {
      setSelectedFile(event.target.files[0]);
      Papa.parse(event.target.files[0], {
        header: true,
        complete: function (result) {
          const columnArray = [];
          const valueArray = [];

          result.data.map((d) => {
            columnArray.push(Object.keys(d));
            valueArray.push(Object.values(d));
          });

          setData(result.data);
          setColumns(columnArray[0]);
          setValues(valueArray);
        },
        skipEmptyLines: true,
      });
    } else if (file && file.type === 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet') {
      setSelectedFile(event.target.files[0]);
      let csvData;
      var reader = new FileReader();
      reader.readAsArrayBuffer(file);
      reader.onload = async (data) => {
        let csvData1: any = reader.result;
        csvData = importExcel(csvData1);

        // Ensure csvData is parsed to array properly
        if (typeof csvData === 'string') {
          csvData = JSON.parse(csvData);
        }

        const filteredNestedData = csvData.filter((innerData) => innerData.some((row) => row.length > 0));

        const output = filteredNestedData.map((innerData) => {
          const header = innerData[0];
          return innerData
            .slice(1)
            .map((row) => {
              if (row.every((value) => value === '')) {
                return null;
              }
              return row.reduce((acc, value, index) => {
                acc[header[index]] = value;
                return acc;
              }, {});
            })
            .filter((row) => row !== null);
        });

        // Check if any Holiday Date is a string
        const holidayDateStrings = output[0].filter(holiday => typeof holiday["Holiday Date"] === 'string');
        if (holidayDateStrings.length > 0) {
          alert('Please ensure the "Holiday Date" column in your Excel file is formatted as a date.');
        }

        // Convert date format here
        output[0].forEach((holiday) => {
          const holidayDate = holiday["Holiday Date"];
          const momentDate = moment(holidayDate, 'DD-MM-YYYY', true); // true to enforce strict parsing
          if (!momentDate.isValid()) {
            alert('Invalid date format for Holiday Date. Please use DD-MM-YYYY format.');
            return;
          }
          holiday["Holiday Date"] = momentDate.add(1, 'day').format('YYYY-MM-DD');
        });

        console.log(output, 'opppppppppp');
        setData(output[0]);
      };
    } else {
      alert('Please select a valid .csv file.');
      setSelectedFile(null);
    }
  };






  let createdUser = "";
  // if(!props.isUpdate){
  createdUser = localStorage.getItem("createdUser");
  // }
  const handleUpload = async () => {
    try {
      form.validateFields().then(async () => {
        const req = new HolidayCalenderModelDtoReq(data, createdUser)
        const res = await service.createHoliday(req).then((res) => {
          setLoading(true);
          if (res.status) {
            AlertMessages.getSuccessMessage(res.internalMessage);
            history.push('/holidays-calendar-view');
          } else {
            AlertMessages.getErrorMessage(res.internalMessage);
          }
        });
      });
    } catch (error) {
      AlertMessages.getErrorMessage(error.message);
    }
  };

  const sampleHolidays = [
    { holidayName: 'Example Name', holidayDate: '01-01-2024' },
    
    // Add more holiday entries as needed
  ];

  // Pass sample data to exportingColumns
  let exportingColumns: IExcelColumn[] = [
    {
      title: 'Holiday Name',
      dataIndex: 'holidayName',
      __cellType__: "TypeString",
      render: (text, record) => record.holidayName ? record.holidayName : '-'
    },
    {
      title: 'Holiday Date',
      dataIndex: 'holidayDate',
      __cellType__: "TypeDate",
      //render: (text, record) => record.holidayDate ? moment(record.holidayDate).format('DD-MM-YYYY') : '-'
      render: (text, record) => record.holidayDate ? moment(record.holidayDate).add(1, 'day').format('DD-MM-YYYY') : '-'
    },
  ];

  // Now you can pass sampleHolidays to your Excel export function
  const handleExport = (e: any) => {
    e.preventDefault();

    const currentDate = new Date()
      .toISOString()
      .slice(0, 10)
      .split("-")
      .join("/");

    const excel = new Excel();
    excel.addSheet("Sheet1");
    excel.addColumns(exportingColumns);
    excel.addDataSource(sampleHolidays, { str2num: false });
    excel.saveAs(`holiday-calendar-${currentDate}.xlsx`);
  }
  return (
    <Card
      title="Holidays Calendar"
      extra={
        <Link to="/holidays-calendar-view">
          <span style={{ color: 'white' }}>
            <Button type={'primary'}>View</Button>{' '}
          </span>
        </Link>
      }
    >
      <Form>
        <Row gutter={24}>
          <Col
            xs={{ span: 24 }}
            sm={{ span: 24 }}
            md={{ span: 6 }}
            lg={{ span: 6 }}
            xl={{ span: 6 }}
          >
            <Form.Item label="">
              <input
                type="file"
                accept=".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
                onChange={handleFileChange}
              />
              <label style={{ color: 'blue', whiteSpace: 'nowrap' }}>
                Only csv & excel files are allowed
              </label>
            </Form.Item>
          </Col>
          <Col
            xs={{ span: 24 }}
            sm={{ span: 24 }}
            md={{ span: 6 }}
            lg={{ span: 6 }}
            xl={{ span: 6 }}
          >
            <Button
              type="primary"
              onClick={handleUpload}
              loading={loading}
              disabled={!selectedFile}
            >
              Upload
            </Button>
          </Col>
          <Button
            type="default"
            style={{ color: 'green' }}
            onClick={handleExport}
            icon={<FileExcelFilled />}
          >
            Sample Format
          </Button>
        </Row>
      </Form>
    </Card>
  );
};

export default HolidaysCalender;
