@php $page = 'profile' @endphp
@php
use Carbon\Carbon;
@endphp
@extends('includes.layout')

@section('content')
<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">
    <!-- Content Header (Page header) -->
    <section class="content-header">
        <h1>Profile</h1>
        <ol class="breadcrumb">
            <li class="breadcrumb-item"><a href="{{ route('dashboard') }}"><i class="fa fa-dashboard"></i> Home</a></li>
            <li class="breadcrumb-item active">Profile</li>
        </ol>
    </section>

    <!-- Main content -->
    <section class="content">
        <div class="row">
            <div class="col-12">
                <div class="box">
                    <div class="box-header with-border">
                        <h3 class="box-title">{{ $user->name }} <span
                                class="badge badge-{{ $user->status == 'active' ? 'success' : 'danger' }}">{{
                                Str::ucfirst($user->status) }}</span></h3>
                        <div class="float-right btn-group">
                            <a href="{{ route('user.setting', 'update') }}" class="btn btn-primary btn-sm">Edit
                                Profile</a>
                        </div>
                    </div>
                    <div class="mt-5 row">
                        <div class="col-xl-6 col-md-6 col-12">
                            <div class="box box-primary pull-up">
                                <div class="box-body">
                                    <div class="d-flex align-items-center font-size-18">
                                        <p class="mb-0 text-white font-weight-medium">Account Balance</p>
                                    </div>
                                    <div class="flex-wrap d-flex align-items-center">
                                        <h2 class="text-white font-weight-normal">${{ number_format($user->balance, 2)
                                            }}</h2>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-xl-6 col-md-6 col-12">
                            <div class="box box-success pull-up">
                                <div class="box-body">
                                    <div class="d-flex align-items-center font-size-18">
                                        <p class="mb-0 text-white font-weight-medium">Referral Bonus</p>
                                    </div>
                                    <div class="flex-wrap d-flex align-items-center">
                                        <h2 class="text-white font-weight-normal">${{ number_format($user->ref_balance,
                                            2) }}</h2>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="box-body box-profile">
                        <h3 class="mb-0 text-muted">USER INFROMATION</h3>
                        <div class="mt-0 row">
                            <div class="col-md-12 col-12">
                                <div class="profile-user-info">
                                    <p>
                                        KYC :
                                        <span class="pl-10 ">
                                            @php $isVerified = optional($user->kyc_verify)->status === 'verified';
                                            @endphp
                                            <span class="badge badge-{{ $isVerified ? 'success' : 'danger' }}">
                                                {{ $isVerified ? 'Verified' : 'Not Verified' }}
                                            </span>
                                            @if (! $isVerified)
                                            <a href="{{ route('user.setting', 'kyc') }}"
                                                class="btn btn-sm btn-primary ms-2" title="Verify Now">
                                                <i class="bi bi-shield-check"></i> Click To Verify
                                            </a>
                                            @endif
                                        </span>
                                    </p>
                                    <p>ROI Mode :<span class="pl-10"><span
                                                class="badge badge-{{ $user->roi_mode == 'on' ? 'success' : 'danger'  }}">{{
                                                Str::ucfirst($user->roi_mode) }}</span></span> </p>
                                    <p>Full Name :<span class="pl-10 text-gray">{{ $user->name }}</span> </p>
                                    <p>User Name :<span class="pl-10 text-gray">{{ $user->username }}</span> </p>
                                    <p>Email :<span class="pl-10 text-gray">{{ $user->email }}</span> </p>
                                    <p>Phone Number :<span class="pl-10 text-gray">{{ $user->phone }}</span></p>
                                    <p>Gender :<span class="pl-10 text-gray">{{ $user->gender }}</span></p>
                                    <p>Address :<span class="pl-10 text-gray">{{ $user->address }}</span></p>
                                    <p>Nationality :<span class="pl-10 text-gray">{{ $user->country }}</span></p>
                                    <p>Date Joined :<span class="pl-10 text-gray">{{
                                            Carbon::parse($user->created_at)->format('D, M j, Y g:i A') }}</span>
                                    </p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- /.box -->
            </div>
            <!-- /.col -->
        </div>
    </section>
</div>
<!-- /.content-wrapper -->
@endsection

@push('scripts')
<!-- This is data table -->
<script src="{{ asset('dashboard/assets/vendor_components/datatable/datatables.min.js') }}"></script>
<!-- Fab Admin for Data Table -->
<script src="{{ asset('dashboard/js/pages/data-table.js') }}"></script>
<script>
    $(document).ready(function() {
            $(".address_option").hide();
            $(".bank_option").hide();
            $('#payment_id').change(function() {
                var selectedOption = $(this).find('option:selected');
                var dataVal = selectedOption.data('val');
                if(dataVal == 'crypto') {
                    $(".address_option").show();
                    $(".bank_option").hide();
                } else if(dataVal == 'bank') {
                    $(".address_option").hide();
                    $(".bank_option").show();
                }else{
                    $(".address_option").hide();
                    $(".bank_option").hide();
                }
            });
        });
</script>
@endpush