@extends('admin.layouts.sub-layout.app')

@section('content')
    <div class="container-fluid r-aside">

        <div class="row page-titles">
            <div class="col-md-5 align-self-center">
                <h3 class="text-themecolor">Dashboard</h3>
            </div>
            <div class="col-md-7 align-self-center">
            </div>
        </div>

        <div class="row">
            <div class="col-lg-4">
                <div class="card bg-warning">
                    <div class="card-body">
                        <div class="d-flex no-block">
                            <div class="m-r-20 align-self-center">
                                <i class="fa fa-users display-5 op-5 text-light"></i>
                            </div>
                            <div class="align-self-center">
                                <h6 class="text-light m-t-10 m-b-0">Total Users</h6>
                                <h2 class="m-t-0 text-light">{{ $data['total_user'] }}</h2>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-lg-4">
                <div class="card bg-success">
                    <div class="card-body">
                        <div class="d-flex no-block">
                            <div class="m-r-20 align-self-center">
                                <i class="mdi mdi-animation display-5 op-5 text-light"></i>
                            </div>
                            <div class="align-self-center">
                                <h6 class="text-light m-t-10 m-b-0">Total Category</h6>
                                <h2 class="m-t-0 text-light">{{ $data['total_category'] }}</h2>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-lg-4">
                <div class="card bg-danger">
                    <div class="card-body">
                        <div class="d-flex no-block">
                            <div class="m-r-20 align-self-center">
                                <i class="fa fa-money display-5 op-5 text-light"></i>
                            </div>
                            <div class="align-self-center">
                                <h6 class="text-light m-t-10 m-b-0">Total Transaction</h6>
                                <h2 class="m-t-0 text-light">{{ $data['total_transaction'] }}</h2>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="col-md-12">
                <div class="card">
                    <div class="card-body">
                        <div class="d-flex">
                            <div>
                                <h4 class="card-title"><span class="lstick">
                                    </span>Transaction List
                                </h4>
                            </div>
                            <div class="ml-auto">
                                <form action="">
                                    <div class="input-group">
                                        <input type="text" class="form-control form-control-sm" name="key" placeholder="Search here ..."
                                               value="{{ request('key', null) }}">
                                        <div class="input-group-prepend">
                                            <button class="btn btn-info" type="submit">
                                                <i class="fa fa-search"></i>
                                            </button>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                        <div class="table-responsive m-t-20 no-wrap">
                            <table class="table vm no-th-brd pro-of-month">
                                <thead>
                                    <tr>
                                        <th colspan="2">User</th>
                                        <th>Seller</th>
                                        <th>Status</th>
                                        <th>Price</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @forelse($data['transactions'] as $transaction)
                                        <tr>
                                            <td>
                                                <span class="round">
                                                    <img src="{{ $transaction->user->url }}" alt="{{ $transaction->user->name }}"
                                                         width="40" height="40">
                                                </span>
                                            </td>
                                            <td>
                                                <h6>{{ $transaction->user->name }}</h6>
                                                <small class="text-muted">{{ $transaction->user->email }}</small>
                                            </td>
                                            <td>{{ $transaction->seller->name }}</td>
                                            <td>
                                                <span class="label {{ $transaction->status_id == 1 ? 'label-success'
                                                    : 'label-warning' }} label-rounded">
                                                    {{ $transaction->status->name }}
                                                </span>
                                            </td>
                                            <td>{{ $transaction->total_price }}</td>
                                        </tr>
                                    @empty
                                        <tr>
                                            <td colspan="5" class="text-center">
                                                <h4>Data Not Found.</h4>
                                            </td>
                                        </tr>
                                    @endforelse
                                </tbody>
                                <tfoot>
                                    <tr>
                                        <td colspan="7">
                                            <div class="pull-right">
                                                {{ $data['transactions']->links('vendor.pagination.bootstrap-4') }}
                                            </div>
                                        </td>
                                    </tr>
                                </tfoot>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <aside class="right-side-panel">
            <div class="row">
                <div class="col-md-12 m-t-10">
                    <div class="card bg-info text-white">
                        <div class="card-body">
                            <div class="d-flex">
                                <div class="stats">
                                    <h1 class="text-white">{{ $data['total_listing'] }}</h1>
                                    <h6 class="text-white">Total Listing</h6>
                                    <a href="{{ route('admin.listing') }}"
                                       class="btn btn-rounded btn-outline btn-light m-t-10 font-14">
                                        Show list
                                    </a>
                                </div>
                                <div class="stats-icon text-right ml-auto">
                                    <i class="fa fa-list-alt display-5 op-5 text-light"></i>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="card bg-primary text-white">
                        <div class="card-body">
                            <div class="d-flex">
                                <div class="stats">
                                    <h1 class="text-white">{{ $data['total_happening'] }}</h1>
                                    <h6 class="text-white">Total Happening</h6>
                                    <a href="{{ route('admin.happening') }}"
                                       class="btn btn-rounded btn-outline btn-light m-t-10 font-14">
                                        Show list
                                    </a>
                                </div>
                                <div class="stats-icon text-right ml-auto">
                                    <i class="mdi mdi-rename-box display-5 op-5 text-light"></i>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </aside>
    </div>
@endsection