Edited Worker Details page so styling matches other pages

app/controllers/employers_controller.rb

@@ -62,6 +62,13 @@ class EmployersController < ApplicationController
     render json: @employers.map { |e| { label: e.full_name, value: e.id } }
   end
 
+  def link_employer
+    @worker = Worker.find(params[:id])
+    employer_record = @worker.employer_records.new(employer_record_params)
+    # Handle the logic for creating the employer_record
+    # ...
+  end
+  
 
   private
 
@@ -78,4 +85,8 @@ class EmployersController < ApplicationController
       )
     end
 
+    def employer_record_params
+      params.require(:employer_record).permit(:employer_id, :start_date, :end_date)
+    end
+    
 end

app/controllers/workers_controller.rb

@@ -5,6 +5,7 @@ class WorkersController < ApplicationController
   
     def show
       @worker = Worker.includes(:participants).find(params[:id])
+      @employer_record = EmployerRecord.new 
       @employments = @worker.employments
       @employment = Employment.new  # Initialize a new Employment instance
     end

app/views/workers/show.html.erb

@@ -48,7 +48,6 @@
       <%= link_to 'Back to List', workers_path, class: "btn btn-secondary" %>
     </div>
   </div>
-</div>
 
 
 
@@ -87,8 +86,6 @@
     <% else %>
       <p>No employments available.</p>
     <% end %>
-  </div>
-</div>
   
 
 <%= form_with(model: [@worker, @employment], url: link_participant_worker_path(@worker), method: :post, class: 'row g-3') do |form| %>
@@ -113,8 +110,9 @@
   </div>
 <% end %>
 
+</div>
+
 
-<div class="row mt-4">
   <div class="col-md-6">
     <h2 class="mt-4">Linked Employers</h2>
     <% if @worker.participants.any? %>
@@ -135,8 +133,12 @@
                 <td><%= employer_record.start_date.strftime('%B %d, %Y') if employer_record.start_date %></td>
                 <td><%= employer_record.end_date.strftime('%B %d, %Y') if employer_record.end_date %></td>
                 <td>
-                  <%= link_to 'View', employer_path(employer_record.employer), class: 'btn btn-sm btn-secondary' %>
+                  <%= link_to employer_path(employer_record.employer), class: 'btn btn-sm btn-secondary' do %>
-                  <%= link_to 'Edit', edit_employer_record_path(employer_record), class: 'btn btn-sm btn-info' %>
+                    <i class="bi bi-eye"></i> <!-- Eyeball icon for 'Show' -->
+                  <% end %>
+                  <%= link_to edit_employer_record_path(employer_record), class: 'btn btn-sm btn-info' do %>
+                    <i class="bi bi-pencil-fill" style="color: white;"></i> <!-- Pencil icon for 'Edit' with white color -->
+                  <% end %>
                 </td>
               </tr>
             <% end %>
@@ -146,9 +148,31 @@
     <% else %>
       <p>No linked employers.</p>
     <% end %>
-  </div>
-</div>
 
+<%= form_with(model: [@worker, @employer_record], url: link_employer_worker_path(@worker), method: :post, class: 'row g-3') do |form| %>
+  <div class="col-md-6">
+    <%= form.label :employer_name, "Add New Employer", class: 'form-label' %>
+    <%= text_field_tag :employer_name, nil, id: 'employer-autocomplete', class: 'form-control', placeholder: 'Start typing employer name...' %>
+    <%= hidden_field_tag 'employer_record[employer_id]', nil, id: 'selected-employer-id' %>
+  </div>
+
+  <div class="col-md-3">
+    <%= form.label :start_date, class: 'form-label' %>
+    <%= form.date_field :start_date, class: 'form-control' %>
+  </div>
+
+  <div class="col-md-3">
+    <%= form.label :end_date, class: 'form-label' %>
+    <%= form.date_field :end_date, class: 'form-control' %>
+  </div>
+
+  <div class="col-12">
+    <%= form.submit "Link Employer", class: 'btn btn-dark' %>
+  </div>
+<% end %>
+
+</div>
+</div>
 
 
 <%# JavaScript for Participant Autocomplete %>
@@ -180,6 +204,30 @@ $(document).ready(function() {
 });
 </script>
 
+<%# JavaScript for Employer Autocomplete %>
+<script>
+  $(document).ready(function() {
+    $('#employer-autocomplete').autocomplete({
+      source: function(request, response) {
+        $.ajax({
+          url: '/employers/search',
+          dataType: "json",
+          data: { term: request.term },
+          success: function(data) {
+            response(data);
+          }
+        });
+      },
+      minLength: 2,
+      select: function(event, ui) {
+        $('#employer-autocomplete').val(ui.item.label);
+        $('#selected-employer-id').val(ui.item.value);
+        return false;
+      }
+    });
+  });
+</script>
+
 
 
 

config/routes.rb

@@ -24,6 +24,7 @@ Rails.application.routes.draw do
   resources :workers do
     member do
       post 'link_participant'
+      post 'link_employer'
     end
     get 'search', on: :collection
   end