265 lines
12 KiB
Plaintext
265 lines
12 KiB
Plaintext
@using EnVisage.Code
|
|
@using EnVisage.Code.HtmlHelpers
|
|
@model EnVisage.Models.TrainingModel
|
|
@{
|
|
var resources = string.Join("','", Model.Resources);
|
|
resources = "'" + resources + "'";
|
|
var weekEndsStr = string.Empty;
|
|
foreach (var dateTime in Model.Weekends)
|
|
{
|
|
if (!string.IsNullOrEmpty(weekEndsStr))
|
|
{
|
|
weekEndsStr += ",";
|
|
}
|
|
weekEndsStr += "'" + dateTime.ToShortDateString() + "'";
|
|
}
|
|
}
|
|
|
|
<script type="text/javascript">
|
|
function initTrainings() {
|
|
multik = $("#@Html.ClientIdFor(model=>model.Resources)").select2({
|
|
placeholder: "Select resources",
|
|
onSelect: function(a, b) {
|
|
}
|
|
}).on('change', updateSliderTitle);
|
|
var resources = [@Html.Raw(resources)];
|
|
fillResources(resources);
|
|
|
|
multik1 = $("#@Html.ClientIdFor(model=>model.Weekends)").select2({
|
|
placeholder: "Select weekends",
|
|
onSelect: function (a, b) {
|
|
}
|
|
}).on('change', updateSliderTitle);
|
|
var resources = [@Html.Raw(resources)];
|
|
var weekEnds = [@Html.Raw(weekEndsStr)];
|
|
fillWeekDays(weekEnds);
|
|
|
|
var slider = $('#@Html.ClientIdFor(model => model.TrainingTimeAllocated)_container').slider({
|
|
'range': 'min',
|
|
'min': 0,
|
|
'max': 100,
|
|
'value': $('#@Html.ClientIdFor(model => model.TrainingTimeAllocated)_container .sliderValue').val(),
|
|
change: function (event, ui) {
|
|
onPercentageChange(event, ui, $(this));
|
|
//$("#@Html.ClientIdFor(model=>model.TrainingTimeAllocated)").val(ui.value);
|
|
},
|
|
slide: function (event, ui) {
|
|
onPercentageSlide(event, ui, $(this));
|
|
//$("#@Html.ClientIdFor(model=>model.TrainingTimeAllocated)").val(ui.value);
|
|
}
|
|
});
|
|
|
|
|
|
$('#trainingForm .datepicker').datepicker().on('changeDate', function (date) {
|
|
calcDiff();
|
|
});
|
|
|
|
$('#@Html.ClientIdFor(model => model.TrainingStartDate)').change(onDateChange);
|
|
$('#@Html.ClientIdFor(model => model.TrainingEndDate)').change(onDateChange);
|
|
|
|
$('#btnSaveTraining').click(function () {
|
|
if ($('#trainingForm').valid())
|
|
blockUI();
|
|
});
|
|
}
|
|
|
|
function onDateChange(ctrl, e) {
|
|
var sd = new Date($('#@Html.ClientIdFor(model => model.TrainingStartDate)').val());
|
|
var ed = new Date($('#@Html.ClientIdFor(model => model.TrainingEndDate)').val());
|
|
$('#@Html.ClientIdFor(model => model.TrainingDuration)').val(Math.round((ed - sd) / (1000 * 60 * 60 * 24)) + 1);
|
|
|
|
fillWeekDays();
|
|
}
|
|
|
|
function fillWeekDays(preselected) {
|
|
var selected = [];
|
|
if (preselected != null)
|
|
selected = preselected;
|
|
else {
|
|
$('#@Html.ClientIdFor(model => model.Weekends) :selected').each(function (ind, s) {
|
|
selected[ind] = $(s).val();
|
|
});
|
|
}
|
|
multik1.select2('val', '');
|
|
$('#@Html.ClientIdFor(model => model.Weekends) optgroup').remove();
|
|
//debugger;
|
|
var sd = new Date($('#@Html.ClientIdFor(model => model.TrainingStartDate)').val());
|
|
var ed = new Date($('#@Html.ClientIdFor(model => model.TrainingEndDate)').val());
|
|
var weekEndingDay = parseInt($('#@Html.ClientIdFor(model => model.WeekendingDay)').val());
|
|
if (isNaN(sd))
|
|
return;
|
|
if (isNaN(ed))
|
|
return;
|
|
|
|
var weekEndingDate = new Date(sd);
|
|
if (weekEndingDate.getDay() != weekEndingDay) {
|
|
weekEndingDate = addDays(weekEndingDate, Math.abs(weekEndingDate.getDay() - weekEndingDay));
|
|
}
|
|
if (ed.getDay() != weekEndingDay) {
|
|
ed = addDays(ed, Math.abs(ed.getDay() - weekEndingDay));
|
|
}
|
|
var dt = new Date(addDays(weekEndingDate, -6));
|
|
var optgroup = $('<optgroup>');
|
|
optgroup.attr('label', 'Week ' + (weekEndingDate.getMonth() + 1) + '/' + weekEndingDate.getDate() + '/' + weekEndingDate.getFullYear());
|
|
while (dt <= ed) {
|
|
if (dt > weekEndingDate) {
|
|
weekEndingDate = addDays(weekEndingDate, 7);
|
|
multik1.append(optgroup);
|
|
optgroup = $('<optgroup>');
|
|
optgroup.attr('label', 'Week ' + (weekEndingDate.getMonth() + 1) + '/' + weekEndingDate.getDate() + '/' + weekEndingDate.getFullYear());
|
|
}
|
|
var option = $("<option></option>");
|
|
option.val((dt.getMonth() + 1) + '/' + dt.getDate() + '/' + dt.getFullYear());
|
|
option.text(days[dt.getDay()] + ', ' + (dt.getMonth() + 1) + '/' + dt.getDate() + '/' + dt.getFullYear());
|
|
optgroup.append(option);
|
|
dt = addDays(dt, 1);
|
|
}
|
|
multik1.append(optgroup);
|
|
multik1.select2('val', selected);
|
|
}
|
|
|
|
function addDays(date, days) {
|
|
return new Date(date.getTime() + days * 24 * 60 * 60 * 1000);
|
|
}
|
|
|
|
function calcDiff() {
|
|
var d1 = $($('#trainingForm .datepicker')[0]).datepicker().data().datepicker.dates;
|
|
var d2 = $($('#trainingForm .datepicker')[1]).datepicker().data().datepicker.dates;
|
|
var diff = 0;
|
|
if (d1 && d2) {
|
|
diff = Math.floor((d2[0].getTime() - d1[0].getTime()) / 86400000) + 1; // ms per day
|
|
}
|
|
$('[name="@Html.ClientIdFor(model=>model.TrainingDuration)"]').val(diff);
|
|
}
|
|
|
|
function updateSliderTitle() {
|
|
|
|
}
|
|
|
|
function fillResources(preselected) {
|
|
var selected = [];
|
|
if (preselected != null)
|
|
selected = preselected;
|
|
else {
|
|
|
|
}
|
|
multik.select2('val', selected);
|
|
}
|
|
|
|
function onFailure(xhr) {
|
|
//debugger;
|
|
unblockUI();
|
|
$('#trainingReload').html(xhr.responseText);
|
|
initTrainings();
|
|
}
|
|
function onSuccess(data) {
|
|
//debugger;
|
|
unblockUI();
|
|
var href = document.location.href;
|
|
if (href.substr(href.length - 1) == '#')
|
|
href = href.substr(0, href.length - 1);
|
|
document.location.href = href;
|
|
}
|
|
|
|
function onPercentageSlide(event, ui, obj) {
|
|
var value = ui.value;
|
|
obj.children(".sliderValue").val(value);
|
|
obj.children(".sliderTitle").html(value + '%');
|
|
}
|
|
|
|
function onPercentageChange(event, ui, obj) {
|
|
var value = ui.value;
|
|
obj.children(".sliderValue").val(value);
|
|
obj.children(".sliderTitle").html(value + '%');
|
|
}
|
|
</script>
|
|
@using (Ajax.BeginForm("ScheduleTraining", "PeopleResource", new AjaxOptions { HttpMethod = "Post", OnSuccess = "onSuccess", OnFailure = "onFailure(xhr)", UpdateTargetId = "trainingReload" }, new { @id = "trainingForm" }))
|
|
{
|
|
@Html.AntiForgeryToken()
|
|
@Html.HiddenFor(model => model.Id)
|
|
@Html.HiddenFor(t=>t.WeekendingDay)
|
|
@Html.ValidationSummary(false, "The training schedule could not be saved due to the following errors:")
|
|
|
|
<div class="modal-header">
|
|
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button>
|
|
<h4 class="modal-title" >Schedule Training</h4>
|
|
</div>
|
|
<div class="modal-body">
|
|
|
|
|
|
<div class="form-group">
|
|
@Html.LabelFor(model => model.TrainingName, new { @class = "col-sm-3 control-label" })
|
|
<div class="col-sm-9">
|
|
@Html.TextBoxFor(model => model.TrainingName, new { @class = "form-control" })
|
|
@Html.ValidationMessageFor(model => model.TrainingName)
|
|
</div>
|
|
</div>
|
|
<div class="form-group">
|
|
@Html.LabelFor(model => model.TrainingStartDate, new { @class = "col-sm-3 control-label" })
|
|
<div class="col-sm-9">
|
|
@Html.EditorFor(model => model.TrainingStartDate, new { @class = "form-control" })
|
|
@Html.ValidationMessageFor(model => model.TrainingStartDate)
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
@Html.LabelFor(model => model.TrainingEndDate, new { @class = "col-sm-3 control-label" })
|
|
<div class="col-sm-9">
|
|
@Html.EditorFor(model => model.TrainingEndDate, new { @class = "form-control" })
|
|
@Html.ValidationMessageFor(model => model.TrainingEndDate)
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
@Html.LabelFor(model => model.TrainingDuration, new { @class = "col-sm-3 control-label" })
|
|
<div class="col-sm-9">
|
|
@Html.TextBoxFor(model => model.TrainingDuration, new { @class = "form-control", @Readonly = "true" })
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
@Html.LabelFor(model => model.Weekends, new { @class = "col-sm-3 control-label" })
|
|
<div class="col-sm-9 select2-primary">
|
|
@Html.EditorFor(model => model.Weekends)
|
|
@Html.ValidationMessageFor(model => model.Weekends)
|
|
<p class="help-block text-sm">Make sure you select weekend days for the whole weeks but not only within training's date range.</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
@Html.LabelFor(model => model.TrainingTypeId, new { @class = "col-sm-3 control-label" })
|
|
<div class="col-sm-9">
|
|
@Html.DropDownListFor(model => model.TrainingTypeId, Utils.GetTrainingType(), new { @class = "form-control" })
|
|
@Html.ValidationMessageFor(model => model.TrainingTypeId)
|
|
</div>
|
|
</div>
|
|
<div class="form-group">
|
|
@Html.LabelFor(model => model.TrainingCost, new { @class = "col-sm-3 control-label" })
|
|
<div class="col-sm-9">
|
|
<div class="input-group">
|
|
<span class="input-group-addon">$</span>
|
|
@Html.TextBoxFor(model => model.TrainingCost, new { @class = "form-control", @style = "width:138px;" })
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="form-group">
|
|
@Html.LabelFor(model => model.Resources, new { @class = "col-sm-3 control-label" })
|
|
<div class="col-sm-9 select2-primary">
|
|
@Html.EditorFor(model => model.Resources)
|
|
@Html.ValidationMessageFor(model => model.Resources)
|
|
</div>
|
|
</div>
|
|
<div class="form-group">
|
|
@Html.LabelFor(model => model.TrainingTimeAllocated, new { @class = "col-sm-3 control-label" })
|
|
<div class="col-sm-9">
|
|
@Html.EditorFor(model => model.TrainingTimeAllocated)
|
|
@Html.ValidationMessageFor(model => model.TrainingTimeAllocated)
|
|
</div>
|
|
</div>
|
|
</div> <!-- / .modal-body -->
|
|
<div class="modal-footer">
|
|
<button id="btnSaveTraining" type="submit" class="btn btn-primary">Save</button>
|
|
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
|
|
</div>
|
|
|
|
} |