@extends('tenant.layouts.master')

@section('style')
    <link rel="stylesheet" href="{{ asset('css/rentals/buildings/index.css') }}">
@endsection

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

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

@section('content')
    <section>
        <x-tenant.shared.backward-component :direct-to="__('breadcrumb.buildings')" link="/rentals/buildings" />

        <form onsubmit="handleSubmit(event)" action="{{ route('tenant.rentals.buildings.store') }}" method="POST"
            enctype="multipart/form-data" class="pb-3 rounded card">
            @csrf
            <div class="card-header py-2 d-flex justify-content-between">
                <h4> @lang('rentals/buildings/create.add_new_building')</h4>
            </div>

            <div class="card-body">
                <div class="row mt-3">
                    {{-- <div class="col-4 mb-3">
                        <label class="fw-bold rs">نوع المبنى</label>
                        @php $selected_type_id = old('building_type_id')?? $building_types->first()->id; @endphp

                        <select name="building_type_id" required>
                            <option disabled>اختيار نوع المبنى</option>
                            @foreach ($building_types as $building_type)
                                <option value="{{$building_type->id}}" {{ ($selected_type_id == $building_type->id)? 'selected' : '' }}>
                                    {{$building_type->name}}
                                </option>
                            @endforeach
                        </select>
                    </div> --}}

                    <div class="col-4 mb-3">
                        <label for="number" class="fw-bold"> @lang('rentals/buildings/create.number')</label>
                        <input type="text" class="form-control" id="number" name="number"
                            value="{{ $building_number }}" readonly>
                    </div>

                    <div class="col-4 mb-3">
                        <label for="title" class="fw-bold rs"> @lang('rentals/buildings/create.building_name')</label>
                        <input type="text" class="form-control" id="title" name="title" value="{{ old('title') }}"
                            placeholder="{{__('rentals/buildings/create.building_name')}}" required>
                    </div>

                    <div class="col-4 mb-3">
                        <label for="earth_place" class="fw-bold rs">@lang('rentals/buildings/create.land')</label>
                        <input type="text" class="form-control" id="earth_place" name="earth_place"
                            value="{{ old('earth_place') }}" placeholder="{{__('rentals/buildings/create.land_name')}}" required>
                    </div>
                </div>

                <div class="row mt-3">
                    <div class="col-4 mb-3">
                        <label for="area" class="fw-bold rs">@lang('rentals/buildings/create.building_area') </label>
                        <input type="number" step="0.001" min="0" class="form-control" id="area"
                            name="area" value="{{ old('area') }}" placeholder="{{__('rentals/buildings/create.building_area')}}" required>
                    </div>

                    <div class="col-4 mb-3">
                        <label for="shops_area" class="fw-bold rs"> @lang('rentals/buildings/create.shops_area') </label>
                        <input type="number" name="shops_area" id="shops_area" class="form-control"
                            value="{{ old('shops_area') }}" required>
                    </div>

                    <div class="col-4 mb-3">
                        <label for="booths_area" class="fw-bold rs">@lang('rentals/buildings/create.deterioration_or_corridors_area')</label>
                        <input type="number" name="booths_area" id="booths_area" class="form-control"
                            value="{{ old('booths_area') }}" required>
                    </div>
                </div>

                <div class="row mb-3">
                    <div class="col-3">
                        <label for="starting_work_permit_date" class="fw-bold">@lang('rentals/buildings/create.starting_work_permit_date')</label>
                        <x-input-date identifier="starting_work_permit_date" name="starting_work_permit_date"
                            :value="old('starting_work_permit_date')"></x-input-date>
                    </div>
                    <div class="col-3">
                        <label for="expire_work_permit_date" class="fw-bold">@lang('rentals/buildings/create.expire_work_permit_date')</label>
                        <x-input-date identifier="expire_work_permit_date" name="expire_work_permit_date"
                            :value="old('expire_work_permit_date')"></x-input-date>
                    </div>
                    <div class="col-3">
                        <label for="attachments" class="fw-bold">@lang('rentals/buildings/create.attachments')</label>
                        <input type="file" name="attachments[]" id="attachments" class="form-control"
                            accept="image/png, image/gif, image/jpeg, application/pdf, application/docx"
                            value="{{ old('attachments') }}" placeholder="{{__('rentals/buildings/create.attach_work_permit')}}" multiple>
                    </div>
                    <div class="col-3">
                        <label for="notice" class="fw-bold">@lang('rentals/buildings/create.others')</label>
                        <textarea class="form-control" name="notice" id="notice" rows="1">{{ old('notice') }}</textarea>
                    </div>
                </div>
            </div>
            <div class="text-center">
                <button type="submit" class="btn orange-btn">@lang('general.add')</button>
            </div>
        </form>
    </section>
@endsection