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

330 lines
17 KiB
Plaintext

@model EnVisage.Models.ViewBoardModel
@using EnVisage.Code
@{
ViewBag.Title = Model.SelectedViewName;
var model = new
{
DisplayMode = new
{
MenuId = "visibilitydropdown_calendar",
DataSection = "capacityManagementView",
PageKey = "/View/Board"
},
Filter = new
{
EntityType = Model.IsVirtualCompanyView ? EnVisage.Models.CapacityPageInitOption.CalendarEntityType.Company : EnVisage.Models.CapacityPageInitOption.CalendarEntityType.View,
EntityId = Model.Id,
ShowFilters = false
},
TargetPage = "ViewBoard"
};
}
@section stylesheets
{
@Styles.Render(String.Format("{0}/{1}", Constants.C_BUNDLE_STYLES_BASE_PATH, "prevu-acstyles"))
@Styles.Render(String.Format("{0}/{1}", Constants.C_BUNDLE_STYLES_KENDO_PATH, "kendo-commonstyles"))
}
@section scripts
{
@Scripts.Render(String.Format("{0}/{1}", Constants.C_BUNDLE_SCRIPTS_BASE_PATH, "kendo-grid"))
@Scripts.Render(String.Format("{0}/{1}", Constants.C_BUNDLE_SCRIPTS_BASE_PATH, "flot-scripts"))
@Scripts.Render(String.Format("{0}/{1}", Constants.C_BUNDLE_SCRIPTS_BASE_PATH, "prevu-angularservices"))
@Scripts.Render(String.Format("{0}/{1}", Constants.C_BUNDLE_SCRIPTS_BASE_PATH, "prevu-activitycalendar"))
@Scripts.Render(String.Format("{0}/{1}", Constants.C_BUNDLE_SCRIPTS_BASE_PATH, "prevu-scenariodetails"))
@Scripts.Render(String.Format("{0}/{1}", Constants.C_BUNDLE_SCRIPTS_BASE_PATH, "prevu-tvboardpage"))
<script type="text/javascript">
//last replace in emulateNavUrl needed for main menu nav predicate match hack
if (URI().query(true).viewId) {
emulateNavUrl = "/" + "javascript:void('@Url.Action("Board", "View", new {@viewId = "_rplcmnt_"})');".replace(/_rplcmnt_/g, URI().query(true).viewId).replace(/^(?:\/\/|[^\/]+)*\//, "");
} else if (URI().query(true).companyId) {
emulateNavUrl = "/" + "javascript:void('@Url.Action("Board", "View", new {@companyId = "_rplcmnt_"})');".replace(/_rplcmnt_/g, URI().query(true).companyId).replace(/^(?:\/\/|[^\/]+)*\//, "");
} else {
emulateNavUrl = "/" + "javascript:void('@Url.Action("Board", "View", new {@viewId = Model.Id})');".replace(/^(?:\/\/|[^\/]+)*\//, "");
}
var _viewPageState = null;
function getSelectedViewId() {
var viewId = $('#SelectedViewId').val();
if (!viewId || viewId.trim().length <= 0)
return null;
return viewId;
}
init.push(function () {
saveLastPageVisited(window.location.pathname + window.location.search);
if (URI().query(true).viewId) {
selectView(URI().query(true).viewId);
} else {
selectView('@(Model.Id)', '@(Model.SelectedViewName)');
}
$(document).on('finishedDrawing', function () {
var showPanel = _viewPageState.data('pageState').$dataset['graph-panel'];
if (showPanel == undefined || showPanel) {
$('#graph-container').addClass('in').parent().find('[data-toggle=collapse]').removeClass('collapsed');
} else {
$('#graph-container').removeClass('in').parent().find('[data-toggle=collapse]').addClass('collapsed');
}
$('.dataTables_empty').width($(window).width() - 336);
});
$('#panelTeamCalendar').on('hidden.bs.collapse', function () {
$('#divCalendarMenu').hide();
_viewPageState.pageState('setData', ['team-panel', false]);
_viewPageState.pageState('saveData');
});
$('#panelTeamCalendar').on('shown.bs.collapse', function () {
$('#divCalendarMenu').show();
_viewPageState.pageState('setData', ['team-panel', true]);
_viewPageState.pageState('saveData');
});
$('#panelForecast').on('hidden.bs.collapse', function () {
$('#divForecastMenu').hide();
$('#forecastBlock').hide();
_viewPageState.pageState('setData', ['view-panel', false]);
_viewPageState.pageState('saveData');
});
$('#panelForecast').on('shown.bs.collapse', function () {
$('#divForecastMenu').show();
$('#forecastBlock').show();
if ($('#forecastBlock').children().length == 0)
loadForecastPanel(getSelectedViewId());
_viewPageState.pageState('setData', ['view-panel', true]);
_viewPageState.pageState('saveData');
});
$('#graph-container').on('hidden.bs.collapse', function () {
console.log('saving hidden graph');
_viewPageState.pageState('setData', ['graph-panel', false]);
_viewPageState.pageState('saveData');
});
$('#graph-container').on('shown.bs.collapse', function () {
console.log('saving shown graph');
_viewPageState.pageState('setData', ['graph-panel', true]);
_viewPageState.pageState('saveData');
});
$('#panelTeams').on('hidden.bs.collapse', function () {
console.log('saving hidden teams');
_viewPageState.pageState('setData', ['team-panel', false]);
_viewPageState.pageState('saveData');
});
$('#panelTeams').on('shown.bs.collapse', function () {
console.log('saving shown teams');
_viewPageState.pageState('setData', ['team-panel', true]);
_viewPageState.pageState('saveData');
});
_viewPageState = $('#viewDashboard').pageState({
pageKey: document.location.pathname
});
var showPanel = _viewPageState.data('pageState').$dataset['team-panel'];
if (showPanel == undefined || showPanel) {
$('#divCalendarMenu').show();
$('#panelTeamCalendar').addClass('in').parent().find('[data-toggle=collapse]').removeClass('collapsed');
} else {
$('#divCalendarMenu').hide();
$('#panelTeamCalendar').removeClass('in').parent().find('[data-toggle=collapse]').addClass('collapsed');
}
var showPanel = _viewPageState.data('pageState').$dataset['team-panel'];
if (showPanel == undefined || showPanel) {
$('#divCalendarMenu').show();
$('#panelTeamCalendar').addClass('in').parent().find('[data-toggle=collapse]').removeClass('collapsed');
} else {
$('#divCalendarMenu').hide();
$('#panelTeamCalendar').removeClass('in').parent().find('[data-toggle=collapse]').addClass('collapsed');
}
showPanel = _viewPageState.data('pageState').$dataset['view-panel'];
if (showPanel == undefined || showPanel) {
$('#divForecastMenu').show();
$('#panelForecast').addClass('in').parent().find('[data-toggle=collapse]').removeClass('collapsed');
loadForecastPanel(getSelectedViewId());
} else {
$('#divForecastMenu').hide();
$('#panelForecast').removeClass('in').parent().find('[data-toggle=collapse]').addClass('collapsed');
$('#forecastBlock').hide();
loadForecastPanel(getSelectedViewId());
}
showPanel = _viewPageState.data('pageState').$dataset['team-panel'];
if (showPanel == undefined || showPanel) {
$('#panelTeams').addClass('in').parent().find('[data-toggle=collapse]').removeClass('collapsed');
} else {
$('#panelTeams').removeClass('in').parent().find('[data-toggle=collapse]').addClass('collapsed');
}
var tab = $.QueryString["ptab"];
if (tab == "calendar") {
$('html, body').animate({
scrollTop: $("#panelTeamCalendar").offset().top
}, 1000);
}
});
function selectView(id, name) {
if (id != '@Guid.Empty') {
$('#SelectedViewId').val(id);
if ($("#panelForecast").hasClass("collapse in")) {
loadForecastPanel(id);
} else {
$('#forecastBlock').html('');
}
}
}
function loadForecastPanel(id) {
//reset forecast block menu
var paramsObj = {
viewId: id,
mode: '@(Model.IsVirtualCompanyView ? "company" : "view")'
};
$('#forecastTableLoader').show();
$("#forecastBlock").html('');
var loadUrl = '@Url.Action("Index", "ForecastDashboard")?menuId=visibilitydropdown&pageModel=ViewBoardModel&additionalFilters=' + JSON.stringify(paramsObj);
$("#forecastBlock")
.load(loadUrl, function (response, status, xhr) {
if (status == "error") {
showErrorModal('Loading error', 'We are sorry but there was an error, please try again later.');
} else {
$(".fcboard-criteria-select2").select2();
initForecastDashboard();
var showPanel = _viewPageState.data('pageState').$dataset['view-panel'];
//Per ENV-798 - show calendar and forecast only by default
if (showPanel == undefined || showPanel) {
$('#panelForecast').addClass('in').parent().find('[data-toggle=collapse]').removeClass('collapsed');
} else {
$('#panelForecast').removeClass('in').parent().find('[data-toggle=collapse]').addClass('collapsed');
}
$('#forecastTableLoader').hide();
}
});
}
function OpenInNewWindow() {
var url = '@Url.Action("Index", "CapacityManagement")' + '?id=' + getSelectedViewId();
window.open(url);
}
function loadActivityCalendar(eventName, eventData) {
triggerBroadcastFromRootScope(eventName, eventData);
}
</script>
}
<style type="text/css">
#capacity-table .headcol {
left: -3px;
}
</style>
<div class="table-light table-responsive">
<input type="hidden" id="SelectedViewId" name="SelectedViewId" value="@Model.Id" />
<div class="panel">
<div class="panel-body" id="viewDashboard">
<div class="row" style="padding-right:20px;">
<div class="pull-right"><a class="noShevron" href="javascript:OpenInNewWindow()">Go to @Model.SelectedViewName Calendar</a></div>
</div>
<div class="row animated">
<div class="col-md-12 col-lg-6" style="min-width: 436px!important;">
<div class="panel panel-white panel-compact otherside" id="teamWidget">
<div class="panel-heading">
<span class="panel-title ui-expander">
<a data-toggle="collapse" data-target="#panelTeams" class="collapsed">
<i class="panel-title-icon fa fa-users"></i>Teams
</a>
</span>
</div>
<div id="panelTeams" class="panel-body table-light collapse">
<div class="row" style="padding-left: 10px!important;padding-right: 10px!important;" id="ViewInfo">
@if (Model.Views.Count > 0)
{
//Resources (Grouped by Team)
Html.RenderPartial("~/Views/View/_resourcesList.cshtml", Model);
}
else
{
<label class="label">You do not have access to any view</label>
}
</div>
</div>
</div>
</div>
<div class="col-md-12 col-lg-6">
<div class="panel panel panel-white panel-compact" data-section="graphtView">
<div class="panel-heading ">
<span class="panel-title ui-expander">
<a data-toggle="collapse" data-target="#graph-container">
<i class="panel-title-icon fa fa-bar-chart-o"></i>Projects by Status
</a>
</span>
</div>
<div class='panel-body table-light collapse in' id="graph-container" style="padding-top: 0px!important; padding-bottom: 0px!important;">
<div class="row" id="graphDiv" style="padding-top: 0px!important; padding-bottom: 0px!important;padding-left: 20px!important; padding-right: 20px!important;">
@{
Html.RenderPartial("_chart", Model);
}
</div>
</div>
</div>
</div>
</div>
<div class="panel panel-white panel-compact" data-section="forecastView">
<div class="panel-heading">
<span class="panel-title ui-expander">
<a data-toggle="collapse" data-target="#panelForecast">
<i class="panel-title-icon fa fa-wrench"></i>View Forecast
</a>
</span>
<span class="pull-right">&nbsp;&nbsp;</span>
<div class="btn-group btn-group-xs pull-right" id="divForecastMenu" style="display: none;">
<button class="btn btn-info dropdown-toggle" type="button" data-toggle="dropdown"><i class="fa fa-bars"></i>&nbsp;<i class="fa fa-caret-down"></i></button>
<ul class="dropdown-menu dropdown-menu-right" id="visibilitydropdown"></ul>
</div>
</div>
<div class='panel-body table-light collapse' id="panelForecast"></div>
<div id="forecastBlock">
<div id="forecastTableLoader" class="loadRotator">
<span>
<img class="valign-middle" src="@Url.Content("~/Content/images/loadFA.gif")" />&nbsp;&nbsp;loading...
</span>
</div>
</div>
</div>
@if (SecurityManager.CheckSecurityObjectPermission(Areas.ActivityCalendar, AccessLevel.Read))
{
<div class="panel panel-white panel-compac" data-section="capacityManagementView">
<div class="panel-heading">
<span class="panel-title ui-expander">
<a data-toggle="collapse" data-target="#panelTeamCalendar" class="collapsed">
<i class="panel-title-icon fa fa-calendar"></i>@Model.SelectedViewName Calendar
</a>
</span>
<span class="pull-right">&nbsp;&nbsp;</span>
<div class="btn-group btn-group-xs pull-right" id="divCalendarMenu" style="display: none;">
<button class="btn btn-info dropdown-toggle" type="button" data-toggle="dropdown"><i class="fa fa-bars"></i>&nbsp;<i class="fa fa-caret-down"></i></button>
<ul class="dropdown-menu-calendar dropdown-menu dropdown-menu-right calendar-options-menu" id="visibilitydropdown_calendar" role="menu" aria-labelledby="dropdownMenu"></ul>
</div>
<div class="pull-right" style="padding-right: 20px;"><a class="noShevron" href="javascript:OpenInNewWindow()">Open in new window</a></div>
</div>
<div id="panelTeamCalendar" class="panel-collapse collapse">
<div class="table-light ac" style="margin-bottom:0!important">
@if (!Guid.Empty.Equals(model.Filter.EntityId))
{
@Html.Partial("~/Views/ActivityCalendar/_capacityManagement.cshtml", model)
}
</div>
</div>
</div>
}
</div>
</div>
<!-- Modal -->
<div id="createScenario" class="modal fade" tabindex="-1" role="dialog" data-backdrop="static">
<div class="modal-dialog modal-lg">
<div class="modal-content" id="reloadForm">
</div> <!-- / .modal-content -->
</div> <!-- / .modal-dialog -->
</div> <!-- /.modal -->
<!-- / Modal -->
</div>