Revize 3e6d1ec5

Re #8706 - More downloads in certificate listing

static/index.html

@@ -30 +30 @@
                         <th class="align-middle" scope="col" colspan="2">Validity</th>
                         <th class="align-middle" scope="col" rowspan="2">Usage</th>
                         <th class="align-middle" scope="col" rowspan="2">Certificate</th>
+                        <th class="align-middle" scope="col" rowspan="2">Chain of trust</th>
+                        <th class="align-middle" scope="col" rowspan="2">Root</th>
+                        <th class="align-middle" scope="col" rowspan="2">Private key</th>
                         <th class="align-middle" scope="col" rowspan="2">Issuer</th>
                     </tr>
                     <tr>

static/js/components.js

@@ -5 +5 @@
     props: ["certificate"],
     template: "<tr>"+
                 "<td class='align-middle'><a :href='certificateURL' class='font-weight-bold'>{{ certificate.CN }}</a></td>"+
-                "<td class='align-middle'>{{ certificate.notBefore }}</td>"+
-                "<td class='align-middle'>{{ certificate.notAfter }}</td>"+
+                "<td class='align-middle'>{{ formattedNotBefore }}</td>"+
+                "<td class='align-middle'>{{ formattedNotAfter }}</td>"+
                 "<td class='align-middle'>" +
                 "   <div v-if='certificate.usage.CA'>CA</div>" +
                 "   <div v-if='certificate.usage.authentication'>authentication</div>" +
@@ -14 +14 @@
                 "   <div v-if='certificate.usage.SSL'>SSL/TLS</div>" +
                 "</td>"+
                 "<td class='align-middle'><button v-on:click='onCertificateDownload()'>Download certificate</button></td>"+
+                "<td class='align-middle'><button v-on:click='onChainOfTrustDownload()'>Download chain</button></td>"+
+                "<td class='align-middle'><button v-on:click='onRootDownload()'>Download root</button></td>"+
+                "<td class='align-middle'><button v-on:click='onPrivateKeyDownload()'>Download key</button></td>"+
                 "<td v-if='certificate.issuer.id !== certificate.id' class='align-middle'><a :href='issuerURL' class='font-weight-bold'>{{ certificate.issuer.CN }}</a></td>"+
                 "<td v-if='certificate.issuer.id === certificate.id'  class='align-middle'><a :href='issuerURL' class='font-weight-light'>self-signed</a></td>"+
             "</tr>",
@@ -23 +26 @@
         },
         issuerURL: function () {
             return "/static/certificate.html?id=" + this.certificate.issuer.id;
+        },
+        formattedNotAfter: function () {
+            return this.certificate.notAfter.substring(0, 16);
+        },
+        formattedNotBefore: function () {
+            return this.certificate.notBefore.substring(0, 16);
         }
     },
     methods: {
         // Get the certificate PEM data from the server and downloads it to users computer
         onCertificateDownload: function () {
-            onCertificateDownload(this.certificate.id)
+            onCertificateDownload(this.certificate.id);
+        },
+        onPrivateKeyDownload: function () {
+            onPrivateKeyDownload(this.certificate.id);
+        },
+        onChainOfTrustDownload: function () {
+            onCertificateChainDownload(this.certificate.id);
+        },
+        onRootDownload: function () {
+            onCertificateRootDownload(this.certificate.id);
         },
     }
 });