-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Add start to graphs and an index page (#32)
* Add some graphs for the images view, no real data in them yet * Add index page with beginner graphs * Add index view data for images * switch colors in pie charts * fix golint with variable bump
- Loading branch information
1 parent
3da86f6
commit 3e18369
Showing
12 changed files
with
286 additions
and
3 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,28 @@ | ||
| package index | ||
|
|
||
| import ( | ||
| imagesview "github.com/starttoaster/trivy-operator-explorer/internal/web/views/images" | ||
| ) | ||
|
|
||
| // GetView converts some report data to the / view | ||
| func GetView(vulnList imagesview.View) View { | ||
| var i View | ||
|
|
||
| for _, image := range vulnList { | ||
| i.CriticalVulnerabilities += len(image.CriticalVulnerabilities) | ||
| i.HighVulnerabilities += len(image.HighVulnerabilities) | ||
| i.MediumVulnerabilities += len(image.MediumVulnerabilities) | ||
| i.LowVulnerabilities += len(image.LowVulnerabilities) | ||
|
|
||
| i.FixAvailableCount += image.FixAvailableCount | ||
| i.NoFixAvailableCount += image.NoFixAvailableCount | ||
|
|
||
| if image.OSEndOfServiceLife != "" { | ||
| i.EOSLCount++ | ||
| } else { | ||
| i.NoEOSLCount++ | ||
| } | ||
| } | ||
|
|
||
| return i | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,14 @@ | ||
| package index | ||
|
|
||
| // View contains data for the index page | ||
| type View struct { | ||
| // Data for image vulnerabilities | ||
| CriticalVulnerabilities int | ||
| HighVulnerabilities int | ||
| MediumVulnerabilities int | ||
| LowVulnerabilities int | ||
| FixAvailableCount int | ||
| NoFixAvailableCount int | ||
| EOSLCount int | ||
| NoEOSLCount int | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,120 @@ | ||
| <!DOCTYPE html> | ||
| <html lang="en"> | ||
| <title>Explorer: Images</title> | ||
| <meta charset="UTF-8"> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
| <link href="/static/css/output.css" rel="stylesheet"> | ||
| <link href="/static/css/extra.css" rel="stylesheet"> | ||
| <script src="/static/js/chart.js"></script> | ||
| </head> | ||
| <body class="min-h-screen bg-gray-200 dark:bg-indigo-900"> | ||
|
|
||
| <!-- Sidebar --> | ||
| {{template "sidebar.html"}} | ||
|
|
||
| <div class="p-4 sm:ml-64 bg-gray-200 dark:bg-indigo-900"> | ||
| <!-- Images content --> | ||
| <div class="p-4 relative overflow-x-auto shadow-md rounded-lg bg-gray-50 dark:bg-gray-800"> | ||
| <div class="w-full text-xl text-center text-black dark:text-white"> | ||
| <a href="/images"> | ||
| Image Vulnerabilities | ||
| </a> | ||
| </div> | ||
|
|
||
| <div id="images-wrapper"> | ||
| <div id="c1"><canvas id="vulnChart"></canvas></div> | ||
| <div id="c2"><canvas id="eoslChart"></canvas></div> | ||
| <div id="c3"><canvas id="fixedChart"></canvas></div> | ||
| </div> | ||
|
|
||
| <script defer> | ||
| Chart.defaults.font.size = 16; | ||
| if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) { | ||
| Chart.defaults.color = '#fff'; | ||
| } else { | ||
| Chart.defaults.color = '#000'; | ||
| } | ||
| new Chart(document.getElementById('vulnChart'), { | ||
| type: 'bar', | ||
| data: { | ||
| labels: ['Critical', 'High', 'Medium', 'Low'], | ||
| datasets: [{ | ||
| label: 'Severity', | ||
| data: [{{ .CriticalVulnerabilities }}, {{ .HighVulnerabilities }}, {{ .MediumVulnerabilities }}, {{ .LowVulnerabilities }}], | ||
| backgroundColor: [ | ||
| 'rgba(255, 0, 0, 1)', | ||
| 'rgba(255, 125, 20, 1)', | ||
| 'rgba(255, 255, 0, 1)', | ||
| 'rgba(30, 30, 210, 1)' | ||
| ], | ||
| }] | ||
| }, | ||
| options: { | ||
| indexAxis: 'y', | ||
| responsive: true, | ||
| scales: { | ||
| y: { | ||
| beginAtZero: true | ||
| } | ||
| } | ||
| } | ||
| }); | ||
| </script> | ||
|
|
||
| <script defer> | ||
| Chart.defaults.font.size = 16; | ||
| if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) { | ||
| Chart.defaults.color = '#fff'; | ||
| } else { | ||
| Chart.defaults.color = '#000'; | ||
| } | ||
| new Chart(document.getElementById('eoslChart'), { | ||
| type: 'pie', | ||
| data: { | ||
| labels: ['Not EoSL', 'EoSL'], | ||
| datasets: [{ | ||
| label: 'End of Service Life images', | ||
| data: [{{ .NoEOSLCount }}, {{ .EOSLCount }}], | ||
| backgroundColor: [ | ||
| 'rgba(39, 245, 127, 1)', | ||
| 'rgba(249, 51, 51, 1)' | ||
| ], | ||
| }] | ||
| }, | ||
| options: { | ||
| borderWidth: 0, | ||
| responsive: true | ||
| } | ||
| }); | ||
| </script> | ||
|
|
||
| <script defer> | ||
| Chart.defaults.font.size = 16; | ||
| if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) { | ||
| Chart.defaults.color = '#fff'; | ||
| } else { | ||
| Chart.defaults.color = '#000'; | ||
| } | ||
| new Chart(document.getElementById('fixedChart'), { | ||
| type: 'pie', | ||
| data: { | ||
| labels: ['Has fix', 'No fix'], | ||
| datasets: [{ | ||
| label: 'Fix Available', | ||
| data: [{{ .FixAvailableCount }}, {{ .NoFixAvailableCount }}], | ||
| backgroundColor: [ | ||
| 'rgba(39, 245, 127, 1)', | ||
| 'rgba(249, 51, 51, 1)' | ||
| ], | ||
| }] | ||
| }, | ||
| options: { | ||
| borderWidth: 0, | ||
| responsive: true | ||
| } | ||
| }); | ||
| </script> | ||
| </div> | ||
| </div> | ||
| </body> | ||
| </html> |
Oops, something went wrong.