<div class="p-l-15">
    <%= form_tag report_path, :method => :get, :id => "frm_report", :class => "form" do %>
    <% if period_type != false %>
    <div class="row">

              <!-- <div class="form-group col-md-3">
                <label class="">Select Date Range</label>
                <% if @daterange %>
                    <input class="form-control" name="daterange" id="daterange" value="<%= @daterange %>" type="text" placeholder="Date Range" readonly="true">
                <% else %>
                    <input class="form-control" name="daterange" id="daterange" type="text" placeholder="Date Range" readonly="true">
                <% end %>
            </div> -->
            <div class="col-lg-3 col-md-3 col-sm-3">          
                <!-- <label class="">Select Shift Period</label> -->
                <label class="font-14">From</label>
                <input data-behaviour='datepicker' class="form-control datepicker m-t-3" name="from" id="from" type="text" placeholder="From date" style="height: 32px;">
            </div>
            <div class="col-lg-3 col-md-3 col-sm-3">
                <label class="font-14">To</label>
                <input data-behaviour='datepicker' class="form-control datepicker m-t-3" name="to" id="to" type="text" placeholder="To date" style="height: 32px;">
            </div>
            <div class="form-group col-md-4">
                <label class="font-14">Definition Item</label>
                <select class="form-control" name="item_code" id="item_code">
                  <option value="">Select Product</option>
                  <% @inventory_definitions.each do |id| %>
                  <option value="<%= id.item_code %>">
                    <% menu_item = MenuItemInstance.find_by_item_instance_code(id.item_code) %>
                    <% if menu_item.nil? %>
                    <%= Product.find_by_item_code(id.item_code).name rescue "-" %>
                    <% else %>
                    <%= menu_item.menu_item.name rescue '-' %> - <%= menu_item.item_instance_name rescue '-' %>
                    <% end %>
                </option>
                <% end %>
            </select>
        </div>
        <div class="form-group col-md-2 margin-top-20"><br>
            <input type="submit" value="Generate Report" class='btn btn-primary'>
        </div>
              <!-- <div class="form-group col-md-2 margin-top-20">
                <input type="button" value="Clear Filter" id="clear_filter" class='btn btn-danger'>
            </div> -->
        </div>
        <% end %>

        <% end %>
    </div>

<script type="text/javascript">

    $(document).ready(function () {

       /* $('#item_code').select2({
            placeholder: 'Select Product',
            allowClear: true
        });*/

        // $('#clear_filter').click(function () {
        //     $('#daterange').val('');
        //     $('#item_code').val('').text('');
        // });

        // $('input[name="daterange"]').daterangepicker({
        //         autoUpdateInput: false,
        //         ranges: {
        //             'Today': [moment(), moment()],
        //             'Yesterday': [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
        //             'Last 7 Days': [moment().subtract(6, 'days'), moment()],
        //             'Last 30 Days': [moment().subtract(29, 'days'), moment()],
        //             'This Month': [moment().startOf('month'), moment().endOf('month')],
        //             'Last Month': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')]
        //         },
        //         locale: {
        //             format: 'YYYY-MM-DD'
        //         }
        //     },
        //     function (start, end, label) {
        //         $('input[name="daterange"]').val(start.format('YYYY-MM-DD') + ' - ' + end.format('YYYY-MM-DD'));
        //     });

        // $('input[name="daterange"]').on('apply.daterangepicker', function (ev, picker) {
        //     $('input[name="daterange"]').val(picker.startDate.format('YYYY-MM-DD') + ' - ' + picker.endDate.format('YYYY-MM-DD'));

        //     from_date = picker.startDate.format('YYYY-MM-DD 00:00:00');
        //     to_date = picker.endDate.format('YYYY-MM-DD 23:59:59');
        // });

        // $('input[name="daterange"]').on('cancel.daterangepicker', function (ev, picker) {
        //     $('input[name="daterange"]').val('');
        // });

    });

</script>
