@extends('Templates/templateAdmin')

@section('Main-content')
    <!-- Content Wrapper. Contains page content -->

    <!-- 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">Dashboard</h1>
                </div><!-- /.col -->
                <div class="col-sm-6">
                    <ol class="breadcrumb float-sm-right">
                        <li class="breadcrumb-item"><a href="#"></a>Dashboard</li>
                    </ol>
                </div><!-- /.col -->
            </div><!-- /.row -->
        </div><!-- /.container-fluid -->
    </div>
    <!-- /.content-header -->

    <!-- Main content -->
    <section class="content">
        <div class="container-fluid">

            <div class="row">
                <div class="col-md-3">
                    <div class="card card-row card-secondary">
                        <!-- Card header -->
                        <div class="card-header info-box bg-secondary">
                            <span class="info-box-icon"><i class="fas fa-file-edit"></i></span>
                            <div class="info-box-content">
                                <span class="info-box-text">Em planeamento</span>
                                <span class="info-box-number">{{count($CompanyProject)}}</span>

                                <div class="progress">
                                    <div class="progress-bar" style="width: 100%"></div>
                                </div>
                                <span class="progress-description">
                                    Em planeamento de 2023
                                </span>
                            </div>
                            <!-- /.info-box-content -->
                        </div>
                        <!-- /.info-box -->
                        <!-- /.Card header-->
                        <div class="card-body">

                            @foreach ($CompanyProject as $project)
                                <div class="card card-secondary card-outline">
                                    <div class="card-header">
                                        <h5 class="card-title">{{ $project->company_project_description }}</h5>
                                        <div class="card-tools">
                                            <a href="{{ route('test2', ['id' => $project->company_projects_id]) }}"
                                                class="btn btn-tool">
                                                <i class="fa-solid fa-eye" style="color:rgb(62, 62, 62)"></i>
                                            </a>
                                        </div>
                                    </div>
                                </div>
                            @endforeach


                        </div>
                    </div>
                </div>
                <div class="col-md-3">
                    <div class="card card-row card-primary">
                        <!-- Card header -->
                        <div class="card-header info-box bg-primary">
                            <span class="info-box-icon"><i class="fas fa-file"></i></span>

                            <div class="info-box-content">
                                <span class="info-box-text">Preparadas</span>
                                <span class="info-box-number">4</span>

                                <div class="progress">
                                    <div class="progress-bar" style="width: 75%"></div>
                                </div>
                                <span class="progress-description">
                                    75% adicionadas nos últimos 30
                                </span>
                            </div>
                            <!-- /.info-box-content -->
                        </div>
                        <!-- /.info-box -->
                        <!-- /.Card header-->
                        <div class="card-body">
                            <div class="card card-primary card-outline">
                                <div class="card-header">
                                    <h5 class="card-title">Paragem Cliente 2 OUT2022</h5>
                                    <div class="card-tools">
                                        <a href="#" class="btn btn-tool">
                                            <i class="fas fa-eye"></i>
                                        </a>
                                    </div>
                                </div>
                            </div>
                            <div class="card card-primary card-outline">
                                <div class="card-header">
                                    <h5 class="card-title">Paragem Cliente 3 NOV2022</h5>
                                    <div class="card-tools">
                                        <a href="#" class="btn btn-tool">
                                            <i class="fas fa-eye"></i>
                                        </a>
                                    </div>
                                </div>
                            </div>
                            <div class="card card-primary card-outline">
                                <div class="card-header">
                                    <h5 class="card-title">Paragem Cliente 1 OUT2022</h5>
                                    <div class="card-tools">
                                        <a href="#" class="btn btn-tool">
                                            <i class="fas fa-eye"></i>
                                        </a>
                                    </div>
                                </div>
                            </div>
                            <div class="card card-primary card-outline">
                                <div class="card-header">
                                    <h5 class="card-title">Paragem Cliente 1 SET2022</h5>
                                    <div class="card-tools">
                                        <a href="#" class="btn btn-tool">
                                            <i class="fas fa-eye"></i>
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-md-3">
                    <div class="card card-row card-default">
                        <!-- Card header -->
                        <div class="card-header info-box bg-warning">
                            <span class="info-box-icon"><i class="fas fa-file-alt"></i></span>

                            <div class="info-box-content">
                                <span class="info-box-text">Em execução</span>
                                <span class="info-box-number">2</span>

                                <div class="progress">
                                    <div class="progress-bar" style="width: 100%"></div>
                                </div>
                                <span class="progress-description">
                                    100% em execução à 30 dias
                                </span>
                            </div>
                            <!-- /.info-box-content -->
                        </div>
                        <!-- /.info-box -->
                        <!-- /.Card header-->
                        <div class="card-body">
                            <div class="card card-warning card-outline">
                                <div class="card-header">
                                    <h5 class="card-title">Paragem Cliente 1 JUN2022</h5>
                                    <div class="card-tools">
                                        <a href="#" class="btn btn-tool">
                                            <i class="fas fa-eye"></i>
                                        </a>
                                    </div>
                                </div>
                            </div>
                            <div class="card card-warning card-outline">
                                <div class="card-header">
                                    <h5 class="card-title">Paragem Cliente 2 JUL2022</h5>
                                    <div class="card-tools">
                                        <a href="#" class="btn btn-tool">
                                            <i class="fas fa-eye"></i>
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-md-3">
                    <div class="card card-row card-success">
                        <!-- Card header -->
                        <div class="card-header info-box bg-success">
                            <span class="info-box-icon"><i class="fas fa-check-circle"></i></span>

                            <div class="info-box-content">
                                <span class="info-box-text">Concluídas</span>
                                <span class="info-box-number">3</span>

                                <div class="progress">
                                    <div class="progress-bar" style="width: 100%"></div>
                                </div>
                                <span class="progress-description">
                                    Últimas obras de 2022
                                </span>
                            </div>
                            <!-- /.info-box-content -->
                        </div>
                        <!-- /.info-box -->
                        <!-- /.Card header-->
                        <div class="card-body">
                            <div class="card card-success card-outline">
                                <div class="card-header">
                                    <h5 class="card-title">Paragem Cliente 2 JAN2022</h5>
                                    <div class="card-tools">
                                        <a href="#" class="btn btn-tool">
                                            <i class="fas fa-eye"></i>
                                        </a>
                                    </div>
                                </div>
                            </div>
                            <div class="card card-success card-outline">
                                <div class="card-header">
                                    <h5 class="card-title">Paragem Cliente 1 FEV022</h5>
                                    <div class="card-tools">
                                        <a href="#" class="btn btn-tool">
                                            <i class="fas fa-eye"></i>
                                        </a>
                                    </div>
                                </div>
                            </div>
                            <div class="card card-success card-outline">
                                <div class="card-header">
                                    <h5 class="card-title">Paragem Cliente 2 MAIO2022</h5>
                                    <div class="card-tools">
                                        <a href="#" class="btn btn-tool">
                                            <i class="fas fa-eye"></i>
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        {{-- /.container-fluid --}}
    </section>
    <!-- /.content -->
@endsection