Fixed setting of colors for special JO rows. #674
This commit is contained in:
Korina Cordero
parent
fe0243a4cc
commit
a67ec1ec11
2 changed files with 104 additions and 99 deletions
|
|
@ -157,13 +157,13 @@ span.has-danger,
|
|||
|
||||
.m-table__row--is_vip td {
|
||||
background-color: #ffff00 !important;
|
||||
color: #fff !important;
|
||||
color: #414a4c !important;
|
||||
}
|
||||
|
||||
.m-table__row--is_vip td > span,
|
||||
.m-table__row--is_vip td > span a,
|
||||
.m-table__row--is_vip td > span a i {
|
||||
color: #fff !important;
|
||||
color: #414a4c !important;
|
||||
}
|
||||
|
||||
.m-table__row--is_emergency td {
|
||||
|
|
|
|||
|
|
@ -45,106 +45,111 @@
|
|||
{% endblock %}
|
||||
|
||||
{% block scripts %}
|
||||
<script>
|
||||
$(function() {
|
||||
var options = {
|
||||
data: {
|
||||
type: 'remote',
|
||||
source: {
|
||||
read: {
|
||||
url: '{{ url('jo_proc_rows') }}',
|
||||
method: 'POST'
|
||||
}
|
||||
},
|
||||
saveState: {
|
||||
cookie: false,
|
||||
webstorage: false
|
||||
},
|
||||
pageSize: 10,
|
||||
serverPaging: true,
|
||||
serverFiltering: true,
|
||||
serverSorting: true
|
||||
},
|
||||
rows: {
|
||||
beforeTemplate: function (row, data, index) {
|
||||
// TODO: create function getRowColor that will return
|
||||
// what class to display
|
||||
if (data.is_vip) {
|
||||
console.log('is vip');
|
||||
$(row).addClass('m-table__row--is_vip');
|
||||
}
|
||||
if ($(row).hasClass('m-table__row--is_vip') == false) {
|
||||
if (data.flag_advance) {
|
||||
$(row).addClass('m-table__row--danger');
|
||||
}
|
||||
<script>
|
||||
$(function() {
|
||||
var options = {
|
||||
data: {
|
||||
type: 'remote',
|
||||
source: {
|
||||
read: {
|
||||
url: '{{ url('jo_proc_rows') }}',
|
||||
method: 'POST'
|
||||
}
|
||||
},
|
||||
saveState: {
|
||||
cookie: false,
|
||||
webstorage: false
|
||||
},
|
||||
pageSize: 10,
|
||||
serverPaging: true,
|
||||
serverFiltering: true,
|
||||
serverSorting: true
|
||||
},
|
||||
rows: {
|
||||
beforeTemplate: function (row, data, index) {
|
||||
var attribute = getRowAttribute(data);
|
||||
// check if we have to apply a background color for the row
|
||||
if (attribute) {
|
||||
var row_class = "m-table__row--" + attribute;
|
||||
$(row).addClass(row_class);
|
||||
}
|
||||
}
|
||||
},
|
||||
columns: [
|
||||
{
|
||||
field: 'id',
|
||||
title: 'JO Number'
|
||||
},
|
||||
{
|
||||
field: 'delivery_address',
|
||||
title: 'Customer Area'
|
||||
},
|
||||
{
|
||||
field: 'type',
|
||||
title: 'Schedule'
|
||||
},
|
||||
{
|
||||
field: 'date_schedule',
|
||||
title: 'Scheduled Date'
|
||||
},
|
||||
{
|
||||
field: 'status',
|
||||
title: 'Status'
|
||||
},
|
||||
{
|
||||
field: 'processor',
|
||||
title: 'Dispatcher'
|
||||
},
|
||||
{
|
||||
field: 'Actions',
|
||||
width: 110,
|
||||
title: 'Actions',
|
||||
sortable: false,
|
||||
overflow: 'visible',
|
||||
template: function (row, index, datatable) {
|
||||
var actions = '<a href="' + row.meta.update_url + '" class="m-portlet__nav-link btn m-btn m-btn--hover-accent m-btn--icon m-btn--icon-only m-btn--pill btn-edit" title="View / Edit"><i class="la la-edit"></i></a>';
|
||||
|
||||
if (data.is_mobile) {
|
||||
$(row).addClass('m-table__row--is_mobile');
|
||||
}
|
||||
if (data.is_emergency) {
|
||||
console.log('is emergency');
|
||||
$(row).addClass('m-table__row--is_emergency');
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
columns: [
|
||||
{
|
||||
field: 'id',
|
||||
title: 'JO Number'
|
||||
},
|
||||
{
|
||||
field: 'delivery_address',
|
||||
title: 'Customer Area'
|
||||
},
|
||||
{
|
||||
field: 'type',
|
||||
title: 'Schedule'
|
||||
},
|
||||
{
|
||||
field: 'date_schedule',
|
||||
title: 'Scheduled Date'
|
||||
},
|
||||
{
|
||||
field: 'status',
|
||||
title: 'Status'
|
||||
},
|
||||
{
|
||||
field: 'processor',
|
||||
title: 'Dispatcher'
|
||||
},
|
||||
{
|
||||
field: 'Actions',
|
||||
width: 110,
|
||||
title: 'Actions',
|
||||
sortable: false,
|
||||
overflow: 'visible',
|
||||
template: function (row, index, datatable) {
|
||||
var actions = '<a href="' + row.meta.update_url + '" class="m-portlet__nav-link btn m-btn m-btn--hover-accent m-btn--icon m-btn--icon-only m-btn--pill btn-edit" title="View / Edit"><i class="la la-edit"></i></a>';
|
||||
{% if is_granted('jo_proc.unlock') %}
|
||||
if (row.meta.unlock_url != '') {
|
||||
actions += '<a href="' + row.meta.unlock_url + '" class="m-portlet__nav-link btn m-btn m-btn--hover-accent m-btn--icon m-btn--icon-only m-btn--pill btn-edit" title="Unlock"><i class="fa fa-unlock"></i></a>';
|
||||
}
|
||||
{% endif %}
|
||||
|
||||
{% if is_granted('jo_proc.unlock') %}
|
||||
if (row.meta.unlock_url != '') {
|
||||
actions += '<a href="' + row.meta.unlock_url + '" class="m-portlet__nav-link btn m-btn m-btn--hover-accent m-btn--icon m-btn--icon-only m-btn--pill btn-edit" title="Unlock"><i class="fa fa-unlock"></i></a>';
|
||||
}
|
||||
{% endif %}
|
||||
return actions;
|
||||
},
|
||||
}
|
||||
],
|
||||
search: {
|
||||
onEnter: false,
|
||||
input: $('#data-rows-search'),
|
||||
delay: 400
|
||||
}
|
||||
};
|
||||
|
||||
return actions;
|
||||
},
|
||||
}
|
||||
],
|
||||
search: {
|
||||
onEnter: false,
|
||||
input: $('#data-rows-search'),
|
||||
delay: 400
|
||||
}
|
||||
};
|
||||
var table = $("#data-rows").mDatatable(options);
|
||||
|
||||
var table = $("#data-rows").mDatatable(options);
|
||||
// auto refresh table
|
||||
setInterval(function() {
|
||||
table.reload();
|
||||
}, {{ table_refresh_rate }});
|
||||
});
|
||||
|
||||
// auto refresh table
|
||||
setInterval(function() {
|
||||
table.reload();
|
||||
}, {{ table_refresh_rate }});
|
||||
});
|
||||
</script>
|
||||
function getRowAttribute(data) {
|
||||
if (data.is_vip) {
|
||||
return 'is_vip';
|
||||
}
|
||||
if (data.is_emergency) {
|
||||
return 'is_emergency';
|
||||
}
|
||||
if (data.flag_advance) {
|
||||
return 'danger';
|
||||
}
|
||||
if (data.is_mobile) {
|
||||
return 'is_mobile';
|
||||
}
|
||||
|
||||
return false;
|
||||
};
|
||||
|
||||
</script>
|
||||
{% endblock %}
|
||||
|
|
|
|||
Loading…
Reference in a new issue