GithubBackup/MoviePilot-Frontend
1
0
Fork 0
mirror of https://github.com/jxxghp/MoviePilot-Frontend.git synced 2026-09-07 08:46:40 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix：大量tooltip对象

Browse Source
This commit is contained in:
jxxghp
2025-04-11 15:20:36 +08:00
parent 96a0ce8c5f
commit 16d62642f6
6 changed files with 82 additions and 173 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/cards/SiteCard.vue
+54 -98
View File
@@ -228,41 +228,18 @@ onMounted(() => {
<!-- 站点特性图标 --> <!-- 站点特性图标 -->
<div class="site-features flex items-center gap-1 ml-auto"> <div class="site-features flex items-center gap-1 ml-auto">
<VTooltip> <div v-if="cardProps.site?.limit_interval" class="feature-icon-wrapper">
<template #activator="{ props }"> <VIcon icon="mdi-speedometer" size="16" class="site-feature-icon" />
<div v-if="cardProps.site?.limit_interval" v-bind="props" class="feature-icon-wrapper"> </div>
<VIcon icon="mdi-speedometer" size="16" class="site-feature-icon" /> <div v-if="cardProps.site?.proxy === 1" class="feature-icon-wrapper">
</div> <VIcon icon="mdi-network-outline" size="16" class="site-feature-icon" />
</template> </div>
<span>流控</span> <div v-if="cardProps.site?.render === 1" class="feature-icon-wrapper">
</VTooltip> <VIcon icon="mdi-apple-safari" size="16" class="site-feature-icon" />
</div>
<VTooltip> <div v-if="cardProps.site?.filter" class="feature-icon-wrapper">
<template #activator="{ props }"> <VIcon icon="mdi-filter-cog-outline" size="16" class="site-feature-icon" />
<div v-if="cardProps.site?.proxy === 1" v-bind="props" class="feature-icon-wrapper"> </div>
<VIcon icon="mdi-network-outline" size="16" class="site-feature-icon" />
</div>
</template>
<span>代理</span>
</VTooltip>
<VTooltip>
<template #activator="{ props }">
<div v-if="cardProps.site?.render === 1" v-bind="props" class="feature-icon-wrapper">
<VIcon icon="mdi-apple-safari" size="16" class="site-feature-icon" />
</div>
</template>
<span>仿真</span>
</VTooltip>
<VTooltip>
<template #activator="{ props }">
<div v-if="cardProps.site?.filter" v-bind="props" class="feature-icon-wrapper">
<VIcon icon="mdi-filter-cog-outline" size="16" class="site-feature-icon" />
</div>
</template>
<span>过滤</span>
</VTooltip>
</div> </div>
</div> </div>
</div> </div>
@@ -309,69 +286,48 @@ onMounted(() => {
<!-- 右侧操作按钮区 --> <!-- 右侧操作按钮区 -->
<div class="site-card-actions"> <div class="site-card-actions">
<VTooltip> <IconBtn
<template #activator="{ props }"> elevation="0"
<IconBtn class="site-action-btn test-btn"
v-bind="props" @click.stop="testSite"
elevation="0" :class="{ 'testing': testButtonDisable }"
class="site-action-btn test-btn" >
@click.stop="testSite" <div class="test-btn-content">
:class="{ 'testing': testButtonDisable }" <div class="pulse-dot" :class="statColor"></div>
> </div>
<div class="test-btn-content"> <div v-if="testButtonDisable" class="loading-overlay">
<div class="pulse-dot" :class="statColor"></div> <div class="loading-spinner">
</div> <div class="spinner-circle"></div>
<div v-if="testButtonDisable" class="loading-overlay"> <div class="spinner-circle-dot"></div>
<div class="loading-spinner"> </div>
<div class="spinner-circle"></div> <span class="loading-text">测试中</span>
<div class="spinner-circle-dot"></div> </div>
</div> </IconBtn>
<span class="loading-text">测试中</span> <IconBtn elevation="0" class="site-action-btn" @click.stop="handleSiteUserData">
</div> <VIcon icon="mdi-chart-bell-curve" size="18" />
</IconBtn> </IconBtn>
</template> <IconBtn elevation="0" class="site-action-btn" @click.stop="handleSiteUpdate">
<span>测试站点连通性</span> <VIcon icon="mdi-refresh" size="18" />
</VTooltip> </IconBtn>
<VTooltip v-if="!cardProps.site?.public"> <IconBtn elevation="0" class="site-action-btn more-btn">
<template #activator="{ props }"> <VIcon icon="mdi-dots-vertical" size="18" />
<IconBtn v-bind="props" elevation="0" class="site-action-btn" @click.stop="handleSiteUserData"> <VMenu activator="parent" close-on-content-click location="left">
<VIcon icon="mdi-chart-bell-curve" size="18" /> <VList density="compact" nav class="dropdown-menu">
</IconBtn> <VListItem @click="siteEditDialog = true" base-color="info">
</template> <template #prepend>
<span>查看站点数据</span> <VIcon icon="mdi-file-edit-outline" size="small" />
</VTooltip> </template>
<VTooltip v-if="!cardProps.site?.public"> <VListItemTitle>编辑站点</VListItemTitle>
<template #activator="{ props }"> </VListItem>
<IconBtn v-bind="props" elevation="0" class="site-action-btn" @click.stop="handleSiteUpdate"> <VListItem @click="deleteSiteInfo">
<VIcon icon="mdi-refresh" size="18" /> <template #prepend>
</IconBtn> <VIcon icon="mdi-delete-outline" size="small" color="error" />
</template> </template>
<span>更新Cookie/UA</span> <VListItemTitle class="text-error">删除站点</VListItemTitle>
</VTooltip> </VListItem>
<VTooltip> </VList>
<template #activator="{ props }"> </VMenu>
<IconBtn v-bind="props" elevation="0" class="site-action-btn more-btn"> </IconBtn>
<VIcon icon="mdi-dots-vertical" size="18" />
<VMenu activator="parent" close-on-content-click location="left">
<VList density="compact" nav class="dropdown-menu">
<VListItem @click="siteEditDialog = true" base-color="info">
<template #prepend>
<VIcon icon="mdi-file-edit-outline" size="small" />
</template>
<VListItemTitle>编辑站点</VListItemTitle>
</VListItem>
<VListItem @click="deleteSiteInfo">
<template #prepend>
<VIcon icon="mdi-delete-outline" size="small" color="error" />
</template>
<VListItemTitle class="text-error">删除站点</VListItemTitle>
</VListItem>
</VList>
</VMenu>
</IconBtn>
</template>
<span>更多操作</span>
</VTooltip>
</div> </div>
</VCard> </VCard>
src/components/cards/UserCard.vue
-2
View File
@@ -216,7 +216,6 @@ onUnmounted(() => {
class="action-btn" class="action-btn"
> >
<VIcon icon="mdi-pencil" /> <VIcon icon="mdi-pencil" />
<VTooltip v-if="!isMobile" activator="parent" location="bottom">编辑用户</VTooltip>
</VBtn> </VBtn>
<VBtn <VBtn
@@ -229,7 +228,6 @@ onUnmounted(() => {
class="action-btn" class="action-btn"
> >
<VIcon icon="mdi-delete" /> <VIcon icon="mdi-delete" />
<VTooltip v-if="!isMobile" activator="parent" location="bottom">删除用户</VTooltip>
</VBtn> </VBtn>
</div> </div>
</div> </div>
src/components/dialog/WorkflowActionsDialog.vue
-3
View File
@@ -207,15 +207,12 @@ const isMacOS = computed(() => {
<VToolbarItems> <VToolbarItems>
<VBtn icon variant="text" @click="importCodeDialog = true" class="ms-2"> <VBtn icon variant="text" @click="importCodeDialog = true" class="ms-2">
<VIcon size="24" color="white" icon="mdi-import" /> <VIcon size="24" color="white" icon="mdi-import" />
<VTooltip activator="parent" location="bottom">导入流程代码</VTooltip>
</VBtn> </VBtn>
<VBtn icon variant="text" @click="shareWorkflow" class="ms-2"> <VBtn icon variant="text" @click="shareWorkflow" class="ms-2">
<VIcon size="24" color="white" icon="mdi-share" /> <VIcon size="24" color="white" icon="mdi-share" />
<VTooltip activator="parent" location="bottom">分享流程代码</VTooltip>
</VBtn> </VBtn>
<VBtn icon variant="text" @click="updateWorkflow" class="ms-2 me-3"> <VBtn icon variant="text" @click="updateWorkflow" class="ms-2 me-3">
<VIcon size="24" color="white" icon="mdi-content-save" /> <VIcon size="24" color="white" icon="mdi-content-save" />
<VTooltip activator="parent" location="bottom">保存流程</VTooltip>
</VBtn> </VBtn>
</VToolbarItems> </VToolbarItems>
</VToolbar> </VToolbar>
src/components/filebrowser/FileList.vue
+15 -35
View File
@@ -656,41 +656,21 @@ onMounted(() => {
</VMenu> </VMenu>
</IconBtn> </IconBtn>
<span v-if="hover.isHovering && display.mdAndUp.value && !selectMode" class="flex"> <span v-if="hover.isHovering && display.mdAndUp.value && !selectMode" class="flex">
<VTooltip text="识别"> <IconBtn @click.stop="recognize(item.path)">
<template #activator="{ props }"> <VIcon icon="mdi-text-recognition" />
<IconBtn v-bind="props" @click.stop="recognize(item.path)"> </IconBtn>
<VIcon icon="mdi-text-recognition" /> <IconBtn @click.stop="scrape(item)">
</IconBtn> <VIcon icon="mdi-auto-fix" />
</template> </IconBtn>
</VTooltip> <IconBtn @click.stop="showRenmae(item)">
<VTooltip text="刮削"> <VIcon icon="mdi-rename" />
<template #activator="{ props }"> </IconBtn>
<IconBtn v-bind="props" @click.stop="scrape(item)"> <IconBtn @click.stop="showTransfer(item)">
<VIcon icon="mdi-auto-fix" /> <VIcon icon="mdi-folder-arrow-right" />
</IconBtn> </IconBtn>
</template> <IconBtn @click.stop="deleteItem(item)">
</VTooltip> <VIcon icon="mdi-delete-outline" color="error" />
<VTooltip text="重命名"> </IconBtn>
<template #activator="{ props }">
<IconBtn v-bind="props" @click.stop="showRenmae(item)">
<VIcon icon="mdi-rename" />
</IconBtn>
</template>
</VTooltip>
<VTooltip text="整理">
<template #activator="{ props }">
<IconBtn v-bind="props" @click.stop="showTransfer(item)">
<VIcon icon="mdi-folder-arrow-right" />
</IconBtn>
</template>
</VTooltip>
<VTooltip text="删除">
<template #activator="{ props }">
<IconBtn v-bind="props" @click.stop="deleteItem(item)">
<VIcon icon="mdi-delete-outline" color="error" />
</IconBtn>
</template>
</VTooltip>
</span> </span>
</template> </template>
</VListItem> </VListItem>
src/components/filebrowser/FileNavigator.vue
+4 -14
View File
@@ -313,14 +313,9 @@ function getIndentLevel(path: string, ancestorPath: string) {
:color="currentPath === directory.path ? 'primary' : 'amber-darken-1'" :color="currentPath === directory.path ? 'primary' : 'amber-darken-1'"
class="me-1" class="me-1"
/> />
<VTooltip :disabled="directory.name.length <= 18"> <span class="folder-name">
<template #activator="{ props: tooltipProps }">
<span class="folder-name" v-bind="tooltipProps">
{{ directory.name }}
</span>
</template>
{{ directory.name }} {{ directory.name }}
</VTooltip> </span>
</div> </div>
</div> </div>
@@ -367,14 +362,9 @@ function getIndentLevel(path: string, ancestorPath: string) {
:color="currentPath === item.dir.path ? 'primary' : 'amber-darken-1'" :color="currentPath === item.dir.path ? 'primary' : 'amber-darken-1'"
class="me-1" class="me-1"
/> />
<VTooltip :disabled="item.dir.name.length <= 18"> <span class="folder-name">
<template #activator="{ props: tooltipProps }">
<span class="folder-name" v-bind="tooltipProps">
{{ item.dir.name }}
</span>
</template>
{{ item.dir.name }} {{ item.dir.name }}
</VTooltip> </span>
</div> </div>
</div> </div>
</div> </div>
src/components/filebrowser/FileToolbar.vue
+9 -21
View File
@@ -119,7 +119,7 @@ const sortIcon = computed(() => {
<VToolbarItems class="overflow-hidden"> <VToolbarItems class="overflow-hidden">
<VMenu v-if="inProps.storages?.length || 0 > 1" offset-y> <VMenu v-if="inProps.storages?.length || 0 > 1" offset-y>
<template #activator="{ props }"> <template #activator="{ props }">
<VBtn v-bind="props"> <VBtn>
<VIcon icon="mdi-arrow-down-drop-circle-outline" /> <VIcon icon="mdi-arrow-down-drop-circle-outline" />
</VBtn> </VBtn>
</template> </template>
@@ -155,28 +155,16 @@ const sortIcon = computed(() => {
</template> </template>
</VToolbarItems> </VToolbarItems>
<div class="flex-grow-1" /> <div class="flex-grow-1" />
<VTooltip text="调整排序"> <IconBtn @click="changeSort">
<template #activator="{ props }"> <VIcon :icon="sortIcon" />
<IconBtn v-bind="props" @click="changeSort"> </IconBtn>
<VIcon :icon="sortIcon" /> <IconBtn @click="goUp">
</IconBtn> <VIcon icon="mdi-arrow-up-bold-outline" />
</template> </IconBtn>
</VTooltip>
<VTooltip text="返回上一级" v-if="pathSegments.length > 0">
<template #activator="{ props }">
<IconBtn v-bind="props" @click="goUp">
<VIcon icon="mdi-arrow-up-bold-outline" />
</IconBtn>
</template>
</VTooltip>
<VDialog v-model="newFolderPopper" max-width="50rem"> <VDialog v-model="newFolderPopper" max-width="50rem">
<template #activator="{ props }"> <template #activator="{ props }">
<IconBtn v-bind="props"> <IconBtn>
<VTooltip text="新建文件夹"> <VIcon v-bind="_props" icon="mdi-folder-plus-outline" />
<template #activator="{ props: _props }">
<VIcon v-bind="_props" icon="mdi-folder-plus-outline" />
</template>
</VTooltip>
</IconBtn> </IconBtn>
</template> </template>
<VCard title="新建文件夹"> <VCard title="新建文件夹">