diff --git a/ui/app/components/Queue.vue b/ui/app/components/Queue.vue index 63811d7a..7ab145b4 100644 --- a/ui/app/components/Queue.vue +++ b/ui/app/components/Queue.vue @@ -240,7 +240,7 @@ v-rtime="item.datetime" />
+ v-if="item.downloaded_bytes" v-tooltip="`Saving to: ${makePath(item)}`"> {{ formatBytes(item.downloaded_bytes) }}
@@ -598,4 +598,15 @@ watch(embed_url, v => { } document.querySelector('body')?.setAttribute('style', `opacity: ${v ? 1 : bg_opacity.value}`) }) + +const makePath = (item: StoreItem) => { + const parts = [ + eTrim(item.download_dir, '/').replace(config.app.download_path, ''), + ] + if (item?.filename) { + parts.push(eTrim(item.filename, '/')) + } + + return '/' + sTrim(parts.filter(p => !!p).map(p => p.replace(/\\/g, '/').replace(/\/+/g, '/')).join('/'), '/') +} diff --git a/ui/app/pages/browser/[...slug].vue b/ui/app/pages/browser/[...slug].vue index f1e06e18..9e204a6f 100644 --- a/ui/app/pages/browser/[...slug].vue +++ b/ui/app/pages/browser/[...slug].vue @@ -29,6 +29,7 @@
@@ -37,12 +38,14 @@ :class="{ 'is-loading': isLoading }" :disabled="!socket.isConnected || isLoading" v-tooltip.bottom="'Create new directory'" v-if="config.app.browser_control_enabled"> + New Folder

@@ -201,6 +204,7 @@ const route = useRoute() const toast = useNotification() const config = useConfigStore() const socket = useSocketStore() +const isMobile = useMediaQuery({ maxWidth: 1024 }) const bg_enable = useStorage('random_bg', true) const bg_opacity = useStorage('random_bg_opacity', 0.95) diff --git a/ui/app/pages/conditions.vue b/ui/app/pages/conditions.vue index 64cf6964..afcbfa82 100644 --- a/ui/app/pages/conditions.vue +++ b/ui/app/pages/conditions.vue @@ -13,12 +13,14 @@

@@ -121,6 +123,7 @@ const toast = useNotification() const config = useConfigStore() const socket = useSocketStore() const box = useConfirm() +const isMobile = useMediaQuery({ maxWidth: 1024 }) const items = ref([]) const item = ref>({}) diff --git a/ui/app/pages/index.vue b/ui/app/pages/index.vue index 27c065ba..dea27146 100644 --- a/ui/app/pages/index.vue +++ b/ui/app/pages/index.vue @@ -46,9 +46,9 @@

@@ -123,8 +123,9 @@ const stateStore = useStateStore() const socket = useSocketStore() const bg_enable = useStorage('random_bg', true) const bg_opacity = useStorage('random_bg_opacity', 0.95) -const display_style = useStorage('display_style', 'cards') +const display_style = useStorage('display_style', 'grid') const show_thumbnail = useStorage('show_thumbnail', true) +const isMobile = useMediaQuery({ maxWidth: 1024 }) const info_view = ref({ url: '', @@ -143,7 +144,6 @@ const dialog_confirm = ref({ options: [], }) -const isMobile = useMediaQuery({ maxWidth: 1024 }) watch(toggleFilter, () => { if (!toggleFilter.value) { @@ -217,7 +217,7 @@ watch(() => info_view.value.url, v => { document.querySelector('body')?.setAttribute("style", `opacity: ${v ? 1 : bg_opacity.value}`) }) -const changeDisplay = () => display_style.value = display_style.value === 'cards' ? 'list' : 'cards' +const changeDisplay = () => display_style.value = display_style.value === 'grid' ? 'list' : 'grid' const toNewDownload = async (item: item_request | Partial) => { if (!item) { diff --git a/ui/app/pages/notifications.vue b/ui/app/pages/notifications.vue index a7325da6..bc234741 100644 --- a/ui/app/pages/notifications.vue +++ b/ui/app/pages/notifications.vue @@ -14,19 +14,25 @@

@@ -203,6 +209,7 @@ const config = useConfigStore() const socket = useSocketStore() const box = useConfirm() const display_style = useStorage("tasks_display_style", "cards") +const isMobile = useMediaQuery({ maxWidth: 1024 }) const allowedEvents = ref([]) const notifications = ref([]) diff --git a/ui/app/pages/presets.vue b/ui/app/pages/presets.vue index a66dec20..28698370 100644 --- a/ui/app/pages/presets.vue +++ b/ui/app/pages/presets.vue @@ -14,20 +14,26 @@

@@ -214,6 +220,7 @@ const socket = useSocketStore() const box = useConfirm() const display_style = useStorage('preset_display_style', 'cards') +const isMobile = useMediaQuery({ maxWidth: 1024 }) const presets = ref([]) const preset = ref>({}) diff --git a/ui/app/pages/tasks.vue b/ui/app/pages/tasks.vue index 4277af39..be648b2f 100644 --- a/ui/app/pages/tasks.vue +++ b/ui/app/pages/tasks.vue @@ -20,6 +20,7 @@

@@ -27,14 +28,19 @@

@@ -42,6 +48,7 @@

@@ -382,6 +389,7 @@ const config = useConfigStore() const socket = useSocketStore() const { confirmDialog: cDialog } = useDialog() const display_style = useStorage("tasks_display_style", "cards") +const isMobile = useMediaQuery({ maxWidth: 1024 }) const tasks = ref>([]) const task = ref({})