93 lines
4.9 KiB
TypeScript
93 lines
4.9 KiB
TypeScript
import React from 'react'
|
|
import { FaCalendarAlt, FaPlus } from 'react-icons/fa'
|
|
import { LeaveDto } from '@/proxy/intranet/models'
|
|
import useLocale from '@/utils/hooks/useLocale'
|
|
import { currentLocalDate } from '@/utils/dateUtils'
|
|
import { LeaveStatusEnum, LeaveTypeEnum } from '@/types/intranet'
|
|
import { useLocalization } from '@/utils/hooks/useLocalization'
|
|
|
|
interface LeaveManagementProps {
|
|
leaves: LeaveDto[]
|
|
onNewLeave: () => void
|
|
}
|
|
|
|
const LeaveManagement: React.FC<LeaveManagementProps> = ({ leaves, onNewLeave }) => {
|
|
const currentLocale = useLocale()
|
|
const { translate } = useLocalization();
|
|
|
|
return (
|
|
<div className="bg-white dark:bg-gray-800 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700">
|
|
<div className="p-4 border-b border-gray-200 dark:border-gray-700">
|
|
<h2 className="text-lg font-semibold text-gray-900 dark:text-white flex items-center gap-2">
|
|
<FaCalendarAlt className="w-5 h-5" />
|
|
{translate('::App.Platform.Intranet.Widgets.LeaveManagement.Title')}
|
|
</h2>
|
|
</div>
|
|
<div className="p-4 space-y-3">
|
|
{/* İzin bakiye özeti */}
|
|
<div className="grid grid-cols-2 gap-2 mb-4">
|
|
<div className="p-3 bg-blue-50 dark:bg-blue-900/20 rounded-lg border border-blue-200 dark:border-blue-800">
|
|
<p className="text-xs text-gray-600 dark:text-gray-400">{translate('::App.Platform.Intranet.Widgets.LeaveManagement.AnnualLeave')}</p>
|
|
<p className="text-lg font-bold text-blue-600 dark:text-blue-400">12 {translate('::App.Platform.Intranet.Widgets.LeaveManagement.Day')}</p>
|
|
</div>
|
|
<div className="p-3 bg-green-50 dark:bg-green-900/20 rounded-lg border border-green-200 dark:border-green-800">
|
|
<p className="text-xs text-gray-600 dark:text-gray-400">{translate('::App.Platform.Intranet.Widgets.LeaveManagement.SickLeave')}</p>
|
|
<p className="text-lg font-bold text-green-600 dark:text-green-400">8 {translate('::App.Platform.Intranet.Widgets.LeaveManagement.Day')}</p>
|
|
</div>
|
|
</div>
|
|
|
|
{/* Son izin talepleri */}
|
|
<div className="space-y-2">
|
|
{leaves.slice(0, 3).map((leave) => (
|
|
<div
|
|
key={leave.id}
|
|
className="p-3 rounded-lg bg-gray-50 dark:bg-gray-900/20 border border-gray-200 dark:border-gray-700"
|
|
>
|
|
<div className="flex items-start justify-between mb-1">
|
|
<h4 className="text-sm font-medium text-gray-900 dark:text-white">
|
|
{leave.leaveType === LeaveTypeEnum.Annual
|
|
? `🏖️ ${translate('::App.Platform.Intranet.Widgets.LeaveManagement.Annual')}`
|
|
: leave.leaveType === LeaveTypeEnum.Sick
|
|
? `🏥 ${translate('::App.Platform.Intranet.Widgets.LeaveManagement.Sick')}`
|
|
: leave.leaveType === LeaveTypeEnum.Unpaid
|
|
? `💼 ${translate('::App.Platform.Intranet.Widgets.LeaveManagement.Unpaid')}`
|
|
: `📋 ${translate('::App.Platform.Intranet.Widgets.LeaveManagement.Other')}`}{' '}
|
|
{translate('::App.Platform.Intranet.Widgets.LeaveManagement.Leave')}
|
|
</h4>
|
|
<span
|
|
className={`text-xs px-2 py-1 rounded-full ${
|
|
leave.status === LeaveStatusEnum.Approved
|
|
? 'bg-green-100 dark:bg-green-900/30 text-green-700 dark:text-green-300'
|
|
: leave.status === LeaveStatusEnum.Pending
|
|
? 'bg-yellow-100 dark:bg-yellow-900/30 text-yellow-700 dark:text-yellow-300'
|
|
: 'bg-red-100 dark:bg-red-900/30 text-red-700 dark:text-red-300'
|
|
}`}
|
|
>
|
|
{leave.status === LeaveStatusEnum.Approved
|
|
? translate('::App.Platform.Intranet.Widgets.LeaveManagement.Status.Approved')
|
|
: leave.status === LeaveStatusEnum.Pending
|
|
? translate('::App.Platform.Intranet.Widgets.LeaveManagement.Status.Pending')
|
|
: translate('::App.Platform.Intranet.Widgets.LeaveManagement.Status.Rejected')}
|
|
</span>
|
|
</div>
|
|
<p className="text-xs text-gray-600 dark:text-gray-400">
|
|
{currentLocalDate(leave.startDate, currentLocale || 'tr')} - {currentLocalDate(leave.endDate, currentLocale || 'tr')}{' '}
|
|
({leave.totalDays} {translate('::App.Platform.Intranet.Widgets.LeaveManagement.Day')})
|
|
</p>
|
|
</div>
|
|
))}
|
|
</div>
|
|
|
|
<button
|
|
onClick={onNewLeave}
|
|
className="w-full mt-3 px-4 py-2 bg-blue-600 hover:bg-blue-700 text-white text-sm rounded-lg transition-colors flex items-center justify-center gap-2"
|
|
>
|
|
<FaPlus className="w-4 h-4" />
|
|
{translate('::App.Platform.Intranet.Widgets.LeaveManagement.NewLeaveRequest')}
|
|
</button>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default LeaveManagement
|