@extends('shop.main')

@section('header')
    @include('shop.components.header')
@endsection

@section('main')
    <div class="customer-area-container">
        <div class="customer-area-menu">
            <div class="menu-content">
                <div class="menu-title">
                    Minha Conta
                    &nbsp;
                    <i class="fas fa-angle-down"></i>
                </div>
                <div class="menu-body hidden">
                    <div data-target="inicio" class="menu-item active" onclick="menu.changeSection(this)">Visão Geral</div>
                    <div data-target="meus-dados" class="menu-item" onclick="menu.changeSection(this)">Meus Dados</div>
                    <div data-target="meus-enderecos" class="menu-item" onclick="menu.changeSection(this)">Meus Endereços</div>
                    <div data-target="meus-pedidos" class="menu-item" onclick="menu.changeSection(this)">Minhas Encomendas</div>
                    <a href="{{ route('customer.logout') }}" class="menu-item" onclick="">Sair</a>
                </div>
            </div>
        </div>
        <div class="customer-area-content">
            <section id="inicio" class="">
                @include('shop.customer-area.pages.home')
            </section>
            <section id="meus-dados" class="hidden">
                @include('shop.customer-area.pages.user-data')
            </section>
            <section id="meus-enderecos" class="hidden">
                @include('shop.customer-area.pages.user-addresses')
            </section>
            <section id="meus-pedidos" class="hidden">
                @include('shop.customer-area.pages.user-orders')
            </section>
        </div>
    </div>
@endsection

@section('footer')
    @include('shop.components.footer')
@endsection
@push('css')
    <link rel="stylesheet" href="{{ asset('shop/css/shop-main.css') }}">
    <link rel="stylesheet" href="{{ asset('shop/css/customer-area.css') }}">
@endpush
@push('js')
    <script src="{{ asset('shop/js/customer-area/main.js') }}"></script>
    <script src="{{ asset('shop/js/customer-area/menu.js') }}"></script>
    <script>
        mainCustomers.init()
    </script>
@endpush