EnVisageOnline/Main/Source/EnVisage/Views/View/_editView.cshtml

289 lines
12 KiB
Plaintext

@model EnVisage.Models.ViewModel
@using EnVisage.Code
@using EnVisage.Code.Extensions
@{
ViewBag.Title = Model.Id != Guid.Empty ? "Edit " + Model.Name : "Add View";
var availableCompanies = Utils.GetCompaniesTreeForCurrentUser();
var teams = Model.Teams != null ? Model.Teams.GetAsCommaSeparatedList() : "";
var watchers = Model.Watchers != null ? Model.Watchers.GetAsCommaSeparatedList() : "";
var companies = Model.Companies != null ? Model.Companies.GetAsCommaSeparatedList() : "";
}
<script type="text/javascript">
var _viewDataChanged = false;
function onViewDataChanged() {
_viewDataChanged = true;
}
function resetViewDataChanged() {
_viewDataChanged = false;
}
function isViewDataChanged() {
return _viewDataChanged;
}
emulateNavUrl = "/View";
function fillSelect2(multik, preselected) {
var selected = [];
if (preselected != null)
selected = preselected;
multik.select2('val', selected);
}
</script>
<script type="text/javascript">
function initView() {
$("#@Html.IdFor(model=>model.Teams)").select2({
allowClear: true,
placeholder: "Select teams"
});
var selectedTeams = [@Html.Raw(teams)];
fillSelect2($("#@Html.IdFor(model=>model.Teams)"), selectedTeams);
$("#@Html.IdFor(model=>model.Watchers)").select2({
allowClear: true,
placeholder: "Select watchers"
});
var selectedWatchers = [@Html.Raw(watchers)];
fillSelect2($("#@Html.IdFor(model=>model.Watchers)"), selectedWatchers);
// Need to create select2 for Companies, when form is shown, because
// placeholder displayed incorrect - because of the small initial
// size of the source select control, while form is invisible
setTimeout(function () {
$("#@Html.IdFor(model => model.Companies)").select2({
allowClear: true,
placeholder: "Select Business Units"
}).on("select2-selecting", function (e) {
if (e && e.val) {
filterSelectedCompanies('@Html.IdFor(model => model.Companies)', e.val)
}
});
var selectedCompanies = [@Html.Raw(companies)];
fillSelect2($("#@Html.IdFor(model => model.Companies)"), selectedCompanies);
}, 500);
@if (Model.Id != Guid.Empty)
{
<text>
StartEdit('View', '@Model.Id', "#btnDelete", "#btnsave", "erorMsgPlaceholder");
</text>
}
$('#btnsave').click(function () {
if ($(this).parents('form').valid()) {
blockUI();
saveData();
}
});
$('#editViewForm').find('input[type=checkbox],input[type=text],select,textarea').on("change", function () {
if (typeof onViewDataChanged === 'function')
onViewDataChanged();
});
$('#editViewForm').submit(function (evt) {
evt.preventDefault();
return false;
});
$.validator.unobtrusive.parseDynamicContent("#editViewForm");
}
function filterSelectedCompanies(controlId, selectedVal) {
var controlSelector = "#" + controlId;
var controlItem = $(controlSelector);
var selectedOption = $(controlItem).find('[value="' + selectedVal + '"]');
var parentItemId = $(selectedOption).attr("data-parent-value");
if (parentItemId) {
// Child company was selected. Check if it's parent company is already selected.
// If so, remove parent company from selection
var currentSelection = controlItem.select2('val');
var selectionToRemoveIndex = currentSelection.indexOf(parentItemId);
if (selectionToRemoveIndex >= 0) {
var newSelection = $.extend([], currentSelection);
newSelection.splice(selectionToRemoveIndex, 1);
controlItem.select2('val', newSelection);
}
}
else {
// Parent company was selected. Check and remove it's child companies from selection
var childCompaniesForCurrent = [];
$(controlItem).find('[data-parent-value="' + selectedVal + '"]')
.each(function (index, item) {
var itemValue = $(item).attr('value');
childCompaniesForCurrent.push(itemValue);
});
if (childCompaniesForCurrent && (childCompaniesForCurrent.length > 0)) {
var currentSelection = controlItem.select2('val');
var newSelection = $.extend([], currentSelection);
var selectionChanged = false;
for (var index = newSelection.length - 1; index >= 0; index--) {
var itemToCheck = newSelection[index];
if (childCompaniesForCurrent.indexOf(itemToCheck) >= 0) {
newSelection.splice(index, 1);
selectionChanged = true;
}
}
if (selectionChanged) {
controlItem.select2('val', newSelection);
}
}
}
}
function saveData() {
var form = $('#editViewForm');
var id = form.find('input#@(Html.IdFor(model => model.Id))[type=hidden]').val();
var name = form.find('#@Html.IdFor(model => model.Name)').val();
var watchersControl = form.find('#@Html.IdFor(model => model.Watchers)');
var teamsControl = form.find('#@Html.IdFor(model => model.Teams)');
var companiesControl = form.find('#@Html.IdFor(model => model.Companies)');
var selectedWatchers = watchersControl.select2('val');
var selectedTeams = teamsControl.select2('val');
var selectedCompanies = companiesControl.select2('val');
var data = {
Id: id,
Name: name,
Watchers: selectedWatchers,
Teams: selectedTeams,
Companies: selectedCompanies
};
var token = $('input[name="__RequestVerificationToken"]', form).val();
resetViewDataChanged();
$.ajax({
type: "post",
url: siteRoot + "/View/Edit",
context: document.body,
data: { __RequestVerificationToken: token, model: data },
success: function (result) {
handleAjaxResponse(result, onSuccess, null, null, form);
},
error: function () {
RemoveLock('View', id);
StopEdit();
showErrorModal();
},
complete: function () {
unblockUI();
}
});
return false;
}
function onSuccess(result) {
if (!result || !result.Content || !result.Content.viewId) {
return;
}
RemoveLock('View', result.Content.viewId);
StopEdit();
$('#generalModalContainer').modal('hide');
var redirectToView = result.Content.openView;
if (redirectToView) {
@* Perform redirection to created view *@
var redirectUrlBase = '@(Url.Action("Board", "View"))';
var url = URI(redirectUrlBase).setQuery("viewId", result.Content.viewId);
document.location.href = url;
}
else {
// Change name of the edited view in left navigation menu
var viewItemInMenu = $("#view-menu-root").find("*[data-view-id=" + result.Content.viewId + "]");
if (viewItemInMenu && viewItemInMenu.length) {
$(viewItemInMenu).text(result.Content.viewName);
}
}
}
</script>
<div id="erorMsgPlaceholder"></div>
@using (Ajax.BeginForm("Edit", "View", new AjaxOptions { HttpMethod = "Post" }, new { id = "editViewForm" }))
{
@Html.AntiForgeryToken()
@Html.HiddenFor(t => t.Id)
@Html.HiddenFor(t => t.backController)
@Html.HiddenFor(t => t.backAction)
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button>
<h4 class="modal-title">@(Model.Id != Guid.Empty ? "Edit " + Model.Name : "Add View")</h4>
</div>
<div class="modal-body">
<div class="row">
<div class="col-sm-12">
<div class="form-group no-margin-hr">
@Html.LabelFor(model => model.Name, new { @class = "control-label" })
@Html.TextBoxFor(model => model.Name, new { @class = "form-control" })
@Html.ValidationMessageFor(model => model.Name)
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<div class="form-group no-margin-hr select2-primary">
@Html.LabelFor(model => model.Teams, new { @class = "control-label" })
@Html.EditorFor(model => model.Teams, string.Empty, new { List = Utils.GetTeamsAvailableForUser(Guid.Parse(User.Identity.GetID())) })
@Html.ValidationMessageFor(model => model.Teams)
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<div class="form-group no-margin-hr select2-primary">
@Html.LabelFor(model => model.Companies, new { @class = "control-label" })
<select id='@Html.IdFor(model => model.Companies)' multiple='multiple' class="form-control">
@{ foreach (var opt in availableCompanies)
{
<option value="@opt.Value" class='ddl-level-item-ac@((opt.Group != null) && !String.IsNullOrEmpty(opt.Group.Name) ? " pad-left" : "")'
@((opt.Group != null) && !String.IsNullOrEmpty(opt.Group.Name) ? "data-parent-value=" + opt.Group.Name : "")>
@opt.Text
</option>
}
}
</select>
@Html.ValidationMessageFor(model => model.Companies)
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<div class="form-group no-margin-hr select2-primary">
@Html.LabelFor(model => model.Watchers, new { @class = "control-label" })
@Html.EditorFor(model => model.Watchers, string.Empty, new { List = Model.AvailableUsers.Select(x => new SelectListItem() { Value = x.Id.ToString(), Text = x.FirstName + " " + x.LastName }).ToList() })
@Html.ValidationMessageFor(model => model.Watchers)
</div>
</div>
</div>
@Html.ValidationSummary(false, "The View could not be saved due to the following errors:")
</div> <!-- / .modal-body -->
<div class="modal-footer">
<button class="btn btn-success" type="button" id="btnsave"><i class="fa fa-save"></i> Save</button>
@if (Model != null && Model.Id != Guid.Empty)
{
if (Model.TeamCount > 0)
{
<a style="display:none;" id="btnDelete" class="btn btn-danger disabled" href="javascript:void(0);"><i class="fa fa-trash-o"></i> Delete</a>
}
else
{
<a style="display:none;" id="btnDelete" class="btn btn-danger" href="@Url.Action("Delete", "View", new { id = Model.Id })"><i class="fa fa-trash-o"></i> Delete</a>
}
}
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
}