ajikamaludin
/
payroll-pos-inertiajs
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

print nota

Browse Source
pull/1/head
Aji Kamaludin 3 years ago
parent c6b63f7531
commit a2cb6b5a1b
No known key found for this signature in database
GPG Key ID: 670E1F26AD5A8099
8 changed files with 604 additions and 203 deletions
Show Stats Download Patch File Download Diff File

4
app/Http/Controllers/UserController.php
Unescape Escape View File

@ -35,7 +35,7 @@ class UserController extends Controller
{
$request->validate([
'name' => 'required|string',
'email' => 'required|email',
'email' => 'required|email|unique:users,email',
'password' => 'required|string|min:6',
]);
@ -55,7 +55,7 @@ class UserController extends Controller
{
$request->validate([
'name' => 'required|string',
'email' => 'required|email',
'email' => 'required|email|unique:users,email,'.$user->id,
'password' => 'nullable|string|min:6',
]);

21
package-lock.json generated
Unescape Escape View File

@ -10,6 +10,7 @@
"qs": "^6.10.2",
"react-datepicker": "^4.5.0",
"react-number-format": "^4.9.0",
"react-to-print": "^2.14.3",
"react-toastify": "^8.1.0",
"react-use": "^17.3.1"
},
@ -8035,6 +8036,18 @@
"react": "^16.8.0 || ^17"
}
},
"node_modules/react-to-print": {
"version": "2.14.3",
"resolved": "https://registry.npmjs.org/react-to-print/-/react-to-print-2.14.3.tgz",
"integrity": "sha512-j0EAplQGcw4ujSLfUQoIhf1PgrSLrWRh4NSAiKZdWm6YNXMioHW56cGpbKEJkCpYN1E5g3tvFVHRADn0mTKGzg==",
"dependencies": {
"prop-types": "^15.8.0"
},
"peerDependencies": {
"react": "^15.0.0 || ^16.0.0 || ^17.0.0",
"react-dom": "^15.0.0 || ^16.0.0 || ^17.0.0"
}
},
"node_modules/react-toastify": {
"version": "8.1.0",
"resolved": "https://registry.npmjs.org/react-toastify/-/react-toastify-8.1.0.tgz",
@ -16179,6 +16192,14 @@
"warning": "^4.0.2"
}
},
"react-to-print": {
"version": "2.14.3",
"resolved": "https://registry.npmjs.org/react-to-print/-/react-to-print-2.14.3.tgz",
"integrity": "sha512-j0EAplQGcw4ujSLfUQoIhf1PgrSLrWRh4NSAiKZdWm6YNXMioHW56cGpbKEJkCpYN1E5g3tvFVHRADn0mTKGzg==",
"requires": {
"prop-types": "^15.8.0"
}
},
"react-toastify": {
"version": "8.1.0",
"resolved": "https://registry.npmjs.org/react-toastify/-/react-toastify-8.1.0.tgz",

1
package.json
Unescape Escape View File

@ -32,6 +32,7 @@
"qs": "^6.10.2",
"react-datepicker": "^4.5.0",
"react-number-format": "^4.9.0",
"react-to-print": "^2.14.3",
"react-toastify": "^8.1.0",
"react-use": "^17.3.1"
}

9
public/css/app.css vendored
Unescape Escape View File

@ -2837,9 +2837,6 @@ html {
.w-4 {
width: 1rem;
}
.w-1\/6 {
width: 16.666667%;
}
.max-w-xl {
max-width: 36rem;
}
@ -2849,12 +2846,18 @@ html {
.max-w-7xl {
max-width: 80rem;
}
.max-w-sm {
max-width: 24rem;
}
.flex-1 {
flex: 1 1 0%;
}
.shrink-0 {
flex-shrink: 0;
}
.border-collapse {
border-collapse: collapse;
}
.origin-top {
transform-origin: top;
}

591
public/js/app.js vendored
View File

File diff suppressed because one or more lines are too long

37
resources/js/Pages/Payrolls/Create.js vendored
Unescape Escape View File

@ -1,6 +1,7 @@
import React, { useState, useEffect } from 'react'
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'
@ -11,6 +12,7 @@ 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
@ -19,6 +21,7 @@ export default function Create(props) {
date: new Date(),
employee_id: null,
employee_name: '',
employee: null,
cuts: 0,
bonus: 0,
items: [],
@ -29,11 +32,14 @@ export default function Create(props) {
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,
})
}
@ -316,17 +322,34 @@ export default function Create(props) {
>
Simpan
</div>
<div
className="btn btn-primary"
disabled={processing}
>
Cetak
</div>
<ReactToPrint
trigger={() => (
<div
className="btn btn-primary"
disabled={processing}
>
Cetak
</div>
)}
content={() => componentToPrint.current}
/>
</div>
</div>
</div>
</div>
</div>
<div className="hidden">
<Print
user={props.auth.user}
date={data.date}
employee={data.employee}
items={data.items}
amount={itemAmount}
cuts={data.cuts}
bonus={data.bonus}
total={totalAmount}
ref={componentToPrint} />
</div>
</div>
</Authenticated>
)

50
resources/js/Pages/Payrolls/Edit.js vendored
Unescape Escape View File

@ -1,6 +1,7 @@
import React, { useState, useEffect } from 'react'
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'
@ -11,6 +12,7 @@ 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 Edit(props) {
const { data: products, links } = props.products
@ -19,14 +21,15 @@ export default function Edit(props) {
date: new Date(payroll.date),
employee_id: payroll.employee_id,
employee_name: `${payroll.employee.name} - ${payroll.employee.whatsapp}`,
employee: payroll.employee,
cuts: payroll.cuts,
bonus: payroll.bonus,
items: payroll.items.map(item => {
return {
product_id: item.product_id,
quantity: item.quantity,
...item.product,
}
items: payroll.items.map((item) => {
return {
product_id: item.product_id,
quantity: item.quantity,
...item.product,
}
}),
})
@ -35,11 +38,14 @@ export default function Edit(props) {
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
})
}
@ -336,17 +342,35 @@ export default function Edit(props) {
>
Simpan
</div>
<div
className="btn btn-primary"
disabled={processing}
>
Cetak
</div>
<ReactToPrint
trigger={() => (
<div
className="btn btn-primary"
disabled={processing}
>
Cetak
</div>
)}
content={() => componentToPrint.current}
/>
</div>
</div>
</div>
</div>
</div>
<div className="hidden">
<Print
user={props.auth.user}
date={data.date}
employee={data.employee}
items={data.items}
amount={itemAmount}
cuts={data.cuts}
bonus={data.bonus}
total={totalAmount}
ref={componentToPrint}
/>
</div>
</div>
</Authenticated>
)

94
resources/js/Pages/Payrolls/Print.js vendored
Unescape Escape View File

@ -0,0 +1,94 @@
import React from 'react'
import { Head } from '@inertiajs/inertia-react'
import { formatDate, formatIDR } from '@/utils'
const Td = ({ children, colSpan, className }) => {
return (
<td className={`border p-2 ${className}`} colSpan={colSpan}>
{children}
</td>
)
}
const Print = React.forwardRef((props, ref) => {
const {user, date, employee, items, amount, cuts, bonus, total} = props
return (
<>
<Head title="Print" />
<div ref={ref} className="p-4">
<table className="border-collapse border border-gray-400 w-full">
<thead>
<tr className="text-center border">
<th colSpan={4}>
<div className="flex text-md justify-center items-center font-bold text-4xl py-4">
GAJIAN KONVEKSI
</div>
</th>
</tr>
</thead>
<tbody>
<tr className="border">
<Td>Nama Tukang</Td>
<Td>{employee?.name}</Td>
<Td>Nomer Telpon</Td>
<Td>{employee?.whatsapp}</Td>
</tr>
<tr className="border">
<Td>Tanggal Pembuatan</Td>
<Td>{formatDate(date)}</Td>
<Td>Dibuat Oleh</Td>
<Td>{user?.name}</Td>
</tr>
<tr className="border text-center">
<th colSpan={4}>
<div className="flex text-md justify-center items-center font-bold text-3xl py-4">
Detail Gajian
</div>
</th>
</tr>
<tr className="border">
<Td className="max-w-sm">#</Td>
<Td>Nama Barang</Td>
<Td>Harga</Td>
<Td>Jumlah</Td>
</tr>
{items?.map((item, index) => (
<tr className="border" key={index}>
<Td className="max-w-sm">{index + 1}</Td>
<Td>{item?.name}</Td>
<Td>{formatIDR(item?.price)}</Td>
<Td>{formatIDR(item?.quantity)}</Td>
</tr>
))}
<tr className="border">
<Td colSpan={3} className="text-right">
Total
</Td>
<Td>{formatIDR(amount)}</Td>
</tr>
<tr className="border">
<Td colSpan={3} className="text-right">
Potongan/Pinjaman
</Td>
<Td>{formatIDR(cuts)}</Td>
</tr>
<tr className="border">
<Td colSpan={3} className="text-right">
Bonus
</Td>
<Td>{formatIDR(bonus)}</Td>
</tr>
<tr className="border">
<Td colSpan={3} className="text-right">
Total Diterima
</Td>
<Td className="font-bold">{formatIDR(total)}</Td>
</tr>
</tbody>
</table>
</div>
</>
)
})
export default Print
Write Preview
Loading…
Cancel
Save