@extends('model')
@section('title_page', 'Paramètres')
@section('content')
    <nav aria-label="breadcrumb">
        <ol class="breadcrumb">
            <li class="breadcrumb-item"><a href="{{ url('/accueil') }}">Accueil</a></li>/
            <li class="breadcrumb-item active" aria-current="page">Paramètres</li>
        </ol>
    </nav>




    <div class="row">

        <div class="col-xl-6">

            <div class="card">
                <div class="customCard-header">

                    <div style="display: flex;justify-content:space-between">
                    
                            <h5>Société</h5>
                            <span   class="btn notreBtnPrimaire shadow btn-sm btn-edit sharp d-flex align-items-center" style="width : 35px; border-radius:50px;margin-top:-4px">
                                                                    <i class="fas fa-plus"></i>
                            </span>
                    </div>
                </div>
                <div class="card-body">

                    <div class="table-responsive">
                        <table id="tableListeSociete" class="display table">
                            <thead>
                                <tr>
                                    <th class="text-center">Action</th>
                                    <th class="text-center">Raison sociale</th>

                                </tr>
                            </thead>

                        </table>
                    </div>

                </div>

            </div>
        </div>
        <div class="col-xl-6">

            <div class="card">
               <div class="customCard-header">

                    <div style="display: flex;justify-content:space-between">
                    
                            <h5>Banque</h5>
                            <span   class="btn notreBtnPrimaire shadow btn-sm btn-edit sharp d-flex align-items-center" style="width : 35px; border-radius:50px;margin-top:-4px">
                                                                    <i class="fas fa-plus"></i>
                            </span>
                    </div>
                </div>
                <div class="card-body">

                    <div class="table-responsive">
                        <table id="tableListeBanque" class="display table">
                            <thead>
                                <tr>
                                    <th class="text-center">Action</th>
                                    <th class="text-center">Intitulé</th>

                                </tr>
                            </thead>

                        </table>
                    </div>

                </div>

            </div>
        </div>
        <div class="col-xl-6">

            <div class="card">
               
                <div class="customCard-header">

                    <div style="display: flex;justify-content:space-between">
                    
                            <h5>Mode règlement</h5>
                            <span   class="btn notreBtnPrimaire shadow btn-sm btn-edit sharp d-flex align-items-center" style="width : 35px; border-radius:50px;margin-top:-4px">
                                                                    <i class="fas fa-plus"></i>
                            </span>
                    </div>
                </div>

                <div class="card-body">

                    <div class="table-responsive">
                        <table id="tableListeModeRegelement" class="display table">
                            <thead>
                                <tr>
                                    <th class="text-center">Action</th>
                                    <th class="text-center">Intitulé</th>
                                    <th class="text-center">Type mode règlement</th>
                                   

                                </tr>
                            </thead>

                            

                        </table>
                    </div>

                </div>

            </div>

        </div>

        <div class="col-xl-6">

            <div class="card">
                
                <div class="customCard-header">

                    <div style="display: flex;justify-content:space-between">
                    
                            <h5>Compte trésorerie</h5>
                            <span   class="btn notreBtnPrimaire shadow btn-sm btn-edit sharp d-flex align-items-center" style="width : 35px; border-radius:50px;margin-top:-4px">
                                                                    <i class="fas fa-plus"></i>
                            </span>
                    </div>
                </div>

                <div class="card-body">

                    <div class="table-responsive">
                        <table id="tableListeTresorerie" class="display table">
                            <thead>
                                <tr>
                                    <th class="text-center">Action</th>
                                    <th class="text-center">Intitulé</th>
                                    <th class="text-center">Numéro de compte</th>
                                    <th class="text-center">Type de compte</th>

                                </tr>
                            </thead>

                        </table>
                    </div>

                </div>

            </div>

        </div>


    </div>



@endsection

@section('script')

    <script>
        $(document).ready(function() {

            $('#tableListeSociete').DataTable({
                language: languageTable,
                pageLength: 10,
                searching:false,
                lengthChange:false,
                order: [],
                {{-- columnDefs: [{
                        targets: [6, 7, 8],
                        className: 'text-end'
                    },

                ], --}}
            });

            $('#tableListeBanque').DataTable({
                language: languageTable,
                searching:false,
                lengthChange:false,
                pageLength: 10,
                order: [],
            });

            $('#tableListeModeRegelement').DataTable({
                language: languageTable,
                searching:false,
                lengthChange:false,
                pageLength: 10,
                order: [],
            });

            $('#tableListeTresorerie').DataTable({
                language: languageTable,
                searching:false,
                lengthChange:false,
                pageLength: 10,
                order: [],
            });

            Getlistbanque();
            GetlistTresoSimple();
            GetlistReglementSimple();
            GetlistSociete();

        })

        function Getlistbanque(){

            var table = $('#tableListeBanque').DataTable()
             table.clear().draw()
             listeDesBanqueSimple().then((resp)=>{

                if(resp.success == 1){

                     var actionBtn =  `<div style="display:flex">
                                                <x-btn-icone-table  type="edit" id="btnModalModifReglement" />
                                                <x-btn-icone-table  type="delete" id="btnModalModifReglement" />
                                            </div>`;
                    $.each(resp.data,function(key,value){
                        table.row.add([
                            actionBtn,
                            value.intitule_banque
                        ])
                    })

                     table.draw()

                }
             })
        }


        function GetlistTresoSimple(){

            var table = $('#tableListeTresorerie').DataTable()
             table.clear().draw()
             listeDesComptesTresoSimple().then((resp)=>{

                if(resp.success == 1){

                    
                    $.each(resp.data,function(key,value){

                         var typeCompte = "";
                        if (value.type_compte_treso == 1) {
                            typeCompte =
                                '<span class="badge light badge-success text-uppercase " style="width: 110px;"> <i class="fa fa-circle text-success  me-1"></i> Caisse</span>'
                        } else {
                            typeCompte =
                                '<span class="badge light badge-secondary text-uppercase " style="width: 110px;"> <i class="fa fa-circle text-secondary  me-1"></i> Banque</span>'
                        }

                         var actionBtn =  `<div style="display:flex">
                                                <x-btn-icone-table  type="edit" id="btnModalModifReglement" />
                                                <x-btn-icone-table  type="delete" id="btnModalModifReglement" />
                                            </div>`;

                        table.row.add([
                            actionBtn,
                            value.intitule_compte_treso,
                             value.numero_compte_treso,
                             typeCompte
                        ])
                    })

                     table.draw()

                }
             })
        }

    function GetlistReglementSimple(){

        var table = $('#tableListeModeRegelement').DataTable()
             table.clear().draw()
             listeDesModeDeReglementSimple().then((resp)=>{

                if(resp.success == 1){

                   
                    $.each(resp.data,function(key,value){

                         var typemodeReglement = "";
                        if (value.type_mode_reg == 1) {
                            typemodeReglement =
                                '<span class="badge light badge-success text-uppercase " style="width: 130px;"> <i class="fa fa-circle text-success  me-1"></i> ESPECES</span>'
                        } else if(value.type_mode_reg == 2){
                            typemodeReglement =
                                '<span class="badge light badge-secondary text-uppercase " style="width: 130px;"> <i class="fa fa-circle text-secondary  me-1"></i> CHEQUES</span>'
                        }
                        else if(value.type_mode_reg == 3){
                            typemodeReglement =
                                '<span class="badge light badge-primary text-uppercase " style="width: 130px;"> <i class="fa fa-circle text-primary  me-1"></i> VIREMENT</span>'
                        }
                         else{
                            typemodeReglement =
                                '<span class="badge light badge-info text-uppercase " style="width: 130px;"> <i class="fa fa-circle text-info  me-1"></i> MOBILE MONEY</span>'
                        }

                          var actionBtn =  `<div style="display:flex">
                                                <x-btn-icone-table  type="edit" class="btn-edit" id="btnModalModifReglement" />
                                                <x-btn-icone-table  type="delete" id="btnModalModifReglement" />
                                            </div>`;

                        table.row.add([
                            actionBtn,
                            value.intitule_mode_reg,
                             typemodeReglement
                              
                        ])
                    })

                     table.draw()

                }
             })
        }




        function GetlistSociete(){

        var table = $('#tableListeSociete').DataTable()
             table.clear().draw()
             listeDesSociete().then((resp)=>{

                if(resp.succes == 1){

                     var actionBtn =  `<div style="display:flex">
                                                <x-btn-icone-table  type="edit" id="btnModalModifReglement" />
                                                <x-btn-icone-table  type="delete" id="btnModalModifReglement" />
                                            </div>`;
                    $.each(resp.data,function(key,value){
                        table.row.add([
                            actionBtn,
                            value.raison_sociale_societe,
                             
                              
                        ])
                    })

                     table.draw()

                }
             })
        }




    </script>
@endsection