@extends('layouts.simple.master')

@section('title', 'Default')

@section('css')

@endsection

@section('style')
<link rel="stylesheet" type="text/css" href="{{ asset('assets/css/vendors/animate.css') }}">
<link rel="stylesheet" type="text/css" href="{{ asset('assets/css/vendors/datatables.css') }}">
@endsection

@section('breadcrumb-title')
<h3>Dashboard</h3>
@endsection

@section('breadcrumb-items')
<li class="breadcrumb-item">Dashboard</li>
@endsection
@section('content')
<div class="container-fluid">
    <div class="row widget-grid">
        <div class="col-xxl-12 col-sm-12 box-col-12">
            <div class="card" style="background-image: url({{ asset('assets/banner.jpg') }});">
                <div class="card-body">
                    <div class="row">
                        <div class="col-6 col-md-9 text-md-left mb-3 mb-md-0 p-l-30 pl-md-10" style="color: white;">
                            <h1 class="mb-1"></h1>
                            <p></p>
                        </div>
                        <div class="col-6 col-md-3 mt-3 text-center text-md-left">
                            <a href="#" class="btn btn-pill btn-primary btn-lg btn-block">Clain Now</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xxl-12 col-sm-12 box-col-12">
            <div class="card" style="background-image: url({{ asset('assets/banner2.jpg') }});">
                <div class="card-body">
                    <div class="row">
                        <div class="col-6 col-md-6 text-center text-md-left mb-3 mb-md-0" style="color: white;">
                            <!-- <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla molestie nisi sit amet velit placerat dignissim. Donec tristique erat quis erat elementum, ut dignissim velit sodales. In laoreet sed est vel aliquet.</p> -->
                        </div>
                        <div class="col-6 col-md-6 mt-2 text-center text-md-left">
                            <a href="{{route('deposit')}}" class="btn btn-pill m-b-10 btn-primary btn-lg btn-block m-r-10">Deposit</a>
                            <a href="{{ route('client_partner') }}" class="btn btn-pill m-b-10 btn-primary btn-lg btn-block m-r-10">IB Room</a>
                            <a href="{{route('withdraw')}}" class="btn btn-pill m-b-10 btn-primary btn-lg btn-block">Withdraw</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xxl-6 col-xl-6 col-md-6 col-sm-5 box-col-6">
            <div class="card height-equal">
                <div class="card-header card-no-border pb-2">
                    <div class="header-top">
                        <h5>Total Balance</h5>
                        <div class="card-header-right-icon">
                            <div class="dropdown icon-dropdown">
                            </div>
                        </div>
                    </div>
                </div>
                <div class="card-body pt-0 pb-3">
                    <div class="row recent-wrapper">
                        <div class="col-xl-6">
                            <div class="recent-chart">
                                <div id="recentchart"></div>
                            </div>
                        </div>
                        <div class="col-xl-6">
                            <ul class="order-content">
                                <li> <span class="recent-circle "> </span>
                                    <div> <span class="f-light f-w-500"> </span>
                                        <h4 class="mt-1 mb-0"><span class="f-light f-14 f-w-400 ms-1"> </span></h4>
                                    </div>
                                </li>
                                <li> <span class="recent-circle "></span>
                                    <div> <span class="f-light f-w-500"></span>
                                        <h4 class="mt-1 mb-0"><span class="f-light f-14 f-w-400 ms-1"> </span></h4>
                                    </div>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xxl-6 col-xl-6 col-md-6 col-sm-5 box-col-6">
            <div class="card height-equal">
                <div class="card-header card-no-border">
                    <div class="header-top">
                        <h5>Quick Links</h5>
                    </div>
                </div>
                <div class="card-body pt-3 pb-5">
                    <div class="row">
                        <div class="col-md-6 p-2">
                            <a href="{{route('deposit')}}" class="btn btn-square btn-primary w-100" style="text-align:left">Deposit</a>
                        </div>
                        <div class="col-md-6 p-2">
                            <a href="{{route('withdraw')}}" class="btn btn-square btn-primary w-100" style="text-align:left">Withdraw</a>
                        </div>
                        <div class="col-md-6 p-2">
                            <a href="{{route('my_account')}}" class="btn btn-square btn-primary w-100" style="text-align:left">Create Real Account</a>
                        </div>
                        <div class="col-md-6 p-2">
                            <a href="{{route('my_account')}}" class="btn btn-square btn-primary w-100" style="text-align:left">Create Demo Account</a>
                        </div>
                        <div class="col-md-6 p-2">
                            <a href="{{ route('client_partner') }}" class="btn btn-square btn-primary w-100" style="text-align:left">IB Room</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xxl-12 col-xl-12 col-md-12 col-sm-12 box-col-12">
            <div class="card height-equal">
                <div class="card-header card-no-border">
                    <div class="header-top">
                        <h5>Recent Tranction</h5>
                    </div>
                </div>
                <div class="card-body pt-3 pb-5">
                    <div class="row">
                        <div class="col-md-12">
                            <div class="table-responsive">
                                <table class="display" id="basic-1" role="grid">
                                    <thead>
                                        <tr>
                                            <th>Account Number</th>
                                            <th>Payment Date</th>
                                            <th>Amount</th>
                                            <th>Payment Method</th>
                                            <th>Status</th>
                                            <th>Type</th>
                                            <th>Action</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <!-- <tr>
                                            <td>1010234893</td>
                                            <td>09-09-2023</td>
                                            <td>USD 300.00</td>
                                            <td>Crypto - BTC | ETH | LTC</td>
                                            <td><span class="badge badge-pill badge-warning">Pending</span></td>
                                            <td>Deposit</td>
                                            <td>
                                                <button type="button" class="btn btn-square btn-success" data-bs-toggle="modal" data-bs-target="#transaction_info"><span class="fa fa-eye"></span></button>
                                            </td>
                                        </tr> -->
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="transaction_info" tabindex="-1" role="dialog" aria-labelledby="transaction_infoLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="transaction_infoLabel">Account Information</h5>
                <button class="btn-close" type="button" data-bs-dismiss="modal" aria-label="Close" data-bs-original-title="" title=""></button>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="col-md-6">Live Account Number</div>
                    <div class="col-md-6">1010234893</div>
                    <div class="col-md-6">Type</div>
                    <div class="col-md-6">Depost</div>
                    <div class="col-md-6">Comment</div>
                    <div class="col-md-6"></div>
                    <div class="col-md-6">Detail</div>
                    <div class="col-md-6"></div>
                    <div class="col-md-6">Fees</div>
                    <div class="col-md-6"></div>
                </div>
            </div>
            <div class="modal-footer">
                <button class="btn btn-primary" type="button" data-bs-dismiss="modal" data-bs-original-title="" title="">Close</button>
                <button class="btn btn-primary" type="button" data-bs-dismiss="modal" data-bs-original-title="" title="">Download Receipt</button>
            </div>
        </div>
    </div>
</div>
<script type="text/javascript">
    var session_layout = '{{ session()->get('
    layout ') }}';
</script>
@endsection

@section('script')
<script src="{{ asset('assets/js/chart/apex-chart/moment.min.js') }}"></script>
<script src="{{ asset('assets/js/notify/bootstrap-notify.min.js') }}"></script>
<script src="{{ asset('assets/js/dashboard/default.js') }}"></script>
<script src="{{ asset('assets/js/notify/index.js') }}"></script>
<script src="{{ asset('assets/js/typeahead/handlebars.js') }}"></script>
<script src="{{ asset('assets/js/typeahead/typeahead.bundle.js') }}"></script>
<script src="{{ asset('assets/js/typeahead/typeahead.custom.js') }}"></script>
<script src="{{ asset('assets/js/typeahead-search/handlebars.js') }}"></script>
<script src="{{ asset('assets/js/typeahead-search/typeahead-custom.js') }}"></script>
<script src="{{ asset('assets/js/height-equal.js') }}"></script>
<script src="{{ asset('assets/js/animation/wow/wow.min.js') }}"></script>
<script src="{{ asset('assets/js/datatable/datatables/jquery.dataTables.min.js') }}"></script>
<script src="{{ asset('assets/js/datatable/datatables/datatable.custom.js') }}"></script>
@endsection