955 lines
39 KiB
Plaintext
955 lines
39 KiB
Plaintext
@using EnVisage.Code
|
|
@using EnVisage.Models
|
|
@model ForecastDashboardOptionsModel
|
|
@{
|
|
ViewBag.Title = "Dashboard";
|
|
var allScenarioGroups = Utils.GetScenarioGroup().Where(item => !item.Text.Equals("Default"));
|
|
}
|
|
@section Stylesheets
|
|
{
|
|
@Styles.Render(String.Format("{0}/{1}", Constants.C_BUNDLE_STYLES_KENDO_PATH, "kendo-commonstyles"))
|
|
@Styles.Render(String.Format("{0}/{1}", Constants.C_BUNDLE_STYLES_BASE_PATH, "prevu-dashboardstyles"))
|
|
|
|
<style>
|
|
.pv-menu {
|
|
text-align: right;
|
|
}
|
|
|
|
.pv-menu .btn-group button {
|
|
background: transparent;
|
|
border: none;
|
|
font-size: 24px;
|
|
}
|
|
|
|
#cardTotalNumberOfProjects .switcher {
|
|
width: auto !important;
|
|
}
|
|
|
|
.filter-panel .panel-body {
|
|
padding-top: 5px !important;
|
|
padding-bottom: 5px !important;
|
|
}
|
|
|
|
.k-grid-norecords-template {
|
|
width: auto !important;
|
|
}
|
|
|
|
#barChartsContainer .loadRotator {
|
|
position: absolute;
|
|
margin: auto;
|
|
left: 0;
|
|
top: 75px;
|
|
bottom: 0;
|
|
right: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
z-index: 10;
|
|
background-color: #ffffff;
|
|
}
|
|
|
|
#barChartsContainer .loadRotator span {
|
|
top: 50%;
|
|
left: 100px;
|
|
position: absolute;
|
|
}
|
|
|
|
.donutChartDiv {
|
|
width: 100%;
|
|
height: 300px;
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
}
|
|
|
|
table.donut-legend {
|
|
width: 100%;
|
|
border-collapse: collapse;
|
|
}
|
|
|
|
.donut-legend-item {
|
|
font-size: 12px;
|
|
width: 50%;
|
|
padding-bottom: 2px;
|
|
padding-right: 7px;
|
|
padding-left: 10px;
|
|
/*cursor: pointer;*/
|
|
}
|
|
|
|
.donut-legend-indicator {
|
|
width: 10px;
|
|
height: 12px;
|
|
background-color: red;
|
|
float: left;
|
|
margin-top: 2px;
|
|
}
|
|
|
|
.donut-legend-item-label {
|
|
margin-left: 3px;
|
|
}
|
|
|
|
.amcharts-balloon-div {
|
|
z-index: 100 !important;
|
|
}
|
|
</style>
|
|
}
|
|
@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, "amcharts-scripts"))
|
|
@Scripts.Render(String.Format("{0}/{1}", Constants.C_BUNDLE_SCRIPTS_BASE_PATH, "prevu-dashboardpage"))
|
|
|
|
<script>
|
|
var _filterIdsCollection = ["s2id_ProjectTypes", "s2id_ProjectStatuses", "s2id_Clients", "s2id_filterTeam", "s2id_StrategicGoals", "s2id_filterTag"];
|
|
|
|
function dashboardPrint(beforePrintBool) {
|
|
var isChrome = /Chrome/.test(navigator.userAgent) && /Google Inc/.test(navigator.vendor);
|
|
var isSafari = /Safari/.test(navigator.userAgent) && /Apple Computer/.test(navigator.vendor);
|
|
|
|
var donut = $("#chartDonut1").data("donutChart");
|
|
if(!isChrome && !isSafari)
|
|
donut.innerDonut.div.style.width = beforePrintBool ? "300px" : "100%";
|
|
donut.innerDonut.validateNow();
|
|
|
|
if(!isChrome && !isSafari)
|
|
donut.outerDonut.div.style.width = beforePrintBool ? "300px" : "100%";
|
|
donut.outerDonut.validateNow();
|
|
|
|
var chartStacked = findChart("chartStacked1");
|
|
if(!isChrome && !isSafari)
|
|
chartStacked.div.style.width = beforePrintBool ? "300px" : "100%";
|
|
chartStacked.validateNow();
|
|
|
|
var chartBubble = findChart("chartBubble1");
|
|
if(!isChrome && !isSafari)
|
|
chartBubble.div.style.width = beforePrintBool ? "600px" : "100%";
|
|
chartBubble.validateNow();
|
|
|
|
if(!isChrome && !isSafari){
|
|
var chartBar1 = findChart("chartBar1");
|
|
chartBar1.div.style.width = beforePrintBool ? "200px" : "100%";
|
|
chartBar1.div.style.height = beforePrintBool ? "263px" : "263px";
|
|
chartBar1.validateNow();
|
|
|
|
var chartBar2 = findChart("chartBar2");
|
|
chartBar2.div.style.width = beforePrintBool ? "200px" : "100%";
|
|
chartBar2.div.style.height = beforePrintBool ? "263px" : "263px";
|
|
chartBar2.validateNow();
|
|
|
|
var chartBar3 = findChart("chartBar3");
|
|
chartBar3.div.style.width = beforePrintBool ? "200px" : "100%";
|
|
chartBar3.div.style.height = beforePrintBool ? "263px" : "263px";
|
|
chartBar3.validateNow();
|
|
}
|
|
|
|
visibleFilters(_filterIdsCollection, beforePrintBool);
|
|
}
|
|
|
|
function visibleFilters(filterIdsCollection, beforePrintBool) {
|
|
for (var i = 0; i < filterIdsCollection.length; i++) {
|
|
if ($("#" + filterIdsCollection[i]).select2('val').length == 0) {
|
|
if (beforePrintBool) {
|
|
$("#" + filterIdsCollection[i]).hide();
|
|
$("#" + filterIdsCollection[i]).prev("label").hide();
|
|
} else {
|
|
$("#" + filterIdsCollection[i]).show();
|
|
$("#" + filterIdsCollection[i]).prev("label").show();
|
|
}
|
|
}
|
|
}
|
|
return null;
|
|
}
|
|
|
|
$(document).ready(function () {
|
|
|
|
function beforePrint () {
|
|
console.log('before print');
|
|
dashboardPrint(true);
|
|
}
|
|
function afterPrint() {
|
|
console.log('after print');
|
|
dashboardPrint(false);
|
|
}
|
|
window.onbeforeprint = beforePrint;
|
|
window.onafterprint = afterPrint;
|
|
|
|
var printHandler = function(mql) {
|
|
if(mql.matches) {
|
|
beforePrint();
|
|
} else {
|
|
afterPrint();
|
|
}
|
|
};
|
|
|
|
var mql = window.matchMedia('print');
|
|
mql.addListener(printHandler);
|
|
|
|
$("div#main-wrapper").attr("data-section", "fullPageDashboard");
|
|
|
|
_dataSectionName = loadForecastDashboardPreferences();
|
|
if (_dataSectionName && (_dataSectionName.length > 0) && _pagePreferences && $.isArray(_pagePreferences)) {
|
|
restorePreferences(_dataSectionName, _pagePreferences);
|
|
// Restore filter panel collapsed / expanded state and visibility manually
|
|
for (var index = 0; index < _pagePreferences.length; index++) {
|
|
var prefItem = _pagePreferences[index];
|
|
|
|
// Collapsed / expanded state
|
|
if (prefItem && (prefItem.Key == _filterPanelCollapsedKey)) {
|
|
var prefValue = prefItem.Value;
|
|
setPanelCollapsedState(prefValue);
|
|
}
|
|
|
|
// Filter panel visibility state
|
|
if (prefItem && (prefItem.Key == _filterPanelVisibleKey)) {
|
|
var prefValue = prefItem.Value;
|
|
setCriteriaVisibleState(prefValue);
|
|
}
|
|
}
|
|
}
|
|
|
|
saveLastPageVisited(window.location.pathname);
|
|
});
|
|
|
|
$(document).on("click", "#donut-total", function (e) {
|
|
e.preventDefault();
|
|
if (donutData != null) {
|
|
renderDonut(donutData);
|
|
//for (var i = 0; i < projectsFilterArray.length; i++) {
|
|
// removeArrayFromFilter('s2id_ProjectTypes', projectsFilterArray[i]);
|
|
//}
|
|
$('#s2id_ProjectTypes').select2('val', []);
|
|
projectsFilterArray = [];
|
|
|
|
//for (var i = 0; i < goalsFilterArray.length; i++) {
|
|
// removeArrayFromFilter('s2id_StrategicGoals', goalsFilterArray[i]);
|
|
//}
|
|
$('#s2id_StrategicGoals').select2('val', []);
|
|
goalsFilterArray = [];
|
|
}
|
|
applyForecastDashboardFilter();
|
|
});
|
|
</script>
|
|
}
|
|
@section pagemenu
|
|
{
|
|
@Html.Partial("~/Views/ForecastDashboard/_pageMenu.cshtml")
|
|
}
|
|
@Html.Partial("~/Views/ForecastDashboard/_filterPanel.cshtml", Model)
|
|
|
|
<div class="pv-noscroll table-light table-responsive dashboard">
|
|
|
|
<div class="row pv-row">
|
|
<div class="pv-back-arrow sprite" onclick="widgetToRestore();"></div>
|
|
|
|
<div class="panel col-md-4 pv-card dashboard-widget-height-first-row dashboard-widget-non-static-width-big" id="cardStacked1">
|
|
@{ Html.RenderPartial("~/Views/Shared/amCharts/_cardStacked.cshtml"); }
|
|
</div>
|
|
|
|
<div class="panel col-md-4 pv-card dashboard-widget-height-first-row dashboard-widget-static-width" id="cardOpt1">
|
|
@*<div class="pv-menu k-content">
|
|
<div class="btn-group pull-right">
|
|
<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
|
<i class="fa fa-ellipsis-h"></i>
|
|
</button>
|
|
<ul class="dropdown-menu">
|
|
<li>
|
|
<input type="checkbox" data-key="optimuse-isUOMHours" name="optimuse-isUOMHours" id="optimuse-isUOMHours" class="switcher px"/>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>*@
|
|
</div>
|
|
|
|
<div class="panel col-md-4 pv-card dashboard-widget-height dashboard-widget-non-static-width-midle" id="cardDonut1">
|
|
@{ Html.RenderPartial("~/Views/Shared/amCharts/_cardDonut2.cshtml"); }
|
|
</div>
|
|
|
|
<div class="panel col-md-4 pv-card dashboard-widget-height dashboard-widget-non-static-width-midle" id="cardSummary1">
|
|
@{ Html.RenderPartial("~/Views/Shared/amCharts/_cardSummary.cshtml"); }
|
|
</div>
|
|
|
|
<div class="panel col-md-4 pv-card dashboard-widget-static-width" id="cardBar1">
|
|
@{ Html.RenderPartial("~/Views/Shared/amCharts/_cardBar.cshtml"); }
|
|
</div>
|
|
|
|
<div class="panel col-md-4 pv-card dashboard-widget-height dashboard-widget-non-static-width-big minimized" id="cardBubble1">
|
|
@{ Html.RenderPartial("~/Views/Shared/amCharts/_cardBubble.cshtml"); }
|
|
</div>
|
|
|
|
<div class="panel col-md-4 pv-card dashboard-widget-static-width pv-menu-grid" id="cardTotalNumberOfProjects" data-fullscreen-only="true" style="display: none;">
|
|
@Html.Partial("~/Views/ForecastDashboard/_forecastGridWidget.cshtml")
|
|
</div>
|
|
|
|
<div class="panel col-md-4 pv-card dashboard-widget-static-width" id="cardOptimuse" data-fullscreen-only="true" style="display: none; height:100%;">
|
|
<div class="pv-mock-opt" style="margin-bottom: -55px;" id="magnify-actual-full-screen"><div style="padding-left: 20px;">Actual</div></div>
|
|
<div style="height: 300px;" class="pv-chart" id="chart-actual-full-screen"></div>
|
|
<br />
|
|
<div class="pv-mock-opt" style="margin-bottom: -55px;" id="magnify-planned-full-screen"><div style="padding-left: 20px;">Planned</div></div>
|
|
<div style="height: 300px;" class="pv-chart" id="chart-planned-full-screen"></div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
@{ Html.RenderPartial("~/Views/Shared/amCharts/_cardDonut2_InitScripts.cshtml"); }
|
|
|
|
<script>
|
|
var _dataSectionName;
|
|
var _pagePreferences = [];
|
|
var _filterPanelCollapsedKey = "FilterCollapsed";
|
|
var _filterPanelVisibleKey = "showCriteria";
|
|
var _scenDetailsUrl = '@Url.Action("Details", "Scenarios", new { @id = "_rplcmnt_", @backUrl = "/", @backName = "dashboard" })';
|
|
var _allScenarioGroups = @Html.Raw(Json.Encode(allScenarioGroups.ToArray()));
|
|
var liHeight = 30;
|
|
|
|
init.push(function () {
|
|
pv.chart.menu();
|
|
$(".fcboard-criteria-select2").select2();
|
|
createDatePickers();
|
|
initSwitchers();
|
|
loadOptimuseData();
|
|
|
|
$(window).scroll(function () {
|
|
$('.menuGroup').removeClass('open');
|
|
if (!!currentGridName){
|
|
hideRedundantPopovers($('#' + currentGridName), null);
|
|
}
|
|
});
|
|
|
|
$('.table-striped').scroll(function () {
|
|
$('.menuGroup').removeClass('open');
|
|
if (!!currentGridName){
|
|
hideRedundantPopovers($('#' + currentGridName), null);
|
|
}
|
|
});
|
|
$(document).click(function (event) {
|
|
$('.menuGroup').removeClass('open');
|
|
if (!$(event.target).is('[data-toggled="popover"]')){
|
|
if (!!currentGridName){
|
|
hideRedundantPopovers($('#' + currentGridName), null);
|
|
}
|
|
}
|
|
});
|
|
});
|
|
|
|
function initSwitchers() {
|
|
$('#optimuse-isUOMHours').switcher({
|
|
on_state_content: '# Hours',
|
|
off_state_content: '# Resources'
|
|
});
|
|
$('#optimuse-isUOMHours').on('click', function () {
|
|
$('#cardOpt1').optimuse('showPreloader');
|
|
$('#cardOpt1').optimuse('changeUOMMode', $(this).is(':checked'));
|
|
$('#cardOpt1').optimuse('hidePreloader');
|
|
$('#cardOpt1').optimuse('mouveBarTitles');
|
|
saveForecastDashboardPreferences();
|
|
});
|
|
}
|
|
|
|
function showChartPreLoader(chartId) {
|
|
$("#" + chartId).html("<div class='loadRotator'>\
|
|
<span>\
|
|
<img class='valign-middle' src='@Url.Content("~/Content/images/loadFA.gif")' /> loading...\
|
|
</span>\
|
|
</div>");
|
|
}
|
|
|
|
function loadOptimuseData(filterData) {
|
|
var isUOMHours = $('#uomModeForecast').is(':checked');
|
|
|
|
filterData = filterData || getFilterDataObject();
|
|
filterData["IsLaborMode"] = true;
|
|
filterData["ChartType"] = dashboardChartType.projectsByStatus | dashboardChartType.optimuse;
|
|
|
|
showChartPreLoader("chartStacked1");
|
|
$('#cardOpt1').optimuse({ isUOMHours: isUOMHours, data: null });
|
|
$('#cardOpt1').optimuse('showPreloader');
|
|
|
|
$.post('@Url.Action("GetGraphData", "ForecastDashboard")', filterData, function (data, textStatus, jqXHR) {
|
|
projectsByStatusSetData(data["ProjectsByStatus"]);
|
|
projectsByStatusShowChartData();
|
|
|
|
$('#cardOpt1').optimuse('setData', data["Optimuse"]);
|
|
$('#cardOpt1').optimuse('hidePreloader');
|
|
$('#cardOpt1').optimuse('mouveBarTitles');
|
|
|
|
var percentOverAllocation = $('#cardOpt1').optimuse('getOverAllocationPercent') || 0;
|
|
var percentUnderAllocation = $('#cardOpt1').optimuse('getUnderAllocationPercent') || 0;
|
|
|
|
$('#percentOverAllocation').children('a').text(percentOverAllocation + '%').show();
|
|
$('#percentOverAllocation').children("img").remove();
|
|
|
|
$('#percentUnderAllocation').children('a').text(percentUnderAllocation + '%').show();
|
|
$('#percentUnderAllocation').children("img").remove();
|
|
|
|
var fullScreenTab = pv.storage.getSession('pv.card.id');
|
|
if (fullScreenTab === 'cardOptimuse' && $('#' + fullScreenTab).is(':visible')) {
|
|
showResourceUsageGraphs();
|
|
}
|
|
});
|
|
};
|
|
|
|
function getColorFromPalette(idx) {
|
|
var palette = PixelAdmin.settings.consts.COLORS;
|
|
if (palette.length < 1)
|
|
return null;
|
|
if (palette.length == 1)
|
|
return palette[0];
|
|
return palette[idx % (palette.length - 1)];
|
|
}
|
|
|
|
function saveForecastDashboardPreferences() {
|
|
var section = getDataSection($('#criteria-container'));
|
|
var prefs = collectPreferences(section);
|
|
|
|
// Add filter panel collapsed / expanded state
|
|
var filterPanelIsCollapsed = getPanelCollapsedState();
|
|
var panelStatePrefItem = null;
|
|
|
|
for (var index = 0; index < prefs.length; index++) {
|
|
var prefItem = prefs[index];
|
|
|
|
if (prefItem && (prefItem.Key == _filterPanelCollapsedKey)) {
|
|
panelStatePrefItem = prefItem;
|
|
break;
|
|
}
|
|
}
|
|
|
|
if (!panelStatePrefItem) {
|
|
panelStatePrefItem = {
|
|
Key: _filterPanelCollapsedKey,
|
|
Value: null
|
|
};
|
|
prefs.push(panelStatePrefItem);
|
|
}
|
|
panelStatePrefItem.Value = filterPanelIsCollapsed;
|
|
|
|
saveUserPagePreferences(prefs, section);
|
|
}
|
|
|
|
function loadForecastDashboardPreferences() {
|
|
var section = getDataSection($('#criteria-container'));
|
|
_pagePreferences = loadUserPagePreferences(section);
|
|
return section;
|
|
}
|
|
|
|
function saveGridState(gridName) {
|
|
var grid = getGrid(gridName),
|
|
dataSource = grid.dataSource,
|
|
options = grid.getOptions();
|
|
|
|
//var fieldsToDisplay = grid.fieldsToDisplay;
|
|
//var gridColumns = grid.columns.filter(function(col, index) {
|
|
// var matchedFields = fieldsToDisplay.filter(function (field) {
|
|
// return col.field == field;
|
|
// });
|
|
// return matchedFields.length > 0;
|
|
//});
|
|
|
|
var state = {
|
|
columns: $.map(grid.columns, function (col, index) {
|
|
return {
|
|
"field": col.field,
|
|
"hidden": col.hidden,
|
|
"width": col.width
|
|
};
|
|
}),
|
|
pageSize: dataSource.pageSize(),
|
|
sort: dataSource.sort(),
|
|
group: $.map(dataSource.group() || [], function (group, index) {
|
|
return {
|
|
dir: group.dir,
|
|
field: group.field
|
|
};
|
|
})
|
|
};
|
|
|
|
var prefs = [{
|
|
Key: "Grid_" + gridName,
|
|
Value: kendo.stringify(state)
|
|
}];
|
|
prefs.push({
|
|
Key: "PerformanceMode",
|
|
Value: kendo.stringify($("#gridPerformanceMode").prop("checked"))
|
|
});
|
|
|
|
saveUserPagePreferences(prefs, gridName);
|
|
}
|
|
|
|
function getGridState(gridName) {
|
|
var grid = getGrid(gridName);
|
|
|
|
var prefs = loadUserPagePreferences(gridName);
|
|
if (!prefs || !prefs.length) {
|
|
return null;
|
|
}
|
|
var gridState = getGridPreferncesItem("Grid_" + gridName, prefs);
|
|
var performanceMode = getGridPreferncesItem("PerformanceMode", prefs);
|
|
gridState.performanceMode = (!performanceMode) || performanceMode;
|
|
|
|
return gridState;
|
|
}
|
|
|
|
function getGridPreferncesItem(key, prefs) {
|
|
try {
|
|
var gridPreferences = prefs.filter(function (item, index) {
|
|
return item.Key == key;
|
|
});
|
|
if (gridPreferences.length) {
|
|
return JSON.parse(gridPreferences[0].Value);
|
|
}
|
|
}
|
|
catch(e) {
|
|
console.log('Error reading grid prefernce: ' + key);
|
|
}
|
|
|
|
return null;
|
|
}
|
|
|
|
|
|
function getFilterParams(options) {
|
|
var filter = getFilterDataObject();
|
|
filter["FilterGroupByTeam"] = options && options.group && $.grep(options.group, function(e){return e.field == 'TeamName'}).length > 0;
|
|
|
|
//TODO: other way to extend filter options for specific grid
|
|
if(options) {
|
|
if(currentGridName == "NetImpact") filter["HasProjectNetImpact"] = true;
|
|
if(currentGridName == "TotalProjectedRevenue") filter["HasProjectedRevenue"] = true;
|
|
if(currentGridName == "TotalProjectedSavings") filter["HasCostSavings"] = true;
|
|
if(currentGridName == "TotalProjectCost") filter["HasProjectCost"] = true;
|
|
}
|
|
return { forecastFilter: filter };
|
|
}
|
|
|
|
function getGrid(gridName) {
|
|
return $("#" + gridName).data("kendoGrid");
|
|
}
|
|
|
|
function ToggleStatus(btn, projectId, scenarioId, startDateMs, endDateMs) {
|
|
$(btn).scenarioStatusToggle({
|
|
scenario: {
|
|
scenarioId: scenarioId,
|
|
projectId: projectId,
|
|
startDate: startDateMs ? DateTimeConverter.msFormatAsUtcString(startDateMs) : null,
|
|
endDate: endDateMs ? DateTimeConverter.msFormatAsUtcString(endDateMs) : null,
|
|
},
|
|
minStartDate: '@Constants.MIN_SELECTABLE_DATE',
|
|
maxEndDate: '@Constants.MAX_SELECTABLE_DATE',
|
|
runType: 'OnDemand',
|
|
success: function (args) {
|
|
if (typeof LoadGraphData === 'function')
|
|
LoadGraphData();
|
|
if (typeof LoadPieData === 'function')
|
|
LoadPieData();
|
|
if(currentGridName) {
|
|
getGrid(currentGridName).dataSource.read();
|
|
}
|
|
},
|
|
error: function (args) {
|
|
showErrorModal();
|
|
},
|
|
});
|
|
$(btn).scenarioStatusToggle('toggleStatus');
|
|
}
|
|
|
|
function onMenuItemClick(e, element) {
|
|
if ($(element).hasClass('dropdown-menu-form')) {
|
|
e.stopPropagation();
|
|
}
|
|
if (e.target.className != 'hide' && e.target.type == 'checkbox') {
|
|
var li = $(e.target).parent()[0];
|
|
var scenarioId = li.getAttribute('data-scenarioid');
|
|
var groupId = li.getAttribute('data-groupid');
|
|
CopyToGroup(scenarioId, groupId, $(li));
|
|
}
|
|
}
|
|
|
|
function CopyToGroup(scenarioId, groupId, element) {
|
|
$(element).children('input[type="checkbox"]').addClass('hide');
|
|
$(element).children('span.glyphicon').removeClass('hide');
|
|
var isChecked = $(element).children('input[type="hidden"]').val() == 'checked';
|
|
var url = '';
|
|
if (!isChecked)
|
|
url = "@Url.Action("CopyScenarioToGroup", "ForecastDashboard")";
|
|
else
|
|
url = "@Url.Action("ExtractFromGroup", "ForecastDashboard")";
|
|
var request = {
|
|
'scenarioId': scenarioId,
|
|
'groupId': groupId
|
|
};
|
|
$.post(url, request, function (data) {
|
|
var result = data;
|
|
if (data.Status == 'Ok') {
|
|
$(element).children('input[type="hidden"]').val(isChecked ? "unchecked" : "checked");
|
|
} else if (data.Status == 'Error') { // Show error message
|
|
showErrorModal('An error occurred while try to change scenario group.', data.ErrorMsg);
|
|
console.log(data.ErrorDetails);
|
|
}
|
|
$(element).children('span.glyphicon').addClass('hide');
|
|
$(element).children('input[type="checkbox"]').removeClass('hide');
|
|
});
|
|
}
|
|
|
|
function dropDownInsideClick(event) {
|
|
if (!event)
|
|
event = window.event;
|
|
|
|
var container = null, button = null;
|
|
if ($(event.target).hasClass('dropdown-menu'))
|
|
container = $(event.target);
|
|
else {
|
|
button = $(event.target);
|
|
container = button.closest('.dropdown-menu');
|
|
}
|
|
hideRedundantPopovers(container, button);
|
|
|
|
if (event.stopPropagation)
|
|
event.stopPropagation();
|
|
else
|
|
window.event.cancelBubble = true;
|
|
}
|
|
|
|
function dropDownFixPositionCalendar(button, dropdown) {
|
|
setDropdownProps(button, dropdown, liHeight);
|
|
if (!!currentGridName){
|
|
hideRedundantPopovers($('#' + currentGridName), null);
|
|
}
|
|
}
|
|
|
|
function scenarioNameTemplate(dataItem) {
|
|
//var link = "<a href=\"" + _scenDetailsUrl.replace("_rplcmnt_", dataItem.Id) + "\">" + dataItem.Name + "</a>";
|
|
var strA = '<div class="scenario-name" data-value="' + dataItem.Name + '"><a id="aN__rplcmnt_" onclick="return CheckLock(this.id, \'Scenario\', \'_rplcmnt_\')" class="popover-warning popover-dark" href="' + _scenDetailsUrl + '">' + dataItem.Name + '</a></div>';
|
|
if (dataItem.InactiveScenarios && dataItem.InactiveScenarios.length) {
|
|
strA += '<div class="dropdown menuGroup " style="float:right;">' +
|
|
'<button type="button" title="Menu" style="margin-bottom:0px !important;" class="btn btn-xs dropdown-toggle" data-toggle="dropdown" onclick=\'dropDownFixPositionCalendar($(this), $(this).parent().find(".dropdown-menu"));\'><i class="fa fa-caret-down"></i></button>' +
|
|
'<ul id="ddm_' + dataItem.Id + '" class="dropdown-menu dropdown-menu-form dropdown-menu-right dropdown-menu-scroll-auto lioverflowh" style="text-align:left;padding:4px 0px!important;width:220px;overflow-x: hidden;" onclick="dropDownInsideClick(event);">';
|
|
for (var inactiveIndex = 0; inactiveIndex < dataItem.InactiveScenarios.length; inactiveIndex++) {
|
|
var scenario = dataItem.InactiveScenarios[inactiveIndex];
|
|
strA += '<li><div style="-ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; overflow: hidden; max-width: 150px; float: left; padding-left: 15px;"><span title="' + scenario.Name + '">' + scenario.Name + '</span></div>' +
|
|
'<div style="float: right;padding-right: 15px;"><a data-toggle="popover" title="Activate" onclick="ToggleStatus(this, \'' + (dataItem.PartId || dataItem.ProjectId) + '\', \'' + scenario.Id + '\', ' + scenario.StartDate + ', ' + scenario.EndDate + ')"" class="btn btn-xs btn-primary popover-warning popover-dark" ><i class="fa fa-check-circle-o not-active"></i></a></div></li>';
|
|
}
|
|
strA += '</ul></div>';
|
|
}
|
|
return strA.replace(/_rplcmnt_/g, dataItem.Id);
|
|
}
|
|
|
|
function scenarioStatusTemplate(dataItem) {
|
|
var cellhtml = "";
|
|
if (dataItem.ScenarioStatus != null) {
|
|
var options = "";
|
|
for (i = 0; i < _allScenarioGroups.length; i++) {
|
|
var scenarioGroupId = _allScenarioGroups[i].Value;
|
|
var scenarioGroupName = _allScenarioGroups[i].Text;
|
|
var isFound = false;
|
|
for (j = 0; j < dataItem.Groups.length; j++) {
|
|
if (scenarioGroupId == dataItem.Groups[j].substr(dataItem.Groups[j].lastIndexOf(">") + 1)) {
|
|
isFound = true;
|
|
break;
|
|
}
|
|
}
|
|
|
|
options += "<li data-scenarioId='" + dataItem.Id + "' data-groupId='" + scenarioGroupId + "'>" +
|
|
"<input type='checkbox' style='margin-right: 5px;' id='" + dataItem.Id + '_' + scenarioGroupId + "' ";
|
|
options += isFound ? "checked" : "";
|
|
options += "/><input type='hidden' value='";
|
|
options += isFound ? "checked" : "unchecked";
|
|
options += "'/><span class='glyphicon glyphicon-refresh glyphicon-refresh-animate hide'></span><label for='" + dataItem.Id + '_' + scenarioGroupId + "'>" + scenarioGroupName + "</label></li>";
|
|
}
|
|
|
|
if (options.length > 0) {
|
|
options = "<div class=\"btn-group dropdown scenarioGroupDropdown\" id=\"copyto_" + dataItem.Id + "\">" +
|
|
"<button type='button' class='btn btn-xs dropdown-toggle dropdown-fix-pos' data-toggle='dropdown'>Groups <i class='fa fa-caret-down'></i></button>" +
|
|
"<ul class='dropdown-menu dropdown-menu-form dropdown-menu-right' role='menu' onclick='onMenuItemClick(event, $(this))'>" + options + "</ul>" +
|
|
"</div>";
|
|
}
|
|
|
|
var scenarioStartDate = dataItem.StartDate ? DateTimeConverter.stringToMs(dataItem.StartDate) : null;
|
|
var scenarioEndDate = dataItem.EndDate ? DateTimeConverter.stringToMs(dataItem.EndDate) : null;
|
|
cellhtml = "<a class=\"btn btn-xs btn-warning popover-warning popover-dark\" id=\"" + dataItem.Id + "\" onclick=\"ToggleStatus(this, '" + (dataItem.PartId || dataItem.ProjectId) + "', '" + dataItem.Id + "', " + scenarioStartDate + ", " + scenarioEndDate + ");\" title=\"Deactivate\" data-toggle=\"popover\" data-placement=\"left\"><i class=\"fa fa-times-circle-o\"></i></a>";
|
|
cellhtml += " " + options;
|
|
}
|
|
|
|
return cellhtml;
|
|
}
|
|
|
|
function getProbabilityStr(model) {
|
|
if (!model.Probability) {
|
|
return "0%";
|
|
}
|
|
var percent = model.Probability * 100;
|
|
if (percent > 0 && percent <= 25)
|
|
return Math.round(percent) + "% (Low)";
|
|
if (percent > 25 && percent <= 75)
|
|
return Math.round(percent) + "% (Medium)";
|
|
if (percent > 75 && percent <= 99)
|
|
return Math.round(percent) + "% (High)";
|
|
if (percent == 100)
|
|
return Math.round(percent) + "% (Expected)";
|
|
|
|
return model.Probability;
|
|
}
|
|
|
|
function formatCosts(costs) {
|
|
return ((!costs) ? "" : '$' + costs.toFixed(2).replace(/\d(?=(\d{3})+\.)/g, '$&,'));
|
|
}
|
|
|
|
function getCGSplit(data) {
|
|
return ((!data.CGSplit) ? "0%" : data.CGSplit * 100 + ' %') + " / " + ((!data.EFXSplit) ? "0%" : data.EFXSplit * 100 + ' %');
|
|
}
|
|
|
|
function getExpectedGrossMargin(data) {
|
|
return ((data.UseLMMargin) ? Math.round(data.ExpectedGrossMargin_LM * 1000) / 10 + ' % (L&M)' : Math.round(data.ExpectedGrossMargin * 1000) / 10 + ' %');
|
|
}
|
|
|
|
function getExpectedGrossMarginGroupAvg(data) {
|
|
return ((data.UseLMMargin) ? Math.round(data.ExpectedGrossMargin_LM * 1000) / 10 + ' % (L&M)' : Math.round(data.ExpectedGrossMargin * 1000) / 10 + ' %');
|
|
}
|
|
|
|
function getGroupSummaryText(text, gridName, columnName) {
|
|
// SA. This method returns text for displaying in Group summary field cell.
|
|
// Returns <text>, if field <columnName> is the first column in the grid, otherwise returns empty string
|
|
var result = "";
|
|
var grid = $("#" + gridName).data("kendoGrid");
|
|
|
|
if (columnName && grid && grid.columns) {
|
|
var visibleIndex = -1;
|
|
|
|
for (var index = 0; index < grid.columns.length; index++) {
|
|
if (!grid.columns[index].hidden)
|
|
visibleIndex++;
|
|
|
|
if ((grid.columns[index].field == columnName) && (visibleIndex == 0))
|
|
result = '<span title="' + htmlEncode(text) + '">' + text + '</span>';
|
|
|
|
if (visibleIndex >= 0)
|
|
break;
|
|
}
|
|
}
|
|
|
|
return result;
|
|
}
|
|
|
|
function getPercentSummaryValue(val) {
|
|
var valueCorrected = val !== null ? val : 0;
|
|
var formattedValue = kendo.format('{0:p0}', valueCorrected);
|
|
return '<span title="' + htmlEncode(formattedValue) + '">' + formattedValue + '</span>'
|
|
}
|
|
|
|
function formatPercentValue(val) {
|
|
if ($.isNumeric(val))
|
|
return kendo.format('{0:p0}', val);
|
|
else
|
|
return '';
|
|
}
|
|
|
|
function getCurrencySummaryValue(val) {
|
|
var valueCorrected = val !== null ? val : 0;
|
|
var formattedValue = kendo.format('{0:c}', valueCorrected);
|
|
return '<span title="' + htmlEncode(formattedValue) + '" data-value="' + val + '">' + formattedValue + '</span>'
|
|
}
|
|
|
|
function getDateSummaryValue(val) {
|
|
var formattedValue = kendo.toString(kendo.parseDate(val) || '', 'd');
|
|
//we are using formattedValue because val is date in JSON format: /Date(1234500000)/
|
|
return '<span title="' + htmlEncode(formattedValue) + '" data-value="' + formattedValue + '">' + formattedValue + '</span>'
|
|
}
|
|
|
|
function getHoursSummaryValue(val) {
|
|
var valueCorrected = val !== null ? val : 0;
|
|
var formattedValue = kendo.format('{0:n2}', valueCorrected);
|
|
return '<span title="' + htmlEncode(formattedValue) + '" data-value="' + val + '">' + formattedValue + '</span>'
|
|
}
|
|
|
|
function getIntegerSummaryValue(val) {
|
|
var valueCorrected = val !== null ? val : 0;
|
|
var formattedValue = kendo.toString(valueCorrected, 'n0');
|
|
return '<span title="' + htmlEncode(formattedValue) + '" data-value="' + val + '">' + formattedValue + '</span>'
|
|
}
|
|
|
|
function formatMargin(margin) {
|
|
return ((!margin) ? "0%" : Math.round(margin * 1000) / 10 + ' %');
|
|
}
|
|
|
|
function onGridDataBound(e) {
|
|
var data = this.dataSource.view(),
|
|
gridName = e.sender.element.attr("id");
|
|
|
|
for (var i = 0; i < data.length; i++) {
|
|
var dataItem = data[i];
|
|
if (dataItem.items) {
|
|
for(var col = 0; col < dataItem.items.length; col++) {
|
|
var row = dataItem.items[col];
|
|
var tr = $("#" + gridName).find("[data-uid='" + row.uid + "']");
|
|
if (row.PerformanceColor) {
|
|
tr.addClass(row.PerformanceColor);
|
|
}
|
|
}
|
|
} else {
|
|
var tr = $("#" + gridName).find("[data-uid='" + dataItem.uid + "']");
|
|
if (dataItem.PerformanceColor) {
|
|
tr.addClass(dataItem.PerformanceColor);
|
|
}
|
|
}
|
|
}
|
|
setTimeout(function () {
|
|
//get the indicator header
|
|
var groupIndicator = $('.k-group-indicator');
|
|
var groupIndicatorHeader = groupIndicator.parent();
|
|
if (!groupIndicatorHeader) {
|
|
return;
|
|
}
|
|
var colTeamName = $.grep(groupIndicator, function (element) {
|
|
return $(element).data("field") == "TeamName";
|
|
})[0];
|
|
|
|
if (colTeamName) {
|
|
$(colTeamName).find(".k-group-delete").hide();
|
|
//check if it is draggable eneabled
|
|
var kendoDraggableObj = $(colTeamName).parent().data('kendoDraggable');
|
|
if (kendoDraggableObj) kendoDraggableObj.destroy();
|
|
}
|
|
}, 0);
|
|
}
|
|
|
|
function loadForecastGrid() {
|
|
$(".projectsSummaryItem").html($("#loading-template").html());
|
|
if(currentGridName) {
|
|
getGrid(currentGridName).dataSource.page(1);
|
|
}
|
|
}
|
|
|
|
function loadProjectsSummary() {
|
|
$.post("@Url.Action("GetProjectsSummary", "ForecastGrid")", getFilterParams())
|
|
.done(function (data) {
|
|
$("#txtTotalNumberOfProjects").children("a").text(data.numberOfProjects).show();
|
|
$("#txtTotalNumberOfProjects").children("img").remove();
|
|
|
|
$("#txtProjectWeeks").children("a").text(data.projectWeeks.toLocaleString(0)).show();
|
|
$("#txtProjectWeeks").children("img").remove();
|
|
|
|
$("#txtTotalProjectedRevenue").children("a").text(kendo.format("{0:c}", data.totalRevenue)).show();
|
|
$("#txtTotalProjectedRevenue").children("img").remove();
|
|
|
|
$("#txtTotalNetImpact").children("a").text(kendo.format("{0:c}", data.totalNetImpact)).show();
|
|
$("#txtTotalNetImpact").children("img").remove();
|
|
|
|
$("#txtTotalProjectedSavings").children("a").text(kendo.format("{0:c}", data.totalCostSavings)).show();
|
|
$("#txtTotalProjectedSavings").children("img").remove();
|
|
|
|
$("#txtTotalProjectCost").children("a").text(kendo.format("{0:c}", data.totalBUCost)).show();
|
|
$("#txtTotalProjectCost").children("img").remove();
|
|
|
|
$("#totalResourceAvailability").children("a").text(kendo.format("{0}", data.totalResourceAvailability) + "%").show();
|
|
$("#totalResourceAvailability").children("img").remove();
|
|
});
|
|
}
|
|
|
|
function widgetToRestore()
|
|
{
|
|
$('#cardBubble1').addClass('minimized');
|
|
pv.chart.menu.restoreWin();
|
|
}
|
|
|
|
function widgetToFullScreen()
|
|
{
|
|
$('#cardBubble1').removeClass('minimized');
|
|
}
|
|
|
|
function getVisibleColumns() {
|
|
var grid = getGrid(currentGridName);
|
|
var result = grid.columns.filter(function(col, index) {
|
|
return !col.hidden;
|
|
});
|
|
|
|
return result;
|
|
}
|
|
|
|
function getUngroupedData(exportData) {
|
|
var grid = getGrid(currentGridName),
|
|
result = [];
|
|
if(grid.dataSource.group().length == 0) {
|
|
return exportData;
|
|
}
|
|
$.each(exportData, function(index, dataItem){
|
|
if(dataItem.field && dataItem.items && !dataItem.hasSubgroups) { //Grouped mode.
|
|
$.each(dataItem.items, function(childIndex, child){
|
|
result.push(child)
|
|
});
|
|
} else if(dataItem.hasSubgroups) {
|
|
var subItems = getUngroupedData(dataItem.items);
|
|
$.each(subItems, function(childIndex, child){
|
|
result.push(child)
|
|
});
|
|
}
|
|
});
|
|
|
|
return result;
|
|
}
|
|
|
|
function onExcelExport(e) {
|
|
var grid = getGrid(currentGridName),
|
|
rows = e.workbook.sheets[0].rows,
|
|
columns = getVisibleColumns(),
|
|
dataRowIndex = 0,
|
|
data = getUngroupedData(e.data);
|
|
|
|
var groupCount = grid.dataSource.group().length;
|
|
for (var ri = 0; ri < rows.length; ri++) {
|
|
var row = rows[ri];
|
|
if (row.type == "data") {
|
|
for (var ci = groupCount; ci < row.cells.length; ci++) {
|
|
var cell = row.cells[ci];
|
|
if(columns[ci - groupCount].template) {
|
|
var template = kendo.template(columns[ci - groupCount].template);
|
|
var cellContent = template(data[dataRowIndex]);
|
|
var $firstChild = $($.parseHTML(cellContent));
|
|
|
|
var value = $firstChild.data("value");
|
|
if(value) {
|
|
cell.value = value;
|
|
} else {
|
|
cell.value = $firstChild.text();
|
|
}
|
|
}
|
|
}
|
|
dataRowIndex++;
|
|
}
|
|
|
|
if (row.type == "group-footer" || row.type == "footer") {
|
|
for (var ci = groupCount; ci < row.cells.length; ci++) {
|
|
var cell = row.cells[ci];
|
|
if (cell.value) {
|
|
//var footerTemplate;
|
|
//if(row.type == "group-footer") {
|
|
// columnTemplate = columns[ci - groupCount].groupFooterTemplate;
|
|
//} else if(row.type == "footer") {
|
|
// columnTemplate = columns[ci - groupCount].footerTemplate;
|
|
//}
|
|
//var template = kendo.template(footerTemplate);
|
|
|
|
// TODO: apply (group)FooterTemplate. Get dataItem for footer or groupFooter and pass it to template();
|
|
|
|
var $firstChild = $($.parseHTML(cell.value));
|
|
var value = $firstChild.data("value");
|
|
if(value) {
|
|
cell.value = value;
|
|
} else {
|
|
cell.value = $firstChild.text();
|
|
}
|
|
continue;
|
|
|
|
|
|
var res = cell.value.substring(0, 5);
|
|
|
|
if ((res==='Count') || (res==='Total' ) || (res!=='<span' )){
|
|
cell.value = cell.value;
|
|
} else {
|
|
cell.value = $(cell.value).text();
|
|
// Set the alignment
|
|
cell.hAlign = "right";
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</script> |