Revize 56b36ca7

Re #8583 - Display issued certificates

static/certificate.html

@@ -182 +182 @@
                                 </tr>
                             </thead>
                             <tbody>
-                                <tr>
-                                    <td>&ltsome_certificate_name&gt</td>
-                                    <td>&lttype&gt</td>
+                                <tr class="text-center font-italic">
+                                    <td v-if="issuedCertificates.length == 0" colspan="2">No issued certificates</td>
                                 </tr>
-                                <tr>
-                                    <td>&ltsome_certificate_long_name&gt</td>
-                                    <td>&ltCA&gt</td>
+                                <tr is="issued-by-list-item"
+                                    v-for="certificate in issuedCertificates"
+                                    v-bind:certificate="certificate"
+                                    v-bind:key="certificate.id">
                                 </tr>
                             </tbody>
                         </table>

static/js/certificate.js

@@ -9 +9 @@
             error: false,
             id: null,
             revocationReason: "unspecified",
+            issuedCertificates: [],
             certificate: {
                 subject: {
                     C: "",
@@ -120 +121 @@
                     if (response.data["success"]) {
                         // display certificate
                         certificateDetailsApp.certificate = response.data["data"];
+                        loadIssuedCertificates();
                         certificateDetailsApp.loading = false;
                         certificateDetailsApp.error = false;
                     }
@@ -147 +149 @@
         certificateDetailsApp.loading = false;
         certificateDetailsApp.error = true;
     }
+
+    function loadIssuedCertificates() {
+            axios.get(API_URL+"certificates", {
+            params: {
+                filtering: {
+                    issuedby: parseInt(certificateDetailsApp.id)
+                }
+            }
+        })
+        .then(function (response) {
+            if (response.data["success"]) {
+                response.data["data"].forEach(item => {if(item.id != certificateDetailsApp.id) certificateDetailsApp.issuedCertificates.push(item)})
+            }
+            else
+            {
+                certificateDetailsApp.issuedCertificates = [];
+            }
+        })
+        .catch(function (error) {
+            console.log(error);
+        });
+    }

static/js/components.js

@@ -38 +38 @@
     // Certificate authority to be represented by the option
     props: ["ca"],
     template: "<option v-bind:value='ca.id'>{{ ca.CN }}</option>"
+});
+
+// Component representing a certificate issued by displayed CA
+Vue.component("issued-by-list-item", {
+    props: ["certificate"],
+    template:   "<tr class='align-middle text-center'>"+
+                    "<td class='align-middle'><a :href='certificateURL' class='font-weight-bold'>{{ certificate.CN }}</a></td>"+
+                    "<td class='align-middle'>" +
+                    "   <div v-if='certificate.usage.CA'>CA</div>" +
+                    "   <div v-if='certificate.usage.authentication'>authentication</div>" +
+                    "   <div v-if='certificate.usage.digitalSignature'>digital signature</div>" +
+                    "   <div v-if='certificate.usage.SSL'>SSL/TLS</div>" +
+                    "</td>"+
+                "</tr>",
+    computed: {
+        certificateURL: function () {
+            return "/static/certificate.html?id=" + this.certificate.id;
+        }
+    }
 });