From 760eef08f2cd87dc263be772385ee97fe574418d Mon Sep 17 00:00:00 2001
From: Yogesh Ojha <yogesh.ojha11@gmail.com>
Date: Wed, 13 Apr 2022 00:05:43 +0530
Subject: [PATCH] Fix vulnerability highlights on target summary

---
 .../templates/startScan/detail_scan.html      |  36 ++-
 web/targetApp/templates/target/list.html      |   3 +-
 web/targetApp/templates/target/summary.html   | 292 ++++++++++++++----
 web/targetApp/views.py                        |   2 +-
 4 files changed, 266 insertions(+), 67 deletions(-)

diff --git a/web/startScan/templates/startScan/detail_scan.html b/web/startScan/templates/startScan/detail_scan.html
index 1353f680..11b65fe6 100644
--- a/web/startScan/templates/startScan/detail_scan.html
+++ b/web/startScan/templates/startScan/detail_scan.html
@@ -317,7 +317,7 @@ Scan Findings
 								<p class="text-muted mb-0">
 									<span class="w-title text-danger">{{critical_count}} Critical, {{high_count}} High, {{medium_count}} Medium</span>
 									<br>
-									<span class="w-title text-primary">{{low_count}} Low Vulnerabilities and {{info_count}} Informational Vulnerabilities</span>
+									<span class="w-title text-primary">{{low_count}} Low and {{info_count}} Info Vulnerabilities</span>
 								</p>
 								{% else %}
 								<p class="text-muted mb-0 small">Vulnerability scan hasn't been performed.</p>
@@ -539,22 +539,28 @@ Scan Findings
 								<h4 class="header-title mb-0">Vulnerability Breakdown by Severity</h4>
 								<div id="cardCollpase19" class="collapse pt-3 show" dir="ltr">
 									<div class="row mt-3 text-center">
-										<div class="col-3">
+										<div class="col-1">
+										</div>
+										<div class="col-2">
 											<p class="text-critical font-15 mb-1 text-truncate">Critical</p>
 											<h4 class="text-critical">{{critical_count}}</h4>
 										</div>
-										<div class="col-3">
+										<div class="col-2">
 											<p class="text-danger font-15 mb-1 text-truncate">High</p>
 											<h4 class="text-danger">{{high_count}}</h4>
 										</div>
-										<div class="col-3">
+										<div class="col-2">
 											<p class="text-warning font-15 mb-1 text-truncate">Medium</p>
 											<h4 class="text-warning">{{medium_count}}</h4>
 										</div>
-										<div class="col-3">
+										<div class="col-2">
 											<p class="text-low font-15 mb-1 text-truncate">Low</p>
 											<h4 class="text-low">{{low_count}}</h4>
 										</div>
+										<div class="col-2">
+											<p class="text-low font-15 mb-1 text-truncate">Info</p>
+											<h4 class="text-primary">{{info_count}}</h4>
+										</div>
 									</div>
 									<div id="vulnerability-pie-chart" class="apex-charts"></div>
 								</div>
@@ -569,19 +575,31 @@ Scan Findings
 									<table class="table table-borderless table-nowrap table-hover table-centered m-0">
 										<thead class="table-light">
 											<tr>
-												<th style="width: 40%">Vulnerability</th>
+												<th style="width: 10%">Type</th>
+												<th style="width: 35%">Vulnerability</th>
 												<th style="width: 10%">Severity</th>
-												<th style="width: 50%">Vulnerable URL</th>
+												<th style="width: 45%">Vulnerable URL</th>
 											</tr>
 										</thead>
 										<tbody>
 											{% for vulnerability in vulnerability_list %}
 											<tr>
-												<td>{{vulnerability.name}}<br><small class="text-muted">Discovered: {{vulnerability.discovered_date|naturaltime}}</small></td>
+												<td><span class="badge badge-soft-primary">{{vulnerability.type}}</span></td>
+												<td>
+													{{vulnerability.name}}
+													{% if vulnerability.cve_ids %}
+														<br>
+														{% for cve in vulnerability.cve_ids %}
+															<span class="badge badge-soft-danger" data-toggle="tooltip" data-placement="top" title="CVE ID">{{cve}}</span>
+														{% endfor %}
+													{% endif %}
+													<br>
+													<small class="text-muted">Discovered: {{vulnerability.discovered_date|naturaltime}}</small>
+												</td>
 												<td>{% if vulnerability.severity == 0 %}
 													<span class='badge badge-soft-info'>Info</span>
 													{% elif vulnerability.severity == 1 %}
-													<span class='badge badge-soft-low'>Low</span>
+													<span class='badge badge-low'>Low</span>
 													{% elif vulnerability.severity == 2 %}
 													<span class='badge badge-soft-warning'>Medium</span>
 													{% elif vulnerability.severity == 3 %}
diff --git a/web/targetApp/templates/target/list.html b/web/targetApp/templates/target/list.html
index 949f45b9..b459742a 100644
--- a/web/targetApp/templates/target/list.html
+++ b/web/targetApp/templates/target/list.html
@@ -97,6 +97,7 @@ Targets
               <td class="text-center">
                 <div class="btn-group mb-2 dropstart">
                   <div class="btn-group">
+                    <a class="btn btn-soft-primary" href="{% url 'target_summary' domain.id %}"><i class="fe-info"></i>&nbsp;&nbsp;Target Summary</a>
                     <a href="{% url 'start_scan' domain.id %}" class="btn btn-soft-primary"><i class="fe-zap"></i>&nbsp;&nbsp;Initiate Scan</a>
                     <div class="btn-group dropstart" role="group">
                       <button type="button" class="btn btn-soft-primary dropdown-toggle dropdown-toggle-split" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
@@ -105,8 +106,6 @@ Targets
                       <div class="dropdown-menu" style="">
                         <a class="dropdown-item" href="{% url 'schedule_scan' domain.id %}"><i class="fe-clock"></i>&nbsp;&nbsp;Schedule Scan</a>
                         <div class="dropdown-divider"></div>
-                        <a class="dropdown-item" href="{% url 'target_summary' domain.id %}"><i class="fe-info"></i>&nbsp;&nbsp;Target Summary</a>
-                        <div class="dropdown-divider"></div>
                         <a class="dropdown-item" href="{% url 'update_target' domain.id %}"><i class="fe-edit-2"></i>&nbsp;&nbsp;Edit Target</a>
                         <a class="dropdown-item text-danger" href="#" onclick="delete_target({{ domain.id }}, '{{ domain.name }}')"><i class="fe-trash-2"></i>&nbsp;&nbsp;Delete target</a>
                       </div>
diff --git a/web/targetApp/templates/target/summary.html b/web/targetApp/templates/target/summary.html
index 0369e9d6..68183916 100644
--- a/web/targetApp/templates/target/summary.html
+++ b/web/targetApp/templates/target/summary.html
@@ -161,7 +161,7 @@ Target Summary
 								<p class="text-muted mb-0">
 									<span class="w-title text-danger">{{critical_count}} Critical, {{high_count}} High, {{medium_count}} Medium</span>
 									<br>
-									<span class="w-title text-primary">{{low_count}} Low Vulnerabilities, {{info_count}} Informational Vulnerabilities</span>
+									<span class="w-title text-primary">{{low_count}} Low, {{info_count}} Info Vulnerabilities</span>
 								</p>
 							</div>
 						</div>
@@ -335,6 +335,95 @@ Target Summary
 						</div>
 					</div>
 				</div>
+				<div class="row">
+					<div class="col-xl-5 col-lg-5 col-12">
+						<div class="card" style="height: 95%">
+							<div class="card-body">
+								<h4 class="header-title mb-0">Vulnerability Breakdown by Severity</h4>
+								<div id="cardCollpase19" class="collapse pt-3 show" dir="ltr">
+									<div class="row mt-3 text-center">
+										<div class="col-1">
+
+										</div>
+										<div class="col-2">
+											<p class="text-critical font-15 mb-1 text-truncate">Critical</p>
+											<h4 class="text-critical">{{critical_count}}</h4>
+										</div>
+										<div class="col-2">
+											<p class="text-danger font-15 mb-1 text-truncate">High</p>
+											<h4 class="text-danger">{{high_count}}</h4>
+										</div>
+										<div class="col-2">
+											<p class="text-warning font-15 mb-1 text-truncate">Medium</p>
+											<h4 class="text-warning">{{medium_count}}</h4>
+										</div>
+										<div class="col-2">
+											<p class="text-low font-15 mb-1 text-truncate">Low</p>
+											<h4 class="text-low">{{low_count}}</h4>
+										</div>
+										<div class="col-2">
+											<p class="text-low font-15 mb-1 text-truncate">Info</p>
+											<h4 class="text-primary">{{info_count}}</h4>
+										</div>
+									</div>
+									<div id="vulnerability-pie-chart" class="apex-charts"></div>
+								</div>
+							</div>
+						</div>
+					</div>
+					<div class="col-xl-7 col-lg-7 col-12">
+						<div class="card" style="height: 95%">
+							<div class="card-body">
+								<h4 class="header-title mb-3">Vulnerability Highlights</h4>
+								<div class="inbox-widget table-responsive" data-simplebar style="max-height: 407px;">
+									<table class="table table-borderless table-nowrap table-hover table-centered m-0">
+										<thead class="table-light">
+											<tr>
+												<th style="width: 10%">Type</th>
+												<th style="width: 35%">Vulnerability</th>
+												<th style="width: 10%">Severity</th>
+												<th style="width: 45%">Vulnerable URL</th>
+											</tr>
+										</thead>
+										<tbody>
+											{% for vulnerability in vulnerability_list %}
+											<tr>
+												<td><span class="badge badge-soft-primary">{{vulnerability.type}}</span></td>
+												<td>
+													{{vulnerability.name}}
+													{% if vulnerability.cve_ids %}
+														<br>
+														{% for cve in vulnerability.cve_ids %}
+															<span class="badge badge-soft-danger" data-toggle="tooltip" data-placement="top" title="CVE ID">{{cve}}</span>
+														{% endfor %}
+													{% endif %}
+													<br>
+													<small class="text-muted">Discovered: {{vulnerability.discovered_date|naturaltime}}</small>
+												</td>
+												<td>{% if vulnerability.severity == 0 %}
+													<span class='badge badge-soft-info'>Info</span>
+													{% elif vulnerability.severity == 1 %}
+													<span class='badge badge-low'>Low</span>
+													{% elif vulnerability.severity == 2 %}
+													<span class='badge badge-soft-warning'>Medium</span>
+													{% elif vulnerability.severity == 3 %}
+													<span class='badge badge-soft-danger'>High</span>
+													{% elif vulnerability.severity == 4 %}
+													<span class='badge badge-critical'>Critical</span>
+													{% endif %}
+												</td>
+												<td><a href="{{vulnerability.http_url}}" target="_blank" class="text-danger bs-tooltip" title="{{vulnerability.http_url}}">{{vulnerability.http_url|truncatechars:50}}</a></td>
+											</tr>
+											{% empty %}
+											Not enough data.
+											{% endfor %}
+										</tbody>
+									</table>
+								</div>
+							</div>
+						</div>
+					</div>
+				</div>
 			</div>
 		</div>
 	</div>
@@ -348,65 +437,158 @@ Target Summary
 <script src="https://apexcharts.com/samples/assets/ohlc.js"></script>
 
 <script type="text/javascript">
-// depending on http_status_breakdown, generate color
-var colors = [
-	{% for status in http_status_breakdown %}
-	{% if status.http_status >= 200 and status.http_status < 300 %}
-	'#4CAF50',
-	{% elif status.http_status >= 300 and status.http_status < 400 %}
-	'#FFC107',
-	{% else %}
-	'#F44336',
-	{% endif %}
-	{% endfor %}
-];
 
-// http_status chart
-var options = {
-	series: [{
-		name: 'Subdomains',
-		data: [{% for status in http_status_breakdown %}
-			{{status.http_status__count}},
-			{% endfor %}]
-		}],
-		chart: {
-			height: 350,
-			type: 'bar',
-			events: {
-				click: function(chart, w, e) {
-					// console.log(chart, w, e)
+$(document).ready(function(){
+	$('[data-toggle="tooltip"]').tooltip();
+	// HTTP STATUS Breakdown chart
+	// depending on http_status_breakdown, generate color
+	var colors = [
+		{% for status in http_status_breakdown %}
+		{% if status.http_status >= 200 and status.http_status < 300 %}
+		'#4CAF50',
+		{% elif status.http_status >= 300 and status.http_status < 400 %}
+		'#FFC107',
+		{% else %}
+		'#F44336',
+		{% endif %}
+		{% endfor %}
+	];
+
+	// http_status chart
+	var options = {
+		series: [{
+			name: 'Subdomains',
+			data: [{% for status in http_status_breakdown %}
+				{{status.http_status__count}},
+				{% endfor %}]
+			}],
+			chart: {
+				height: 350,
+				type: 'bar',
+				events: {
+					click: function(chart, w, e) {
+						// console.log(chart, w, e)
+					}
+				}
+			},
+			colors: colors,
+			plotOptions: {
+				bar: {
+					columnWidth: '45%',
+					distributed: true,
+				}
+			},
+			dataLabels: {
+				enabled: false
+			},
+			legend: {
+				show: false
+			},
+			xaxis: {
+				categories: [
+					{% for status in http_status_breakdown %}
+					'{{status.http_status}}',
+					{% endfor %}
+				],
+				labels: {
+					style: {
+						colors: colors,
+						fontSize: '12px'
+					}
 				}
 			}
-		},
-		colors: colors,
-		plotOptions: {
-			bar: {
-				columnWidth: '45%',
-				distributed: true,
-			}
-		},
-		dataLabels: {
-			enabled: false
-		},
-		legend: {
-			show: false
-		},
-		xaxis: {
-			categories: [
-				{% for status in http_status_breakdown %}
-				'{{status.http_status}}',
-				{% endfor %}
-			],
-			labels: {
-				style: {
-					colors: colors,
-					fontSize: '12px'
+		};
+
+		// vulnerability pie chart
+		var options = {
+			chart: {
+				type: 'donut',
+				height: 280,
+			},
+			colors: ['#D50000', '#F44336', '#FF6D00', '#FFD600', '#2962FF'],
+			dataLabels: {
+				enabled: false
+			},
+			legend: {
+				show: !0,
+				position: "bottom",
+				horizontalAlign: "center",
+				verticalAlign: "middle",
+				floating: !1,
+				fontSize: "15px",
+				offsetX: 0,
+				offsetY: 7
+			},
+			plotOptions: {
+				pie: {
+					donut: {
+						size: '70%',
+						background: 'transparent',
+						labels: {
+							show: true,
+							name: {
+								show: true,
+								fontSize: '29px',
+								fontFamily: 'Nunito, sans-serif',
+								color: undefined,
+								offsetY: -10
+							},
+							value: {
+								show: true,
+								fontSize: '26px',
+								fontFamily: 'Nunito, sans-serif',
+								color: '20',
+								offsetY: 16,
+								formatter: function (val) {
+									return val
+								}
+							},
+							total: {
+								show: true,
+								showAlways: true,
+								label: 'Total',
+								color: '#888ea8',
+								formatter: function (w) {
+									return w.globals.seriesTotals.reduce( function(a, b) {
+										return a + b
+									}, 0)
+								}
+							}
+						}
+					}
 				}
-			}
+			},
+			series: [{{critical_count}}, {{high_count}}, {{medium_count}}, {{low_count}}, {{info_count}}],
+			labels: ['Critical', 'High', 'Medium', 'Low', 'Info'],
+			responsive: [{
+				breakpoint: 1599,
+				options: {
+					chart: {
+						height: 240
+					},
+					legend: {
+						position: 'bottom'
+					}
+				},
+				breakpoint: 1439,
+				options: {
+					chart: {
+						width: '250px',
+						height: '390px'
+					},
+				},
+			}],
 		}
-	};
 
-	var chart = new ApexCharts(document.querySelector("#http_status_chart"), options);
-	chart.render();
+		var chart = new ApexCharts(
+			document.querySelector("#vulnerability-pie-chart"),
+			options
+		);
+
+		chart.render()
+
+		var chart = new ApexCharts(document.querySelector("#http_status_chart"), options);
+		chart.render();
+});
 </script>
 {% endblock page_level_script %}
diff --git a/web/targetApp/views.py b/web/targetApp/views.py
index d50e392f..c5a2eac4 100644
--- a/web/targetApp/views.py
+++ b/web/targetApp/views.py
@@ -281,7 +281,7 @@ def target_summary(request, id):
     context['vulnerability_count'] = vulnerability_count
 
     context['vulnerability_list'] = Vulnerability.objects.filter(
-        target_domain__id=id).order_by('-severity').all()[:20]
+        target_domain__id=id).order_by('-severity').all()[:30]
 
     context['http_status_breakdown'] = Subdomain.objects.filter(target_domain=id).exclude(http_status=0).values('http_status').annotate(Count('http_status'))