@extends('template.novitrades.layouts.admin-base')
@section('title', __('Dashboard'))
@section('content')

<div class="tabs-content">
                        <div class="tab-content">
                            <div class="two-cols">
                                <div class="onecol">
                                    <h5>Time Period</h5>
                                    <div class="form-group">
                                        <div class="dropdown bootstrap-select form-control">
                                            <select class="selectpicker form-control" id="time-filter">
                                                <option value="$gte=1641081601">Today</option>
                                                <option value="$gte=1640995201&amp;$lte=1641081601">Yesterday</option>
                                                <option value="$gte=1640563200">This Week</option>
                                                <option value="$gte=1639958400&amp;$lte=1640563200">Past Week</option>
                                                <option value="$gte=1640995200">This Month</option>
                                                <option value="$gte=1638316800&amp;$lte=1640995200">Past Month</option>
                                                <option value="$gte=1640476801">Last 7 days</option>
                                                <option value="$gte=1638489601">Last 30 days</option>
                                                <option value="custom">Custom...</option>
                                            </select>
                                            <button
                                                type="button"
                                                tabindex="-1"
                                                class="btn dropdown-toggle btn-light"
                                                data-toggle="dropdown"
                                                role="combobox"
                                                id="dropdownMenuButton1" data-bs-toggle="dropdown"
                                                aria-expanded="false"
                                                data-id="time-filter"
                                                title="Today"
                                            >
                                                <div class="filter-option">
                                                    <div class="filter-option-inner"><div class="filter-option-inner-inner">Today</div></div>
                                                </div>
                                            </button>
                                            <div class="dropdown-menu" aria-labelledby="dropdownMenuButton1">
                                                <div class="inner show" role="listbox" id="bs-select-107" tabindex="-1"><ul class="dropdown-menu inner show" role="presentation"></ul></div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="form-group" style="display: none;">
                                        <label>Date From</label>
                                        <input type="text" class="form-control timepicker flatpickr-input" id="date-from" readonly="readonly" />
                                    </div>
                                    <div class="form-group" style="display: none;">
                                        <label>Date To</label>
                                        <input type="text" class="form-control timepicker flatpickr-input" id="date-to" readonly="readonly" />
                                    </div>
                                </div>
                                <div class="onecol"></div>
                            </div>
                            <div class="two-cols">
                                <div class="onecol">
                                    <h5>Users Registrations <span id="total-reg">Total: {{ $usercount }}</span></h5>
                                    <div class="chart" id="chart-registrations" data-highcharts-chart="8" style="overflow: hidden;">
                                        <div
                                            id="highcharts-1o8ya0v-26"
                                            dir="ltr"
                                            class="highcharts-container"
                                            style="
                                                position: relative;
                                                overflow: hidden;
                                                width: 534px;
                                                height: 400px;
                                                text-align: left;
                                                line-height: normal;
                                                z-index: 0;
                                                -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
                                                user-select: none;
                                                touch-action: manipulation;
                                                outline: none;
                                            "
                                        >
                                            <svg
                                                version="1.1"
                                                class="highcharts-root"
                                                style="font-family: 'Lucida Grande', 'Lucida Sans Unicode', Arial, Helvetica, sans-serif; font-size: 12px;"
                                                xmlns="http://www.w3.org/2000/svg"
                                                width="534"
                                                height="400"
                                                viewBox="0 0 534 400"
                                            >
                                                <desc>Created with Highcharts 9.1.2</desc>
                                                <defs>
                                                    <clipPath id="highcharts-1o8ya0v-27-"><rect x="0" y="0" width="486" height="375" fill="none"></rect></clipPath>
                                                </defs>
                                                <rect fill="#181f2d" class="highcharts-background" x="0" y="0" width="534" height="400" rx="0" ry="0"></rect>
                                                <rect fill="none" class="highcharts-plot-background" x="38" y="10" width="486" height="375"></rect>
                                                <g class="highcharts-grid highcharts-xaxis-grid" data-z-index="1"></g>
                                                <g class="highcharts-grid highcharts-yaxis-grid" data-z-index="1"></g>
                                                <rect fill="none" class="highcharts-plot-border" data-z-index="1" x="38" y="10" width="486" height="375"></rect>
                                                <g class="highcharts-axis highcharts-xaxis" data-z-index="2">
                                                    <path fill="none" class="highcharts-axis-line" stroke="#ccd6eb" stroke-width="1" data-z-index="7" d="M 38 385.5 L 524 385.5"></path>
                                                </g>
                                                <g class="highcharts-axis highcharts-yaxis" data-z-index="2">
                                                    <text x="26" data-z-index="7" text-anchor="middle" transform="translate(0,0) rotate(270 26 197.5)" class="highcharts-axis-title" style="color: #666666; fill: #666666;" y="197.5">
                                                        Registrations
                                                    </text>
                                                    <path fill="none" class="highcharts-axis-line" data-z-index="7" d="M 38 10 L 38 385"></path>
                                                </g>
                                                <g class="highcharts-series-group" data-z-index="3">
                                                    <g
                                                        class="highcharts-series highcharts-series-0 highcharts-column-series highcharts-tracker"
                                                        data-z-index="0.1"
                                                        opacity="1"
                                                        transform="translate(38,10) scale(1 1)"
                                                        clip-path="url(#highcharts-1o8ya0v-27-)"
                                                    ></g>
                                                    <g class="highcharts-markers highcharts-series-0 highcharts-column-series" data-z-index="0.1" opacity="1" transform="translate(38,10) scale(1 1)" clip-path="none"></g>
                                                </g>
                                                <g class="highcharts-exporting-group" data-z-index="3"></g>
                                                <text x="10" class="highcharts-title" data-z-index="4" style="color: #333333; font-size: 18px; fill: #333333;" y="24"></text>
                                                <text x="10" class="highcharts-subtitle" data-z-index="4" style="color: #666666; fill: #666666;" y="24"></text>
                                                <text x="10" text-anchor="start" class="highcharts-caption" data-z-index="4" style="color: #666666; fill: #666666;" y="397"></text>
                                                <g class="highcharts-axis-labels highcharts-xaxis-labels" data-z-index="7"></g>
                                                <g class="highcharts-axis-labels highcharts-yaxis-labels" data-z-index="7"></g>
                                            </svg>
                                        </div>
                                    </div>
                                </div>
                                <div class="onecol">
                                    <h5>Deposits <span id="total-deposits">Total: ${{ number_format($total_deposit , 2, '.',',') }}</span></h5>
                                    <div class="chart" id="chart-deposits" data-highcharts-chart="9" style="overflow: hidden;">
                                        <div
                                            id="highcharts-1o8ya0v-28"
                                            dir="ltr"
                                            class="highcharts-container"
                                            style="
                                                position: relative;
                                                overflow: hidden;
                                                width: 534px;
                                                height: 400px;
                                                text-align: left;
                                                line-height: normal;
                                                z-index: 0;
                                                -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
                                                user-select: none;
                                                touch-action: manipulation;
                                                outline: none;
                                            "
                                        >
                                            <svg
                                                version="1.1"
                                                class="highcharts-root"
                                                style="font-family: 'Lucida Grande', 'Lucida Sans Unicode', Arial, Helvetica, sans-serif; font-size: 12px;"
                                                xmlns="http://www.w3.org/2000/svg"
                                                width="534"
                                                height="400"
                                                viewBox="0 0 534 400"
                                            >
                                                <desc>Created with Highcharts 9.1.2</desc>
                                                <defs>
                                                    <clipPath id="highcharts-1o8ya0v-29-"><rect x="0" y="0" width="486" height="375" fill="none"></rect></clipPath>
                                                </defs>
                                                <rect fill="#181f2d" class="highcharts-background" x="0" y="0" width="534" height="400" rx="0" ry="0"></rect>
                                                <rect fill="none" class="highcharts-plot-background" x="38" y="10" width="486" height="375"></rect>
                                                <g class="highcharts-grid highcharts-xaxis-grid" data-z-index="1"></g>
                                                <g class="highcharts-grid highcharts-yaxis-grid" data-z-index="1"></g>
                                                <rect fill="none" class="highcharts-plot-border" data-z-index="1" x="38" y="10" width="486" height="375"></rect>
                                                <g class="highcharts-axis highcharts-xaxis" data-z-index="2">
                                                    <path fill="none" class="highcharts-axis-line" stroke="#ccd6eb" stroke-width="1" data-z-index="7" d="M 38 385.5 L 524 385.5"></path>
                                                </g>
                                                <g class="highcharts-axis highcharts-yaxis" data-z-index="2">
                                                    <text x="26" data-z-index="7" text-anchor="middle" transform="translate(0,0) rotate(270 26 197.5)" class="highcharts-axis-title" style="color: #666666; fill: #666666;" y="197.5">
                                                        Deposits
                                                    </text>
                                                    <path fill="none" class="highcharts-axis-line" data-z-index="7" d="M 38 10 L 38 385"></path>
                                                </g>
                                                <g class="highcharts-series-group" data-z-index="3">
                                                    <g
                                                        class="highcharts-series highcharts-series-0 highcharts-column-series highcharts-tracker"
                                                        data-z-index="0.1"
                                                        opacity="1"
                                                        transform="translate(38,10) scale(1 1)"
                                                        clip-path="url(#highcharts-1o8ya0v-29-)"
                                                    ></g>
                                                    <g class="highcharts-markers highcharts-series-0 highcharts-column-series" data-z-index="0.1" opacity="1" transform="translate(38,10) scale(1 1)" clip-path="none"></g>
                                                </g>
                                                <g class="highcharts-exporting-group" data-z-index="3"></g>
                                                <text x="10" class="highcharts-title" data-z-index="4" style="color: #333333; font-size: 18px; fill: #333333;" y="24"></text>
                                                <text x="10" class="highcharts-subtitle" data-z-index="4" style="color: #666666; fill: #666666;" y="24"></text>
                                                <text x="10" text-anchor="start" class="highcharts-caption" data-z-index="4" style="color: #666666; fill: #666666;" y="397"></text>
                                                <g class="highcharts-axis-labels highcharts-xaxis-labels" data-z-index="7"></g>
                                                <g class="highcharts-axis-labels highcharts-yaxis-labels" data-z-index="7"></g>
                                            </svg>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <table id="table-deposits" class="no-footer" role="grid" style="">
                                <thead>
                                    <tr role="row">
                                        <th class="sorting_asc" tabindex="0" aria-controls="table-deposits" rowspan="1" colspan="1" aria-sort="ascending" aria-label="Manager: activate to sort column descending" style="width: 571px;">
                                            Manager
                                        </th>
                                        <th class="" tabindex="0" aria-controls="table-deposits" rowspan="1" colspan="1" aria-label="Deposits: activate to sort column ascending" style="width: 551px;">Deposits</th>
                                    </tr>
                                </thead>
                                <tbody></tbody>
                            </table>
                        </div>
                    </div>
@endsection