5 <strong v-if="users > 0" class="notif users" title="Users">
8 <strong v-if="photos > 0" class="notif photos" title="Photos">
11 <strong v-if="videos > 0" class="notif videos" title="Videos">
14 <strong v-if="usage > 0" class="notif usage" title="Usage">
20 title="Connection error to Immich API, check your url and apikey in config.yml"
29 import service from "@/mixins/service.js";
30 import Generic from "./Generic.vue";
50 created: function () {
51 const updateInterval = parseInt(this.item.updateInterval, 10) || 0;
52 if (updateInterval > 0) {
53 setInterval(() => this.fetchConfig(), updateInterval);
58 humanizeSize: function () {
59 let bytes = this.usage;
60 if (Math.abs(bytes) < 1024) return bytes + " B";
62 const units = ["KiB", "MiB", "GiB", "TiB"];
68 Math.round(Math.abs(bytes) * 100) / 100 >= 1024 &&
72 return bytes.toFixed(2) + " " + units[u];
76 fetchConfig: function () {
78 "x-api-key": this.item.apikey,
81 this.fetch(`/api/server-info/stats`, { headers })
83 this.photos = stats.photos;
84 this.videos = stats.videos;
85 this.usage = stats.usage;
86 this.users = stats.usageByUser.length;
90 this.serverError = true;
97 <style scoped lang="scss">
101 font-family: sans-serif;
105 display: inline-block;
106 padding: 0.2em 0.35em;
107 border-radius: 0.25em;
112 background-color: #4fb5d6;
116 background-color: #d08d2e;
120 background-color: #e51111;
124 background-color: #8dd475;