<div class="animated fadeIn">
    <div class="row">
        <div class="col-md-12">
            <div class="box-title-section">
                <div class="form-inline">
                    <div class="form-group">
                        <label class="mr-1 text-value text-primary">Aguardando Retorno Hoje</label>
                    </div>
                </div>
                <hr>
            </div>
        </div>
        <div class="col-md-12">
            <div class="row">
                
                <?php foreach($naoAguardandoRetorno as $notificacao ){ ?>
                
                <div class="col-md-2 col-sm-4">
                    <div class="card">
                        <div class="card-body text-center">
                            <div class="text-muted small text-uppercase font-weight-bold"><?php e($notificacao->name) ?></div>
                            <div class="text-value-lg py-3"><?php e($notificacao->qnt) ?></div>
                            <a href="<?php e($notificacao->link == ''?'#':base_url($notificacao->link)) ?>" _target="_blank" class="btn btn-sm btn-success" ><i class="icon-arrow-right-circle "></i> Atender</a>
                        </div>
                    </div>
                </div>
                
                <?php } ?>
                
            </div>
        </div>
    </div>
    
    <div class="row">
        <div class="col-md-12">
            <div class="box-title-section">
                <div class="form-inline">
                    <div class="form-group">
                        <label class="mr-1 text-value text-primary">Aguardando atendimento</label>
                    </div>
                </div>
                <hr>
            </div>
        </div>
        <div class="col-md-12">
            <div class="row">
                
                <?php foreach($naoAtendidas as $notificacao ){ ?>
                
                <div class="col-md-2 col-sm-4">
                    <div class="card">
                        <div class="card-body text-center">
                            <div class="text-muted small text-uppercase font-weight-bold"><?php e($notificacao->name) ?></div>
                            <div class="text-value-lg py-3"><?php e($notificacao->qnt) ?></div>
                            <a href="<?php e($notificacao->link == ''?'#':base_url($notificacao->link)) ?>" _target="_blank" class="btn btn-sm btn-success" ><i class="icon-arrow-right-circle "></i> Atender</a>
                        </div>
                    </div>
                </div>
                
                <?php } ?>
                
            </div>
        </div>
    </div>
    
    
    
    <div class="row">
        <div class="col-md-12">
            <div class="box-title-section">
                <div class="form-inline">
                    <div class="form-group">
                        <label class="mr-1 text-value text-primary" for="periodo">Relatório por período</label>
                        <select name="periodo" class="form-control" id="periodo">
                            <option value="dia" >Diário</option>
                            <option value="semana" >Semanal</option>
                            <option value="mes" selected>Mensal</option>
                        </select>
                    </div>
                </div>
                <hr>
            </div>
        </div>
    </div>
    <!--
    <div class="row">
        <div class="col-md-12">
            <div class="card">
               <div class="card-header">Meus atendimentos</div>
               <div class="card-body">
                    <div class="row">
                        <div class="col-md-12">
                            <div class="card-group mb-5">
                                <div class="card text-white bg-info">
                                    <div class="card-body pb-0">
                                        <a href="#" class="btn btn-transparent p-0 float-right">
                                            <i class="icon-user-follow font-2xl"></i>
                                        </a>
                                        <div class="text-value">Total <span class="meuAtendimentosTotal novoLoad "><i class="fa fa-circle-o-notch fa-spin fa-fw"></i></span></div>
                                        <div><span class="meuAtendimentosUltimos novoLoad "><i class="fa fa-circle-o-notch fa-spin fa-fw"></i></span></div>
                                    </div>
                                    <div class="chart-wrapper mt-3 mx-3" style="height:70px;">
                                        <canvas class="chart" id="card-chart2" height="70"></canvas>
                                    </div>
                                </div>
                                <div class="card">
                                    <div class="card-body">
                                        <div class="h1 text-muted text-right mb-4">
                                            <i class="icon-globe"></i>
                                        </div>
                                        <div class="text-value meuCapturasAtual novoLoad "><i class="fa fa-circle-o-notch fa-spin fa-fw"></i></div>
                                    <small class="text-muted text-uppercase font-weight-bold">Por captura</small>
                                    <div class="progress progress-xs my-2">
                                        <div class="progress-bar bg-primary" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
                                    </div>
                                    <small class="text-muted">Período anterior <strong class="meuCapturasAnterior novoLoad "><i class="fa fa-circle-o-notch fa-spin fa-fw"></i></strong></small>
                                </div>
                            </div>
                            <div class="card">
                                <div class="card-body">
                                    <div class="h1 text-muted text-right mb-4">
                                        <i class="icon-globe"></i>
                                    </div>
                                    <div class="text-value meuOportunidadesAtual novoLoad "><i class="fa fa-circle-o-notch fa-spin fa-fw"></i></div>
                                    <small class="text-muted text-uppercase font-weight-bold">por oportunidade</small>
                                    <div class="progress progress-xs my-2">
                                        <div class="progress-bar bg-primary" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
                                    </div>
                                    <small class="text-muted">Período anterior <strong class="meuOportunidadesAnterior novoLoad "><i class="fa fa-circle-o-notch fa-spin fa-fw"></i></strong></small>
                                </div>
                            </div>
                            <div class="card">
                                <div class="card-body">
                                    <div class="h1 text-muted text-right mb-4">
                                        <i class="icon-globe"></i>
                                    </div>
                                    <div class="text-value meuOutrosAtual novoLoad "><i class="fa fa-circle-o-notch fa-spin fa-fw"></i></div>
                                    <small class="text-muted text-uppercase font-weight-bold">outros</small>
                                    <div class="progress progress-xs my-2">
                                        <div class="progress-bar bg-primary" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
                                    </div>
                                    <small class="text-muted">Período anterior <strong class="meuOutrosAnterior novoLoad "><i class="fa fa-circle-o-notch fa-spin fa-fw"></i></strong></small>
                                </div>
                            </div>
                        </div>
                    </div>   
                        
                     </div>
                     
                     
               </div>
           </div>
       </div>
   </div>
    -->
    
    <div class="row">
        <div class="col-md-12">
            <div class="card">
               <div class="card-header">Oportunidades OLX</div>
               <div class="card-body">
                    <div class="row">
                       <div class="col">
                          <div class="callout callout-info">
                             <small class="text-muted">Atendidas</small>
                             <br>
                             <strong class="h4 atendidasAtual novoLoad "><i class="fa fa-circle-o-notch fa-spin fa-fw"></i></strong>
                            <br>
                            <small class="text-muted">Período anterior <strong class="atendidasAnterior novoLoad"><i class="fa fa-circle-o-notch fa-spin fa-fw"></i> </strong></small>
                          </div>
                       </div>
                       <div class="col">
                          <div class="callout callout-danger">
                            <small class="text-muted text-uppercase font-weight-bold">Negadas</small>
                            <br>
                            <strong class="h4 negadasAtual novoLoad "><i class="fa fa-circle-o-notch fa-spin fa-fw"></i></strong>
                            <br>
                            <small class="text-muted">Período anterior <strong class="negadasAnterior novoLoad"><i class="fa fa-circle-o-notch fa-spin fa-fw"></i> </strong></small>
                          </div>
                       </div>
                       <div class="col">
                          <div class="callout callout-warning">
                             <small class="text-muted">Agurdando Retorno</small>
                             <br>
                             <strong class="h4 aguardandoAtual novoLoad "><i class="fa fa-circle-o-notch fa-spin fa-fw"></i></strong>
                            <br>
                            <small class="text-muted">Período anterior <strong class="aguardandoAnterior novoLoad"><i class="fa fa-circle-o-notch fa-spin fa-fw"></i> </strong></small>
                          </div>
                       </div>
                       <div class="col">
                          <div class="callout callout-success">
                             <small class="text-muted">Aceitas</small>
                             <br>
                             <strong class="h4 aceitasAtual novoLoad "><i class="fa fa-circle-o-notch fa-spin fa-fw"></i></strong>
                            <br>
                            <small class="text-muted">Período anterior <strong class="aceitasAnterior novoLoad"><i class="fa fa-circle-o-notch fa-spin fa-fw"></i> </strong></small>
                          </div>
                       </div>
                    </div>
                    <!--<hr class="mt-0"><br>-->
               </div>
            </div>
        </div>
    </div>
    
    <div class="row">
        <div class="col-md-12">
            <div class="card">
               <div class="card-header">Atendimentos Gerais</div>
               <div class="card-body">
                    <div class="row">
                        <div class="col-md-12">
                            <div class="card-group mb-5">
                                <div class="card text-white bg-info">
                                    <div class="card-body pb-0">
                                        <a href="#" class="btn btn-transparent p-0 float-right">
                                            <i class="icon-user-follow font-2xl"></i>
                                        </a>
                                        <div class="text-value">Total <span class="atendimentosTotal novoLoad "><i class="fa fa-circle-o-notch fa-spin fa-fw"></i></span></div>
                                        <div><span class="atendimentosUltimos novoLoad "><i class="fa fa-circle-o-notch fa-spin fa-fw"></i></span></div>
                                    </div>
                                    <div class="chart-wrapper mt-3 mx-3" style="height:70px;">
                                        <canvas class="chart" id="card-chart1" height="70"></canvas>
                                    </div>
                                </div>
                                <div class="card">
                                    <div class="card-body">
                                        <div class="h1 text-muted text-right mb-4">
                                            <i class="icon-globe"></i>
                                        </div>
                                        <div class="text-value capturasAtual novoLoad "><i class="fa fa-circle-o-notch fa-spin fa-fw"></i></div>
                                    <small class="text-muted text-uppercase font-weight-bold">Por captura</small>
                                    <div class="progress progress-xs my-2">
                                        <div class="progress-bar bg-primary" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
                                    </div>
                                    <small class="text-muted">Período anterior <strong class="capturasAnterior novoLoad "><i class="fa fa-circle-o-notch fa-spin fa-fw"></i></strong></small>
                                </div>
                            </div>
                            <div class="card">
                                <div class="card-body">
                                    <div class="h1 text-muted text-right mb-4">
                                        <i class="icon-globe"></i>
                                    </div>
                                    <div class="text-value oportunidadesAtual novoLoad "><i class="fa fa-circle-o-notch fa-spin fa-fw"></i></div>
                                    <small class="text-muted text-uppercase font-weight-bold">por oportunidade</small>
                                    <div class="progress progress-xs my-2">
                                        <div class="progress-bar bg-primary" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
                                    </div>
                                    <small class="text-muted">Período anterior <strong class="oportunidadesAnterior novoLoad "><i class="fa fa-circle-o-notch fa-spin fa-fw"></i></strong></small>
                                </div>
                            </div>
                            <div class="card">
                                <div class="card-body">
                                    <div class="h1 text-muted text-right mb-4">
                                        <i class="icon-globe"></i>
                                    </div>
                                    <div class="text-value outrosAtual novoLoad "><i class="fa fa-circle-o-notch fa-spin fa-fw"></i></div>
                                    <small class="text-muted text-uppercase font-weight-bold">outros</small>
                                    <div class="progress progress-xs my-2">
                                        <div class="progress-bar bg-primary" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
                                    </div>
                                    <small class="text-muted">Período anterior <strong class="outrosAnterior novoLoad "><i class="fa fa-circle-o-notch fa-spin fa-fw"></i></strong></small>
                                </div>
                            </div>
                        </div>
                    </div>   
                        
                     </div>
                     
                     
                </div>
                <hr class="mt-0"><br>
                <div class="card-body">
                        <div class="table-container table-responsive">
                            <table id="dataTable" class="display table table-striped table-bordered" style="width:100%">
                                <thead>
                                    <tr>
                                        <th>ID</th>
                                        <th>Nome</th>
                                        <th>Hoje</th>
                                        <th>Ontem</th>
                                        <th>Semana atual</th>
                                        <th>Semana anterior</th>
                                        <th>Mês atual</th>
                                        <th>Mês anterior</th>
                                        <th>Total</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <?php foreach($atendentes as $aten) { ?>
                                    <tr class="trData" >
                                        <td><?php e($aten->id_cadastro); ?></td>
                                        <td><?php e($aten->nome); ?></td>
                                        <td><?php e($aten->dia_atual); ?></td>
                                        <td><?php e($aten->dia_anterior); ?></td>
                                        <td><?php e($aten->semana_atual); ?></td>
                                        <td><?php e($aten->semana_anterior); ?></td>
                                        <td><?php e($aten->mes_atual); ?></td>
                                        <td><?php e($aten->mes_anterior); ?></td>
                                        <td><?php e($aten->qnt); ?></td>
                                    </tr>
                                    <?php } ?>
                                </tbody>
                            </table>
                        </div>
                    </div>
            </div>
        </div>
    </div>
    

    <!--<div class="row">
        <div class="col-md-12">
            <div class="card-group mb-5">
                
                <div class="card">
                    <div class="card-body">
                        <div class="h1 text-muted text-right mb-4">
                            <i class="icon-home"></i>
                        </div>
                        <div class="text-value"><?php e(0); ?></div>
                        <small class="text-muted text-uppercase font-weight-bold">Atendidas</small>
                        <div class="progress progress-xs my-2">
                            <div class="progress-bar bg-primary" role="progressbar" style="width: 100%" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"></div>
                        </div>
                        
                    </div>
                </div>
                
                <div class="card">
                    <div class="card-body">
                        <div class="h1 text-muted text-right mb-4">
                            <i class="icon-home"></i>
                        </div>
                        <div class="text-value"><?php e(0); ?></div>
                        <small class="text-muted text-uppercase font-weight-bold">Aceitas</small>
                        <div class="progress progress-xs my-2">
                            <div class="progress-bar bg-primary" role="progressbar" style="width: 100%" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"></div>
                        </div>
                        
                    </div>
                </div>
                
                <div class="card">
                    <div class="card-body">
                        <div class="h1 text-muted text-right mb-4">
                            <i class="icon-home"></i>
                        </div>
                        <div class="text-value"><?php e(0); ?></div>
                        <small class="text-muted text-uppercase font-weight-bold">Agurdando Retorno</small>
                        <div class="progress progress-xs my-2">
                            <div class="progress-bar bg-primary" role="progressbar" style="width: 50%" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100"></div>
                        </div>
                        
                    </div>
                </div>
                <div class="card">
                    <div class="card-body">
                        <div class="h1 text-muted text-right mb-4">
                            <i class="icon-home"></i>
                        </div>
                        <div class="text-value"><?php e(0); ?></div>
                        <small class="text-muted text-uppercase font-weight-bold">Negadas</small>
                        <div class="progress progress-xs my-2">
                            <div class="progress-bar bg-primary" role="progressbar" style="width: 50%" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100"></div>
                        </div>
                        
                    </div>
                </div>
            </div>
        </div>
    </div>-->
    
    
    
     
</div>