@extends('layouts/contentNavbarLayout')
@section('title', 'Leave Policy')
@section('page-script')
<!-- Add necessary scripts here for handling modals, form submissions, etc. -->
@endsection

@section('content')
<div class="container-xxl flex-grow-1 container-p-y">
<div
    class="d-flex flex-column flex-md-row justify-content-between align-items-start align-items-md-center mb-6 gap-3 card mb-3">
    <div class="d-flex flex-column justify-content-center p-3">
        <div class="d-flex align-items-center mb-1">
            <h5 class="card-title mb-0">Leave Policy</h5>
        </div>
        <p class="mt-1">
            Define the leave entitlements, Paid leave limits, holiday schedules, and weekly offs applicable to your employees.
            These settings will be used to calculate leave balances and salary deductions accurately.
        </p>
        <ul class="mb-0">
            <li>Set the number of allowed Paid leaves per month or year</li>
            <li>Specify weekly off days (e.g., Sundays, Saturdays)</li>
            <li>Mark company-wide holidays that should not count as leave</li>
        </ul>
    </div>
</div>


    <div class="row">
        <!-- Left Column -->
        <div class="col-12 col-lg-8">
            <!-- Manage Holidays -->
            <div class="card mb-6">
                <div class="card-datatable">
                    <div class="row card-header mx-0 px-2">
                        <div
                            class="d-md-flex justify-content-between align-items-center dt-layout-start col-md-auto me-auto">
                            <h5 class="card-title mb-0">Manage Holiday</h5>
                        </div>
                        <div
                            class="d-md-flex justify-content-between align-items-center dt-layout-end col-md-auto ms-auto">
                            <h6 class="m-0">
                                <a href="javascript:void(0)" data-bs-toggle="modal"
                                    data-bs-target="#addHolidayModal">Add</a>
                            </h6>
                        </div>
                    </div>

                    <div class="table-responsive">
                        <table class="table datatables-order-details mb-0">
                            <thead>
                                <tr>
                                    <th><input class="form-check-input" type="checkbox" aria-label="Select all rows">
                                    </th>
                                    <th>Holiday Name</th>
                                    <th>Date</th>
                                    <th>Action</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach($holidays as $holiday)
                                <tr>
                                    <td><input class="form-check-input" type="checkbox"></td>
                                    <td>{{ $holiday->title }}</td>
                                    <td>{{ \Carbon\Carbon::parse($holiday->holiday_date)->format('d M, Y') }}</td>
                                    <td>
                                        <form id="delete-form-{{ $holiday->id }}" method="POST"
                                            action="{{ route('leave.policy.holiday.destroy', $holiday->id) }}"
                                            class="d-inline">
                                            @csrf
                                            @method('DELETE')
                                            <a href="javascript:void(0);" class="btn text-danger"
                                                onclick="if(confirm('Are you sure you want to delete this holiday?')) document.getElementById('delete-form-{{ $holiday->id }}').submit();">
                                                <span class="mdi mdi-delete-outline"></span>
                                            </a>
                                        </form>
                                    </td>
                                </tr>
                                @endforeach
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>

            <!-- Sick Leave Limits -->
            <div class="card mb-6 mt-3">
                <h5 class="card-header">Sick Leave Limits</h5>
                <div class="card-body">
                    <form method="POST" action="{{ route('leave.policy.company-sick-leave.update') }}">
                        @csrf
                        <div class="alert alert-warning alert-dismissible" role="alert">
                            <h5 class="alert-heading mb-1">Sick Leave Policy Information</h5>
                            <span>
                                This value defines the <strong>company-wide allowed Paid leaves</strong> per Month for
                                all employees.
                                <br>
                                <strong>Current Limit:</strong>
                                {{ $companySickLeave->allowed_sick_leaves ?? 'Not set' }} day(s)
                            </span>
                            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
                        </div>

                        <div class="row gx-5">
                            <div class="mb-4 col-12 col-sm-6">
                                <div class="form-floating form-floating-outline">
                                    <input class="form-control" type="number" name="allowed_sick_leaves"
                                        value="{{ $companySickLeave->allowed_sick_leaves ?? '' }}" required min="0">
                                    <label>Allowed Sick Leaves (Company-wide)</label>
                                </div>
                            </div>
                            <div class="col-12">
                                <button type="submit" class="btn btn-primary me-2">Save Sick Leave Limit</button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>

        <!-- Right Column -->
        <div class="col-12 col-lg-4">
            <div class="card mb-6">
                <div class="card-body">
                    <h5 class="card-title mb-4">Set Weekly Leave Settings</h5>
                    <form method="POST" action="{{ route('leave.policy.weekly-leave.store') }}">
                        @csrf
                        @foreach(['Sunday','Monday','Tuesday','Wednesday','Thursday','Friday','Saturday'] as $day)
                        @php
                        $isChecked = $weeklyLeaveSettings[$day]->is_leave ?? false;
                        @endphp
                        <div class="d-flex mb-4 align-items-center">
                            <div class="flex-grow-1 d-flex align-items-center justify-content-between">
                                <div>
                                    <h6 class="mb-0">{{ $day }}</h6>
                                </div>
                                <div class="text-end">
                                    <div class="form-check form-switch mb-0">
                                        <input type="checkbox" class="form-check-input" name="weekly_leave[]"
                                            value="{{ $day }}" {{ $isChecked ? 'checked' : '' }}>
                                    </div>
                                </div>
                            </div>
                        </div>
                        @endforeach

                        <button type="submit" class="btn btn-primary">Update Weekly Leave</button>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="addHolidayModal" tabindex="-1" aria-labelledby="addHolidayModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="addHolidayModalLabel">Add Holiday</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <form action="{{ route('leave.policy.holiday.store') }}" method="POST">
                @csrf
                <div class="modal-body">
                    <div class="mb-3">
                        <label for="title" class="form-label">Holiday Name</label>
                        <input type="text" class="form-control" id="title" name="title" required>
                    </div>
                    <div class="mb-3">
                        <label for="holiday_date" class="form-label">Holiday Date</label>
                        @php
                        $tomorrow = \Carbon\Carbon::tomorrow()->format('Y-m-d');
                        @endphp
                        <input type="date" class="form-control" id="holiday_date" name="holiday_date"
                            min="{{ $tomorrow }}" required>

                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
                    <button type="submit" class="btn btn-primary">Add Holiday</button>
                </div>
            </form>
        </div>
    </div>
</div>
@endsection