diff --git a/dashboard/src/views/ExtensionPage.vue b/dashboard/src/views/ExtensionPage.vue index 5a5037efb..03ce67cee 100644 --- a/dashboard/src/views/ExtensionPage.vue +++ b/dashboard/src/views/ExtensionPage.vue @@ -78,13 +78,19 @@ const readmeDialog = reactive({ }); // 新增变量支持列表视图 -const isListView = ref(false); +// 从 localStorage 恢复显示模式,默认为 false(卡片视图) +const getInitialListViewMode = () => { + if (typeof window !== 'undefined' && window.localStorage) { + return localStorage.getItem('pluginListViewMode') === 'true'; + } + return false; +}; +const isListView = ref(getInitialListViewMode()); const pluginSearch = ref(""); const loading_ = ref(false); // 分页相关 const currentPage = ref(1); -const itemsPerPage = ref(6); // 每页显示6个卡片 (2行 x 3列,避免滚动) // 危险插件确认对话框 const dangerConfirmDialog = ref(false); @@ -113,7 +119,6 @@ const uploadTab = ref('file'); const showPluginFullName = ref(false); const marketSearch = ref(""); const debouncedMarketSearch = ref(""); -const filterKeys = ['name', 'desc', 'author']; const refreshingMarket = ref(false); const sortBy = ref('default'); // default, stars, author, updated const sortOrder = ref('desc'); // desc (降序) or asc (升序) @@ -162,18 +167,6 @@ const pluginHeaders = computed(() => [ ]); -// 插件市场表头 -const pluginMarketHeaders = computed(() => [ - { title: tm('table.headers.name'), key: 'name', maxWidth: '200px' }, - { title: tm('table.headers.description'), key: 'desc', maxWidth: '250px' }, - { title: tm('table.headers.author'), key: 'author', maxWidth: '90px' }, - { title: tm('table.headers.stars'), key: 'stars', maxWidth: '80px' }, - { title: tm('table.headers.lastUpdate'), key: 'updated_at', maxWidth: '100px' }, - { title: tm('table.headers.tags'), key: 'tags', maxWidth: '100px' }, - { title: tm('table.headers.actions'), key: 'actions', sortable: false } -]); - - // 过滤要显示的插件 const filteredExtensions = computed(() => { const data = Array.isArray(extension_data?.data) ? extension_data.data : []; @@ -197,9 +190,6 @@ const filteredPlugins = computed(() => { }); }); -const pinnedPlugins = computed(() => { - return pluginMarketData.value.filter(plugin => plugin?.pinned); -}); // 过滤后的插件市场数据(带搜索) const filteredMarketPlugins = computed(() => { @@ -552,14 +542,6 @@ const viewReadme = (plugin) => { readmeDialog.show = true; }; - - -const open = (link) => { - if (link) { - window.open(link, '_blank'); - } -}; - // 为表格视图创建一个处理安装插件的函数 const handleInstallPlugin = async (plugin) => { if (plugin.tags && plugin.tags.includes('danger')) { @@ -918,6 +900,13 @@ watch(marketSearch, (newVal) => { }, 300); // 300ms 防抖延迟 }); +// 监听显示模式变化并保存到 localStorage +watch(isListView, (newVal) => { + if (typeof window !== 'undefined' && window.localStorage) { + localStorage.setItem('pluginListViewMode', String(newVal)); + } +}); + @@ -1037,8 +1026,21 @@ watch(marketSearch, (newVal) => {