HyperNet/Interactive
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

✨ Add page number in query string

Browse Source
This commit is contained in:
LittleSheep 2024-02-15 18:37:27 +08:00
parent 520ab738f9
commit 34cb534342
2 changed files with 45 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

49
pkg/view/src/pages/account.tsx
View File

@ -1,11 +1,12 @@
import { createSignal, Show } from "solid-js"; import { createEffect, createSignal, Show } from "solid-js";
import { useParams } from "@solidjs/router"; import { useParams } from "@solidjs/router";
import { useSearchParams } from "@solidjs/router";
import { createStore } from "solid-js/store";
import { closeModel, openModel } from "../scripts/modals.ts";
import PostList from "../components/posts/PostList.tsx"; import PostList from "../components/posts/PostList.tsx";
import NameCard from "../components/NameCard.tsx"; import NameCard from "../components/NameCard.tsx";
import PostPublish from "../components/posts/PostPublish.tsx"; import PostPublish from "../components/posts/PostPublish.tsx";
import { createStore } from "solid-js/store";
import { closeModel, openModel } from "../scripts/modals.ts";
export default function AccountPage() { export default function AccountPage() {
const [error, setError] = createSignal<string | null>(null); const [error, setError] = createSignal<string | null>(null);
@ -13,15 +14,23 @@ export default function AccountPage() {
const [page, setPage] = createSignal(0); const [page, setPage] = createSignal(0);
const [info, setInfo] = createSignal<any>(null); const [info, setInfo] = createSignal<any>(null);
const [searchParams, setSearchParams] = useSearchParams();
const params = useParams(); const params = useParams();
createEffect(() => {
setPage(parseInt(searchParams["page"] ?? "1"));
}, [searchParams]);
async function readPosts(pn?: number) { async function readPosts(pn?: number) {
if (pn) setPage(pn); if (pn) setSearchParams({ page: pn });
const res = await fetch("/api/posts?" + new URLSearchParams({ const res = await fetch(
take: (10).toString(), "/api/posts?" +
offset: ((page() - 1) * 10).toString(), new URLSearchParams({
authorId: params["accountId"] take: searchParams["take"] ? searchParams["take"] : (10).toString(),
})); offset: searchParams["offset"] ? searchParams["offset"] : ((page() - 1) * 10).toString(),
authorId: params["accountId"],
}),
);
if (res.status !== 200) { if (res.status !== 200) {
setError(await res.text()); setError(await res.text());
} else { } else {
@ -34,7 +43,7 @@ export default function AccountPage() {
const meta: { [id: string]: any } = { const meta: { [id: string]: any } = {
reposting: null, reposting: null,
replying: null, replying: null,
editing: null editing: null,
}; };
meta[field] = data; meta[field] = data;
setPublishMeta(meta); setPublishMeta(meta);
@ -46,7 +55,7 @@ export default function AccountPage() {
const [publishMeta, setPublishMeta] = createStore<any>({ const [publishMeta, setPublishMeta] = createStore<any>({
replying: null, replying: null,
reposting: null, reposting: null,
editing: null editing: null,
}); });
return ( return (
@ -54,10 +63,18 @@ export default function AccountPage() {
<div id="alerts"> <div id="alerts">
<Show when={error()}> <Show when={error()}>
<div role="alert" class="alert alert-error"> <div role="alert" class="alert alert-error">
<svg xmlns="http://www.w3.org/2000/svg" class="stroke-current shrink-0 h-6 w-6" fill="none" <svg
viewBox="0 0 24 24"> xmlns="http://www.w3.org/2000/svg"
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" class="stroke-current shrink-0 h-6 w-6"
d="M10 14l2-2m0 0l2-2m-2 2l-2-2m2 2l2 2m7-2a9 9 0 11-18 0 9 9 0 0118 0z" /> fill="none"
viewBox="0 0 24 24"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M10 14l2-2m0 0l2-2m-2 2l-2-2m2 2l2 2m7-2a9 9 0 11-18 0 9 9 0 0118 0z"
/>
</svg> </svg>
<span class="capitalize">{error()}</span> <span class="capitalize">{error()}</span>
</div> </div>
@ -89,4 +106,4 @@ export default function AccountPage() {
/> />
</> </>
); );
} }

17
pkg/view/src/pages/global.tsx
View File

@ -1,8 +1,9 @@
import { createSignal, Show } from "solid-js"; import { createEffect, createSignal, Show } from "solid-js";
import { createStore } from "solid-js/store";
import { useSearchParams } from "@solidjs/router";
import PostList from "../components/posts/PostList.tsx"; import PostList from "../components/posts/PostList.tsx";
import PostPublish from "../components/posts/PostPublish.tsx"; import PostPublish from "../components/posts/PostPublish.tsx";
import { createStore } from "solid-js/store";
export default function DashboardPage() { export default function DashboardPage() {
const [error, setError] = createSignal<string | null>(null); const [error, setError] = createSignal<string | null>(null);
@ -10,13 +11,19 @@ export default function DashboardPage() {
const [page, setPage] = createSignal(0); const [page, setPage] = createSignal(0);
const [info, setInfo] = createSignal<any>(null); const [info, setInfo] = createSignal<any>(null);
const [searchParams, setSearchParams] = useSearchParams();
createEffect(() => {
setPage(parseInt(searchParams["page"] ?? "1"));
}, [searchParams]);
async function readPosts(pn?: number) { async function readPosts(pn?: number) {
if (pn) setPage(pn); if (pn) setSearchParams({ page: pn });
const res = await fetch( const res = await fetch(
"/api/posts?" + "/api/posts?" +
new URLSearchParams({ new URLSearchParams({
take: (10).toString(), take: searchParams["take"] ? searchParams["take"] : (10).toString(),
offset: ((page() - 1) * 10).toString(), offset: searchParams["offset"] ? searchParams["offset"] : ((page() - 1) * 10).toString(),
reply: false.toString(), reply: false.toString(),
}), }),
); );