@extends('news.main')
@section('content')
@php
    $settingMain = json_decode($itemsSetting["setting-main"], true);
    $settingEmail = json_decode($itemsSetting["setting-email"], true);
@endphp
<div class="section-category">
    <div class="content_container container_category">
        <div class="featured_title">
            <div class="container">
                <div class="row mb-5">
                    <div class="col-md-4 text-center">
                        <h3>Địa chỉ</h3>
                        <p>{{ $settingMain["diachi"] }}</p>
                    </div>
                    <div class="col-md-4 text-center">
                        <h3>Hotline</h3>
                        <p>{{ $settingMain["hotline"] }}</p>
                    </div>
                    <div class="col-md-4 text-center">
                        <h3>Email</h3>
                        <p>{{ $settingEmail["email"] }}</p>
                    </div>
                </div>

                <div class="row">
                    <div class="col-md-6 d-inline-flex">
                        <div class="map-frame w-100">
                            {!! $settingMain["iframe"] !!}
                        </div>
                    </div>
                    <div class="col-md-6">
                        <h3 class="text-uppercase mb-3">Gửi tin nhắn cho chúng tôi</h3>
                        @if ($errors->any())
                            <div class="alert alert-danger">
                                <ul>
                                    @foreach ($errors->all() as $error)
                                        <li>{{ $error }}</li>
                                    @endforeach
                                </ul>
                            </div>
                        @endif
                        <form id="js_send_contact" action="{{ route('contact/send') }}" method="POST">
                            @csrf
                            <div class="form-group">
                                <label for="name">Tên:</label>
                                <input type="text" required class="form-control" id="name" value="{{ old('name') }}" name="name">
                            </div>
                            <div class="form-group">
                                <label for="email">Email:</label>
                                <input type="email" required class="form-control" value="{{ old('email') }}" name="email" id="email">
                            </div>
                            <div class="form-group">
                                <label for="phone">Phone:</label>
                                <input type="phone" required class="form-control" value="{{ old('phone') }}" name="phone" id="phone">
                            </div>
                            <div class="form-group">
                                <label for="content">Lời nhắn:</label>
                                <textarea value="{{ old('content') }}" name="content" id="content" class="form-control" rows="10" required></textarea>
                            </div>
                            <button type="submit" class="btn btn-primary">Gửi ngay</button>
                            </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

@push('custom-css')
<style>
.map-frame iframe {width: 100%; height: 100%;}
</style>
@endpush


@push('custom-script')
<script>
    $(document).ready(function () {
        let frm = $('#js_send_contact');
        let name = $('#js_send_contact input[name="name"]');
        let phone = $('#js_send_contact input[name="phone"]');
        let email = $('#js_send_contact input[name="email"]');

        let data_name = localStorage.getItem('contact_name');
        let data_phone = localStorage.getItem('contact_phone');
        let data_email = localStorage.getItem('contact_email');
        
        if (data_name) {
            name.val(data_name);
        }
        if (data_phone) {
            phone.val(data_phone);
        }
        if (data_email) {
            email.val(data_email);
        }

        frm.submit(function( event ) {
            localStorage.setItem('contact_name', name.val()); 
            localStorage.setItem('contact_phone', phone.val()); 
            localStorage.setItem('contact_email', email.val()); 
        });
    });
</script>
@endpush