@extends('layouts.sidebar')

@section('content')
<a href="{{ url('/clients-billing-soa/' . $lease->client_id) }}" class="bg-blue-600 text-white px-5 py-3 rounded-lg">Back</a>
@if (session('success'))
            <div class="p-4 mb-4 text-white bg-green-500">
                {{ session('success') }}
            </div>
        @endif
    <div id="editItemModal{{ $lease->lease_id }}"
        class="   flex items-center justify-center ">
        <div class="w-1/2 overflow-y-auto bg-white rounded-lg">
        
            <div class="flex items-center justify-between px-4 py-2 bg-blue-500">
                <h5 class="font-bold text-white">Edit Lease Agreement</h5>
                <button onclick="closeModal('editItemModal{{ $lease->lease_id }}')" class="text-white">&times;</button>
            </div>

            <!-- Edit Lease Form -->
            <form id="editItemForm{{ $lease->lease_id }}" action="{{ route('lease.update', $lease->lease_id) }}" method="POST"
                class="p-6">
                @csrf

                <div class="grid grid-cols-1 gap-6 md:grid-cols-3">

                    <input type="hidden" id="property_id" name="property_id" required value="{{ $lease->property_id }}">
                    <input type="hidden" id="unit_id" name="unit_id" required value="{{ $lease->unit_id }}">

                    <div class="col-span-1">
                        <label for="client_id" class="block mb-2 text-sm font-bold text-gray-700">Tenant
                            Name:</label>
                        <select id="client_id" name="client_id"
                            class="w-full px-3 py-2 text-sm text-gray-700 border border-black rounded shadow-sm focus:outline-none focus:shadow-outline"
                            required>
                            <option value="">Select Client</option>
                            @foreach ($editclients as $client)
                                <option value="{{ $client->client_id }}"
                                    {{ $lease->client_id == $client->client_id ? 'selected' : '' }}>
                                    {{ $client->owners_name }}</option>
                            @endforeach
                        </select>
                    </div>

                    <div class="col-span-1">
                        <label for="lease_start_date" class="block mb-2 text-sm font-bold text-gray-700">Lease Start
                            Date:</label>
                        <input type="date" id="lease_start_date" name="lease_start_date"
                            class="w-full px-3 py-2 text-sm text-gray-700 border border-black rounded shadow-sm focus:outline-none focus:shadow-outline"
                            value="{{ $lease->lease_start_date }}" required>
                    </div>

                    <div class="col-span-1">
                        <label for="rate_type{{ $lease->lease_id }}"
                            class="block mb-2 text-sm font-bold text-gray-700">Contract Type:</label>
                        <select id="rate_type{{ $lease->lease_id }}" name="rate_type"
                            class="w-full px-3 py-2 text-sm text-gray-700 border border-black rounded shadow-sm focus:outline-none focus:shadow-outline">
                            <option value="" disabled>Select Contract Type</option>
                            <option value="Daily" {{ $lease->contract_type == 'Daily' ? 'selected' : '' }}>Daily
                            </option>
                            <option value="Weekly" {{ $lease->contract_type == 'Weekly' ? 'selected' : '' }}>Weekly
                            </option>
                            <option value="Monthly" {{ $lease->contract_type == 'Monthly' ? 'selected' : '' }}>
                                Monthly
                            </option>
                            <option value="Yearly" {{ $lease->contract_type == 'Yearly' ? 'selected' : '' }}>
                                Yearly
                            </option>
                        </select>
                    </div>

                    <div class="col-span-1">
                        <label for="lease_duration" class="block mb-2 text-sm font-bold text-gray-700">Lease
                            Duration:</label>
                        <input type="number" id="lease_duration" name="lease_duration"
                            class="w-full px-3 py-2 text-sm text-gray-700 border border-black rounded shadow-sm focus:outline-none focus:shadow-outline"
                            placeholder="Enter Duration" value="{{ $lease->lease_duration }}" required>
                    </div>

                    <div class="col-span-1">
                        <label for="rent_amount" class="block mb-2 text-sm font-bold text-gray-700">Rent
                            Amount:</label>
                        <input type="text" id="rent_amount" name="rent_amount"
                            class="w-full px-3 py-2 text-sm text-gray-700 border border-black rounded shadow-sm focus:outline-none focus:shadow-outline"
                            placeholder="Enter Monthly Rent Amount" value="{{ $lease->rent_amount }}">
                    </div>

                    <div class="col-span-1">
                        <label for="yearly_escalation{{ $lease->lease_id }}"
                            class="block mb-2 text-sm font-bold text-gray-700">Yearly Escalation:</label>
                        <input type="number" id="yearly_escalation{{ $lease->lease_id }}" name="yearly_escalation"
                            class="w-full px-3 py-2 text-sm text-gray-700 border border-black rounded shadow-sm focus:outline-none focus:shadow-outline"
                            placeholder="Yearly Escalation" value="{{ $lease->yearly_escalation }}">
                    </div>
                    <div class="col-span-1">
                        <label for="escalation" class="block mb-2 text-sm font-bold text-gray-700">Escalation
                            Agreement:</label>
                        <input type="text" id="escalation" name="escalation"
                            class="w-full px-3 py-2 text-sm text-gray-700 border border-black rounded shadow-sm focus:outline-none focus:shadow-outline"
                            placeholder="Enter Escalation" value="{{ $lease->escalation ?? 12 }}">
                    </div>


                    <div class="col-span-1">
                        <label for="terms{{ $lease->lease_id }}"
                            class="block mb-2 text-sm font-bold text-gray-700">Terms:</label>
                        <input type="number" id="terms{{ $lease->lease_id }}" name="terms"
                            class="w-full px-3 py-2 text-sm text-gray-700 border border-black rounded shadow-sm focus:outline-none focus:shadow-outline"
                            placeholder="Terms" value="{{ $lease->terms }}">
                    </div>

                    <div class="col-span-1">
                        <label for="advance_payment" class="block mb-2 text-sm font-bold text-gray-700">Advance
                            Payment:</label>
                        <input type="text" id="advance_payment" name="advance_payment"
                            class="w-full px-3 py-2 text-sm text-gray-700 border border-black rounded shadow-sm focus:outline-none focus:shadow-outline"
                            placeholder="" value="{{ $lease->relief_rental }}">
                    </div>

                    <div class="col-span-1">
                        <label for="business_start" class="block mb-2 text-sm font-bold text-gray-700">Start of
                            Business:</label>
                        <input type="date" id="business_start" name="business_start"
                            class="w-full px-3 py-2 text-sm text-gray-700 border border-black rounded shadow-sm focus:outline-none focus:shadow-outline"
                            value="{{ $lease->business_start ? \Carbon\Carbon::parse($lease->business_start)->format('Y-m-d') : '' }}">
                    </div>


                    <div class="col-span-1">
                        <label for="security_deposit" class="block mb-2 text-sm font-bold text-gray-700">Security
                            Deposit:</label>
                        <input type="text" id="security_deposit" name="security_deposit"
                            class="w-full px-3 py-2 text-sm text-gray-700 border border-black rounded shadow-sm focus:outline-none focus:shadow-outline"
                            placeholder="Deposit" value="{{ $lease->security_deposit }}">
                    </div>
                </div>

                <div class="h-auto pt-10 overflow-y-auto">
                    <div class="col-span-3">
                        <label for="utilities{{ $lease->lease_id }}"
                            class="block mb-2 text-sm font-bold text-gray-700">Utilities:</label>
                        <textarea id="utilities{{ $lease->lease_id }}" name="utilities" rows="3"
                            class="w-full px-3 py-2 text-sm text-gray-700 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500">{{ $lease->utilities }}</textarea>
                    </div>

                    <div class="col-span-3">
                        <label for="rules{{ $lease->lease_id }}" class="block mb-2 text-sm font-bold text-gray-700">Rules
                            and Regulations:</label>
                        <textarea id="rules{{ $lease->lease_id }}" name="rules_and_regulations" rows="3"
                            class="w-full px-3 py-2 text-sm text-gray-700 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500">{{ $lease->rules_and_regulations }}</textarea>
                    </div>
                </div>

                <!-- Submit Button -->
                <div class="flex justify-end p-4">
                    <button type="submit"
                        class="px-4 py-2 font-bold text-white bg-blue-500 rounded hover:bg-blue-700">Update Lease
                        Agreement</button>
                </div>
            </form>
        </div>
    </div>
@endsection