@inject('FrontendPresenter', 'App\Presenters\FrontendPresenter')
@extends('layouts.frontend')
@section('content')
<main class="main pt-0">
    <div class="container py-8">
        <div class="row justify-content-center">
            <div class="col-12 col-lg-10">
                <div class="row align-items-center">
                    <div class="col-12 col-md-auto">
                        <div class="avatar" style="background: url({{asset($member->avatar)}}), url({{asset('/assets/img/icon/user.svg')}});background-size: cover;"></div>

                    </div>
                    <div class="col text-center text-md-left mt-6 mt-md-0">
                        <div class="h4 font-weight-bold">{{$member->name}}</div>
                    </div>
                    <div class="col text-right order-first order-md-last">
                        <a class="btn-edit text-muted" href="{{ route('member_member-info-edit') }}">
                            <i class="fas fa-lg fa-pencil-alt"></i>
                        </a>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="nav-secondary border-0">
        <div class="container">
            <div class="nav-light">
                <ul class="nav justify-content-center">
                    <li class="nav-item">
                        <a class="nav-link active" href="{{ route('member_member-info') }}">帳戶</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="{{ route('member_save-school-list') }}">收藏頁面</a>
                    </li>
                </ul>
            </div>
        </div>
    </div>

    <div class="container pt-12">
        <div class="row justify-content-center">
            <div class="col-12 col-lg-10">
                <div class="border p-6 p-md-10">
                    <form>
                        <div class="d-flex justify-content-between align-items-center mb-6">
                            <div class="h4 font-weight-bold">帳戶設定</div>
                            <a class="btn-edit text-muted" href="{{ route('member_member-info-edit') }}">
                                <i class="fas fa-lg fa-pencil-alt"></i>
                            </a>
                        </div>
                        <div class="form-group row">
                            <label class="col-5 col-sm-3 col-md-2 col-form-label text-muted">手機號碼</label>
                            <div class="col-7 col-sm-9 col-md-10">
                                <p class="form-control-plaintext">
                                    {{$member->phone}}
                                </p>
                            </div>
                        </div>
                        <div class="form-group row">
                            <label class="col-5 col-sm-3 col-md-2 col-form-label text-muted">電子郵件</label>
                            <div class="col-7 col-sm-9 col-md-10">
                                <p class="form-control-plaintext">
                                    {{$member->email}}
                                </p>
                            </div>
                        </div>
                        <div class="form-group row">
                            <label class="col-5 col-sm-3 col-md-2 col-form-label text-muted">密碼</label>
                            <div class="col-7 col-sm-9 col-md-10">
                                <a class="btn btn-outline-primary" href="" data-toggle="modal" data-target="#modal-pw-change">更改密碼</a>
                            </div>
                        </div>
                        <div class="form-group row">
                            <label class="col-5 col-sm-3 col-md-2 col-form-label text-muted">想去的國家</label>
                            <div class="col-7 col-sm-9 col-md-10">
                                <p class="form-control-plaintext">
                                    {{$FrontendPresenter->showCountry($member->country)}}
                                </p>
                            </div>
                        </div>
                        <div class="form-group row">
                            <label class="col-5 col-sm-3 col-md-2 col-form-label text-muted">興趣課程</label>
                            <div class="col-7 col-sm-9 col-md-10">
                                <p class="form-control-plaintext">
                                    {{$FrontendPresenter->showInterest($member->interest)}}
                                </p>
                            </div>
                        </div>
                        <div class="form-group row">
                            <label class="col-5 col-sm-3 col-md-2 col-form-label text-muted">預計出發日</label>
                            <div class="col-7 col-sm-9 col-md-10">
                                <p class="form-control-plaintext">
                                    {{$member->departure}}
                                </p>
                            </div>
                        </div>

                    </form>
                </div>
            </div>
        </div>
    </div>
</main>
@stop

@include('frontend.module.modal-pw-change')

@section('js')
<script>
$('#orm_change').submit(function (event) {
    event.preventDefault();
    $.ajax({
        url: '{{ route('member_pw-change') }}',
        data: $('#orm_change').serialize(),
        type: 'POST',
        success: function(response) {
            alert(response);
            location.reload();
        }
    });
});
</script>
@stop
{{-- 
    <!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-W53SKVJ"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->

<script src="../assets/js/kule.urbrowser.min.js" id="urbrowser" data-domain="www.edmtw.com"></script>
	<script src="../assets/js/jquery/jquery-3.3.1.min.js?v=1537528068"></script>
	<script src="../assets/js/vendor/bootstrap.bundle.min.js"></script>
    <script src="../assets/js/vendor/bootstrap.responsive-paginate.js"></script>
	<script src="../assets/js/vendor/jquery.slick.min.js"></script>
	<script src="../assets/js/vendor/jquery.hc-sticky.min.js"></script>
	<script src="../assets/js/vendor/jquery.pushy.min.js"></script>
	<script src="../assets/js/vendor/jquery.readmore.min.js"></script>
	<script src="../assets/js/jquery/jquery.scrollbar.min.js?v=1537528068"></script>
	<script src="../assets/js/jquery/owl.carousel.min.js?v=1537528068"></script>
    <script src="../assets/js/main.js?v=1538384436"></script>
	<script src="../assets/js/custom.js"></script>

    <!-- module include -->
    <script src="../assets/js/function/module.js"></script>

    <!-- single -->
    <script>
        $.home();
    </script>
    </body>
</html> --}}