Modificando os modals para adicionar as áreas temáticas

resources/views/administrador/analisarProposta.blade.php

 @extends('layouts.app')
 
+@section('styles')
+<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.13/css/select2.min.css" integrity="sha512-nMNlpuaDPrqlEls3IX/Q56H36qvBASwb3ipuo3MxeWbsQB1881ox0cRv7UPTgBlriqoynt35KjEwgGUeUXIPnw==" crossorigin="anonymous" referrerpolicy="no-referrer" />
+@endsection
+
 @section('content')
     @php
         $grandesAreas = \App\GrandeArea::all();
@@ -1559,6 +1563,15 @@
                                    required>
                         </div>
 
+                        <div class="form-group">
+                          <label for="grandeArea" class="col-form-label">{{ __('Áreas Temáticas') }}<span style="color: red; font-weight:bold">*</span></label>
+                          <select class="form-control" id="areaTematicaConvite" style="width: 425px" name="grandeAreaConvite[]" multiple="multiple" required>
+                              @foreach($areasTematicas as $areaTematica)
+                                  <option value="{{$areaTematica->id}}">{{$areaTematica->nome}}</option>
+                              @endforeach
+                          </select>
+                        </div>
+
                         @if($evento->natureza_id == 3)
                             <div class="form-group">
                                 <label for="grandeArea" class="col-form-label">{{ __('Áreas Temáticas') }} <span
@@ -1709,6 +1722,14 @@
 @endsection
 
 @section('javascript')
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.13/js/select2.min.js" integrity="sha512-2ImtlRlf2VVmiGZsjm9bEyhjGW4dU7B6TNwh/hx/iSByxNENtj3WVE6o/9Lj4TJeVXPi4bnOIMXFIJJAeufa0A==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
+    <script type="text/javascript">
+    $("#areaTematicaConvite").select2({
+        placeholder: 'Selecione as áreas temáticas',
+        allowClear: true
+    });
+    </script>
+
     <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
     <script type="text/javascript">
         var avaliacaoForm;

resources/views/administrador/selecionarAvaliadores.blade.php

 @extends('layouts.app')
 
+@section('styles')
+<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.13/css/select2.min.css" integrity="sha512-nMNlpuaDPrqlEls3IX/Q56H36qvBASwb3ipuo3MxeWbsQB1881ox0cRv7UPTgBlriqoynt35KjEwgGUeUXIPnw==" crossorigin="anonymous" referrerpolicy="no-referrer" />
+@endsection
+
 @section('content')
 
 <div class="container" style="margin-top: 30px;">
@@ -262,6 +266,15 @@
             <input type="email" class="form-control" name="emailAvaliador" id="exampleInputEmail1" required>            
           </div>
   <!-- aki -->
+          <div class="form-group">
+            <label for="grandeArea" class="col-form-label">{{ __('Áreas Temáticas') }}<span style="color: red; font-weight:bold">*</span></label>
+            <select class="form-control" id="areaTematicaConvite" style="width: 425px" name="grandeAreaConvite[]" multiple="multiple" required>
+                @foreach($areasTematicas as $areaTematica)
+                    <option value="{{$areaTematica->id}}">{{$areaTematica->nome}}</option>
+                @endforeach
+            </select>
+          </div>
+
         @if($evento->natureza_id != 3)
           <div class="form-group">
           <label for="grandeArea" class="col-form-label">{{ __('Grande Área') }} <span style="color: red; font-weight:bold">*</span></label>
@@ -337,6 +350,14 @@
 @endsection
 
 @section('javascript')
+<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.13/js/select2.min.js" integrity="sha512-2ImtlRlf2VVmiGZsjm9bEyhjGW4dU7B6TNwh/hx/iSByxNENtj3WVE6o/9Lj4TJeVXPi4bnOIMXFIJJAeufa0A==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
+<script type="text/javascript">
+  $("#areaTematicaConvite").select2({
+    placeholder: 'Selecione as áreas temáticas',
+    allowClear: true
+  });
+</script>
+
 <script>
   $('#myModal').on('shown.bs.modal', function () {
     $('#myInput').trigger('focus')

resources/views/administrador/selecionarProjetos.blade.php

 @extends('layouts.app')
 
+@section('styles')
+<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.13/css/select2.min.css" integrity="sha512-nMNlpuaDPrqlEls3IX/Q56H36qvBASwb3ipuo3MxeWbsQB1881ox0cRv7UPTgBlriqoynt35KjEwgGUeUXIPnw==" crossorigin="anonymous" referrerpolicy="no-referrer" />
+@endsection
+
 @section('content')
 
 <div class="container" style="margin-top: 30px;">
@@ -333,6 +337,15 @@
                                    required>
                         </div>
 
+                        <div class="form-group">
+                          <label for="grandeArea" class="col-form-label">{{ __('Áreas Temáticas') }}<span style="color: red; font-weight:bold">*</span></label>
+                          <select class="form-control" id="areaTematicaConvite" style="width: 425px" name="grandeAreaConvite[]" multiple="multiple" required>
+                              @foreach($areasTematicas as $areaTematica)
+                                  <option value="{{$areaTematica->id}}">{{$areaTematica->nome}}</option>
+                              @endforeach
+                          </select>
+                        </div>
+
                         <div class="form-group">
                           @if($evento->natureza_id != 3)
                             <label for="grandeArea" class="col-form-label">{{ __('Grande Área') }} <span
@@ -414,6 +427,15 @@
 
 @endsection
 @section('javascript')
+<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.13/js/select2.min.js" integrity="sha512-2ImtlRlf2VVmiGZsjm9bEyhjGW4dU7B6TNwh/hx/iSByxNENtj3WVE6o/9Lj4TJeVXPi4bnOIMXFIJJAeufa0A==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
+<script type="text/javascript">
+  $("#areaTematicaConvite").select2({
+    placeholder: 'Selecione as áreas temáticas',
+    allowClear: true
+  });
+</script>
+
+
 <script>
   $('#myModal').on('shown.bs.modal', function () {
     $('#myInput').trigger('focus')
@@ -497,7 +519,5 @@
           $("#outra").prop('required', false);
       }
   }
-
-  
 </script>
 @endsection

resources/views/layouts/app.blade.php

@@ -23,7 +23,8 @@
     <link href="{{ asset('css/app.css') }}" rel="stylesheet">
     <link href="{{ asset('css/layout.css') }}" rel="stylesheet">
 
-    
+    @yield('styles')
+
 
     <style>
     body{