mirror of
https://github.com/VueTorrent/VueTorrent.git
synced 2025-02-18 00:02:02 +03:00
perf: Content tab for mobile users (#602) @Larsluph
This commit is contained in:
parent
f175a6af65
commit
fc371a296c
1 changed files with 16 additions and 11 deletions
|
@ -3,17 +3,17 @@
|
|||
<v-treeview v-model="selected" :items="fileTree" :open.sync="opened" activatable selectable item-key="fullName" open-all>
|
||||
<template #prepend="{ item, open }">
|
||||
<v-icon v-if="!item.icon">
|
||||
{{ open ? mdiFolderOpen : mdiFolderOpen }}
|
||||
{{ open ? mdiFolderOpen : mdiFolder }}
|
||||
</v-icon>
|
||||
<v-icon v-else>
|
||||
{{ item.icon }}
|
||||
</v-icon>
|
||||
</template>
|
||||
<template #label="{ item }">
|
||||
<span v-if="!item.editing">{{ item.name }}</span>
|
||||
<span class="item-name" v-if="!item.editing">{{ item.name }}</span>
|
||||
<v-text-field v-if="item.editing" v-model="item.newName" autofocus />
|
||||
</template>
|
||||
<template v-if="!$vuetify.breakpoint.smAndDown" #append="{ item }">
|
||||
<template #append="{ item }">
|
||||
<div v-if="!item.icon">
|
||||
<span class="ml-4">{{ item.children.length }} Files</span>
|
||||
<v-btn v-if="!item.editing" fab x-small class="accent white--text elevation-0 px-4 ml-2" @click="edit(item)">
|
||||
|
@ -27,9 +27,9 @@
|
|||
</v-btn>
|
||||
</div>
|
||||
<div v-else>
|
||||
<span>[{{ item.size }}]</span>
|
||||
<span class="ml-4">{{ item.progress }}%</span>
|
||||
<span class="ml-4">[ {{ item.priority | priority }} ]</span>
|
||||
<span v-if="!$vuetify.breakpoint.xsOnly && !item.editing">[{{ item.size }}]</span>
|
||||
<span v-if="!$vuetify.breakpoint.xsOnly && !item.editing" class="ml-4">{{ item.progress }}%</span>
|
||||
<span v-if="!$vuetify.breakpoint.xsOnly && !item.editing" class="ml-4">[ {{ item.priority | priority }} ]</span>
|
||||
<v-menu open-on-hover offset-y>
|
||||
<template #activator="{ on }">
|
||||
<v-btn fab x-small class="accent white--text elevation-0 px-4 ml-2" v-on="on">
|
||||
|
@ -68,17 +68,16 @@ import { mdiClose, mdiContentSave, mdiPencil, mdiFolderOpen, mdiFolder, mdiFile,
|
|||
import Vue from 'vue'
|
||||
|
||||
const FILE_PRIORITY_OPTIONS = [
|
||||
{ name: 'max', icon: mdiPriorityHigh, value: 7 },
|
||||
{ name: 'high', icon: mdiArrowUp, value: 6 },
|
||||
{ name: 'normal', icon: mdiArrowDown, value: 1 },
|
||||
{ name: 'unwanted', icon: mdiPriorityLow, value: 0 }
|
||||
{ name: 'Max', icon: mdiPriorityHigh, value: 7 },
|
||||
{ name: 'High', icon: mdiArrowUp, value: 6 },
|
||||
{ name: 'Normal', icon: mdiArrowDown, value: 1 },
|
||||
{ name: 'Unwanted', icon: mdiPriorityLow, value: 0 }
|
||||
]
|
||||
|
||||
export default {
|
||||
name: 'Content',
|
||||
filters: {
|
||||
priority(value) {
|
||||
if (value === 4) return 'normal'
|
||||
const res = FILE_PRIORITY_OPTIONS.find(el => el.value === value)
|
||||
|
||||
return res ? res.name : 'undefined'
|
||||
|
@ -212,3 +211,9 @@ export default {
|
|||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.item-name {
|
||||
white-space: normal;
|
||||
}
|
||||
</style>
|
||||
|
|
Loading…
Add table
Reference in a new issue