将vue-toast-notification替换为vue-toastification，并更新相关样式和依赖项

src/components/cards/CustomRuleCard.vue

@@ -1,6 +1,6 @@
 <script lang="ts" setup>
 import { CustomRule } from '@/api/types'
-import { useToast } from 'vue-toast-notification'
+import { useToast } from 'vue-toastification'
 import filter_svg from '@images/svg/filter.svg'
 import { cloneDeep } from 'lodash-es'
 import { innerFilterRules } from '@/api/constants'

src/components/cards/DownloaderCard.vue

@@ -2,7 +2,7 @@
 import api from '@/api'
 import { formatFileSize } from '@/@core/utils/formatters'
 import { DownloaderConf } from '@/api/types'
-import { useToast } from 'vue-toast-notification'
+import { useToast } from 'vue-toastification'
 import type { DownloaderInfo } from '@/api/types'
 import qbittorrent_image from '@images/logos/qbittorrent.png'
 import transmission_image from '@images/logos/transmission.png'

src/components/cards/FilterRuleGroupCard.vue

@@ -3,7 +3,7 @@ import draggable from 'vuedraggable'
 import { copyToClipboard } from '@/@core/utils/navigator'
 import { CustomRule, FilterRuleGroup } from '@/api/types'
 import FilterRuleCard from '@/components/cards/FilterRuleCard.vue'
-import { useToast } from 'vue-toast-notification'
+import { useToast } from 'vue-toastification'
 import ImportCodeDialog from '@/components/dialog/ImportCodeDialog.vue'
 import filter_group_svg from '@images/svg/filter-group.svg'
 import { cloneDeep } from 'lodash-es'

src/components/cards/MediaCard.vue

@@ -4,7 +4,7 @@ import tmdbImage from '@images/logos/tmdb.png'
 import doubanImage from '@images/logos/douban-black.png'
 import bangumiImage from '@images/logos/bangumi.png'
 import api from '@/api'
-import { useToast } from 'vue-toast-notification'
+import { useToast } from 'vue-toastification'
 import { formatSeason, formatRating } from '@/@core/utils/formatters'
 import { doneNProgress, startNProgress } from '@/api/nprogress'
 import type { MediaInfo, Subscribe, MediaSeason, Site } from '@/api/types'

src/components/cards/MediaServerCard.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { MediaServerConf, MediaServerLibrary, MediaStatistic } from '@/api/types'
-import { useToast } from 'vue-toast-notification'
+import { useToast } from 'vue-toastification'
 import emby_image from '@images/logos/emby.png'
 import jellyfin_image from '@images/logos/jellyfin.png'
 import plex_image from '@images/logos/plex.png'

src/components/cards/NotificationChannelCard.vue

@@ -7,7 +7,7 @@ import synologychat_image from '@images/logos/synologychat.png'
 import slack_image from '@images/logos/slack.webp'
 import chrome_image from '@images/logos/chrome.png'
 import custom_image from '@images/logos/notification.png'
-import { useToast } from 'vue-toast-notification'
+import { useToast } from 'vue-toastification'
 import { cloneDeep } from 'lodash-es'
 import { useI18n } from 'vue-i18n'
 import { useDisplay } from 'vuetify'

src/components/cards/PluginAppCard.vue

@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import { useToast } from 'vue-toast-notification'
+import { useToast } from 'vue-toastification'
 import VersionHistory from '../misc/VersionHistory.vue'
 import api from '@/api'
 import type { Plugin } from '@/api/types'

src/components/cards/PluginCard.vue

@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import { useToast } from 'vue-toast-notification'
+import { useToast } from 'vue-toastification'
 import { useConfirm } from '@/composables/useConfirm'
 import api from '@/api'
 import type { Plugin } from '@/api/types'

src/components/cards/PluginFolderCard.vue

@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import { useToast } from 'vue-toast-notification'
+import { useToast } from 'vue-toastification'
 import { useConfirm } from '@/composables/useConfirm'
 import { useI18n } from 'vue-i18n'
 import { useDisplay } from 'vuetify'

src/components/cards/SiteCard.vue

@@ -1,7 +1,7 @@
 <script lang="ts" setup>
 import type { PropType } from 'vue'
 import noImage from '@images/logos/site.webp'
-import { useToast } from 'vue-toast-notification'
+import { useToast } from 'vue-toastification'
 import { useI18n } from 'vue-i18n'
 import SiteAddEditDialog from '../dialog/SiteAddEditDialog.vue'
 import SiteUserDataDialog from '../dialog/SiteUserDataDialog.vue'

src/components/cards/StorageCard.vue

@@ -12,7 +12,7 @@ import AliyunAuthDialog from '../dialog/AliyunAuthDialog.vue'
 import U115AuthDialog from '../dialog/U115AuthDialog.vue'
 import RcloneConfigDialog from '../dialog/RcloneConfigDialog.vue'
 import AlistConfigDialog from '../dialog/AlistConfigDialog.vue'
-import { useToast } from 'vue-toast-notification'
+import { useToast } from 'vue-toastification'
 import { isNullOrEmptyObject } from '@/@core/utils'
 import { useI18n } from 'vue-i18n'
 import { storageIconDict } from '@/api/constants'

src/components/cards/SubscribeCard.vue

@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import { useToast } from 'vue-toast-notification'
+import { useToast } from 'vue-toastification'
 import { useConfirm } from '@/composables/useConfirm'
 import SubscribeEditDialog from '../dialog/SubscribeEditDialog.vue'
 import SubscribeFilesDialog from '../dialog/SubscribeFilesDialog.vue'

src/components/cards/UserCard.vue

@@ -3,7 +3,7 @@ import api from '@/api'
 import { Subscribe, User } from '@/api/types'
 import { useUserStore } from '@/stores'
 import avatar1 from '@images/avatars/avatar-1.png'
-import { useToast } from 'vue-toast-notification'
+import { useToast } from 'vue-toastification'
 import { useConfirm } from '@/composables/useConfirm'
 import UserAddEditDialog from '@/components/dialog/UserAddEditDialog.vue'
 import { useDisplay } from 'vuetify'

src/components/cards/WorkflowTaskCard.vue

@@ -1,6 +1,6 @@
 <script lang="ts" setup>
 import { Workflow } from '@/api/types'
-import { useToast } from 'vue-toast-notification'
+import { useToast } from 'vue-toastification'
 import { useConfirm } from '@/composables/useConfirm'
 import WorkflowAddEditDialog from '@/components/dialog/WorkflowAddEditDialog.vue'
 import WorkflowActionsDialog from '@/components/dialog/WorkflowActionsDialog.vue'

src/components/dialog/AddDownloadDialog.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { useToast } from 'vue-toast-notification'
+import { useToast } from 'vue-toastification'
 import api from '@/api'
 import { doneNProgress, startNProgress } from '@/api/nprogress'
 import type { DownloaderConf, MediaInfo, TorrentInfo, TransferDirectoryConf } from '@/api/types'

src/components/dialog/ForkSubscribeDialog.vue

@@ -3,7 +3,7 @@ import api from '@/api'
 import { doneNProgress, startNProgress } from '@/api/nprogress'
 import { SubscribeShare } from '@/api/types'
 import router from '@/router'
-import { useToast } from 'vue-toast-notification'
+import { useToast } from 'vue-toastification'
 import { VBtn } from 'vuetify/lib/components/index.mjs'
 import { useI18n } from 'vue-i18n'
 

src/components/dialog/PluginConfigDialog.vue

@@ -3,7 +3,7 @@ import { useDisplay } from 'vuetify'
 import type { Plugin } from '@/api/types'
 import { isNullOrEmptyObject } from '@/@core/utils'
 import api from '@/api'
-import { useToast } from 'vue-toast-notification'
+import { useToast } from 'vue-toastification'
 import FormRender from '../render/FormRender.vue'
 import ProgressDialog from '../dialog/ProgressDialog.vue'
 import { useI18n } from 'vue-i18n'

src/components/dialog/PluginMarketSettingDialog.vue

@@ -1,6 +1,6 @@
 <script lang="ts" setup>
 import api from '@/api'
-import { useToast } from 'vue-toast-notification'
+import { useToast } from 'vue-toastification'
 import { useI18n } from 'vue-i18n'
 import { computed } from 'vue'
 import { useDisplay } from 'vuetify'

src/components/dialog/ReorganizeDialog.vue

@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import { useToast } from 'vue-toast-notification'
+import { useToast } from 'vue-toastification'
 import MediaIdSelector from '../misc/MediaIdSelector.vue'
 import api from '@/api'
 import { transferTypeOptions } from '@/api/constants'

src/components/dialog/SiteAddEditDialog.vue

@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import { useToast } from 'vue-toast-notification'
+import { useToast } from 'vue-toastification'
 import type { DownloaderConf, Site } from '@/api/types'
 import { doneNProgress, startNProgress } from '@/api/nprogress'
 import { numberValidator, requiredValidator } from '@/@validators'

src/components/dialog/SiteCookieUpdateDialog.vue

@@ -2,7 +2,7 @@
 import api from '@/api'
 import { Site } from '@/api/types'
 import { requiredValidator } from '@/@validators'
-import { useToast } from 'vue-toast-notification'
+import { useToast } from 'vue-toastification'
 import ProgressDialog from '../dialog/ProgressDialog.vue'
 import { useI18n } from 'vue-i18n'
 

src/components/dialog/SubscribeEditDialog.vue

@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import { useToast } from 'vue-toast-notification'
+import { useToast } from 'vue-toastification'
 import { numberValidator } from '@/@validators'
 import api from '@/api'
 import type { DownloaderConf, FilterRuleGroup, Site, Subscribe, TransferDirectoryConf } from '@/api/types'

src/components/dialog/SubscribeShareDialog.vue

@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import { useToast } from 'vue-toast-notification'
+import { useToast } from 'vue-toastification'
 import { requiredValidator } from '@/@validators'
 import api from '@/api'
 import type { Subscribe, SubscribeShare } from '@/api/types'

src/components/dialog/UserAddEditDialog.vue

@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import { useToast } from 'vue-toast-notification'
+import { useToast } from 'vue-toastification'
 import type { User } from '@/api/types'
 import { doneNProgress, startNProgress } from '@/api/nprogress'
 import api from '@/api'

src/components/dialog/UserAuthDialog.vue

@@ -1,7 +1,7 @@
 <script lang="ts" setup>
 import { isNullOrEmptyObject } from '@/@core/utils'
 import api from '@/api'
-import { useToast } from 'vue-toast-notification'
+import { useToast } from 'vue-toastification'
 import { useI18n } from 'vue-i18n'
 
 

src/components/dialog/WorkflowActionsDialog.vue

@@ -4,7 +4,7 @@ import { VueFlow, useVueFlow, type Connection, type GraphNode } from '@vue-flow/
 import { MiniMap } from '@vue-flow/minimap'
 import useDragAndDrop from '@core/utils/workflow'
 import { Workflow } from '@/api/types'
-import { useToast } from 'vue-toast-notification'
+import { useToast } from 'vue-toastification'
 import api from '@/api'
 import WorkflowSidebar from '@/layouts/components/WorkflowSidebar.vue'
 import DropzoneBackground from '@/layouts/components/DropzoneBackground.vue'

src/components/dialog/WorkflowAddEditDialog.vue

@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import { useToast } from 'vue-toast-notification'
+import { useToast } from 'vue-toastification'
 import type { Workflow } from '@/api/types'
 import { doneNProgress, startNProgress } from '@/api/nprogress'
 import { requiredValidator } from '@/@validators'

src/components/filebrowser/FileList.vue

@@ -2,7 +2,7 @@
 import type { AxiosRequestConfig } from 'axios'
 import type { PropType } from 'vue'
 import { useConfirm } from '@/composables/useConfirm'
-import { useToast } from 'vue-toast-notification'
+import { useToast } from 'vue-toastification'
 import ReorganizeDialog from '../dialog/ReorganizeDialog.vue'
 import { formatBytes } from '@core/utils/formatters'
 import type { Context, EndPoints, FileItem } from '@/api/types'

src/layouts/components/UserProfile.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { useToast } from 'vue-toast-notification'
+import { useToast } from 'vue-toastification'
 import router from '@/router'
 import avatar1 from '@images/avatars/avatar-1.png'
 import api from '@/api'

src/main.ts

@@ -23,7 +23,7 @@ import { loadRemoteComponents } from './utils/federationLoader'
 import { fetchGlobalSettings } from './utils/globalSetting'
 
 // 5. 其他插件和功能模块
-import ToastPlugin from 'vue-toast-notification'
+import Toast from 'vue-toastification'
 import ConfirmDialog from '@/composables/useConfirm'
 import VueApexCharts from 'vue3-apexcharts'
 
@@ -99,7 +99,7 @@ initializeApp().then(() => {
   // 5. 注册其他插件
   app
     .use(PerfectScrollbarPlugin)
-    .use(ToastPlugin, {
+    .use(Toast, {
       position: 'bottom-right',
     })
     .use(ConfirmDialog)

src/styles/custom.scss

@@ -48,14 +48,9 @@ html.v-overlay-scroll-blocked {
   }
 }
 
-.v-toast--bottom {
+.Vue-Toastification__container {
   z-index: 2500;
-  margin-block-end: env(safe-area-inset-bottom);
-}
-
-.v-toast--top {
-  z-index: 2500;
-  margin-block-start: env(safe-area-inset-top);
+  margin-block: env(safe-area-inset-top) env(safe-area-inset-bottom);
 }
 
 .v-dialog > .v-overlay__content > .v-card > .v-card-item {
@@ -162,10 +157,6 @@ html.v-overlay-scroll-blocked {
   background: rgb(var(--v-table-header-background));
 }
 
-.v-toast {
-  z-index: 2500 !important;
- }
-
  .v-divider {
   border-color: rgba(var(--v-theme-on-background), var(--v-selected-opacity));
   opacity:0.75;

src/styles/main.scss

@@ -8,6 +8,6 @@
 @use '@styles/custom' as custom;
 
 /* 第三方库纯CSS样式 */
-@import 'vue-toast-notification/dist/theme-bootstrap.css';
+@import 'vue-toastification/dist/index.css';
 @import 'vue3-perfect-scrollbar/style.css';
 @import '@vue-js-cron/vuetify/dist/vuetify.css'; 

src/views/discover/MediaDetailView.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { useToast } from 'vue-toast-notification'
+import { useToast } from 'vue-toastification'
 import PersonCardSlideView from './PersonCardSlideView.vue'
 import MediaCardSlideView from './MediaCardSlideView.vue'
 import api from '@/api'

src/views/plugin/PluginCardListView.vue

@@ -1,6 +1,6 @@
 <script lang="ts" setup>
 import draggable from 'vuedraggable'
-import { useToast } from 'vue-toast-notification'
+import { useToast } from 'vue-toastification'
 import api from '@/api'
 import type { Plugin } from '@/api/types'
 import NoDataFound from '@/components/NoDataFound.vue'

src/views/reorganize/TransferHistoryView.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { debounce } from 'lodash-es'
-import { useToast } from 'vue-toast-notification'
+import { useToast } from 'vue-toastification'
 import api from '@/api'
 import type { StorageConf, TransferHistory } from '@/api/types'
 import ReorganizeDialog from '@/components/dialog/ReorganizeDialog.vue'

src/views/setting/AccountSettingCache.vue

@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import { useToast } from 'vue-toast-notification'
+import { useToast } from 'vue-toastification'
 import api from '@/api'
 import type { TorrentCacheData, TorrentCacheItem } from '@/api/types'
 import { useI18n } from 'vue-i18n'

src/views/setting/AccountSettingDirectory.vue

@@ -1,6 +1,6 @@
 <!-- eslint-disable sonarjs/no-duplicate-string -->
 <script lang="ts" setup>
-import { useToast } from 'vue-toast-notification'
+import { useToast } from 'vue-toastification'
 import draggable from 'vuedraggable'
 import { VRow } from 'vuetify/lib/components/index.mjs'
 import api from '@/api'

src/views/setting/AccountSettingNotification.vue

@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import { useToast } from 'vue-toast-notification'
+import { useToast } from 'vue-toastification'
 import api from '@/api'
 import draggable from 'vuedraggable'
 import type { NotificationConf, NotificationSwitchConf } from '@/api/types'

src/views/setting/AccountSettingRule.vue

@@ -1,6 +1,6 @@
 <!-- eslint-disable sonarjs/no-duplicate-string -->
 <script lang="ts" setup>
-import { useToast } from 'vue-toast-notification'
+import { useToast } from 'vue-toastification'
 import { copyToClipboard } from '@/@core/utils/navigator'
 import draggable from 'vuedraggable'
 import api from '@/api'

src/views/setting/AccountSettingSearch.vue

@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import { useToast } from 'vue-toast-notification'
+import { useToast } from 'vue-toastification'
 import api from '@/api'
 import type { FilterRuleGroup, Site } from '@/api/types'
 import { useI18n } from 'vue-i18n'

src/views/setting/AccountSettingService.vue

@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import { useToast } from 'vue-toast-notification'
+import { useToast } from 'vue-toastification'
 import api from '@/api'
 import type { ScheduleInfo } from '@/api/types'
 import { useI18n } from 'vue-i18n'

src/views/setting/AccountSettingSite.vue

@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import { useToast } from 'vue-toast-notification'
+import { useToast } from 'vue-toastification'
 import api from '@/api'
 import ProgressDialog from '@/components/dialog/ProgressDialog.vue'
 import { useI18n } from 'vue-i18n'

src/views/setting/AccountSettingSubscribe.vue

@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import { useToast } from 'vue-toast-notification'
+import { useToast } from 'vue-toastification'
 import api from '@/api'
 import type { FilterRuleGroup, Site } from '@/api/types'
 import ProgressDialog from '@/components/dialog/ProgressDialog.vue'

src/views/setting/AccountSettingSystem.vue

@@ -1,6 +1,6 @@
 <!-- eslint-disable sonarjs/no-duplicate-string -->
 <script lang="ts" setup>
-import { useToast } from 'vue-toast-notification'
+import { useToast } from 'vue-toastification'
 import { VRow } from 'vuetify/lib/components/index.mjs'
 import draggable from 'vuedraggable'
 import api from '@/api'

src/views/setting/AccountSettingWords.vue

@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import { useToast } from 'vue-toast-notification'
+import { useToast } from 'vue-toastification'
 import api from '@/api'
 import { useI18n } from 'vue-i18n'
 

src/views/user/UserProfileView.vue

@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import { useToast } from 'vue-toast-notification'
+import { useToast } from 'vue-toastification'
 import QrcodeVue from 'qrcode.vue'
 import { VForm } from 'vuetify/lib/components/index.mjs'
 import api from '@/api'