Olajcsere Modal átalakítva
This commit is contained in:
parent
a190714cfb
commit
4e90752205
|
|
@ -10,31 +10,51 @@ link(rel='stylesheet', type='text/css', href='https://unpkg.com/lightpick@latest
|
|||
.modal-content
|
||||
.modal-header#oilChangeHeader.bg-primary(style="background: Primary")
|
||||
h4#vehicleId.modal-title A
|
||||
.modal-body
|
||||
.form-group
|
||||
label.form-label(for='oilChangePicker') Olaj csere időpontja
|
||||
.input-group
|
||||
input.form-control(id='oilChangePicker',required,placeholder='Olaj csere időpontja',name='oilChangePicker',type=text, tabindex='2',readonly,style='background-color:#c9ddfc;')
|
||||
span.input-group-addon
|
||||
span.glyphicon.glyphicon-calendar
|
||||
.form-group
|
||||
//-input#oilChangeLast.form-control(name="oilChangeLast" readonly min=0 type='number')
|
||||
.input-group
|
||||
span.input-group-addon.transparent
|
||||
span.glyphicon.glyphicon-user
|
||||
input#oilChangeKilometer.form-control(name="oilChangeKilometer" placeholder='Óra állás olajcsere után' min=0 type='number')
|
||||
p.help-block.hidden Please enter a name 3 characters or more.
|
||||
.modal-footer
|
||||
.modal-body(style='background-color:#4f5b69')
|
||||
.container(style='width:100%;')
|
||||
#darktable.container
|
||||
table#oilChangeTable(style='width:100%;')
|
||||
col(width='2%')
|
||||
col(width='10%')
|
||||
col(width='10%')
|
||||
|
||||
thead
|
||||
tr
|
||||
th
|
||||
h1(style='text-align:right') #
|
||||
th
|
||||
h1(style='text-align:center') Időpont
|
||||
th
|
||||
h1(style='text-align:center') Kilométer óra állás
|
||||
tbody
|
||||
|
||||
.modal-footer(style="background-color: #2C3446")
|
||||
button.btn.btn-primary(type='button', data-dismiss='modal')
|
||||
i.fa.fa-arrow-left
|
||||
| | Bezár
|
||||
button#oilChangeSave.btn.btn-primary(type='button' )
|
||||
i.fa.fa-save
|
||||
| | Mentés
|
||||
button.btn.btn-primary(data-toggle='modal',data-target='#oilChangeNewModal',style='width:40px;',type='button')
|
||||
i.fa.fa-tint
|
||||
script(type='text/javascript', src='/bower_components/moment/min/moment.min.js')
|
||||
script(src='https://unpkg.com/lightpick@latest/lightpick.js')
|
||||
|
||||
script.
|
||||
// Generate Table
|
||||
var createOilChangeTable=function (data){
|
||||
var sum=0;
|
||||
var consumption=0;
|
||||
$('#oilChangeTable > tbody').empty();
|
||||
if (data)
|
||||
{
|
||||
$.each(data.oilChangeLast,function(i,el){
|
||||
var newRow=$('<tr class="clickable-row" id='+el._id+' data-href=/employee/detailstemp/'+el._id+'>"'+//);
|
||||
'<td style="text-align:right">'+(i+1)+'</td>'+
|
||||
'<td style="text-align:center">'+moment(el.dateTime).format("YYYY.MM.DD")+'</td>'+
|
||||
'<td style="text-align:center">'+el.kilometer.toLocaleString('hu-HU')+' km'+'</td>'+
|
||||
'</tr>');
|
||||
$('#oilChangeTable > tbody:last-child').append (newRow);
|
||||
})
|
||||
}
|
||||
}
|
||||
//- Olajcsere modal
|
||||
$('#oilChangeModal').on('show.bs.modal', function () {
|
||||
$(this).find('form').trigger('reset');
|
||||
|
|
@ -46,64 +66,11 @@ script.
|
|||
$(this).find('#vehicleId').html($('<b> Olaj csere: '+ getVnameFromRow + '</b> <b style="float:right">'+getVidFromRow+'</b>' ))
|
||||
$.get('/vehicles/api/getVehicle/'+getIdFromRow,function(data)
|
||||
{
|
||||
//- $('#editVehicleName').val(data.name);
|
||||
//- $('#editVehiclePersons').val(data.persons);
|
||||
//- $('#editVehicleId').val(data.vehicle_id);
|
||||
//- $('#editOilChange').val(data.oilChangeInterval);
|
||||
//- $('#oilChangeKilometer').val(data.oilChangeLast);
|
||||
createOilChangeTable(data)
|
||||
$('#oilChangeLast').val(data.oilChangeLast);
|
||||
})
|
||||
//- Mentés
|
||||
|
||||
})
|
||||
$( "#oilChangeSave" ).click(function() {
|
||||
|
||||
event.preventDefault();
|
||||
//-validate name
|
||||
var th=$(this);
|
||||
var oilChangeKilometer = $('#oilChangeKilometer').val();
|
||||
var oilChangeLast=$('#oilChangeLast').val();
|
||||
var oilChangeDate=picker.getDate();
|
||||
const editId = $('#vehicleId').val();
|
||||
if (oilChangeKilometer.length < 4) {
|
||||
return showErrorSuccess($('#oilChangeKilometer'), false, 'Legalláb 4 karakter!');
|
||||
}
|
||||
if (oilChangeKilometer<=oilChangeLast) {
|
||||
return showErrorSuccess($('#oilChangeKilometer'), false, 'Az olajcsere óra állása nem lehet kisebb, mint az előző!');
|
||||
}
|
||||
//- disable button
|
||||
$(this).prop("disabled", true);
|
||||
//- add spinner to button
|
||||
$(this).html('<i class="fa fa-circle-o-notch fa-spin"></i> Várjon!');
|
||||
showErrorSuccess($('#oilChangeKilometer'));
|
||||
$.post( "/vehicles/api/oilchangeVehicle/"+editId, { oilChangeLast:oilChangeKilometer,oilChangeDate:oilChangeDate.toISOString()})
|
||||
.done(function( data ) {
|
||||
// disable button
|
||||
th.prop("disabled", false);
|
||||
// add spinner to buttoni.fa.fa-save
|
||||
th.html('<i class="fa fa-save"></i> Mentés');
|
||||
$('.modal-backdrop').remove()
|
||||
$('#oilChangeModal').hide();
|
||||
|
||||
}).fail(function(xhr,status,error){
|
||||
alert( "Hiba: " + xhr.responseText );
|
||||
// disable button
|
||||
th.prop("disabled", false);
|
||||
// add spinner to buttoni.fa.fa-save
|
||||
th.html('<i class="fa fa-save"></i> Mentés');
|
||||
})
|
||||
|
||||
});
|
||||
var picker = new Lightpick({ field: document.getElementById('oilChangePicker'),
|
||||
singleDate: true,
|
||||
inline: false,
|
||||
//numberOfColumns: 2,
|
||||
//numberOfMonths: 4,
|
||||
format: 'YYYY.MM.DD',
|
||||
disableWeekends: false,
|
||||
maxDate: moment(),
|
||||
//maxDays: remaining,
|
||||
//disableDates: [['21.09.2020', '22.09.2020'], ['24.09.2020', '25.09.2020']],
|
||||
|
||||
|
||||
});
|
||||
|
||||
|
|
@ -0,0 +1,140 @@
|
|||
link(rel='stylesheet', type='text/css', href='https://unpkg.com/lightpick@latest/css/lightpick.css')
|
||||
#oilChangeNewModal.modal(tabindex='-1',
|
||||
role='dialog',
|
||||
aria-labelledby='oilChangeModalLabel',
|
||||
aria-hidden='true',
|
||||
|
||||
)
|
||||
//-form(method='GET',id='holidayForm' action='/employee/holidays_byperson/')
|
||||
.modal-dialog(role='document', style='width:720px')
|
||||
.modal-content
|
||||
.modal-header#oilChangeHeader.bg-primary(style="background: Primary")
|
||||
h4#vehicleIdoc.modal-title A
|
||||
.modal-body(style='background-color:#4f5b69')
|
||||
.container(style='width:100%;')
|
||||
.form-group
|
||||
label.form-label(for='oilChangePicker') Olaj csere időpontja
|
||||
.input-group
|
||||
input.form-control(id='oilChangePicker',required,placeholder='Olaj csere időpontja',name='oilChangePicker',type=text, tabindex='2',readonly,style='background-color:#c9ddfc;')
|
||||
span.input-group-addon
|
||||
span.glyphicon.glyphicon-calendar
|
||||
br
|
||||
.row
|
||||
.col-sm-6
|
||||
.form-group
|
||||
input#vehicleId.form-control(name='vehicleId',type=text,readonly,required, style='display:none;')
|
||||
label.form-label(for='select-vehicle') Rendszám
|
||||
select#select-vehicle.form-control(required,data-live-search='true')
|
||||
option.selected.disabled(data-tokens='') Válasszon járművet
|
||||
.col-sm-6
|
||||
.form-group
|
||||
label.form-label(for='select-vehicle') Kilométeróra állás
|
||||
.input-group
|
||||
span.input-group-addon.transparent
|
||||
span.glyphicon.glyphicon-dashboard
|
||||
input#oilChangeKilometer.form-control(name="oilChangeKilometer" placeholder='Óra állás olajcsere után' min=0 type='number')
|
||||
p.help-block.hidden Please enter a name 3 characters or more.
|
||||
|
||||
|
||||
.modal-footer(style="background-color: #2C3446")
|
||||
button.btn.btn-primary(type='button', data-dismiss='modal')
|
||||
i.fa.fa-arrow-left
|
||||
| | Bezár
|
||||
button#oilChangeSave.btn.btn-primary(type='button' )
|
||||
i.fa.fa-save
|
||||
| | Mentés
|
||||
script(src='/bower_components/jquery/dist/jquery.js')
|
||||
script(type='text/javascript', src='/bower_components/moment/min/moment.min.js')
|
||||
script(src='https://unpkg.com/lightpick@latest/lightpick.js')
|
||||
|
||||
script.
|
||||
//- Olajcsere modal
|
||||
$('#oilChangeNewModal').on('show.bs.modal', function () {
|
||||
var getIdFromRow = $('#vehicleId').val()
|
||||
if (getIdFromRow) // Ha kaptunk Id-t Kiválasztjuk a listából!
|
||||
{
|
||||
$.get('/vehicles/api/getVehicle/'+getIdFromRow,function(data)
|
||||
{
|
||||
$('#vehicleIdoc').html($('<b> Olaj csere: '+ data.name + '</b> <b style="float:right">'+data.vehicle_id+'</b>' ))
|
||||
$('#select-vehicle').val(getIdFromRow);
|
||||
$('#select-vehicle').attr('disabled',true)
|
||||
})
|
||||
}
|
||||
else
|
||||
{
|
||||
$('#select-vehicle').attr('disabled',false)
|
||||
}
|
||||
$(this).find('form').trigger('reset');
|
||||
$(this).find('#vehicleIdoc').html($('<b>Olaj csere hozzáadás</b> <b style="float:right">'+'</b>' ))
|
||||
//- Mentés
|
||||
})
|
||||
$( "#oilChangeSave" ).click(function() {
|
||||
|
||||
event.preventDefault();
|
||||
//-validate name
|
||||
var th=$(this);
|
||||
var oilChangeKilometer = $('#oilChangeKilometer').val();
|
||||
var oilChangeLast=$('#oilChangeLast').val();
|
||||
var oilChangeDate=picker.getDate();
|
||||
const editId = $('#select-vehicle').val();
|
||||
if (oilChangeKilometer.length < 4) {
|
||||
return showErrorSuccess($('#oilChangeKilometer'), false, 'Legalláb 4 karakter!');
|
||||
}
|
||||
if (oilChangeKilometer<=oilChangeLast) {
|
||||
return showErrorSuccess($('#oilChangeKilometer'), false, 'Az olajcsere óra állása nem lehet kisebb, mint az előző!');
|
||||
}
|
||||
//- disable button
|
||||
$(this).prop("disabled", true);
|
||||
//- add spinner to button
|
||||
$(this).html('<i class="fa fa-circle-o-notch fa-spin"></i> Várjon!');
|
||||
showErrorSuccess($('#oilChangeKilometer'));
|
||||
$.post( "/vehicles/api/oilchangeVehicle/"+editId, { oilChangeLast:oilChangeKilometer,oilChangeDate:oilChangeDate.toISOString()})
|
||||
.done(function( data ) {
|
||||
// disable button
|
||||
th.prop("disabled", false);
|
||||
// add spinner to buttoni.fa.fa-save
|
||||
th.html('<i class="fa fa-save"></i> Mentés');
|
||||
$('.modal-backdrop').remove()
|
||||
$('#oilChangeNewModal').hide();
|
||||
|
||||
}).fail(function(xhr,status,error){
|
||||
alert( "Hiba: " + xhr.responseText );
|
||||
// disable button
|
||||
th.prop("disabled", false);
|
||||
// add spinner to buttoni.fa.fa-save
|
||||
th.html('<i class="fa fa-save"></i> Mentés');
|
||||
})
|
||||
|
||||
});
|
||||
$('#select-vehicle').empty();
|
||||
$('#select-vehicle').on('change',function() {
|
||||
var id=$(this).val();
|
||||
|
||||
$.get('/vehicles/api/getVehicle/'+id,function(data)
|
||||
{
|
||||
$('#vehicleIdoc').html($('<b> Olaj csere: '+ data.name + '</b> <b style="float:right">'+data.vehicle_id+'</b>' ))
|
||||
})
|
||||
});
|
||||
$('#select-vehicle').append('<option selected disabled data-tokens=""'+'"> Válasszon járművet</option>');
|
||||
$.get('/vehicles/api/getVehicles',function(data)
|
||||
{
|
||||
data.forEach((element)=>{
|
||||
console.log(element.vehicle_id+' '+element.name)
|
||||
$('#select-vehicle').append('<option value="'+element._id+'">'+element.vehicle_id+' '+element.name+'</option>');
|
||||
})
|
||||
}
|
||||
)
|
||||
var picker = new Lightpick({ field: document.getElementById('oilChangePicker'),
|
||||
singleDate: true,
|
||||
inline: false,
|
||||
//numberOfColumns: 2,
|
||||
//numberOfMonths: 4,
|
||||
format: 'YYYY.MM.DD',
|
||||
disableWeekends: false,
|
||||
maxDate: moment(),
|
||||
//maxDays: remaining,
|
||||
//disableDates: [['21.09.2020', '22.09.2020'], ['24.09.2020', '25.09.2020']],
|
||||
|
||||
|
||||
});
|
||||
|
||||
|
|
@ -20,6 +20,7 @@ block content
|
|||
overflow: auto;
|
||||
display:inline-block;
|
||||
}
|
||||
include Modals/modal_oilChangeNew
|
||||
#refuelModal.modal(tabindex='-1', role='dialog', aria-labelledby='refuelModalLabel', aria-hidden='true')
|
||||
form(method='POST',id='refuelForm' data-toggle="validator" role="form" action='/vehicles/api/refueling/')
|
||||
.modal-dialog(role='document', style='width:620px')
|
||||
|
|
@ -99,6 +100,8 @@ block content
|
|||
|
||||
a.btn.btn-primary.col-sm-1(type='button',href='/gantt',value='Idővonal') Idővonal
|
||||
a.btn.btn-warning.col-sm-1(type='button',href='#',data-toggle='modal', data-target='#refuelModal') Tankolás
|
||||
button.btn.btn-primary(data-toggle='modal',data-target='#oilChangeNewModal',style='width:40px;',type='button')
|
||||
i.fa.fa-tint
|
||||
a.btn.btn-primary.col-sm-1(id='print',name='print',type='button')
|
||||
span.glyphicon.glyphicon-print(aria-hidden='true')
|
||||
| Nyomtat
|
||||
|
|
|
|||
|
|
@ -20,6 +20,7 @@ block content
|
|||
include Modals/modal_settings
|
||||
include Modals/modal_fuelingInfo
|
||||
include Modals/modal_oilChange
|
||||
include Modals/modal_oilChangeNew
|
||||
#vehicleModal.modal(tabindex='-1', role='dialog', aria-labelledby='vehicleModalLabel', aria-hidden='true')
|
||||
//-form(method='GET',id='holidayForm' action='/employee/holidays_byperson/')
|
||||
.modal-dialog(role='document', style='width:720px')
|
||||
|
|
|
|||
Loading…
Reference in New Issue