feat: Add globalSpeed and globalVolume computed values to torrent properties (#599) @Larsluph

2025-03-14 12:10:18 +03:00 · 2023-01-11 14:37:53 +01:00 · 2023-01-11 14:37:53 +01:00 · 3e1d3411b7
commit 3e1d3411b7
parent add11c9548
25 changed files with 194 additions and 50 deletions
--- a/src/actions/Torrents.js
+++ b/src/actions/Torrents.js
@ -1,13 +1,13 @@
 import store from '../store'
 import { Hostname } from '@/Helpers/index.js'
 import Torrent from '@/models/Torrent'
-import { isProduction } from '../utils'
-import { generateMultiple } from '../utils/faker'
+import { isProduction } from '@/utils'
+import { generateMultiple } from '@/utils/faker'

 export class Torrents {
  static update(data) {
    if (store.state.webuiSettings.showTrackerFilter) {
-      // dont calculate trackers when disabled
+      // don't calculate trackers when disabled

      if (store.state.sort_options.tracker !== null) {
        data = data.filter(d => Hostname.get(d.tracker) === store.state.sort_options.tracker)
@ -19,7 +19,7 @@ export class Torrents {

    // load fake torrents if enabled
    if (isProduction()) return
-    if (import.meta.env.VITE_USE_FAKE_TORRENTS == 'false') return
+    if (import.meta.env.VITE_USE_FAKE_TORRENTS === 'false') return
    const count = import.meta.env.VITE_FAKE_TORRENT_COUNT
    store.state.torrents.push(...generateMultiple(count))
  }
--- a/src/components/Settings/Tabs/VueTorrent/Dashboard.vue
+++ b/src/components/Settings/Tabs/VueTorrent/Dashboard.vue
@ -92,7 +92,9 @@ export default {
        AddedOn: i18n.t(`${localePrefix}.addedOn`),
        Availability: i18n.t(`${localePrefix}.availability`),
        LastActivity: i18n.t(`${localePrefix}.last_activity`),
-        CompletedOn: i18n.t(`${localePrefix}.completion_on`)
+        CompletedOn: i18n.t(`${localePrefix}.completion_on`),
+        GlobalSpeed: i18n.t(`${localePrefix}.globalSpeed`),
+        GlobalVolume: i18n.t(`${localePrefix}.globalVolume`)
      }

      properties.forEach(property => property.label = localeMap[property.name])
--- a/src/components/Torrent/DashboardItems/GlobalSpeed.vue
+++ b/src/components/Torrent/DashboardItems/GlobalSpeed.vue
@ -0,0 +1,19 @@
+<template>
+  <v-flex xs6 sm1 md1>
+    <div class="caption grey--text">
+      {{ $t('globalSpeed') }}
+    </div>
+    <div>
+      {{ torrent.globalSpeed | getDataValue(1) }}
+      <span class="caption grey--text">
+        {{ torrent.globalSpeed | getDataUnit(1) }}/s
+      </span>
+    </div>
+  </v-flex>
+</template>
+<script>
+export default {
+  name: 'GlobalSpeed',
+  props: ['torrent']
+}
+</script>
--- a/src/components/Torrent/DashboardItems/GlobalVolume.vue
+++ b/src/components/Torrent/DashboardItems/GlobalVolume.vue
@ -0,0 +1,19 @@
+<template>
+  <v-flex xs6 sm1 md1>
+    <div class="caption grey--text">
+      {{ $t('globalVolume') }}
+    </div>
+    <div>
+      {{ torrent.globalVolume | getDataValue }}
+      <span class="caption grey--text">
+        {{ torrent.globalVolume | getDataUnit }}
+      </span>
+    </div>
+  </v-flex>
+</template>
+<script>
+export default {
+  name: 'GlobalVolume',
+  props: ['torrent']
+}
+</script>
--- a/src/components/Torrent/DashboardItems/index.js
+++ b/src/components/Torrent/DashboardItems/index.js
@ -17,6 +17,8 @@ import UploadedSession from './UploadedSession.vue'
 import Availability from './Availability.vue'
 import LastActivity from './LastActivity.vue'
 import CompletedOn from './CompletedOn.vue'
+import GlobalSpeed from './GlobalSpeed.vue'
+import GlobalVolume from './GlobalVolume.vue'

 export {
  Size,
@ -37,5 +39,7 @@ export {
  Uploaded,
  UploadedSession,
  Downloaded,
-  Availability
+  Availability,
+  GlobalSpeed,
+  GlobalVolume
 }
--- a/src/components/Torrent/MobileCard.vue
+++ b/src/components/Torrent/MobileCard.vue
@ -12,26 +12,37 @@
      <v-chip v-if="torrent.category" small class="upload caption white--text" style="height: 20px">
        {{ torrent.category }}
      </v-chip>
-      <v-chip v-if="torrent.tags" v-for="tag in torrent.tags" small class="tags caption white--text" style="height: 20px">
+      <v-chip v-if="torrent.tags" v-for="tag in torrent.tags" :key="tag" small class="tags caption white--text" style="height: 20px">
        {{ tag }}
      </v-chip>
    </v-flex>
-    <v-flex xs12 class="pa-0 ma-1 row">
-      <span class="body-2"> {{ torrent.dloaded | getDataValue }} </span>
-      <span class="grey--text caption ml-1"> {{ torrent.dloaded | getDataUnit }} / </span>
-      <span class="body-2 ml-1"> {{ torrent.size | getDataValue }} </span>
-      <span class="grey--text caption ml-1"> {{ torrent.size | getDataUnit }}</span>
-      <span class="mx-1 grey--text" style="margin-top: 3px">•</span>
-      <span class="body-2">{{ torrent.progress }}</span>
-      <span class="grey--text caption ml-1">%</span>
-      <span class="mx-1 grey--text" style="margin-top: 3px">•</span>
-      <span class="grey--text caption"> R: </span>
-      <span class="body-2 ml-1"> {{ torrent.ratio }} </span>
-      <span class="mx-1 grey--text" style="margin-top: 3px">•</span>
-      <span class="body-2"> {{ torrent.uploaded | getDataValue }} </span>
-      <span class="grey--text caption ml-1"> {{ torrent.uploaded | getDataUnit }} </span>
+    <v-flex xs12 class="pa-0 ma-1 row spangap">
+      <span class="downloaded">
+        <span class="body-2">{{ torrent.dloaded | getDataValue }} </span>
+        <span class="grey--text caption">{{ torrent.dloaded | getDataUnit }}</span>
+      </span>
+      <span class="grey--text caption">/</span>
+      <span class="size">
+        <span class="body-2">{{ torrent.size | getDataValue }} </span>
+        <span class="grey--text caption">{{ torrent.size | getDataUnit }}</span>
+      </span>
+      <span class="grey--text" style="margin-top: 3px">•</span>
+      <span class="progress">
+        <span class="body-2">{{ torrent.progress }} </span>
+        <span class="grey--text caption">%</span>
+      </span>
+      <span class="grey--text" style="margin-top: 3px">•</span>
+      <span class="ratio">
+        <span class="grey--text caption">R: </span>
+        <span class="body-2">{{ torrent.ratio }}</span>
+      </span>
+      <span class="grey--text" style="margin-top: 3px">•</span>
+      <span class="uploaded">
+        <span class="body-2">{{ torrent.uploaded | getDataValue }} </span>
+        <span class="grey--text caption">{{ torrent.uploaded | getDataUnit }}</span>
+      </span>
      <v-spacer />
-      <span class="body-2 ml-1"> {{ torrent.eta }} </span>
+      <span class="body-2">{{ torrent.eta }}</span>
    </v-flex>
    <v-flex xs12 class="ma-1">
      <v-progress-linear rounded color="upload" height="5" :value="torrent.progress" />
@ -78,6 +89,9 @@ export default {
 .chipgap {
  gap: 8px;
 }
+.spangap {
+  gap: 4px;
+}
 .tags {
  background-color: #048b9a !important;
 }
--- a/src/lang/en.js
+++ b/src/lang/en.js
@ -31,6 +31,8 @@ const locale = {
  downloaded: 'Downloaded',
  upload: 'Upload',
  uploaded: 'Uploaded',
+  globalSpeed: 'Global Speed',
+  globalVolume: 'Global Volume',
  ETA: 'ETA',
  peers: 'Peers',
  ratio: 'Ratio',
@ -73,7 +75,9 @@ const locale = {
    timeActive: 'Time Active',
    seededFor: 'Seeded For',
    last_activity: 'Last Activity',
-    completed_on: 'Completed On'
+    completed_on: 'Completed On',
+    globalSpeed: 'Global Speed',
+    globalVolume: 'Global Volume'
  },
  /** Navbar */
  navbar: {
@ -198,7 +202,9 @@ const locale = {
            addedOn: 'Added On',
            downloadSpeed: 'Download Speed',
            timeActive: 'Time Active',
-            uploadSpeed: 'Upload Speed'
+            uploadSpeed: 'Upload Speed',
+            globalSpeed: 'Global Speed',
+            globalVolume: 'Global Volume'
          }
        }
      },
@ -439,7 +445,9 @@ const locale = {
        addedOn: 'Added On',
        downloadSpeed: 'Download Speed',
        timeActive: 'Time Active',
-        uploadSpeed: 'Upload Speed'
+        uploadSpeed: 'Upload Speed',
+        globalSpeed: 'Global Speed',
+        globalVolume: 'Global Volume'
      }
    },
    speedLimit: {
--- a/src/lang/es.js
+++ b/src/lang/es.js
@ -72,7 +72,10 @@ const locale = {
    // uploadedSession: 'Uploaded Session',
    // timeActive: 'Time Active',
    // seededFor: 'Seeded For',
-    // last_activity: 'Last Activity'
+    // last_activity: 'Last Activity',
+    // completed_on: 'Completed On',
+    // globalSpeed: 'Global Speed',
+    // globalVolume: 'Global Volume'
  },
  /** Navbar */
  navbar: {
@ -432,7 +435,9 @@ const locale = {
        // addedOn: 'Added On',
        // downloadSpeed: 'Download Speed',
        // timeActive: 'Time Active',
-        // uploadSpeed: 'Upload Speed'
+        // uploadSpeed: 'Upload Speed',
+        // globalSpeed: 'Global Speed',
+        // globalVolume: 'Global Volume'
      }
    },
    speedLimit: {
--- a/src/lang/fr.js
+++ b/src/lang/fr.js
@ -71,7 +71,10 @@ const locale = {
    uploadedSession: 'Session de téléversement',
    timeActive: "Temps d'Activité",
    seededFor: 'Seed Depuis',
-    last_activity: 'Dernière Activité'
+    last_activity: 'Dernière Activité',
+    completed_on: 'Terminé Le',
+    globalSpeed: 'Vitesse Globale',
+    globalVolume: 'Volume Global'
  },
  /** Navbar */
  navbar: {
@ -431,7 +434,9 @@ const locale = {
        addedOn: "Date d'ajout",
        downloadSpeed: 'Vitesse de téléchargement',
        timeActive: 'Temps actif',
-        uploadSpeed: "Vitesse d'upload"
+        uploadSpeed: "Vitesse d'upload",
+        globalSpeed: 'Vitesse Globale',
+        globalVolume: 'Volume Global'
      }
    },
    speedLimit: {
--- a/src/lang/id.js
+++ b/src/lang/id.js
@ -71,7 +71,10 @@ const locale = {
    uploadedSession: 'Sesi Terunggah'
    // timeActive: 'Time Active',
    // seededFor: 'Seeded For',
-    // last_activity: 'Last Activity'
+    // last_activity: 'Last Activity',
+    // completed_on: 'Completed On',
+    // globalSpeed: 'Global Speed',
+    // globalVolume: 'Global Volume'
  },
  /** Navbar */
  navbar: {
@ -432,6 +435,8 @@ const locale = {
        downloadSpeed: 'Kec. Unduh',
        timeActive: 'Waktu aktif',
        uploadSpeed: 'Kec. Unggah'
+        // globalSpeed: 'Global Speed',
+        // globalVolume: 'Global Volume'
      }
    },
    speedLimit: {
--- a/src/lang/it.js
+++ b/src/lang/it.js
@ -71,7 +71,10 @@ const locale = {
    // uploadedSession: 'Uploaded Session',
    // timeActive: 'Time Active',
    // seededFor: 'Seeded For',
-    // last_activity: 'Last Activity'
+    // last_activity: 'Last Activity',
+    // completed_on: 'Completed On',
+    // globalSpeed: 'Global Speed',
+    // globalVolume: 'Global Volume'
  },
  /** Navbar */
  navbar: {
@ -431,7 +434,9 @@ const locale = {
        // addedOn: 'Added On',
        // downloadSpeed: 'Download Speed',
        // timeActive: 'Time Active',
-        // uploadSpeed: 'Upload Speed'
+        // uploadSpeed: 'Upload Speed',
+        // globalSpeed: 'Global Speed',
+        // globalVolume: 'Global Volume'
      }
    },
    speedLimit: {
--- a/src/lang/ja.js
+++ b/src/lang/ja.js
@ -70,7 +70,10 @@ const locale = {
    uploadedSession: 'アップロードセッション'
    // timeActive: 'Time Active',
    // seededFor: 'Seeded For',
-    // last_activity: 'Last Activity'
+    // last_activity: 'Last Activity',
+    // completed_on: 'Completed On',
+    // globalSpeed: 'Global Speed',
+    // globalVolume: 'Global Volume'
  },
  /** Navbar */
  navbar: {
@ -431,6 +434,8 @@ const locale = {
        downloadSpeed: 'ダウンロード速度',
        timeActive: '稼働時間',
        uploadSpeed: 'アップロード速度'
+        // globalSpeed: 'Global Speed',
+        // globalVolume: 'Global Volume'
      }
    },
    speedLimit: {
--- a/src/lang/nl.js
+++ b/src/lang/nl.js
@ -71,7 +71,10 @@ const locale = {
    // uploadedSession: 'Uploaded Session',
    // timeActive: 'Time Active',
    // seededFor: 'Seeded For',
-    // last_activity: 'Last Activity'
+    // last_activity: 'Last Activity',
+    // completed_on: 'Completed On',
+    // globalSpeed: 'Global Speed',
+    // globalVolume: 'Global Volume'
  },
  /** Navbar */
  navbar: {
@ -431,7 +434,9 @@ const locale = {
        // addedOn: 'Added On',
        // downloadSpeed: 'Download Speed',
        // timeActive: 'Time Active',
-        // uploadSpeed: 'Upload Speed'
+        // uploadSpeed: 'Upload Speed',
+        // globalSpeed: 'Global Speed',
+        // globalVolume: 'Global Volume'
      }
    },
    speedLimit: {
--- a/src/lang/pt-br.js
+++ b/src/lang/pt-br.js
@ -71,7 +71,10 @@ const locale = {
    // uploadedSession: 'Uploaded Session',
    // timeActive: 'Time Active',
    // seededFor: 'Seeded For',
-    // last_activity: 'Last Activity'
+    // last_activity: 'Last Activity',
+    // completed_on: 'Completed On',
+    // globalSpeed: 'Global Speed',
+    // globalVolume: 'Global Volume'
  },
  /** Navbar */
  navbar: {
@ -431,7 +434,9 @@ const locale = {
        // addedOn: 'Added On',
        // downloadSpeed: 'Download Speed',
        // timeActive: 'Time Active',
-        // uploadSpeed: 'Upload Speed'
+        // uploadSpeed: 'Upload Speed',
+        // globalSpeed: 'Global Speed',
+        // globalVolume: 'Global Volume'
      }
    },
    speedLimit: {
--- a/src/lang/ru.js
+++ b/src/lang/ru.js
@ -73,7 +73,9 @@ const locale = {
    // timeActive: 'Time Active',
    // seededFor: 'Seeded For',
    // last_activity: 'Last Activity',
-    // completed_on: 'Completed On'
+    // completed_on: 'Completed On',
+    // globalSpeed: 'Global Speed',
+    // globalVolume: 'Global Volume'
  },
  /** Navbar */
  navbar: {
@ -440,6 +442,8 @@ const locale = {
        downloadSpeed: 'Скорость загрузки',
        timeActive: 'Активен',
        uploadSpeed: 'Скорость отдачи'
+        // globalSpeed: 'Global Speed',
+        // globalVolume: 'Global Volume'
      }
    },
    speedLimit: {
--- a/src/lang/ua.js
+++ b/src/lang/ua.js
@ -73,7 +73,9 @@ const locale = {
    timeActive: 'Часу активно ',
    seededFor: 'роздано для',
    last_activity: 'остання активність',
-    completed_on: 'Виконано о'
+    completed_on: 'Виконано о',
+    // globalSpeed: 'Global Speed',
+    // globalVolume: 'Global Volume'
  },
  /** Navbar */
  navbar: {
@ -440,6 +442,8 @@ const locale = {
        downloadSpeed: 'Швидкість завантаження',
        timeActive: 'Час активний',
        uploadSpeed: 'Швидкість вивантаження'
+        // globalSpeed: 'Global Speed',
+        // globalVolume: 'Global Volume'
      }
    },
    speedLimit: {
--- a/src/lang/vi.js
+++ b/src/lang/vi.js
@ -71,7 +71,10 @@ const locale = {
    // uploadedSession: 'Uploaded Session',
    // timeActive: 'Time Active',
    // seededFor: 'Seeded For',
-    // last_activity: 'Last Activity'
+    // last_activity: 'Last Activity',
+    // completed_on: 'Completed On',
+    // globalSpeed: 'Global Speed',
+    // globalVolume: 'Global Volume'
  },
  /** Navbar */
  navbar: {
@ -431,7 +434,9 @@ const locale = {
        // addedOn: 'Added On',
        // downloadSpeed: 'Download Speed',
        // timeActive: 'Time Active',
-        // uploadSpeed: 'Upload Speed'
+        // uploadSpeed: 'Upload Speed',
+        // globalSpeed: 'Global Speed',
+        // globalVolume: 'Global Volume'
      }
    },
    speedLimit: {
--- a/src/lang/zh-hans.js
+++ b/src/lang/zh-hans.js
@ -72,6 +72,9 @@ const locale = {
    timeActive: '活跃时间',
    seededFor: '做种',
    last_activity: '上次活跃'
+    // completed_on: 'Completed On',
+    // globalSpeed: 'Global Speed',
+    // globalVolume: 'Global Volume'
  },
  /** Navbar */
  navbar: {
@ -432,6 +435,8 @@ const locale = {
        downloadSpeed: '下载速率',
        timeActive: '活跃时间',
        uploadSpeed: '上传速率'
+        // globalSpeed: 'Global Speed',
+        // globalVolume: 'Global Volume'
      }
    },
    speedLimit: {
--- a/src/lang/zh-hant.js
+++ b/src/lang/zh-hant.js
@ -74,6 +74,8 @@ const locale = {
    seededFor: '已做種',
    last_activity: '最後活動',
    completed_on: '完成於'
+    // globalSpeed: 'Global Speed',
+    // globalVolume: 'Global Volume'
  },
  /** Navbar */
  navbar: {
@ -440,6 +442,8 @@ const locale = {
        downloadSpeed: '下載速率',
        timeActive: '經過時間',
        uploadSpeed: '上傳速率'
+        // globalSpeed: 'Global Speed',
+        // globalVolume: 'Global Volume'
      }
    },
    speedLimit: {
--- a/src/models/Torrent.js
+++ b/src/models/Torrent.js
@ -8,6 +8,7 @@ dayjs.extend(relativeTime)
 const durationFormat = 'D[d] H[h] m[m] s[s]'

 export default class Torrent {
+  static computedValues = ['globalSpeed', 'globalVolume']
  constructor(data, format = 'DD/MM/YYYY, HH:mm:ss') {
    this.name = data.name
    this.size = data.size
@ -46,6 +47,10 @@ export default class Torrent {
    this.seeding_time = data.seeding_time > 0 ? dayjs.duration(data.seeding_time, 'seconds').format(durationFormat) : null
    this.last_activity = dayjs(data.last_activity * 1000).fromNow()

+    // computed values
+    this.globalSpeed = this.dlspeed + this.upspeed
+    this.globalVolume = this.dloaded + this.uploaded
+
    Object.freeze(this)
  }

--- a/src/plugins/i18n.ts
+++ b/src/plugins/i18n.ts
@ -2,7 +2,7 @@ import Vue from 'vue'
 import axios from 'axios'
 import VueI18n from 'vue-i18n'

-import { messages } from '../lang'
+import { messages } from '@/lang'

 Vue.use(VueI18n)

--- a/src/services/qbit.ts
+++ b/src/services/qbit.ts
@ -97,9 +97,9 @@ export class QBitApi {

  getTorrents(payload) {
    const params = {
-      sort: payload.sort,
-      reverse: payload.reverse,
-      hashes: payload.hashes ? payload.hashes.join('|') : null,
+      sort: !payload.isCustomSortEnabled ? payload.sort : null,
+      reverse: !payload.isCustomSortEnabled ? payload.reverse : null,
+      hashes: payload.hashes.length > 0 ? payload.hashes.join('|') : null,
      filter: payload.filter ? payload.filter : null,
      category: payload.category !== null ? payload.category : null,
      tag: payload.tag !== null ? payload.tag : null
--- a/src/store/index.js
+++ b/src/store/index.js
@ -35,7 +35,9 @@ const propertiesTemplate = [
  { name: 'AddedOn', active: true },
  { name: 'Availability', active: true },
  { name: 'LastActivity', active: false },
-  { name: 'CompletedOn', active: false }
+  { name: 'CompletedOn', active: false },
+  { name: 'GlobalSpeed', active: false },
+  { name: 'GlobalVolume', active: false }
 ]

 export default new Vuex.Store({
@ -65,6 +67,7 @@ export default new Vuex.Store({
    selected_torrents: [],
    authenticated: false,
    sort_options: {
+      isCustomSortEnabled: false,
      sort: 'priority',
      reverse: false,
      hashes: [],
--- a/src/store/mutations.js
+++ b/src/store/mutations.js
@ -1,6 +1,7 @@
 import qbit from '../services/qbit'
 import { DocumentTitle, Tags, Trackers, Torrents, Graph, ServerStatus } from '@/actions'
 import { setLanguage } from '@/plugins/i18n'
+import Torrent from "@/models/Torrent";

 export default {
  SET_APP_VERSION(state, version) {
@ -56,6 +57,7 @@ export default {
    Graph.update()

    // fetch torrent data
+    state.sort_options.isCustomSortEnabled = Torrent.computedValues.indexOf(state.sort_options.sort) !== -1
    const { data } = await qbit.getTorrents(state.sort_options)

    Trackers.update(data)
--- a/src/views/Dashboard.vue
+++ b/src/views/Dashboard.vue
@ -183,6 +183,8 @@ export default {
        { value: 'dlspeed', text: this.$i18n.t('modals.sort.sortBy.downloadSpeed') },
        { value: 'downloaded', text: this.$i18n.t('modals.sort.sortBy.downloaded') },
        { value: 'eta', text: this.$i18n.t('modals.sort.sortBy.ETA') },
+        { value: 'globalSpeed', text: this.$i18n.t('modals.sort.sortBy.globalSpeed') },
+        { value: 'globalVolume', text: this.$i18n.t('modals.sort.sortBy.globalVolume') },
        { value: 'name', text: this.$i18n.t('modals.sort.sortBy.name') },
        { value: 'num_leechs', text: this.$i18n.t('modals.sort.sortBy.peers') },
        { value: 'last_activity', text: this.$i18n.t('modals.sort.sortBy.last_activity') },
@ -207,13 +209,22 @@ export default {
    }
  },
  computed: {
-    ...mapState(['mainData', 'selected_torrents', 'dashboard', 'sort_options']),
+    ...mapState(['selected_torrents', 'dashboard', 'sort_options']),
    ...mapGetters(['getTorrents', 'getTorrentCountString', 'getWebuiSettings']),
    torrents() {
-      if (!this.hasSearchFilter) return this.getTorrents()
+      let torrents
+      if (!this.hasSearchFilter)
+        torrents = this.getTorrents()
+      else {
+        const qs = new QuickScore(this.getTorrents(), ['name', 'size', 'state', 'hash', 'savePath', 'tags', 'category'])
+        torrents = qs.search(this.input).map(el => el.item)
+      }

-      const qs = new QuickScore(this.getTorrents(), ['name', 'size', 'state', 'hash', 'savePath', 'tags', 'category'])
-      return qs.search(this.input).map(el => el.item)
+      if (this.sort_options.isCustomSortEnabled) {
+        torrents.sort((a, b) => a[this.sort_options.sort] - b[this.sort_options.sort] || a.added_on - b.added_on)
+        if (this.sort_options.reverse) torrents.reverse()
+      }
+      return torrents
    },
    pageNumber: {
      get() {