Merge pull request sparc-request#259 from bmic-development/jw-scrolla…

…ble-service-calendar

JM-(SPARCRequest) Freeze panes - Step 2 calendar pages

app/assets/javascripts/service_calendar.js.coffee

@@ -72,6 +72,33 @@ $(document).ready ->
         service_request_id: getSRId()
     return false
 
+  $(document).on 'click', '.freeze-header-button', ->
+
+    arm = $(this).data('arm-id')
+
+    if arm == 'otf-calendar'
+      arm_container = $(this).closest(".#{arm}")
+    else
+      arm_container = $(this).closest(".arm-calendar-container-#{arm}")
+
+    if $(this).hasClass('freeze')
+      arm_container.find('table').addClass('scrolling-table')
+      arm_container.find('thead').addClass('scrolling-thead')
+      arm_container.find('tbody').addClass('scrolling-div')
+      $(this).find('.freeze-header').hide()
+      $(this).find('.unfreeze-header').show()
+      $(this).removeClass('freeze')
+      $(this).addClass('unfreeze')
+    else
+      arm_container.find('table').removeClass('scrolling-table')
+      arm_container.find('table').addClass('non-scrolling-table')
+      arm_container.find('thead').removeClass('scrolling-thead')
+      arm_container.find('tbody').removeClass('scrolling-div')
+      $(this).find('.unfreeze-header').hide()
+      $(this).find('.freeze-header').show()
+      $(this).removeClass('unfreeze')
+      $(this).addClass('freeze')
+
   $(document).on 'change', '.visit-quantity', ->
     checked = $(this).is(':checked')
     obj     = $(this)

app/assets/stylesheets/service_calendar.sass

@@ -32,63 +32,163 @@
   .blue-badge
     background-color: blue
 
+  .divider
+    width: 5px
+    height: auto
+    display: inline-block
+
   .notes:hover
     .note-icon
       color: grey
     .badge
       background-color: grey
+  .notes.btn-link
+    padding: 0px
 
   .panel-title
     width: 100%
 
+  .freeze-header-button
+    border-color: #add8e6
+    .glyphicon-th
+      font-size: 19px
+      display: block
+    .top-icon
+      color: #add8e6
+      height: 7px
+      overflow: hidden
+    .bottom-icon
+      height: 13px
+      width: 20px
+      overflow: hidden
+    .freeze-header
+      padding: 3px 1px 6px 4px
+    .unfreeze-header
+      padding: 4px 1px 6px 4px
+
+  .service-calendar-row.btn-xs,
+  .service-calendar-column.btn-xs
+    padding: 0px 2px
+
   .table-bordered
-    height: 100%
+    width: 100%
+    .non-scrolling-table
+      height: 100%
     thead, tbody tr
       display: table
       width: 100%
       table-layout: fixed
+    thead.scrolling-thead
+      width: calc( 100% - 1em )
     thead
+      font-size: 13px
+      border-bottom: 2px solid #DDD
       tr:not(:first-child)
         border-bottom: 1px solid #ddd
       th
         border-bottom: 0
-      th.service-header
-        width: 12%
-      th.subject-count-header
-        width: 6%
-      th.select-row-header
-        width: 5%
+      th.otf-header-width,
+      th.template-otf-service-header,
+      th.portal-consolidated-service-header,
+      th.consolidated-service-header,
+      th.billing-service-header,
+      th.template-service-header,
+        width: 17%
+      th.checkbox-row-start-width
+        width: 54.61%
+      th.checkbox-row-end-width
+        width: 14.54%
+      th.visit-group-select
+        width: 34.56%
+      th.visit-group-select-portal
+        width: 55.36%
+      th.visit-width
+        width: 6.9%
+      th.unit-cost-width
+        width: 12.34%
+      th.status-width
+        width: 7%
+      th.notes-width
+        width: 4.5%
+      th.quantity-type-width
+        width: 6.8%
+      th.xs-col-width
+        width: 3.8%
+      th.sm-col-width
+        width: 6.17%
+      th.total-width
+        width: 7.27%
       .popover
         color: black
     tbody
-      td.service-width
-        width: 12%
-      td.subject-count-width
-        width: 6%
-      td.select-row-width
-        width: 5%
-      td.maximum-total-per-patient-width,
+      font-size: 13px
+      .organization-header
+        background: #CCC
+      th.billing-organization-header-start-width-portal
+        width: 44.9%
+      th.billing-organization-header-start-width
+        width: 51.44%
+      th.billing-organization-header-end-width
+        width: 14.5%
+      th.visit-width
+        width: 6.9%
+      th.total-one-time-fee-width
+        width: 90.75%
+      td.service-name
+        width: 17%
+      td.visit-width
+        width: 6.9%
+      td.status-width
+        width: 7%
+      td.notes-width
+        width: 4.5%
+      td.unit-type-width
+        width: 6.8%
+      td.xs-col-width
+        width: 3.8%
+      td.sm-col-width
+        width: 6.17%
+      td.total-width
+        width: 7.27%
+      td.total-costs-width
+        width: 41.77%
+      td.max-total-per-patient-width,
+      td.maximum-total-direct-cost-per-patient-width,
       td.total-per-patient-per-visit-cost-per-study-width,
-        width: 53%
+        width: 51.5%
       td.maximum-total-per-patient-width-template,
       td.maximum-total-direct-cost-per-patient-template,
       td.total-per-patient-per-visit-cost-per-study-width-template,
+        width: 55.1%
+      td.total-costs-width-template
+        width: 41.7%
+      .unit-type.col-sm-6,
+      .qty-type
+        border-right: 1px solid #DDD
+
+    .scrolling-div
+      display: block
+      overflow-y: scroll
+      height: 100%
+      max-height: 450px 
+      tr
+        display: table
+        width: 100%
+        table-layout: fixed
+      .maximum-total-per-patient-width-template,
+      .maximum-total-direct-cost-per-patient-template,
+      .total-per-patient-per-visit-cost-per-study-width-template,
         width: 54.8%
-      td.unit-type-number,
-      td.qty-type-number
-        height: 100%
-        padding: 0
-        .unit-type,
-        .units-per-qty,
-        .qty-type,
-        .qty
-          height: 100%
-          padding: 8px 15px
-        .unit-type.col-sm-6,
-        .qty-type
-          border-right: 1px solid #DDD
-      .organization-header
-        background: #CCC
+      .max-total-per-patient-width,
+      .maximum-total-direct-cost-per-patient-width,
+      .total-per-patient-per-visit-cost-per-study-width,
+        width: 51.2%
+      .total-costs-width
+        width: 41.6%
+      .billing-organization-header-end-width
+        width: 14.7%
+      .total-one-time-fee-width
+        width: 90.8%
 
 .service-calendar-row,
 .service-calendar-column
@@ -138,3 +238,12 @@ th.visit-group-select > div
         outline-offset: -2px
 .tooltip-inner
   width: 500px
+
+.scrolling-div::-webkit-scrollbar 
+  width: 1em
+.scrolling-div::-webkit-scrollbar-track
+  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5)
+  border-radius: 10px
+.scrolling-div::-webkit-scrollbar-thumb 
+  border-radius: 10px
+  background-color: #337ab7

app/helpers/service_calendar_helper.rb

@@ -44,6 +44,31 @@ def notable_type_is_related_to_li_or_liv(notable_type)
     notable_type == "LineItemsVisit" || notable_type == "LineItem"
   end
 
+  def display_freeze_header_button_pppv(tab, portal, arm, service_request, sub_service_request, merged, statuses_hidden)
+    if portal && tab != "calendar"
+      add_scrollable_class = Dashboard::ServiceCalendars.pppv_line_items_visits_to_display(arm, service_request, sub_service_request, merged: merged, statuses_hidden: statuses_hidden).map{|x| x.last}.flatten.count > 9
+    else
+      line_item_visits = Dashboard::ServiceCalendars.pppv_line_items_visits_to_display(arm, service_request, sub_service_request, merged: merged, statuses_hidden: statuses_hidden).map{|x| x.last}.flatten
+      line_item_visit_count = line_item_visits.count
+      ssr_count = line_item_visits.map(&:sub_service_request).uniq.count
+      add_scrollable_class = portal ? (line_item_visit_count + ssr_count) > 10 : (line_item_visit_count + ssr_count) > 8
+    end
+    add_scrollable_class
+  end
+
+  def display_freeze_header_button_otf(service_request)
+    @line_items = []
+    service_request.service_list(true).each do |_, value|
+      value[:line_items].group_by(&:sub_service_request_id).each do |sub_service_request_id, line_items|
+        @line_items << line_items
+      end
+    end
+    line_item_count = @line_items.flatten.count
+
+    ssr_count = @line_items.flatten.map(&:sub_service_request).uniq.count
+    (line_item_count + ssr_count) > 8
+  end
+
   def display_unit_type(liv)
     unit_type = liv.line_item.service.displayed_pricing_map.unit_type
     unit_type = unit_type.gsub("/", "/ ")

app/views/service_calendars/master_calendar/otf/_otf_calendar.html.haml

@@ -19,8 +19,13 @@
 -# TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
 .panel.panel-primary.calendar-container.otf-calendar
   .panel-heading
-    %h3.panel-title
-      = t(:calendars)[:otf][:header]
+    .pull-left
+      %h3.panel-title
+        = t(:calendars)[:otf][:header]
+    - unless portal
+      .pull-right
+        = render 'service_calendars/master_calendar/otf/otf_freeze_header_button', service_request: service_request
+    .clearfix
   %table.table.table-bordered
     %thead
       = render 'service_calendars/master_calendar/otf/otf_header', tab: tab,

app/views/service_calendars/master_calendar/otf/_otf_freeze_header_button.html.haml

@@ -0,0 +1,8 @@
+- if display_freeze_header_button_otf(service_request)
+  .btn.btn-xs.btn-primary.freeze-header-button.freeze{ data: { arm_id: "otf-calendar" } }
+    .freeze-header{ data: { toggle: 'tooltip', placement: 'bottom', delay: '{"show":"500"}' }, title: t(:calendars)[:tooltips][:freeze_header]}
+      .top-arrow
+        .glyphicon.glyphicon-th.top-icon
+      .glyphicon.glyphicon-th.bottom-icon
+    .unfreeze-header{ style: "display: none", data: { toggle: 'tooltip', placement: 'bottom', delay: '{"show":"500"}' }, title: t(:calendars)[:tooltips][:unfreeze_header]}
+      .glyphicon.glyphicon-th

app/views/service_calendars/master_calendar/otf/_otf_header.html.haml

@@ -18,32 +18,32 @@
 -# INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR
 -# TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
 %tr
-  %th.col-sm-2.text-center{ colspan: 2, rowspan: 2 }
+  %th.otf-header-width.text-center{ colspan: 2, rowspan: 2 }
     = t(:calendars)[:otf][:header_fields][:service]
-  %th.col-sm-1.text-center{ rowspan: 2 }
+  %th.text-center{ rowspan: 2 }
     - if @tab == 'template'
       = link_to 'javascript:void(0)',
         data: { toggle: 'tooltip', placement: 'top', delay: '{"show":"500"}' },
         title: t(:calendars)[:tooltips][:line_item_notes] do
         = t(:calendars)[:pppv][:header_fields][:notes]
     - else
       = t(:calendars)[:pppv][:header_fields][:notes]
-  %th.col-sm-1.text-center{ rowspan: 2 }
+  %th.text-center{ rowspan: 2 }
     = t(:calendars)[:otf][:header_fields][:status]
-  %th.col-sm-2.text-center{ colspan: 2 }
+  %th.text-center{ colspan: 2 }
     = t(:calendars)[:otf][:header_fields][:unit_cost]
-  %th.col-sm-3.text-center{ colspan: 3, rowspan: 2 }
+  %th.text-center{ colspan: 2, rowspan: 2 }
     = t(:calendars)[:otf][:header_fields][:unit_type]
-  %th.col-sm-3.text-center{ colspan: 3, rowspan: 2 }
+  %th.text-center{ colspan: 2, rowspan: 2 }
     = t(:calendars)[:otf][:header_fields][:qty_type]
-  %th.col-sm-1.text-center{ colspan: 1, rowspan: 2 }
+  %th.text-center{ colspan: 1, rowspan: 2 }
     = link_to 'javascript:void(0)',
       data: { toggle: 'tooltip', placement: 'top', delay: '{"show":"500"}' },
       title: t(:calendars)[:tooltips][:total_per_study] do
       = t(:calendars)[:otf][:header_fields][:total_per_study]
 
 %tr
-  %th.col-sm-1.text-center
+  %th.text-center
     = t(:calendars)[:otf][:header_fields][:service_rate]
-  %th.col-sm-1.text-center
+  %th.text-center
     = raw(t(:calendars)[:otf][:header_fields][:your_cost])

app/views/service_calendars/master_calendar/otf/_otf_line_items.html.haml

@@ -43,27 +43,25 @@
         %td.your-cost.text-center
           = "$#{number_with_precision(Service.cents_to_dollars(line_item.applicable_rate), precision: 2)}"
 
-        %td.unit-type-number.text-center{ colspan: 3 }
-          - if otf_unit_type == 'N/A'
-            .unit-type
-              = otf_unit_type
-          - else
-            .unit-type.col-sm-6
-              = otf_unit_type
-            .units-per-qty.col-sm-6
-              - if locked || tab == 'calendar'
-                = line_item.units_per_quantity
-              - else
-                %a.edit-units-per-qty{ href: 'javascript:void(0)', data: { name: 'units_per_quantity', title: t(:calendars)[:otf][:editable_fields][:unit_quantity], value: line_item.units_per_quantity, url: line_item_path(line_item, srid: service_request.id) } }
-
-        %td.qty-type-number.text-center{ colspan: 3 }
-          .qty-type.col-sm-6
-            = otf_qty_type
-          .qty.col-sm-6
+        - if otf_unit_type == 'N/A'
+          %td.unit-type-number.unit-type.text-center{ colspan: 2 }
+            = otf_unit_type
+        - else
+          %td.unit-type-number.unit-type.text-center
+            = otf_unit_type
+          %td.unit-type-number.units-per-qty.text-center
             - if locked || tab == 'calendar'
-              = line_item.quantity
+              = line_item.units_per_quantity
             - else
-              %a.edit-qty{ href: 'javascript:void(0)', data: { name: 'quantity', title: t(:calendars)[:otf][:editable_fields][:quantity], value: line_item.quantity, url: line_item_path(line_item, srid: service_request.id) } }
+              %a.edit-units-per-qty{ href: 'javascript:void(0)', data: { name: 'units_per_quantity', title: t(:calendars)[:otf][:editable_fields][:unit_quantity], value: line_item.units_per_quantity, url: line_item_path(line_item, srid: service_request.id) } }
+
+        %td.qty-type-number.qty-type.text-center
+          = otf_qty_type
+        %td.qty-type-number.qty.text-center
+          - if locked || tab == 'calendar'
+            = line_item.quantity
+          - else
+            %a.edit-qty{ href: 'javascript:void(0)', data: { name: 'quantity', title: t(:calendars)[:otf][:editable_fields][:quantity], value: line_item.quantity, url: line_item_path(line_item, srid: service_request.id) } }
 
         %td.total-per-study.text-center
           %strong