Merge branch 'main' of http://113.45.157.195:3003/insiinc/re-mooc
This commit is contained in:
commit
287bf31d0e
|
@ -69,7 +69,7 @@ export class TermRouter {
|
|||
const { staff } = ctx;
|
||||
return await this.termService.getParentSimpleTree(staff, input);
|
||||
}),
|
||||
getTreeData: this.trpc.protectProcedure
|
||||
getTreeData: this.trpc.procedure
|
||||
.input(TermMethodSchema.getTreeData)
|
||||
.query(async ({ input }) => {
|
||||
return await this.termService.getTreeData(input);
|
||||
|
|
|
@ -5,86 +5,26 @@ import { TaxonomySlug, TermDto } from "@nice/common";
|
|||
import { useEffect, useMemo } from "react";
|
||||
import { api } from "@nice/client";
|
||||
import { useSearchParams } from "react-router-dom";
|
||||
import TermTree from "@web/src/components/models/term/term-tree";
|
||||
import TermSelect from "@web/src/components/models/term/term-select";
|
||||
|
||||
interface FilterSectionProps {
|
||||
selectedCategory: string;
|
||||
selectedLevel: string;
|
||||
onCategoryChange: (category: string) => void;
|
||||
onLevelChange: (level: string) => void;
|
||||
}
|
||||
|
||||
interface GetTaxonomyProps {
|
||||
categories: string[];
|
||||
isLoading: boolean;
|
||||
}
|
||||
|
||||
function useGetTaxonomy({ type }): GetTaxonomyProps {
|
||||
const { data, isLoading }: { data: TermDto[]; isLoading: boolean } =
|
||||
api.term.findMany.useQuery({
|
||||
where: {
|
||||
taxonomy: {
|
||||
//TaxonomySlug.CATEGORY
|
||||
slug: type,
|
||||
},
|
||||
},
|
||||
include: {
|
||||
children: true,
|
||||
},
|
||||
take: 10, // 只取前10个
|
||||
orderBy: {
|
||||
createdAt: "desc", // 按创建时间降序排列
|
||||
},
|
||||
});
|
||||
const categories = useMemo(() => {
|
||||
const allCategories = isLoading
|
||||
? []
|
||||
: data?.map((course) => course.name);
|
||||
return [...Array.from(new Set(allCategories))];
|
||||
}, [data]);
|
||||
return { categories, isLoading };
|
||||
}
|
||||
|
||||
export default function FilterSection({
|
||||
selectedCategory,
|
||||
selectedLevel,
|
||||
onCategoryChange,
|
||||
onLevelChange,
|
||||
}: FilterSectionProps) {
|
||||
const gateGory: GetTaxonomyProps = useGetTaxonomy({
|
||||
type: TaxonomySlug.CATEGORY,
|
||||
});
|
||||
const levels: GetTaxonomyProps = useGetTaxonomy({
|
||||
type: TaxonomySlug.LEVEL,
|
||||
});
|
||||
|
||||
const [searchParams, setSearchParams] = useSearchParams();
|
||||
useEffect(() => {
|
||||
if (searchParams.get("category"))
|
||||
onCategoryChange(searchParams.get("category"));
|
||||
}, [searchParams.get("category")]);
|
||||
|
||||
export default function FilterSection() {
|
||||
const { data: taxonomies } = api.taxonomy.getAll.useQuery({});
|
||||
|
||||
return (
|
||||
<div className="bg-white p-6 rounded-lg shadow-sm space-y-6">
|
||||
{taxonomies?.map((tax) => {
|
||||
<div className="bg-white p-6 rounded-lg shadow-sm space-y-6 h-full">
|
||||
{taxonomies?.map((tax, index) => {
|
||||
return (
|
||||
<>
|
||||
<div>
|
||||
<h3 className="text-lg font-medium mb-4">
|
||||
{tax?.name}
|
||||
</h3>
|
||||
<TermSelect
|
||||
multiple
|
||||
taxonomyId={tax?.id}></TermSelect>
|
||||
</div>
|
||||
</>
|
||||
<div key={index}>
|
||||
<h3 className="text-lg font-medium mb-4">
|
||||
{tax?.name}
|
||||
</h3>
|
||||
<TermSelect multiple taxonomyId={tax?.id}></TermSelect>
|
||||
{index < taxonomies.length - 1 && (
|
||||
<Divider className="my-6" />
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
|
||||
<Divider className="my-6" />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
|
@ -0,0 +1,27 @@
|
|||
import { useMainContext } from "../../layout/MainProvider";
|
||||
import CourseList from "../components/CourseList";
|
||||
import FilterSection from "../components/FilterSection";
|
||||
|
||||
export function AllCoursesLayout() {
|
||||
const { searchValue, setSearchValue } = useMainContext();
|
||||
return (
|
||||
<>
|
||||
<div className="min-h-screen bg-gray-50">
|
||||
<div className=" flex">
|
||||
<div className="w-1/6">
|
||||
<FilterSection></FilterSection>
|
||||
</div>
|
||||
<div className="w-5/6 p-4">
|
||||
<CourseList
|
||||
cols={4}
|
||||
params={{
|
||||
page: 1,
|
||||
pageSize: 12,
|
||||
}}></CourseList>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
export default AllCoursesLayout;
|
|
@ -11,24 +11,16 @@ import {
|
|||
import { useSearchParams } from "react-router-dom";
|
||||
import { set } from "idb-keyval";
|
||||
import { useMainContext } from "../layout/MainProvider";
|
||||
import AllCoursesLayout from "./layout/AllCoursesLayout";
|
||||
|
||||
interface paginationData {
|
||||
items: CourseDto[];
|
||||
totalPages: number;
|
||||
}
|
||||
export default function CoursesPage() {
|
||||
const { searchValue, setSearchValue } = useMainContext();
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="min-h-screen bg-gray-50">
|
||||
<div>{searchValue}</div>
|
||||
<CourseList
|
||||
params={{
|
||||
page: 1,
|
||||
pageSize: 12,
|
||||
}}></CourseList>
|
||||
</div>
|
||||
<AllCoursesLayout></AllCoursesLayout>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
|
|
@ -10,8 +10,6 @@ interface TermSelectProps {
|
|||
onChange?: (value: string | string[]) => void;
|
||||
placeholder?: string;
|
||||
multiple?: boolean;
|
||||
// rootId?: string;
|
||||
// domain?: boolean;
|
||||
taxonomyId?: string;
|
||||
disabled?: boolean;
|
||||
className?: string;
|
||||
|
@ -27,9 +25,7 @@ export default function TermSelect({
|
|||
multiple = false,
|
||||
taxonomyId,
|
||||
domainId,
|
||||
// rootId = null,
|
||||
disabled = false,
|
||||
// domain = undefined,
|
||||
}: TermSelectProps) {
|
||||
const utils = api.useUtils();
|
||||
const [listTreeData, setListTreeData] = useState<
|
||||
|
@ -125,20 +121,9 @@ export default function TermSelect({
|
|||
};
|
||||
|
||||
const handleExpand = async (keys: React.Key[]) => {
|
||||
// console.log(keys);
|
||||
try {
|
||||
const allKeyIds =
|
||||
keys.map((key) => key.toString()).filter(Boolean) || [];
|
||||
// const expandedNodes = await Promise.all(
|
||||
// keys.map(async (key) => {
|
||||
// return await utils.department.getChildSimpleTree.fetch({
|
||||
// deptId: key.toString(),
|
||||
// domain,
|
||||
// });
|
||||
// })
|
||||
// );
|
||||
//
|
||||
//上面那样一个个拉会拉爆,必须直接拉deptIds
|
||||
const expandedNodes = await utils.term.getChildSimpleTree.fetch({
|
||||
termIds: allKeyIds,
|
||||
taxonomyId,
|
||||
|
@ -154,7 +139,6 @@ export default function TermSelect({
|
|||
console.error("Error expanding nodes with keys", keys, ":", error);
|
||||
}
|
||||
};
|
||||
|
||||
const handleDropdownVisibleChange = async (open: boolean) => {
|
||||
if (open) {
|
||||
// This will attempt to expand all nodes and fetch their children when the dropdown opens
|
||||
|
@ -162,7 +146,6 @@ export default function TermSelect({
|
|||
await handleExpand(allKeys);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<TreeSelect
|
||||
treeDataSimpleMode
|
||||
|
|
Loading…
Reference in New Issue