+
diff --git a/Front End/poam-app/src/app/pages/asset-processing/asset-processing.component.scss b/Front End/poam-app/src/app/pages/asset-processing/asset-processing.component.scss
index 0df4d9ea..673e50fc 100644
--- a/Front End/poam-app/src/app/pages/asset-processing/asset-processing.component.scss
+++ b/Front End/poam-app/src/app/pages/asset-processing/asset-processing.component.scss
@@ -15,10 +15,18 @@
}
.canvas {
+ position: relative;
max-height: 50vh;
max-width: 100vw;
}
+.export-button {
+ position: absolute;
+ top: 0;
+ right: 0;
+ margin-right: 0;
+}
+
.add-asset-button {
margin-top: 20px;
}
diff --git a/Front End/poam-app/src/app/pages/asset-processing/asset-processing.component.ts b/Front End/poam-app/src/app/pages/asset-processing/asset-processing.component.ts
index 17defd5c..c7ddb56b 100644
--- a/Front End/poam-app/src/app/pages/asset-processing/asset-processing.component.ts
+++ b/Front End/poam-app/src/app/pages/asset-processing/asset-processing.component.ts
@@ -25,6 +25,7 @@ import { environment } from '../../../environments/environment';
import { ChangeDetectorRef } from '@angular/core';
import { Assets } from './asset.model';
import { Chart, registerables, ChartData } from 'chart.js';
+import ChartDataLabels from 'chartjs-plugin-datalabels';
interface Permission {
userId: number;
@@ -80,9 +81,23 @@ export class AssetProcessingComponent implements OnInit, AfterViewInit {
maintainAspectRatio: false,
scales: {
x: { grid: { display: true } },
- y: { beginAtZero: true, grid: { display: false } },
+ y: {
+ beginAtZero: true,
+ grace: '5%',
+ grid: {
+ display: false
+ },
+ ticks: {
+ font: {
+ weight: 600,
+ },
+ }
+ },
},
plugins: {
+ title: {
+ display: false,
+ },
legend: {
display: true,
position: this.selectedPosition,
@@ -180,11 +195,15 @@ export class AssetProcessingComponent implements OnInit, AfterViewInit {
}
private initializeChart(): void {
+ Chart.defaults.set('plugins.datalabels', {
+ display: false,
+ });
this.cdr.detectChanges();
if (this.assetLabelsChart?.nativeElement) {
this.assetLabelChart = new Chart(this.assetLabelsChart.nativeElement, {
type: 'bar',
data: this.assetLabelChartData,
+ plugins: [ChartDataLabels],
options: this.barChartOptions,
});
if (this.assetLabel) {
@@ -406,7 +425,8 @@ export class AssetProcessingComponent implements OnInit, AfterViewInit {
}
const datasets = assetLabel.map((item) => ({
label: item.label,
- data: [item.labelCount]
+ data: [item.labelCount],
+ datalabels: {},
}));
this.assetLabelChart.data.datasets = datasets;
this.assetLabelChart.update();
@@ -447,6 +467,66 @@ export class AssetProcessingComponent implements OnInit, AfterViewInit {
}
}
+ exportChart(chartInstance: Chart, chartName: string) {
+ const exportDatalabelsOptions = {
+ backgroundColor: function (context: any) {
+ const datasetBackgroundColor = context.chart.data.datasets[context.datasetIndex].backgroundColor;
+ return Array.isArray(datasetBackgroundColor)
+ ? datasetBackgroundColor[context.dataIndex]
+ : datasetBackgroundColor;
+ },
+ borderRadius: 4,
+ color: 'white',
+ display: true,
+ font: {
+ weight: 'bold'
+ },
+ align: 'end',
+ anchor: 'end',
+ padding: 6
+ };
+
+ chartInstance.data.datasets.forEach(dataset => {
+ if (dataset.datalabels) {
+ Object.assign(dataset.datalabels, exportDatalabelsOptions);
+ }
+ });
+ chartInstance.options.plugins!.title = {
+ display: true,
+ text: `${chartName}`,
+ position: 'bottom'
+ };
+ chartInstance.update();
+
+ setTimeout(() => {
+ const canvas = chartInstance.canvas;
+ const dataURL = canvas.toDataURL('image/png');
+ const link = document.createElement('a');
+ link.download = `${chartName}_Export.png`;
+ link.href = dataURL;
+ document.body.appendChild(link);
+ link.click();
+ document.body.removeChild(link);
+
+ setTimeout(() => {
+ const disappearDatalabelsOptions = {
+ display: false
+ };
+
+ chartInstance.data.datasets.forEach(dataset => {
+ if (dataset.datalabels) {
+ Object.assign(dataset.datalabels, disappearDatalabelsOptions);
+ }
+ });
+ chartInstance.options.plugins!.title = {
+ display: false,
+ };
+ chartInstance.update();
+ }, 500);
+
+ }, 150);
+ }
+
updateSort(sortRequest: NbSortRequest): void {
diff --git a/Front End/poam-app/src/app/pages/poam-processing/poam-details/poam-details.component.html b/Front End/poam-app/src/app/pages/poam-processing/poam-details/poam-details.component.html
index 5e84e5fe..80ebdd6f 100644
--- a/Front End/poam-app/src/app/pages/poam-processing/poam-details/poam-details.component.html
+++ b/Front End/poam-app/src/app/pages/poam-processing/poam-details/poam-details.component.html
@@ -98,13 +98,8 @@
-
-
-
-
-
-
+
@@ -116,6 +111,25 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/Front End/poam-app/src/app/pages/poam-processing/poam-details/poam-details.component.ts b/Front End/poam-app/src/app/pages/poam-processing/poam-details/poam-details.component.ts
index b025fd28..5f0996f3 100644
--- a/Front End/poam-app/src/app/pages/poam-processing/poam-details/poam-details.component.ts
+++ b/Front End/poam-app/src/app/pages/poam-processing/poam-details/poam-details.component.ts
@@ -537,7 +537,8 @@ export class PoamDetailsComponent implements OnInit {
status: "Draft",
poamType: "Standard",
vulnIdRestricted: "",
- submittedDate: new Date().toISOString().slice(0, 10)
+ submittedDate: new Date().toISOString().slice(0, 10),
+ scanResultss: "",
};
this.dates.scheduledCompletionDate = this.poam.scheduledCompletionDate;
@@ -803,7 +804,6 @@ let approverSettings = this.poamApproverSettings;
this.poam.requiredResources = (this.poam.requiredResources) ? this.poam.requiredResources : ""
this.poam.vulnIdRestricted = (this.poam.vulnIdRestricted) ? this.poam.vulnIdRestricted : ""
this.subs.sink = this.poamService.updatePoam(this.poam).subscribe(data => {
- // console.log("returned data: ",data)
this.poam = data;
this.getData();
this.showConfirmation("Updated POAM", "Success", "Success", true);
@@ -849,17 +849,14 @@ let approverSettings = this.poamApproverSettings;
});
}
this.poam.assignees = assignees;
- // pass in assets
if (this.poamAssets) {
this.poamAssets.forEach((asset: any) => {
assets.push({ assetId: +asset.assetId })
});
}
this.poam.assets = assets;
- // console.log("adding this.poam: ", this.poam)
this.subs.sink = this.poamService.postPoam(this.poam).subscribe(
res => {
- // console.log("postPoam res: ", res)
if (res.null || res.null == "null") {
this.showConfirmation("unexpected error adding poam");
} else {
@@ -1054,9 +1051,8 @@ let approverSettings = this.poamApproverSettings;
}
confirmEditApprover(event: any) {
- // console.log("poamDetails confirmEditApprover event: ", event)
if (this.poam.poamId === "ADDPOAM") {
- // nothing to do, when the poam is added, we'll the approvers is automatically loaded, the first time it is borughtup in edit mode after the id hasbeen assigned.
+ // nothing to do, when the poam is added, the approvers are automatically loaded, the first time it is brought up in edit mode after the id has been assigned.
event.confirm.reject();
return;
}
@@ -1137,7 +1133,6 @@ let approverSettings = this.poamApproverSettings;
approved: 'Not Reviewed',
comments: event.newData.comments
}
- // console.log("user: ", usert)
if (user) {
approver.firstName = user.firstName;
approver.lastName = user.lastName;
@@ -1146,7 +1141,6 @@ let approverSettings = this.poamApproverSettings;
}
await this.poamService.addPoamApprover(approver).subscribe((res: any) => {
- // console.log("poamDetail confirmCreatePoam res: ", res)
if (res.null) {
this.showConfirmation("Unable to insert row, potentially a duplicate.");
event.confirm.reject();
@@ -1354,7 +1348,7 @@ let approverSettings = this.poamApproverSettings;
this.router.navigateByUrl('/poam-processing');
}
});
- }
+ }
confirm = (dialogOptions: ConfirmationDialogOptions): Observable =>
this.dialogService.open(ConfirmationDialogComponent, {
@@ -1365,6 +1359,35 @@ let approverSettings = this.poamApproverSettings;
},
}).onClose;
+ importScanResultss(): void {
+ const fields = 'id,name,description,status,initiator,owner,ownerGroup,repository,scan,job,details,importStatus,importStart,importFinish,importDuration,downloadAvailable,downloadFormat,dataFormat,resultType,resultSource,running,errorDetails,importErrorDetails,totalIPs,scannedIPs,startTime,finishTime,scanDuration,completedIPs,completedChecks,totalChecks,agentScanUUID,agentScanContainerUUID,progress';
+ if (this.poam && this.poam.iavmNumber) {
+ this.poamService.getTenableScanResultss(this.poam.iavmNumber, fields)
+ .subscribe({
+ next: (data: any) => {
+ const plainText = this.parseJsonToPlainText(data);
+ this.poam.scanResults = plainText;
+ },
+ error: (error: any) => {
+ this.showConfirmation('API key is not properly configured, please contact your C-PAT administrator.');
+ }
+ });
+ } else {
+ console.error('IAVM Number is not available.');
+ }
+ }
+
+ parseJsonToPlainText(data: any, indent: string = ''): string {
+ let plainText = '';
+ Object.keys(data).forEach(key => {
+ if (typeof data[key] === 'object' && data[key] !== null) {
+ plainText += `${indent}${key}:\n${this.parseJsonToPlainText(data[key], indent + ' ')}`;
+ } else {
+ plainText += `${indent}${key}: ${data[key]}\n`;
+ }
+ });
+ return plainText;
+ }
ngOnDestroy() {
this.subs.unsubscribe();
diff --git a/Front End/poam-app/src/app/pages/poam-processing/poams.component.html b/Front End/poam-app/src/app/pages/poam-processing/poams.component.html
index 2de120c4..566ec4d3 100644
--- a/Front End/poam-app/src/app/pages/poam-processing/poams.component.html
+++ b/Front End/poam-app/src/app/pages/poam-processing/poams.component.html
@@ -27,6 +27,9 @@
+
@@ -66,6 +69,9 @@
+
@@ -102,6 +108,9 @@
+
@@ -141,6 +150,9 @@
+
diff --git a/Front End/poam-app/src/app/pages/poam-processing/poams.component.scss b/Front End/poam-app/src/app/pages/poam-processing/poams.component.scss
index 79752aa5..8ba9bc05 100644
--- a/Front End/poam-app/src/app/pages/poam-processing/poams.component.scss
+++ b/Front End/poam-app/src/app/pages/poam-processing/poams.component.scss
@@ -17,8 +17,16 @@
}
.canvas {
- max-height: 50vh;
- max-width: 100vw;
+ position: relative;
+ max-height: 50vh;
+ max-width: 100vw;
+}
+
+.export-button {
+ position: absolute;
+ top: 0;
+ right: 0;
+ margin-right: 0;
}
hr {
diff --git a/Front End/poam-app/src/app/pages/poam-processing/poams.component.ts b/Front End/poam-app/src/app/pages/poam-processing/poams.component.ts
index 0680ea3d..91763684 100644
--- a/Front End/poam-app/src/app/pages/poam-processing/poams.component.ts
+++ b/Front End/poam-app/src/app/pages/poam-processing/poams.component.ts
@@ -20,6 +20,7 @@ import { KeycloakProfile } from 'keycloak-js';
import { UsersService } from '../user-processing/users.service';
import { Chart, registerables, ChartData } from 'chart.js';
import { addDays, differenceInCalendarDays } from 'date-fns';
+import ChartDataLabels from 'chartjs-plugin-datalabels';
interface Permission {
userId: number;
@@ -80,9 +81,25 @@ estimatedCompletionChartData: ChartData<'bar'> = {
maintainAspectRatio: false,
scales: {
x: { grid: { display: true } },
- y: { beginAtZero: true, grid: { display: false } },
+ y: {
+ beginAtZero: true,
+ grace: '5%',
+ grid: {
+ display: false
+ },
+ ticks: {
+ font: {
+ size: 13,
+ family: 'sans-serif',
+ weight: 600,
+ },
+ }
+ },
},
plugins: {
+ title: {
+ display: false,
+ },
legend: {
display: true,
position: this.selectedPosition,
@@ -92,7 +109,7 @@ estimatedCompletionChartData: ChartData<'bar'> = {
family: 'sans-serif',
weight: 600,
}
- }
+ },
},
},
};
@@ -155,11 +172,15 @@ estimatedCompletionChartData: ChartData<'bar'> = {
}
private initializeChart(): void {
+ Chart.defaults.set('plugins.datalabels', {
+ display: false,
+ });
this.cdr.detectChanges();
if (this.poamStatusChart?.nativeElement) {
this.statusChart = new Chart(this.poamStatusChart.nativeElement, {
type: 'bar',
data: this.statusChartData,
+ plugins: [ChartDataLabels],
options: this.barChartOptions,
});
if (this.poamStatus) {
@@ -173,6 +194,7 @@ estimatedCompletionChartData: ChartData<'bar'> = {
this.labelChart = new Chart(this.poamLabelChart.nativeElement, {
type: 'bar',
data: this.labelChartData,
+ plugins: [ChartDataLabels],
options: this.barChartOptions,
});
if (this.poamLabel) {
@@ -186,6 +208,7 @@ estimatedCompletionChartData: ChartData<'bar'> = {
this.severityChart = new Chart(this.poamSeverityChart.nativeElement, {
type: 'bar',
data: this.severityChartData,
+ plugins: [ChartDataLabels],
options: this.barChartOptions,
});
if (this.poamSeverity) {
@@ -199,6 +222,7 @@ estimatedCompletionChartData: ChartData<'bar'> = {
this.estimatedCompletionChart = new Chart(this.poamEstimatedCompletionChart.nativeElement, {
type: 'bar',
data: this.estimatedCompletionChartData,
+ plugins: [ChartDataLabels],
options: this.barChartOptions,
});
if (this.poamEstimatedCompletion) {
@@ -332,7 +356,8 @@ estimatedCompletionChartData: ChartData<'bar'> = {
}
const datasets = poamStatus.map((item) => ({
label: item.status,
- data: [item.statusCount]
+ data: [item.statusCount],
+ datalabels: {},
}));
this.statusChart.data.datasets = datasets;
this.statusChart.update();
@@ -346,7 +371,8 @@ estimatedCompletionChartData: ChartData<'bar'> = {
}
const datasets = poamLabel.map((item) => ({
label: item.label,
- data: [item.labelCount]
+ data: [item.labelCount],
+ datalabels: {},
}));
this.labelChart.data.datasets = datasets;
this.labelChart.update();
@@ -360,7 +386,8 @@ estimatedCompletionChartData: ChartData<'bar'> = {
}
const datasets = poamSeverity.map((item) => ({
label: item.severity,
- data: [item.severityCount]
+ data: [item.severityCount],
+ datalabels: {},
}));
this.severityChart.data.datasets = datasets;
@@ -374,7 +401,8 @@ estimatedCompletionChartData: ChartData<'bar'> = {
}
const datasets = poamEstimatedCompletion.map((item) => ({
label: item.estimatedCompletion,
- data: [item.estimatedCompletionCount]
+ data: [item.estimatedCompletionCount],
+ datalabels: {},
}));
this.estimatedCompletionChart.data.datasets = datasets;
@@ -505,4 +533,73 @@ estimatedCompletionChartData: ChartData<'bar'> = {
this.updateEstimatedCompletionChartData(filteredPoamEstimatedCompletion);
};
+
+ exportChart(chartInstance: Chart, chartName: string) {
+ const exportDatalabelsOptions = {
+ backgroundColor: function (context: any) {
+ const datasetBackgroundColor = context.chart.data.datasets[context.datasetIndex].backgroundColor;
+ return Array.isArray(datasetBackgroundColor)
+ ? datasetBackgroundColor[context.dataIndex]
+ : datasetBackgroundColor;
+ },
+ borderRadius: 4,
+ color: 'white',
+ display: true,
+ font: {
+ weight: 'bold'
+ },
+ align: 'end',
+ anchor: 'end',
+ padding: 6
+ };
+
+ chartInstance.data.datasets.forEach(dataset => {
+ if (dataset.datalabels) {
+ Object.assign(dataset.datalabels, exportDatalabelsOptions);
+ }
+ });
+
+ chartInstance.options.plugins!.title = {
+ display: true,
+ position: 'bottom',
+ text: `${chartName}`,
+ font: {
+ size: 16,
+ family: 'sans-serif',
+ weight: 600,
+ },
+ };
+ chartInstance.update();
+
+ setTimeout(() => {
+ const canvas = chartInstance.canvas;
+ const dataURL = canvas.toDataURL('image/png');
+ const link = document.createElement('a');
+ link.download = `${chartName}_Export.png`;
+ link.href = dataURL;
+ document.body.appendChild(link);
+ link.click();
+ document.body.removeChild(link);
+
+ setTimeout(() => {
+ const disappearDatalabelsOptions = {
+ display: false
+ };
+
+ chartInstance.data.datasets.forEach(dataset => {
+ if (dataset.datalabels) {
+ Object.assign(dataset.datalabels, disappearDatalabelsOptions);
+ }
+ });
+ chartInstance.options.plugins!.title = {
+ display: false,
+ };
+ chartInstance.update();
+ }, 500);
+
+ }, 150);
+ }
+
+
}
+
diff --git a/Front End/poam-app/src/app/pages/poam-processing/poams.module.ts b/Front End/poam-app/src/app/pages/poam-processing/poams.module.ts
index df1575af..ed735a63 100644
--- a/Front End/poam-app/src/app/pages/poam-processing/poams.module.ts
+++ b/Front End/poam-app/src/app/pages/poam-processing/poams.module.ts
@@ -17,6 +17,7 @@ import { Angular2SmartTableModule } from 'angular2-smart-table';
import { FormsModule } from '@angular/forms';
import { provideCharts, withDefaultRegisterables } from 'ng2-charts';
import { AppComponent } from '../../app.component';
+import { NbEvaIconsModule } from '@nebular/eva-icons';
@NgModule({
declarations: [
@@ -31,6 +32,7 @@ import { AppComponent } from '../../app.component';
NbDatepickerModule,
NbFormFieldModule,
NbIconModule,
+ NbEvaIconsModule,
NbInputModule,
FormsModule,
PoamsRoutingModule,
diff --git a/Front End/poam-app/src/app/pages/poam-processing/poams.service.ts b/Front End/poam-app/src/app/pages/poam-processing/poams.service.ts
index 1b864025..085e2029 100644
--- a/Front End/poam-app/src/app/pages/poam-processing/poams.service.ts
+++ b/Front End/poam-app/src/app/pages/poam-processing/poams.service.ts
@@ -227,4 +227,20 @@ deletePoamMilestone(poamId: string, milestoneId: string) {
return this.http
.delete(`${this.uri}/poamLabel/poam/${poamId}/label/${labelId}`, this.httpOptions);
}
+
+ getTenableScanResultss(iavmNumber: string, fields?: string) {
+ const tenableAccessKey = environment.tenableAccessKey;
+ const tenableSecretKey = environment.tenableSecretKey;
+ const endpoint = `${environment.getScanResultssFromTenableEndpoint}${iavmNumber}`;
+ const url = fields ? `${endpoint}?fields=${fields}` : endpoint;
+
+ const headers = new HttpHeaders({
+ 'Content-Type': 'application/json',
+ 'X-ApiKeys': `accessKey=${tenableAccessKey}; secretKey=${tenableSecretKey}`
+ });
+
+ return this.http.get(url, { headers }).pipe(
+ catchError(this.handleError)
+ );
+ }
}
diff --git a/Front End/poam-app/src/environments/environment.local.ts b/Front End/poam-app/src/environments/environment.local.ts
index 032896aa..4574a7be 100644
--- a/Front End/poam-app/src/environments/environment.local.ts
+++ b/Front End/poam-app/src/environments/environment.local.ts
@@ -17,6 +17,9 @@ export const environment = {
fileUploadEndpoint: 'http://localhost:8086/api/poamimport',
stigmanCollectionImportEndpoint: 'http://localhost:8086/api/stigmancollectionimport',
stigmanAssetImportEndpoint: 'http://localhost:8086/api/stigmanassetimport',
+ getScanResultssFromTenableEndpoint: 'http://0.0.0.0:9000/scanResults/', //placeholder
+ tenableAccessKey: 'placeholder',
+ tenableSecretKey: 'placeholder',
getSTIGsFromSTIGMANEndpoint: 'http://localhost:54000/api/stigs/',
getCollectionsFromSTIGMANEndpoint: 'http://localhost:54000/api/collections/',
getAvailableAssetsFromSTIGMANEndpoint: 'http://localhost:54000/api/assets?collectionId=',
diff --git a/Front End/poam-app/src/environments/environment.prod.ts b/Front End/poam-app/src/environments/environment.prod.ts
index 42053faf..2d9f469a 100644
--- a/Front End/poam-app/src/environments/environment.prod.ts
+++ b/Front End/poam-app/src/environments/environment.prod.ts
@@ -15,6 +15,9 @@ export const environment = {
fileUploadEndpoint: 'http://localhost:8086/api/poamimport',
stigmanCollectionImportEndpoint: 'http://localhost:8086/api/stigmancollectionimport',
stigmanAssetImportEndpoint: 'http://localhost:8086/api/stigmanassetimport',
+ getScanResultssFromTenableEndpoint: 'http://0.0.0.0:9000/scanResults/', //placeholder
+ tenableAccessKey: 'placeholder',
+ tenableSecretKey: 'placeholder',
getCollectionsFromSTIGMANEndpoint: 'http://localhost:54000/api/collections/',
getAvailableAssetsFromSTIGMANEndpoint: 'http://localhost:54000/api/assets?collectionId=',
getAssetsFromSTIGMANEndpoint: 'http://localhost:54000/api/assets/',
diff --git a/Front End/poam-app/src/environments/environment.ts b/Front End/poam-app/src/environments/environment.ts
index ee1f4544..77e7be1f 100644
--- a/Front End/poam-app/src/environments/environment.ts
+++ b/Front End/poam-app/src/environments/environment.ts
@@ -21,6 +21,9 @@ export const environment = {
fileUploadEndpoint: 'http://localhost:8086/api/poamimport',
stigmanCollectionImportEndpoint: 'http://localhost:8086/api/stigmancollectionimport',
stigmanAssetImportEndpoint: 'http://localhost:8086/api/stigmanassetimport',
+ getScanResultssFromTenableEndpoint: 'http://0.0.0.0:9000/scanResults/', //placeholder
+ tenableAccessKey: 'placeholder',
+ tenableSecretKey: 'placeholder',
getCollectionsFromSTIGMANEndpoint: 'http://localhost:54000/api/collections/',
getAvailableAssetsFromSTIGMANEndpoint: 'http://localhost:54000/api/assets?collectionId=',
getAssetsFromSTIGMANEndpoint: 'http://localhost:54000/api/assets/',