Revize d72b12cf

Re #8583 - certificate.js moved initialization code to mounted

static/js/certificate.js

@@ -1 @@
-    Vue.use(VueLoading);
-    Vue.component('loading', VueLoading)
+Vue.use(VueLoading);
+Vue.component('loading', VueLoading)
 
 
-    var certificateDetailsApp = new Vue({
-        el: "#certificate-detailed-view-content",
-        data: {
-            loading: true,
-            error: false,
-            id: null,
-            revocationReason: "unspecified",
-            issuedCertificates: [],
-            certificate: {
-                subject: {
-                    C: "",
-                    ST: "",
-                    L: "",
-                    CN: "",
-                    O: "",
-                    OU: "",
-                    emailAddress: "",
-                },
-                notBefore: "",
-                notAfter: "",
-                usage: {
-                    CA: false,
-                    authentication: false,
-                    digitalSignature: false,
-                    SSL: false,
-                },
-                CA: null,
+var certificateDetailsApp = new Vue({
+    el: "#certificate-detailed-view-content",
+    data: {
+        loading: true,
+        error: false,
+        id: null,
+        revocationReason: "unspecified",
+        issuedCertificates: [],
+        certificate: {
+            subject: {
+                C: "",
+                ST: "",
+                L: "",
+                CN: "",
+                O: "",
+                OU: "",
+                emailAddress: "",
             },
-            errorMessage: "",
-            successMessage: "",
-        },
-        computed: {
-            startDate: function () {
-                return this.certificate.notBefore.substr(0, 16);
-            },
-            endDate: function () {
-                return this.certificate.notAfter.substr(0, 16);
-            },
-            issuerURL: function () {
-                return "/static/certificate.html?id=" + this.certificate.CA;
-            },
-            crlEndpoint: function () {
-                return "/api/crl/" + this.certificate.CA;
+            notBefore: "",
+            notAfter: "",
+            usage: {
+                CA: false,
+                authentication: false,
+                digitalSignature: false,
+                SSL: false,
             },
-            ocspEndpoint: function () {
-                return "/api/ocsp/" + this.certificate.CA;
-            }
+            CA: null,
         },
-        watch: {
-
+        errorMessage: "",
+        successMessage: "",
+    },
+    computed: {
+        startDate: function () {
+            return this.certificate.notBefore.substr(0, 16);
         },
-        methods: {
-            onCertificateDownload: function () {
-                onCertificateDownload(this.id);
-            },
-            onRootDownload: function () {
-                onCertificateRootDownload(this.id);
-            },
-            onChainDownload: function () {
-                onCertificateChainDownload(this.id);
-            },
-            onPublicKeyDownload: function () {
-                onPublicKeyDownload(this.id);
-            },
-            onPrivateKeyDownload: function () {
-                onPrivateKeyDownload(this.id);
-            },
-            onRevoke: function () {
-                document.body.scrollTop = 0;
-                document.documentElement.scrollTop = 0;
-                axios.patch(API_URL + "certificates/"+this.id, {
-                    status: "revoked",
-                    reason: this.revocationReason
-                })
-                    .then(function (response) {
-                        if(response.data["success"]) {
-                            certificateDetailsApp.successMessage = "Certificate revocation successful.";
-                        }
-                        else {
-                            certificateDetailsApp.errorMessage = "Certificate cannot be revoked - "+response.data["data"]+"!";
-                        }
-                    })
-                    .catch(function (error) {
-                        certificateDetailsApp.errorMessage = "An error occurred while revoking certificate";
-                    });
-            },
-            onDelete: function () {
-                document.body.scrollTop = 0;
-                document.documentElement.scrollTop = 0;
-                axios.delete(API_URL + "certificates/" + this.id)
-                    .then(function (response) {
-                        if(response.data["success"]){
-                            window.location.href = "/static/index.html?success=Certificate+successfully+deleted";
-                        }
-                        else {
-                            certificateDetailsApp.errorMessage = "Certificate cannot be deleted - "+response.data["data"]+"!";
-                        }
-                    })
-                    .catch(function (error) {
-                        certificateDetailsApp.errorMessage = "An error occurred while deleting certificate";
-                    });
-            }
+        endDate: function () {
+            return this.certificate.notAfter.substr(0, 16);
+        },
+        issuerURL: function () {
+            return "/static/certificate.html?id=" + this.certificate.CA;
+        },
+        crlEndpoint: function () {
+            return "/api/crl/" + this.certificate.CA;
+        },
+        ocspEndpoint: function () {
+            return "/api/ocsp/" + this.certificate.CA;
         }
-    });
-
-    // get details of the selected certificate
-    const params = window.location.search;
-    if (params !== "") {
-        // get requested ID
-        const urlParams = new URLSearchParams(params);
-        if (urlParams.get("id") != null) {
-            const id = urlParams.get("id");
-            certificateDetailsApp.id = id;
-            // query certificate details
-            axios.get(API_URL + "certificates/"+id+"/details")
+    },
+    watch: {},
+    methods: {
+        onCertificateDownload: function () {
+            onCertificateDownload(this.id);
+        },
+        onRootDownload: function () {
+            onCertificateRootDownload(this.id);
+        },
+        onChainDownload: function () {
+            onCertificateChainDownload(this.id);
+        },
+        onPublicKeyDownload: function () {
+            onPublicKeyDownload(this.id);
+        },
+        onPrivateKeyDownload: function () {
+            onPrivateKeyDownload(this.id);
+        },
+        onRevoke: function () {
+            document.body.scrollTop = 0;
+            document.documentElement.scrollTop = 0;
+            axios.patch(API_URL + "certificates/" + this.id, {
+                status: "revoked",
+                reason: this.revocationReason
+            })
                 .then(function (response) {
                     if (response.data["success"]) {
-                        // display certificate
-                        certificateDetailsApp.certificate = response.data["data"];
-                        loadIssuedCertificates();
-                        certificateDetailsApp.loading = false;
-                        certificateDetailsApp.error = false;
+                        certificateDetailsApp.successMessage = "Certificate revocation successful.";
+                    } else {
+                        certificateDetailsApp.errorMessage = "Certificate cannot be revoked - " + response.data["data"] + "!";
                     }
-                    else {
-                        // certificate does not exists
-                        console.error("Required certificate does not exists");
-                        certificateDetailsApp.loading = false;
-                        certificateDetailsApp.error = true;
+                })
+                .catch(function (error) {
+                    certificateDetailsApp.errorMessage = "An error occurred while revoking certificate";
+                });
+        },
+        onDelete: function () {
+            document.body.scrollTop = 0;
+            document.documentElement.scrollTop = 0;
+            axios.delete(API_URL + "certificates/" + this.id)
+                .then(function (response) {
+                    if (response.data["success"]) {
+                        window.location.href = "/static/index.html?success=Certificate+successfully+deleted";
+                    } else {
+                        certificateDetailsApp.errorMessage = "Certificate cannot be deleted - " + response.data["data"] + "!";
                     }
                 })
                 .catch(function (error) {
-                    // server error
-                    console.error(error);
-                    certificateDetailsApp.loading = false;
-                    certificateDetailsApp.error = true;
+                    certificateDetailsApp.errorMessage = "An error occurred while deleting certificate";
                 });
+        },
+        loadIssuedCertificates: function () {
+
+        }
+    },
+    mounted: function () {
+        // get details of the selected certificate
+        const params = window.location.search;
+        if (params !== "") {
+            // get requested ID
+            const urlParams = new URLSearchParams(params);
+            if (urlParams.get("id") != null) {
+                const id = urlParams.get("id");
+                this.id = id;
+                // query certificate details
+                axios.get(API_URL + "certificates/" + id + "/details")
+                    .then(function (response) {
+                        if (response.data["success"]) {
+                            // display certificate
+                            certificateDetailsApp.certificate = response.data["data"];
+                            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);
+                                });
+                            certificateDetailsApp.loading = false;
+                            certificateDetailsApp.error = false;
+                        } else {
+                            // certificate does not exists
+                            console.error("Required certificate does not exists");
+                            certificateDetailsApp.loading = false;
+                            certificateDetailsApp.error = true;
+                        }
+                    })
+                    .catch(function (error) {
+                        // server error
+                        console.error(error);
+                        certificateDetailsApp.loading = false;
+                        certificateDetailsApp.error = true;
+                    });
+            } else {
+                // id was not provided as a URL parameter
+                console.error("URL does not contain 'id' parameter")
+                certificateDetailsApp.loading = false;
+                certificateDetailsApp.error = true;
+            }
         } else {
-            // id was not provided as a URL parameter
             console.error("URL does not contain 'id' parameter")
             certificateDetailsApp.loading = false;
             certificateDetailsApp.error = true;
         }
-    } else {
-        console.error("URL does not contain 'id' parameter")
-        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);
-        });
-    }