fix: 关闭移动端剧本标题悬浮提示
This commit is contained in:
@@ -1,5 +1,5 @@
|
||||
<script setup lang="ts">
|
||||
import { computed, inject, onScopeDispose, provide, watchEffect } from 'vue'
|
||||
import { computed, inject, onScopeDispose, provide, ref, watchEffect } from 'vue'
|
||||
import { useRoute, useRouter } from 'vue-router'
|
||||
import { NScrollbar, NAlert, NButton, NPageHeader, NSpin, NEllipsis } from 'naive-ui'
|
||||
import { EmptyState } from '../../components/ui'
|
||||
@@ -11,6 +11,15 @@ import { isProjectComplete, projectAccessKey, type ProjectAccess } from './acces
|
||||
const route = useRoute()
|
||||
const router = useRouter()
|
||||
const id = computed(() => String(route.params.projectId))
|
||||
/** 移动端标题只截断,不弹悬浮提示;跟随视口变化并在卸载时清理监听。 */
|
||||
const mobileMedia = window.matchMedia('(max-width: 760px)')
|
||||
const isMobile = ref(mobileMedia.matches)
|
||||
function syncMobile() {
|
||||
isMobile.value = mobileMedia.matches
|
||||
}
|
||||
mobileMedia.addEventListener('change', syncMobile)
|
||||
onScopeDispose(() => mobileMedia.removeEventListener('change', syncMobile))
|
||||
|
||||
// 图库使用手动刷新,父布局也停止轮询,避免浏览素材时被周期性更新打断。
|
||||
const isGallery = computed(() => route.path.replace(/\/+$/, '').endsWith('/subject-images'))
|
||||
const context = useProjectData(
|
||||
@@ -36,7 +45,7 @@ onScopeDispose(() => {
|
||||
<header class="project-header">
|
||||
<NPageHeader @back="router.push('/projects')">
|
||||
<template #title
|
||||
><NEllipsis class="project-title">{{
|
||||
><NEllipsis :key="isMobile ? 'mobile' : 'desktop'" class="project-title" :tooltip="!isMobile">{{
|
||||
context.project.value?.title || context.project.value?.topic || '读取项目'
|
||||
}}</NEllipsis></template
|
||||
>
|
||||
|
||||
Reference in New Issue
Block a user