@extends('tenant.rentals.rentals-tabs')

@section('breadcrumb')
    @include('tenant.layouts.breadcrumb', [
        'items' => [
            __('breadcrumb.rentals') => '/rentals',
            __('breadcrumb.floors')=> '#',
        ],
    ])
@endsection

@section('sidebar')
    @include('tenant.layouts.sidebar', ['activeItem' => 'rentals.floors'])
@endsection

@section('style')
<link rel="stylesheet" href="{{ asset('css/layouts/custom-tabs.css') }}">
    <style>
        .area-col::after {
            content: " متر ";
        }
    </style>
@endsection
@php
    $activeTab = 'rentals-floors';
@endphp
@section('content-field')

    <div>
        <x-filter-form :title="__('breadcrumb.floors')" :link="route('tenant.rentals.floors.index')">
            <div class="row my-2">
                <div class="col-3">
                    <label for="selected-building" class="form-label">@lang('rentals/floors/index.building') :</label>
                    <select name="building_id" id="selected-building">
                        <option value="">@lang('general.all')</option>
                        @foreach ($buildings as $building)
                            <option value="{{ $building->id }}"
                                {{ request('building_id') == $building->id ? 'selected' : '' }}>{{ $building->title }}
                            </option>
                        @endforeach
                    </select>
                </div>

                <div class="col-3">
                    <label for="selected-building" class="form-label">@lang('rentals/floors/index.name') :</label>
                    <input type="text" class="form-control" name="floor_title" value="{{ request('floor_title') }}"
                        placeholder="{{__('rentals/floors/create.floor_name')}}">
                </div>

                <div class="col-3">
                    <label for="selected-building" class="form-label"> @lang('rentals/floors/index.floor_number') :</label>
                    <input type="number" min="0" class="form-control" name="floor_number"
                        value="{{ request('floor_number') }}" placeholder="{{__('rentals/floors/create.floor_area')}}">
                </div>
            </div>
        </x-filter-form>

        <section>
            <div class="d-flex mt-4 page-operations-section">
                @can('rentals-floors-add')
                    <a href="{{ route('tenant.rentals.floors.create') }}" class="btn orange-btn btn-sm"
                        title="{{__('general.add_new')}}">
                        <i class="fas fa-plus-circle"></i>  @lang('rentals/floors/index.add_floor')
                    </a>
                @endcan
            </div>
        </section>

        <section>
            <div>
                <div>
                    @php
                        $table_options = [
                            'sumValuesCell' => 'span',
                            'enableSumValuesOnColumns' => [4],
                            'lang' => ['noAvailableData' => __('noAvailableData.no_buildings_yet')],
                        ];
                    @endphp

                    <v-table :options="{{ json_encode($table_options) }}">
                        <table class="table table-bordered table-hover table-striped mt-3">
                            <thead>
                                <tr>
                                    <th class="xs-td">#</th>
                                    <th class="md-td">@lang('rentals/floors/index.building')</th>
                                    <th class="xs-td">@lang('rentals/floors/index.number')</th>
                                    <th class="md-td">@lang('rentals/floors/index.name')</th>
                                    <th class="xs-td">@lang('rentals/floors/index.area')</th>
                                    <th class="sm-td"> @lang('rentals/floors/index.creation_date')</th>
                                    <th class="sm-td">@lang('general.procedures')</th>
                                </tr>
                            </thead>

                            <tbody>
                                @php $area_sum = 0; @endphp
                                @forelse ($floors as $floor)
                                    <tr>
                                        <td class="xs-td">{{ $loop->iteration }}</td>
                                        <td class="md-td">{{ $floor->building->title ?? '' }}</td>
                                        <td class="xs-td">{{ $floor->number }}</td>
                                        <td class="md-td">{{ $floor->title }}</td>
                                        <td class="xs-td area-col">{{ $floor->area }}</td>
                                        <td class="sm-td">{{ $floor->created_at->format('Y-m-d') }}</td>
                                        <td class="sm-td">
                                            <x-operations-btn>
                                                @can('rentals-floors-edit')
                                                    <li>
                                                        <a href="{{ route('tenant.rentals.floors.edit', ['floor' => $floor->id]) }}"
                                                            class="btn" title="{{__('general.edit')}}">
                                                            <i class="fas fa-edit"></i> @lang('general.edit')
                                                        </a>
                                                    </li>
                                                @endcan

                                                @can('rentals-floors-delete')
                                                    <li>
                                                        <form
                                                            action="{{ route('tenant.rentals.floors.destroy', ['floor' => $floor->id]) }}"
                                                            method="POST">
                                                            @csrf
                                                            @method('delete')
                                                            <button type="button" class="btn confirm-delete-btn"
                                                                title="{{__('general.delete')}}">
                                                                <i class="fas fa-trash-alt"></i> @lang('general.delete')
                                                            </button>
                                                        </form>
                                                    </li>
                                                @endcan
                                            </x-operations-btn>
                                        </td>
                                    </tr>
                                    @php
                                        $area_sum += $floor->area;
                                    @endphp
                                @empty
                                    <tr>
                                        <td colspan="7"> @lang('rentals/floors/index.no_floors_yet')</td>
                                    </tr>
                                @endforelse
                            </tbody>
                            @if (!$floors->isEmpty())
                                <tfoot class="bordered-top bg-white">
                                    <tr id="tFooteTarget" class="bordered-top">
                                        <td>@lang('general.total')</td>
                                        <td></td>
                                        <td></td>
                                        <td></td>
                                        <td>
                                            <span class="sum-col">{{ dn($area_sum) }}</span> @lang('rentals/floors/index.meter')
                                        </td>
                                        <td></td>
                                        <td></td>
                                    </tr>
                                </tfoot>
                            @endif
                        </table>

                    </v-table>
                    <div>
                        {!! $floors->links() !!}
                    </div>
                </div>
        </section>
    </div>
@endsection

@push('script')
    <script>
        $(() => {
            $('.confirm-delete-btn').click(function(e) {
                $.confirm({
                    title: $lang('rentals/floors/index.confirm_delete_floor'),
                    content:  $lang('rentals/floors/index.floor_deletion_warning'),
                    type: 'red',
                    buttons: {
                        ok: {
                            text:  $lang('general.yes'),
                            btnClass: 'btn orange-btn',
                            keys: ['enter'],
                            action: () => {
                                $(this).closest('form').submit();
                            }
                        },
                        cancel: {
                            text: $lang('general.cancel'),
                            btnClass: 'btn-default',
                            keys: ['esc']
                        }
                    }
                });
            });
        });
    </script>
@endpush