GithubBackup/MoviePilot-Frontend
1
0
Fork 0
mirror of https://github.com/jxxghp/MoviePilot-Frontend.git synced 2026-05-18 04:47:36 +08:00
Code Issues Packages Projects Releases Wiki Activity

Refactor page titles and dialog close buttons across multiple views

Browse Source 
- Replaced instances of `DialogCloseBtn` with `VDialogCloseBtn` in TransferHistoryView, AccountSettingAbout, AccountSettingSystem, and UserProfileView for consistency.
- Introduced a new component `PageContentTitle` to standardize page titles in SiteCardListView, SubscribeListView, UserListView, and WorkflowListView, improving layout and readability.
- Added keyword filtering functionality in SubscribeListView and SubscribeShareView to enhance user experience during searches.
- Added a new site logo image to the assets.
This commit is contained in:
jxxghp
2025-04-15 13:23:56 +08:00
parent 65ebdb61d0
commit e97d815dc3
63 changed files with 347 additions and 232 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/cards/CustomRuleCard.vue
View File

@@ -95,7 +95,7 @@ function onClose() {
<VIcon class="cursor-move" icon="mdi-drag" />
</IconBtn>
</span>
<DialogCloseBtn @click="onClose" />
<VDialogCloseBtn @click="onClose" />
<VCardText class="flex justify-space-between align-center gap-3">
<div class="align-self-start">
<h5 class="text-h6 mb-1">{{ props.rule.name }}</h5>
@@ -106,7 +106,7 @@ function onClose() {
</VCard>
<VDialog v-if="ruleInfoDialog" v-model="ruleInfoDialog" scrollable max-width="40rem" persistent>
<VCard :title="`${props.rule.id} - 配置`" class="rounded-t">
<DialogCloseBtn v-model="ruleInfoDialog" />
<VDialogCloseBtn v-model="ruleInfoDialog" />
<VDivider />
<VCardText>
<VForm>

2
src/components/cards/DirectoryCard.vue
View File

@@ -175,7 +175,7 @@ watch(
<template>
<VCard variant="tonal" :width="props.width" :height="props.height">
<DialogCloseBtn @click="onClose" />
<VDialogCloseBtn @click="onClose" />
<VCardItem>
<VTextField
v-model="props.directory.name"

4
src/components/cards/DownloaderCard.vue
View File

@@ -150,7 +150,7 @@ onUnmounted(() => {
@click="openDownloaderInfoDialog"
:class="{ 'transition transform-cpu duration-300 -translate-y-1': hover.isHovering }"
>
<DialogCloseBtn @click="onClose" />
<VDialogCloseBtn @click="onClose" />
<span class="absolute top-3 right-12">
<IconBtn>
<VIcon class="cursor-move" icon="mdi-drag" />
@@ -181,7 +181,7 @@ onUnmounted(() => {
</VHover>
<VDialog v-if="downloaderInfoDialog" v-model="downloaderInfoDialog" scrollable max-width="40rem" persistent>
<VCard :title="`${props.downloader.name} - 配置`" class="rounded-t">
<DialogCloseBtn v-model="downloaderInfoDialog" />
<VDialogCloseBtn v-model="downloaderInfoDialog" />
<VDivider />
<VCardText>
<VForm>

2
src/components/cards/FilterRuleCard.vue
View File

@@ -47,7 +47,7 @@ onMounted(() => {
<VIcon class="cursor-move" icon="mdi-drag" />
</IconBtn>
</span>
<DialogCloseBtn @click="onClose" />
<VDialogCloseBtn @click="onClose" />
<VCardItem>
<VCardTitle>优先级 {{ props.pri }}</VCardTitle>
<VRow>

4
src/components/cards/FilterRuleGroupCard.vue
View File

@@ -208,7 +208,7 @@ function onClose() {
<VIcon class="cursor-move" icon="mdi-drag" />
</IconBtn>
</span>
<DialogCloseBtn @click="onClose" />
<VDialogCloseBtn @click="onClose" />
<VCardText class="flex justify-space-between align-center gap-3">
<div class="align-self-start">
<h5 class="text-h6 mb-1">{{ props.group.name }}</h5>
@@ -222,7 +222,7 @@ function onClose() {
</VCard>
<VDialog v-if="groupInfoDialog" v-model="groupInfoDialog" scrollable max-width="80rem" persistent>
<VCard :title="`${props.group.name} - 配置`" class="rounded-t">
<DialogCloseBtn v-model="groupInfoDialog" />
<VDialogCloseBtn v-model="groupInfoDialog" />
<VDivider />
<VCardItem class="pt-1">
<VRow class="mt-1">

17
src/components/cards/MediaServerCard.vue
View File

@@ -175,7 +175,7 @@ onMounted(() => {
<template>
<div>
<VCard variant="tonal" @click="openMediaServerInfoDialog">
<DialogCloseBtn @click="onClose" />
<VDialogCloseBtn @click="onClose" />
<VCardText class="flex justify-space-between align-center gap-3">
<div class="align-self-start flex-1">
<div class="text-h6 mb-1">{{ mediaserver.name }}</div>
@@ -190,7 +190,7 @@ onMounted(() => {
</VCard>
<VDialog v-if="mediaServerInfoDialog" v-model="mediaServerInfoDialog" scrollable max-width="40rem" persistent>
<VCard :title="`${props.mediaserver.name} - 配置`" class="rounded-t">
<DialogCloseBtn v-model="mediaServerInfoDialog" />
<VDialogCloseBtn v-model="mediaServerInfoDialog" />
<VDivider />
<VCardText>
<VForm>
@@ -313,19 +313,10 @@ onMounted(() => {
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="mediaServerInfo.config.username"
label="用户名"
active
/>
<VTextField v-model="mediaServerInfo.config.username" label="用户名" active />
</VCol>
<VCol cols="12" md="6">
<VTextField
type="password"
v-model="mediaServerInfo.config.password"
label="密码"
active
/>
<VTextField type="password" v-model="mediaServerInfo.config.password" label="密码" active />
</VCol>
</VRow>
<VRow v-if="mediaServerInfo.type == 'plex'">

4
src/components/cards/NotificationChannelCard.vue
View File

@@ -119,7 +119,7 @@ function onClose() {
<VIcon class="cursor-move" icon="mdi-drag" />
</IconBtn>
</span>
<DialogCloseBtn @click="onClose" />
<VDialogCloseBtn @click="onClose" />
<VCardText class="flex justify-space-between align-center gap-3">
<div class="align-self-start">
<div class="flex items-center">
@@ -133,7 +133,7 @@ function onClose() {
</VCard>
<VDialog v-if="notificationInfoDialog" v-model="notificationInfoDialog" scrollable max-width="40rem" persistent>
<VCard :title="`${props.notification.name} - 配置`" class="rounded-t">
<DialogCloseBtn v-model="notificationInfoDialog" />
<VDialogCloseBtn v-model="notificationInfoDialog" />
<VDivider />
<VCardText>
<VForm>

4
src/components/cards/PluginAppCard.vue
View File

@@ -227,7 +227,7 @@ const dropdownItems = ref([
<!-- 更新日志 -->
<VDialog v-if="releaseDialog" v-model="releaseDialog" width="600" scrollable>
<VCard :title="`${props.plugin?.plugin_name} 更新说明`">
<DialogCloseBtn @click="releaseDialog = false" />
<VDialogCloseBtn @click="releaseDialog = false" />
<VDivider />
<VersionHistory :history="props.plugin?.history" />
</VCard>
@@ -235,7 +235,7 @@ const dropdownItems = ref([
<!-- 插件详情-->
<VDialog v-if="detailDialog" v-model="detailDialog" max-width="30rem">
<VCard>
<DialogCloseBtn @click="detailDialog = false" />
<VDialogCloseBtn @click="detailDialog = false" />
<VCardText>
<VCol>
<div class="d-flex justify-space-between flex-wrap flex-md-nowrap flex-column flex-md-row">

2
src/components/cards/PluginCard.vue
View File

@@ -441,7 +441,7 @@ watch(
<!-- 更新日志 -->
<VDialog v-if="releaseDialog" v-model="releaseDialog" width="600" scrollable>
<VCard :title="`${props.plugin?.plugin_name} 更新说明`">
<DialogCloseBtn @click="releaseDialog = false" />
<VDialogCloseBtn @click="releaseDialog = false" />
<VDivider />
<VersionHistory :history="props.plugin?.history" />
<VDivider />

27
src/components/cards/SiteCard.vue
View File

@@ -1,5 +1,6 @@
<script lang="ts" setup>
import type { PropType } from 'vue'
import noImage from '@images/logos/site.webp'
import { useToast } from 'vue-toast-notification'
import SiteAddEditDialog from '../dialog/SiteAddEditDialog.vue'
import SiteUserDataDialog from '../dialog/SiteUserDataDialog.vue'
@@ -54,6 +55,9 @@ const siteStats = ref<SiteStatistic>({})
async function getSiteIcon() {
try {
siteIcon.value = (await api.get(`site/icon/${cardProps.site?.id}`)).data.icon
if (!siteIcon.value) {
siteIcon.value = noImage
}
} catch (error) {
console.error(error)
}
@@ -212,16 +216,19 @@ onMounted(() => {
<!-- 顶部：图标和站点名称 -->
<div class="flex items-center mb-1">
<!-- 站点图标 -->
<div class="site-icon-container mr-2.5" @click.stop="siteEditDialog = true">
<img :src="siteIcon" class="site-icon" :alt="cardProps.site?.name" />
<div class="site-icon-container mr-2.5">
<VImg :src="siteIcon" class="site-icon" :alt="cardProps.site?.name">
<template #placeholder>
<div class="w-full h-full">
<VSkeletonLoader class="object-cover aspect-w-1 aspect-h-1" />
</div>
</template>
</VImg>
<div class="site-icon-edit-overlay">
<VIcon icon="mdi-pencil" color="white" size="16" />
<VIcon icon="mdi-drag" color="white" size="24" class="cursor-move" />
</div>
</div>
<!-- 拖动图标 -->
<VIcon icon="mdi-drag" size="20" class="drag-handle cursor-move opacity-40 mr-1.5 z-10" />
<!-- 站点名称和特性图标 -->
<div class="flex-1 min-w-0 flex items-center">
<h3 class="site-title truncate">{{ cardProps.site?.name }}</h3>
@@ -245,7 +252,7 @@ onMounted(() => {
</div>
<!-- 中间部分：网址 -->
<div class="site-meta mb-1.5">
<div class="site-meta my-3">
<div class="site-url truncate" @click.stop="openSitePage">
{{ cardProps.site?.url }}
</div>
@@ -366,7 +373,6 @@ onMounted(() => {
.site-card {
position: relative;
overflow: hidden;
border: 1px solid rgba(var(--v-theme-on-surface), 0.09);
border-radius: 10px;
background: rgba(var(--v-theme-surface), 0.95);
cursor: pointer;
@@ -374,7 +380,7 @@ onMounted(() => {
}
.site-card:hover {
border-color: rgba(var(--v-theme-primary), 0.2);
border: 1px solid rgba(var(--v-theme-primary), 0.2);
box-shadow: 0 3px 12px -6px rgba(0, 0, 0, 10%);
transform: translateY(-4px);
}
@@ -393,7 +399,7 @@ onMounted(() => {
.site-status-indicator {
position: absolute;
z-index: 1;
block-size: 2px;
block-size: 4px;
inset-block-start: 0;
inset-inline: 0;
opacity: 0.5;
@@ -643,7 +649,6 @@ onMounted(() => {
/* 数据统计 */
.site-stats {
margin-block-start: auto;
padding-block-start: 1rem;
}
.site-data-values {

3
src/components/cards/UserCard.vue
View File

@@ -288,7 +288,6 @@ onUnmounted(() => {
}
.user-card-admin {
border: 2px solid transparent;
background-clip: content-box, border-box;
background-image: linear-gradient(rgb(var(--v-theme-surface)), rgb(var(--v-theme-surface))),
linear-gradient(120deg, rgba(var(--v-theme-warning), 0.5), rgba(var(--v-theme-error), 0.5));
@@ -318,7 +317,7 @@ onUnmounted(() => {
align-items: center;
inset-block-start: 0;
inset-inline: 0;
padding-block: 4px;
padding-block: 8px;
padding-inline: 12px;
}

2
src/components/dialog/AddDownloadDialog.vue
View File

@@ -125,7 +125,7 @@ onMounted(() => {
<span v-if="title">{{ torrent?.site_name }} - {{ title }}</span>
<span v-else>确认下载</span>
</VCardTitle>
<DialogCloseBtn @click="emit('close')" />
<VDialogCloseBtn @click="emit('close')" />
<VDivider />
<VList lines="one">
<VListItem>

2
src/components/dialog/AlistConfigDialog.vue
View File

@@ -31,7 +31,7 @@ async function savaAlistConfig() {
<template>
<VDialog width="50rem" scrollable max-height="85vh">
<VCard title="AList配置" class="rounded-t">
<DialogCloseBtn @click="emit('close')" />
<VDialogCloseBtn @click="emit('close')" />
<VCardText>
<VRow>
<VCol cols="12">

2
src/components/dialog/AliyunAuthDialog.vue
View File

@@ -86,7 +86,7 @@ onUnmounted(() => {
<template>
<VDialog width="40rem" scrollable max-height="85vh">
<VCard title="阿里云盘登录" class="rounded-t">
<DialogCloseBtn @click="emit('close')" />
<VDialogCloseBtn @click="emit('close')" />
<VCardText class="pt-2 flex flex-col items-center">
<div class="my-6 shadow-lg rounded text-center p-3 border">
<VImg class="mx-auto" :src="qrCodeUrl" width="200" height="200">

2
src/components/dialog/ForkSubscribeDialog.vue
View File

@@ -165,7 +165,7 @@ onMounted(() => {
<template>
<VDialog max-width="40rem" scrollable>
<VCard>
<DialogCloseBtn @click="emit('close')" />
<VDialogCloseBtn @click="emit('close')" />
<VCardText>
<VCol>
<div class="d-flex justify-space-between flex-wrap flex-md-nowrap flex-column flex-md-row">

2
src/components/dialog/ImportCodeDialog.vue
View File

@@ -21,7 +21,7 @@ function handleImport() {
<template>
<VDialog width="40rem" scrollable max-height="85vh" persistent>
<VCard :title="props.title" class="rounded-t">
<DialogCloseBtn @click="emit('close')" />
<VDialogCloseBtn @click="emit('close')" />
<VCardText class="pt-2">
<VTextarea v-model="codeString" />
</VCardText>

2
src/components/dialog/MediaInfoDialog.vue
View File

@@ -13,7 +13,7 @@ const emit = defineEmits(['close'])
<template>
<VDialog max-width="50rem">
<VCard>
<DialogCloseBtn @click="emit('close')" />
<VDialogCloseBtn @click="emit('close')" />
<VCardItem>
<MediaInfoCard :context="context" />
</VCardItem>

2
src/components/dialog/PluginConfigDialog.vue
View File

@@ -92,7 +92,7 @@ onBeforeMount(async () => {
<template>
<VDialog scrollable max-width="60rem" :fullscreen="!display.mdAndUp.value">
<VCard :title="`${props.plugin?.plugin_name} - 配置`" class="rounded-t">
<DialogCloseBtn @click="emit('close')" />
<VDialogCloseBtn @click="emit('close')" />
<VDivider />
<VCardText v-if="isRefreshed">
<FormRender v-for="(item, index) in pluginFormItems" :key="index" :config="item" :model="pluginConfigForm" />

2
src/components/dialog/PluginDataDialog.vue
View File

@@ -43,7 +43,7 @@ onMounted(() => {
<template>
<VDialog scrollable max-width="80rem" :fullscreen="!display.mdAndUp.value">
<VCard :title="`${props.plugin?.plugin_name}`" class="rounded-t">
<DialogCloseBtn @click="emit('close')" />
<VDialogCloseBtn @click="emit('close')" />
<LoadingBanner v-if="!isRefreshed" class="mt-5" />
<VCardText v-else class="min-h-40">
<PageRender @action="loadPluginPage" v-for="(item, index) in pluginPageItems" :key="index" :config="item" />

2
src/components/dialog/PluginMarketSettingDialog.vue
View File

@@ -48,7 +48,7 @@ onMounted(() => {
<VIcon icon="mdi-store-cog" class="me-2" />
插件仓库设置
</VCardTitle>
<DialogCloseBtn @click="emit('close')" />
<VDialogCloseBtn @click="emit('close')" />
</VCardItem>
<VCardText class="pt-2">
<VTextarea

2
src/components/dialog/RcloneConfigDialog.vue
View File

@@ -39,7 +39,7 @@ async function savaRcloneConfig() {
<template>
<VDialog width="50rem" scrollable max-height="85vh">
<VCard title="RClone配置" class="rounded-t">
<DialogCloseBtn @click="emit('close')" />
<VDialogCloseBtn @click="emit('close')" />
<VCardText>
<VRow>
<VCol cols="12">

2
src/components/dialog/ReorganizeDialog.vue
View File

@@ -224,7 +224,7 @@ onUnmounted(() => {
<template>
<VDialog scrollable max-width="45rem" :fullscreen="!display.mdAndUp.value">
<VCard :title="dialogTitle" class="rounded-t">
<DialogCloseBtn @click="emit('close')" />
<VDialogCloseBtn @click="emit('close')" />
<VDivider />
<VCardText>
<VForm @submit.prevent="() => {}">

2
src/components/dialog/SiteAddEditDialog.vue
View File

@@ -148,7 +148,7 @@ onMounted(async () => {
:title="`${props.oper === 'add' ? '新增' : '编辑'}站点${props.oper !== 'add' ? ` - ${siteForm.name}` : ''}`"
class="rounded-t"
>
<DialogCloseBtn @click="emit('close')" />
<VDialogCloseBtn @click="emit('close')" />
<VDivider />
<VCardText>
<VForm @submit.prevent="() => {}">

2
src/components/dialog/SiteCookieUpdateDialog.vue
View File

@@ -70,7 +70,7 @@ async function updateSiteCookie() {
<VDialog max-width="30rem">
<!-- Dialog Content -->
<VCard title="更新站点Cookie & UA">
<DialogCloseBtn @click="emit('close')" />
<VDialogCloseBtn @click="emit('close')" />
<VDivider />
<VCardText>
<VForm @submit.prevent="() => {}">

2
src/components/dialog/SiteUserDataDialog.vue
View File

@@ -285,7 +285,7 @@ onBeforeMount(async () => {
>{{ `数据 - ${props.site?.name}` }}
<IconBtn @click.stop="refreshSiteData" color="info"><VIcon icon="mdi-refresh" /></IconBtn>
</VCardTitle>
<DialogCloseBtn @click="emit('close')" />
<VDialogCloseBtn @click="emit('close')" />
</VCardItem>
<VDivider />
<VCardText class="pt-5">

2
src/components/dialog/SubscribeEditDialog.vue
View File

@@ -370,7 +370,7 @@ onMounted(() => {
class="rounded-t"
>
<VCardText>
<DialogCloseBtn @click="emit('close')" />
<VDialogCloseBtn @click="emit('close')" />
<VForm @submit.prevent="() => {}">
<VTabs v-model="activeTab" show-arrows>
<VTab value="basic">

4
src/components/dialog/SubscribeFilesDialog.vue
View File

@@ -78,7 +78,7 @@ onBeforeMount(() => {
<VDialog scrollable max-width="80rem" :fullscreen="!display.mdAndUp.value">
<VCard class="rounded-t">
<VCardItem class="my-2">
<DialogCloseBtn @click="emit('close')" />
<VDialogCloseBtn @click="emit('close')" />
</VCardItem>
<VCardText>
<div class="media-page">
@@ -237,7 +237,7 @@ onBeforeMount(() => {
.media-overview {
display: flex;
flex-direction: column;
padding-block: 1rem 1rem;
padding-block: 1rem;
}
@media (width >= 1024px) {

2
src/components/dialog/SubscribeHistoryDialog.vue
View File

@@ -138,7 +138,7 @@ const dropdownItems = ref([
<VCardTitle>{{ props.type + '订阅历史' }}</VCardTitle>
</VCardItem>
<VDivider />
<DialogCloseBtn @click="emit('close')" />
<VDialogCloseBtn @click="emit('close')" />
<VList lines="two">
<VInfiniteScroll mode="intersect" side="end" :items="historyList" class="overflow-hidden" @load="loadHistory">
<template #loading>

2
src/components/dialog/SubscribeSeasonDialog.vue
View File

@@ -189,7 +189,7 @@ onMounted(async () => {
<template>
<VBottomSheet inset scrollable>
<VCard class="rounded-t">
<DialogCloseBtn @click="emit('close')" />
<VDialogCloseBtn @click="emit('close')" />
<VCardItem>
<VCardTitle class="pe-10"> 订阅 - {{ props.media?.title }} </VCardTitle>
</VCardItem>

2
src/components/dialog/SubscribeShareDialog.vue
View File

@@ -57,7 +57,7 @@ const $toast = useToast()
class="rounded-t"
>
<VCardText>
<DialogCloseBtn @click="emit('close')" />
<VDialogCloseBtn @click="emit('close')" />
<VForm @submit.prevent="() => {}" class="pt-2">
<VRow>
<VCol cols="12">

2
src/components/dialog/TransferQueueDialog.vue
View File

@@ -140,7 +140,7 @@ onUnmounted(() => {
<VCardItem>
<VCardTitle>整理队列</VCardTitle>
</VCardItem>
<DialogCloseBtn @click="emit('close')" />
<VDialogCloseBtn @click="emit('close')" />
<VDivider />
<VProgressLinear
v-if="dataList.length > 0 && progressValue > 0"

2
src/components/dialog/U115AuthDialog.vue
View File

@@ -93,7 +93,7 @@ onUnmounted(() => {
<template>
<VDialog width="40rem" scrollable max-height="85vh">
<VCard title="115网盘登录" class="rounded-t">
<DialogCloseBtn @click="emit('close')" />
<VDialogCloseBtn @click="emit('close')" />
<VCardText class="pt-2 flex flex-col items-center">
<div class="my-6 shadow-lg rounded text-center p-3 border">
<QrcodeVue class="mx-auto" :value="qrCodeContent" :size="200" />

2
src/components/dialog/UserAddEditDialog.vue
View File

@@ -291,7 +291,7 @@ onMounted(() => {
:title="`${props.oper === 'add' ? '新增' : '编辑'}用户${props.oper !== 'add' ? ` - ${userName}` : ''}`"
class="rounded-t"
>
<DialogCloseBtn @click="emit('close')" />
<VDialogCloseBtn @click="emit('close')" />
<VDivider />
<VCardItem>
<!-- 👉 Avatar -->

2
src/components/dialog/UserAuthDialog.vue
View File

@@ -131,7 +131,7 @@ onMounted(async () => {
<template>
<VDialog width="40rem" max-height="85vh">
<VCard title="用户认证" class="rounded-t">
<DialogCloseBtn @click="emit('close')" />
<VDialogCloseBtn @click="emit('close')" />
<VCardText>
<VRow>
<VCol cols="12">

2
src/components/dialog/WorkflowAddEditDialog.vue
View File

@@ -81,7 +81,7 @@ async function editWorkflow() {
<template>
<VDialog scrollable :close-on-back="false" eager max-width="30rem" :fullscreen="!display.mdAndUp.value">
<VCard :title="`${title}任务`" class="rounded-t">
<DialogCloseBtn @click="emit('close')" />
<VDialogCloseBtn @click="emit('close')" />
<VDivider />
<VCardText>
<VForm @submit.prevent="() => {}">

2
src/components/filebrowser/FileList.vue
View File

@@ -688,7 +688,7 @@ onMounted(() => {
<!-- 重命名弹窗 -->
<VDialog v-if="renamePopper" v-model="renamePopper" max-width="35rem">
<VCard title="重命名">
<DialogCloseBtn @click="renamePopper = false" />
<VDialogCloseBtn @click="renamePopper = false" />
<VDivider />
<VCardText>
<VRow>

2
src/components/filebrowser/FileToolbar.vue
View File

@@ -168,7 +168,7 @@ const sortIcon = computed(() => {
</IconBtn>
</template>
<VCard title="新建文件夹">
<DialogCloseBtn @click="newFolderPopper = false" />
<VDialogCloseBtn @click="newFolderPopper = false" />
<VDivider />
<VCardText>
<VTextField v-model="newFolderName" label="名称" />

2
src/components/misc/MediaIdSelector.vue
View File

@@ -103,7 +103,7 @@ onMounted(() => {
@keydown.enter="searchMedias"
/>
</VToolbar>
<DialogCloseBtn
<VDialogCloseBtn
@click="
() => {
emit('close')