feat: categories and option search

This commit is contained in:
2025-03-15 15:32:45 +00:00
parent 97831caf75
commit 08d6a2a2fe
11 changed files with 214 additions and 33 deletions

View File

@ -24,8 +24,7 @@ const general = useGeneralStore();
pkg.setupListeners();
const currentTab: Ref<string | number> = ref(3);
const searchPkg = ref('');
const searchCfg = ref('');
const pkgSearchTerm = ref('');
const isProfileDisabled = computed(() => prf.current === null);
@ -34,7 +33,7 @@ onMounted(async () => {
general.dirs = d as Dirs;
});
const fetch_promise = pkg.fetch();
const fetch_promise = pkg.fetch(true);
await Promise.all([prf.reloadList(), prf.reload()]);
@ -65,7 +64,10 @@ onMounted(async () => {
<Tab :disabled="isProfileDisabled" :value="0"
><div class="pi pi-list-check"></div
></Tab>
<Tab :disabled="isProfileDisabled" :value="1"
<Tab
v-if="!pkg.offline"
:disabled="isProfileDisabled"
:value="1"
><div class="pi pi-download"></div
></Tab>
<Tab :disabled="isProfileDisabled" :value="2"
@ -75,23 +77,32 @@ onMounted(async () => {
><div class="pi pi-question-circle"></div
></Tab>
<div class="grow"></div>
<div class="flex" v-if="currentTab !== 3">
<InputIcon class="self-center mr-2">
<i class="pi pi-search" />
</InputIcon>
<InputText
v-if="currentTab === 2"
class="self-center"
<div class="flex gap-4">
<div class="flex" v-if="currentTab !== 3">
<InputIcon class="self-center mr-2">
<i class="pi pi-search" />
</InputIcon>
<InputText
v-if="currentTab === 2"
class="self-center"
size="small"
placeholder="Search"
v-model="general.cfgSearchTerm"
/>
<InputText
v-else
class="self-center"
size="small"
placeholder="Search"
v-model="pkgSearchTerm"
/>
</div>
<Button
v-if="pkg.offline"
class="shrink self-center"
icon="pi pi-sync"
size="small"
placeholder="Search"
v-model="searchCfg"
/>
<InputText
v-else
class="self-center"
size="small"
placeholder="Search"
v-model="searchPkg"
@click="pkg.fetch(false)"
/>
</div>
<div class="grow"></div>
@ -100,10 +111,10 @@ onMounted(async () => {
</div>
<TabPanels class="w-full grow mt-[3rem]">
<TabPanel :value="0">
<ModList :search="searchPkg" />
<ModList :search="pkgSearchTerm" />
</TabPanel>
<TabPanel :value="1">
<ModStore :search="searchPkg" />
<ModStore :search="pkgSearchTerm" />
</TabPanel>
<TabPanel :value="2">
<OptionList />