Mobile responsive for Transaction View

This commit is contained in:
code2lab
2019-05-30 15:27:30 +06:30
parent 0016318611
commit 5a1bbb3fb4
14 changed files with 353 additions and 296 deletions

View File

@@ -7,6 +7,13 @@
</span>
</ol>
</div>
<style>
@media screen and (max-width: 785px) {
section.content{
margin: 80px 5px 0 5px !important;
}
}
</style>
<div class="row">
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<div class="main-box-body clearfix p-l-5 p-r-5">
@@ -17,40 +24,40 @@
<td colspan="8">
<%= form_tag transactions_card_sale_trans_path, :method => :get do %>
<div class="row clearfix">
<div class="col-lg-3 col-md-3 col-sm-3 col-xs-3">
<div class="col-lg-3 col-md-3 col-sm-3 col-xs-3 mbl-style">
<label><%= t("views.right_panel.detail.enter_keyboards") %></label>
<input type="text" id="sale_id" name="sale_id" class="form-control" placeholder="Sale ID/ Customer Name/ Cashier Name" style="margin-right: 10px;height: 34px;">
</div>
<% if defined? @payment_method %>
<div class="col-lg-2 col-md-2 col-sm-2">
<div class="col-lg-2 col-md-2 col-sm-2 col-mbl-view mbl-style">
<label class="font-14"><%= t("views.right_panel.detail.select_payments") %></label>
<%= select_tag "payment_type", options_for_select(@payment_method, :selected => params[:payment_type]), :class => "form-control" %>
<%= select_tag "payment_type", options_for_select(@payment_method, :selected => params[:payment_type]), :class => "form-control" %>
</div>
<% end %>
<% if not defined? status %>
<div class="col-lg-2 col-md-2 col-sm-2">
<div class="col-lg-2 col-md-2 col-sm-2 col-mbl-view mbl-style">
<label class="font-14"><%= t("views.right_panel.detail.select_status") %></label>
<select name="status_type" id="status_type" class="form-control">
<% @status.each do |pm| %>
<option class="<%=pm[1].downcase%>" value="<%=pm[1].downcase%>"><%=pm[0]%></option>
<%end %>
</select>
</div>
</div>
<% end %>
<div class="col-lg-2 col-md-2 col-sm-2 col-xs-2">
<label class=""><%= t("views.right_panel.detail.from") %></label>
<div class="col-lg-2 col-md-2 col-sm-2 col-xs-2 col-mbl-view mbl-style">
<label class="mbl_lbl"><%= t("views.right_panel.detail.from") %></label>
<input class="form-control datepicker" name="from" id="from" type="text" placeholder="From date" style="height: 34px;">
</div>
<div class="col-lg-2 col-md-2 col-sm-2 col-xs-2">
<label class=""><%= t("views.right_panel.detail.to") %></label>
<div class="col-lg-2 col-md-2 col-sm-2 col-xs-2 col-mbl-view mbl-style">
<label class="mbl_lbl"><%= t("views.right_panel.detail.to") %></label>
<input class="form-control datepicker" name="to" id="to" type="text" placeholder="To date" style="height: 34px;">
</div>
<div class="col-lg-1 col-md-1 col-sm-1 col-xs-1">
<div class="col-lg-1 col-md-1 col-sm-1 col-xs-1 mbl-right-btn mbl-style">
<label></label>
<br><input type="submit" value="Search" class='btn btn-primary btn-md'>
</div>
@@ -58,12 +65,12 @@
<% end %>
</td>
</tr>
</tbody>
</table>
</div>
<div class="card" style="width:122%;">
<div class="table-responsive">
@@ -102,7 +109,7 @@
UnionPay
<% else %>
<%= cardSale.app %>
<% end %>
<% end %>
</td>
<td><%= cardSale.sale.customer.name rescue '-' %></td>
<td><%= cardSale.sale.cashier_name rescue '-' %></td>
@@ -111,18 +118,18 @@
TID : <%= cardSale.terminal_id %>
<br>
<% end %>
<% if cardSale.merchant_id != '' %>
<% if cardSale.merchant_id != '' %>
MID : <%= cardSale.merchant_id %>
<br>
<% end %>
<% if cardSale.batch_no != '' %>
<% if cardSale.batch_no != '' %>
Batch : <%= cardSale.batch_no %>
<br>
<% end %>
<% if cardSale.trace != '' %>
<% if cardSale.trace != '' %>
Trace : <%= cardSale.trace %>
<% end %>
</td>
<% end %>
</td>
<td><%= cardSale.status %></td>
</tr>
<% end %>
@@ -150,24 +157,24 @@
$('#status_type').val("<%= params[:status_type] %>");
$('#sale_id').val("<%= params[:sale_id] %>");
$('#sel_period').val("<%= params[:period] %>");
var check_arr = [];
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');
}
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) ;
@@ -182,32 +189,32 @@
to = new_date.getDate() + "-" + month + "-" + new_date.getFullYear();
$('#to').val(to);
search_by_date();
});
});
function search_by_date(){
from = $("#from").val();
to = $("#to").val();
to = $("#to").val();
var period = 0;
var period_type = 1;
var period_type = 1;
if(to != '' && from != ''){
shift_name = from + ',' + to;
check_arr.push(to);
console.log(check_arr.length)
if(check_arr.length == 1){
show_shift_name(period,period_type,from,to,'shift_item');
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 == '') {
@@ -215,18 +222,18 @@
to = $("#to").val();
}
shift.empty();
var str = '';
var param_shift = '';
var param_shift = '';
var param_shift = '<%= params[:shift_name] rescue '-'%>';
url = '<%= reports_get_shift_by_date_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){
$(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 ;
@@ -235,18 +242,18 @@
selected = 'selected = "selected"';
}
else{
selected = '';
}
selected = '';
}
}else{
selected = '';
}
selected = '';
}
str += '<option value="'+ shift_id +'" '+ selected +'>' + local_date + '</option>';
// console.log(sh_date)
})
})
shift.append(str);
});
}
});
</script>
</script>