优化动态标签页注册逻辑

This commit is contained in:
jxxghp
2025-07-05 14:26:57 +08:00
parent 20dced021d
commit 4bdee63f28
5 changed files with 83 additions and 78 deletions
+17 -16
View File
@@ -123,6 +123,23 @@ async function saveTabOrder() {
// 使用动态标签页 // 使用动态标签页
const { registerHeaderTab } = useDynamicHeaderTab() const { registerHeaderTab } = useDynamicHeaderTab()
// 注册动态标签页
registerHeaderTab({
items: discoverTabItems, // 传递computed值,而不是.value
modelValue: activeTab,
appendButtons: [
{
icon: 'mdi-order-alphabetical-ascending',
variant: 'text',
color: 'grey',
class: 'settings-icon-button',
action: () => {
orderConfigDialog.value = true
},
},
],
})
onBeforeMount(async () => { onBeforeMount(async () => {
initDiscoverTabs() initDiscoverTabs()
await loadOrderConfig() await loadOrderConfig()
@@ -135,22 +152,6 @@ onMounted(() => {
if (discoverTabs.value.length > 0) { if (discoverTabs.value.length > 0) {
activeTab.value = discoverTabs.value[0].mediaid_prefix activeTab.value = discoverTabs.value[0].mediaid_prefix
} }
// 注册动态标签页
registerHeaderTab({
items: discoverTabItems, // 传递computed值,而不是.value
modelValue: activeTab,
appendButtons: [
{
icon: 'mdi-order-alphabetical-ascending',
variant: 'text',
color: 'grey',
class: 'settings-icon-button',
action: () => {
orderConfigDialog.value = true
},
},
],
})
}) })
onActivated(async () => { onActivated(async () => {
+1 -1
View File
@@ -41,7 +41,7 @@ async function loadDownloaderSetting() {
const registerTabs = () => { const registerTabs = () => {
if (downloaderItems.value.length > 0) { if (downloaderItems.value.length > 0) {
registerHeaderTab({ registerHeaderTab({
items: downloaderItems.value, items: downloaderItems,
modelValue: activeTab, modelValue: activeTab,
}) })
} }
+19 -19
View File
@@ -14,6 +14,9 @@ const { t } = useI18n()
// 当前选择的分类 // 当前选择的分类
const currentCategory = ref(t('recommend.all')) const currentCategory = ref(t('recommend.all'))
// 使用动态标签页
const { registerHeaderTab } = useDynamicHeaderTab()
const viewList = reactive<{ apipath: string; linkurl: string; title: string; type: string }[]>([ const viewList = reactive<{ apipath: string; linkurl: string; title: string; type: string }[]>([
{ {
apipath: 'recommend/tmdb_trending', apipath: 'recommend/tmdb_trending',
@@ -194,8 +197,22 @@ const categoryItems = computed(() => [
}, },
]) ])
// 使用动态标签页 // 注册动态标签页
const { registerHeaderTab } = useDynamicHeaderTab() registerHeaderTab({
items: categoryItems,
modelValue: currentCategory,
appendButtons: [
{
icon: 'mdi-tune',
variant: 'text',
color: 'grey',
class: 'settings-icon-button',
action: () => {
dialog.value = true
},
},
],
})
onBeforeMount(async () => { onBeforeMount(async () => {
await loadConfig() await loadConfig()
@@ -203,23 +220,6 @@ onBeforeMount(async () => {
onMounted(async () => { onMounted(async () => {
await loadExtraRecommendSources() await loadExtraRecommendSources()
// 注册动态标签页
registerHeaderTab({
items: categoryItems,
modelValue: currentCategory,
appendButtons: [
{
icon: 'mdi-tune',
variant: 'text',
color: 'grey',
class: 'settings-icon-button',
action: () => {
dialog.value = true
},
},
],
})
}) })
onActivated(async () => { onActivated(async () => {
+6 -4
View File
@@ -23,16 +23,18 @@ const settingTabs = computed(() => getSettingTabs())
// 使用动态标签页 // 使用动态标签页
const { registerHeaderTab } = useDynamicHeaderTab() const { registerHeaderTab } = useDynamicHeaderTab()
// 注册动态标签页
registerHeaderTab({
items: settingTabs.value,
modelValue: activeTab,
})
// 注册动态标签页 // 注册动态标签页
onMounted(() => { onMounted(() => {
// 设置初始activeTab值 // 设置初始activeTab值
if (!activeTab.value && settingTabs.value.length > 0) { if (!activeTab.value && settingTabs.value.length > 0) {
activeTab.value = settingTabs.value[0].tab activeTab.value = settingTabs.value[0].tab
} }
registerHeaderTab({
items: settingTabs.value,
modelValue: activeTab,
})
}) })
</script> </script>
+40 -38
View File
@@ -55,50 +55,52 @@ const searchActivator = computed(() => '[data-menu-activator="search-btn"]')
// 使用动态标签页 // 使用动态标签页
const { registerHeaderTab } = useDynamicHeaderTab() const { registerHeaderTab } = useDynamicHeaderTab()
// 注册动态标签页
registerHeaderTab({
items: subscribeTabs.value,
modelValue: activeTab,
appendButtons: [
{
icon: 'mdi-filter-multiple-outline',
variant: 'text',
color: computed(() => (subscribeFilter.value ? 'primary' : 'gray')),
class: 'settings-icon-button',
dataAttr: 'filter-btn',
action: () => {
filterSubscribeDialog.value = true
},
show: computed(() => activeTab.value === 'mysub'),
},
{
icon: 'mdi-movie-search-outline',
variant: 'text',
color: computed(() => (shareKeyword.value ? 'primary' : 'gray')),
class: 'settings-icon-button',
dataAttr: 'search-btn',
action: () => {
searchShareDialog.value = true
},
show: computed(() => activeTab.value === 'share'),
},
{
icon: 'mdi-clipboard-edit-outline',
variant: 'text',
color: 'gray',
class: 'settings-icon-button',
action: () => {
subscribeEditDialog.value = true
},
show: computed(() => activeTab.value === 'mysub'),
},
],
})
// 注册动态标签页 // 注册动态标签页
onMounted(() => { onMounted(() => {
// 设置初始activeTab值 // 设置初始activeTab值
if (!activeTab.value && subscribeTabs.value.length > 0) { if (!activeTab.value && subscribeTabs.value.length > 0) {
activeTab.value = subscribeTabs.value[0].tab activeTab.value = subscribeTabs.value[0].tab
} }
registerHeaderTab({
items: subscribeTabs.value,
modelValue: activeTab,
appendButtons: [
{
icon: 'mdi-filter-multiple-outline',
variant: 'text',
color: computed(() => (subscribeFilter.value ? 'primary' : 'gray')),
class: 'settings-icon-button',
dataAttr: 'filter-btn',
action: () => {
filterSubscribeDialog.value = true
},
show: computed(() => activeTab.value === 'mysub'),
},
{
icon: 'mdi-movie-search-outline',
variant: 'text',
color: computed(() => (shareKeyword.value ? 'primary' : 'gray')),
class: 'settings-icon-button',
dataAttr: 'search-btn',
action: () => {
searchShareDialog.value = true
},
show: computed(() => activeTab.value === 'share'),
},
{
icon: 'mdi-clipboard-edit-outline',
variant: 'text',
color: 'gray',
class: 'settings-icon-button',
action: () => {
subscribeEditDialog.value = true
},
show: computed(() => activeTab.value === 'mysub'),
},
],
})
}) })
</script> </script>