mirror of
https://github.com/jxxghp/MoviePilot-Frontend.git
synced 2026-09-05 23:56:42 +08:00
在多个视图组件中添加动态按钮功能,支持不同操作的弹窗显示,优化按钮显示逻辑以提升用户交互体验。
This commit is contained in:
@@ -11,6 +11,7 @@ import { useDisplay } from 'vuetify'
|
|||||||
import { isNullOrEmptyObject } from '@/@core/utils'
|
import { isNullOrEmptyObject } from '@/@core/utils'
|
||||||
import { PluginTabs } from '@/router/menu'
|
import { PluginTabs } from '@/router/menu'
|
||||||
import PluginMarketSettingDialog from '@/components/dialog/PluginMarketSettingDialog.vue'
|
import PluginMarketSettingDialog from '@/components/dialog/PluginMarketSettingDialog.vue'
|
||||||
|
import { useDynamicButton } from '@/composables/useDynamicButton'
|
||||||
|
|
||||||
const route = useRoute()
|
const route = useRoute()
|
||||||
|
|
||||||
@@ -454,6 +455,14 @@ onMounted(async () => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
|
// 使用动态按钮钩子
|
||||||
|
useDynamicButton({
|
||||||
|
icon: 'mdi-view-dashboard-edit',
|
||||||
|
onClick: () => {
|
||||||
|
SearchDialog.value = true
|
||||||
|
},
|
||||||
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
@@ -668,6 +677,7 @@ onMounted(async () => {
|
|||||||
<div v-if="isRefreshed">
|
<div v-if="isRefreshed">
|
||||||
<!-- 插件搜索图标 -->
|
<!-- 插件搜索图标 -->
|
||||||
<VFab
|
<VFab
|
||||||
|
v-if="!appMode"
|
||||||
icon="mdi-magnify"
|
icon="mdi-magnify"
|
||||||
color="info"
|
color="info"
|
||||||
location="bottom"
|
location="bottom"
|
||||||
|
|||||||
@@ -6,6 +6,7 @@ import SiteCard from '@/components/cards/SiteCard.vue'
|
|||||||
import NoDataFound from '@/components/NoDataFound.vue'
|
import NoDataFound from '@/components/NoDataFound.vue'
|
||||||
import SiteAddEditDialog from '@/components/dialog/SiteAddEditDialog.vue'
|
import SiteAddEditDialog from '@/components/dialog/SiteAddEditDialog.vue'
|
||||||
import { useDisplay } from 'vuetify'
|
import { useDisplay } from 'vuetify'
|
||||||
|
import { useDynamicButton } from '@/composables/useDynamicButton'
|
||||||
|
|
||||||
// APP
|
// APP
|
||||||
const display = useDisplay()
|
const display = useDisplay()
|
||||||
@@ -84,6 +85,14 @@ onActivated(() => {
|
|||||||
fetchUserData()
|
fetchUserData()
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
|
// 使用动态按钮钩子
|
||||||
|
useDynamicButton({
|
||||||
|
icon: 'mdi-view-dashboard-edit',
|
||||||
|
onClick: () => {
|
||||||
|
siteAddDialog.value = true
|
||||||
|
},
|
||||||
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
@@ -113,7 +122,7 @@ onActivated(() => {
|
|||||||
/>
|
/>
|
||||||
<!-- 新增站点按钮 -->
|
<!-- 新增站点按钮 -->
|
||||||
<VFab
|
<VFab
|
||||||
v-if="isRefreshed"
|
v-if="isRefreshed && !appMode"
|
||||||
icon="mdi-plus"
|
icon="mdi-plus"
|
||||||
location="bottom"
|
location="bottom"
|
||||||
size="x-large"
|
size="x-large"
|
||||||
|
|||||||
@@ -7,6 +7,7 @@ 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 { useDisplay } from 'vuetify'
|
||||||
|
import { useDynamicButton } from '@/composables/useDynamicButton'
|
||||||
|
|
||||||
// APP
|
// APP
|
||||||
const display = useDisplay()
|
const display = useDisplay()
|
||||||
@@ -148,6 +149,14 @@ onActivated(async () => {
|
|||||||
fetchData()
|
fetchData()
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
|
// 使用动态按钮钩子
|
||||||
|
useDynamicButton({
|
||||||
|
icon: 'mdi-history',
|
||||||
|
onClick: () => {
|
||||||
|
historyDialog.value = true
|
||||||
|
},
|
||||||
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
@@ -175,7 +184,7 @@ onActivated(async () => {
|
|||||||
<!-- 底部操作按钮 -->
|
<!-- 底部操作按钮 -->
|
||||||
<div v-if="isRefreshed">
|
<div v-if="isRefreshed">
|
||||||
<VFab
|
<VFab
|
||||||
v-if="userStore.superUser"
|
v-if="userStore.superUser && !appMode"
|
||||||
icon="mdi-history"
|
icon="mdi-history"
|
||||||
color="info"
|
color="info"
|
||||||
location="bottom"
|
location="bottom"
|
||||||
|
|||||||
@@ -5,7 +5,7 @@ import { useDisplay } from 'vuetify'
|
|||||||
import WorkflowAddEditDialog from '@/components/dialog/WorkflowAddEditDialog.vue'
|
import WorkflowAddEditDialog from '@/components/dialog/WorkflowAddEditDialog.vue'
|
||||||
import WorkflowTaskCard from '@/components/cards/WorkflowTaskCard.vue'
|
import WorkflowTaskCard from '@/components/cards/WorkflowTaskCard.vue'
|
||||||
import NoDataFound from '@/components/NoDataFound.vue'
|
import NoDataFound from '@/components/NoDataFound.vue'
|
||||||
|
import { useDynamicButton } from '@/composables/useDynamicButton'
|
||||||
// APP
|
// APP
|
||||||
const display = useDisplay()
|
const display = useDisplay()
|
||||||
const appMode = inject('pwaMode') && display.mdAndDown.value
|
const appMode = inject('pwaMode') && display.mdAndDown.value
|
||||||
@@ -42,11 +42,17 @@ onMounted(() => {
|
|||||||
onActivated(() => {
|
onActivated(() => {
|
||||||
fetchData()
|
fetchData()
|
||||||
})
|
})
|
||||||
</script>
|
|
||||||
|
|
||||||
|
// 使用动态按钮钩子 新增
|
||||||
|
useDynamicButton({
|
||||||
|
icon: 'mdi-plus',
|
||||||
|
onClick: () => {
|
||||||
|
addDialog.value = true
|
||||||
|
},
|
||||||
|
})
|
||||||
|
</script>
|
||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
|
|
||||||
<VPageContentTitle title="工作流" />
|
<VPageContentTitle title="工作流" />
|
||||||
<LoadingBanner v-if="!isRefreshed" class="mt-12" />
|
<LoadingBanner v-if="!isRefreshed" class="mt-12" />
|
||||||
<VRow v-if="workflowList.length > 0" class="match-height">
|
<VRow v-if="workflowList.length > 0" class="match-height">
|
||||||
@@ -64,7 +70,7 @@ onActivated(() => {
|
|||||||
|
|
||||||
<!-- 新增按钮 -->
|
<!-- 新增按钮 -->
|
||||||
<VFab
|
<VFab
|
||||||
v-if="isRefreshed"
|
v-if="isRefreshed && !appMode"
|
||||||
icon="mdi-plus"
|
icon="mdi-plus"
|
||||||
location="bottom"
|
location="bottom"
|
||||||
size="x-large"
|
size="x-large"
|
||||||
|
|||||||
Reference in New Issue
Block a user