aboutsummaryrefslogtreecommitdiffhomepage
path: root/src/components/services/qBittorrent.vue
diff options
context:
space:
mode:
Diffstat (limited to 'src/components/services/qBittorrent.vue')
-rw-r--r--src/components/services/qBittorrent.vue242
1 files changed, 122 insertions, 120 deletions
diff --git a/src/components/services/qBittorrent.vue b/src/components/services/qBittorrent.vue
index 1f1ef49..06dd47c 100644
--- a/src/components/services/qBittorrent.vue
+++ b/src/components/services/qBittorrent.vue
@@ -1,120 +1,122 @@
1<template> 1<template>
2 <Generic :item="item"> 2 <Generic :item="item">
3 <template #content> 3 <template #content>
4 <p class="title is-4">{{ item.name }}</p> 4 <p class="title is-4">{{ item.name }}</p>
5 <p class="subtitle is-6"> 5 <p class="subtitle is-6">
6 <span v-if="error" class="error">An error has occurred.</span> 6 <span v-if="error" class="error">An error has occurred.</span>
7 <template v-else> 7 <template v-else>
8 <span class="down monospace"> 8 <span class="down monospace">
9 <p class="fas fa-download "></p> {{ downRate }} 9 <p class="fas fa-download"></p>
10 </span> 10 {{ downRate }}
11 <span class="up monospace"> 11 </span>
12 <p class="fas fa-upload"></p> {{ upRate }} 12 <span class="up monospace">
13 </span> 13 <p class="fas fa-upload"></p>
14 </template> 14 {{ upRate }}
15 </p> 15 </span>
16 </template> 16 </template>
17 <template #indicator> 17 </p>
18 <span v-if="!error" class="count">{{ count }} 18 </template>
19 <template v-if="count === 1">torrent</template> 19 <template #indicator>
20 <template v-else>torrents</template> 20 <span v-if="!error" class="count"
21 </span> 21 >{{ count }}
22 </template> 22 <template v-if="count === 1">torrent</template>
23 </Generic> 23 <template v-else>torrents</template>
24</template> 24 </span>
25 25 </template>
26<script> 26 </Generic>
27import service from "@/mixins/service.js"; 27</template>
28import Generic from "./Generic.vue"; 28
29const units = ["B", "KB", "MB", "GB"]; 29<script>
30 30import service from "@/mixins/service.js";
31// Take the rate in bytes and keep dividing it by 1k until the lowest 31import Generic from "./Generic.vue";
32// value for which we have a unit is determined. Return the value with 32const units = ["B", "KB", "MB", "GB"];
33// up to two decimals as a string and unit/s appended. 33
34const displayRate = (rate) => { 34// Take the rate in bytes and keep dividing it by 1k until the lowest
35 let i = 0; 35// value for which we have a unit is determined. Return the value with
36 36// up to two decimals as a string and unit/s appended.
37 while (rate > 1000 && i < units.length) { 37const displayRate = (rate) => {
38 rate /= 1000; 38 let i = 0;
39 i++; 39
40 } 40 while (rate > 1000 && i < units.length) {
41 return ( 41 rate /= 1000;
42 Intl.NumberFormat(undefined, { maximumFractionDigits: 2 }).format( 42 i++;
43 rate || 0 43 }
44 ) + ` ${units[i]}/s` 44 return (
45 ); 45 Intl.NumberFormat(undefined, { maximumFractionDigits: 2 }).format(
46}; 46 rate || 0
47 47 ) + ` ${units[i]}/s`
48export default { 48 );
49 name: "qBittorrent", 49};
50 mixins: [service], 50
51 props: { item: Object }, 51export default {
52 components: { Generic }, 52 name: "qBittorrent",
53 data: () => ({ dl: null, ul: null, count: null, error: null }), 53 mixins: [service],
54 computed: { 54 props: { item: Object },
55 downRate: function () { 55 components: { Generic },
56 return displayRate(this.dl); 56 data: () => ({ dl: null, ul: null, count: null, error: null }),
57 }, 57 computed: {
58 upRate: function () { 58 downRate: function () {
59 return displayRate(this.ul); 59 return displayRate(this.dl);
60 }, 60 },
61 }, 61 upRate: function () {
62 created() { 62 return displayRate(this.ul);
63 const rateInterval = parseInt(this.item.rateInterval, 10) || 0; 63 },
64 const torrentInterval = parseInt(this.item.torrentInterval, 10) || 0; 64 },
65 if (rateInterval > 0) { 65 created() {
66 setInterval(() => this.getRate(), rateInterval); 66 const rateInterval = parseInt(this.item.rateInterval, 10) || 0;
67 } 67 const torrentInterval = parseInt(this.item.torrentInterval, 10) || 0;
68 if (torrentInterval > 0) { 68 if (rateInterval > 0) {
69 setInterval(() => this.fetchCount(), torrentInterval); 69 setInterval(() => this.getRate(), rateInterval);
70 } 70 }
71 71 if (torrentInterval > 0) {
72 this.getRate(); 72 setInterval(() => this.fetchCount(), torrentInterval);
73 this.fetchCount(); 73 }
74 }, 74
75 methods: { 75 this.getRate();
76 fetchCount: async function () { 76 this.fetchCount();
77 try { 77 },
78 const body = await this.fetch('/api/v2/torrents/info'); 78 methods: {
79 this.error = false; 79 fetchCount: async function () {
80 this.count = body.length; 80 try {
81 } catch (e) { 81 const body = await this.fetch("/api/v2/torrents/info");
82 this.error = true; 82 this.error = false;
83 console.error(e); 83 this.count = body.length;
84 } 84 } catch (e) {
85 }, 85 this.error = true;
86 getRate: async function () { 86 console.error(e);
87 try { 87 }
88 const body = await this.fetch('/api/v2/transfer/info'); 88 },
89 this.error = false; 89 getRate: async function () {
90 this.dl = body.dl_info_speed; 90 try {
91 this.ul = body.up_info_speed; 91 const body = await this.fetch("/api/v2/transfer/info");
92 } catch (e) { 92 this.error = false;
93 this.error = true; 93 this.dl = body.dl_info_speed;
94 console.error(e); 94 this.ul = body.up_info_speed;
95 } 95 } catch (e) {
96 }, 96 this.error = true;
97 }, 97 console.error(e);
98}; 98 }
99 99 },
100</script> 100 },
101 101};
102<style scoped lang="scss"> 102</script>
103.error { 103
104 color: #e51111 !important; 104<style scoped lang="scss">
105} 105.error {
106 106 color: #e51111 !important;
107.down { 107}
108 margin-right: 1em; 108
109} 109.down {
110 110 margin-right: 1em;
111.count { 111}
112 color: var(--text); 112
113 font-size: 0.8em; 113.count {
114} 114 color: var(--text);
115 115 font-size: 0.8em;
116.monospace { 116}
117 font-weight: 300; 117
118 font-family: monospace; 118.monospace {
119} 119 font-weight: 300;
120</style> \ No newline at end of file 120 font-family: monospace;
121}
122</style>