@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="ViewDetailsButton">
                            <a href="#" type="button" class="btn btn-block bg-primary btn-lg"
                                style="margin-bottom: 2%;">Detalhes</a>
                        </div>

                        <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="CardViewDetails">
                        <div class="card-header">
                            <h3 class="text-center">Detalhes da Obra</h3>
                        </div>
                        <div class="card-body p-0">
                            <table class="table table-striped text-center">
                                <tbody>
                                    <tr>
                                        <td>Descrição da obra:</td>
                                        <td>{{ $DatasProject->company_project_description }}</td>
                                    </tr>
                                    <tr>
                                        <td>N.º obra ISPT:</td>
                                        <td>{{ $DatasProject->project_ispt_number }}</td>
                                    </tr>
                                    <tr>
                                        <td>Resp.ISPT:</td>
                                        <td>{{ $DatasProject->project_ispt_responsible }}</td>
                                    </tr>
                                    <tr>
                                        <td>Empresa :</td>
                                        <td>{{ $receiveCompany->company_name }}</td>
                                    </tr>
                                    <tr>
                                        <td>Resp.Cliente:</td>
                                        {{-- <td>{{ $DatasProject->project_company_responsible }}</td> --}}
                                        <td>Yuri Empresa Teste</td>
                                    </tr>
                                    <tr>
                                        <td>N.º obra Cliente :</td>
                                        <td>{{ $DatasProject->project_company_number }}</td>
                                    </tr>
                                </tbody>
                            </table>

                            <div class="row m-3">
                                <div class="ml-auto">
                                    <button class="btn btn-info" data-toggle="modal" data-target="#exampleModal">Adicionar
                                        equipamentos a Obra</button>
                                </div>
                            </div>

                            <!-- Modal -->
                            <div class="modal fade" id="exampleModal" tabindex="-1" role="dialog"
                                aria-labelledby="exampleModalLabel" aria-hidden="true">
                                <div class="modal-dialog" role="document">
                                    <div class="modal-content">
                                        <div class="modal-header">
                                            <h5 class="modal-title" id="exampleModalLabel">Alterar para planeamento?</h5>
                                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                                <span aria-hidden="true">&times;</span>
                                            </button>
                                        </div>
                                        <div class="modal-body">
                                            Ao optar por adicionar equipamentos, a fase do projeto será modificada para
                                            'Planeamento', impossibilitando o acompanhamento do estado atual dos
                                            equipamentos até que o projeto retorne à fase de 'Execução'.
                                        </div>
                                        <div class="modal-footer">
                                            <button type="button" class="btn btn-secondary"
                                                data-dismiss="modal">Fechar</button>
                                                <form action="{{ route('changeFromExecutionToPlanning', ['projectID' => $DatasProject->company_projects_id]) }}" method="post">
                                                    @csrf
                                                    <button type="submit" class="btn btn-primary">Alterar para Planeamento</button>
                                                </form>
                                        </div>
                                    </div>
                                </div>
                            </div>



                        </div>
                        <!-- /.card-body -->

                    </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">
                            <p>teste</p>
                            @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">
                            <p>teste</p>
                            @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();
            $("#CardViewDetails").hide();

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

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

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

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

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

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

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

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

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


                $("#CardViewDetails").hide();
                $("#CardViewEquipments").hide();
                $("#CardViewTasks").hide();
                $("#ViewWorkstationButton").hide();
            })

            $("#ViewDetailsButton").on('click', function() {

                $("#CardViewDetails").show();

                $("#ViewDetailsButton").hide();
                $("#ViewEquipmentsButton").show();
                $("#ViewTasksButton").show();
                $("#ViewWorkstationButton").show();


                $("#CardViewWorkstations").hide();
                $("#CardViewEquipments").hide();
                $("#CardViewTasks").hide();

            })
        });
    </script>
@endsection