import React, { useState, useEffect } from 'react'
import DatePicker from 'react-datepicker'
import moment from 'moment'
import qs from 'qs'
import { Head } from '@inertiajs/inertia-react'
import { Inertia } from '@inertiajs/inertia'
import { usePrevious } from 'react-use'
import Authenticated from '@/Layouts/Authenticated'
import Pagination from '@/Components/Pagination'
import { formatIDR, formatDate } from '@/utils'
export default function Reports(props) {
const { data: payrolls, links } = props.payrolls
const { _startDate, _endDate } = props
const [startDate, setStartDate] = useState(
_startDate ? new Date(_startDate) : new Date()
)
const [endDate, setEndDate] = useState(
_endDate ? new Date(_endDate) : new Date()
)
const preValue = usePrevious(`${startDate}-${endDate}`)
const params = {
startDate: moment(startDate).format('yyyy-MM-DD'),
endDate: moment(endDate).format('yyyy-MM-DD'),
}
useEffect(() => {
if (preValue) {
Inertia.get(
route(route().current()),
params,
{
replace: true,
preserveState: true,
}
)
}
}, [startDate, endDate])
return (
Tanggal | Nama Karyawan | Kontak | Total | Jumlah Item |
---|---|---|---|---|
{formatDate(payroll.date)} | {payroll.employee.name} | {payroll.employee.whatsapp} | {formatIDR(payroll.recived)} | {formatIDR(payroll.item_count)} |