4 <p class="title is-4">{{ item.name }}</p>
5 <p class="subtitle is-6">
6 <template v-if="item.subtitle">
9 <template v-else-if="percentage">
10 {{ percentage }}% blocked
15 <div v-if="status" class="status" :class="status">
23 import service from "@/mixins/service.js";
24 import Generic from "./Generic.vue";
37 ads_percentage_today: 0,
40 percentage: function () {
41 if (this.ads_percentage_today) {
42 return this.ads_percentage_today.toFixed(1);
51 fetchStatus: async function () {
52 const authQueryParams = this.item.apikey
53 ? `?summaryRaw&auth=${this.item.apikey}`
55 const result = await this.fetch(`/api.php${authQueryParams}`)
56 .catch((e) => console.log(e));
58 this.status = result.status;
59 this.ads_percentage_today = result.ads_percentage_today;
65 <style scoped lang="scss">
68 color: var(--text-title);
71 background-color: #94e185;
72 border-color: #78d965;
73 box-shadow: 0 0 5px 1px #94e185;
77 background-color: #c9404d;
78 border-color: #c42c3b;
79 box-shadow: 0 0 5px 1px #c9404d;
84 display: inline-block;
88 border: 1px solid #000;