Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Move program setup to modal on insights pages #4468

Merged
merged 4 commits into from
Jan 12, 2024
Merged

Move program setup to modal on insights pages #4468

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
7c9520f
program setup modal
kflemin Jan 8, 2024
4d4f91a
simplified logic to load last view program in setup modal
kflemin Jan 11, 2024
67b17fa
Merge branch 'develop' into move-program-setup
kflemin Jan 11, 2024
8a1e62b
Merge branch 'develop' into move-program-setup
kflemin Jan 12, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
86 changes: 84 additions & 2 deletions seed/static/seed/js/controllers/insights_program_controller.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,16 +12,36 @@ angular.module('BE.seed.controller.insights_program', []).controller('insights_p
'compliance_metric_service',
'spinner_utility',
'organization_payload',
'filter_groups',
'cycles',
'property_columns',
'auth_payload',
// eslint-disable-next-line func-names
function ($scope, $stateParams, $state, $uibModal, urls, compliance_metrics, compliance_metric_service, spinner_utility, organization_payload, cycles, auth_payload) {
function (
$scope,
$stateParams,
$state,
$uibModal,
urls,
compliance_metrics,
compliance_metric_service,
spinner_utility,
organization_payload,
filter_groups,
cycles,
property_columns,
auth_payload
) {
$scope.id = $stateParams.id;
$scope.cycles = cycles.cycles;
$scope.organization = organization_payload.organization;
$scope.initialize_chart = true;
$scope.auth = auth_payload.auth;

// used by modal
$scope.filter_groups = filter_groups;
$scope.property_columns = property_columns;

// compliance metric
$scope.compliance_metric = {};
$scope.compliance_metrics = compliance_metrics;
Expand All @@ -44,6 +64,65 @@ angular.module('BE.seed.controller.insights_program', []).controller('insights_p
// CHARTS
const colors = { compliant: '#77CCCB', 'non-compliant': '#A94455', unknown: '#DDDDDD' };

// Program Setup Modal
$scope.open_program_setup_modal = () => {
const modalInstance = $uibModal.open({
templateUrl: `${urls.static_url}seed/partials/program_setup.html`,
controller: 'program_setup_controller',
size: 'lg',
backdrop: 'static',
resolve: {
cycles: () => $scope.cycles,
compliance_metrics: () => $scope.compliance_metrics,
organization_payload: () => $scope.organization,
filter_groups: () => $scope.filter_groups,
property_columns: () => $scope.property_columns,
id: () => $scope.selected_metric
}
});
// on modal close
modalInstance.result.then((program) => {
// 1) change selection if no programs existed before
// 2) change selection if the selected one in insights no longer exists
// 3) reload if the selected one still exists (just in case)
// 4) do nothing
compliance_metric_service.get_compliance_metrics($scope.organization.id).then((data) => {
$scope.compliance_metrics = data;
const metric_ids = _.map($scope.compliance_metrics, 'id');
if ($scope.selected_metric === null && $scope.compliance_metrics.length > 0) {
// case 1
if (program != null) {
$scope.compliance_metric = $scope.compliance_metrics.find((cm) => cm.id === program.id);
$scope.selected_metric = program.id;
} else {
// this should not happen, but just in case use the 1st one
$scope.compliance_metric = $scope.compliance_metrics[0];
$scope.selected_metric = $scope.compliance_metric.id;
}
} else if ($scope.selected_metric && metric_ids.indexOf($scope.selected_metric) === -1) {
// case 2
if (program != null) {
$scope.selected_metric = program.id;
$scope.compliance_metric = $scope.compliance_metrics.find((cm) => cm.id === $scope.selected_metric);
} else if ($scope.compliance_metrics.length > 0) {
// this should not happen, but just in case use the 1st one
$scope.compliance_metric = $scope.compliance_metrics[0];
$scope.selected_metric = $scope.compliance_metric.id;
} else {
// load nothing
$scope.compliance_metric = {};
$scope.selected_metric = null;
}
} else if ($scope.selected_metric) {
// case 3
// otherwise reload the data for selected one in case it changed
$scope.compliance_metric = $scope.compliance_metrics.find((cm) => cm.id === $scope.selected_metric);
}
$scope.updateSelectedMetric();
});
});
};

const _load_datasets = () => {
// load data

Expand Down Expand Up @@ -173,7 +252,10 @@ angular.module('BE.seed.controller.insights_program', []).controller('insights_p
};

$scope.updateSelectedMetric = () => {
$scope.compliance_metric = _.find($scope.compliance_metrics, (o) => o.id === $scope.selected_metric);
$scope.compliance_metric = {};
if ($scope.selected_metric != null) {
$scope.compliance_metric = _.find($scope.compliance_metrics, (o) => o.id === $scope.selected_metric);
}

// reload data for selected metric
_load_data();
Expand Down
91 changes: 88 additions & 3 deletions seed/static/seed/js/controllers/insights_property_controller.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,20 +11,42 @@ angular.module('BE.seed.controller.insights_property', []).controller('insights_
'compliance_metrics',
'compliance_metric_service',
'organization_payload',
'filter_groups',
'property_columns',
'cycles',
'spinner_utility',
'auth_payload',
// eslint-disable-next-line func-names
function ($scope, $state, $stateParams, $uibModal, urls, compliance_metrics, compliance_metric_service, organization_payload, spinner_utility, auth_payload) {
function (
$scope,
$state,
$stateParams,
$uibModal,
urls,
compliance_metrics,
compliance_metric_service,
organization_payload,
filter_groups,
property_columns,
cycles,
spinner_utility,
auth_payload
) {
$scope.id = $stateParams.id;
$scope.static_url = urls.static_url;
$scope.organization = organization_payload.organization;
$scope.auth = auth_payload.auth;

// used by modal
$scope.filter_groups = filter_groups;
$scope.property_columns = property_columns;
$scope.all_cycles = cycles.cycles;

// toggle help
$scope.show_help = false;
$scope.toggle_help = () => {
$scope.show_help = !$scope.show_help;
}
};

// configs ($scope.configs set to saved_configs where still applies.
// for example, if saved_configs.compliance_metric is 1, but 1 has been deleted, it does apply.)
Expand Down Expand Up @@ -73,6 +95,65 @@ angular.module('BE.seed.controller.insights_property', []).controller('insights_
$scope.y_axis_options = [];
$scope.x_categorical = false;

// Program Setup Modal
$scope.open_program_setup_modal = () => {
const modalInstance = $uibModal.open({
templateUrl: `${urls.static_url}seed/partials/program_setup.html`,
controller: 'program_setup_controller',
size: 'lg',
backdrop: 'static',
resolve: {
cycles: () => $scope.all_cycles,
compliance_metrics: () => $scope.compliance_metrics,
organization_payload: () => $scope.organization,
filter_groups: () => $scope.filter_groups,
property_columns: () => $scope.property_columns,
id: () => $scope.selected_metric
}
});
// on modal close
modalInstance.result.then((program) => {
// 1) change selection if no programs existed before
// 2) change selection if the selected one in insights no longer exists
// 3) reload if the selected one still exists (just in case)
// 4) do nothing
compliance_metric_service.get_compliance_metrics($scope.organization.id).then((data) => {
$scope.compliance_metrics = data;
const metric_ids = _.map($scope.compliance_metrics, 'id');
if ($scope.selected_metric === null && $scope.compliance_metrics.length > 0) {
// case 1
if (program != null) {
$scope.configs.compliance_metric = $scope.compliance_metrics.find((cm) => cm.id === program.id);
$scope.selected_metric = program.id;
} else {
// this should not happen, but just in case use the 1st one
$scope.configs.compliance_metric = $scope.compliance_metrics[0];
$scope.selected_metric = $scope.configs.compliance_metric.id;
}
} else if ($scope.selected_metric && metric_ids.indexOf($scope.selected_metric) === -1) {
// case 2
if (program != null) {
$scope.configs.compliance_metric = $scope.compliance_metrics.find((cm) => cm.id === program.id);
$scope.selected_metric = program.id;
} else if ($scope.compliance_metrics.length > 0) {
// this should not happen, but just in case use the 1st one
$scope.configs.compliance_metric = $scope.compliance_metrics[0];
$scope.selected_metric = $scope.configs.compliance_metric.id;
} else {
// load nothing
$scope.configs.compliance_metric = {};
$scope.selected_metric = null;
}
} else if ($scope.selected_metric) {
// case 3
// otherwise reload the data for selected one in case it changed
$scope.configs.compliance_metric = $scope.compliance_metrics.find((cm) => cm.id === $scope.selected_metric);
}
$scope.update_metric();
});
});
};

$scope.$watch(
'configs',
(new_configs) => {
Expand All @@ -89,6 +170,7 @@ angular.module('BE.seed.controller.insights_property', []).controller('insights_
const _load_data = () => {
if (_.isEmpty($scope.configs.compliance_metric)) {
spinner_utility.hide();
$scope.data = null;
return;
}
spinner_utility.show();
Expand Down Expand Up @@ -189,7 +271,10 @@ angular.module('BE.seed.controller.insights_property', []).controller('insights_
spinner_utility.show();

// compliance metric
$scope.configs.compliance_metric = _.find($scope.compliance_metrics, (o) => o.id === $scope.selected_metric);
$scope.configs.compliance_metric = {};
if ($scope.selected_metric != null) {
$scope.configs.compliance_metric = _.find($scope.compliance_metrics, (o) => o.id === $scope.selected_metric);
}

// reload data for selected metric
_load_data();
Expand Down
Loading
Loading