glax/tranga-website
1
0
Fork 0
mirror of https://github.com/C9Glax/tranga-website.git synced 2025-10-11 13:19:49 +02:00
Code Issues Packages Projects Releases Wiki Activity

Search retain results and selected connector

Browse Source
This commit is contained in:
glax
2025-09-27 22:08:50 +02:00
parent d99dcb8c77
commit efda8e4459
1 changed files with 26 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

46
website/app/pages/search.vue
View File

@@ -24,18 +24,24 @@
</div> </div>
</UCard> </UCard>
</div> </div>
<p v-if="searchResult" class="text-lg">Result for '{{ searchQuery }}'</p> </UPageSection>
<div v-if="searchResult" class="relative flex flex-row flex-wrap gap-6 mt-0"> <UPageSection v-if="searchResult.length > 0" :ui="{ container: 'py-0 sm:py-0 lg:py-0' }">
<MangaCard <template #description>
v-for="(m, i) in searchResult" <p class="text-lg">Result for '{{ searchQuery }}'</p>
:manga="m" </template>
:expanded="i === expanded" <template #default>
@click="expanded = expanded === i ? -1 : i"> <div class="relative flex flex-row flex-wrap gap-6 mt-0">
<template #actions="manga"> <MangaCard
<UButton :to="`manga/${manga.key}`">Download</UButton> v-for="(m, i) in searchResult"
</template> :manga="m"
</MangaCard> :expanded="i === expanded"
</div> @click="expanded = expanded === i ? -1 : i">
<template #actions="manga">
<UButton :to="`download/${manga.key}`">Download</UButton>
</template>
</MangaCard>
</div>
</template>
</UPageSection> </UPageSection>
</template> </template>
@@ -48,7 +54,7 @@ type MinimalManga = components['schemas']['MinimalManga'];
const { data: connectors } = useApi('/v2/MangaConnector'); const { data: connectors } = useApi('/v2/MangaConnector');
const query = ref<string>(); const query = ref<string>();
const connector = ref<MangaConnector>(); const connector = useState<MangaConnector>();
const activeStep = ref(0); const activeStep = ref(0);
const busy = ref<boolean>(false); const busy = ref<boolean>(false);
watch(query, (v) => { watch(query, (v) => {
@@ -70,9 +76,9 @@ const connectorClick = (c: MangaConnector) => {
performSearch(); performSearch();
}; };
const searchResult = ref<MinimalManga[]>(); const searchResult = useState<MinimalManga[]>(() => []);
const expanded = ref(-1); const expanded = useState(() => -1);
const searchQuery = ref<string>(''); const searchQuery = useState<string>(() => '');
const performSearch = () => { const performSearch = () => {
if (!query.value) return; if (!query.value) return;
busy.value = true; busy.value = true;
@@ -89,12 +95,12 @@ const config = useRuntimeConfig();
const search = async (query: string): Promise<MinimalManga[]> => { const search = async (query: string): Promise<MinimalManga[]> => {
if (isUrl(query)) { if (isUrl(query)) {
return await $fetch(new Request(`${config.public.openFetch.api.baseURL}v2/Search/Url`), { return await $fetch<MinimalManga>(new Request(`${config.public.openFetch.api.baseURL}v2/Search/Url`), {
method: 'POST', method: 'POST',
body: query, body: JSON.stringify(query),
}); }).then(x => [x]);
} else if (connector.value) { } else if (connector.value) {
return await $fetch( return await $fetch<MinimalManga[]>(
new Request(`${config.public.openFetch.api.baseURL}v2/Search/${connector.value.name}/${query}`) new Request(`${config.public.openFetch.api.baseURL}v2/Search/${connector.value.name}/${query}`)
); );
} }