(feat) add pagination to detail view

sensepost · Jun 9, 2022 · 0c14e67 · 0c14e67
1 parent b08d3b1
commit 0c14e67
Show file tree

Hide file tree

Showing 3 changed files with 81 additions and 6 deletions.
diff --git a/cmd/server.go b/cmd/server.go
@@ -255,16 +255,34 @@ func detailHandler(c *gin.Context) {
 		Preload("Network").
 		First(&url, id)
 
+	// get pagination limits
+	var max uint
+	rsDB.Model(storage.URL{}).Select("max(id)").First(&max)
+
+	previous := url.ID
+	next := url.ID
+
+	if previous > 0 {
+		previous = previous - 1
+	}
+
+	if next < max {
+		next = next + 1
+	}
+
 	c.HTML(http.StatusOK, "detail.html", gin.H{
-		"Data": url,
+		"Data":     url,
+		"Previous": previous,
+		"Next":     next,
+		"Max":      max,
 	})
 }
 
 // tableHandler handles the URL table view
 func tableHandler(c *gin.Context) {
 
 	var urls []storage.URL
-	rsDB.Find(&urls)
+	rsDB.Preload("Network").Preload("Console").Find(&urls)
 
 	c.HTML(http.StatusOK, "table.html", gin.H{
 		"Data": urls,

diff --git a/web/ui-templates/detail.html b/web/ui-templates/detail.html
@@ -14,6 +14,35 @@ <h2 class="page-title">
           URL Details
         </h2>
       </div>
+
+      <div class="col-12 col-md-auto ms-auto d-print-none">
+        <div class="btn-list">
+          <a href="/details/{{ .Previous }}"
+            class="btn d-none d-sm-inline-block {{ if eq .Previous 0 }}disabled{{ end }}">
+            <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-chevrons-left" width="24"
+              height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round"
+              stroke-linejoin="round">
+              <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+              <polyline points="11 7 6 12 11 17"></polyline>
+              <polyline points="17 7 12 12 17 17"></polyline>
+            </svg>
+            Previous
+          </a>
+
+          <a href="/details/{{ .Next }}"
+            class="btn btn-primary d-none d-sm-inline-block {{ if eq .Next .Max }}disabled{{ end }}">
+            <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-chevrons-right" width="24"
+              height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round"
+              stroke-linejoin="round">
+              <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+              <polyline points="7 7 12 12 7 17"></polyline>
+              <polyline points="13 7 18 12 13 17"></polyline>
+            </svg>
+            Next
+          </a>
+        </div>
+      </div>
+
     </div>
   </div>
 </div>
@@ -220,10 +249,12 @@ <h3 class="card-title">Network Log</h3>
                         <span class="badge bg-green">{{ .StatusCode }}</span>
                         {{ else if and (ge .StatusCode 300) (le .StatusCode 399) }}
                         <span class="badge bg-blue">{{ .StatusCode }}</span>
-                        {{ else if and (ge .StatusCode 400) (le .StatusCode 600) }}
+                        {{ else if and (ge .StatusCode 400) (le .StatusCode 500) }}
+                        <span class="badge bg-yellow">{{ .StatusCode }}</span>
+                        {{ else if and (ge .StatusCode 500) (le .StatusCode 600) }}
                         <span class="badge bg-red">{{ .StatusCode }}</span>
                         {{ else }}
-                        {{ .StatusCode }}
+                        <span class="badge">{{ .StatusCode }}</span>
                         {{ end }}
                         {{ end }}
                       </td>

diff --git a/web/ui-templates/table.html b/web/ui-templates/table.html
@@ -25,11 +25,13 @@ <h2 class="page-title">
     <div class="box">
       <div class="card">
         <div class="table-responsive">
-          <table class="table table-vcenter card-table">
+          <table class="table table-hover table-sm table-vcenter card-table">
             <thead>
               <tr>
                 <th>URL</th>
                 <th>Code</th>
+                <th>Network Logs</th>
+                <th>Console Logs</th>
                 <th>Title</th>
                 <th class="w-1"></th>
               </tr>
@@ -40,7 +42,31 @@ <h2 class="page-title">
                 <td class="text-muted">
                   <a href="{{ .URL }}">{{ .URL }}</a>
                 </td>
-                <td class="text-muted">{{ .ResponseCode }}</td>
+                <td class="text-muted">
+                  {{ if (eq 0 .ResponseCode)}}
+                  <!-- no status code. -->
+                  {{ else }}
+                  {{ if and (ge .ResponseCode 200) (le .ResponseCode 299) }}
+                  <span class="badge bg-green">{{ .ResponseCode }}</span>
+                  {{ else if and (ge .ResponseCode 300) (le .ResponseCode 399) }}
+                  <span class="badge bg-blue">{{ .ResponseCode }}</span>
+                  {{ else if and (ge .ResponseCode 400) (le .ResponseCode 500) }}
+                  <span class="badge bg-yellow">{{ .ResponseCode }}</span>
+                  {{ else if and (ge .ResponseCode 500) (le .ResponseCode 600) }}
+                  <span class="badge bg-red">{{ .ResponseCode }}</span>
+                  {{ else }}
+                  <span class="badge">{{ .ResponseCode }}</span>
+                  {{ end }}
+                  {{ end }}
+                </td>
+                <td>
+                  {{ $length := len .Network }}
+                  {{ $length }}
+                </td>
+                <td>
+                  {{ $length := len .Console }}
+                  {{ $length }}
+                </td>
                 <td class="text-muted">
                   {{ .Title }}
                 </td>