mirror of
https://github.com/jxxghp/MoviePilot-Frontend.git
synced 2026-09-06 16:16:42 +08:00
refactor: 统一过滤图标为 mdi-filter-multiple-outline,插件市场筛选改为下拉多选
This commit is contained in:
@@ -58,7 +58,7 @@ const searchShares = () => {
|
|||||||
// 筛选选项
|
// 筛选选项
|
||||||
const filterOptions = computed(() => {
|
const filterOptions = computed(() => {
|
||||||
const baseOptions = [
|
const baseOptions = [
|
||||||
{ value: 'all', label: t('common.all'), icon: 'mdi-format-list-bulleted' },
|
{ value: 'all', label: t('common.all'), icon: 'mdi-filter-multiple-outline' },
|
||||||
{ value: 'best_version', label: t('subscribe.bestVersion'), icon: 'mdi-refresh', color: 'warning' },
|
{ value: 'best_version', label: t('subscribe.bestVersion'), icon: 'mdi-refresh', color: 'warning' },
|
||||||
]
|
]
|
||||||
|
|
||||||
|
|||||||
@@ -113,7 +113,7 @@ registerHeaderTab({
|
|||||||
const pluginId = ref(route.query.id)
|
const pluginId = ref(route.query.id)
|
||||||
|
|
||||||
// 当前排序字段
|
// 当前排序字段
|
||||||
const activeSort = ref(null)
|
const activeSort = ref<string | null>(null)
|
||||||
|
|
||||||
// 插件顺序配置
|
// 插件顺序配置
|
||||||
const orderConfig = ref<{ id: string; type?: string; order?: number }[]>([])
|
const orderConfig = ref<{ id: string; type?: string; order?: number }[]>([])
|
||||||
@@ -1363,9 +1363,8 @@ function onDragStartPlugin(evt: any) {
|
|||||||
:close-on-content-click="false"
|
:close-on-content-click="false"
|
||||||
:activator="'[data-menu-activator=market-filter-btn]'"
|
:activator="'[data-menu-activator=market-filter-btn]'"
|
||||||
location="bottom end"
|
location="bottom end"
|
||||||
max-height="80vh"
|
|
||||||
>
|
>
|
||||||
<VCard min-width="240" max-width="300">
|
<VCard min-width="260" max-width="320">
|
||||||
<!-- 名称搜索 -->
|
<!-- 名称搜索 -->
|
||||||
<div class="px-3 pt-3 pb-1">
|
<div class="px-3 pt-3 pb-1">
|
||||||
<VTextField
|
<VTextField
|
||||||
@@ -1380,7 +1379,7 @@ function onDragStartPlugin(evt: any) {
|
|||||||
</div>
|
</div>
|
||||||
<VDivider class="mt-2" />
|
<VDivider class="mt-2" />
|
||||||
<!-- 排序 -->
|
<!-- 排序 -->
|
||||||
<VList v-if="sortOptions.length > 0" density="compact" class="px-2 py-1">
|
<VList density="compact" class="px-2 py-1">
|
||||||
<VListSubheader>{{ t('plugin.sortTitle') }}</VListSubheader>
|
<VListSubheader>{{ t('plugin.sortTitle') }}</VListSubheader>
|
||||||
<VListItem
|
<VListItem
|
||||||
v-for="option in sortOptions"
|
v-for="option in sortOptions"
|
||||||
@@ -1395,63 +1394,49 @@ function onDragStartPlugin(evt: any) {
|
|||||||
</template>
|
</template>
|
||||||
</VListItem>
|
</VListItem>
|
||||||
</VList>
|
</VList>
|
||||||
<!-- 作者筛选 -->
|
<!-- 下拉多选筛选项 -->
|
||||||
<template v-if="authorFilterOptions.length > 0">
|
<VDivider />
|
||||||
<VDivider />
|
<div class="px-3 py-2 d-flex flex-column gap-2">
|
||||||
<VList density="compact" class="px-2 py-1">
|
<VSelect
|
||||||
<VListSubheader>{{ t('plugin.author') }}</VListSubheader>
|
v-if="authorFilterOptions.length > 0"
|
||||||
<VListItem
|
v-model="filterForm.author"
|
||||||
v-for="author in authorFilterOptions"
|
:items="authorFilterOptions"
|
||||||
:key="author"
|
:label="t('plugin.author')"
|
||||||
:active="filterForm.author.includes(author)"
|
multiple
|
||||||
@click="toggleMarketFilter('author', author)"
|
chips
|
||||||
density="compact"
|
closable-chips
|
||||||
>
|
density="compact"
|
||||||
<VListItemTitle>{{ author }}</VListItemTitle>
|
variant="outlined"
|
||||||
<template #append>
|
hide-details
|
||||||
<VIcon v-if="filterForm.author.includes(author)" icon="mdi-check" color="primary" size="small" />
|
clearable
|
||||||
</template>
|
/>
|
||||||
</VListItem>
|
<VSelect
|
||||||
</VList>
|
v-if="labelFilterOptions.length > 0"
|
||||||
</template>
|
v-model="filterForm.label"
|
||||||
<!-- 标签筛选 -->
|
:items="labelFilterOptions"
|
||||||
<template v-if="labelFilterOptions.length > 0">
|
:label="t('plugin.label')"
|
||||||
<VDivider />
|
multiple
|
||||||
<VList density="compact" class="px-2 py-1">
|
chips
|
||||||
<VListSubheader>{{ t('plugin.label') }}</VListSubheader>
|
closable-chips
|
||||||
<VListItem
|
density="compact"
|
||||||
v-for="label in labelFilterOptions"
|
variant="outlined"
|
||||||
:key="label"
|
hide-details
|
||||||
:active="filterForm.label.includes(label)"
|
clearable
|
||||||
@click="toggleMarketFilter('label', label)"
|
/>
|
||||||
density="compact"
|
<VSelect
|
||||||
>
|
v-if="repoFilterOptions.length > 0"
|
||||||
<VListItemTitle>{{ label }}</VListItemTitle>
|
v-model="filterForm.repo"
|
||||||
<template #append>
|
:items="repoFilterOptions"
|
||||||
<VIcon v-if="filterForm.label.includes(label)" icon="mdi-check" color="primary" size="small" />
|
:label="t('plugin.repository')"
|
||||||
</template>
|
multiple
|
||||||
</VListItem>
|
chips
|
||||||
</VList>
|
closable-chips
|
||||||
</template>
|
density="compact"
|
||||||
<!-- 仓库筛选 -->
|
variant="outlined"
|
||||||
<template v-if="repoFilterOptions.length > 0">
|
hide-details
|
||||||
<VDivider />
|
clearable
|
||||||
<VList density="compact" class="px-2 py-1">
|
/>
|
||||||
<VListSubheader>{{ t('plugin.repository') }}</VListSubheader>
|
</div>
|
||||||
<VListItem
|
|
||||||
v-for="repo in repoFilterOptions"
|
|
||||||
:key="repo"
|
|
||||||
:active="filterForm.repo.includes(repo)"
|
|
||||||
@click="toggleMarketFilter('repo', repo)"
|
|
||||||
density="compact"
|
|
||||||
>
|
|
||||||
<VListItemTitle class="text-truncate" style="max-width: 220px">{{ repo }}</VListItemTitle>
|
|
||||||
<template #append>
|
|
||||||
<VIcon v-if="filterForm.repo.includes(repo)" icon="mdi-check" color="primary" size="small" />
|
|
||||||
</template>
|
|
||||||
</VListItem>
|
|
||||||
</VList>
|
|
||||||
</template>
|
|
||||||
</VCard>
|
</VCard>
|
||||||
</VMenu>
|
</VMenu>
|
||||||
</Teleport>
|
</Teleport>
|
||||||
|
|||||||
@@ -57,7 +57,7 @@ const filterOption = ref('all') // all, active, inactive, connected, slow, faile
|
|||||||
|
|
||||||
// 筛选选项
|
// 筛选选项
|
||||||
const filterOptions = computed(() => [
|
const filterOptions = computed(() => [
|
||||||
{ value: 'all', label: t('common.all'), icon: 'mdi-format-list-bulleted' },
|
{ value: 'all', label: t('common.all'), icon: 'mdi-filter-multiple-outline' },
|
||||||
{ value: 'active', label: t('common.active'), icon: 'mdi-check-circle', color: 'success' },
|
{ value: 'active', label: t('common.active'), icon: 'mdi-check-circle', color: 'success' },
|
||||||
{ value: 'inactive', label: t('common.inactive'), icon: 'mdi-stop-circle', color: 'error' },
|
{ value: 'inactive', label: t('common.inactive'), icon: 'mdi-stop-circle', color: 'error' },
|
||||||
{ value: 'connected', label: t('site.connectionNormal'), icon: 'mdi-wifi', color: 'success' },
|
{ value: 'connected', label: t('site.connectionNormal'), icon: 'mdi-wifi', color: 'success' },
|
||||||
|
|||||||
Reference in New Issue
Block a user