tyler.durden/dashy
1
0
Fork 0
mirror of https://github.com/Lissy93/dashy.git synced 2025-09-25 10:48:50 +02:00
Code Issues Packages Projects Releases Wiki Activity

chore: minor changes to pi-hole-stats-v6 widget

Browse Source
This commit is contained in:
casmbu 2025-08-02 16:19:05 -04:00
parent a7a1fbb27f
commit 78f8f08fe2
1 changed files with 9 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
src/components/Widgets/PiHoleStatsV6.vue
View File

@ -44,6 +44,9 @@ export default {
if (!usersChoice) this.error('App Password is required, please see the docs'); if (!usersChoice) this.error('App Password is required, please see the docs');
return usersChoice; return usersChoice;
}, },
hideStatus() { return this.options.hideStatus; },
hideChart() { return this.options.hideChart; },
hideInfo() { return this.options.hideInfo; },
authHeader() { authHeader() {
return { return {
'X-FTL-SID': this.sid, 'X-FTL-SID': this.sid,
@ -57,17 +60,16 @@ export default {
blockingStatusEndpoint() { blockingStatusEndpoint() {
return `${this.hostname}/api/dns/blocking`; return `${this.hostname}/api/dns/blocking`;
}, },
/* This is actually just the stats that are currently in memory. If you need accurate stats to a /* This is actually just the stats that are currently in memory, which amounts to 24hrs when the
particular timeframe, then the database endpoint is the way to go. */ service first boots up, but will drift to be a little more than 24hrs worth of data as the
server runs. If you need accurate stats to a particular timeframe, then the
/api/stats/database/summary endpoint is the way to go. */
statsEndpoint() { statsEndpoint() {
return `${this.hostname}/api/stats/summary`; return `${this.hostname}/api/stats/summary`;
}, },
statsDatabaseEndpoint() { statsDatabaseEndpoint() {
return `${this.hostname}/api/stats/database/summary`; return `${this.hostname}/api/stats/database/summary`;
}, },
hideStatus() { return this.options.hideStatus; },
hideChart() { return this.options.hideChart; },
hideInfo() { return this.options.hideInfo; },
timestampTomorrowMidnight() { timestampTomorrowMidnight() {
const calcDate = new Date(); const calcDate = new Date();
calcDate.setHours(0, 0, 0, 0); calcDate.setHours(0, 0, 0, 0);
@ -137,13 +139,13 @@ export default {
url.searchParams.append('from', this.timestamp24HoursAgo); url.searchParams.append('from', this.timestamp24HoursAgo);
// Future date because we're looking for "up to present". // Future date because we're looking for "up to present".
url.searchParams.append('until', this.timestampTomorrowMidnight); url.searchParams.append('until', this.timestampTomorrowMidnight);
return this.makeRequest(url.toString(), this.authHeader, 'GET'); return this.makeRequest(url.toString(), this.authHeader);
}, },
fetchAllTimeStats() { fetchAllTimeStats() {
const url = new URL(this.statsDatabaseEndpoint); const url = new URL(this.statsDatabaseEndpoint);
url.searchParams.append('from', 1); // Errors out with 0. url.searchParams.append('from', 1); // Errors out with 0.
url.searchParams.append('until', this.timestampTomorrowMidnight); url.searchParams.append('until', this.timestampTomorrowMidnight);
return this.makeRequest(url.toString(), this.authHeader, 'GET'); return this.makeRequest(url.toString(), this.authHeader);
}, },
processData([blockingStatus, inMemoryStats, todayStats, allTimeStats]) { processData([blockingStatus, inMemoryStats, todayStats, allTimeStats]) {
if (!this.hideStatus) { if (!this.hideStatus) {
@ -205,53 +207,42 @@ export default {
.pi-hole-stats-v6-wrapper { .pi-hole-stats-v6-wrapper {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
.status { .status {
margin: 0.5rem 0; margin: 0.5rem 0;
.status-lbl { .status-lbl {
color: var(--widget-text-color); color: var(--widget-text-color);
font-weight: bold; font-weight: bold;
} }
.status-val { .status-val {
margin-left: 0.5rem; margin-left: 0.5rem;
font-family: var(--font-monospace); font-family: var(--font-monospace);
&.green { color: var(--success); } &.green { color: var(--success); }
&.red { color: var(--danger); } &.red { color: var(--danger); }
&.blue { color: var(--info); } &.blue { color: var(--info); }
} }
} }
img.block-percent-chart { img.block-percent-chart {
margin: 0.5rem auto; margin: 0.5rem auto;
max-width: 8rem; max-width: 8rem;
width: 100%; width: 100%;
} }
.block-pie { .block-pie {
margin: 0; margin: 0;
} }
.data-table { .data-table {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
.data-table-row { .data-table-row {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
p { p {
margin: 0.2rem 0; margin: 0.2rem 0;
color: var(--widget-text-color); color: var(--widget-text-color);
font-size: 0.9rem; font-size: 0.9rem;
&.row-value { &.row-value {
font-family: var(--font-monospace); font-family: var(--font-monospace);
} }
} }
&:not(:last-child) { &:not(:last-child) {
border-bottom: 1px dashed var(--widget-text-color); border-bottom: 1px dashed var(--widget-text-color);
} }