fix Teleport

This commit is contained in:
jxxghp
2025-07-07 17:24:58 +08:00
parent 3cfe27b7b3
commit cd9eaf4fd7
12 changed files with 47 additions and 27 deletions
+2 -2
View File
@@ -51,8 +51,8 @@ onUnmounted(() => {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 16px; gap: 16px;
inset-block-end: 30px; inset-block-end: 2rem;
inset-inline-end: 30px; inset-inline-end: 2rem;
} }
.global-action-button { .global-action-button {
+3 -1
View File
@@ -34,6 +34,8 @@ function getApiPath(paths: string[] | string) {
<VPageContentTitle :title="title" /> <VPageContentTitle :title="title" />
<PersonCardListView v-if="type === 'person'" :apipath="getApiPath(props.paths || '')" :params="route.query" /> <PersonCardListView v-if="type === 'person'" :apipath="getApiPath(props.paths || '')" :params="route.query" />
<MediaCardListView v-else :apipath="getApiPath(props.paths || '')" :params="route.query" /> <MediaCardListView v-else :apipath="getApiPath(props.paths || '')" :params="route.query" />
<VScrollToTopBtn /> <Teleport to="body" v-if="route.path === '/browse'">
<VScrollToTopBtn />
</Teleport>
</div> </div>
</template> </template>
+4 -1
View File
@@ -19,6 +19,9 @@ const display = useDisplay()
// PWA模式检测 // PWA模式检测
const { appMode } = usePWA() const { appMode } = usePWA()
// 路由
const route = useRoute()
// 从用户 Store 中获取superuser信息 // 从用户 Store 中获取superuser信息
const superUser = useUserStore().superUser const superUser = useUserStore().superUser
@@ -353,7 +356,7 @@ onDeactivated(() => {
</draggable> </draggable>
<!-- 底部操作按钮只在非移动设备上显示 --> <!-- 底部操作按钮只在非移动设备上显示 -->
<Teleport to="body"> <Teleport to="body" v-if="route.path === '/dashboard'">
<VFab <VFab
v-if="!appMode" v-if="!appMode"
icon="mdi-view-dashboard-edit" icon="mdi-view-dashboard-edit"
+6 -5
View File
@@ -16,6 +16,9 @@ const display = useDisplay()
// 国际化 // 国际化
const { t } = useI18n() const { t } = useI18n()
// 路由
const route = useRoute()
const activeTab = ref('') const activeTab = ref('')
// 本地存储键值 // 本地存储键值
@@ -151,10 +154,6 @@ onBeforeMount(async () => {
} }
}) })
onActivated(async () => { onActivated(async () => {
await loadExtraDiscoverSources() await loadExtraDiscoverSources()
sortSubscribeOrder() sortSubscribeOrder()
@@ -246,7 +245,9 @@ onActivated(async () => {
</VCard> </VCard>
</VDialog> </VDialog>
<!-- 快速滚动到顶部按钮 --> <!-- 快速滚动到顶部按钮 -->
<VScrollToTopBtn /> <Teleport to="body" v-if="route.path === '/discover'">
<VScrollToTopBtn />
</Teleport>
</div> </div>
</template> </template>
<style lang="scss" scoped> <style lang="scss" scoped>
+6 -1
View File
@@ -11,6 +11,9 @@ const display = useDisplay()
// 国际化 // 国际化
const { t } = useI18n() const { t } = useI18n()
// 路由
const route = useRoute()
// 当前选择的分类 // 当前选择的分类
const currentCategory = ref(t('recommend.all')) const currentCategory = ref(t('recommend.all'))
@@ -300,7 +303,9 @@ onActivated(async () => {
</VDialog> </VDialog>
<!-- 快速滚动到顶部按钮 --> <!-- 快速滚动到顶部按钮 -->
<VScrollToTopBtn /> <Teleport to="body" v-if="route.path === '/recommend'">
<VScrollToTopBtn />
</Teleport>
</div> </div>
</template> </template>
+4 -3
View File
@@ -92,7 +92,7 @@ const progressSSE = useProgressSSE(
`${import.meta.env.VITE_API_BASE_URL}system/progress/search`, `${import.meta.env.VITE_API_BASE_URL}system/progress/search`,
handleProgressMessage, handleProgressMessage,
'resource-search-progress', 'resource-search-progress',
progressActive progressActive,
) )
// 使用SSE监听加载进度 // 使用SSE监听加载进度
@@ -288,7 +288,9 @@ onUnmounted(() => {
<!-- 初始加载状态 --> <!-- 初始加载状态 -->
<LoadingBanner v-else-if="!isRefreshed && !(progressEnabled || progressValue > 0)" /> <LoadingBanner v-else-if="!isRefreshed && !(progressEnabled || progressValue > 0)" />
<!-- 滚动到顶部按钮 --> <!-- 滚动到顶部按钮 -->
<VScrollToTopBtn /> <Teleport to="body" v-if="route.path === '/resource'">
<VScrollToTopBtn />
</Teleport>
</div> </div>
</template> </template>
@@ -300,7 +302,6 @@ onUnmounted(() => {
justify-content: center; justify-content: center;
inset-block-start: env(safe-area-inset-top); inset-block-start: env(safe-area-inset-top);
inset-inline: 0; inset-inline: 0;
padding-block-start: 4rem;
} }
.search-progress-card { .search-progress-card {
+5 -5
View File
@@ -1526,9 +1526,9 @@ function onDragStartPlugin(evt: any) {
</VWindow> </VWindow>
</div> </div>
<div v-if="isRefreshed"> <!-- 插件搜索图标 -->
<!-- 插件搜索图标 --> <Teleport to="body" v-if="route.path === '/plugins'">
<Teleport to="body"> <div v-if="isRefreshed">
<VFab <VFab
v-if="!appMode" v-if="!appMode"
icon="mdi-magnify" icon="mdi-magnify"
@@ -1541,8 +1541,8 @@ function onDragStartPlugin(evt: any) {
@click="SearchDialog = true" @click="SearchDialog = true"
:class="{ 'mb-12': appMode }" :class="{ 'mb-12': appMode }"
/> />
</Teleport> </div>
</div> </Teleport>
<!-- 插件市场设置窗口 --> <!-- 插件市场设置窗口 -->
<PluginMarketSettingDialog <PluginMarketSettingDialog
v-if="MarketSettingDialog" v-if="MarketSettingDialog"
+1 -1
View File
@@ -700,7 +700,7 @@ onMounted(() => {
</VCard> </VCard>
<!-- 底部操作按钮 --> <!-- 底部操作按钮 -->
<Teleport to="body"> <Teleport to="body" v-if="route.path === '/history'">
<div v-if="isRefreshed && selected.length > 0"> <div v-if="isRefreshed && selected.length > 0">
<VFab <VFab
icon="mdi-trash-can-outline" icon="mdi-trash-can-outline"
+4 -1
View File
@@ -13,6 +13,9 @@ import { usePWA } from '@/composables/usePWA'
// 国际化 // 国际化
const { t } = useI18n() const { t } = useI18n()
// 路由
const route = useRoute()
// APP // APP
const display = useDisplay() const display = useDisplay()
// PWA模式检测 // PWA模式检测
@@ -302,7 +305,7 @@ useDynamicButton({
:error-description="filterOption === 'all' ? t('site.sitesWillBeShownHere') : t('common.tryChangingFilters')" :error-description="filterOption === 'all' ? t('site.sitesWillBeShownHere') : t('common.tryChangingFilters')"
/> />
<!-- 新增站点按钮 --> <!-- 新增站点按钮 -->
<Teleport to="body"> <Teleport to="body" v-if="route.path === '/site'">
<VFab <VFab
v-if="isRefreshed && !appMode" v-if="isRefreshed && !appMode"
icon="mdi-web-plus" icon="mdi-web-plus"
+4 -4
View File
@@ -6,7 +6,6 @@ import NoDataFound from '@/components/NoDataFound.vue'
import SubscribeCard from '@/components/cards/SubscribeCard.vue' import SubscribeCard from '@/components/cards/SubscribeCard.vue'
import SubscribeHistoryDialog from '@/components/dialog/SubscribeHistoryDialog.vue' import SubscribeHistoryDialog from '@/components/dialog/SubscribeHistoryDialog.vue'
import { useUserStore } from '@/stores' import { useUserStore } from '@/stores'
import { useDisplay } from 'vuetify'
import { useDynamicButton } from '@/composables/useDynamicButton' import { useDynamicButton } from '@/composables/useDynamicButton'
import { useI18n } from 'vue-i18n' import { useI18n } from 'vue-i18n'
import { usePWA } from '@/composables/usePWA' import { usePWA } from '@/composables/usePWA'
@@ -14,8 +13,9 @@ import { usePWA } from '@/composables/usePWA'
// 国际化 // 国际化
const { t } = useI18n() const { t } = useI18n()
// APP // 路由
const display = useDisplay() const route = useRoute()
// PWA模式检测 // PWA模式检测
const { appMode } = usePWA() const { appMode } = usePWA()
@@ -183,7 +183,7 @@ useDynamicButton({
:error-description="keyword ? t('subscribe.noFilterData') : t('subscribe.noSubscribeData')" :error-description="keyword ? t('subscribe.noFilterData') : t('subscribe.noSubscribeData')"
/> />
<!-- 底部操作按钮 --> <!-- 底部操作按钮 -->
<Teleport to="body"> <Teleport to="body" v-if="route.path === '/subscribe'">
<div v-if="isRefreshed"> <div v-if="isRefreshed">
<VFab <VFab
v-if="userStore.superUser && !appMode" v-if="userStore.superUser && !appMode"
+4 -1
View File
@@ -11,6 +11,9 @@ import { usePWA } from '@/composables/usePWA'
// 国际化 // 国际化
const { t } = useI18n() const { t } = useI18n()
// 路由
const route = useRoute()
// PWA模式检测 // PWA模式检测
const { appMode } = usePWA() const { appMode } = usePWA()
@@ -95,7 +98,7 @@ useDynamicButton({
</div> </div>
<!-- 新增用户按钮 --> <!-- 新增用户按钮 -->
<Teleport to="body"> <Teleport to="body" v-if="route.path === '/user'">
<VFab <VFab
v-if="isRefreshed && !appMode" v-if="isRefreshed && !appMode"
icon="mdi-account-plus" icon="mdi-account-plus"
+4 -2
View File
@@ -11,7 +11,9 @@ import { usePWA } from '@/composables/usePWA'
// 国际化 // 国际化
const { t } = useI18n() const { t } = useI18n()
// APP // 路由
const route = useRoute()
// PWA模式检测 // PWA模式检测
const { appMode } = usePWA() const { appMode } = usePWA()
@@ -72,7 +74,7 @@ useDynamicButton({
</div> </div>
<!-- 新增按钮 --> <!-- 新增按钮 -->
<Teleport to="body"> <Teleport to="body" v-if="route.path === '/workflow'">
<VFab <VFab
v-if="isRefreshed && !appMode" v-if="isRefreshed && !appMode"
icon="mdi-plus" icon="mdi-plus"