@extends('Templates/templateAdmin')

@section('Main-content')

    @if (session('success'))
        <div class="content">

            <div class="alert alert-success" role="alert" id="alert-message-success" style="transition: opacity 1s;">
                {{ session('success') }}
            </div>
        </div>
        <script>
            setTimeout(function() {
                $('#alert-message-success').fadeOut('slow', function() {
                    $(this).remove();
                });
            }, 5000); // A mensagem desaparecerá após 5 segundos
        </script>
    @endif

    @if (session('danger'))
        <div class="content">
            <div class="alert alert-danger" role="alert" id="alert-message-danger" style="transition: opacity 1s;">
                {{ session('danger') }}
            </div>
        </div>
        <script>
            setTimeout(function() {
                $('#alert-message-danger').fadeOut('slow', function() {
                    $(this).remove();
                });
            }, 5000); // A mensagem desaparecerá após 5 segundos
        </script>
    @endif



    @if (session('dangerLogs') && !empty(session('dangerLogs')))
        <div class="content pt-3">
            <div class="card card-danger collapsed-card">

                <div class="card-header clickable">
                    <h3 class="card-title">Erros do Template</h3>
                    <div class="card-tools">
                        <button type="button" class="btn btn-tool collapse-button" data-card-widget="collapse"><i
                                class="fas fa-plus"></i></button>
                    </div>
                </div>

                <div class="card-body">
                    <div class="row">
                        <div class="col-sm">
                            <div class="card card-danger">

                                <div class="card-header clickable">
                                    <h3 class="card-title">Linhas Ignoradas</h3>
                                    <div class="card-tools">
                                        <button type="button" class="btn btn-tool collapse-button"
                                            data-card-widget="collapse"><i class="fas fa-plus"></i></button>
                                    </div>
                                </div>


                                <div class="card-body" style="padding: 0;margin-bottom: 0%">
                                    <ul class="list-group scrollable-list">
                                        @foreach (session('dangerLogs') as $ignoredLine)
                                            <li class="list-group-item d-flex align-items-center" aria-current="true">
                                                <span class="line-text">Linha: {{ $ignoredLine['line'] }}</span>
                                                <span class="empty-fields"><b> - Campos Vazios:</b>
                                                    {{ implode(', ', $ignoredLine['emptyFields']) }}</span>
                                            </li>
                                        @endforeach
                                    </ul>
                                </div>

                            </div>{{-- ./card card-danger --}}
                        </div>
                    </div>
                </div>

            </div>
        </div>
    @endif


    <input type="hidden" value="{{ $receiveNumberProject->company_projects_id }}" id="receiveNumberProject">

    <section class="content-header">
        <div class="container-fluid">

            <!-- Progressbar -->
            <ul id="progressbar" class="nav nav-pills d-flex flex-sm-row justify-content-center">
                <li class="@if ($step == 2) active @endif "></li>
                {{-- Project details --}}
                <li class="@if ($step == 2) active @endif "></li>
                {{-- Articulated --}}
                <li class="@if ($step == 3) active @endif "></li>
                {{-- Workstation --}}
            </ul>

        </div>
    </section>
    {{-- ./content-header --}}

    <fieldset class="content">
        <div class="container-fluid">

            <div class="card card-primary">
                <div class="card-header">
                    <h3 class="card-title">Articulado</h3>
                </div>
                <!-- ./Card-header -->

                <div class="card-body">

                    {{-- Criar Equipamentos Manualmente --}}
                    <div class="card card-success collapsed-card">

                        <div class="card-header clickable">
                            <h3 class="card-title">Criar Equipamentos Manualmente</h3>
                            <div class="card-tools">
                                <button type="button" class="btn btn-tool collapse-button" data-card-widget="collapse"><i
                                        class="fas fa-plus"></i></button>
                            </div>
                        </div>

                        <!-- /.card-header -->
                        <div class="card-body">
                            <form action="{{ route('test2CreateEquipment') }}" method="POST">
                                @csrf
                                {{-- Vai receber o valor do ID da obra e passar diretamente para o controller, esta em hidden pois não e necessario mostrar seu campo ao utilizador --}}
                                <input type="hidden" name="numberProject" value="{{ $numberProject }}">

                                <div class="row">
                                    <!-- select -->
                                    <div class="form-group col-sm">
                                        <label>Fabrica</label>
                                        <select class="form-control" name="unit_id" id="unit_select" required>
                                            <option value='' hidden>Selecione Fabrica...</option>
                                            <option value="new">Criar Fabrica...</option>
                                            @foreach ($checkUnits as $checkUnit)
                                                <option value="{{ $checkUnit->unit_id }}">
                                                    {{ $checkUnit->unit_name }}
                                                </option>
                                            @endforeach
                                        </select>
                                    </div>

                                    <div class="form-group col-sm" id="new_unit_div">
                                        <label>Nova Fabrica :</label>
                                        <input type="text" id="new_unit_name" class="form-control" name="new_unit_name"
                                            placeholder="Digite o nome da nova Fabrica" required>
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label>Tipo de equipamento</label>
                                    <select class="form-control" name="equipmentTypeId" {{-- equipmentType_id --}}
                                        id="equipmentType_id_list" required>
                                        <option value='' hidden>Selecionar Tipo de equipamento...</option>
                                        @foreach ($typeEquipments as $typeEquipment)
                                            <option value="{{ $typeEquipment->equipment_type_id }}">
                                                {{ $typeEquipment->equipment_type_name }}</option>
                                        @endforeach
                                    </select>
                                </div>

                                <!-- PSV-card -->
                                <div id="psv_card" class="card card-secondary">
                                    <div class="card-header">
                                        <h3 class="card-title">PSV</h3>
                                    </div>
                                    <!-- /.card-header -->
                                    <div class="card-body">

                                        <div class="row">
                                            <div class="form-group col-sm-6">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-tagEquipment">
                                                        <i class="fa-sharp fa-solid fa-tag" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="tag"
                                                            class="form-control card_inputs" id="equipmentTag"
                                                            placeholder="Tag..." aria-label="Tag Equipment"
                                                            aria-describedby="form-tagEquipment" required>
                                                        <label>Tag <span class="required">*</span></label>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="form-group col-sm-6">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-equipmentDescription">
                                                        {{-- <i class="fa fa-id-badge"></i> --}}
                                                        <i class="fa-sharp fa-regular fa-newspaper"
                                                            style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="equipmentDescription"
                                                            class="form-control card_inputs" id="equipmentDescription"
                                                            placeholder="Descrição Equipamento..."
                                                            aria-label="Tag Equipment"
                                                            aria-describedby="form-equipmentDescription" required>
                                                        <label>Descrição Equipamento <span
                                                                class="required">*</span></label>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>

                                        {{-- 3 inputs per line :equipmentSerialNumber, equipmentBrand, equipmentModel  --}}
                                        <div class="row">
                                            <div class="form-group col-sm-4">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-serialNumberEquipment">
                                                        <i class="fa-solid fa-barcode" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="serialNumberEquipment"
                                                            class="form-control card_inputs" id="equipmentSerialNumber"
                                                            placeholder="Número de série"
                                                            aria-label="Serial Number Equipment"
                                                            aria-describedby="form-serialNumberEquipment">
                                                        <label>Número de série </label>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="form-group col-sm-4">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-equipmentBrand">
                                                        <i class="fa-solid fa-object-group" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="equipmentBrand"
                                                            class="form-control card_inputs" id="equipmentBrand"
                                                            placeholder="Marca" aria-label="Serial Number Equipment"
                                                            aria-describedby="form-equipmentBrand">
                                                        <label>Marca</label>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="form-group col-sm-4">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-equipmentModel">
                                                        <i class="fa-solid fa-cubes" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="equipmentModel"
                                                            class="form-control card_inputs" id="equipmentModel"
                                                            placeholder="Modelo" aria-label="Serial Number Equipment"
                                                            aria-describedby="form-equipmentModel">
                                                        <label>Modelo</label>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        {{-- ./row --}}

                                        {{-- 3 inputs per line :equipmentDimension, equipmentRating, equipmentDimcerta  --}}
                                        <div class="row">
                                            <div class="form-group col-sm-4">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-dimension">
                                                        <i class="fa-solid fa-ruler " style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="dimension"
                                                            class="form-control card_inputs" id="dimension"
                                                            placeholder="Dimensão" aria-label="Serial Number Equipment"
                                                            aria-describedby="form-dimension">
                                                        <label>Dimensão</label>
                                                    </div>
                                                </div>
                                            </div>

                                            <div class="form-group col-sm-4">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-rating">
                                                        <i class="fa-solid fa-ranking-star" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="rating"
                                                            class="form-control card_inputs" id="rating"
                                                            placeholder="Rating..." aria-label="Serial Number Equipment"
                                                            aria-describedby="form-rating">
                                                        <label>Rating</label>
                                                    </div>
                                                </div>
                                            </div>

                                            <div class="form-group col-sm-4">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-dim_certa">
                                                        <i class="fa-sharp fa-regular fa-square-poll-vertical"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="dim_certa"
                                                            class="form-control card_inputs" id="dim_certa"
                                                            placeholder="Dim certa..."
                                                            aria-label="Serial Number Equipment"
                                                            aria-describedby="form-dim_certa">
                                                        <label>Dim certa</label>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        {{-- ./row --}}

                                        {{-- 3 inputs per line : main_equipment, p&id, sap_number --}}
                                        <div class="row">
                                            <div class="form-group col-sm-4">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-main_equipment">
                                                        <i class="fa-solid fa-cubes" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="main_equipment"
                                                            class="form-control card_inputs" id="main_equipment"
                                                            placeholder="Main Equipment" aria-label="Main Equipment"
                                                            aria-describedby="form-main_equipment">
                                                        <label>Main Equipment</label>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="form-group col-sm-4">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-p&id">
                                                        <i class="fa-solid fa-cubes" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="p&id"
                                                            class="form-control card_inputs" id="p&id"
                                                            placeholder="P&ID" aria-label="P & id"
                                                            aria-describedby="form-p&id">
                                                        <label>P&ID</label>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="form-group col-sm-4">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-sap_number">
                                                        <i class="fa-solid fa-cubes" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="sap_number"
                                                            class="form-control card_inputs" id="sap_number"
                                                            placeholder="Nº SAP" aria-label="Numero Sap"
                                                            aria-describedby="form-sap_number">
                                                        <label>Nº SAP</label>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        {{-- ./row --}}

                                        {{-- 3 inputs per line :SP_(Bar)_Cold, Back_Presure_(Bar), material  --}}
                                        <div class="row">
                                            <div class="form-group col-sm-4">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-SP_(Bar)_Cold">
                                                        <i class="fa-solid fa-cubes" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="SP_(Bar)_Cold"
                                                            class="form-control card_inputs" id="SP_(Bar)_Cold"
                                                            placeholder="SP (Bar) Cold" aria-label="SP (Bar) Cold"
                                                            aria-describedby="form-SP_(Bar)_Cold">
                                                        <label>SP (Bar) Cold</label>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="form-group col-sm-4">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-Back_Presure_(Bar)">
                                                        <i class="fa-solid fa-cubes" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="Back_Presure_(Bar)"
                                                            class="form-control card_inputs" id="Back_Presure_(Bar)"
                                                            placeholder="Back Presure (Bar)"
                                                            aria-label="Back Presure (Bar)"
                                                            aria-describedby="form-Back_Presure_(Bar)">
                                                        <label>Back Presure (Bar)</label>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="form-group col-sm-4">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-material">
                                                        <i class="fa-solid fa-cubes" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="material"
                                                            class="form-control card_inputs" id="material"
                                                            placeholder="Material" aria-label="Material"
                                                            aria-describedby="form-material">
                                                        <label>Material</label>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        {{-- ./row --}}

                                        {{-- 2 inputs per line :  --}}
                                        <div class="row">
                                            <div class="form-group col-sm-6">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-manufacturer">
                                                        <i class="fa-solid fa-cubes" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="manufacturer"
                                                            class="form-control card_inputs" id="manufacturer"
                                                            placeholder="Fabricante" aria-label="Fabricante"
                                                            aria-describedby="form-manufacturer">
                                                        <label>Fabricante</label>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="form-group col-sm-6">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-isolation">
                                                        <i class="fa-solid fa-cubes" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="isolation"
                                                            class="form-control card_inputs" id="isolation"
                                                            placeholder="Isolamento" aria-label="Isolamento"
                                                            aria-describedby="form-isolation">
                                                        <label>Isolamento</label>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        {{-- ./row --}}

                                        {{-- 2 Selects per line :psv_scaffold, psv_crane --}}
                                        <div class="row">
                                            <div class="form-group col-sm-6">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text">
                                                        <i class="fa-solid fa-cubes" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <select class="form-control card_inputs" name="scaffold">
                                                            <option value="Sim">Sim</option>
                                                            <option value="Nao" selected>Nao</option>
                                                        </select>
                                                        <label>Andaime?</label>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="form-group col-sm-6">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text">
                                                        <i class="fa-solid fa-cubes" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <select class="form-control card_inputs" name="crane">
                                                            <option value="Sim">Sim</option>
                                                            <option value="Nao" selected>Nao</option>
                                                        </select>
                                                        <label>Grua?</label>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        {{-- ./row --}}
                                    </div>
                                    <!-- /.card-body -->
                                </div>
                                {{-- ./psv_card --}}

                                <!-- ISV-card -->
                                <div id="isv_card" class="card card-primary">
                                    <div class="card-header">
                                        <h3 class="card-title">ISV</h3>
                                    </div>
                                    <!-- /.card-header -->
                                    <div class="card-body">
                                        {{-- 2 inputs per line :equipmentTag ,equipmentDescription --}}
                                        <div class="row">
                                            <div class="form-group col-sm-6">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-tagEquipment">
                                                        <i class="fa-sharp fa-solid fa-tag" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="tag"
                                                            class="form-control card_inputs" id="equipmentTag"
                                                            placeholder="Tag..." aria-label="Tag Equipment"
                                                            aria-describedby="form-tagEquipment" required>
                                                        <label>Tag <span class="required">*</span></label>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="form-group col-sm-6">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-equipmentDescription">
                                                        <i class="fa-sharp fa-regular fa-newspaper"
                                                            style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="equipmentDescription"
                                                            class="form-control card_inputs" id="equipmentDescription"
                                                            placeholder="Descrição Equipamento..."
                                                            aria-label="Tag Equipment"
                                                            aria-describedby="form-equipmentDescription" required>
                                                        <label>Descrição Equipamento <span
                                                                class="required">*</span></label>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        {{-- ./row --}}

                                        {{-- 3 inputs per line :serialNumberEquipment, equipmentBrand, equipmentModel  --}}
                                        <div class="row">
                                            <div class="form-group col-sm-4">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-serialNumberEquipment">
                                                        <i class="fa-solid fa-barcode" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="serialNumberEquipment"
                                                            class="form-control card_inputs" id="equipmentSerialNumber"
                                                            placeholder="Número de série"
                                                            aria-label="Serial Number Equipment"
                                                            aria-describedby="form-serialNumberEquipment">
                                                        <label>Número de série </label>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="form-group col-sm-4">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-equipmentBrand">
                                                        <i class="fa-solid fa-object-group" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="equipmentBrand"
                                                            class="form-control card_inputs" id="equipmentBrand"
                                                            placeholder="Marca" aria-label="Marca Equipamento"
                                                            aria-describedby="form-equipmentBrand">
                                                        <label>Marca</label>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="form-group col-sm-4">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-equipmentModel">
                                                        <i class="fa-solid fa-cubes" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="equipmentModel"
                                                            class="form-control card_inputs" id="equipmentModel"
                                                            placeholder="Modelo" aria-label="Modelo Equipamento"
                                                            aria-describedby="form-equipmentModel">
                                                        <label>Modelo</label>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        {{-- ./row --}}

                                        {{-- 3 inputs per line :equipmentDimension, equipmentRating, equipmentDimcerta  --}}
                                        <div class="row">
                                            <div class="form-group col-sm-4">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-dimension">
                                                        <i class="fa-solid fa-ruler " style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="dimension"
                                                            class="form-control card_inputs" id="dimension"
                                                            placeholder="Dimensão" aria-label="Dimensao Equipamento"
                                                            aria-describedby="form-dimension">
                                                        <label>Dimensão</label>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="form-group col-sm-4">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-rating">
                                                        <i class="fa-solid fa-ranking-star" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="rating"
                                                            class="form-control card_inputs" id="rating"
                                                            placeholder="Rating..." aria-label="Rating Equipamento"
                                                            aria-describedby="form-rating">
                                                        <label>Rating</label>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="form-group col-sm-4">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-dim_certa">
                                                        <i class="fa-sharp fa-regular fa-square-poll-vertical"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="dim_certa"
                                                            class="form-control card_inputs" id="dim_certa"
                                                            placeholder="Dim certa..." aria-label="Dim certa Equipamento"
                                                            aria-describedby="form-dim_certa">
                                                        <label>Dim certa</label>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        {{-- ./row --}}

                                        {{-- 3 Inputs per line :main_equipment ,p&id ,sap_number --}}
                                        <div class="row">
                                            <div class="form-group col-sm-4">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-main_equipment">
                                                        <i class="fa-solid fa-cubes" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="main_equipment"
                                                            class="form-control card_inputs" id="main_equipment"
                                                            placeholder="Main Equipment" aria-label="Main Equipment"
                                                            aria-describedby="form-main_equipment">
                                                        <label>Main Equipment</label>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="form-group col-sm-4">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-P_IidEquipment">
                                                        <i class="fa-solid fa-cubes" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="p&id"
                                                            class="form-control card_inputs" id="P_idEquipment"
                                                            placeholder="P&ID" aria-label="P&ID"
                                                            aria-describedby="form-P_IidEquipment">
                                                        <label>P&ID</label>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="form-group col-sm-4">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-NumberSapEquipment">
                                                        <i class="fa-solid fa-cubes" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="sap_number"
                                                            class="form-control card_inputs" id="NumberSapEquipment"
                                                            placeholder="Nº SAP" aria-label="Numero SAP Equipamento"
                                                            aria-describedby="form-NumberSapEquipment">
                                                        <label>Nº SAP</label>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        {{-- ./row --}}

                                        {{-- 3 Inputs per line :material ,manufacturerEquipment ,isolationEquipment    --}}
                                        <div class="row">
                                            <div class="form-group col-sm-4">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-materialEquipment">
                                                        <i class="fa-solid fa-cubes" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="material"
                                                            class="form-control card_inputs" id="materialEquipment"
                                                            placeholder="Material" aria-label="Material Equipamento"
                                                            aria-describedby="form-materialEquipment">
                                                        <label>Material</label>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="form-group col-sm-4">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-manufacturerEquipment">
                                                        <i class="fa-solid fa-cubes" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="manufacturer"
                                                            class="form-control card_inputs" id="manufacturerEquipment"
                                                            placeholder="Fabricante" aria-label="Fabricante Equipamento"
                                                            aria-describedby="form-manufacturerEquipment">
                                                        <label>Fabricante</label>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="form-group col-sm-4">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-isolationEquipment">
                                                        <i class="fa-solid fa-cubes" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="isolation"
                                                            class="form-control card_inputs" id="isolationEquipment"
                                                            placeholder="Isolamento" aria-label="Isolamento Equipamento"
                                                            aria-describedby="form-isolationEquipment">
                                                        <label>Isolamento</label>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        {{-- ./row --}}

                                        {{-- 2 Selects per line :psv_scaffold, psv_crane --}}
                                        <div class="row">
                                            <div class="form-group col-sm-6">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text">
                                                        <i class="fa-solid fa-cubes" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <select class="form-control card_inputs" name="scaffold">
                                                            <option value="Sim">Sim</option>
                                                            <option value="Nao" selected>Nao</option>
                                                        </select>
                                                        <label>Andaime?</label>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="form-group col-sm-6">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text">
                                                        <i class="fa-solid fa-cubes" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <select class="form-control card_inputs" name="crane">
                                                            <option value="Sim">Sim</option>
                                                            <option value="Nao" selected>Nao</option>
                                                        </select>
                                                        <label>Grua?</label>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        {{-- ./row --}}
                                    </div>
                                    <!-- /.card-body -->
                                </div>
                                <!-- ./ISV-card -->

                                <!-- CV-card -->
                                <div id="cv_card" class="card card-info">

                                    <div class="card-header">
                                        <h3 class="card-title">CV</h3>
                                    </div>
                                    <!-- /.card-header -->
                                    <div class="card-body">
                                        {{-- 2 inputs per line :equipmentTag ,equipmentDescription --}}
                                        <div class="row">
                                            <div class="form-group col-sm-6">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-tagEquipment">
                                                        <i class="fa-sharp fa-solid fa-tag" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="tag"
                                                            class="form-control card_inputs" id="equipmentTag"
                                                            placeholder="Tag..." aria-label="Tag Equipment"
                                                            aria-describedby="form-tagEquipment" required>
                                                        <label>Tag <span class="required">*</span></label>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="form-group col-sm-6">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-equipmentDescription">
                                                        <i class="fa-sharp fa-regular fa-newspaper"
                                                            style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="equipmentDescription"
                                                            class="form-control card_inputs" id="equipmentDescription"
                                                            placeholder="Descrição Equipamento..."
                                                            aria-label="equipmentDescription"
                                                            aria-describedby="form-equipmentDescription" required>
                                                        <label>Descrição Equipamento <span
                                                                class="required">*</span></label>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        {{-- ./row --}}

                                        {{-- 3 inputs per line :serialNumberEquipment, equipmentBrand, equipmentModel  --}}
                                        <div class="row">
                                            <div class="form-group col-sm-4">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-serialNumberEquipment">
                                                        <i class="fa-solid fa-barcode" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="serialNumberEquipment"
                                                            class="form-control card_inputs" id="equipmentSerialNumber"
                                                            placeholder="Número de série"
                                                            aria-label="Serial Number Equipment"
                                                            aria-describedby="form-serialNumberEquipment">
                                                        <label>Número de série </label>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="form-group col-sm-4">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-equipmentBrand">
                                                        <i class="fa-solid fa-object-group" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="equipmentBrand"
                                                            class="form-control card_inputs" id="equipmentBrand"
                                                            placeholder="Modelo" aria-label="Marca Equipamento"
                                                            aria-describedby="form-equipmentBrand">
                                                        <label>Marca</label>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="form-group col-sm-4">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-equipmentModel">
                                                        <i class="fa-solid fa-cubes" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="equipmentModel"
                                                            class="form-control card_inputs" id="equipmentModel"
                                                            placeholder="Modelo" aria-label="Modelo Equipamento"
                                                            aria-describedby="form-equipmentModel">
                                                        <label>Modelo</label>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        {{-- ./row --}}

                                        {{-- 3 inputs per line :equipmentDimension, equipmentRating, equipmentDimcerta  --}}
                                        <div class="row">
                                            <div class="form-group col-sm-4">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-dimension">
                                                        <i class="fa-solid fa-ruler " style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="dimension"
                                                            class="form-control card_inputs" id="dimension"
                                                            placeholder="Dimensão" aria-label="Dimensao Equipamento"
                                                            aria-describedby="form-dimension">
                                                        <label>Dimensão</label>
                                                    </div>
                                                </div>
                                            </div>

                                            <div class="form-group col-sm-4">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-rating">
                                                        <i class="fa-solid fa-ranking-star" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="rating"
                                                            class="form-control card_inputs" id="rating"
                                                            placeholder="Rating..." aria-label="Rating Equipamento"
                                                            aria-describedby="form-rating">
                                                        <label>Rating</label>
                                                    </div>
                                                </div>
                                            </div>

                                            <div class="form-group col-sm-4">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-dim_certa">
                                                        <i class="fa-sharp fa-regular fa-square-poll-vertical"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="dim_certa"
                                                            class="form-control card_inputs" id="dim_certa"
                                                            placeholder="Dim certa..." aria-label="Dim certa Equipamento"
                                                            aria-describedby="form-dim_certa">
                                                        <label>Dim certa</label>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        {{-- ./row --}}

                                        {{-- 3 Inputs per line :main_equipment ,P_idEquipment ,NumberSapEquipment --}}
                                        <div class="row">
                                            <div class="form-group col-sm-4">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-main_equipment">
                                                        <i class="fa-solid fa-cubes" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="main_equipment"
                                                            class="form-control card_inputs" id="main_equipment"
                                                            placeholder="Main Equipment" aria-label="Main Equipment"
                                                            aria-describedby="form-main_equipment">
                                                        <label>Main Equipment</label>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="form-group col-sm-4">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-P_IidEquipment">
                                                        <i class="fa-solid fa-cubes" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="p&id"
                                                            class="form-control card_inputs" id="p&id"
                                                            placeholder="P&ID" aria-label="P&ID"
                                                            aria-describedby="form-P_IidEquipment">
                                                        <label>P&ID</label>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="form-group col-sm-4">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-NumberSapEquipment">
                                                        <i class="fa-solid fa-cubes" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="sap_number"
                                                            class="form-control card_inputs" id="sap_number"
                                                            placeholder="Nº SAP" aria-label="Numero SAP Equipamento"
                                                            aria-describedby="form-NumberSapEquipment">
                                                        <label>Nº SAP</label>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        {{-- ./row --}}

                                        {{-- 3 Inputs per line :materialEquipment ,manufacturerEquipment ,isolationEquipment    --}}
                                        <div class="row">
                                            <div class="form-group col-sm-4">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-materialEquipment">
                                                        <i class="fa-solid fa-cubes" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="material"
                                                            class="form-control card_inputs" id="material"
                                                            placeholder="Material" aria-label="Material Equipamento"
                                                            aria-describedby="form-materialEquipment">
                                                        <label>Material</label>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="form-group col-sm-4">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-manufacturerEquipment">
                                                        <i class="fa-solid fa-cubes" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="manufacturer"
                                                            class="form-control card_inputs" id="manufacturerEquipment"
                                                            placeholder="Fabricante" aria-label="Fabricante Equipamento"
                                                            aria-describedby="form-manufacturerEquipment">
                                                        <label>Fabricante</label>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="form-group col-sm-4">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-isolationEquipment">
                                                        <i class="fa-solid fa-cubes" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="isolation"
                                                            class="form-control card_inputs" id="isolation"
                                                            placeholder="Isolamento" aria-label="Isolamento Equipamento"
                                                            aria-describedby="form-isolationEquipment">
                                                        <label>Isolamento</label>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        {{-- ./row --}}

                                        {{-- 3 Inputs per line : actuatorManufacturer,   --}}
                                        <div class="row">
                                            <div class="form-group col-sm-4">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-actuatorManufacturer">
                                                        <i class="fa-solid fa-cubes" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="actuatorManufacturer"
                                                            class="form-control card_inputs" id="actuatorManufacturer"
                                                            placeholder="Fabricante do atuador"
                                                            aria-label="Fabricante do Atuador"
                                                            aria-describedby="form-actuatorManufacturer">
                                                        <label>Fabricante do atuador</label>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="form-group col-sm-4">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-ActuatorModel">
                                                        <i class="fa-solid fa-cubes" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="ActuatorModel"
                                                            class="form-control card_inputs" id="ActuatorModel"
                                                            placeholder="Modelo do atuador" aria-label="Modelo do atuador"
                                                            aria-describedby="form-ActuatorModel">
                                                        <label>Modelo do atuador</label>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="form-group col-sm-4">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-actuatorSerialNumber">
                                                        <i class="fa-solid fa-cubes" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="actuatorSerialNumber"
                                                            class="form-control card_inputs" id="actuatorSerialNumber"
                                                            placeholder="N.º de série do atuador"
                                                            aria-label="Numero de série do atuado"
                                                            aria-describedby="form-actuatorSerialNumber">
                                                        <label>N.º de série do atuador</label>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        {{-- ./Row --}}

                                        {{-- 2 Inputs per line : actuatorManufacturer,   --}}
                                        <div class="row">
                                            <div class="form-group col-sm-6">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-PositionerManufacturer">
                                                        <i class="fa-solid fa-cubes" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="PositionerManufacturer"
                                                            class="form-control card_inputs" id="PositionerManufacturer"
                                                            placeholder="Fabricante do posicionador"
                                                            aria-label="Fabricante do posicionador"
                                                            aria-describedby="form-PositionerManufacturer">
                                                        <label>Fabricante do posicionador</label>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="form-group col-sm-6">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="form-PositionerSerialNumber">
                                                        <i class="fa-solid fa-cubes" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <input type="text" name="PositionerSerialNumber"
                                                            class="form-control card_inputs" id="PositionerSerialNumber"
                                                            placeholder="N.º de série do posicionador"
                                                            aria-label="Numero de série do posicionador"
                                                            aria-describedby="form-PositionerSerialNumber">
                                                        <label>N.º de série do posicionador</label>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        {{-- ./row --}}

                                        {{-- 2 Selects per line :psv_scaffold, psv_crane --}}
                                        <div class="row">
                                            <div class="form-group col-sm-6">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text">
                                                        <i class="fa-solid fa-cubes" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <select class="form-control card_inputs" name="scaffold">
                                                            <option value="Sim">Sim</option>
                                                            <option value="Nao" selected>Nao</option>
                                                        </select>
                                                        <label>Andaime?</label>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="form-group col-sm-6">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text">
                                                        <i class="fa-solid fa-cubes" style="color: #00B0EA;"></i>
                                                    </span>
                                                    <div class="has-float-label">
                                                        <select class="form-control card_inputs" name="crane">
                                                            <option value="Sim">Sim</option>
                                                            <option value="Nao" selected>Nao</option>
                                                        </select>
                                                        <label>Grua?</label>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        {{-- ./row --}}
                                    </div>
                                    <!-- /.card-body -->
                                </div>
                                <!-- ./CV-card -->

                                <div class="form-group">
                                    <label>Âmbitos</label>
                                    <select class="form-control" name="EquipmentAmbit" id="AmbitsEquipments_list"
                                        required>
                                        <option value='' hidden>Selecionar Âmbitos...</option>
                                    </select>
                                </div>


                                <div class="form-group col-sm-4">
                                    <button type="submit" class="btn btn-primary">Guardar</button>
                                </div>
                            </form>
                        </div>

                    </div>

                    {{-- Selecionar Equipamentos --}}
                    <div class="card card-primary collapsed-card">

                        <div class="card-header clickable">
                            <h3 class="card-title">Selecionar Equipamentos</h3>
                            <div class="card-tools">
                                <button type="button" class="btn btn-tool collapse-button"
                                    data-card-widget="collapse"><i class="fas fa-plus"></i></button>
                            </div>
                        </div>

                        <div class="card-body">

                            <div class="table-responsive">
                                <div class="row text-center">

                                    <div class="form-group col-sm">
                                        <label>Fabrica</label>
                                        <select class="form-control" name="unit_id" id="unit_select2">
                                            {{-- Antes era : 'unit_select' (caso de algum erro) --}}
                                            <option value='#' hidden>Selecione Fabrica...</option>
                                            @foreach ($checkUnits as $checkUnit)
                                                <option value="{{ $checkUnit->unit_id }}">
                                                    {{ $checkUnit->unit_name }}
                                                </option>
                                            @endforeach
                                        </select>
                                    </div>

                                    <div class="form-group col-sm">
                                        <label>Tipo de equipamento</label>
                                        <select class="form-control" name="equipmentType_id" id="equipmentType_id_list">
                                            <option value='#' hidden>Selecionar Tipo de equipamento...
                                            </option>

                                            @foreach ($typeEquipments as $typeEquipment)
                                                <option value="{{ $typeEquipment->equipment_type_id }}">
                                                    {{ $typeEquipment->equipment_type_name }}</option>
                                            @endforeach
                                        </select>
                                    </div>

                                    {{-- <div class="form-group col-sm-4">
                                        <label for="">Pesquisa</label>
                                        <input class="form-control" type="text">
                                    </div> --}}

                                </div>
                                <table id="tableSelectEquipements" class="table table-bordered table-striped">
                                    <thead>
                                        <tr>
                                            <th>Tag</th>
                                            <th>Descrição Equipamento</th>
                                            <th>Tipo de Equipamento</th>
                                            <th>Fabrica</th>
                                            <th>Selecionar Equipamentos</th>
                                        </tr>
                                    </thead>
                                </table>
                            </div>
                            {{-- ./table-responsive --}}
                            <br>
                            <div class="row">
                                <div class="col-sm-6">
                                    <input type="checkbox" id="select-all"> Selecionar todos
                                </div>
                                <div class="col-sm-6">
                                    <a type="button" id="addingEquipmentToProject" class="btn btn-success float-right"
                                        href="#" data-toggle="modal" data-target="#modal-addingEquipmentToProject">
                                        Adicionar
                                    </a>
                                </div>
                            </div>
                        </div>
                    </div>

                    {{-- Importar Formulário --}}
                    <form action="{{ route('processStep2') }}" method="post" enctype="multipart/form-data">

                        @csrf
                        <input type="hidden" name="numberProject" value="{{ $numberProject }}">
                        <div class="row">
                            <div class="col-sm-4 d-flex justify-content-center">
                                <a href="{{ route('download', ['numberProject' => $numberProject]) }}"
                                    class="btn btn-info">Baixar Template</a>
                                {{-- <a id="btn-download-template" href="{{ route('download1',['numberProject'=>$numberProject]) }}" class="btn btn-info">Baixar Template</a> --}}
                            </div>

                            <div class="form-group col-sm-4">
                                <div class="input-group">
                                    <span class="input-group-text border rounded-left" id=""
                                        style="border-right: none;">
                                        <i class="fa-solid fa-file-arrow-up" style="color: #00B0EA;"></i>
                                    </span>
                                    <div class="custom-file border rounded-right" style="border-left: none;">
                                        <input type="file" class="custom-file-input" id="exampleInputFile"
                                            name="documento" accept=".xlsx, .xls">
                                        <label class="custom-file-label" for="exampleInputFile">Importar
                                            Articulado</label>
                                    </div>
                                </div>
                            </div>
                            <div class="col-sm-4 d-flex justify-content-end">
                                <button type="submit" class="btn btn-primary">Enviar</button>
                            </div>
                        </div>

                        {{-- ./row --}}
                    </form>

                    {{-- Pendente --}}
                    <div class="row">
                        <div class="form-group col-sm-4">
                            <a href='#' data-toggle='modal' data-target='#modal-pedingEquipments'>
                                <br>
                                <button class="btn btn-danger">
                                    Pendentes :
                                    @if (isset($pendingEquipments))
                                        ({{ count($pendingEquipments) }})
                                    @endif
                                </button>
                            </a>
                        </div>
                    </div>


                    <div class="row text-center">

                        <div class="col-sm" id="card-receiveUnitsClientRelated">
                            <div class="form-group">
                                <label>Fábricas </label>

                                <select class="form-control" id="receiveUnitsClientRelated1"
                                    name="receiveUnitsClientRelated">
                                    <option value='#' selected>Mostrar Todos</option>
                                    @foreach ($checkUnits as $checkUnit)
                                        <option value="{{ $checkUnit->unit_id }}">
                                            {{ $checkUnit->unit_name }}
                                        </option>
                                    @endforeach
                                </select>

                            </div>
                        </div>

                        <div class="form-group col-sm">
                            <label>Tipo de Equipamento </label>
                            <select id="tipo_valvulasList" name="equipmentTypeId" class="form-control">
                                <option value='#' selected>Mostrar Todos</option>
                                @foreach ($typeEquipments as $typeEquipment)
                                    <option value="{{ $typeEquipment->equipment_type_id }}">
                                        {{ $typeEquipment->equipment_type_name }}</option>
                                @endforeach
                            </select>
                        </div>

                    </div>
                    <!-- row text-center -->

                    <table id="showProjectEquipment" class="table table-bordered table-striped">
                        <thead>
                            <tr>
                                <th>ID</th>
                                <th>Tag</th>
                                <th>Fabrica</th>
                                <th>Tipo</th>
                                <th>Ações</th>
                            </tr>
                        </thead>
                    </table>





                    <div class="card-footer">
                        <div class="float-right">
                            {{-- <button type="submit" class="btn btn-primary">Guardar</button> --}}
                        </div>
                    </div>

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

            </div>
            <!-- ./Card card-Primary  -->

            <a style="margin: 10px" href="{{ route('test1', ['id' => $numberProject]) }}"
                class="btn btn-primary  float-left">Anterior</a>
            <a style="margin: 10px" href="{{ route('test3', ['id' => $numberProject]) }}"
                class="btn btn-primary  float-right">Seguinte</a>

        </div>
        {{-- ./container-fluid --}}

    </fieldset>
    {{-- ./content --}}


    @foreach ($listEquipmentsProjects as $equipment)
        <div class="modal fade" id="modal-confirmDeleteEquipmentInProject-{{ $equipment->equipment_id }}">
            <div class="modal-dialog">
                <!-- Conteúdo da modal -->
                <div class="modal-content">
                    <div class="modal-header bg-primary">
                        <h4 class="modal-title">Apagar Equipamento</h4>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">x</span>
                        </button>
                    </div>
                    <div class="modal-body">
                        <form action="{{ route('deleteEquipmentInProject') }}" method="post">
                            @csrf
                            Tem certeza de que deseja apagar o equipamento : {{ $equipment->equipment_tag }}?
                            <br><br>
                            <input type="hidden" name="equipmentId" value="{{ $equipment->equipment_id }}">
                            <select class="form-control" name="deleteEquipmentProject" id="">
                                <option value="complete">Apagar Por Completo</option>
                                <option value="onlyProject">Apagar da Obra</option>
                            </select>

                            <div class="modal-footer justify-content-between">
                                <button type="button" class="btn btn-default" data-dismiss="modal">Fechar</button>
                                <button type="submit" class="btn btn-success">Apagar</button>
                            </div>

                        </form>

                    </div>
                </div>
            </div>
        </div>

        <div class="modal fade" id="modal-changeAmbitEquipment-{{ $equipment->equipment_id }}">
            <div class="modal-dialog">
                <!-- Conteúdo da modal -->
                <div class="modal-content">
                    <div class="modal-header bg-primary">
                        <h4 class="modal-title">Trocar o Ambito, Equipamento : {{ $equipment->equipment_id }} </h4>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">x</span>
                        </button>
                    </div>
                    <div class="modal-body">
                        <form action="{{route('changeAmbitEquipment')}}" method="post">
                            @csrf
                            <p>Seleciona o ambito para qual deseja ser trocado.</p>
                            <input type="hidden" class="equipmentType_id"
                                value="{{ $equipment->equipment_type_id }}">
                            <input type="hidden" name="equipmentID" value="{{ $equipment->equipment_id  }}">
                            <select class="form-control ambitsEquipments_list" name="receveAmbit" id="receveAmbit">
                            </select>
                            <br>
                            <button data-dismiss="modal" class="btn btn-danger float-left ">Sair</button>
                            <button class="btn btn-primary  float-right" type="submit">Trocar</button>
                           

                        </form>


                    </div>
                </div>
            </div>
        </div>
    @endforeach

    <div class="modal fade" id="modal-addingEquipmentToProject">
        <div class="modal-dialog modal-xl">
            <div class="modal-content">
                <div class="modal-body">
                    <div class="table-responsive">

                    </div>
                </div>
            </div>
        </div>
    </div>


    {{-- modal-pedingEquipments --}}
    <div class="modal fade" id="modal-pedingEquipments">
        <div class="modal-dialog modal-xl">
            <div class="modal-content">

                <!--Codigo Novo -->
                <fieldset class="content">
                    <div class="container-fluid">
                        <h2 class="text-center">Equipamentos Pendentes de Criacao:</h2>
                        @isset($pendingEquipments)
                            <ul class="list-group scrollable-list-xl">
                                @foreach ($pendingEquipments as $pendingEquipment)
                                    <li class="list-group-item align-items-center" aria-current="true">
                                        <div class="card card-primary collapsed-card" style="padding: 0;margin:0;">
                                            <div class="card-header clickable">
                                                <h3 class="card-title">Equipamento :
                                                    {{ $pendingEquipment->pending_equipment_tag }}</h3>
                                                <div class="card-tools">
                                                    <button type="button" class="btn btn-tool collapse-button"
                                                        data-card-widget="collapse"><i class="fas fa-plus"></i></button>
                                                </div>
                                            </div>

                                            <div class="card-body">
                                                <div class="row">
                                                    <div class="col-sm-8">
                                                        <ul>
                                                            <li><b>Equipamento pendente (Tag): </b>
                                                                {{ $pendingEquipment->pending_equipment_tag }}</li>
                                                            <li><b>Equipamento pendente (Descrição):
                                                                </b>{{ $pendingEquipment->pending_equipment_description }}</li>
                                                            @if (isset($groupedArrayForPendingEquipments) && !empty($groupedArrayForPendingEquipments))
                                                                @foreach ($groupedArrayForPendingEquipments[1][1] as $equipmentLog)
                                                                    @if ($equipmentLog['pendingEquipmentId'] == $pendingEquipment->pending_equipment_id)
                                                                        <li> <b>Equipamento copiado de Execel:</b>
                                                                            {{ $groupedArrayForPendingEquipments[0] }} -
                                                                            {{ $groupedArrayForPendingEquipments[1][0] }}</li>
                                                                        <li><b>Linha de
                                                                                criação:{{ $equipmentLog['rowExecel'] }}</b>
                                                                        </li>
                                                                        @if ($equipmentLog['foundInExcel'])
                                                                            <li> <b>Linha de cópia:
                                                                                    {{ $equipmentLog['rowExcelDuplicated'] ?? 'Não duplicado' }}
                                                                                </b> </li>
                                                                        @endif
                                                                    @endif
                                                                @endforeach
                                                            @else
                                                                <li>Sem dados Disponiveis sobre sua criacao!!!</li>
                                                            @endif
                                                        </ul>

                                                    </div>
                                                    <div class="col-sm-4">
                                                        <ul class="text-center d-flex justify-content-around">
                                                            <a href="#" data-toggle="modal"
                                                                data-target="#modal-PendingEquipmentCreate-{{ $pendingEquipment->pending_equipment_id }}">
                                                                <i class="fa-solid fa-eye text-secondary"></i>
                                                            </a>
                                                            <a href="#" data-toggle="modal"
                                                                data-target="#modal-PendingEquipmentRemove-{{ $pendingEquipment->pending_equipment_id }}">
                                                                <i class="fa-solid fa-trash-alt text-danger"></i>
                                                            </a>
                                                        </ul>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </li>
                                @endforeach
                            </ul>
                        @else
                            <p colspan="9" class="text-center">Sem dados existentes !!!</p>
                        @endisset
                        <footer class="m-3">
                            <button class="btn btn-danger" data-toggle="modal"
                                data-target="#modal-confirmToExcludeAllPententEquipment">
                                Excluir Todos
                            </button>
                            <button data-dismiss="modal" class="btn btn-primary float-right mb-3">Sair</button>
                        </footer>
                    </div>
                </fieldset>

            </div>
            {{-- ./modal-content --}}
        </div>
    </div>
    {{-- ./modal-pedingEquipments --}}

    @if (isset($pendingEquipments))
        <!-- modal- confirmToExcludeAllPententEquipment  -->
        <div class="modal fade" id="modal-confirmToExcludeAllPententEquipment">
            <div class="modal-dialog">
                <div class="modal-content">

                    <div class="card card-primary" style="padding: 0;margin:0;">
                        <div class="card-header ">
                            <h3 class="card-title">Confirmação de Exclusão Total</h3>
                        </div>

                        <div class="card-body">
                            <p>"Tem a certeza de que pretende eliminar todos os equipamentos pendentes desta obra? A ação é
                                irreversível."</p>
                            <form action="{{ route('deletePendingEquipments') }}" method="POST">
                                @csrf <!-- CSRF token para proteção -->
                                @foreach ($pendingEquipments as $pendingEquipment)
                                    <input type="hidden" name="pendingEquipmentIds[]"
                                        value="{{ $pendingEquipment->pending_equipment_id }}">
                                @endforeach
                                <button type="submit" class="btn btn-danger float-right mb-3">Excluir Todos</button>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        @foreach ($pendingEquipments as $pendingEquipment)
            <!-- modal-PendingEquipmentCreate  -->

            <div class="modal fade" id="modal-PendingEquipmentCreate-{{ $pendingEquipment->pending_equipment_id }}">
                <div class="modal-dialog">
                    <div class="modal-content">
                        <div class="modal-header bg-primary">
                            <h4 class="modal-title">Criar Equipamento</h4>
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                <span aria-hidden="true">x</span>
                            </button>
                        </div>
                        <form
                            action="{{ route('CreateNewEquipmentFromPendingEquipment', $pendingEquipment->pending_equipment_id) }}"
                            method="POST">

                            @csrf
                            <div class="modal-body">
                                <p>Criar equipamento ?</p>
                                <h4>{{ $pendingEquipment->pending_equipment_tag }} <strong>(Número da copia)</strong> </h4>
                                <h4>{{ $pendingEquipment->pending_equipment_description }} <strong>(Número da
                                        copia)</strong></h4>
                                <h4>{{ $pendingEquipment->pending_equipment_type_id }}(Tipo de Equipamento)</h4>
                                <select class="form-control" name="EquipmentAmbit"
                                    id="AmbitsEquipments_list-{{ $pendingEquipment->pending_equipment_id }}" required>
                                    <option value='' hidden>Selecionar Âmbitos...</option>
                                </select>
                            </div>
                            <div class="modal-footer justify-content-between">
                                <button type="button" class="btn btn-default" data-dismiss="modal">Fechar</button>
                                <button type="submit" class="btn btn-success">Criar</button>
                            </div>
                        </form>
                    </div>
                    <!-- /.modal-content -->
                </div>
            </div>
            <!-- ./modal-PendingEquipmentCreate -->

            <!-- modal-PendingEquipmentRemove -->
            <div class="modal fade" id="modal-PendingEquipmentRemove-{{ $pendingEquipment->pending_equipment_id }}">
                <div class="modal-dialog">
                    <div class="modal-content">
                        <div class="modal-header bg-primary">
                            <h4 class="modal-title">Remover</h4>
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                <span aria-hidden="true">x</span>
                            </button>
                        </div>
                        <div class="modal-body">
                            <p>Deseja realmente remover o equipamento ?</p>
                            <h4>{{ $pendingEquipment->pending_equipment_tag }}</h4>
                            <h4>{{ $pendingEquipment->pending_equipment_description }}</h4>
                        </div>
                        <div class="modal-footer justify-content-between">
                            <form action="{{ route('removeEquipment', $pendingEquipment->pending_equipment_id) }}"
                                method="POST">
                                @csrf
                                @method('DELETE')
                                <div class="modal-footer justify-content-between">
                                    <button type="button" class="btn btn-default"
                                        data-dismiss="modal">Fechar</button>
                                    <button type="submit" class="btn btn-danger">Remover</button>
                                </div>
                            </form>
                        </div>
                    </div>
                    <!-- /.modal-content -->
                </div>
                <!-- /.modal-dialog -->
            </div>
            <!-- ./modal-PendingEquipmentRemove -->
        @endforeach
    @endif


    <script>
        var dataTable;
        $(document).ready(function() {

            dataTable = $('#showProjectEquipment').DataTable({
                responsive: true,
                processing: true,
                serverSide: true,
                ajax: {
                    url: '{{ route('getDataEquipment') }}',
                    type: 'GET',
                    data: function(d) {
                        d.numberProject = $('#receiveNumberProject').val();
                        d.checkUnits = $('#receiveUnitsClientRelated1').val();
                        d.tipo_valvulasList = $('#tipo_valvulasList').val();
                    }
                },
                columns: [{
                        data: 'equipment_id',
                        name: 'equipment_id'
                    },
                    // {
                    //     data: 'ispt_number',
                    //     name: 'ispt_number'
                    // },
                    {
                        data: 'equipment_tag',
                        name: 'equipment_tag'
                    },
                    {
                        data: 'unit_id',
                        name: 'unit_id'
                    },
                    {
                        data: 'equipment_type_id',
                        name: 'equipment_type_id'
                    },
                    {
                        data: 'action',
                        name: 'action',
                        orderable: false,
                        searchable: false
                    },
                ],
            });
        });

        $('#receiveUnitsClientRelated1, #receiveNumberProject, #tipo_valvulasList').on('change', function() {
            dataTable.ajax.reload();
        });
    </script>

    {{-- <script type="text/javascript">
        $(document).ready(function() {
            // $('#card-receiveUnitsClientRelated').hide();

            // Evento de mudança para o campo onde numberProject é selecionado
            $('#receiveNumberProject').on('change', function() {
                
                var numberProject = $(this).val();

                if (numberProject) {
                    $.ajax({
                        url: '/api/receiveUnits/' +  numberProject,
                        type: 'GET',
                        success: function(data) {
                            // Supondo que 'data' é um array de objetos com 'id' e 'name'
                            var options = "<option value='#' selected>Mostrar Todos</option>";
                            $.each(data, function(index, item) {
                                options += "<option value='" + item.id + "'>" + item
                                    .name + "</option>";
                            });

                            $('#receiveUnitsClientRelated').html(options);
                        },
                        error: function() {
                            // Tratamento de erro
                            console.log('Erro ao carregar dados');
                        }
                    });
                }
            });
        });
    </script> --}}


    {{-- Nao vai precisar de scritp, pois este filtro nao vai precisar ser altera. --}}
    {{-- <script type="text/javascript">
        $(document).ready(function() {
            $('#receiveNumberProject').on('change', function() {
                var numberProject = $(this).val();

                if (numberProject) {
                    $.ajax({
                        url: '/api/receiveUnits/' + numberProject,
                        type: 'GET',
                        success: function(data) {
                            console.log(data);
                            var options = "<option value='#' selected>Mostrar Todos</option>";
                            $.each(data, function(index, item) {
                                options += "<option value='" + item.id + "'>" + item
                                    .name + "</option>";
                            });

                            $('#receiveUnitsClientRelated').html(options);
                        },
                        error: function() {
                            console.log('Erro ao carregar dados');
                        }
                    });
                }
            });
        });
    </script> --}}


    <script>
        $(document).ready(function() {
            $('#equipmentType_id_list').on('change', function() {
                var equipmentTypeID = $(this).val();
                if (equipmentTypeID) {
                    $.ajax({
                        url: '/api/ambits/' + equipmentTypeID,
                        type: 'GET',
                        success: function(data) {
                            $('#AmbitsEquipments_list').empty(); // Limpar o select de ambits
                            $('#AmbitsEquipments_list').append(
                                '<option value="" hidden>Selecionar Tipo de Âmbito...</option>'
                            );
                            $.each(data, function(key, value) {
                                $('#AmbitsEquipments_list').append('<option value="' +
                                    value.ambits_id + '">' + value
                                    .ambits_description + '</option>');
                            });
                        }
                    });
                } else {
                    $('#AmbitsEquipments_list')
                        .empty(); // Limpar o select de ambits se não há tipo de equipamento selecionado
                    $('#AmbitsEquipments_list').append(
                        '<option value="" hidden>Selecionar Tipo de Âmbito...</option>');
                }
            });
        });
    </script>

    <script>
        $(document).ready(function() {
            $('.equipmentType_id').each(function() {
                var equipmentTypeInput = $(this);
                var equipmentTypeID = equipmentTypeInput.val();
                var ambitsSelect = equipmentTypeInput.closest('.modal-body').find('.ambitsEquipments_list');

                if (equipmentTypeID) {
                    $.ajax({
                        url: '/api/ambits/' + equipmentTypeID,
                        type: 'GET',
                        success: function(data) {
                            ambitsSelect.empty();
                            ambitsSelect.append(
                                '<option value="" hidden>Selecionar Tipo de Âmbito...</option>'
                            );
                            $.each(data, function(key, value) {
                                ambitsSelect.append('<option value="' + value
                                    .ambits_id + '">' + value.ambits_description +
                                    '</option>');
                            });
                        }
                    });
                } else {
                    ambitsSelect.empty();
                    ambitsSelect.append('<option value="" hidden>Selecionar Tipo de Âmbito...</option>');
                }
            });
        });
    </script>


    <script>
        $(function() {
            $('#new_unit_div').hide(); // inicialmente ocultamos a div
            $('#new_unit_name').prop('required', false); // inicialmente removemos o requisito

            $('#unit_select').change(function() { // evento quando o valor do select muda
                if ($(this).val() == 'new') { // se a opção selecionada é "new"
                    $('#new_unit_div').show(); // mostramos a div
                    $('#new_unit_name').prop('required', true); // adicionamos o requisito
                } else {
                    $('#new_unit_div').hide(); // senão, ocultamos a div
                    $('#new_unit_name').prop('required', false); // removemos o requisito
                }
            });
        });
    </script>

    <script>
        $(function() {
            $('#psv_card').hide();
            $('#isv_card').hide();
            $('#cv_card').hide();

            $('#equipmentType_id_list').change(function() {
                // esconde todos os cards
                $('#psv_card').hide();
                $('#isv_card').hide();
                $('#cv_card').hide();

                // desabilita todos os inputs
                $('.card_inputs').prop('disabled', true);


                switch ($(this).val()) {
                    case '1':
                        $('#cv_card').show();
                        $('#cv_card .card_inputs').prop('disabled', false);
                        break;
                    case '2':
                        $('#isv_card').show();
                        $('#isv_card .card_inputs').prop('disabled', false);
                        break;
                    case '3':
                        $('#psv_card').show();
                        $('#psv_card .card_inputs').prop('disabled', false);
                        break;
                }
            });
        });
    </script>

    <script>
        $(document).ready(function() {
            $('.fa-eye').parent().click(function(event) {
                event.preventDefault(); // Isso impede que o link seja seguido
                var id = $(this).data('id');
                $('#card-' + id).toggle(); // Isso mostra ou oculta o cartão correspondente
            });
        });
    </script>

    <script>
        $(document).ready(function() {
            $('.show-card').click(function(e) {
                e.preventDefault(); // Para evitar que o link execute a ação padrão

                var id = $(this).data('id'); // Obtém o id do elemento clicado

                // Alterna a visibilidade do cartão correspondente
                $('#card-' + id).toggle();
            });
        });
    </script>

    <script>
        $(document).ready(function() {
            $('#modal-remover').on('show.bs.modal', function(event) {
                var button = $(event.relatedTarget);
                console.log(button); // Log do objeto button para verificar se é o correto
                var id = button.attr('data-id'); // 
                console.log(id);
                var form = $(this).find('form');
                var action = form.attr('action');
                form.attr('action', action.replace(':ID', id));
                $('#equipament_id').val(id);
            });
        });
    </script>

@endsection

@section('scriptsTemplateAdmin')
    <script>
        $(document).ready(function() {
            var selectedTasks = []; // Esta variável armazena todas as tarefas selecionadas

            $('.open-modal').click(function(e) {
                e.preventDefault();

                // Limpar os campos de input para cada equipamento 
                $('input[name^="attributes"]').val('');

                // Limpa todos os checkboxes ao abrir a modal
                $('input[name^="ordemTasks"]').prop('checked', false);

                var equipmentId = $(this).data('equipment-id');

                console.log($(this).data());

                $.ajax({
                    url: '/api/equipment/' + equipmentId,
                    method: 'GET',
                    success: function(data) {
                        data.attributes.forEach(function(item) {
                            // Procura o input com name igual a general_attributes_equipment_id e preenche com specific_attributes_value
                            $('input[name="attributes[' + item
                                .general_attributes_equipment_id + ']"]').val(item
                                .specific_attributes_value);
                        });

                        // Limpa o array de tarefas selecionadas
                        selectedTasks = [];

                        data.OrdemTasks.forEach(function(item) {
                            // Procura o checkbox com name igual a elemental_tasks_id e marca como checked
                            var checkbox = $('input[name="ordemTasks[' + item
                                .elemental_tasks_id + ']"]');
                            checkbox.prop('checked', true);

                            // Encontra o objeto correspondente em data.allElementalTasks
                            var correspondingTask = data.allElementalTasks.find(
                                function(task) {
                                    return task.elemental_tasks_id == item
                                        .elemental_tasks_id;
                                });

                            // Verifica se encontrou o objeto correspondente
                            if (correspondingTask) {
                                // Adiciona a tarefa ao array de tarefas selecionadas
                                selectedTasks.push(correspondingTask
                                    .elemental_tasks_code);
                            }
                        });
                        // console.log(selectedTasks);

                        // Limpa o select
                        $('#ArrayListElementsTasks').empty();

                        // Adiciona as opções ao select na ordem correta
                        $.each(selectedTasks, function(index, value) {
                            $('#ArrayListElementsTasks').append(new Option(value,
                                value));
                        });

                        // Abre a modal
                        $('#modal-showEquipment').modal('show');
                    }
                });

                $('#modal-showEquipment').on('hide.bs.modal', function() {
                    // Desmarca todos os checkboxes
                    $('input[name^="ordemTasks"]').prop('checked', false);

                    // Limpa o array de tarefas selecionadas
                    selectedTasks = [];

                    // Limpa o select
                    $('#ArrayListElementsTasks').empty();
                });
            });

            // Monitora mudanças em todos os checkboxes
            $('input[name^="ordemTasks"]').change(function() {
                var taskNumberMatch = this.name.match(/\d+$/);
                if (taskNumberMatch !== null) {
                    var taskName = 'TE' + taskNumberMatch[0];

                    if (this.checked) {
                        // Adiciona a tarefa no array e ordena
                        selectedTasks.push(taskName);
                        selectedTasks.sort();
                    } else {
                        // Remove a tarefa do array
                        var index = selectedTasks.indexOf(taskName);
                        if (index > -1) {
                            selectedTasks.splice(index, 1);
                        }
                    }

                    // Limpa o select
                    $('#ArrayListElementsTasks').empty();

                    // Adiciona as opções ao select na ordem correta
                    $.each(selectedTasks, function(index, value) {
                        $('#ArrayListElementsTasks').append(new Option(value, value));
                    });
                }
            });
        });
    </script>

    <script>
        $(document).ready(function() {
            // Detecta quando qualquer checkbox é selecionado ou desmarcado
            $('input[name^="ordemTasks"]').change(function() {
                // Obtém o valor do checkbox (TE1, TE2, etc.)
                var taskValue = $(this).parent().prev().prev().text();

                if (this.checked) {
                    // Adiciona uma nova opção ao select
                    $('#ArrayListElementsTasks').append($('<option>', {
                        value: taskValue,
                        text: taskValue
                    }));
                } else {
                    // Remove a opção do select
                    $("#ArrayListElementsTasks option[value='" + taskValue + "']").remove();
                }
            });

            // Adiciona as opções que já estão marcadas ao carregar a página
            $('input[name^="ordemTasks"]:checked').each(function() {
                var taskValue = $(this).parent().prev().prev().text();

                // Adiciona uma nova opção ao select
                $('#ArrayListElementsTasks').append($('<option>', {
                    value: taskValue,
                    text: taskValue
                }));
            });
        });
    </script>

    <script>
        $(function() {
            $('#descriptionAdditionalTask').hide();

            $('#checkboxAddicionalTask').change(function() {
                if ($('#checkboxAddicionalTask').is(':checked')) {
                    $('#descriptionAdditionalTask').fadeIn();
                } else {
                    $('#descriptionAdditionalTask').hide();
                }
            });
        })
    </script>

    <script>
        $(function() {
            $("#ProjectEquipmentTable").DataTable({
                "responsive": true,
                "lengthChange": false,
                "autoWidth": false,
                "buttons": ["copy", "csv", "excel", "pdf", "print", "colvis"]
            }).buttons().container().appendTo('#ProjectEquipmentTable_wrapper .col-md-6:eq(0)');
        });
    </script>

    <script>
        $(document).ready(function() {
            $('#tableSelectEquipements').DataTable({
                autoWidth: false,
                processing: true,
                serverSide: true,
                // Alterar esta parte para a nova forma.
                ajax: {
                    // url: '/api/receiveAllInstallationEquipment/' + $('#receiveNumberProject').val()
                    url: '{{ route('api_receiveAllInstallationEquipment') }}',
                    type: 'GET',
                    data: function(d) {
                        d.receiveNumberProject = $('#receiveNumberProject').val();
                    }
                },
                columns: [{
                        data: 'equipment_tag',
                        name: 'equipment_tag'
                    },
                    {
                        data: 'equipment_description',
                        name: 'equipment_description'
                    },
                    {
                        data: 'equipment_type',
                        name: 'equipment_type'
                    },
                    {
                        data: 'unit',
                        name: 'unit'
                    },
                    {
                        data: 'equipment_id',
                        name: 'equipment_id',
                        render: function(data, type, row) {
                            return '<input type="checkbox" class="equipment-checkbox" value="' +
                                data + '">';
                        },
                        orderable: false,
                        searchable: false
                    },
                ]
            });

            // var selectedEquipments = [];
            // $(document).on('click', '.equipment-checkbox', function() {
            //     var equipmentId = $(this).val();

            //     if ($(this).is(':checked')) {
            //         // Adiciona o equipmentId ao array se a checkbox está marcada
            //         selectedEquipments.push(equipmentId);
            //     } else {
            //         // Remove o equipmentId do array se a checkbox está desmarcada
            //         var index = selectedEquipments.indexOf(equipmentId);
            //         if (index > -1) {
            //             selectedEquipments.splice(index, 1);
            //         }
            //     }
            // });

            // $(document).on('click', '#select-all', function() {
            //     var isChecked = $(this).is(':checked');

            //     // Seleciona ou desseleciona todas as checkboxes
            //     $('.equipment-checkbox').prop('checked', isChecked);

            //     // Adiciona ou remove todos os IDs de equipamento do array selectedEquipments
            //     if (isChecked) {
            //         $('.equipment-checkbox').each(function() {
            //             var equipmentId = $(this).val();
            //             if ($.inArray(equipmentId, selectedEquipments) === -1) {
            //                 selectedEquipments.push(equipmentId);
            //             }
            //         });
            //     } else {
            //         selectedEquipments = [];
            //     }
            // });



            // $(document).on('click', '.equipment-checkbox', function() {
            //     var equipmentId = $(this).val();

            //     if ($(this).is(':checked')) {
            //         // Adiciona o equipmentId ao array se a checkbox está marcada
            //         if ($.inArray(equipmentId, selectedEquipments) === -1) {
            //             selectedEquipments.push(equipmentId);
            //         }
            //     } else {
            //         // Remove o equipmentId do array se a checkbox está desmarcada
            //         var index = selectedEquipments.indexOf(equipmentId);
            //         if (index > -1) {
            //             selectedEquipments.splice(index, 1);
            //         }

            //         // Desmarca a checkbox "selecionar todos"
            //         $('#select-all').prop('checked', false);
            //     }
            // });
            // $(document).on('click', '#addingEquipmentToProject', function() {
            //         // Faça uma solicitação AJAX para a rota desejada
            //         $.ajax({
            //             url: '/api/getEquipmentDetails/' + selectedEquipments, // Substitua por sua rota
            //             method: 'GET',
            //             success: function(response) {
            //                 console.log(response);
            //             },
            //         });
            //     });


            var selectedEquipments = [];

            $(document).on('click', '.equipment-checkbox', function() {
                var equipmentId = $(this).val();

                if ($(this).is(':checked')) {
                    // Adiciona o equipmentId ao array se a checkbox está marcada
                    if ($.inArray(equipmentId, selectedEquipments) === -1) {
                        selectedEquipments.push(equipmentId);
                    }
                } else {
                    // Remove o equipmentId do array se a checkbox está desmarcada
                    var index = selectedEquipments.indexOf(equipmentId);
                    if (index > -1) {
                        selectedEquipments.splice(index, 1);
                    }

                    // Desmarca a checkbox "selecionar todos"
                    $('#select-all').prop('checked', false);
                }
            });

            $(document).on('click', '#select-all', function() {
                var isChecked = $(this).is(':checked');

                // Seleciona ou desseleciona todas as checkboxes
                $('.equipment-checkbox').prop('checked', isChecked);

                // Adiciona ou remove todos os IDs de equipamento do array selectedEquipments
                if (isChecked) {
                    $('.equipment-checkbox').each(function() {
                        var equipmentId = $(this).val();
                        if ($.inArray(equipmentId, selectedEquipments) === -1) {
                            selectedEquipments.push(equipmentId);
                        }
                    });
                } else {
                    selectedEquipments = [];
                }
            });

            $(document).on('click', '#addingEquipmentToProject', function() {
                // Faça uma solicitação AJAX para a rota desejada
                $.ajax({
                    url: '/api/getEquipmentDetails/' + selectedEquipments, // Substitua por sua rota
                    method: 'GET',

                    success: function(response) {

                        $('#modal-addingEquipmentToProject .table-responsive').empty();

                        var form = $(
                            '<form action="{{ route('receiveEquipmentToAssociateTasks') }}" method="post"></form>'
                        );
                        // Ira receber o Número da obra atualmente relacionada
                        var receiveNumberProject = $('<input>', {
                            type: 'hidden',
                            name: 'receiveNumberProject',
                            value: $('#receiveNumberProject').val()
                        });

                        form.append(receiveNumberProject);

                        form.append('{{ csrf_field() }}');

                        var table = $(
                                '<table class="table table-bordered table-striped"></table>')
                            .addClass('table');
                        var thead = $(
                            '<thead><tr><th>Id</th><th>Tag</th><th>Description</th><th>Unit ID</th><th>Type ID</th><th>Ambits</th></tr></thead>'
                        );
                        table.append(thead);

                        var tbody = $('<tbody></tbody>');

                        response.forEach(function(equipment, index) {


                            var row = $('<tr></tr>');

                            row.append($('<td></td>').text(equipment.equipment_id)
                                .append($('<input>', {
                                    type: 'hidden',
                                    name: 'equipment[' + index +
                                        '][equipment_id]',
                                    value: equipment.equipment_id
                                })));
                            row.append($('<td></td>').text(equipment.equipment_tag)
                                .append($('<input>', {
                                    type: 'hidden',
                                    name: 'equipment[' + index +
                                        '][equipment_tag]',
                                    value: equipment.equipment_tag
                                })));
                            row.append($('<td></td>').text(equipment
                                    .equipment_description)
                                .append($('<input>', {
                                    type: 'hidden',
                                    name: 'equipment[' + index +
                                        '][equipment_description]',
                                    value: equipment.equipment_description
                                })));
                            row.append($('<td></td>').text(equipment.unit_id)
                                .append($('<input>', {
                                    type: 'hidden',
                                    name: 'equipment[' + index +
                                        '][unit_id]',
                                    value: equipment.unit_id
                                })));
                            row.append($('<td></td>').text(equipment.equipment_type_id)
                                .append($('<input>', {
                                    type: 'hidden',
                                    name: 'equipment[' + index +
                                        '][equipment_type_id]',
                                    value: equipment.equipment_type_id
                                })));


                            // Adiciona um select para cada linha com os ambits do equipamento
                            var select = $(
                                '<select class="form-control" name="equipment[' +
                                index + '][ambit_id]">');
                            Object.values(equipment.ambits).forEach(function(ambit) {
                                var option = new Option(ambit
                                    .ambits_description, ambit.ambits_id);
                                select.append(option);
                            });
                            row.append($('<td></td>').append(select));
                            tbody.append(row);
                        });

                        table.append(tbody);

                        // Adiciona um botão de enviar ao formulário
                        form.append(table);
                        form.append(
                            '<button type="submit" class="btn btn-primary">Submit</button>');

                        $('#modal-addingEquipmentToProject .table-responsive').append(form);
                        $('#modal-addingEquipmentToProject').modal('show');
                    }


                });
            });

        });
    </script>

    <script>
        $(document).ready(function() {
            $('#exampleInputFile').on('change', function() {
                // Obtendo o nome do arquivo
                var fileName = $(this).val().split('\\').pop();

                // Substituindo o texto do rótulo
                $(this).next('.custom-file-label').html(fileName);
            })
        });
    </script>


    <script>
        $(document).ready(function() {
            $('[id^="modal-PendingEquipmentCreate-"]').on('show.bs.modal', function(e) {
                // Pega o id do equipamento pendente do id da modal
                var pendingEquipmentID = e.target.id.split('-').pop();

                // Pega o valor do tipo de equipamento do elemento h4
                var equipmentTypeID = $(this).find('h4').last().text();

                // Realiza a chamada AJAX
                if (equipmentTypeID) {
                    $.ajax({
                        url: '/api/ambits/' + equipmentTypeID,
                        type: 'GET',
                        success: function(data) {
                            $('#AmbitsEquipments_list-' + pendingEquipmentID).empty();
                            $('#AmbitsEquipments_list-' + pendingEquipmentID).append(
                                '<option value="" hidden>Selecionar Tipo de Âmbito...</option>'
                            );
                            $.each(data, function(key, value) {
                                $('#AmbitsEquipments_list-' + pendingEquipmentID)
                                    .append('<option value="' +

                                        value.ambits_id + '">' + value
                                        .ambits_description + '</option>');
                            });
                        }
                    });
                } else {
                    $('#AmbitsEquipments_list-' + pendingEquipmentID).empty();
                    $('#AmbitsEquipments_list-' + pendingEquipmentID).append(
                        '<option value="" hidden>Selecionar Tipo de Âmbito...</option>');
                }
            });
        });
    </script>

    <script>
        $(document).ready(function() {
            $('#mytable').DataTable();
        });
    </script>


    {{-- <script type="text/javascript">
        $(document).ready(function() {
            $('#cardHeader').on('click', function(e) {
                // Verifica se o clique não foi no botão
                if (!$(e.target).is('#collapseButton') && !$(e.target).is('#collapseButton *')) {
                    $('#collapseButton').trigger('click');
                }
            });
        });
    </script> --}}


    <script type="text/javascript">
        $(document).ready(function() {
            $('.clickable').on('click', function(e) {
                // Verifica se o clique não foi no botão
                if (!$(e.target).is('.collapse-button') && !$(e.target).is('.collapse-button *')) {
                    $(this).find('.collapse-button').trigger('click');
                }
            });
        });
    </script>
@endsection