1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
|
import {useEffect, useState} from "react";
import {NumericFormat} from "react-number-format";
import {Container, Typography} from "@mui/material";
import dayjs from "dayjs";
function Result({listEntry, baseSalary}) {
const [totalOvertimePay, setTotalOvertimePay] = useState(0);
const [holidayData, setHolidayData] = useState(null);
useEffect(() => {
setTotalOvertimePay(getOvertimePayTotal(listEntry, baseSalary, holidayData));
}, [listEntry, baseSalary, holidayData]);
useEffect(() => {
fetchApi(dayjs().year()).then((result) => {
setHolidayData(result);
})
}, []);
if (totalOvertimePay < 0) {
return (
<Container>
<Typography variant='h5'>
Waktu selesai mendahului waktu mulai. Mohon diperbaiki input.
</Typography>
</Container>
)
}
return (
<Container>
<Typography variant='h5'>
Total Upah Lembur: Rp<NumericFormat displayType="text" decimalScale={0} thousandSeparator={true}
value={totalOvertimePay}/>
</Typography>
<Typography>Rincian</Typography>
{ listEntry.map((entry) => {
const holidayName = isHoliday(entry.date, holidayData);
return (
<div key={entry.id}>
<Typography>
{entry.date.format('DD MMMM YYYY')}{holidayName ? ` (${holidayName})` : ''}: Rp<NumericFormat displayType="text" decimalScale={0} thousandSeparator={true} value={calculatePerDay(entry, baseSalary, holidayData)} />
</Typography>
</div>
)
}) }
</Container>
)
}
function fetchApi(year) {
// kemungkinan nanti ada pengecekan taun udah pernah difetch / belum
const baseUrl = 'https://dayoffapi.vercel.app/api';
return fetch(`${baseUrl}/?year=${year}`)
.then((response) => response.json())
.then((data) => data);
}
function segmentTime(duration, segments) {
const segmentedHours = [];
for (const[index, segmentDuration] of segments.entries()) {
if (index < segments.length - 1) {
const hours = Math.min(duration, segmentDuration.segment);
segmentedHours.push(hours);
duration -= hours;
} else {
segmentedHours.push(duration);
}
}
return segmentedHours;
}
function isHoliday(date, holidayData) {
if (date.day() === 0) {
return 'Minggu';
} else if (date.day() === 6) {
return 'Sabtu';
}
let holidayName = '';
if (holidayData) {
console.log(holidayData);
holidayData.every((day) => {
if (dayjs(day['tanggal'], 'YYYY-MM-D').isSame(date, 'day')) {
holidayName = day['keterangan'];
return false;
}
return true;
})
}
return holidayName;
}
function calculatePerDay(entry, baseSalary, holidayData) {
const hourlyPay = baseSalary / 173;
const overtimeDuration = entry.finish.diff(entry.start, 'hour', true);
let multiplier = 0;
const segmentMap = {
workDays: [
{segment: 1, multiplier: 1.5}, // jam pertama
{segment: 23, multiplier: 2}
],
holidays: [
{segment: 8, multiplier: 2}, // 8 jam pertama
{segment: 1, multiplier: 3}, // jam ke 9
{segment: 15, multiplier: 4}
]
}
const segmentPattern = isHoliday(entry.date, holidayData) ? segmentMap.holidays : segmentMap.workDays;
const segmentedDuration = segmentTime(overtimeDuration, segmentPattern);
for (let i = 0; i < segmentedDuration.length; i++) {
if (segmentedDuration[i])
multiplier += segmentedDuration[i] * segmentPattern[i].multiplier;
}
return multiplier * hourlyPay;
}
function getOvertimePayTotal(listEntry, baseSalary, holidayData) {
let total = 0;
listEntry.forEach((entry) => {
total += calculatePerDay(entry, baseSalary, holidayData)
});
return total;
}
export default Result;
|