import { DatatablePrime } from '@/components/Datatables'
import FormJamKerja from '@/components/Form/JamKerja'
import { Belakang } from '@/components/Layouts'
import { Judul } from '@/components/TextCustom'
import { JamKerjaGet } from '@/services/manajemen/jam-kerja-service'
import Head from 'next/head'
import { Column } from 'primereact/column'
import { Toast } from 'primereact/toast'
import { useEffect, useRef, useState } from 'react'

export default function JamKerja() {
	const toast = useRef(null)
	const [data, setData] = useState([])
	const [dialogForm, setDialogForm] = useState(false)
	const [dataEdit, setDataEdit] = useState([])
	const [refresh, setRefresh] = useState(0)

	useEffect(() => {
		JamKerjaGet()
			.then((res) => {
				console.log(res)
				setData([res.data])
			})
			.catch((err) => {
				console.log(err)
			})
	}, [refresh])

	return (
		<>
			<Toast ref={toast} />
			<Head>
				<title>Jam Kerja</title>
			</Head>
			<Belakang>
				<Judul>Jam Kerja</Judul>
				<DatatablePrime
					data={data}
					dialogForm={dialogForm}
					setDialogForm={setDialogForm}
					Form={FormJamKerja}
					buttonAdd={true}
					buttonAddLabel='Tambah/replace data'
					dataEdit={dataEdit}
					setDataEdit={setDataEdit}
					toast={toast}
					refresh={setRefresh}
				>
					<Column field='days' header='Hari' sortable></Column>
					<Column field='time' header='Jam Kerja' sortable></Column>
				</DatatablePrime>
			</Belakang>
		</>
	)
}
