import React, { useState, useEffect, useRef } from 'react'
import DatePicker from 'react-datepicker'
import NumberFormat from 'react-number-format'
import ReactToPrint from 'react-to-print'
import { Inertia } from '@inertiajs/inertia'
import { usePrevious } from 'react-use'
import { toast } from 'react-toastify'
import { Head, useForm } from '@inertiajs/inertia-react'
import Authenticated from '@/Layouts/Authenticated'
import Pagination from '@/Components/Pagination'
import CloseIcon from '@/Components/CloseIcon'
import EmployeeSelectInput from '@/Selects/EmployeeSelectInput'
import { formatIDR } from '@/utils'
import Print from '@/Pages/Payrolls/Print'
export default function Create(props) {
const { data: products, links } = props.products
const { _search, _page } = props
const { data, setData, post, errors, processing } = useForm({
date: new Date(),
employee_id: null,
employee_name: '',
employee: null,
cuts: 0,
bonus: 0,
items: [],
})
const [loading, setLoading] = useState(false)
const [search, setSearch] = useState(_search)
const preValue = usePrevious(search)
const componentToPrint = useRef()
const handleSelectedEmployee = (employee) => {
setData({
...data,
employee_id: employee.id,
employee_name: `${employee.name} - ${employee.whatsapp}`,
employee: employee,
})
}
const addItem = (product) => {
const itemExist = data.items.find(item => item.id === product.id)
if(itemExist) {
setData(
'items',
data.items.map(item => {
if(item.id === product.id){
return {
...item,
quantity: +item.quantity + 1,
}
} else {
return item
}
})
)
return
}
setData('items', data.items.concat({
...product,
product_id: product.id,
quantity: 1
}))
}
const setQuantity = (product, value) => {
setData('items', data.items.map(item => {
if(item.id === product.id) {
return {
...item,
quantity: +value,
}
} else {
return item
}
}))
}
const remoteItem = (product) => {
setData('items', data.items.filter(item => item.id !== product.id))
}
const handleReset = () => {
setData({
employee_id: null,
employee_name: '',
cuts: 0,
bonus: 0,
items: [],
})
}
const handleSubmit = () => {
if (data.items.length <= 0) {
alert('barang belum di pilih')
return
}
post(route('payrolls.store'), {
onSuccess: () =>
Promise.all([
handleReset(),
toast.success('The Data has been saved'),
]),
})
}
const itemAmount = data.items.reduce((amt, item) => amt + (+item.quantity * +item.price), 0)
const totalAmount = itemAmount - +data.cuts + +data.bonus
useEffect(() => {
if (preValue) {
setLoading(true)
Inertia.get(
route(route().current()),
{ q: search, page: _page },
{
replace: true,
preserveState: true,
onSuccess: () => { setLoading(false) },
}
)
}
}, [search])
return (
Barang | Qty | Subtotal | |
---|---|---|---|
{item.name} |
|
{formatIDR( item.quantity * item.price )} |
|