@extends('layouts.master')

@section('sidebar')
    @parent

    <p>This is appended to the master sidebar.</p>
@stop

@section('content')



<!-- Card Group  -->
<!-- ============================================================== -->
<div class="row">
    <div class="col-lg-3 col-md-6">
        <div class="card">
            <div class="card-body">
                <h5 class="card-title text-uppercase">Total Vente</h5>
                <div class="d-flex align-items-center">
                    <div>
                        <div id="sparklinedash2"></div>
                    </div>
                    <div class="ml-auto">
                        <h3 class="text-primary mb-0"> {{number_format($Tvente, 2)}} </h3>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="col-lg-2 col-md-6">
        <div class="card">
            <div class="card-body">
                <h5 class="card-title text-uppercase">Total Perte</h5>
                <div class="d-flex align-items-center">
                    <div>
                        <div id="sparklinedash3"></div>
                    </div>
                    <div class="ml-auto">
                        <h3 class="text-danger mb-0"> {{number_format($Sperte, 2)}} </h3>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="col-lg-2 col-md-6">
        <div class="card">
            <div class="card-body">
                <h5 class="card-title text-uppercase">Total Dépôt</h5>
                <div class="d-flex align-items-center">
                    <div>
                        <div id="sparklinedash4"></div>
                    </div>
                    <div class="ml-auto">
                        <h3 class="text-success mb-0">{{number_format($depot, 2)}}</h3>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="col-lg-2 col-md-6">
        <div class="card">
            <div class="card-body">
                <h5 class="card-title text-uppercase">Total Dette</h5>
                <div class="d-flex align-items-center">
                    <div>
                        <div id="sparklinedash"></div>
                    </div>
                    <div class="ml-auto">
                        <h3 class="text-danger mb-0"> @if($DETTE > 0) {{number_format($DETTE, 2)}} @endif @if($DETTE < 0) {{0}} @endif </h3>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="col-lg-3 col-md-6">
        <div class="card">
            <div class="card-body">
                <h5 class="card-title text-uppercase">Total Commission</h5>
                <div class="d-flex align-items-center">
                    <div>
                        <div id="sparklinedash"></div>
                    </div>
                    <div class="ml-auto">
                        <h3 class="text-info mb-0"> {{number_format($totalcommussion, 2)}} </h3>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- ============================================================== -->

    <!-- Start Page Content -->
    <!-- ============================================================== -->

    <!-- ============================================================== -->
    <!-- End PAge Content -->

    <!-- Manage Table & Walet Cards Section  -->
                <!-- ============================================================== -->

<div class="card">
    <!-- Nav tabs -->
    <ul class="nav nav-tabs manage-tabs" role="tablist">
        <li class="nav-item">
            <a class="nav-link active" data-toggle="tab" href="#users" role="tab">
                <span class="hidden-sm-up">
                    <h4><i class="ti-home"></i></h4>
                </span>
                <span class="d-none d-md-block">Banques</span>
            </a>
        </li>
        <li class="nav-item">
            <a class="nav-link" data-toggle="tab" href="#permissions" role="tab">
                <span class="hidden-sm-up">
                    <h4><i class="ti-user"></i></h4>
                </span>
                <span class="d-none d-md-block">Responsables</span>
            </a>
        </li>
    </ul>
    <!-- Tab panes -->
    <div class="tab-content">
        <div class="tab-pane active" id="users" role="tabpanel">
            <div class="bg-light">
                <!-- Data Banques -->
                <div class="card">
                    <div class="card-body">
                        <div class="d-flex no-block align-items-center mb-4">
                            <h4 class="card-title">
                                Payroll<br/>
                                <small>
                                                                    </small>
                            </h4>
                        </div>
                        <div class="table-responsive">
                            <table id="zero_config" class="table table-striped border">
                                <thead>
                                    <tr>
                                        <th>Banque</th>
                                        <th>%</th>
                                        <th>Vente</th>
                                        <th>perte</th>
                                        <th>Dépôt</th>
                                        <th>Dette</th>
                                        <th>Commission</th>
                                        <th>Payroll</th>
                                    </tr>
                                </thead>
                                <tbody>
                                                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
                <!-- End Data Banque -->
            </div>
            <div class="d-flex align-items-center p-4 mt-2">
                <h3 class="font-light">{{$mbrbk}} Banque(s)</h3>
            </div>
        </div>
        <div class="tab-pane" id="permissions" role="tabpanel">
            <div class="row py-4 px-5 no-gutters mt-3">
                <div class="col-sm-12 col-md-6">
                    <h3 class="font-light">Payroll des Responsables</h3>
                </div>
            </div>
            <div class="bg-light">
                <!-- Data Responsable -->
                <div class="table-responsive">
                        <table id="zero_config" class="table table-striped border">
                            <thead>
                                <tr>
                                    <th>Responsables</th>
                                    <th>%</th>
                                    <th>Vente</th>
                                    <th>Perte</th>
                                    <th>Depot</th>
                                    <th>Dette</th>
                                    <th>Commission</th>
                                    <th>Payroll</th>
                                </tr>
                            </thead>
                            <tbody>
                                                            </tbody>
                        </table>
                    </div>
                <!-- End Data Responsable -->
            </div>
            <div class="d-flex align-items-center p-4 mt-2">
                <h3 class="font-light">{{sizeof($responsables)}} Responsable(s)</h3>
            </div>
        </div>
        
    </div>
    <div class="modal-footer">
        <a href="" alt="default" data-toggle="modal" data-target="#payroll" class="btn btn-info waves-effect waves-light">Appliquer Payroll</a>
    </div>
</div>
<!-- Payroll modal content -->
<div id="payroll" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="display: none;">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <h4 class="modal-title">Appliquer Payroll</h4>
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                        
                    </div>
                    <div class="modal-body">
                        <br/>
                            <h4>
                                Voulez-vous vraiment appliquer le payroll en cours?
                                <small><br/><br/>
                                    L'application du payroll implique la fermeture du payroll en cours et l'ouverture d'un nouveau payroll. A noter la fermeture est definitive pour effectuer les paiments dans l'onglet Paiments.
                                </small>
                            </h4>
                    </div>
                    <div class="modal-footer">
                        <a href="{{url('applicationpayroll')}}" class="btn btn-info waves-effect waves-light">Oui</a>
                        <button type="submit" class="btn btn-dark waves-effect" data-dismiss="modal">Non</button>
                    </div>
                </div>
            </div>
        </div>
        <!-- /.modal -->
<!-- ============================================================== -->

    <script type="text/javascript">
        function PrintDivDepot()
        {
            var mywindow = window.open('', 'PRINT','');

            mywindow.document.write('<html><body >');
            mywindow.document.write(document.getElementById('divToPrintdepot').innerHTML);
            mywindow.document.write('</body></html>');

            mywindow.document.close(); // necessary for IE >= 10
            mywindow.focus(); // necessary for IE >= 10*/

            mywindow.print();
            mywindow.close();
            return true;
        }
    </script>

@stop