mirror of
https://github.com/jxxghp/MoviePilot-Frontend.git
synced 2026-09-04 23:18:44 +08:00
fix ui
This commit is contained in:
@@ -11,6 +11,15 @@ import store from '@/store'
|
|||||||
import api from '@/api'
|
import api from '@/api'
|
||||||
import MediaInfoCard from '@/components/cards/MediaInfoCard.vue'
|
import MediaInfoCard from '@/components/cards/MediaInfoCard.vue'
|
||||||
import ProgressDialog from '../dialog/ProgressDialog.vue'
|
import ProgressDialog from '../dialog/ProgressDialog.vue'
|
||||||
|
import { useDisplay } from 'vuetify'
|
||||||
|
|
||||||
|
// 显示器宽度
|
||||||
|
const display = useDisplay()
|
||||||
|
|
||||||
|
// APP
|
||||||
|
const appMode = computed(() => {
|
||||||
|
return localStorage.getItem('MP_APPMODE') == '1' && display.mdAndDown.value
|
||||||
|
})
|
||||||
|
|
||||||
// 输入参数
|
// 输入参数
|
||||||
const inProps = defineProps({
|
const inProps = defineProps({
|
||||||
@@ -364,7 +373,14 @@ onMounted(() => {
|
|||||||
</VCardText>
|
</VCardText>
|
||||||
<VCardText v-else-if="dirs.length || files.length" class="p-0">
|
<VCardText v-else-if="dirs.length || files.length" class="p-0">
|
||||||
<VList subheader>
|
<VList subheader>
|
||||||
<VVirtualScroll class="virtual-scroll-div" :items="[...dirs, ...files]">
|
<VVirtualScroll
|
||||||
|
:items="[...dirs, ...files]"
|
||||||
|
:style="
|
||||||
|
appMode
|
||||||
|
? 'height: calc(100vh - 15rem - env(safe-area-inset-bottom) - 3.5rem)'
|
||||||
|
: 'height: calc(100vh - 14rem - env(safe-area-inset-bottom)'
|
||||||
|
"
|
||||||
|
>
|
||||||
<template #default="{ item }">
|
<template #default="{ item }">
|
||||||
<VHover>
|
<VHover>
|
||||||
<template #default="hover">
|
<template #default="hover">
|
||||||
@@ -497,14 +513,4 @@ onMounted(() => {
|
|||||||
.v-toolbar {
|
.v-toolbar {
|
||||||
background: rgb(var(--v-table-header-background));
|
background: rgb(var(--v-table-header-background));
|
||||||
}
|
}
|
||||||
|
|
||||||
.virtual-scroll-div {
|
|
||||||
block-size: calc(100vh - 14rem);
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (width <= 768px) {
|
|
||||||
.virtual-scroll-div {
|
|
||||||
block-size: calc(100vh - 17rem);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -16,23 +16,23 @@ const appMode = computed(() => {
|
|||||||
class="footer-nav border-t"
|
class="footer-nav border-t"
|
||||||
style="block-size: calc(3.5rem + env(safe-area-inset-bottom))"
|
style="block-size: calc(3.5rem + env(safe-area-inset-bottom))"
|
||||||
>
|
>
|
||||||
<VBtn to="/dashboard">
|
<VBtn to="/dashboard" :ripple="false">
|
||||||
<VIcon size="28">mdi-home-outline</VIcon>
|
<VIcon size="28">mdi-home-outline</VIcon>
|
||||||
<span>首页</span>
|
<span>首页</span>
|
||||||
</VBtn>
|
</VBtn>
|
||||||
<VBtn to="/ranking">
|
<VBtn to="/ranking" :ripple="false">
|
||||||
<VIcon size="28">mdi-star-check-outline</VIcon>
|
<VIcon size="28">mdi-star-check-outline</VIcon>
|
||||||
<span>推荐</span>
|
<span>推荐</span>
|
||||||
</VBtn>
|
</VBtn>
|
||||||
<VBtn to="/subscribe-movie?tab=mysub">
|
<VBtn to="/subscribe-movie?tab=mysub" :ripple="false">
|
||||||
<VIcon size="28">mdi-movie-roll</VIcon>
|
<VIcon size="28">mdi-movie-roll</VIcon>
|
||||||
<span><span></span>电影</span>
|
<span><span></span>电影</span>
|
||||||
</VBtn>
|
</VBtn>
|
||||||
<VBtn to="/subscribe-tv?tab=mysub">
|
<VBtn to="/subscribe-tv?tab=mysub" :ripple="false">
|
||||||
<VIcon size="28">mdi-television-classic</VIcon>
|
<VIcon size="28">mdi-television-classic</VIcon>
|
||||||
<span>电视剧</span>
|
<span>电视剧</span>
|
||||||
</VBtn>
|
</VBtn>
|
||||||
<VBtn to="/apps">
|
<VBtn to="/apps" :ripple="false">
|
||||||
<VIcon size="28">mdi-dots-horizontal</VIcon>
|
<VIcon size="28">mdi-dots-horizontal</VIcon>
|
||||||
<span>更多</span>
|
<span>更多</span>
|
||||||
</VBtn>
|
</VBtn>
|
||||||
@@ -40,9 +40,13 @@ const appMode = computed(() => {
|
|||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<
|
<
|
||||||
<style lang="scss" scoped>
|
<style lang="scss">
|
||||||
.footer-nav {
|
.footer-nav {
|
||||||
padding-block-end: env(safe-area-inset-bottom);
|
padding-block-end: env(safe-area-inset-bottom);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.footer-nav .v-btn--variant-text .v-btn__overlay {
|
||||||
|
background-color: transparent !important;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -136,7 +136,7 @@ onMounted(() => {
|
|||||||
:items="dataList"
|
:items="dataList"
|
||||||
:style="
|
:style="
|
||||||
appMode
|
appMode
|
||||||
? 'height: calc(100vh - 6rem - env(safe-area-inset-bottom) - 3.5rem)'
|
? 'height: calc(100vh - 7rem - env(safe-area-inset-bottom) - 3.5rem)'
|
||||||
: 'height: calc(100vh - 6rem - env(safe-area-inset-bottom)'
|
: 'height: calc(100vh - 6rem - env(safe-area-inset-bottom)'
|
||||||
"
|
"
|
||||||
>
|
>
|
||||||
|
|||||||
@@ -393,11 +393,10 @@ onMounted(fetchData)
|
|||||||
fixed-header
|
fixed-header
|
||||||
show-select
|
show-select
|
||||||
loading-text="加载中..."
|
loading-text="加载中..."
|
||||||
class="data-table-div"
|
|
||||||
hover
|
hover
|
||||||
:style="
|
:style="
|
||||||
appMode
|
appMode
|
||||||
? 'height: calc(100vh - 14rem - env(safe-area-inset-bottom) - 3.5rem)'
|
? 'height: calc(100vh - 15rem - env(safe-area-inset-bottom) - 3.5rem)'
|
||||||
: 'height: calc(100vh - 14rem - env(safe-area-inset-bottom)'
|
: 'height: calc(100vh - 14rem - env(safe-area-inset-bottom)'
|
||||||
"
|
"
|
||||||
>
|
>
|
||||||
|
|||||||
Reference in New Issue
Block a user