@extends('layout.app')

@section('content')
    <div class="card">
        <div class="card-body">
            <form action="{{ route('experity.change') }}" method="post">
                @csrf

                <div class="row">
                    <div class="col-md-8">
                        <div class="form-group">
                            <label class="flex-1 block text-gray-700 text-sm font-bold mb-2" for="pop_id">
                                Pop Name
                            </label>

                            <select name="pop_id" id="pop_id" class="select2 form-control" required>
                                <option value="">Select Pop</option>
                                @foreach ($non_expired_pops as $nas)
                                    <option class="p-5" value="{{ $nas->id }}">{{ $nas->popname }} </option>
                                @endforeach
                            </select>
                        </div>
                    </div>

                    <div class="col-md-4">
                        <div class="form-group">
                            <label class="flex-1 block text-gray-700 text-sm font-bold mb-2" for="expire_date">
                                Exception End Date <small class="text-muted">(optional)</small>
                            </label>

                            <input type="date" name="expire_date" id="expire_date"
                                class="form-control @error('expire_date') is-invalid @enderror"
                                value="{{ old('expire_date') }}" min="{{ now()->addDay()->toDateString() }}">

                            @error('expire_date')
                                <span class="text-danger">{{ $message }}</span>
                            @enderror

                            <small class="form-text text-muted">
                                Leave it empty to keep the POP on this list until you remove it. With a date, the POP
                                drops off the list automatically after that day.
                            </small>
                        </div>
                    </div>
                </div>

                <div class="form-group float-right">
                    <button class="btn btn-primary" type="submit">Exclude</button>
                    <button class="btn btn-info" type="reset" id="reset">Reset</button>
                </div>

            </form>
        </div>
    </div>

    <div class="card">
        <div class="card-body table-responsive">

            <table class="table table-striped table-condensed">
                <thead class="bg-gray">
                    <tr>
                        <th>
                            ID
                        </th>
                        <th>
                            Pop name
                        </th>
                        <th>
                            Manager Name
                        </th>
                        <th>
                            NAS Server IP
                        </th>
                        <th>
                            POP Location
                        </th>
                        <th>
                            POP Status
                        </th>
                        <th>
                            Exception End Date
                        </th>

                        <th>

                        </th>
                    </tr>
                </thead>
                <tbody>
                    @foreach ($expired_pops as $r)
                        <tr>
                            <td>
                                {{ $r->id }}
                                <input type="hidden" id="client_id" value=" {{ $r->id }}">
                            </td>
                            <td>
                                {{ $r->popname ?? '' }}
                            </td>
                            <td>
                                {{ $r->reseller->name ?? '' }}
                            </td>

                            <td class="whitespace-nowrap">
                                {{ $r->nas->nasname ?? '' }}
                            </td>
                            <td>
                                {{ $r->pop_location }}
                            </td>
                            <td>
                                {{ $r->status }}
                            </td>
                            <td class="whitespace-nowrap">
                                @if ($r->experity_check_expire_date)
                                    {{ \Carbon\Carbon::parse($r->experity_check_expire_date)->format('d-M-Y') }}
                                    <small class="d-block text-muted">
                                        {{ \Carbon\Carbon::parse($r->experity_check_expire_date)->diffInDays(today()) }}
                                        day(s) left
                                    </small>
                                @else
                                    <span class="badge badge-secondary">No end date</span>
                                @endif

                                <a href="#" class="small d-inline-block mt-1 toggle-end-date"
                                    data-target="end-date-{{ $r->id }}">
                                    <i class="fa fa-pencil"></i> Change
                                </a>

                                <form action="{{ route('experity.exception.date.update') }}" method="POST"
                                    id="end-date-{{ $r->id }}" class="mt-1" style="display: none;">
                                    @csrf
                                    <input type="hidden" name="pop_id" value="{{ $r->id }}">

                                    <div class="input-group input-group-sm">
                                        <input type="date" name="expire_date" class="form-control"
                                            value="{{ $r->experity_check_expire_date ? \Carbon\Carbon::parse($r->experity_check_expire_date)->toDateString() : '' }}"
                                            min="{{ now()->addDay()->toDateString() }}">
                                        <div class="input-group-append">
                                            <button type="submit" class="btn btn-primary">Save</button>
                                        </div>
                                    </div>

                                    <small class="form-text text-muted">
                                        Clear the date to keep this POP on the list until you remove it.
                                    </small>
                                </form>
                            </td>
                            <td class="px-6 text-left text-sm font-medium">
                                <form action="{{ route('experity.change') }}" method="POST" class="float-right">
                                    @csrf
                                    <input type="hidden" name="pop_id" value="{{ $r->id }}">
                                    <button type="submit" class="btn btn-info"><i class="fa fa-trash"></i> Delete</button>
                                </form>
                            </td>
                        </tr>
                    @endforeach
                </tbody>
            </table>
        </div>
    </div>
@endsection

@push('js')
    <script>
        $(document).on('click', '.toggle-end-date', function(e) {
            e.preventDefault();
            $('#' + $(this).data('target')).toggle();
        });
    </script>
@endpush