@extends('Templates/templateAdmin')



@section('Main-content')
    <!-- Content Header (Page header) -->
    <section class="content-header">
        <div class="container-fluid">
            <div class="row mb-2">
                <div class="col-sm-6">
                    <h1>{{ $DatasProject->company_project_description }}</h1>
                    <input type="hidden" value="{{ $DatasProject->company_projects_id }}" id="receiveNumberProject">
                </div>
                <div class="col-sm-6">
                    <ol class="breadcrumb float-sm-right">
                        <li class="breadcrumb-item"><a href="{{ route('home') }}">Dashboard</a></li>
                        <li class="breadcrumb-item"><a href="./preparadas.html">Em Execucao</a></li>
                        <li class="breadcrumb-item active">{{ $DatasProject->company_project_description }}</li>
                    </ol>
                </div><!-- /.col -->
            </div>
        </div><!-- /.container-fluid -->
    </section>
    <!-- /.content-header -->

    <!-- Main content -->
    <section class="content">
        <div class="container-fluid">
            <div class="row justify-content-center">
                <div class="col-md-12">

                    <div class="row">
                        <div class="col-sm" id="ViewEquipmentsButton">
                            <a href="#" type="button" class="btn btn-block bg-primary btn-lg"
                                style="margin-bottom: 2%;"> Equipamentos</a>
                        </div>
                        <div class="col-sm" id="ViewTasksButton">
                            <a href="#" type="button" class="btn btn-block bg-primary btn-lg"
                                style="margin-bottom: 2%;">Tarefas</a>
                        </div>
                        <div class="col-sm" id="ViewWorkstationButton">
                            <a href="#" type="button" class="btn btn-block bg-primary btn-lg"
                                style="margin-bottom: 2%;">Postos de Trabalho</a>
                        </div>
                    </div>

                    <div class="card card-primary" id="CardViewEquipments">
                        <div class="card-header">
                            <h3 class="card-title">Equipamentos</h3>
                            <div class="card-tools">
                            </div>
                        </div>

                        <div class="card-body">
                            @livewire('execução.equipments-dashboard', ['datasProject' => $DatasProject], key($DatasProject->company_projects_id))
                        </div>
                    </div>

                    <div class="card card-primary" id="CardViewTasks">
                        <div class="card-header">
                            <h3 class="card-title">Tarefas</h3>
                            <div class="card-tools">
                            </div>
                        </div>

                        <div class="card-body">
                            @livewire('execução.tasks-dashboard', ['datasProject' => $DatasProject], key($DatasProject->company_projects_id))
                        </div>
                    </div>

                    <div class="card card-primary" id="CardViewWorkstations">
                        <div class="card-header">
                            <h3 class="card-title">Postos de Trabalho</h3>
                            <div class="card-tools">
                            </div>
                        </div>

                        <div class="card-body">
                            @livewire('execução.workstation-dashboard', ['datasProject' => $DatasProject], key($DatasProject->company_projects_id))
                        </div>
                    </div>

                </div>
            </div>
        </div>
    </section>
@endsection

@section('scriptsTemplateAdmin')
    <script>
        $(document).ready(function() {
            // Ja vai ser inicializado no card Equipamentos.
            $("#ViewEquipmentsButton").hide();
            $("#CardViewTasks").hide();
            $("#CardViewWorkstations").hide();

            //Visualizacao das Tarefas 
            $("#ViewTasksButton").on('click', function() {

                $("#CardViewTasks").show();
                $("#ViewEquipmentsButton").show();
                $("#ViewWorkstationButton").show();

                $("#CardViewEquipments").hide();
                $("#CardViewWorkstations").hide();
                $("#ViewTasksButton").hide();
            })

            //Visualizacao dos Equipamentos 
            $("#ViewEquipmentsButton").on('click', function() {

                $("#CardViewEquipments").show();
                $("#ViewTasksButton").show();
                $("#ViewWorkstationButton").show();

                $("#CardViewTasks").hide();
                $("#CardViewWorkstations").hide();
                $("#ViewEquipmentsButton").hide();
            })

            //Visualizacao das  Workstatios
            $("#ViewWorkstationButton").on('click', function() {

                $("#CardViewWorkstations").show();
                $("#ViewEquipmentsButton").show();
                $("#ViewTasksButton").show();

                $("#CardViewEquipments").hide();
                $("#CardViewTasks").hide();
                $("#ViewWorkstationButton").hide();
            })
        });
    </script>
@endsection