feat: implement leave request management with CRUD functionality and integrate UI components
This commit is contained in:
parent
d1f1d82099
commit
a179382288
97
app/Http/Controllers/Admin/SDM/LeaveRequestController.php
Normal file
97
app/Http/Controllers/Admin/SDM/LeaveRequestController.php
Normal file
@ -0,0 +1,97 @@
|
|||||||
|
<?php
|
||||||
|
|
||||||
|
namespace App\Http\Controllers\Admin\SDM;
|
||||||
|
|
||||||
|
use App\Http\Controllers\Controller;
|
||||||
|
use App\Http\Requests\Admin\SDM\LeaveRequestRequest;
|
||||||
|
use App\Models\LeaveRequest;
|
||||||
|
use App\Services\Admin\SDM\LeaveRequestService;
|
||||||
|
use Illuminate\Http\RedirectResponse;
|
||||||
|
use Illuminate\Validation\ValidationException;
|
||||||
|
use Inertia\Inertia;
|
||||||
|
use Inertia\Response;
|
||||||
|
|
||||||
|
class LeaveRequestController extends Controller
|
||||||
|
{
|
||||||
|
public function __construct(
|
||||||
|
private LeaveRequestService $service
|
||||||
|
) {}
|
||||||
|
|
||||||
|
public function index(): Response
|
||||||
|
{
|
||||||
|
return Inertia::render('admin/sdm/leave-request/index', [
|
||||||
|
'leaveRequests' => $this->service->getAll(),
|
||||||
|
]);
|
||||||
|
}
|
||||||
|
|
||||||
|
public function store(LeaveRequestRequest $request): RedirectResponse
|
||||||
|
{
|
||||||
|
try {
|
||||||
|
$this->service->create($request->validated());
|
||||||
|
|
||||||
|
Inertia::flash('toast', ['type' => 'success', 'message' => 'Permohonan cuti berhasil ditambahkan.']);
|
||||||
|
} catch (ValidationException $e) {
|
||||||
|
$firstError = collect($e->errors())->flatten()->first();
|
||||||
|
Inertia::flash('toast', ['type' => 'error', 'message' => $firstError ?? 'Terjadi kesalahan.']);
|
||||||
|
} catch (\Exception $e) {
|
||||||
|
Inertia::flash('toast', ['type' => 'error', 'message' => $e->getMessage()]);
|
||||||
|
}
|
||||||
|
|
||||||
|
return to_route('admin.sdm.leave-requests.index');
|
||||||
|
}
|
||||||
|
|
||||||
|
public function update(LeaveRequestRequest $request, LeaveRequest $leaveRequest): RedirectResponse
|
||||||
|
{
|
||||||
|
try {
|
||||||
|
$this->service->update($leaveRequest, $request->validated());
|
||||||
|
|
||||||
|
Inertia::flash('toast', ['type' => 'success', 'message' => 'Permohonan cuti berhasil diperbarui.']);
|
||||||
|
} catch (ValidationException $e) {
|
||||||
|
$firstError = collect($e->errors())->flatten()->first();
|
||||||
|
Inertia::flash('toast', ['type' => 'error', 'message' => $firstError ?? 'Terjadi kesalahan.']);
|
||||||
|
} catch (\Exception $e) {
|
||||||
|
Inertia::flash('toast', ['type' => 'error', 'message' => $e->getMessage()]);
|
||||||
|
}
|
||||||
|
|
||||||
|
return to_route('admin.sdm.leave-requests.index');
|
||||||
|
}
|
||||||
|
|
||||||
|
public function destroy(LeaveRequest $leaveRequest): RedirectResponse
|
||||||
|
{
|
||||||
|
try {
|
||||||
|
$this->service->delete($leaveRequest);
|
||||||
|
|
||||||
|
Inertia::flash('toast', ['type' => 'success', 'message' => 'Permohonan cuti berhasil dihapus.']);
|
||||||
|
} catch (\Exception $e) {
|
||||||
|
Inertia::flash('toast', ['type' => 'error', 'message' => $e->getMessage()]);
|
||||||
|
}
|
||||||
|
|
||||||
|
return to_route('admin.sdm.leave-requests.index');
|
||||||
|
}
|
||||||
|
|
||||||
|
public function approve(LeaveRequest $leaveRequest): RedirectResponse
|
||||||
|
{
|
||||||
|
try {
|
||||||
|
$this->service->approve($leaveRequest);
|
||||||
|
|
||||||
|
Inertia::flash('toast', ['type' => 'success', 'message' => 'Permohonan cuti berhasil disetujui.']);
|
||||||
|
} catch (\Exception $e) {
|
||||||
|
Inertia::flash('toast', ['type' => 'error', 'message' => $e->getMessage()]);
|
||||||
|
}
|
||||||
|
|
||||||
|
return to_route('admin.sdm.leave-requests.index');
|
||||||
|
}
|
||||||
|
|
||||||
|
public function reject(LeaveRequest $leaveRequest): RedirectResponse
|
||||||
|
{
|
||||||
|
try {
|
||||||
|
$this->service->reject($leaveRequest);
|
||||||
|
|
||||||
|
Inertia::flash('toast', ['type' => 'success', 'message' => 'Permohonan cuti berhasil ditolak.']);
|
||||||
|
} catch (\Exception $e) {
|
||||||
|
Inertia::flash('toast', ['type' => 'error', 'message' => $e->getMessage()]);
|
||||||
|
}
|
||||||
|
|
||||||
|
return to_route('admin.sdm.leave-requests.index');
|
||||||
|
}
|
||||||
|
}
|
||||||
29
app/Http/Requests/Admin/SDM/LeaveRequestRequest.php
Normal file
29
app/Http/Requests/Admin/SDM/LeaveRequestRequest.php
Normal file
@ -0,0 +1,29 @@
|
|||||||
|
<?php
|
||||||
|
|
||||||
|
namespace App\Http\Requests\Admin\SDM;
|
||||||
|
|
||||||
|
use Illuminate\Foundation\Http\FormRequest;
|
||||||
|
|
||||||
|
class LeaveRequestRequest extends FormRequest
|
||||||
|
{
|
||||||
|
public function authorize(): bool
|
||||||
|
{
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
|
||||||
|
public function rules(): array
|
||||||
|
{
|
||||||
|
return [
|
||||||
|
'start_date' => ['required', 'date', 'after_or_equal:today'],
|
||||||
|
'end_date' => ['required', 'date', 'after_or_equal:start_date'],
|
||||||
|
];
|
||||||
|
}
|
||||||
|
|
||||||
|
public function attributes(): array
|
||||||
|
{
|
||||||
|
return [
|
||||||
|
'start_date' => 'tanggal mulai',
|
||||||
|
'end_date' => 'tanggal selesai',
|
||||||
|
];
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -26,7 +26,7 @@ public function create(array $data): EmployeeAdvance
|
|||||||
$cashAccount = CashAccount::firstOrFail();
|
$cashAccount = CashAccount::firstOrFail();
|
||||||
$employee = auth()->user()->employee;
|
$employee = auth()->user()->employee;
|
||||||
|
|
||||||
if (!$employee) {
|
if (! $employee) {
|
||||||
throw new \Exception('Anda tidak terdaftar sebagai karyawan.');
|
throw new \Exception('Anda tidak terdaftar sebagai karyawan.');
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -45,7 +45,7 @@ public function create(array $data): EmployeeAdvance
|
|||||||
'amount' => $data['amount'],
|
'amount' => $data['amount'],
|
||||||
'balance_after' => $newBalance,
|
'balance_after' => $newBalance,
|
||||||
'type' => CashTransactionType::EXPENSE,
|
'type' => CashTransactionType::EXPENSE,
|
||||||
'description' => 'Kasbon: ' . $data['description'],
|
'description' => 'Kasbon: '.$data['description'],
|
||||||
]);
|
]);
|
||||||
|
|
||||||
return EmployeeAdvance::create([
|
return EmployeeAdvance::create([
|
||||||
@ -81,7 +81,7 @@ public function update(EmployeeAdvance $employeeAdvance, array $data): EmployeeA
|
|||||||
$cashTransaction->update([
|
$cashTransaction->update([
|
||||||
'amount' => $newAmount,
|
'amount' => $newAmount,
|
||||||
'balance_after' => $newBalance,
|
'balance_after' => $newBalance,
|
||||||
'description' => 'Kasbon: ' . $data['description'],
|
'description' => 'Kasbon: '.$data['description'],
|
||||||
]);
|
]);
|
||||||
|
|
||||||
$employeeAdvance->update([
|
$employeeAdvance->update([
|
||||||
@ -133,7 +133,7 @@ public function pay(EmployeeAdvance $employeeAdvance): EmployeeAdvance
|
|||||||
'amount' => $employeeAdvance->amount,
|
'amount' => $employeeAdvance->amount,
|
||||||
'balance_after' => $newBalance,
|
'balance_after' => $newBalance,
|
||||||
'type' => CashTransactionType::DEPOSIT,
|
'type' => CashTransactionType::DEPOSIT,
|
||||||
'description' => 'Pembayaran kasbon: ' . $employeeAdvance->description,
|
'description' => 'Pembayaran kasbon: '.$employeeAdvance->description,
|
||||||
]);
|
]);
|
||||||
|
|
||||||
$employeeAdvance->update([
|
$employeeAdvance->update([
|
||||||
|
|||||||
86
app/Services/Admin/SDM/LeaveRequestService.php
Normal file
86
app/Services/Admin/SDM/LeaveRequestService.php
Normal file
@ -0,0 +1,86 @@
|
|||||||
|
<?php
|
||||||
|
|
||||||
|
namespace App\Services\Admin\SDM;
|
||||||
|
|
||||||
|
use App\Enums\LeaveRequestStatus;
|
||||||
|
use App\Models\LeaveRequest;
|
||||||
|
use Carbon\Carbon;
|
||||||
|
use Illuminate\Support\Collection;
|
||||||
|
use Illuminate\Support\Facades\DB;
|
||||||
|
|
||||||
|
class LeaveRequestService
|
||||||
|
{
|
||||||
|
public function getAll(): Collection
|
||||||
|
{
|
||||||
|
return LeaveRequest::with(['employee.user.userProfile', 'verifiedBy'])
|
||||||
|
->latest()
|
||||||
|
->get();
|
||||||
|
}
|
||||||
|
|
||||||
|
public function create(array $data): LeaveRequest
|
||||||
|
{
|
||||||
|
return DB::transaction(function () use ($data) {
|
||||||
|
$employee = auth()->user()->employee;
|
||||||
|
|
||||||
|
if (! $employee) {
|
||||||
|
throw new \Exception('Anda tidak terdaftar sebagai karyawan.');
|
||||||
|
}
|
||||||
|
|
||||||
|
$startDate = new Carbon($data['start_date']);
|
||||||
|
$endDate = new Carbon($data['end_date']);
|
||||||
|
$totalDays = $startDate->diffInDays($endDate) + 1;
|
||||||
|
|
||||||
|
return LeaveRequest::create([
|
||||||
|
'employee_id' => $employee->id,
|
||||||
|
'start_date' => $data['start_date'],
|
||||||
|
'end_date' => $data['end_date'],
|
||||||
|
'total_days' => $totalDays,
|
||||||
|
'status' => LeaveRequestStatus::PENDING,
|
||||||
|
]);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
public function update(LeaveRequest $leaveRequest, array $data): LeaveRequest
|
||||||
|
{
|
||||||
|
return DB::transaction(function () use ($leaveRequest, $data) {
|
||||||
|
$startDate = new Carbon($data['start_date']);
|
||||||
|
$endDate = new Carbon($data['end_date']);
|
||||||
|
$totalDays = $startDate->diffInDays($endDate) + 1;
|
||||||
|
|
||||||
|
$leaveRequest->update([
|
||||||
|
'start_date' => $data['start_date'],
|
||||||
|
'end_date' => $data['end_date'],
|
||||||
|
'total_days' => $totalDays,
|
||||||
|
]);
|
||||||
|
|
||||||
|
return $leaveRequest;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
public function delete(LeaveRequest $leaveRequest): bool
|
||||||
|
{
|
||||||
|
return $leaveRequest->delete();
|
||||||
|
}
|
||||||
|
|
||||||
|
public function approve(LeaveRequest $leaveRequest): LeaveRequest
|
||||||
|
{
|
||||||
|
$leaveRequest->update([
|
||||||
|
'status' => LeaveRequestStatus::APPROVED,
|
||||||
|
'verified_by_id' => auth()->id(),
|
||||||
|
'verified_at' => now(),
|
||||||
|
]);
|
||||||
|
|
||||||
|
return $leaveRequest;
|
||||||
|
}
|
||||||
|
|
||||||
|
public function reject(LeaveRequest $leaveRequest): LeaveRequest
|
||||||
|
{
|
||||||
|
$leaveRequest->update([
|
||||||
|
'status' => LeaveRequestStatus::REJECTED,
|
||||||
|
'verified_by_id' => auth()->id(),
|
||||||
|
'verified_at' => now(),
|
||||||
|
]);
|
||||||
|
|
||||||
|
return $leaveRequest;
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -41,6 +41,7 @@ import { index as suppliersIndex } from '@/routes/admin/master/suppliers';
|
|||||||
import { index as cashAccountsIndex } from '@/routes/admin/finance/cash-accounts';
|
import { index as cashAccountsIndex } from '@/routes/admin/finance/cash-accounts';
|
||||||
import { index as expensesIndex } from '@/routes/admin/finance/expenses';
|
import { index as expensesIndex } from '@/routes/admin/finance/expenses';
|
||||||
import { index as employeeAdvancesIndex } from '@/routes/admin/finance/employee-advances';
|
import { index as employeeAdvancesIndex } from '@/routes/admin/finance/employee-advances';
|
||||||
|
import { index as leaveRequestsIndex } from '@/routes/admin/sdm/leave-requests';
|
||||||
|
|
||||||
type NavMenuItem = { title: string; href: string; icon: LucideIcon };
|
type NavMenuItem = { title: string; href: string; icon: LucideIcon };
|
||||||
|
|
||||||
@ -81,7 +82,7 @@ const keuanganItems: NavMenuItem[] = [
|
|||||||
const sdmItems: NavMenuItem[] = [
|
const sdmItems: NavMenuItem[] = [
|
||||||
{ title: 'Pegawai', href: '#', icon: UserCircle },
|
{ title: 'Pegawai', href: '#', icon: UserCircle },
|
||||||
{ title: 'Presensi', href: '#', icon: CalendarCheck },
|
{ title: 'Presensi', href: '#', icon: CalendarCheck },
|
||||||
{ title: 'Cuti', href: '#', icon: CalendarDays },
|
{ title: 'Cuti', href: leaveRequestsIndex.url(), icon: CalendarDays },
|
||||||
];
|
];
|
||||||
|
|
||||||
const sistemItems: NavMenuItem[] = [
|
const sistemItems: NavMenuItem[] = [
|
||||||
|
|||||||
261
resources/js/pages/admin/sdm/leave-request/columns.tsx
Normal file
261
resources/js/pages/admin/sdm/leave-request/columns.tsx
Normal file
@ -0,0 +1,261 @@
|
|||||||
|
import { Badge } from '@/components/ui/badge';
|
||||||
|
import { Button } from '@/components/ui/button';
|
||||||
|
import {
|
||||||
|
Tooltip,
|
||||||
|
TooltipContent,
|
||||||
|
TooltipProvider,
|
||||||
|
TooltipTrigger,
|
||||||
|
} from '@/components/ui/tooltip';
|
||||||
|
import type { ColumnDef } from '@tanstack/react-table';
|
||||||
|
import { ArrowUpDown, CheckCircle, Pencil, Trash2, XCircle } from 'lucide-react';
|
||||||
|
|
||||||
|
export type LeaveRequest = {
|
||||||
|
id: number;
|
||||||
|
start_date: string;
|
||||||
|
end_date: string;
|
||||||
|
total_days: number;
|
||||||
|
status: 'pending' | 'approved' | 'rejected' | 'cancelled';
|
||||||
|
created_at: string;
|
||||||
|
employee: {
|
||||||
|
user: {
|
||||||
|
user_profile: {
|
||||||
|
full_name: string;
|
||||||
|
};
|
||||||
|
};
|
||||||
|
};
|
||||||
|
};
|
||||||
|
|
||||||
|
function formatShortDate(dateString: string): string {
|
||||||
|
const date = new Date(dateString);
|
||||||
|
|
||||||
|
return date.toLocaleDateString('id-ID', {
|
||||||
|
day: '2-digit',
|
||||||
|
month: 'short',
|
||||||
|
year: 'numeric',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function getStatusBadge(status: string) {
|
||||||
|
const statusConfig: Record<string, { label: string; className: string }> = {
|
||||||
|
pending: {
|
||||||
|
label: 'Menunggu',
|
||||||
|
className: 'bg-yellow-100 text-yellow-800 hover:bg-yellow-100',
|
||||||
|
},
|
||||||
|
approved: {
|
||||||
|
label: 'Disetujui',
|
||||||
|
className: 'bg-green-100 text-green-800 hover:bg-green-100',
|
||||||
|
},
|
||||||
|
rejected: {
|
||||||
|
label: 'Ditolak',
|
||||||
|
className: 'bg-red-100 text-red-800 hover:bg-red-100',
|
||||||
|
},
|
||||||
|
cancelled: {
|
||||||
|
label: 'Dibatalkan',
|
||||||
|
className: 'bg-gray-100 text-gray-800 hover:bg-gray-100',
|
||||||
|
},
|
||||||
|
};
|
||||||
|
|
||||||
|
const config = statusConfig[status] ?? statusConfig.pending;
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Badge variant="secondary" className={config.className}>
|
||||||
|
{config.label}
|
||||||
|
</Badge>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
type CreateColumnsParams = {
|
||||||
|
handleEdit: (leaveRequest: LeaveRequest) => void;
|
||||||
|
handleDeleteClick: (leaveRequest: LeaveRequest) => void;
|
||||||
|
handleApprove: (leaveRequest: LeaveRequest) => void;
|
||||||
|
handleReject: (leaveRequest: LeaveRequest) => void;
|
||||||
|
};
|
||||||
|
|
||||||
|
export function createLeaveRequestColumns(
|
||||||
|
params: CreateColumnsParams,
|
||||||
|
): ColumnDef<LeaveRequest>[] {
|
||||||
|
const { handleEdit, handleDeleteClick, handleApprove, handleReject } = params;
|
||||||
|
|
||||||
|
return [
|
||||||
|
{
|
||||||
|
id: 'no',
|
||||||
|
header: () => <span className="block text-center">No</span>,
|
||||||
|
cell: ({ row }) => (
|
||||||
|
<span className="block text-center">
|
||||||
|
{row.index + 1}
|
||||||
|
</span>
|
||||||
|
),
|
||||||
|
meta: {
|
||||||
|
className: 'w-[50px] text-center',
|
||||||
|
headerClassName: 'w-[50px] text-center',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 'employee_name',
|
||||||
|
header: () => <span>Oleh</span>,
|
||||||
|
cell: ({ row }) => {
|
||||||
|
const employee = row.original.employee;
|
||||||
|
|
||||||
|
return <span>{employee?.user?.user_profile?.full_name ?? '-'}</span>;
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
accessorKey: 'start_date',
|
||||||
|
header: ({ column }) => (
|
||||||
|
<Button
|
||||||
|
variant="ghost"
|
||||||
|
className="-ml-3 h-8"
|
||||||
|
onClick={() =>
|
||||||
|
column.toggleSorting(
|
||||||
|
column.getIsSorted() === 'asc',
|
||||||
|
)
|
||||||
|
}
|
||||||
|
>
|
||||||
|
<span>Tanggal Mulai</span>
|
||||||
|
<ArrowUpDown className="ml-2 h-4 w-4" />
|
||||||
|
</Button>
|
||||||
|
),
|
||||||
|
cell: ({ row }) => (
|
||||||
|
<span>{formatShortDate(row.getValue('start_date') as string)}</span>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
accessorKey: 'end_date',
|
||||||
|
header: ({ column }) => (
|
||||||
|
<Button
|
||||||
|
variant="ghost"
|
||||||
|
className="-ml-3 h-8"
|
||||||
|
onClick={() =>
|
||||||
|
column.toggleSorting(
|
||||||
|
column.getIsSorted() === 'asc',
|
||||||
|
)
|
||||||
|
}
|
||||||
|
>
|
||||||
|
<span>Tanggal Selesai</span>
|
||||||
|
<ArrowUpDown className="ml-2 h-4 w-4" />
|
||||||
|
</Button>
|
||||||
|
),
|
||||||
|
cell: ({ row }) => (
|
||||||
|
<span>{formatShortDate(row.getValue('end_date') as string)}</span>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
accessorKey: 'total_days',
|
||||||
|
header: ({ column }) => (
|
||||||
|
<Button
|
||||||
|
variant="ghost"
|
||||||
|
className="-ml-3 h-8"
|
||||||
|
onClick={() =>
|
||||||
|
column.toggleSorting(
|
||||||
|
column.getIsSorted() === 'asc',
|
||||||
|
)
|
||||||
|
}
|
||||||
|
>
|
||||||
|
<span>Hari</span>
|
||||||
|
<ArrowUpDown className="ml-2 h-4 w-4" />
|
||||||
|
</Button>
|
||||||
|
),
|
||||||
|
cell: ({ row }) => (
|
||||||
|
<span className="font-medium">
|
||||||
|
{row.getValue('total_days') as number} hari
|
||||||
|
</span>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
accessorKey: 'status',
|
||||||
|
header: () => <span>Status</span>,
|
||||||
|
cell: ({ row }) => (
|
||||||
|
<span>{getStatusBadge(row.getValue('status') as string)}</span>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 'actions',
|
||||||
|
header: () => <span className="block text-center">Aksi</span>,
|
||||||
|
meta: {
|
||||||
|
className: 'w-[150px] text-center',
|
||||||
|
headerClassName: 'w-[150px] text-center',
|
||||||
|
},
|
||||||
|
cell: ({ row }) => {
|
||||||
|
const leaveRequest = row.original;
|
||||||
|
|
||||||
|
return (
|
||||||
|
<TooltipProvider>
|
||||||
|
<div className="flex items-center justify-center gap-1">
|
||||||
|
{leaveRequest.status === 'pending' && (
|
||||||
|
<>
|
||||||
|
<Tooltip>
|
||||||
|
<TooltipTrigger asChild>
|
||||||
|
<Button
|
||||||
|
variant="ghost"
|
||||||
|
size="icon"
|
||||||
|
onClick={() =>
|
||||||
|
handleApprove(leaveRequest)
|
||||||
|
}
|
||||||
|
>
|
||||||
|
<CheckCircle className="h-4 w-4 text-green-600" />
|
||||||
|
</Button>
|
||||||
|
</TooltipTrigger>
|
||||||
|
<TooltipContent side="top">
|
||||||
|
Setujui
|
||||||
|
</TooltipContent>
|
||||||
|
</Tooltip>
|
||||||
|
|
||||||
|
<Tooltip>
|
||||||
|
<TooltipTrigger asChild>
|
||||||
|
<Button
|
||||||
|
variant="ghost"
|
||||||
|
size="icon"
|
||||||
|
onClick={() =>
|
||||||
|
handleReject(leaveRequest)
|
||||||
|
}
|
||||||
|
>
|
||||||
|
<XCircle className="h-4 w-4 text-red-600" />
|
||||||
|
</Button>
|
||||||
|
</TooltipTrigger>
|
||||||
|
<TooltipContent side="top">
|
||||||
|
Tolak
|
||||||
|
</TooltipContent>
|
||||||
|
</Tooltip>
|
||||||
|
</>
|
||||||
|
)}
|
||||||
|
|
||||||
|
<Tooltip>
|
||||||
|
<TooltipTrigger asChild>
|
||||||
|
<Button
|
||||||
|
variant="ghost"
|
||||||
|
size="icon"
|
||||||
|
onClick={() =>
|
||||||
|
handleEdit(leaveRequest)
|
||||||
|
}
|
||||||
|
>
|
||||||
|
<Pencil className="h-4 w-4" />
|
||||||
|
</Button>
|
||||||
|
</TooltipTrigger>
|
||||||
|
<TooltipContent side="top">
|
||||||
|
Edit
|
||||||
|
</TooltipContent>
|
||||||
|
</Tooltip>
|
||||||
|
|
||||||
|
<Tooltip>
|
||||||
|
<TooltipTrigger asChild>
|
||||||
|
<Button
|
||||||
|
variant="ghost"
|
||||||
|
size="icon"
|
||||||
|
onClick={() =>
|
||||||
|
handleDeleteClick(leaveRequest)
|
||||||
|
}
|
||||||
|
>
|
||||||
|
<Trash2 className="h-4 w-4 text-destructive" />
|
||||||
|
</Button>
|
||||||
|
</TooltipTrigger>
|
||||||
|
<TooltipContent side="top">
|
||||||
|
Hapus
|
||||||
|
</TooltipContent>
|
||||||
|
</Tooltip>
|
||||||
|
</div>
|
||||||
|
</TooltipProvider>
|
||||||
|
);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
];
|
||||||
|
}
|
||||||
309
resources/js/pages/admin/sdm/leave-request/index.tsx
Normal file
309
resources/js/pages/admin/sdm/leave-request/index.tsx
Normal file
@ -0,0 +1,309 @@
|
|||||||
|
import { ConfirmDialog } from '@/components/confirm-dialog';
|
||||||
|
import { DataTable } from '@/components/data-table';
|
||||||
|
import { DatePicker } from '@/components/date-picker';
|
||||||
|
import InputError from '@/components/input-error';
|
||||||
|
import { Button } from '@/components/ui/button';
|
||||||
|
import {
|
||||||
|
Dialog,
|
||||||
|
DialogContent,
|
||||||
|
DialogFooter,
|
||||||
|
DialogHeader,
|
||||||
|
DialogTitle,
|
||||||
|
} from '@/components/ui/dialog';
|
||||||
|
import { Label } from '@/components/ui/label';
|
||||||
|
import { approve, destroy, index as leaveRequestIndex, reject, store, update } from '@/routes/admin/sdm/leave-requests';
|
||||||
|
import { Form, Head, router } from '@inertiajs/react';
|
||||||
|
import { Plus } from 'lucide-react';
|
||||||
|
import { useEffect, useState } from 'react';
|
||||||
|
import type { LeaveRequest } from './columns';
|
||||||
|
import { createLeaveRequestColumns } from './columns';
|
||||||
|
|
||||||
|
type Props = {
|
||||||
|
leaveRequests: LeaveRequest[];
|
||||||
|
};
|
||||||
|
|
||||||
|
export default function LeaveRequestIndex({ leaveRequests }: Props) {
|
||||||
|
const [createOpen, setCreateOpen] = useState(false);
|
||||||
|
const [editing, setEditing] = useState<LeaveRequest | null>(null);
|
||||||
|
const [deleting, setDeleting] = useState<LeaveRequest | null>(null);
|
||||||
|
const [approving, setApproving] = useState<LeaveRequest | null>(null);
|
||||||
|
const [rejecting, setRejecting] = useState<LeaveRequest | null>(null);
|
||||||
|
const [startDate, setStartDate] = useState<Date | undefined>(undefined);
|
||||||
|
const [endDate, setEndDate] = useState<Date | undefined>(undefined);
|
||||||
|
const [editingStartDate, setEditingStartDate] = useState<Date | undefined>(undefined);
|
||||||
|
const [editingEndDate, setEditingEndDate] = useState<Date | undefined>(undefined);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if (editing) {
|
||||||
|
setEditingStartDate(new Date(editing.start_date));
|
||||||
|
setEditingEndDate(new Date(editing.end_date));
|
||||||
|
} else {
|
||||||
|
setEditingStartDate(undefined);
|
||||||
|
setEditingEndDate(undefined);
|
||||||
|
}
|
||||||
|
}, [editing]);
|
||||||
|
|
||||||
|
function handleDelete() {
|
||||||
|
if (!deleting) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
router.delete(destroy(deleting.id), {
|
||||||
|
onSuccess: () => setDeleting(null),
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleApprove() {
|
||||||
|
if (!approving) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
router.post(approve(approving.id), {}, {
|
||||||
|
onSuccess: () => setApproving(null),
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleReject() {
|
||||||
|
if (!rejecting) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
router.post(reject(rejecting.id), {}, {
|
||||||
|
onSuccess: () => setRejecting(null),
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
const columns = createLeaveRequestColumns({
|
||||||
|
handleEdit: (leaveRequest) => setEditing(leaveRequest),
|
||||||
|
handleDeleteClick: (leaveRequest) => setDeleting(leaveRequest),
|
||||||
|
handleApprove: (leaveRequest) => setApproving(leaveRequest),
|
||||||
|
handleReject: (leaveRequest) => setRejecting(leaveRequest),
|
||||||
|
});
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<Head title="Cuti" />
|
||||||
|
|
||||||
|
<div className="flex h-full flex-1 flex-col gap-6 overflow-x-auto p-4 md:p-6">
|
||||||
|
<div className="flex items-center justify-between">
|
||||||
|
<div>
|
||||||
|
<h2 className="text-2xl font-semibold tracking-tight">
|
||||||
|
Cuti
|
||||||
|
</h2>
|
||||||
|
</div>
|
||||||
|
<Dialog open={createOpen} onOpenChange={(open) => {
|
||||||
|
setCreateOpen(open);
|
||||||
|
if (!open) {
|
||||||
|
setStartDate(undefined);
|
||||||
|
setEndDate(undefined);
|
||||||
|
}
|
||||||
|
}}>
|
||||||
|
<Button asChild>
|
||||||
|
<button
|
||||||
|
type="button"
|
||||||
|
onClick={() => setCreateOpen(true)}
|
||||||
|
>
|
||||||
|
<Plus className="h-4 w-4" />
|
||||||
|
Tambah
|
||||||
|
</button>
|
||||||
|
</Button>
|
||||||
|
<DialogContent>
|
||||||
|
<Form action={store()} resetOnSuccess onSuccess={() => setCreateOpen(false)}>
|
||||||
|
{({ errors, processing }) => {
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<DialogHeader>
|
||||||
|
<DialogTitle>Tambah Permohonan Cuti</DialogTitle>
|
||||||
|
</DialogHeader>
|
||||||
|
<div className="grid gap-4 py-4">
|
||||||
|
<div className="grid gap-2">
|
||||||
|
<Label>
|
||||||
|
Tanggal Mulai{' '} <span className="text-destructive">*</span>
|
||||||
|
</Label>
|
||||||
|
<input type="hidden" name="start_date" value={startDate ? startDate.toISOString().split('T')[0] : ''} />
|
||||||
|
<DatePicker
|
||||||
|
value={startDate}
|
||||||
|
onChange={setStartDate}
|
||||||
|
placeholder="Pilih tanggal mulai"
|
||||||
|
min={new Date()}
|
||||||
|
/>
|
||||||
|
<InputError message={errors.start_date} />
|
||||||
|
</div>
|
||||||
|
<div className="grid gap-2">
|
||||||
|
<Label>
|
||||||
|
Tanggal Selesai{' '} <span className="text-destructive">*</span>
|
||||||
|
</Label>
|
||||||
|
<input type="hidden" name="end_date" value={endDate ? endDate.toISOString().split('T')[0] : ''} />
|
||||||
|
<DatePicker
|
||||||
|
value={endDate}
|
||||||
|
onChange={setEndDate}
|
||||||
|
placeholder="Pilih tanggal selesai"
|
||||||
|
min={startDate}
|
||||||
|
/>
|
||||||
|
<InputError message={errors.end_date} />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<DialogFooter>
|
||||||
|
<Button
|
||||||
|
type="button"
|
||||||
|
variant="outline"
|
||||||
|
onClick={() => setCreateOpen(false)}
|
||||||
|
>
|
||||||
|
Batal
|
||||||
|
</Button>
|
||||||
|
<Button
|
||||||
|
type='submit'
|
||||||
|
disabled={processing}
|
||||||
|
>
|
||||||
|
{processing
|
||||||
|
? 'Menyimpan...'
|
||||||
|
: 'Simpan'}
|
||||||
|
</Button>
|
||||||
|
</DialogFooter>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}}
|
||||||
|
</Form>
|
||||||
|
</DialogContent>
|
||||||
|
</Dialog>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<DataTable
|
||||||
|
columns={columns}
|
||||||
|
data={leaveRequests}
|
||||||
|
searchKey="employee.user.user_profile.full_name"
|
||||||
|
searchPlaceholder="Cari nama karyawan..."
|
||||||
|
emptyText="Belum ada data permohonan cuti."
|
||||||
|
/>
|
||||||
|
|
||||||
|
<Dialog
|
||||||
|
open={editing !== null}
|
||||||
|
onOpenChange={(open) => {
|
||||||
|
if (!open) {
|
||||||
|
setEditing(null);
|
||||||
|
setEditingStartDate(undefined);
|
||||||
|
setEditingEndDate(undefined);
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<DialogContent>
|
||||||
|
{editing && (
|
||||||
|
<Form action={update(editing.id)} resetOnSuccess onSuccess={() => {
|
||||||
|
setEditing(null);
|
||||||
|
setEditingStartDate(undefined);
|
||||||
|
setEditingEndDate(undefined);
|
||||||
|
}}>
|
||||||
|
{({ errors, processing }) => {
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<DialogHeader>
|
||||||
|
<DialogTitle>Edit Permohonan Cuti</DialogTitle>
|
||||||
|
</DialogHeader>
|
||||||
|
<div className="grid gap-4 py-4">
|
||||||
|
<div className="grid gap-2">
|
||||||
|
<Label>Tanggal Mulai{' '} <span className="text-destructive">*</span></Label>
|
||||||
|
<input type="hidden" name="start_date" value={editingStartDate ? editingStartDate.toISOString().split('T')[0] : ''} />
|
||||||
|
<DatePicker
|
||||||
|
value={editingStartDate}
|
||||||
|
onChange={setEditingStartDate}
|
||||||
|
placeholder="Pilih tanggal mulai"
|
||||||
|
min={new Date()}
|
||||||
|
/>
|
||||||
|
<InputError message={errors.start_date} />
|
||||||
|
</div>
|
||||||
|
<div className="grid gap-2">
|
||||||
|
<Label>Tanggal Selesai{' '} <span className="text-destructive">*</span></Label>
|
||||||
|
<input type="hidden" name="end_date" value={editingEndDate ? editingEndDate.toISOString().split('T')[0] : ''} />
|
||||||
|
<DatePicker
|
||||||
|
value={editingEndDate}
|
||||||
|
onChange={setEditingEndDate}
|
||||||
|
placeholder="Pilih tanggal selesai"
|
||||||
|
min={editingStartDate}
|
||||||
|
/>
|
||||||
|
<InputError message={errors.end_date} />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<DialogFooter>
|
||||||
|
<Button
|
||||||
|
type="button"
|
||||||
|
variant="outline"
|
||||||
|
onClick={() => {
|
||||||
|
setEditing(null);
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
Batal
|
||||||
|
</Button>
|
||||||
|
<Button
|
||||||
|
type="submit"
|
||||||
|
disabled={processing}
|
||||||
|
>
|
||||||
|
{processing
|
||||||
|
? 'Menyimpan...'
|
||||||
|
: 'Simpan'}
|
||||||
|
</Button>
|
||||||
|
</DialogFooter>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}}
|
||||||
|
</Form>
|
||||||
|
)}
|
||||||
|
</DialogContent>
|
||||||
|
</Dialog>
|
||||||
|
|
||||||
|
<ConfirmDialog
|
||||||
|
open={deleting !== null}
|
||||||
|
onOpenChange={(open) => {
|
||||||
|
if (!open) {
|
||||||
|
setDeleting(null);
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
title="Hapus Permohonan Cuti"
|
||||||
|
description={`Apakah Anda yakin ingin menghapus permohonan cuti ini? Tindakan ini tidak dapat dibatalkan.`}
|
||||||
|
confirmLabel="Hapus"
|
||||||
|
onConfirm={handleDelete}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<ConfirmDialog
|
||||||
|
open={approving !== null}
|
||||||
|
onOpenChange={(open) => {
|
||||||
|
if (!open) {
|
||||||
|
setApproving(null);
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
title="Setujui Permohonan Cuti"
|
||||||
|
description={`Apakah Anda yakin ingin menyetujui permohonan cuti ini?`}
|
||||||
|
confirmLabel="Setujui"
|
||||||
|
onConfirm={handleApprove}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<ConfirmDialog
|
||||||
|
open={rejecting !== null}
|
||||||
|
onOpenChange={(open) => {
|
||||||
|
if (!open) {
|
||||||
|
setRejecting(null);
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
title="Tolak Permohonan Cuti"
|
||||||
|
description={`Apakah Anda yakin ingin menolak permohonan cuti ini?`}
|
||||||
|
confirmLabel="Tolak"
|
||||||
|
onConfirm={handleReject}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
LeaveRequestIndex.layout = {
|
||||||
|
breadcrumbs: [
|
||||||
|
{
|
||||||
|
title: 'SDM',
|
||||||
|
href: leaveRequestIndex(),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: 'Cuti',
|
||||||
|
href: leaveRequestIndex(),
|
||||||
|
},
|
||||||
|
],
|
||||||
|
};
|
||||||
@ -6,6 +6,7 @@
|
|||||||
use App\Http\Controllers\Admin\Master\CategoryController;
|
use App\Http\Controllers\Admin\Master\CategoryController;
|
||||||
use App\Http\Controllers\Admin\Master\CustomerController;
|
use App\Http\Controllers\Admin\Master\CustomerController;
|
||||||
use App\Http\Controllers\Admin\Master\SupplierController;
|
use App\Http\Controllers\Admin\Master\SupplierController;
|
||||||
|
use App\Http\Controllers\Admin\SDM\LeaveRequestController;
|
||||||
use Illuminate\Support\Facades\Route;
|
use Illuminate\Support\Facades\Route;
|
||||||
|
|
||||||
Route::inertia('/', 'welcome')->name('home');
|
Route::inertia('/', 'welcome')->name('home');
|
||||||
@ -32,6 +33,12 @@
|
|||||||
Route::post('employee-advances/{employeeAdvance}/approve', [EmployeeAdvanceController::class, 'approve'])->name('employee-advances.approve');
|
Route::post('employee-advances/{employeeAdvance}/approve', [EmployeeAdvanceController::class, 'approve'])->name('employee-advances.approve');
|
||||||
Route::post('employee-advances/{employeeAdvance}/pay', [EmployeeAdvanceController::class, 'pay'])->name('employee-advances.pay');
|
Route::post('employee-advances/{employeeAdvance}/pay', [EmployeeAdvanceController::class, 'pay'])->name('employee-advances.pay');
|
||||||
});
|
});
|
||||||
|
|
||||||
|
Route::prefix('admin/sdm')->name('admin.sdm.')->group(function () {
|
||||||
|
Route::resource('leave-requests', LeaveRequestController::class)->except(['show', 'create', 'edit']);
|
||||||
|
Route::post('leave-requests/{leaveRequest}/approve', [LeaveRequestController::class, 'approve'])->name('leave-requests.approve');
|
||||||
|
Route::post('leave-requests/{leaveRequest}/reject', [LeaveRequestController::class, 'reject'])->name('leave-requests.reject');
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
require __DIR__.'/settings.php';
|
require __DIR__.'/settings.php';
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user