@extends('layouts.app')
@section('content')
    <style>
        .icon-white {
            color: white !important;
        }
    </style>
    <!-- Content Header (Page header) -->
    <div class="content-header">
        <div class="container-fluid">
            <div class="row mb-2">
                <div class="col-sm-6">
                    <h1 class="m-0 text-dark">Dashboard</h1>
                </div>
                <!-- /.col -->
                <div class="col-sm-6">
                </div>
                <!-- /.col -->
            </div>
            <!-- /.row -->
        </div>
        <!-- /.container-fluid -->
    </div>
    <!-- /.content-header -->
    <!-- Main content -->
    <section class="content">
        <div class="container-fluid">
            <!-- Small boxes (Stat box) -->
            <div class="row">
                <div class="col-lg-3 col-6">
                    <!-- small box -->
                    <div class="small-box bg-info">
                        <div class="inner">
                            <h3>{{ $trainer }}</h3>
                            <p>Trainer</p>
                        </div>
                        <div class="icon">
                            <i class="ion ion-bag"></i>
                        </div>
                        <a href="{{ route('trainer.index') }}" class="small-box-footer">More info <i
                                class="fas fa-arrow-circle-right"></i></a>
                    </div>
                </div>
                <!-- ./col -->
                <div class="col-lg-3 col-6">
                    <!-- small box -->
                    <div class="small-box bg-success">
                        <div class="inner">
                            <h3>{{ $trainee }}</h3>
                            <p>Trainee</p>
                        </div>
                        <div class="icon">
                            <i class="ion ion-stats-bars"></i>
                        </div>
                        <a href="{{ route('trainee.index') }}" class="small-box-footer">More info <i
                                class="fas fa-arrow-circle-right"></i></a>
                    </div>
                </div>
                <!-- ./col -->
                <div class="col-lg-3 col-6">
                    <!-- small box -->
                    <div class="small-box bg-warning">
                        <div class="inner">
                            <h3>{{ $users }}</h3>
                            <p>User</p>
                        </div>
                        <div class="icon">
                            <i class="ion ion-person-add"></i>
                        </div>
                        <a href="{{ route('users.index') }}" class="small-box-footer">More info <i
                                class="fas fa-arrow-circle-right"></i></a>
                    </div>
                </div>
                <!-- ./col -->
                <div class="col-lg-3 col-6">
                    <!-- small box -->
                    <div class="small-box bg-danger">
                        <div class="inner">
                            <h3>{{ $batch }}</h3>
                            <p>Total Program</p>
                        </div>
                        <div class="icon">
                            <i class="ion ion-pie-graph"></i>
                        </div>
                        <a href="{{ route('batch.index') }}" class="small-box-footer">More info <i
                                class="fas fa-arrow-circle-right"></i></a>
                    </div>
                </div>
            </div>
            @if (auth::user()->role_id == 2)
                <div class="row">
                    <div class="col-lg-3 col-6">
                        <!-- small box -->
                        <div class="small-box bg-danger">
                            <div class="inner">
                                <h3>History</h3>
                                <p>Trainee History</p>
                            </div>
                            <div class="icon">
                                <i class="ion ion-pie-graph"></i>
                            </div>
                            <a href="{{ route('trainee.attendance.history') }}" class="small-box-footer">View <i
                                    class="fas fa-arrow-circle-right"></i></a>
                        </div>
                    </div>
                    <div class="col-lg-3 col-6">
                        <!-- small box -->
                        <div class="small-box bg-success">
                            <div class="inner">
                                <h3>Batch Report</h3>
                                <p>Trainee Batch Report</p>
                            </div>
                            <div class="icon">
                                <i class="ion ion-stats-bars"></i>
                            </div>
                            <a href="{{ route('trainee.batch.report') }}" class="small-box-footer">View <i
                                    class="fas fa-arrow-circle-right"></i></a>
                        </div>
                    </div>
                </div>
                {{-- <div class="row">
                    <h3>SESIP Training Data</h3>
                </div>
                <div class="row">
                    <div class="col-lg-3 col-6">
                        <!-- small box -->
                        <div class="small-box bg-info">
                            <div class="inner">
                                <h6>Practical Science Training</h6>
                                <p>Core Trainers - 366</p>
                                <p>Master Trainers - 1300</p>
                                <p>Districts Covered - 64</p>

                            </div>
                            <div class="icon">
                                <i class="ion ion-pie-graph"></i>
                            </div>
                            <a href="{{ route('trainee.attendance.history') }}" class="small-box-footer">View <i
                                    class="fas fa-arrow-circle-right"></i></a>
                        </div>
                    </div>
                    <div class="col-lg-3 col-6">
                        <!-- small box -->
                        <div class="small-box bg-success">
                            <div class="inner">
                                <h3>Batch Report</h3>
                                <p>Trainee Batch Report</p>
                            </div>
                            <div class="icon">
                                <i class="ion ion-stats-bars"></i>
                            </div>
                            <a href="{{ route('trainee.batch.report') }}" class="small-box-footer">View <i
                                    class="fas fa-arrow-circle-right"></i></a>
                        </div>
                    </div>
                </div> --}}
                <div class="row">
                    <h3>SESIP Training Programs</h3>
                </div>
                <div class="row">
                    <p style="font-size: small"> * Please click on the folder icon to view details</p>
                </div>
                <div class="row">
                    <div class="col-md-3 col-sm-6 col-12">
                        <div class="info-box bg-info">
                            <span class="info-box-icon">
                                <a href="https://drive.google.com/drive/folders/1ILsdtaQOgQnG9dUvqD9AlDU2XBeSYjQ0" target="_blank" title="View Details">
                                    <i class="fas fa-folder-open icon-white"></i>
                                </a>
                            </span>
                            <div class="info-box-content">
                                <span class="info-box-text">Practical Science Training</span>
                                <div class="progress">
                                    <div class="progress-bar" style="width: 100%"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-3 col-sm-6 col-12">
                        <div class="info-box bg-success">
                            <span class="info-box-icon">
                                <a href="https://drive.google.com/drive/folders/1TMVq90uJAZjmgUuHnY69lijVJsemna1W" target="_blank" title="View Details">
                                    <i class="fas fa-folder-open icon-white"></i>
                                </a>
                            </span>
                            <div class="info-box-content">
                                <span class="info-box-text">PBM</span>
                                <div class="progress">
                                    <div class="progress-bar" style="width: 100%"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-3 col-sm-6 col-12">
                        <div class="info-box bg-warning">
                            <span class="info-box-icon">
                                <a href="https://drive.google.com/drive/folders/10LZRz93REc4lXCUxb52dmLTvSO4gCCFm" target="_blank" title="View Details">
                                    <i class="fas fa-folder-open icon-white"></i>
                                </a>
                            </span>
                            <div class="info-box-content">
                                <span class="info-box-text">LSBE</span>
                                <div class="progress">
                                    <div class="progress-bar" style="width: 100%"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-3 col-sm-6 col-12">
                        <div class="info-box bg-danger">
                            <span class="info-box-icon">
                                <a href="https://drive.google.com/drive/folders/1d80krPuNLLKxJpoeSlnhcsST4RepdG39" target="_blank" title="View Details">
                                    <i class="fas fa-folder-open icon-white"></i>
                                </a>
                            </span>
                            <div class="info-box-content">
                                <span class="info-box-text">CA</span>
                                <div class="progress">
                                    <div class="progress-bar" style="width: 100%"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-3 col-sm-6 col-12">
                        <div class="info-box bg-info">
                            <span class="info-box-icon">
                                <a href="https://drive.google.com/drive/folders/1gD8QaF70gEkLJgIoEbPMzuPcaMuoF30H" target="_blank" title="View Details">
                                    <i class="fas fa-folder-open icon-white"></i>
                                </a>
                            </span>
                            <div class="info-box-content">
                                <span class="info-box-text">CQ</span>
                                <div class="progress">
                                    <div class="progress-bar" style="width: 100%"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-3 col-sm-6 col-12">
                        <div class="info-box bg-success">
                            <span class="info-box-icon">
                                <a href="https://drive.google.com/drive/folders/1vbP11FowIAGMerMDEUuqxzfP97-Fy0PM" target="_blank" title="View Details">
                                    <i class="fas fa-folder-open icon-white"></i>
                                </a>
                            </span>
                            <div class="info-box-content">
                                <span class="info-box-text">HTT</span>
                                <div class="progress">
                                    <div class="progress-bar" style="width: 100%"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-3 col-sm-6 col-12">
                        <div class="info-box bg-warning">
                            <span class="info-box-icon">
                                <a href="https://drive.google.com/drive/folders/1DOI18ooD0K9X_T0h4XWYVXfjnElDM7HH" target="_blank" title="View Details">
                                    <i class="fas fa-folder-open icon-white"></i>
                                </a>
                            </span>
                            <div class="info-box-content">
                                <span class="info-box-text">ILC Training</span>
                                <div class="progress">
                                    <div class="progress-bar" style="width: 100%"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-3 col-sm-6 col-12">
                        <div class="info-box bg-danger">
                            <span class="info-box-icon">
                                <a href="https://drive.google.com/drive/folders/1MDcRqdFbomFaJuMWDP6t6ggBcYpOXT17" target="_blank" title="View Details">
                                    <i class="fas fa-folder-open icon-white"></i>
                                </a>
                            </span>
                            <div class="info-box-content">
                                <span class="info-box-text">TCG</span>
                                <div class="progress">
                                    <div class="progress-bar" style="width: 100%"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            @endif
        </div>
        <!-- /.container-fluid -->
    </section>
    <!-- /.content -->
@endsection