sx-fc/app/views/reports/induty/index.html.erb

<div class="page-header">
  <ol class="breadcrumb">
    <li class="breadcrumb-item"><a href="<%= root_path %>"><%= t("views.right_panel.button.home") %></a></li>
    <li class="breadcrumb-item active"><%= t("views.right_panel.detail.induty_report") %></li>
    <span class="float-right">
      <%= link_to 'Back', dashboard_path %>
    </span>
  </ol>
</div>
<div class="row">
	<div class="col-md-12">
		<%= render :partial=>'shift_sale_report_filter',
		:locals=>{ 	:period_type => true, :commissioners => true, :shift_name => true, :report_path =>reports_induty_index_path} %>

		<hr />

		<div class="text-right">
			<a href="javascript:export_to('<%=reports_induty_index_path%>.xls')" class = "btn btn-info wave-effects "><%= t("views.btn.exp_to_excel") %></a>
		</div>

		<div class="margin-top-20">
			<div class="card">
				<div class="table-responsive">
					<table class="table table-striped" id="items_table" border="0">
						<thead>
							<tr>
								<th colspan="7"> <%= t("views.right_panel.detail.from_date") %> : <%= @from.utc.getlocal.strftime("%Y-%b-%d") rescue '-' %>  - <%= t("views.right_panel.detail.to_date") %> : <%= @to.utc.getlocal.strftime("%Y-%b-%d")  rescue '-'%></th>
							</tr>
							<% if @shift_from %>
							<tr>
								<% if @shift_data.employee %>
								<% cashier_name = !@shift_data.nil? ? @shift_data.employee.name : '-' %>
								<% end %>
								<th colspan="7"> <%= t("views.right_panel.detail.shift_name") %> =  <%= @shift_from %> - <%= @shift_to %> ( <%= cashier_name %> )</th>
							</tr>
							<% end %>
							<tr>
								<th>&nbsp;</th>
								<th><%= t("views.right_panel.detail.receipt_no") %></th>
								<th><%= t :commissioners %></th>
								<th><%= t :table %></th>
								<th><%= t("views.right_panel.detail.in_time") %></th>
								<th><%= t("views.right_panel.detail.out_time") %></th>
							</tr>
						</thead>
						<tbody>
							<% if !@induty_data.nil? %>
								<% induty_arr = Array.new %>
								<% @induty_data.each do |induty| %>
									<tr>
										<td>&nbsp;</td>
										<td><%= induty.receipt_no %></td>
										<td><%= induty.name %></td>
										<td><%= induty.dining_name %></td>
										<td><%= induty.in_time.utc.getlocal.strftime("%d-%m-%Y - %I:%M") %></td>
										<td><%= induty.out_time.utc.getlocal.strftime("%d-%m-%Y - %I:%M") %></td>
									</tr>
								<% end %>
							<% end %>
						</tbody>
					</table>
				</div>
			</div>
		</div>
	</div>
</div>

<script>
	$(function(){


		var check_arr = [];

		var search = '<%= params[:period_type] %>';

		if(search){

			if(parseInt(search) == 0){
				search_by_period();
			}
			else{
				search_by_date();
			}
		}else{
			search_by_period();
		}

		$('#sel_period').change(function(){
			search_by_period();
		});

		function search_by_period(){
			var period = $('#sel_period').val();
			var period_type = 0;
			var from = "";
			var to = "";

			show_shift_name(period,period_type,from,to,'shift_item');
		}

		// OK button is clicked
		$('#from').bootstrapMaterialDatePicker().on('beforeChange', function(e, date){
			new_date = new Date(date) ;
			month    = parseInt(new_date.getMonth()+1)
			from = new_date.getDate() + "-" + month + "-" + new_date.getFullYear();
			$('#from').val(from)
			search_by_date();
		});
		$('#to').bootstrapMaterialDatePicker().on('beforeChange', function(e, date){
			new_date = new Date(date) ;
			month    = parseInt(new_date.getMonth()+1)
			to = new_date.getDate() + "-" + month + "-" + new_date.getFullYear();
			$('#to').val(to)
			search_by_date();
		});

		function search_by_date(){
			from = $("#from").val();
	  		to   = $("#to").val();
			var period = 0;
			var period_type = 1;

			if(to != '' && from != ''){
				shift_name = from + ',' + to;

				check_arr.push(to);

				if(check_arr.length == 1){
					show_shift_name(period,period_type,from,to,'shift_item');
				}
				if(check_arr.length == 3){
					check_arr = [];
				}
			}

		}

		function show_shift_name(period,period_type,from,to,shift_item){
			var shift = $('#shift_name');
			if (from == '' && to == '') {
				from = $("#from").val();
	  		    to   = $("#to").val();
			}
			shift.empty();
			var selected = '';
			var str = '';
			var param_shift = '<%= params[:shift_name]%>';

			url = '<%= reports_get_shift_by_induty_path %>';
			$.get(url, {period :period, period_type :period_type, from :from, to :to, report_type :shift_item} , function(data){

				str = '<option value="0">--- All Shift ---</option>';
				$(data.message).each(function(index){

					var local_date = data.message[index].local_opening_date + ' - ' + data.message[index].local_closing_date;
					var sh_date = data.message[index].opening_date + ' - ' + data.message[index].closing_date;
					var shift_id = data.message[index].shift_id ;

					if(param_shift != ''){
						if(shift_id == param_shift){
							selected = 'selected = "selected"';
						}
						else{
							selected = '';
						}
					}
					else{
						selected = '';
					}


					str += '<option value="'+ shift_id +'" '+ selected +'>' + local_date + '</option>';

			   // console.log(sh_date)
			})
				shift.append(str);
			});
		}

	});
</script>