update timekeeping
This commit is contained in:
parent
bab6052e82
commit
6a9a9f4cee
|
|
@ -56,7 +56,11 @@ const Timekeeping = () => {
|
||||||
year: date.year,
|
year: date.year,
|
||||||
})
|
})
|
||||||
if (res.status) {
|
if (res.status) {
|
||||||
setData(res.data.filter((u:UserData)=>permission.includes(u.user.permission)))
|
setData(
|
||||||
|
res.data.filter((u: UserData) =>
|
||||||
|
permission.includes(u.user.permission),
|
||||||
|
),
|
||||||
|
)
|
||||||
setDaysInMonth(
|
setDaysInMonth(
|
||||||
Array.from({ length: getDaysInMonth() }, (_, index) => index + 1),
|
Array.from({ length: getDaysInMonth() }, (_, index) => index + 1),
|
||||||
)
|
)
|
||||||
|
|
@ -104,7 +108,7 @@ const Timekeeping = () => {
|
||||||
<Select
|
<Select
|
||||||
w="10%"
|
w="10%"
|
||||||
value={date.month}
|
value={date.month}
|
||||||
size='xs'
|
size="xs"
|
||||||
label="Month"
|
label="Month"
|
||||||
data={Array.from({ length: 12 }, (_, index) =>
|
data={Array.from({ length: 12 }, (_, index) =>
|
||||||
(1 + index).toString(),
|
(1 + index).toString(),
|
||||||
|
|
@ -116,7 +120,7 @@ const Timekeeping = () => {
|
||||||
<Select
|
<Select
|
||||||
w="10%"
|
w="10%"
|
||||||
value={date.year}
|
value={date.year}
|
||||||
size='xs'
|
size="xs"
|
||||||
ml={'sm'}
|
ml={'sm'}
|
||||||
label="Year"
|
label="Year"
|
||||||
data={Array.from({ length: 20 }, (_, index) =>
|
data={Array.from({ length: 20 }, (_, index) =>
|
||||||
|
|
@ -128,12 +132,22 @@ const Timekeeping = () => {
|
||||||
></Select>
|
></Select>
|
||||||
</Box>
|
</Box>
|
||||||
<Box>
|
<Box>
|
||||||
<Table striped highlightOnHover withTableBorder withColumnBorders mt={'md'}>
|
<Table
|
||||||
|
striped
|
||||||
|
highlightOnHover
|
||||||
|
withTableBorder
|
||||||
|
withColumnBorders
|
||||||
|
mt={'md'}
|
||||||
|
>
|
||||||
<Table.Thead>
|
<Table.Thead>
|
||||||
<Table.Tr bg={'#228be66b'}>
|
<Table.Tr bg={'#228be66b'}>
|
||||||
<Table.Th>Day</Table.Th>
|
<Table.Th>Day</Table.Th>
|
||||||
{daysInMonth.map((d) => {
|
{daysInMonth.map((d) => {
|
||||||
return <Table.Th key={d} ta={'center'}>{d}</Table.Th>
|
return (
|
||||||
|
<Table.Th key={d} ta={'center'}>
|
||||||
|
{d}
|
||||||
|
</Table.Th>
|
||||||
|
)
|
||||||
})}
|
})}
|
||||||
</Table.Tr>
|
</Table.Tr>
|
||||||
<Table.Tr bg={'#228be66b'}>
|
<Table.Tr bg={'#228be66b'}>
|
||||||
|
|
@ -150,11 +164,8 @@ const Timekeeping = () => {
|
||||||
<Table.Tbody>
|
<Table.Tbody>
|
||||||
{data.map((user) => {
|
{data.map((user) => {
|
||||||
return (
|
return (
|
||||||
<Table.Tr
|
<Table.Tr key={user.user.id} className={classes.tableTr}>
|
||||||
key={user.user.id}
|
<Table.Td>{user.user.name}</Table.Td>
|
||||||
className={classes.tableTr}
|
|
||||||
>
|
|
||||||
<Table.Td >{user.user.name}</Table.Td>
|
|
||||||
{daysInMonth.map((d) => {
|
{daysInMonth.map((d) => {
|
||||||
var total =
|
var total =
|
||||||
user.history.find((h) => h.day === d)?.total ?? 0
|
user.history.find((h) => h.day === d)?.total ?? 0
|
||||||
|
|
@ -163,7 +174,6 @@ const Timekeeping = () => {
|
||||||
{total / 60 / 60 < 8 && total !== 0 ? (
|
{total / 60 / 60 < 8 && total !== 0 ? (
|
||||||
<Tooltip
|
<Tooltip
|
||||||
multiline
|
multiline
|
||||||
|
|
||||||
label={
|
label={
|
||||||
<div>
|
<div>
|
||||||
{`Total: ${(total / 60 / 60).toFixed(1)}h`}
|
{`Total: ${(total / 60 / 60).toFixed(1)}h`}
|
||||||
|
|
@ -171,7 +181,34 @@ const Timekeeping = () => {
|
||||||
.find((h) => h.day === d)
|
.find((h) => h.day === d)
|
||||||
?.values.map((v) => {
|
?.values.map((v) => {
|
||||||
return (
|
return (
|
||||||
<Box style={{display:'flex', alignItems:'center', justifyContent:"space-between"}}><p>{v.status + ': ' + v.time_string}</p> {v.image&&<Image w={100} h={100} src={import.meta.env.VITE_BACKEND_URL+"storage/"+v.image}/>}</Box>
|
<Box
|
||||||
|
style={{
|
||||||
|
display: 'flex',
|
||||||
|
alignItems: 'center',
|
||||||
|
justifyContent: 'space-between',
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<p>{v.status + ': ' + v.time_string}</p>{' '}
|
||||||
|
{v.image && (
|
||||||
|
<Image
|
||||||
|
w={100}
|
||||||
|
h={100}
|
||||||
|
src={
|
||||||
|
import.meta.env.VITE_BACKEND_URL.includes(
|
||||||
|
'local',
|
||||||
|
)
|
||||||
|
? import.meta.env
|
||||||
|
.VITE_BACKEND_URL +
|
||||||
|
'storage/' +
|
||||||
|
v.image
|
||||||
|
: import.meta.env
|
||||||
|
.VITE_BACKEND_URL +
|
||||||
|
'api/storage/' +
|
||||||
|
v.image
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
)}
|
||||||
|
</Box>
|
||||||
)
|
)
|
||||||
})}
|
})}
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -182,9 +219,9 @@ const Timekeeping = () => {
|
||||||
style={{
|
style={{
|
||||||
backgroundColor: 'orange',
|
backgroundColor: 'orange',
|
||||||
color: 'white',
|
color: 'white',
|
||||||
borderRadius:"5px",
|
borderRadius: '5px',
|
||||||
padding: "2px",
|
padding: '2px',
|
||||||
fontWeight: 700
|
fontWeight: 700,
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
|
|
@ -209,8 +246,8 @@ const Timekeeping = () => {
|
||||||
style={{
|
style={{
|
||||||
backgroundColor: 'green',
|
backgroundColor: 'green',
|
||||||
color: 'white',
|
color: 'white',
|
||||||
borderRadius:"5px",
|
borderRadius: '5px',
|
||||||
padding: "2px"
|
padding: '2px',
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
|
|
@ -220,8 +257,8 @@ const Timekeeping = () => {
|
||||||
style={{
|
style={{
|
||||||
backgroundColor: '#ff4646',
|
backgroundColor: '#ff4646',
|
||||||
color: 'white',
|
color: 'white',
|
||||||
borderRadius:"5px",
|
borderRadius: '5px',
|
||||||
padding: "2px"
|
padding: '2px',
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue