mirror of
https://iceshrimp.dev/limepotato/jormungandr-bite.git
synced 2024-11-25 03:17:38 -07:00
[client] Fix search tab reactivation
This commit is contained in:
parent
16057fb237
commit
b346cc20d9
2 changed files with 28 additions and 21 deletions
|
@ -8,7 +8,7 @@
|
||||||
:display-back-button="true"
|
:display-back-button="true"
|
||||||
/></template>
|
/></template>
|
||||||
<MkSpacer :content-max="800">
|
<MkSpacer :content-max="800">
|
||||||
<MkSearch :query="query" :hideFilters="!$i || tab === 'users'" @query="search"/>
|
<MkSearch :query="searchQuery" :hideFilters="!$i || tab === 'users'" @query="search"/>
|
||||||
<swiper
|
<swiper
|
||||||
:round-lengths="true"
|
:round-lengths="true"
|
||||||
:touch-angle="25"
|
:touch-angle="25"
|
||||||
|
@ -27,7 +27,7 @@
|
||||||
>
|
>
|
||||||
<swiper-slide>
|
<swiper-slide>
|
||||||
<template v-if="$i && tabs[swiperRef!.activeIndex] == 'notes'">
|
<template v-if="$i && tabs[swiperRef!.activeIndex] == 'notes'">
|
||||||
<template v-if="query == null || query.trim().length < 1">
|
<template v-if="searchQuery == null || searchQuery.trim().length < 1">
|
||||||
<transition :name="$store.state.animation ? 'zoom' : ''" appear>
|
<transition :name="$store.state.animation ? 'zoom' : ''" appear>
|
||||||
<div class="_fullinfo" ref="notes">
|
<div class="_fullinfo" ref="notes">
|
||||||
<img
|
<img
|
||||||
|
@ -62,7 +62,7 @@
|
||||||
</template>
|
</template>
|
||||||
</swiper-slide>
|
</swiper-slide>
|
||||||
<swiper-slide>
|
<swiper-slide>
|
||||||
<template v-if="query == null || query.trim().length < 1">
|
<template v-if="searchQuery == null || searchQuery.trim().length < 1">
|
||||||
<transition :name="$store.state.animation ? 'zoom' : ''" appear>
|
<transition :name="$store.state.animation ? 'zoom' : ''" appear>
|
||||||
<div class="_fullinfo" ref="notes">
|
<div class="_fullinfo" ref="notes">
|
||||||
<img
|
<img
|
||||||
|
@ -90,7 +90,7 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { computed, watch, onMounted } from "vue";
|
import { computed, watch, onMounted, onActivated, ref } from "vue";
|
||||||
import { Virtual } from "swiper/modules";
|
import { Virtual } from "swiper/modules";
|
||||||
import { Swiper, SwiperSlide } from "swiper/vue";
|
import { Swiper, SwiperSlide } from "swiper/vue";
|
||||||
import XNotes from "@/components/MkNotes.vue";
|
import XNotes from "@/components/MkNotes.vue";
|
||||||
|
@ -107,22 +107,25 @@ import MkSearch from "@/components/MkSearch.vue";
|
||||||
import { mainRouter } from "@/router.js";
|
import { mainRouter } from "@/router.js";
|
||||||
import * as os from "@/os.js";
|
import * as os from "@/os.js";
|
||||||
|
|
||||||
const props = withDefaults(
|
const getUrlParams = () =>
|
||||||
defineProps<{
|
window.location.search
|
||||||
query: string;
|
.substring(1)
|
||||||
channel?: string;
|
.split("&")
|
||||||
}>(),
|
.reduce((result, query) => {
|
||||||
{
|
const [k, v] = query.split("=");
|
||||||
query: ""
|
result[k] = decodeURIComponent(v);
|
||||||
}
|
return result;
|
||||||
);
|
}, {});
|
||||||
|
|
||||||
|
let searchQuery = $ref<string>(getUrlParams()['q'] ?? "");
|
||||||
|
let channel = $ref<string|undefined>(getUrlParams()['channel'] ?? undefined);
|
||||||
|
|
||||||
const notesPagination = {
|
const notesPagination = {
|
||||||
endpoint: "notes/search" as const,
|
endpoint: "notes/search" as const,
|
||||||
limit: 10,
|
limit: 10,
|
||||||
params: computed(() => ({
|
params: computed(() => ({
|
||||||
query: props.query,
|
query: searchQuery,
|
||||||
channelId: props.channel,
|
channelId: channel,
|
||||||
})),
|
})),
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -130,7 +133,7 @@ const usersPagination = {
|
||||||
endpoint: "users/search" as const,
|
endpoint: "users/search" as const,
|
||||||
limit: 10,
|
limit: 10,
|
||||||
params: computed(() => ({
|
params: computed(() => ({
|
||||||
query: props.query,
|
query: searchQuery,
|
||||||
origin: "combined",
|
origin: "combined",
|
||||||
})),
|
})),
|
||||||
};
|
};
|
||||||
|
@ -170,7 +173,14 @@ function syncSlide(index) {
|
||||||
}
|
}
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
syncSlide(tabs.indexOf(swiperRef.activeIndex));
|
syncSlide(tabs.indexOf(tab));
|
||||||
|
});
|
||||||
|
|
||||||
|
onActivated(() => {
|
||||||
|
searchQuery = getUrlParams()['q'];
|
||||||
|
channel = getUrlParams()['channel'] ?? undefined;
|
||||||
|
|
||||||
|
syncSlide(tabs.indexOf(tab));
|
||||||
});
|
});
|
||||||
|
|
||||||
definePageMetadata(
|
definePageMetadata(
|
||||||
|
@ -211,6 +221,7 @@ async function search(query: string) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
searchQuery = q;
|
||||||
mainRouter.push(`/search?q=${encodeURIComponent(q)}`);
|
mainRouter.push(`/search?q=${encodeURIComponent(q)}`);
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -313,10 +313,6 @@ export const routes = [
|
||||||
{
|
{
|
||||||
path: "/search",
|
path: "/search",
|
||||||
component: page(() => import("./pages/search.vue")),
|
component: page(() => import("./pages/search.vue")),
|
||||||
query: {
|
|
||||||
q: "query",
|
|
||||||
channel: "channel",
|
|
||||||
},
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: "/authorize-follow",
|
path: "/authorize-follow",
|
||||||
|
|
Loading…
Reference in a new issue