Feat: Add Barebones certificate info display

This commit is contained in:
Nelson Chan
2021-07-21 12:09:09 +08:00
parent 03b3bb5b30
commit ccda6f05f5
4 changed files with 107 additions and 1 deletions

View File

@@ -25,6 +25,7 @@ export default {
importantHeartbeatList: { },
avgPingList: { },
uptimeList: { },
certInfoList: {},
notificationList: [],
windowWidth: window.innerWidth,
showListMobile: false,
@@ -114,6 +115,10 @@ export default {
this.uptimeList[`${monitorID}_${type}`] = data
});
socket.on('certInfo', (monitorID, data) => {
this.certInfoList[monitorID] = data
});
socket.on('importantHeartbeatList', (monitorID, data) => {
if (! (monitorID in this.importantHeartbeatList)) {
this.importantHeartbeatList[monitorID] = data;

View File

@@ -54,6 +54,38 @@
</div>
</div>
<div class="shadow-box big-padding text-center stats" v-if="monitor.type === 'http' && monitor.url.startsWith('https') && certInfo != null">
<div class="row">
<div class="col">
<h4>Certificate Info</h4>
<table class="text-start">
<tbody>
<tr class="my-3">
<td class="px-3">Valid: </td>
<td>{{ certInfo.valid }}</td>
</tr>
<tr class="my-3">
<td class="px-3">Valid To: </td>
<td>{{ certInfo.validTo ? new Date(certInfo.validTo).toLocaleString() : "" }}</td>
</tr>
<tr class="my-3">
<td class="px-3">Days Remaining: </td>
<td>{{ certInfo.daysRemaining }}</td>
</tr>
<tr class="my-3">
<td class="px-3">Issuer: </td>
<td>{{ certInfo.issuer }}</td>
</tr>
<tr class="my-3">
<td class="px-3">Fingerprint: </td>
<td>{{ certInfo.fingerprint }}</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="shadow-box">
<table class="table table-borderless table-hover">
<thead>
@@ -180,6 +212,14 @@ export default {
}
},
certInfo() {
if (this.$root.certInfoList[this.monitor.id]) {
return this.$root.certInfoList[this.monitor.id]
} else {
return { }
}
},
displayedRecords() {
const startIndex = this.perPage * (this.page - 1);
const endIndex = startIndex + this.perPage;