BathHacked/energy-sparks

<%= form_tag "", method: :get, id: "chart-filter" do %>

  <%= hidden_field_tag :period, period %>
  <%= hidden_field_tag :supply, supply %>
  <%= hidden_field_tag :series_breakdown, :none %>
  <%= hidden_field_tag :configuration, nil, data: {configuration: chart_config} %>

  <div class="row justify-content-md-center">
    <div class="col-12 col-lg-4 col-md-4">
      <div class="<%= supply %>-dark <%= supply %>-dark-<%= period %> p-2 mb-2">
        <%= label_tag 'first-date-picker', t("charts.usage.date_picker.#{period}.first")%>

        <div class="form-group">
          <div class="input-group">
            <div class="input-group date <%= 'week-view' if period == :weekly %>" id="<%= period %>-datetimepicker1" data-target-input="nearest">
              <%= text_field_tag("first-date-picker", '', class: 'form-control datetimepicker-input', data: { target: "##{period}-datetimepicker1" }, onkeydown: 'return false') %>

              <div class="input-group-append" data-target="#<%= period %>-datetimepicker1" data-toggle="datetimepicker">
                <div class="input-group-text"><i class="fa fa-calendar"></i></div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>

    <div class="col-12 col-lg-4 col-md-4">
      <div class="<%= supply %>-light <%= supply %>-light-<%= period %> p-2 mb-2">
        <%= label_tag 'second-date-picker', t("charts.usage.date_picker.#{period}.second")%>

        <div class="form-group">
          <div class="input-group">
            <div class="input-group date <%= 'week-view' if period == :weekly %>" id='<%= "#{period}-datetimepicker2" %>' data-target-input="nearest">
              <%= text_field_tag("second-date-picker", '', class: 'form-control datetimepicker-input', data: { target: "##{period}-datetimepicker2" }, onkeydown: 'return false') %>

              <div class="input-group-append" data-target="##{period}-datetimepicker2" data-toggle="datetimepicker">
                <div class="input-group-text"><i class="fa fa-calendar"></i></div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>

    <% if split_meters %>
      <% if meters.count > 1 %>
        <div class="col-12 col-lg-3 col-md-4">
          <div class="<%= supply %>-dark p-2 mb-2">
            <%= label_tag :meter, t('charts.usage.select_meter.title') %>
            <div class="form-group">
              <%= select_tag :meter, content_tag(:option, t('charts.usage.select_meter.all_meters'), value: "all") + options_from_collection_for_select(meters, :mpan_mprn, :display_name, nil), class: "form-control" %>
            </div>
          </div>
        </div>
      <% else %>
        <%= hidden_field_tag :meter, 'all' %>
      <% end %>
    <% end %>
  </div>
<% end %>

<div class="row justify-content-md-center">
  <div class="col-md-auto mt-2">
    <%= I18n.t('charts.usage.show.data_available', supply: supply.to_s.titleize, from_date: nice_dates(chart_config[:earliest_reading]), to_date: nice_dates(chart_config[:last_reading])) %>
  </div>
</div>