This commit is contained in:
Li1304553726 2025-05-09 10:01:51 +08:00
parent 84a5066097
commit 271f2e081e
5 changed files with 169 additions and 107 deletions

View File

@ -67,7 +67,10 @@ export function VideoContent() {
document: { label: "文档", extensions: ["doc", "docx", "pdf", "txt"] }, document: { label: "文档", extensions: ["doc", "docx", "pdf", "txt"] },
spreadsheet: { label: "表格", extensions: ["xls", "xlsx", "csv"] }, spreadsheet: { label: "表格", extensions: ["xls", "xlsx", "csv"] },
presentation: { label: "ppt", extensions: ["ppt", "pptx"] }, presentation: { label: "ppt", extensions: ["ppt", "pptx"] },
video: { label: "音视频", extensions: ["mp4", "avi", "mov", "webm","mp3", "wav", "ogg"] }, video: {
label: "音视频",
extensions: ["mp4", "avi", "mov", "webm", "mp3", "wav", "ogg"],
},
archive: { label: "压缩包", extensions: ["zip", "rar", "7z"] }, archive: { label: "压缩包", extensions: ["zip", "rar", "7z"] },
}; };

View File

@ -14,7 +14,7 @@ export function ExampleContent() {
const [loading, setLoading] = useState(true); const [loading, setLoading] = useState(true);
const [currentPage, setCurrentPage] = useState(1); const [currentPage, setCurrentPage] = useState(1);
const [searchTerm, setSearchTerm] = useState(""); const [searchTerm, setSearchTerm] = useState("");
const pageSize = 6; // 每页显示5条案例 const pageSize = 10; // 每页显示5条案例
const isDomainAdmin = useMemo(() => { const isDomainAdmin = useMemo(() => {
return hasSomePermissions("MANAGE_DOM_STAFF", "MANAGE_ANY_STAFF"); return hasSomePermissions("MANAGE_DOM_STAFF", "MANAGE_ANY_STAFF");
}, [hasSomePermissions]); }, [hasSomePermissions]);

View File

@ -14,7 +14,7 @@ export function PublicityContent() {
const [loading, setLoading] = useState(true); const [loading, setLoading] = useState(true);
const [currentPage, setCurrentPage] = useState(1); const [currentPage, setCurrentPage] = useState(1);
const [searchTerm, setSearchTerm] = useState(""); const [searchTerm, setSearchTerm] = useState("");
const pageSize = 6; // 每页显示5条新闻 const pageSize = 10; // 每页显示5条新闻
const isDomainAdmin = useMemo(() => { const isDomainAdmin = useMemo(() => {
return hasSomePermissions("MANAGE_DOM_STAFF", "MANAGE_ANY_STAFF"); return hasSomePermissions("MANAGE_DOM_STAFF", "MANAGE_ANY_STAFF");
}, [hasSomePermissions]); }, [hasSomePermissions]);

View File

@ -14,7 +14,7 @@ export function ScienceContent() {
const [loading, setLoading] = useState(true); const [loading, setLoading] = useState(true);
const [currentPage, setCurrentPage] = useState(1); const [currentPage, setCurrentPage] = useState(1);
const [searchTerm, setSearchTerm] = useState(""); const [searchTerm, setSearchTerm] = useState("");
const pageSize = 6; // 每页显示5条科普 const pageSize = 10; // 每页显示5条科普
const isDomainAdmin = useMemo(() => { const isDomainAdmin = useMemo(() => {
return hasSomePermissions("MANAGE_DOM_STAFF", "MANAGE_ANY_STAFF"); return hasSomePermissions("MANAGE_DOM_STAFF", "MANAGE_ANY_STAFF");
}, [hasSomePermissions]); }, [hasSomePermissions]);

View File

@ -1,24 +1,48 @@
import { useState, useEffect, useMemo } from "react"; import { useState, useEffect, useMemo } from "react";
import { Input, Pagination, Empty, Spin } from "antd"; import { Input, Pagination, Empty, Spin, Radio, Space, Tag } from "antd";
import { api, RouterInputs } from "@nice/client"; import { api, RouterInputs } from "@nice/client";
import { LetterCard } from "../LetterCard"; import { LetterCard } from "../LetterCard";
import { NonVoid } from "@nice/utils"; import { NonVoid } from "@nice/utils";
import { SearchOutlined } from "@ant-design/icons"; import { SearchOutlined, FilterOutlined } from "@ant-design/icons";
import debounce from "lodash/debounce"; import debounce from "lodash/debounce";
import { postDetailSelect } from "@nice/common"; import { postDetailSelect } from "@nice/common";
export default function LetterList({ export default function LetterList({
params, params,
search = '' search = "",
}: { }: {
search?: string, search?: string;
params: NonVoid<RouterInputs["post"]["findManyWithPagination"]>; params: NonVoid<RouterInputs["post"]["findManyWithPagination"]>;
}) { }) {
const [keyword, setKeyword] = useState<string | undefined>(''); const [keyword, setKeyword] = useState<string | undefined>("");
const [currentPage, setCurrentPage] = useState(1); const [currentPage, setCurrentPage] = useState(1);
useEffect(() => { const [selectedCategory, setSelectedCategory] = useState<string>("all");
const { data: categoriesData } = api.term.findMany.useQuery({
where: {
taxonomy: {
slug: "category",
},
},
});
const categoryOptions = useMemo(() => {
const options = [{ value: "all", label: "全部分类" }];
if (categoriesData) {
categoriesData.forEach((category) => {
options.push({
value: category.id,
label: category.name,
});
});
}
return options;
}, [categoriesData]);
useEffect(() => {
setKeyword(search || "");
}, [search]);
setKeyword(search || '')
}, [search])
const { data, isLoading } = api.post.findManyWithPagination.useQuery({ const { data, isLoading } = api.post.findManyWithPagination.useQuery({
page: currentPage, page: currentPage,
pageSize: params.pageSize, pageSize: params.pageSize,
@ -30,6 +54,15 @@ export default function LetterList({
}, },
}, },
], ],
...(selectedCategory !== "all"
? {
terms: {
some: {
id: selectedCategory,
},
},
}
: {}),
...params?.where, ...params?.where,
}, },
orderBy: { orderBy: {
@ -49,26 +82,51 @@ export default function LetterList({
}, 300), }, 300),
[] []
); );
// Cleanup debounce on unmount
useEffect(() => { useEffect(() => {
return () => { return () => {
debouncedSearch.cancel(); debouncedSearch.cancel();
}; };
}, [debouncedSearch]); }, [debouncedSearch]);
const handleSearch = (value: string) => { const handleSearch = (value: string) => {
debouncedSearch(value); debouncedSearch(value);
}; };
const handlePageChange = (page: number) => { const handlePageChange = (page: number) => {
setCurrentPage(page); setCurrentPage(page);
// Scroll to top when page changes
window.scrollTo({ top: 0, behavior: "smooth" }); window.scrollTo({ top: 0, behavior: "smooth" });
}; };
const handleCategoryChange = (value: string) => {
setSelectedCategory(value);
setCurrentPage(1);
};
return ( return (
<div className="flex flex-col h-full"> <div className="flex flex-col h-full">
{/* Search Bar */} <div className="p-6 transition-all">
<div className="p-6 transition-all "> <div className="flex items-center mb-4">
<Radio.Group
value={selectedCategory}
onChange={(e) => handleCategoryChange(e.target.value)}
optionType="button"
buttonStyle="solid"
className="flex-wrap"
>
{categoryOptions.map((option) => (
<Radio.Button
key={option.value}
value={option.value}
className="my-1"
>
{option.label}
</Radio.Button>
))}
</Radio.Group>
</div>
<Space direction="vertical" className="w-full" size="middle">
<Input <Input
value={keyword} value={keyword}
variant="filled" variant="filled"
@ -79,9 +137,9 @@ export default function LetterList({
onChange={(e) => handleSearch(e.target.value)} onChange={(e) => handleSearch(e.target.value)}
prefix={<SearchOutlined className="text-gray-400" />} prefix={<SearchOutlined className="text-gray-400" />}
/> />
</Space>
</div> </div>
{/* Content Area */}
<div className="flex-grow px-6"> <div className="flex-grow px-6">
{isLoading ? ( {isLoading ? (
<div className="flex justify-center items-center pt-6"> <div className="flex justify-center items-center pt-6">
@ -108,9 +166,10 @@ export default function LetterList({
) : ( ) : (
<div className="flex flex-col justify-center items-center pt-6"> <div className="flex flex-col justify-center items-center pt-6">
<Empty <Empty
description={ description={
keyword ? "未找到相关信件" : "暂无信件" keyword || selectedCategory !== "all"
? "未找到相关信件"
: "暂无信件"
} }
/> />
</div> </div>