@extends('layouts.admin')
@section('content')
    <div class="col-9 main-dash-left">
        <div class="upper-main-user-navigation">
            <div class="user-manage">
                <a href="{{ route('admin.profile') }}">My profile</a>
                <a class="active">Profile</a>
            </div>
        </div>

        <div class="add-user-form">
            <div class="profile-img-btn d-flex justify-content-between align-items-center">
                <div class="profile-pic my-profile-img">
                    <figure class="profile-img"><img src="{{ asset('storage/' . $admin->image) }}" alt=""></figure>
                </div>
                <a class="add-notification-btn" href="{{ route('admin.edit.profile') }}">Edit profile</a>
            </div>
            <div class="name-profile-holder">
                <h3>{{ $admin->first_name . ' ' . $admin->last_name }}</h3>
            </div>
            <div class="profile-detai-all">
                <div class="inner-detail-profile">
                    <div class="name-profile-detail">
                        <h6>Company Name:</h6>
                        <p>{{ $admin->company_name }}</p>
                    </div>

                    <div class="pair-streetmain d-flex">
                        <div class="inner-pair-street">
                            <div class="name-profile-detail">
                                <h6>Street, House Number:</h6>
                                <p>{{ $admin->address }}</p>
                            </div>
                            <div class="name-profile-detail">
                                <h6>City:</h6>
                                <p>{{ $admin->address }}</p>
                            </div>
                            <div class="name-profile-detail">
                                <h6>Email Address :</h6>
                                <p>{{ $admin->email }}</p>
                            </div>
                            <div class="name-profile-detail">
                                <h6>Tax Number:</h6>
                                <p>{{ $admin->tax_number }}</p>
                            </div>
                            <div class="name-profile-detail">
                                <h6>Working Hours:</h6>
                                <div class="time-profile-all">
                                    @foreach ($time as $availability)
                                        @if ($availability->open_time && $availability->close_time)
                                            <p><span>{{ $availability->day }}:</span>{{ \Carbon\Carbon::parse($availability->open_time)->format('H:i') }}
                                                - {{ \Carbon\Carbon::parse($availability->close_time)->format('H:i') }}</p>
                                        @else
                                            <p><span>{{ $availability->day }}:</span>Closed</p>
                                        @endif
                                    @endforeach
                                </div>
                            </div>
                        </div>
                        <div class="inner-pair-street">
                            <div class="name-profile-detail">
                                <h6>Zip Code:</h6>
                                <p>{{ $admin->zip_code }}</p>
                            </div>
                            <div class="name-profile-detail">
                                <h6>Country:</h6>
                                <p>{{ $admin->state }}</p>
                            </div>
                            <div class="name-profile-detail">
                                <h6>Phone Number :</h6>
                                @foreach ($country_code as $code)
                                    @if ($code['dial_code'] == $admin->country_code)
                                        <p>{{ $code['emoji'] }}{{ $code['dial_code'] }} {{ $admin->number }}</p>
                                    @endif
                                @endforeach
                            </div>
                            <div class="name-profile-detail">
                                <h6>UMSt.-ID:</h6>
                                <p>{{ $admin->umsatzsteuer }}</p>
                            </div>
                        </div>
                    </div>

                    <div class="abcent-days">
                        <div class="head-abcent-days">
                            <h3>Absent Days:</h3>
                            <button class="add-notification-btn" type="button" data-bs-toggle="modal"
                                data-bs-target="#exampleModal" data-bs-whatever="@getbootstrap">add holiday</button>
                        </div>

                        <div class="modal add-holiday-modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel"
                            aria-hidden="true" style="display: none;">
                            <div class="modal-dialog">
                                <div class="modal-content">
                                    <div class="modal-header">
                                        <h1 class="modal-title" id="exampleModalLabel">Add Holiday</h1>
                                        <!-- <button type="button" class="btn-close" data-bs-dismiss="modal"
                                            aria-label="Close"></button> -->
                                    </div>
                                    <div class="modal-body">
                                        <form id="holiday_add_form" action="{{ route('admin.holidays.add') }}"
                                            method="POST">
                                            @csrf
                                            <div class="mb-3 comn-input-select">
                                                <label for="holiday_name" class="col-form-label">Holiday Name:</label>
                                                <input type="text" class="form-control" id="holiday_name"
                                                    name="holiday_name" required>
                                            </div>
                                            <div class="mb-3 comn-input-select">
                                                <label for="date_text" class="col-form-label">Date:</label>
                                                <input class="form-control" id="date_text" type="date"
                                                    name="holiday_date" required>
                                            </div>
                                            <div class="upper-main-btn-last-comn d-flex">
                                                <button type="button" class="add-user"
                                                    data-bs-dismiss="modal">Cancel</button>
                                                <button type="submit" class="cancel-btn">Save</button>
        
                                            </div>
                                    </div>
                                   
                                    </form>

                                </div>
                            </div>
                        </div>
                        <div class="table-abcent-list">
                            <table>
                                @if ($holidays->isEmpty())
                                    <tr>
                                        <td colspan="4" class="text-center">No Holidays Available</td>
                                    </tr>
                                @else
                                    @foreach ($holidays as $holiday)
                                        <tr>
                                            <td class="abcent-name">{{ $holiday->name }}</td>
                                            <td class="abcent-date"
                                                data-date="{{ \Carbon\Carbon::parse($holiday->date)->format('Y-m-d') }}">
                                                {{ \Carbon\Carbon::parse($holiday->date)->format('d-m-Y') }}
                                            </td>
                                            <td class="abcent-total"></td>
                                            <td class="delete-last">
                                                <div class="delete-ico" data-bs="{{ $holiday->id }}"
                                                    data-route="{{ route('admin.holidays.delete', $holiday->id) }}">
                                                    <i class="fa-solid fa-trash" data-bs="{{ $holiday->id }}"></i>
                                                </div>
                                            </td>
                                        </tr>
                                    @endforeach
                                @endif
                                {{-- <tr>
                                <td class="abcent-name">Abcent</td>
                                <td class="abcent-date">Fr, 18.04.2025</td>
                                <td class="abcent-total">in 92 Tagen</td>
                                <td class="delete-last">
                                    <div class="delete-ico">
                                        <i class="fa-solid fa-trash"></i>
                                    </div>
                                </td>
                            </tr>
                            <tr>
                                <td class="abcent-name">Abcent</td>
                                <td class="abcent-date">Fr, 18.04.2025</td>
                                <td class="abcent-total">in 92 Tagen</td>
                                <td class="delete-last">
                                    <div class="delete-ico">
                                        <i class="fa-solid fa-trash"></i>
                                    </div>
                                </td>
                            </tr> --}}
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script>
        document.addEventListener("DOMContentLoaded", function() {
            let today = new Date();
            today.setHours(0, 0, 0, 0);

            document.querySelectorAll(".abcent-date").forEach(function(element) {
                let holidayDateStr = element.getAttribute("data-date");
                let holidayDate = new Date(holidayDateStr + "T00:00:00");
                holidayDate.setHours(0, 0, 0, 0);

                let timeDiff = holidayDate - today;
                let daysLeft = Math.ceil(timeDiff / (1000 * 60 * 60 * 24));

                let daysLeftCell = element.closest("tr").querySelector(".abcent-total");
                daysLeftCell.textContent = daysLeft > 0 ? `in ${daysLeft} Tagen` : daysLeft === 0 ?
                    "Today" : `vor ${Math.abs(daysLeft)} Tagen`;
            });
        });
        document.addEventListener("DOMContentLoaded", function() {
            document.querySelectorAll(".delete-ico").forEach(function(deleteButton) {
                deleteButton.addEventListener("click", function() {
                    let holidayId = this.getAttribute("data-id");
                    let deleteRoute = this.getAttribute("data-route");
                    let row = this.closest("tr");
                    if (confirm("Are you sure you want to delete this holiday?")) {
                        fetch(deleteRoute, {
                                method: "DELETE",
                                headers: {
                                    "X-CSRF-TOKEN": document.querySelector(
                                        'meta[name="csrf-token"]').getAttribute("content"),
                                    "Content-Type": "application/json",
                                },
                            })
                            .then(response => response.json())
                            .then(data => {
                                if (data.success) {
                                    row.remove();
                                    Swal.fire({
                                        title: "Deleted Successfully",
                                        icon: "success",
                                        draggable: true
                                    });
                                } else {
                                    alert("Error deleting holiday.");
                                }
                            })
                            .catch(error => console.error("Error:", error));
                    }
                });
            });
        });
    </script>
@endsection