|
1
|
|
|
2
|
// Component representing an instance in certificate listing
|
|
3
|
Vue.component("certificate-item",{
|
|
4
|
// certificate = certificate to be displayed by the list item
|
|
5
|
props: ["certificate"],
|
|
6
|
template: "<tr>"+
|
|
7
|
"<td class='align-middle'><a :href='certificateURL' class='font-weight-bold'>{{ certificate.CN }}</a></td>"+
|
|
8
|
"<td class='align-middle'>{{ certificate.notBefore }}</td>"+
|
|
9
|
"<td class='align-middle'>{{ certificate.notAfter }}</td>"+
|
|
10
|
"<td class='align-middle'>" +
|
|
11
|
" <div v-if='certificate.usage.CA'>CA</div>" +
|
|
12
|
" <div v-if='certificate.usage.authentication'>authentication</div>" +
|
|
13
|
" <div v-if='certificate.usage.digitalSignature'>digital signature</div>" +
|
|
14
|
" <div v-if='certificate.usage.SSL'>SSL/TLS</div>" +
|
|
15
|
"</td>"+
|
|
16
|
"<td class='align-middle'><button v-on:click='onCertificateDownload()'>Download certificate</button></td>"+
|
|
17
|
"<td v-if='certificate.issuer.id !== certificate.id' class='align-middle'><a :href='issuerURL' class='font-weight-bold'>{{ certificate.issuer.CN }}</a></td>"+
|
|
18
|
"<td v-if='certificate.issuer.id === certificate.id' class='align-middle'><a :href='issuerURL' class='font-weight-light'>self-signed</a></td>"+
|
|
19
|
"</tr>",
|
|
20
|
computed: {
|
|
21
|
certificateURL: function () {
|
|
22
|
return "/static/certificate.html?id=" + this.certificate.id;
|
|
23
|
},
|
|
24
|
issuerURL: function () {
|
|
25
|
return "/static/certificate.html?id=" + this.certificate.issuer.id;
|
|
26
|
}
|
|
27
|
},
|
|
28
|
methods: {
|
|
29
|
// Get the certificate PEM data from the server and downloads it to users computer
|
|
30
|
onCertificateDownload: function () {
|
|
31
|
onCertificateDownload(this.certificate.id)
|
|
32
|
},
|
|
33
|
}
|
|
34
|
});
|
|
35
|
|
|
36
|
// Component representing an item in select of available CAs
|
|
37
|
Vue.component("ca-select-item", {
|
|
38
|
// Certificate authority to be represented by the option
|
|
39
|
props: ["ca"],
|
|
40
|
template: "<option v-bind:value='ca.id'>{{ ca.CN }}</option>"
|
|
41
|
});
|
|
42
|
|
|
43
|
// Component representing a certificate issued by displayed CA
|
|
44
|
Vue.component("issued-by-list-item", {
|
|
45
|
props: ["certificate"],
|
|
46
|
template: "<tr class='align-middle text-center'>"+
|
|
47
|
"<td class='align-middle'><a :href='certificateURL' class='font-weight-bold'>{{ certificate.CN }}</a></td>"+
|
|
48
|
"<td class='align-middle'>" +
|
|
49
|
" <div v-if='certificate.usage.CA'>CA</div>" +
|
|
50
|
" <div v-if='certificate.usage.authentication'>authentication</div>" +
|
|
51
|
" <div v-if='certificate.usage.digitalSignature'>digital signature</div>" +
|
|
52
|
" <div v-if='certificate.usage.SSL'>SSL/TLS</div>" +
|
|
53
|
"</td>"+
|
|
54
|
"</tr>",
|
|
55
|
computed: {
|
|
56
|
certificateURL: function () {
|
|
57
|
return "/static/certificate.html?id=" + this.certificate.id;
|
|
58
|
}
|
|
59
|
}
|
|
60
|
});
|