@extends('layouts.appv2')

@section('content')

    @if ($message = Session::get('success'))
            <div class="alert alert-success" role="alert">
                {{ $message }}
            </div>
        @endif

        @if ($message = Session::get('error'))
            <div class="alert alert-danger" role="alert">
                {{ $message }}
            </div>
        @endif

        @if ($errors->any())
            <div class="alert alert-danger" role="alert">
                <ul>
                    @foreach ($errors->all() as $error)
                        <li>{{ $error }}</li>
                    @endforeach
                </ul>
            </div>
        @endif

    @if ($errors->any())
        <div class="alert alert-danger">
            <ul>
                @foreach ($errors->all() as $error)
                    <li>{{ $error }}</li>
                @endforeach
            </ul>
        </div>
    @endif

    <div class="card" style="border-radius: 20px;  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);">
                    <div class="card-header">
                        <div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 mb-2">
                            <h5>Edit Staff Leaves Record</h5>
                            <form action="{{ route('admins.updateeditleavestaff', $employee->employee_id) }}" id="updateleaves" method="post" enctype="multipart/form-data">
                                @csrf
                                    <div class="btn-toolbar mb-2 mb-md-0">
                                        <div class="btn-group">
                                            <button type="button" class="btn btn-sm btn-outline-primary" name="update" data-toggle="modal" data-target="#UpdateModal">
                                                <i class="fas fa-save"></i>Update
                                            </button>                                      
                                            <div class="modal fade" id="UpdateModal" tabindex="-1" role="dialog" aria-labelledby="UpdateModallabel" aria-hidden="true">
                                                <div class="modal-dialog" role="document">
                                                    <div class="modal-content">
                                                        <div class="modal-header">
                                                            <h5 class="modal-title" id="UpdateModallabel">Update Entitled Leaves</h5>
                                                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                                                <span aria-hidden="true">&times;</span>
                                                            </button>
                                                        </div>

                                                        <div class="modal-body">
                                                            <div class="form-group">
                                                                <label for="recipient-name" class="col-form-label">Change Title:</label>
                                                                <input type="text" class="form-control" id="changetitle" name="change_title">
                                                            </div>    

                                                            <div class="form-group">
                                                                <div class="custom-file">
                                                                    <input type="file" class="custom-file-input" id="customFile" name="attachment">
                                                                    <label class="custom-file-label" for="customFile">Choose file</label>
                                                                </div>
                                                            </div>

                                                            <div class="form-group">
                                                                <label for="message-text" class="col-form-label">Remark:</label>
                                                                <textarea class="form-control" id="message-text" id="updateremark" name="remark"></textarea>
                                                            </div>
                                                        </div>
                                                        <div class="modal-footer">
                                                            <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                                                            <button type="submit" class="btn btn-primary" name="updateleaves">Update</button>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>

                                        <div class="btn-group mr-2">
                                            <a class="btn btn-sm btn-outline-info btn-back" href="{{route('admins.showleaveupdatehistory' , $employee->employee_id)}} ">
                                                View All Update</a>
                                            <a class="btn btn-sm btn-outline-secondary btn-back" href="{{route('admins.leavestaff')}} ">
                                                <i class="far fa-arrow-alt-circle-left"></i>
                                                Back</a>
                                        </div>
                                    </div>
                        </div>
                    </div>

                    <div class="card-body">                      
                        <div class="mb-3">
                            <div class="form-group row">
                                <label for="employee_first_name" class="col-sm-2 col-form-label">Employee Name</label>
                                <div class="col-sm-4">
                                    <a class="form-control-plaintext form-control-sm-2 font-weight-bold" >{{ $employee->employee_first_name }}</a>
                                </div>
                                
                            </div>

                            <div class="form-group row">
                                <label for="employee_first_name" class="col-sm-2 col-form-label">Employee Type</label>
                                <div class="col-sm-4">
                                    <a class="form-control-plaintext form-control-sm-2 font-weight-bold" >{{ $employee->emptype->emptype_name ?? 'N/A' }}</a>
                                </div>
                            </div>

                            <div class="form-group row">
                                <label for="employee_first_name" class="col-sm-2 col-form-label">Last Modified Date</label>
                                <div class="col-sm-4">
                                    <a class="form-control-plaintext form-control-sm-2 font-weight-bold">
                                        {{ $leaveEntitled && $leaveEntitled->modified_date 
                                            ? \Carbon\Carbon::parse($leaveEntitled->modified_date)->format('d M Y') 
                                            : 'N/A' }}
                                    </a>
                                </div>
                            </div>
                
                            <div class="form-row mt-4">
                                <div class="form-group col-sm-6">
                                    <label for="al_entitled">AL Entitled</label>
                                    <input type="number" class="form-control form-control-sm font-weight-bold" id="al_entitled" 
                                        name="new_al" value="{{ $leaveEntitled->AL ?? 'N/A' }}" 
                                        step="0.5" min="0" pattern="[0-9]+(\.[05])?" required>
                                    <input type="hidden" name="old_al" class="form-control form-control-sm text-right" value="">
                                </div>

                                <div class="form-group col-sm-6">
                                    <label for="el_entitled">EL Entitled</label>
                                    <input type="number" class="form-control form-control-sm font-weight-bold" id="el_entitled" 
                                        name="new_el" value="{{ $leaveEntitled->EL ?? 'N/A' }}" 
                                        step="0.5" min="0" pattern="[0-9]+(\.[05])?" required>
                                    <input type="hidden" name="old_el" class="form-control form-control-sm text-right" value="">
                                </div>
                            </div>

                            <div class="form-row">
                                <div class="form-group col-sm-6">
                                    <label for="ml_entitled">ML Entitled</label>
                                    <input type="number" class="form-control form-control-sm font-weight-bold" id="ml_entitled" 
                                        name="new_ml" value="{{ $leaveEntitled->ML ?? 'N/A' }}" 
                                        step="0.5" min="0" pattern="[0-9]+(\.[05])?" required>
                                    <input type="hidden" name="old_ml" class="form-control form-control-sm text-right" value="">
                                </div>

                                <div class="form-group col-sm-6">
                                    <label for="rl_entitled">RL Entitled</label>
                                    <input type="number" class="form-control form-control-sm font-weight-bold" id="rl_entitled" 
                                        name="new_rl" value="{{ $leaveEntitled->RL ?? 'N/A' }}" 
                                        step="0.5" min="0" pattern="[0-9]+(\.[05])?" required>
                                    <input type="hidden" name="old_rl" class="form-control form-control-sm text-right" value="">
                                </div>
                            </div>

                            <div class="form-row">
                                <div class="form-group col-sm-6">
                                    <label for="balance_last_year">Balance Last Year</label>
                                    <input type="number" class="form-control form-control-sm font-weight-bold" id="balance_last_year" 
                                        name="new_balance_last_year" value="{{ $leaveEntitled->balance_last_year ?? 'N/A' }}" 
                                        step="0.5" min="0" pattern="[0-9]+(\.[05])?" required>
                                    <input type="hidden" name="old_balance_last_year" class="form-control form-control-sm text-right" value="">
                                </div>

                                <div class="form-group col-sm-6">
                                    <label for="total_al_entitled">Total AL Entitled</label>
                                    <input type="text" class="form-control form-control-sm font-weight-bold" id="total_al_entitled" 
                                        value="{{ ($leaveEntitled->carry_forward ?? 0) + ($leaveEntitled->AL ?? 0) }}" 
                                        disabled>
                                    <input type="hidden" name="" class="form-control form-control-sm text-right" value="">
                                </div>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>

    <script>
        document.addEventListener("DOMContentLoaded", function () {
            document.querySelectorAll('input[type="number"]').forEach(input => {
                input.addEventListener("input", function () {
                    let value = parseFloat(this.value);
                    if (value % 0.5 !== 0) {
                        alert("Sila masukkan nombor yang berakhir dengan .0 atau .5 sahaja!");
                        this.value = "";
                    }
                });
            });
        });
    </script>
@endsection