mirror of
https://github.com/VueTorrent/VueTorrent.git
synced 2025-03-14 12:10:18 +03:00
feat: custom date format support #340
This commit is contained in:
parent
1d9279a376
commit
e08a4456ee
7 changed files with 86 additions and 120 deletions
|
@ -15,7 +15,7 @@ export class Torrents {
|
|||
}
|
||||
|
||||
// update torrents
|
||||
store.state.torrents = data.map(t => new Torrent(t))
|
||||
store.state.torrents = data.map(t => new Torrent(t, store.state.webuiSettings.dateFormat))
|
||||
|
||||
// load fake torrents if enabled
|
||||
if (isProduction()) return
|
||||
|
|
|
@ -6,56 +6,98 @@
|
|||
<v-list-item>
|
||||
<v-row dense>
|
||||
<v-col>
|
||||
<v-switch v-model="showCurrentSpeed" class="v-input--reverse pa-0 ma-0" hide-details inset :label="$t('modals.settings.pageVueTorrent.pageGeneral.currentSpeed')" />
|
||||
<v-switch
|
||||
v-model="webuiSettings.showCurrentSpeed"
|
||||
class="v-input--reverse pa-0 ma-0"
|
||||
hide-details
|
||||
inset
|
||||
:label="$t('modals.settings.pageVueTorrent.pageGeneral.currentSpeed')"
|
||||
/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-list-item>
|
||||
<v-list-item>
|
||||
<v-row dense>
|
||||
<v-col>
|
||||
<v-switch v-model="showSpeedGraph" class="v-input--reverse pa-0 ma-0" hide-details inset :label="$t('modals.settings.pageVueTorrent.pageGeneral.speedGraph')" />
|
||||
<v-switch
|
||||
v-model="webuiSettings.showSpeedGraph"
|
||||
class="v-input--reverse pa-0 ma-0"
|
||||
hide-details
|
||||
inset
|
||||
:label="$t('modals.settings.pageVueTorrent.pageGeneral.speedGraph')"
|
||||
/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-list-item>
|
||||
<v-list-item>
|
||||
<v-row dense>
|
||||
<v-col>
|
||||
<v-switch v-model="showSessionStat" class="v-input--reverse pa-0 ma-0" hide-details inset :label="$t('modals.settings.pageVueTorrent.pageGeneral.sessionStats')" />
|
||||
<v-switch
|
||||
v-model="webuiSettings.showSessionStat"
|
||||
class="v-input--reverse pa-0 ma-0"
|
||||
hide-details
|
||||
inset
|
||||
:label="$t('modals.settings.pageVueTorrent.pageGeneral.sessionStats')"
|
||||
/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-list-item>
|
||||
<v-list-item>
|
||||
<v-row dense>
|
||||
<v-col>
|
||||
<v-switch v-model="showAlltimeStat" class="v-input--reverse pa-0 ma-0" hide-details inset :label="$t('modals.settings.pageVueTorrent.pageGeneral.allTimeStats')" />
|
||||
<v-switch
|
||||
v-model="webuiSettings.showAlltimeStat"
|
||||
class="v-input--reverse pa-0 ma-0"
|
||||
hide-details
|
||||
inset
|
||||
:label="$t('modals.settings.pageVueTorrent.pageGeneral.allTimeStats')"
|
||||
/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-list-item>
|
||||
<v-list-item>
|
||||
<v-row dense>
|
||||
<v-col>
|
||||
<v-switch v-model="freeSpace" class="v-input--reverse pa-0 ma-0" hide-details inset :label="$t('modals.settings.pageVueTorrent.pageGeneral.freeSpace')" />
|
||||
<v-switch v-model="webuiSettings.freeSpace" class="v-input--reverse pa-0 ma-0" hide-details inset :label="$t('modals.settings.pageVueTorrent.pageGeneral.freeSpace')" />
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-list-item>
|
||||
<v-list-item>
|
||||
<v-row dense>
|
||||
<v-col>
|
||||
<v-switch v-model="showTrackerFilter" class="v-input--reverse pa-0 ma-0" hide-details inset :label="$t('modals.settings.pageVueTorrent.pageGeneral.trackerFilter')" />
|
||||
<v-switch
|
||||
v-model="webuiSettings.showTrackerFilter"
|
||||
class="v-input--reverse pa-0 ma-0"
|
||||
hide-details
|
||||
inset
|
||||
:label="$t('modals.settings.pageVueTorrent.pageGeneral.trackerFilter')"
|
||||
/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-list-item>
|
||||
<v-list-item>
|
||||
<v-row dense>
|
||||
<v-col>
|
||||
<v-switch v-model="rightDrawer" class="v-input--reverse pa-0 ma-0" hide-details inset :label="$t('modals.settings.pageVueTorrent.pageGeneral.rightDrawer')" />
|
||||
<v-switch
|
||||
v-model="webuiSettings.rightDrawer"
|
||||
class="v-input--reverse pa-0 ma-0"
|
||||
hide-details
|
||||
inset
|
||||
:label="$t('modals.settings.pageVueTorrent.pageGeneral.rightDrawer')"
|
||||
/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-list-item>
|
||||
<v-list-item>
|
||||
<v-row dense>
|
||||
<v-col>
|
||||
<v-switch v-model="topPagination" class="v-input--reverse pa-0 ma-0" hide-details inset :label="$t('modals.settings.pageVueTorrent.pageGeneral.topPagination')" />
|
||||
<v-switch
|
||||
v-model="webuiSettings.topPagination"
|
||||
class="v-input--reverse pa-0 ma-0"
|
||||
hide-details
|
||||
inset
|
||||
:label="$t('modals.settings.pageVueTorrent.pageGeneral.topPagination')"
|
||||
/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-list-item>
|
||||
|
@ -67,7 +109,7 @@
|
|||
</p>
|
||||
</v-col>
|
||||
<v-col cols="4" sm="4" md="2">
|
||||
<v-select v-model="lang" flat solo dense hide-details background-color="background" class="rounded-xl" :items="languages" />
|
||||
<v-select v-model="webuiSettings.lang" flat solo dense hide-details background-color="background" class="rounded-xl" :items="languages" />
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-list-item>
|
||||
|
@ -79,7 +121,7 @@
|
|||
</p>
|
||||
</v-col>
|
||||
<v-col cols="4" sm="4" md="2">
|
||||
<v-select v-model="paginationSize" flat solo dense hide-details background-color="background" class="rounded-xl" :items="paginationSizes" />
|
||||
<v-select v-model="webuiSettings.paginationSize" flat solo dense hide-details background-color="background" class="rounded-xl" :items="paginationSizes" />
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-list-item>
|
||||
|
@ -91,7 +133,28 @@
|
|||
</p>
|
||||
</v-col>
|
||||
<v-col cols="4" sm="4" md="2">
|
||||
<v-select v-model="title" flat solo dense hide-details background-color="background" class="rounded-xl" :items="titleOptions" />
|
||||
<v-select v-model="webuiSettings.title" flat solo dense hide-details background-color="background" class="rounded-xl" :items="titleOptions" />
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-list-item>
|
||||
<v-list-item>
|
||||
<v-row dense>
|
||||
<v-col sm="6" md="9">
|
||||
<p class="subtitle-1 mt-2">
|
||||
{{ $t('modals.settings.pageVueTorrent.pageGeneral.dateFormat') }}
|
||||
</p>
|
||||
</v-col>
|
||||
<v-col sm="6" md="3">
|
||||
<v-text-field
|
||||
v-model="webuiSettings.dateFormat"
|
||||
class="mb-2"
|
||||
outlined
|
||||
dense
|
||||
hide-details
|
||||
:aria-label="$t('modals.settings.pageVueTorrent.pageGeneral.dateFormat')"
|
||||
placeholder="DD/MM/YYYY, HH:mm:ss"
|
||||
label="using Dayjs"
|
||||
/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-list-item>
|
||||
|
@ -146,94 +209,6 @@ export default {
|
|||
computed: {
|
||||
...mapState(['webuiSettings']),
|
||||
...mapGetters(['getAppVersion']),
|
||||
freeSpace: {
|
||||
get() {
|
||||
return this.webuiSettings.showFreeSpace
|
||||
},
|
||||
set(val) {
|
||||
this.webuiSettings.showFreeSpace = val
|
||||
}
|
||||
},
|
||||
showCurrentSpeed: {
|
||||
get() {
|
||||
return this.webuiSettings.showCurrentSpeed
|
||||
},
|
||||
set(val) {
|
||||
this.webuiSettings.showCurrentSpeed = val
|
||||
}
|
||||
},
|
||||
showSpeedGraph: {
|
||||
get() {
|
||||
return this.webuiSettings.showSpeedGraph
|
||||
},
|
||||
set(val) {
|
||||
this.webuiSettings.showSpeedGraph = val
|
||||
}
|
||||
},
|
||||
showSessionStat: {
|
||||
get() {
|
||||
return this.webuiSettings.showSessionStat
|
||||
},
|
||||
set(val) {
|
||||
this.webuiSettings.showSessionStat = val
|
||||
}
|
||||
},
|
||||
showAlltimeStat: {
|
||||
get() {
|
||||
return this.webuiSettings.showAlltimeStat
|
||||
},
|
||||
set(val) {
|
||||
this.webuiSettings.showAlltimeStat = val
|
||||
}
|
||||
},
|
||||
showTrackerFilter: {
|
||||
get() {
|
||||
return this.webuiSettings.showTrackerFilter
|
||||
},
|
||||
set(val) {
|
||||
this.webuiSettings.showTrackerFilter = val
|
||||
}
|
||||
},
|
||||
rightDrawer: {
|
||||
get() {
|
||||
return this.webuiSettings.rightDrawer
|
||||
},
|
||||
set(val) {
|
||||
this.webuiSettings.rightDrawer = val
|
||||
}
|
||||
},
|
||||
topPagination: {
|
||||
get() {
|
||||
return this.webuiSettings.topPagination
|
||||
},
|
||||
set(val) {
|
||||
this.webuiSettings.topPagination = val
|
||||
}
|
||||
},
|
||||
paginationSize: {
|
||||
get() {
|
||||
return this.webuiSettings.paginationSize
|
||||
},
|
||||
set(val) {
|
||||
this.webuiSettings.paginationSize = val
|
||||
}
|
||||
},
|
||||
title: {
|
||||
get() {
|
||||
return this.webuiSettings.title
|
||||
},
|
||||
set(val) {
|
||||
this.webuiSettings.title = val
|
||||
}
|
||||
},
|
||||
lang: {
|
||||
get() {
|
||||
return this.webuiSettings.lang
|
||||
},
|
||||
set(val) {
|
||||
this.webuiSettings.lang = val
|
||||
}
|
||||
},
|
||||
version() {
|
||||
return this.getAppVersion()
|
||||
}
|
||||
|
|
|
@ -11,4 +11,4 @@ export default {
|
|||
name: 'LastActivity',
|
||||
props: ['torrent']
|
||||
}
|
||||
</script>
|
||||
</script>
|
||||
|
|
|
@ -1,4 +1,3 @@
|
|||
import dayjs from 'dayjs'
|
||||
import Vue from 'vue'
|
||||
|
||||
/* eslint-disable no-param-reassign */
|
||||
|
@ -34,18 +33,6 @@ export function formatSize(value) {
|
|||
Vue.filter('formatSize', formatSize)
|
||||
Vue.filter('size', formatSize)
|
||||
|
||||
export function formatTimestamp(timestamp) {
|
||||
if (timestamp == null || timestamp === -1) {
|
||||
return ''
|
||||
}
|
||||
|
||||
const m = dayjs.unix(timestamp)
|
||||
|
||||
return m.format('YYYY-MM-DD HH:mm:ss')
|
||||
}
|
||||
|
||||
Vue.filter('formatTimestamp', formatTimestamp)
|
||||
|
||||
export function formatProgress(progress) {
|
||||
progress *= 100
|
||||
|
||||
|
|
|
@ -141,10 +141,11 @@ const locale = {
|
|||
freeSpace: 'Show Free Space',
|
||||
trackerFilter: 'Show Tracker Filter',
|
||||
rightDrawer: 'Right Drawer',
|
||||
topPagination: 'Place the pagination at the top of the screen',
|
||||
topPagination: 'Top Pagination',
|
||||
language: 'Language:',
|
||||
paginationSize: 'Pagination size:',
|
||||
vueTorrentTitle: 'VueTorrent title:',
|
||||
dateFormat: 'Date Format',
|
||||
currentVersion: 'Current Version:',
|
||||
qbittorrentVersion: 'QBittorrent Version:'
|
||||
},
|
||||
|
|
|
@ -5,11 +5,13 @@ import relativeTime from 'dayjs/plugin/relativeTime'
|
|||
dayjs.extend(duration)
|
||||
dayjs.extend(relativeTime)
|
||||
|
||||
const durationFormat = 'D[d] H[h] m[m] s[s]'
|
||||
|
||||
export default class Torrent {
|
||||
constructor(data) {
|
||||
constructor(data, format = 'DD/MM/YYYY, HH:mm:ss') {
|
||||
this.name = data.name
|
||||
this.size = data.size
|
||||
this.added_on = new Date(data.added_on * 1000).toLocaleString()
|
||||
this.added_on = dayjs(data.added_on * 1000).format(format)
|
||||
this.dlspeed = data.dlspeed
|
||||
this.dloaded = data.completed
|
||||
this.upspeed = data.upspeed
|
||||
|
@ -39,8 +41,8 @@ export default class Torrent {
|
|||
this.availability = Math.round(data.availability * 100) / 100
|
||||
this.forced = data.state.includes('forced')
|
||||
this.magnet = data.magnet_uri
|
||||
this.time_active = dayjs.duration(data.time_active, 'seconds').format('D[d] H[h] m[m] s[s]')
|
||||
this.seeding_time = data.seeding_time > 0 ? dayjs.duration(data.seeding_time, 'seconds').format('D[d] H[h] m[m] s[s]') : null
|
||||
this.time_active = dayjs.duration(data.time_active, 'seconds').format(durationFormat)
|
||||
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()
|
||||
|
||||
Object.freeze(this)
|
||||
|
|
|
@ -68,6 +68,7 @@ export default new Vuex.Store({
|
|||
rightDrawer: false,
|
||||
topPagination: false,
|
||||
paginationSize: 15,
|
||||
dateFormat: 'DD/MM/YYYY, HH:mm:ss',
|
||||
busyTorrentProperties: [
|
||||
{ name: 'Size', active: true },
|
||||
{ name: 'Progress', active: true },
|
||||
|
@ -85,7 +86,7 @@ export default new Vuex.Store({
|
|||
{ name: 'Tags', active: true },
|
||||
{ name: 'AddedOn', active: true },
|
||||
{ name: 'Availability', active: true },
|
||||
{ name: 'LastActivity', active: false },
|
||||
{ name: 'LastActivity', active: false }
|
||||
],
|
||||
doneTorrentProperties: [
|
||||
{ name: 'Size', active: true },
|
||||
|
|
Loading…
Add table
Reference in a new issue