Reformat employee entry form and index

app/views/employees/_form.html.erb

@@ -1,65 +1,120 @@
 <% form_for @employee do |f| %>
   <%= f.error_messages %>
-  <dl>
   <fieldset class="left">
-    <legend>Personal</legend>
-    <dt><%= f.label :number %></dt>
-    <dd><%= f.text_field :number %></dd>
-    <dt><%= f.label :firstname %></dt>
-    <dd><%= f.text_field :firstname %></dd>
-    <dt><%= f.label :lastname %></dt>
-    <dd><%= f.text_field :lastname %></dd>
-    <dt><%= f.label :dob %></dt>
-    <dd><%= f.date_select :dob, :start_year => Time.now.year - 70,
-        :end_year => Time.now.year - 17, :default => Time.now - 30.years %>
-    </dd>
-    <dt><%= f.label :phone %></dt>
-    <dd><%= f.text_field :phone %></dd>
+  <legend>Personal Info</legend>
+  <%# f.label :number %>
+  <%# f.text_field :number %>
+  <table cellpadding="0">
+  <tr>
+  <td class="name"><%= f.label :firstname, "First Name", :class => "label" %></td>
+  <td colspan="3" class="name">
+      <%= f.label :lastname, "Last Name", :class => "label" %></td>
+  </tr>
+  <tr>
+  <td class="border"><%= f.text_field :firstname, :size => "12" %></td>
+  <td colspan="3" class="border"><%= f.text_field :lastname, :size => "12" %></td>
+  </tr>
+  <tr>
+  <td colspan="4"><%= f.label :street, "Street", :class => "label" %></td>
+  </tr>
+  <tr>
+  <td colspan="4" class="border"><%= f.text_field :street %></td>
+  </tr>
+  <tr>
+  <td class="city"><%= f.label :city, "City", :class => "label" %></td>
+  <td>&nbsp;</td>
+  <td class="state"><%= f.label :state, "St", :class => "label" %></td>
+  <td class="zip"><%= f.label :zip, "Zip", :class => "label" %></td>
+  </tr>
+  <tr>
+  <td colspan="2" class="border"><%= f.text_field :city, :size => "20" %></td>
+  <td class="border"><%= f.text_field :state, :size => "2" %></td>
+  <td class="border"><%= f.text_field :zip, :size => "6" %></td>
+  </tr>
+  <tr>
+  <td><%= f.label :dob, "Birth Date", :class => "label" %></td>
+  <td colspan="3"><%= f.label :hired, "Hire Date", :class => "label" %></td>
+  </tr>
+  <tr>
+  <td class="border"><%= f.calendar_date_select :dob, :size => "10",
+      :year_range => 70.years.ago..0.years.ago,
+      :buttons => false %></td>
+  <td colspan="3" class="border"><%= f.calendar_date_select :hired, :size => "10",
+      :year_range => 20.years.ago..1.year.from_now,
+      :buttons => false %></td>
+  </tr>
+  <tr>
+  <td class="ssn"><%= f.label :ssn, "Social", :class => "label" %></td>
+  <td colspan="3" class="phone"><%= f.label :phone, "Phone", :class => "label" %></td>
+  </tr>
+  <tr>
+  <td class="border"><%= f.text_field :ssn, :size => "10" %></td>
+  <td colspan="3" class="border"><%= f.text_field :phone, :size => "12" %></td>
+  </tr>
+  <tr>
+  <td>&nbsp;</td>
+  <td class="tax"><%= f.label :tax_status, "Status", :class => "label" %></td>
+  <td class="dep"><%= f.label :dependents, "Dep", :class => "label" %></td>
+  <td><%= f.label :payrate, "Rate", :class => "label" %></td>
+  </tr>
+  <tr>
+  <td class="border">&nbsp;</td>
+  <td class="border"><%= f.text_field :tax_status, :size => "1" %></td>
+  <td class="border"><%= f.text_field :dependents, :size => "1" %></td>
+  <td class="border"><%= f.text_field :payrate, :size => "4" %></td>
+  </tr>
+  </table>
   </fieldset>
-  <fieldset class="right">
-    <legend>Tax Info</legend>
-    <!-- Pay Info -->
-    <dt><%= f.label :ssn %></dt>
-    <dd><%= f.text_field :ssn %></dd>
-    <dt><%= f.label :payrate %></dt>
-    <dd><%= f.text_field :payrate %></dd>
-    <dt><%= f.label :tax_status %></dt>
-    <dd><%= f.text_field :tax_status %></dd>
-    <dt><%= f.label :dependents %></dt>
-    <dd><%= f.text_field :dependents %></dd>
-    <dt><%= f.label :hired %></dt>
-    <dd><%= f.date_select :hired, :start_year => Time.now.year - 10,
-        :end_year => Time.now.year + 1, :default => Time.now %>
-    </dd>
+  <fieldset class="right loads">
+  <legend>Recent Loads</legend>
+    <br />
+    <br />
+    <br />
+    <br />
+    <br />
+    <br />
+    <br />
+    <br />
+    <br />
+    <br />
+    <br />
+    <br />
+    <br />
+    <br />
+    <br />
+    <br />
+    <br />
+    <br />
+    <br />
+    <br />
   </fieldset>
+<!-- License Info -->
   <fieldset class="left">
-    <!-- Address Info -->
-    <legend>Address</legend>
-    <dt><%= f.label :street %></dt>
-    <dd><%= f.text_field :street %></dd>
-    <dt><%= f.label :city %></dt>
-    <dd><%= f.text_field :city %></dd>
-    <dt><%= f.label :state %></dt>
-    <dd><%= f.text_field :state %></dd>
-    <dt><%= f.label :zip %></dt>
-    <dd><%= f.text_field :zip %></dd>
-  </fieldset>
-  <fieldset class="right">
   <legend>Vehicle Info</legend>
-    <!-- License Info -->
-    <dt><%= f.label :dl_number %></dt>
-    <dd><%= f.text_field :dl_number %></dd>
-    <dt><%= f.label :dl_state %></dt>
-    <dd><%= f.text_field :dl_state %></dd>
-    <dt><%= f.label :dl_expire %></dt>
-    <dd><%= f.text_field :dl_expire %></dd>
-    <!-- Truck Info -->
-    <dt><%= f.label :truck %></dt>
-    <dd><%= f.text_field :truck %></dd>
-    <dt><%= f.label :trailer %></dt>
-    <dd><%= f.text_field :trailer %></dd>
+  <table cellspacing="0">
+  <tr>
+  <td class="dl_number">
+      <%= f.label :dl_number, "License No.", :class => "label" %></td>
+  <td class="dl_state"><%= f.label :dl_state, "St", :class => "label" %></td>
+  <td class="dl_expire"><%= f.label :dl_expire, "Expiry", :class => "label" %></td>
+  </tr>
+  <tr>
+  <td class="border"><%= f.text_field :dl_number, :size => "14" %></td>
+  <td class="border state"><%= f.text_field :dl_state, :size => "2" %></td>
+  <td class="border"><%= f.calendar_date_select :dl_expire,
+      :size => "10" %></td>
+  </tr>
+<!-- Truck Info -->
+  <tr>
+  <td><%= f.label :truck, "Truck No", :class => "label" %></td>
+  <td colspan="2"><%= f.label :trailer, "Trailer No", :class => "label" %></td>
+  </tr>
+  <tr>
+  <td class="border"><%= f.text_field :truck, :size => "12" %></td>
+  <td colspan="2" class="border"><%= f.text_field :trailer, :size => "12" %></td>
+  </tr>
+  </table>
   </fieldset>
-  </dl>
   <hr class="clear">
   <p><%= f.submit "Submit" %></p>
 <% end %>

app/views/employees/index.html.erb

@@ -4,24 +4,26 @@
     <th>No.</th>
     <th>First Name</th>
     <th>Last Name</th>
-    <th>SSN</th>
+    <th>Street</th>
+    <th>City</th>
+    <th>St.</th>
+    <th>Zip</th>
     <th>Birth Date</th>
     <th>Hire Date</th>
-    <th>S</th>
-    <th>D</th>
-    <th>Payrate</th>
+    <th>Rate</th>
   </tr>
   <% for employee in @employees %>
   <tr class="<%= cycle("light", "dark") -%>" onclick="location.href='<%= edit_employee_path(employee) %>'">
     <td class="number"><%= employee.number %></td>
-    <td class="firstname"><%= employee.firstname %></td>
-    <td class="lastname"><%= employee.lastname %></td>
-    <td class="ssn"><%= employee.ssn %></td>
-    <td class="dob"><%= employee.dob %></td>
-    <td class="hired"><%= employee.hired %></td>
-    <td class="tax_status"><%= employee.tax_status %></td>
-    <td class="dependents"><%= employee.dependents %></td>
-    <td class="payrate"><%= employee.payrate %></td>
+    <td class="name"><%= employee.firstname %></td>
+    <td class="name"><%= employee.lastname %></td>
+    <td class="street"><%= employee.street %></td>
+    <td class="city"><%= employee.city %></td>
+    <td class="state"><%= employee.state %></td>
+    <td class="zip"><%= employee.zip %></td>
+    <td class="date"><%= employee.dob %></td>
+    <td class="date"><%= employee.hired %></td>
+    <td class="payrate"><%= number_to_currency employee.payrate %></td>
   </tr>
   <% end %>
 </table>