@extends('frontend.layouts.app')

@section('title', __('Dashboard'))

@section('content')
    <div class="container py-4">
        <div class="row justify-content-center">
            <div class="col-md-12">
                <x-frontend.card>
                    <x-slot name="header">
                        @lang('Dashboard')
                    </x-slot>

                    <x-slot name="body">
                        <nav>
                            <div class="nav nav-tabs" id="nav-tab" role="tablist">
                                @php
                                    $hasPaid = $logged_in_user->hasPaid();
                                @endphp
                                
                                {{-- Payment Tab --}}
                                @if(!$hasPaid)
                                    <x-utils.link
                                        :text="__('Pay')"
                                        class="nav-link active"
                                        id="pay-tab"
                                        data-toggle="pill"
                                        href="#pay"
                                        role="tab"
                                        aria-controls="pay"
                                        aria-selected="true"/>
                                @endif

                                {{-- Application Tab --}}
                                @if($hasPaid)
                                    <x-utils.link
                                        :text="__('Bio-Data')"
                                        class="nav-link active"
                                        id="application-tab"
                                        data-toggle="pill"
                                        href="#application"
                                        role="tab"
                                        aria-controls="application"
                                        aria-selected="true"/>
                                @endif

                                {{-- Print Out Tab --}}
                                @if($hasPaid)
                                    <x-utils.link
                                        :text="__('Print Out')"
                                        class="nav-link active"
                                        id="printout-tab"
                                        data-toggle="pill"
                                        href="#printout"
                                        role="tab"
                                        aria-controls="printout"
                                        aria-selected="true"/>
                                @endif
                            </div>
                        </nav>

                        <div class="tab-content" id="my-profile-tabsContent">
                            {{-- Payment Tab --}}
                            @if(!$hasPaid)
                                <div class="tab-pane fade pt-3 show active" id="pay" role="tabpanel" aria-labelledby="pay-tab">
                                    @include('frontend.user.account.tabs.pay')
                                </div>
                            @endif

                            {{-- Application Tab --}}
                            @if($hasPaid)
                                <div class="tab-pane fade pt-3 show active" id="application" role="tabpanel" aria-labelledby="application-tab">
                                    @include('frontend.user.account.tabs.form')
                                </div>
                            @endif

                            {{-- Print Out Tab --}}
                            @if($hasPaid)
                                <div class="tab-pane fade pt-3 show active" id="printout" role="tabpanel" aria-labelledby="printout-tab">
                                    @include('frontend.user.account.tabs.printout')
                                </div>
                            @endif
                        </div>
                    </x-slot>
                </x-frontend.card>
            </div>
        </div>
    </div>
@endsection