@extends('layouts.backend.app')
@section('title', "Tableau de bord")
@section('content')
    <!-- Page Wrapper -->
    <!-- Page Wrapper -->
            <div class="page-wrapper">
                <div class="content container-fluid">

					<!-- Page Header -->
					<div class="page-header">
						<div class="row">
							<div class="col">
								<ul class="breadcrumb">
									<li class="breadcrumb-item"><a href="#">Tableau de bord</a></li>
									<li class="breadcrumb-item active">Afroshops</li>
								</ul>
							</div>
						</div>
					</div>
					<!-- /Page Header -->
                    <div class="row">
                      <div class="col-12"> <h3 class="page-title">Gain global de tous les afroshop</h3></div>
                        <div class="col-xl-3 col-sm-6 col-12">
                            <div class="card">
                                <div class="card-body">
                                    <div class="dash-widget-header">
										<span class="dash-widget-icon text-primary border-primary">
											<i class="fe fe-folder"></i>
										</span>
                                        <div class="dash-count">
                                            <h3>300,000€</h3>
                                        </div>
                                    </div>
                                    <div class="dash-widget-info">
                                        <h6 class="text-muted">Gain global</h6>
                                        <div class="progress progress-sm">
                                            <div class="progress-bar bg-primary w-50"></div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-xl-3 col-sm-6 col-12">
                            <div class="card">
                                <div class="card-body">
                                    <div class="dash-widget-header">
										<span class="dash-widget-icon text-success">
											<i class="fe fe-money"></i>
										</span>
                                        <div class="dash-count">
                                            <h3>300€</h3>
                                        </div>
                                    </div>
                                    <div class="dash-widget-info">

                                        <h6 class="text-muted">Gain d'aujourd'hui</h6>
                                        <div class="progress progress-sm">
                                            <div class="progress-bar bg-success w-50"></div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-xl-3 col-sm-6 col-12">
                            <div class="card">
                                <div class="card-body">
                                    <div class="dash-widget-header">
										<span class="dash-widget-icon text-danger border-danger">
											<i class="fe fe-money"></i>
										</span>
                                        <div class="dash-count">
                                            <h3>2100€</h3>
                                        </div>
                                    </div>
                                    <div class="dash-widget-info">

                                        <h6 class="text-muted">Gain de cette semaine</h6>
                                        <div class="progress progress-sm">
                                            <div class="progress-bar bg-danger w-50"></div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-xl-3 col-sm-6 col-12">
                            <div class="card">
                                <div class="card-body">
                                    <div class="dash-widget-header">
										<span class="dash-widget-icon text-warning border-warning">
											<i class="fe fe-money"></i>
										</span>
                                        <div class="dash-count">
                                            <h3>97000€</h3>
                                        </div>
                                    </div>
                                    <div class="dash-widget-info">

                                        <h6 class="text-muted">Gain du moi</h6>
                                        <div class="progress progress-sm">
                                            <div class="progress-bar bg-warning w-50"></div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
					<div class="row">
                        <div class="col-md-12">
                            <x-alert/>
                        </div>
						<div class="col-sm-12">
                            <h3 class="page-title">Liste de tous les afroshops dans le système</h3>
							<div class="card">
                                <div class="card-header">
                                    <div class="row">
                                        <div class="col-md-4">
                                            <select name="parent_category" id="" class="select2 form-control">
                                                <option value="0">Toutes les villes</option>
                                            </select>
                                        </div>
                                        <div class="col-md-2">
                                            <button class="btn btn-primary" type="button">Filtre <i class="fa fa-search"></i></button>
                                        </div>
                                    </div>
                                </div>
								<div class="card-body">
									<div class="table-responsive">
										<table class="datatable table table-stripped">
											<thead>
												<tr>
													<th>N°</th>
                                                    <th>Afroshop</th>
                                                    <th>Ville</th>
                                                    <th>Taux d'achat</th>
													<th>Bénéfice</th>
													<th class="text-center">Actions</th>
												</tr>
											</thead>
											<tbody>
                                                <tr>
                                                    <td>1</td>
                                                    <td>Greenshop</td>
                                                    <td>Yaounde</td>
                                                    <td>40</td>
                                                    <td>300,000€</td>
                                                    <td class="text-center">
                                                        <a href="{{route('afroshops.show', 1)}}" class="btn btn-mc" id="edit-button" title="Détails" style="padding: 5px;">
                                                            <span class="fa fa-eye"></span>
                                                        </a>
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td>1</td>
                                                    <td>Forexshop</td>
                                                    <td>Yaounde</td>
                                                    <td>40</td>
                                                    <td>50,000,000€</td>
                                                    <td class="text-center">
                                                        <a href="{{route('afroshops.show', 1)}}" class="btn btn-mc" id="edit-button" title="Détails" style="padding: 5px;">
                                                            <span class="fa fa-eye"></span>
                                                        </a>
                                                    </td>
                                                </tr>
											</tbody>
										</table>
									</div>
								</div>
							</div>
						</div>
					</div>

				</div>
			</div>
			<!-- /Main Wrapper -->
@endsection