@extends('frontend3')
@section('content')
    <div id="siteContent" class="site-content">
        <div class="container">
            <div class="user-profile-section">
                <div class="row">
                    <div class="col-xs-12 col-md-4">
                        <div class="user-profile-card ht-card ht-depth-1 flex-ai-center">
                            <div class="card-header flex-item flex-item-tw">
                                <div class="user-photo">
                                    <div class="ht-rectangle ratio-11">
                                        <div class="ht-inner ht-bgcover"
                                             style="background-image: url('{{ $account->image }}')"></div>
                                    </div>
                                </div>
                            </div>
                            <div class="card-content flex-item flex-item-dw">
                                <h2 class="user-title" style="color: #FF5722">{{ $account->name }}</h2>
                                <div class="user-contacts">
										<span class="single-contact single-contact--email verified">

										</span>
                                    <span class="single-contact single-contact--phone verified">

										</span>
                                    <span class="single-contact single-contact--idcard verified">

										</span>
                                </div>
                                @if($account->type == \App\User::RENTER)
                                    <div class="user-status">Là người thuê trọ từ
                                        ngày {{ $account->created_at->format('d/m/Y') }}</div>
                                @else
                                    <div class="user-status">Là chủ trọ từ
                                        ngày {{ $account->created_at->format('d/m/Y') }}</div>
                                @endif
                            </div>
                        </div>
                    </div>
                    <div class="col-xs-12 col-md-8">
                        <div class="user-data-card ht-card ht-depth-1">
                            <div class="card-header">
                                <div class="flex flex-ai-center flex-jc-between">
                                    <div class="flex-item">
                                        <h3 class="card-header__title">Thông tin cá nhân</h3>
                                    </div>
                                    <div class="flex_item">
                                        <a href="{{ url('user/update') }}" class="card-header__action fz-12"><i
                                                    class="ion-edit mr-4"></i>Chỉnh
                                            sửa</a>
                                    </div>
                                </div>
                            </div>
                            <div class="card-content">
                                <div class="row">
                                    <div class="col-xs-12 col-sm-6">
                                        <div class="single-user-info flex">
                                            <div class="info__icon flex-item-tw"><i class="ion-android-call"></i></div>
                                            <div class="info__data flex-item-dw">
                                                <div class="info__data__main">{{ $account->phone }}</div>
                                                @if(!$account->status_phone)
                                                    <div class="info__data__status"><a href="#" id="verify-phone"
                                                                                       class="verify-link color-primary_text">Xác
                                                            minh SĐT</a></div>
                                                @else
                                                    <div class="info__data__status"><span class="color-primary_text"><i
                                                                    class="ion-android-checkbox-outline mr-4"></i>Đã xác minh</span>
                                                    </div>
                                                @endif
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xs-12 col-sm-6">
                                        <div class="single-user-info flex">
                                            <div class="info__icon flex-item-tw"><i class="ion-email"></i></div>
                                            <div class="info__data flex-item-dw">
                                                <div class="info__data__main">{{ $account->email }}</div>
                                                @if(!$account->status_email)
                                                    <div class="info__data__status"><a href="#" id="verify-email"
                                                                                       class="verify-link color-primary_text">Xác
                                                            minh email</a></div>
                                                @else
                                                    <div class="info__data__status"><span class="color-primary_text"><i
                                                                    class="ion-android-checkbox-outline mr-4"></i>Đã xác minh</span>
                                                    </div>
                                                @endif
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="single-user-info flex">
                                    <div class="info__icon flex-item-tw"><i class="ion-ios-location"></i></div>
                                    <div class="info__data flex-item-dw">
                                        <div class="info__data__main">{{ $account->address }} {{ $account->address_detail }}
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="user-data-card ht-card ht-depth-1">
                            <div class="card-content">
                                <div class="flex flex-on-sm-up flex-ai-center flex-jc-between">
                                    <div class="flex-item">
                                        <div class="flex-item">
                                            <div class="social-connect-title fw-500">Facebook</div>
                                        </div>
                                    </div>
                                    @if(empty($account->facebook_id))
                                        <div class="flex-item">
                                            <a href="{{ url('connect/facebook') }}"
                                               class="btn ht-btn-social ht-btn-facebook"><span
                                                        class="ht-icon-social"><i
                                                            class="ion-social-facebook"></i></span>Kết
                                                nối với Facebook</a>
                                        </div>
                                    @else
                                        <div class="flex-item">
                                        <span class="color-facebook fw-500 fz-13"><i
                                                    class="ion-android-checkbox-outline mr-8"></i>Đã kết nối với Facebook</span>
                                            <a href="#" data-type="facebook"
                                               class="ml-24 fz-13 color-grey-500 drop-connect">Hủy kết nối</a>
                                        </div>
                                    @endif
                                </div>
                            </div>
                        </div>
                        <div class="user-data-card ht-card ht-depth-1">
                            <div class="card-content">
                                <div class="flex flex-on-sm-up flex-ai-center flex-jc-between">
                                    <div class="flex-item">

                                        <div class="social-connect-title fw-500">Google</div>
                                    </div>
                                    @if(empty($account->google_id))
                                        <div class="flex-item">
                                            <a href="{{ url('connect/google') }}"
                                               class="btn ht-btn-social ht-btn-googleplus"><span
                                                        class="ht-icon-social"><i
                                                            class="ion-social-googleplus"></i></span>Kết
                                                nối với Google+</a>
                                        </div>
                                    @else
                                        <div class="flex-item">
                                        <span class="color-googleplus fw-500 fz-13"><i
                                                    class="ion-android-checkbox-outline mr-8"></i>Đã kết nối với Google+</span>
                                            <a href="#" data-type="google"
                                               class="ml-24 fz-13 color-grey-500 drop-connect">Hủy kết nối</a>
                                        </div>
                                    @endif
                                </div>
                            </div>
                        </div>
                        <div class="user-data-card ht-card ht-depth-1">
                            @if($account->type == \App\User::RENTER)
                                <div class="card-header">
                                    <div class="flex flex-ai-center flex-jc-between">
                                        <div class="flex-item">
                                            <h3 class="card-header__title">Tin đăng của bạn</h3>
                                        </div>
                                        <div class="flex_item">
                                            <a href="{{ url('tim-ban') }}" class="btn ht-btn-primary px-28">Đăng tin
                                                ngay</a>
                                        </div>
                                    </div>
                                </div>
                            @else
                                <div class="card-header">
                                    <div class="flex flex-ai-center flex-jc-between">
                                        <div class="flex-item">
                                            <h3 class="card-header__title">nhà của bạn</h3>
                                        </div>
                                        <div class="flex_item">
                                            <a href="{{ url('dang-tin-2') }}" class="btn ht-btn-primary px-28">Đăng nhà
                                                trọ ngay</a>
                                        </div>
                                    </div>
                                </div>
                            @endif



                            {{--@if($account->type == \App\User::RENTER)--}}
                            {{--@php $items = \App\Models\RoomNeedMore::where('user_id', $account->id)->get(); @endphp--}}
                            {{--@else--}}
                            {{--@php $items = \App\Models\Hostel::where('owner_id', $account->id)->get(); @endphp--}}
                            {{--@endif--}}

                            @php $items = \App\Models\PostNews::where('user_id',$account->id)
                            ->select('post_news.*','post_type.name as type_post')
                            ->leftJoin('post_type','post_news.type_id','=','post_type.id')
                            ->orderBy('id','desc')->get()@endphp

                            <div class="card-content">
                                <div class="list-property-cards pd-default mx-auto">
                                    @if($items->count() > 0)
                                        <div class="row">
                                            @foreach($items as $item)
                                                <div class="col-xs-6 col-sm-4 col-md-6 col-lg-4">
                                                    @include('frontend3.find_room_2.item', compact('item'))
                                                </div>
                                            @endforeach
                                        </div>
                                    @else
                                        <div class="text-center py-48">
                                            <div class="fs-it color-grey-600">Chưa có tin đăng nào</div>
                                        </div>
                                    @endif

                                </div>
                                {{--@if($account->type == \App\User::RENTER)--}}
                                {{--@if($items->count() > 0)--}}
                                {{--<div class="list-property-cards pd-default has-max-width-on-md mx-auto">--}}


                                {{--<div class="row">--}}
                                {{--@foreach($items as $item)--}}
                                {{--<div class="col-xs-12 col-lg-6">--}}
                                {{--@include('frontend3.item_need_more', compact('item'))--}}
                                {{--</div>--}}
                                {{--@endforeach--}}
                                {{--</div>--}}
                                {{--@else--}}
                                {{--<div class="text-center py-48">--}}
                                {{--<div class="fs-it color-grey-600">Chưa có tin đăng nào</div>--}}
                                {{--</div>--}}
                                {{--@endif--}}

                                {{--@else--}}

                                {{--@if($items->count() > 0)--}}


                                {{--<div class="row">--}}
                                {{--@foreach($items as $item)--}}
                                {{--<div class="col-xs-12 col-lg-6">--}}
                                {{--@include('frontend3.item', compact('item'))--}}
                                {{--</div>--}}
                                {{--@endforeach--}}
                                {{--</div>--}}
                                {{--@else--}}
                                {{--<div class="text-center py-48">--}}
                                {{--<div class="fs-it color-grey-600">Chưa có nhà trọ nào</div>--}}
                                {{--</div>--}}
                                {{--@endif--}}
                                {{--@endif--}}
                                {{--</div>--}}
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    </div>
@endsection

@push('scripts')
    <script>
        // initialize Account Kit with CSRF protection
        AccountKit_OnInteractive = function () {
            AccountKit.init(
                {
                    appId: "{{ env('FACEBOOK_CLIENT_ID') }}",
                    state: "{{ csrf_token() }}",
                    version: "v1.1",
                    fbAppEventsEnabled: true,

                }
            );
        };

        // login callback
        function loginCallback(response) {
            if (response.status === "PARTIALLY_AUTHENTICATED") {
                var code = response.code;
                var csrf = response.state;
                $.ajax({
                    url: '{{ url('verify-phone') }}',
                    type: 'post',
                    data: {
                        code: code
                    },
                    success: function (response) {
                        $('#verify-phone').parent().html('<span class="color-primary_text"><i class="ion-android-checkbox-outline mr-4"></i>Đã xác minh</span>')
                    }
                });
                // Send code to server to exchange for access token
            }
            else if (response.status === "NOT_AUTHENTICATED") {
                alert('Bạn chưa được xác thực');
            }
            else if (response.status === "BAD_PARAMS") {

            }
        }

        // phone form submission handler
        @if(!empty($account->phone))
        function smsLogin() {
            var countryCode = '+84';
            var phoneNumber = '{{ $account->phone }}';
            AccountKit.login(
                'PHONE',
                {countryCode: countryCode, phoneNumber: phoneNumber}, // will use default values if not specified
                loginCallback
            );
        }

        @endif

        $('#verify-phone').click(function (e) {
            e.preventDefault();
            smsLogin();
        });


        // email form submission handler
        function emailLogin() {
            var emailAddress = document.getElementById("email").value;
            AccountKit.login(
                'EMAIL',
                {emailAddress: emailAddress},
                loginCallback
            );
        }

        $(document).ready(function () {
            $('.drop-connect').click(function (e) {
                e.preventDefault();
                var type = $(this).attr('data-type');
                $.ajax({
                    url: '{{ url('drop-connect') }}',
                    type: 'post',
                    data: {
                        type: type
                    },
                    success: function (response) {
                        location.reload();
                    }
                });

            });

            $('.delete-postnews').click(function () {
                var id = $(this).attr('data-id');
                console.log(id);
                swal({
                        title: "Bạn có chắc chắn?",
                        text: "Tin đăng của bạn sẽ bị xóa.",
                        type: "warning",
                        showCancelButton: true,
                        cancelButtonText: 'Hủy bỏ',
                        confirmButtonClass: "btn-danger",
                        confirmButtonText: "Đồng ý!",
                        closeOnConfirm: false
                    },
                    function () {
                        $.ajax({
                            url: '{{ url('/dang-tin-2/deletePostNews/') }}',
                            type: 'post',
                            data: {id: id},
                            success: function (response) {
                                if (response.status == 1) {
                                    swal("Xóa thành công!", "Tin đăng của bạn đã được xóa.", "success");
                                    location.reload();
                                }
                            }
                        });

                    });

            })
        });
    </script>
@endpush