From f937bda75ef024a281cff199a65d5ba4f811c13f Mon Sep 17 00:00:00 2001 From: Zog Date: Fri, 19 Jan 2018 17:29:50 +0100 Subject: Refs #3542; Add a date lookup --- .../components/_referential_overview.sass | 64 +++++++++++++--------- app/javascript/referential_overview/index.coffee | 11 +++- app/views/referentials/_overview.html.slim | 13 +++-- 3 files changed, 58 insertions(+), 30 deletions(-) diff --git a/app/assets/stylesheets/components/_referential_overview.sass b/app/assets/stylesheets/components/_referential_overview.sass index af1baf4ec..5abbb47cd 100644 --- a/app/assets/stylesheets/components/_referential_overview.sass +++ b/app/assets/stylesheets/components/_referential_overview.sass @@ -1,14 +1,14 @@ .referential-overview $left-size: 100px - $line-height: 57px + $line-height: 60px margin-top: 50px overflow: hidden .time-travel, .filters background-color: $lightergrey padding: 10px float: right - border-top-left-radius: 10px - border-top-right-radius: 10px + border-top-left-radius: 4px + border-top-right-radius: 4px border: 1px solid $lightgrey border-bottom: none position: relative @@ -22,12 +22,32 @@ box-shadow: 0 0 10px rgba(0,0,0,0.5) z-index: 1 .time-travel + padding-top: 4px + padding-bottom: 4px a.btn:first-child - border-right: 1px solid $grey margin-right: 1px a.btn:last-child - border-left: 1px solid $grey + margin-right: 1px + max-width: 33% + .btn-group, .form-group + position: relative + z-index: 2 + .form-group + margin-left: 10px + margin-bottom: 0 + display: inline-block + input + padding: 6px 5px + border: 1px solid $lightgrey + outline: none + height: 34px + border-radius: 4px + padding-right: 25px + a + padding: 4px + margin-top: 2px + margin-left: -25px .filters float: left max-width: 66% @@ -41,14 +61,14 @@ border-color: $grey width: auto flex: 1 1 - padding: 12px 11px 11px + padding: 4px 11px 5px .input-group-btn right: 10px &.togglable - padding-top: 12px - padding-bottom: 11px + padding-top: 6px + padding-bottom: 5px &:before - top: 7px + top: 0px .overview-table position: relative @@ -93,7 +113,7 @@ width: 0 content: "" .line - padding: 5px 10px + padding: 7px 10px border-bottom: 1px solid $grey font-size: 0.8em &:last-child @@ -218,7 +238,7 @@ border: none &.weekend background: $lightergrey - &.today, &:hover + &.selected, &:hover color: $blue background-color: transparentize($blue, 0.7) &:after @@ -256,7 +276,7 @@ top: 50% margin-top: -6px transform: translateY(-50%) - background-color: transparentize(white, 0.5) + background-color: transparentize(white, 0.25) padding: 5px font-size: 0.7em border-radius: 5px @@ -273,19 +293,6 @@ background: white opacity: 0.25 z-index: 3 - &:before - content: "" - border-right: 1px dashed $grey - top: -100% - bottom: -100% - position: absolute - right: -1px - z-index: 4 - &:hover - &:after - opacity: 0.5 - .title - background-color: transparentize(white, 0.2) &.empty z-index: 1 background: rgb(244, 67, 67) @@ -293,6 +300,12 @@ &.accepted background: #f19039 background: repeating-linear-gradient(-45deg, #f5e1cf,#f5e1cf 12px,#f19039 12px,#f19039 25px) + &:hover + z-index: 3 + &:after + opacity: 0.5 + .title + background-color: transparentize(white, 0.1) &.sticky .time-travel @@ -300,6 +313,7 @@ bottom: 0 z-index: 15 right: 35px + box-shadow: 0 0 10px rgba(0,0,0,0.5) .overview-table .right .lines diff --git a/app/javascript/referential_overview/index.coffee b/app/javascript/referential_overview/index.coffee index 31a689273..0e6541421 100644 --- a/app/javascript/referential_overview/index.coffee +++ b/app/javascript/referential_overview/index.coffee @@ -4,6 +4,8 @@ class TimeTravel @todayBt = @container.find(".today") @prevBt = @container.find(".prev-page") @nextBt = @container.find(".next-page") + @searchDateBt = @container.find("a.search-date") + @searchDateInput = @container.find("input.date-search") @initButtons() initButtons: -> @@ -27,6 +29,11 @@ class TimeTravel e.preventDefault() false + @searchDateBt.click (e)=> + @overview.showDay @searchDateInput.val() if @searchDateInput.val().length > 0 + e.preventDefault() + false + scrolledTo: (progress)-> @prevBt.removeClass 'disabled' @nextBt.removeClass 'disabled' @@ -44,8 +51,10 @@ class window.ReferentialOverview showDay: (date)-> day = @container.find(".day.#{date}") + @container.find(".day.selected").removeClass('selected') + day.addClass "selected" offset = day.offset().left - parentOffset = @currentOffset + parentOffset = @currentOffset + @container.find(".right").offset().left @scrollTo parentOffset - offset currentOffset: -> diff --git a/app/views/referentials/_overview.html.slim b/app/views/referentials/_overview.html.slim index 20bfd6c15..c35d4d5f5 100644 --- a/app/views/referentials/_overview.html.slim +++ b/app/views/referentials/_overview.html.slim @@ -19,10 +19,15 @@ = link_to 'Effacer', @workbench, class: 'btn btn-link' = f.submit 'Filtrer', class: 'btn btn-default' - .time-travel.btn-group - = link_to I18n.t("referentials.overview.head.prev_page"), '#', class: "prev-page btn btn-default disabled" - = link_to I18n.t("referentials.overview.head.today"), '#', class: "today btn btn-default #{overview.includes_today? ? '' : 'disabled'}" - = link_to I18n.t("referentials.overview.head.next_page"), '#', class: "next-page btn btn-default" + .time-travel + .btn-group + = link_to I18n.t("referentials.overview.head.prev_page"), '#', class: "prev-page btn btn-default disabled" + = link_to I18n.t("referentials.overview.head.today"), '#', class: "today btn btn-default #{overview.includes_today? ? '' : 'disabled'}" + = link_to I18n.t("referentials.overview.head.next_page"), '#', class: "next-page btn btn-default" + .form-group + input.date-search type="date" min=overview.period.first max=overview.period.last + a.search-date href='#' + span.fa.fa-search .overview-table .left .head -- cgit v1.2.3