@extends('layouts.app')

@section('content')

<div class="max-w-3xl pb-24 mx-auto space-y-10 divide-y divide-gray-900/10">
    <div class="grid grid-cols-3 gap-x-8 gap-y-8 md:grid-cols-1">

        <div class="grid grid-cols-3 pt-10 gap-x-8 gap-y-8 md:grid-cols-1">

            <div class="flex items-center">
                <div class="flex-shrink-0">
                    <span class="text-4xl material-symbols-rounded text-stone-600">
                        pin_drop
                    </span>
                </div>
                <div class="flex-1 w-0 pb-1 pl-2">
                    <dl>
                        <dd>
                            <div class="text-2xl font-bold text-stone-600">
                                @if(isset($address))
                                ADRESİ DÜZENLE<span class="font-normal text-stone-500">{{ ' - ' . $company->name
                                    }}</span>
                                @else
                                YENİ ADRES<span class="font-normal text-stone-500">{{ ' - ' . $company->name }}</span>
                                @endif
                            </div>
                        </dd>
                    </dl>
                </div>
            </div>

            <form method="POST"
                action="@if(isset($address)){{ route('addresses.update', $address->id) }}@else{{ route('addresses.store') }}@endif"
                class="bg-white shadow-sm ring-1 ring-gray-900/5 sm:rounded-xl md:col-span-2">
                @csrf
                @method('PUT')
                {{--CONTENT--}}
                <div class="p-8">
                    <div x-data="{ addressType: '{{ old('type', $address->type ?? 'billing') }}', showHidden: 1 }"
                        x-init="$watch('addressType', value => console.log(value))">

                        <fieldset class="flex justify-end">
                            <div class="space-y-5">
                                <div class="relative flex items-start">
                                    <div class="mr-3 text-xs leading-6">
                                        <span id="show_hidden" class="text-gray-400">tüm alanları göster</span>
                                    </div>
                                    <div class="flex items-center h-6">
                                        <input x-model="showHidden" id="show_hidden" type="checkbox" checked
                                            class="w-4 h-4 rounded border-stone-300 text-stone-600 focus:ring-stone-600">
                                    </div>
                                </div>
                            </div>
                        </fieldset>

                        <div>
                            @if(isset($address))
                            <input hidden name="id" value="{{ $address->id }}">
                            @endif
                            <input type="text" hidden="" name="company_id"
                                value="{{ old('company_id', $company->id ?? $address->company_id ?? '') }}">
                            <div class="grid gap-2 -space-y-px rounded-md isolate">
                                <div>
                                    <fieldset class="sm:col-span-6">
                                        <legend class="block text-xs leading-6 text-gray-500">Adres tipi</legend>
                                        <div
                                            class="mt-2 space-y-6 tracking-tighter sm:flex sm:items-center sm:space-x-6 sm:space-y-0">
                                            <div class="flex items-center">
                                                <input x-model="addressType" id="1" name="type" value="billing"
                                                    type="radio" @if(old('type', $address->type ?? 'billing') ==
                                                'billing') checked @endif
                                                class="w-4 h-4 border-gray-300 text-stone-600 focus:ring-sky-600">
                                                <label for="1"
                                                    class="block ml-2 text-sm font-medium leading-6 text-gray-900">FATURA
                                                    ADRESİ</label>
                                            </div>
                                            <div class="flex items-center">
                                                <input x-model="addressType" id="2" name="type" value="shipping"
                                                    type="radio" @if(old('type', $address->type ?? '') == 'shipping')
                                                checked @endif
                                                class="w-4 h-4 border-gray-300 text-stone-600 focus:ring-sky-600">
                                                <label for="2"
                                                    class="block ml-2 text-sm font-medium leading-6 text-gray-900">TESLİMAT
                                                    ADRESİ</label>
                                            </div>
                                            <div class="flex items-center">
                                                <input x-model="addressType" id="3" name="type" value="branch"
                                                    type="radio" @if(old('type', $address->type ?? '') == 'branch')
                                                checked @endif
                                                class="w-4 h-4 border-gray-300 text-stone-600 focus:ring-sky-600">
                                                <label for="3"
                                                    class="block ml-2 text-sm font-medium leading-6 text-gray-900">ŞUBE
                                                    ADRESİ</label>
                                            </div>
                                        </div>
                                    </fieldset>
                                </div>
                                <div>
                                    <label for="title" class="block text-xs leading-6 text-gray-500">Başlık*</label>
                                    <div class="mt-0.5">
                                        <input type="text" name="title" id="title" required
                                            value="{{ old('title', $address->title ?? '') }}"
                                            class="block w-3/4 py-1 text-gray-900 uppercase border-0 rounded-md shadow-sm bg-stone-50 ring-1 ring-inset ring-gray-400 placeholder:text-gray-300 focus:ring-2 focus:ring-inset focus:ring-stone-600 sm:text-sm sm:leading-6"
                                            placeholder="Akıldoluişler A.Ş.">
                                    </div>
                                </div>
                                <div>
                                    <label for="line_1" class="block text-xs leading-6 text-gray-500">Adres Satırı
                                        1*</label>
                                    <div class="mt-0.5">
                                        <input type="text" name="line_1" id="line_1" required
                                            value="{{ old('line_1', $address->line_1 ?? '') }}"
                                            class="block w-3/4 py-1 text-gray-900 uppercase border-0 rounded-md shadow-sm bg-stone-50 ring-1 ring-inset ring-gray-400 placeholder:text-gray-300 focus:ring-2 focus:ring-inset focus:ring-stone-600 sm:text-sm sm:leading-6"
                                            placeholder="KIRCAALI MH. KIREMITCI CD.">
                                    </div>
                                </div>
                                <div x-show="showHidden == 1" x-cloak>
                                    <label for="line_2" class="block text-xs leading-6 text-gray-500">Adres Satırı
                                        2</label>
                                    <div class="mt-0.5">
                                        <input type="text" name="line_2" id="line_2"
                                            value="{{ old('line_2', $address->line_2 ?? '') }}"
                                            class="block w-3/4 py-1 text-gray-900 uppercase border-0 rounded-md shadow-sm bg-stone-50 ring-1 ring-inset ring-gray-300 placeholder:text-gray-300 focus:ring-2 focus:ring-inset focus:ring-stone-600 sm:text-sm sm:leading-6"
                                            placeholder="KARAKASGIL PLZ. NO.3 D.504">
                                    </div>
                                </div>
                                <div class="grid grid-cols-1 sm:grid-cols-2 gap-y-2 gap-x-3">
                                    <div x-show="showHidden == 1" x-cloak="">
                                        <label for="district" class="block text-xs leading-6 text-gray-500">İlçe</label>
                                        <div class="mt-0.5">
                                            <input type="text" name="district" id="district"
                                                value="{{ old('district', $address->district ?? '') }}"
                                                class="block w-full py-1 text-gray-900 uppercase border-0 rounded-md shadow-sm bg-stone-50 ring-1 ring-inset ring-gray-300 placeholder:text-gray-300 focus:ring-2 focus:ring-inset focus:ring-stone-600 sm:text-sm sm:leading-6"
                                                placeholder="OSMANGAZİ">
                                        </div>
                                    </div>
                                    <div>
                                        <label for="city" class="block text-xs leading-6 text-gray-500">Şehir*</label>
                                        <div class="mt-0.5">
                                            <input type="text" name="city" id="city" required
                                                value="{{ old('city', $address->city ?? '') }}"
                                                class="block w-full py-1 text-gray-900 uppercase border-0 rounded-md shadow-sm bg-stone-50 ring-1 ring-inset ring-gray-400 placeholder:text-gray-300 focus:ring-2 focus:ring-inset focus:ring-stone-600 sm:text-sm sm:leading-6"
                                                placeholder="BURSA">
                                        </div>
                                    </div>
                                    <div x-show="showHidden == 1" x-cloak="">
                                        <label for="country" class="block text-xs leading-6 text-gray-500">Ülke</label>
                                        <div class="mt-0.5">
                                            <input type="text" name="country" id="country"
                                                value="{{ old('country', $address->country ?? '') }}"
                                                class="block w-full py-1 text-gray-900 uppercase border-0 rounded-md shadow-sm bg-stone-50 ring-1 ring-inset ring-gray-300 placeholder:text-gray-300 focus:ring-2 focus:ring-inset focus:ring-stone-600 sm:text-sm sm:leading-6"
                                                placeholder="TÜRKİYE">
                                        </div>
                                    </div>
                                    <div x-show="showHidden == 1" x-cloak="">
                                        <label for="zip" class="block text-xs leading-6 text-gray-500">Posta
                                            Kodu</label>
                                        <div class="mt-0.5">
                                            <input type="text" name="zip" id="zip"
                                                value="{{ old('zip', $address->zip ?? '') }}"
                                                class="block w-full py-1 text-gray-900 uppercase border-0 rounded-md shadow-sm bg-stone-50 ring-1 ring-inset ring-gray-300 placeholder:text-gray-300 focus:ring-2 focus:ring-inset focus:ring-stone-600 sm:text-sm sm:leading-6"
                                                placeholder="16220">
                                        </div>
                                    </div>
                                    <div x-show="showHidden == 1" x-cloak="">
                                        <label for="phone" class="block text-xs leading-6 text-gray-500">Telefon</label>
                                        <div class="mt-0.5">
                                            <input type="text" name="phone" id="phone"
                                                value="{{ old('phone', $address->phone ?? '') }}"
                                                class="block w-full py-1 text-gray-900 uppercase border-0 rounded-md shadow-sm bg-stone-50 ring-1 ring-inset ring-gray-300 placeholder:text-gray-300 focus:ring-2 focus:ring-inset focus:ring-stone-600 sm:text-sm sm:leading-6"
                                                placeholder="0850 255 1090">
                                        </div>
                                    </div>
                                    <div x-show="showHidden == 1" x-cloak="">
                                        <label for="email" class="block text-xs leading-6 text-gray-500">Eposta</label>
                                        <div class="mt-0.5">
                                            <input type="email" name="email" id="email"
                                                value="{{ old('email', $address->email ?? '') }}"
                                                class="block w-full py-1 text-gray-900 border-0 rounded-md shadow-sm bg-stone-50 ring-1 ring-inset ring-gray-300 placeholder:text-gray-300 focus:ring-2 focus:ring-inset focus:ring-stone-600 sm:text-sm sm:leading-6"
                                                placeholder="posta@akildolusler.com">
                                        </div>
                                    </div>
                                    <div x-show="addressType == 'billing'" x-cloak>
                                        <label for="tax_office" class="block text-xs leading-6 text-gray-500">Vergi
                                            Dairesi*</label>
                                        <div class="mt-0.5">
                                            <input type="text" name="tax_office" id="tax_office"
                                                value="{{ old('tax_office', $address->tax_office ?? '') }}"
                                                class="block w-full py-1 text-gray-900 uppercase border-0 rounded-md shadow-sm bg-stone-50 ring-1 ring-inset ring-gray-400 placeholder:text-gray-300 focus:ring-2 focus:ring-inset focus:ring-stone-600 sm:text-sm sm:leading-6"
                                                placeholder="YILDIRIM">
                                        </div>
                                    </div>
                                    <div x-show="addressType == 'billing'" x-cloak>
                                        <label for="vat_number" class="block text-xs leading-6 text-gray-500">Vergi
                                            Numarası*</label>
                                        <div class="mt-0.5">
                                            <input type="text" name="vat_number" id="vat_number"
                                                value="{{ old('vat_number', $address->vat_number ?? '') }}"
                                                class="block w-full py-1 text-gray-900 uppercase border-0 rounded-md shadow-sm bg-stone-50 ring-1 ring-inset ring-gray-400 placeholder:text-gray-300 focus:ring-2 focus:ring-inset focus:ring-stone-600 sm:text-sm sm:leading-6"
                                                placeholder="5112458546">
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <div
                    class="flex items-center justify-end px-4 py-4 border-t gap-x-4 bg-gradient-to-l from-stone-900/10 rounded-b-xl sm:px-8">
                    @include('modals.cancel', [
                    'title' => 'YAPTIĞINIZ DEĞİŞİKLİKLER KAYBOLACAK!',
                    'subtitle' => 'İPTAL ETMEK İSTEDİĞİNİZDEN EMİN MİSİNİZ?',
                    'route' => route('dashboard'),
                    'button' => 'VAZGEÇ',
                    'cancel' => 'GERİ DÖN',
                    'confirm' => 'İPTAL ET'
                    ])
                    @if(isset($address))
                    @include('modals.confirm', [
                    'title' => 'ADRES GÜNCELLENECEK',
                    'subtitle' => 'DEVAM ETMEK İSTEDİĞİNİZDEN EMİN MİSİNİZ?',
                    'route' => '#',
                    'button' => 'GÜNCELLE',
                    'cancel' => 'GERİ DÖN',
                    'confirm' => 'GÜNCELLE'
                    ])
                    @else
                    @include('modals.confirm', [
                    'title' => 'ADRES OLUŞTURULACAK',
                    'subtitle' => 'DEVAM ETMEK İSTEDİĞİNİZDEN EMİN MİSİNİZ?',
                    'route' => '#',
                    'button' => 'OLUŞTUR',
                    'cancel' => 'GERİ DÖN',
                    'confirm' => 'OLUŞTUR'
                    ])
                    @endif
                    @endsection

                    @section('scripts')

                    @endsection