rht02261548
This commit is contained in:
parent
49464054dc
commit
39fca369f4
|
@ -16,8 +16,9 @@ function useGetTaxonomy({ type }): GetTaxonomyProps {
|
|||
taxonomy: {
|
||||
slug: type,
|
||||
},
|
||||
parentId : null
|
||||
},
|
||||
take: 10, // 只取前10个
|
||||
take: 11, // 只取前10个
|
||||
});
|
||||
const categories = useMemo(() => {
|
||||
const allCategories = isLoading
|
||||
|
|
|
@ -30,7 +30,7 @@ interface PlatformStat {
|
|||
const HeroSection = () => {
|
||||
const carouselRef = useRef<CarouselRef>(null);
|
||||
const { statistics, slides } = useAppConfig();
|
||||
const [countStatistics, setCountStatistics] = useState<number>(0)
|
||||
const [countStatistics, setCountStatistics] = useState<number>(4)
|
||||
const platformStats: PlatformStat[] = useMemo(() => {
|
||||
return [
|
||||
{ icon: <TeamOutlined />, value: statistics.staffs, label: "注册学员" },
|
||||
|
@ -53,7 +53,7 @@ const HeroSection = () => {
|
|||
|
||||
useEffect(() => {
|
||||
const count = countNonZeroValues(statistics);
|
||||
//console.log(count);
|
||||
console.log(count);
|
||||
setCountStatistics(count);
|
||||
}, [statistics]);
|
||||
return (
|
||||
|
@ -111,7 +111,7 @@ const HeroSection = () => {
|
|||
{
|
||||
countStatistics > 1 && (
|
||||
<div className="absolute -bottom-20 left-1/2 -translate-x-1/2 w-3/5 max-w-6xl px-4">
|
||||
<div className={`rounded-2xl grid grid-cols-${countStatistics} md:grid-cols-${countStatistics} gap-4 md:gap-8 p-6 md:p-8 bg-white border shadow-xl hover:shadow-2xl transition-shadow duration-500 will-change-[transform,box-shadow]`}>
|
||||
<div className={`rounded-2xl grid grid-cols-${countStatistics} lg:grid-cols-${countStatistics} md:grid-cols-${countStatistics} gap-4 md:gap-8 p-6 md:p-8 bg-white border shadow-xl hover:shadow-2xl transition-shadow duration-500 will-change-[transform,box-shadow]`}>
|
||||
{platformStats.map((stat, index) => {
|
||||
return stat.value
|
||||
? (<div
|
||||
|
|
|
@ -49,10 +49,13 @@ export function CourseDetailProvider({
|
|||
(api.post as any).findFirst.useQuery(
|
||||
{
|
||||
where: { id: editId },
|
||||
include: {
|
||||
// sections: { include: { lectures: true } },
|
||||
enrollments: true,
|
||||
},
|
||||
// include: {
|
||||
// // sections: { include: { lectures: true } },
|
||||
// enrollments: true,
|
||||
// terms:true
|
||||
// },
|
||||
|
||||
select:courseDetailSelect
|
||||
},
|
||||
{ enabled: Boolean(editId) }
|
||||
);
|
||||
|
|
|
@ -1,14 +1,16 @@
|
|||
import { Course } from "@nice/common";
|
||||
import { Course, TaxonomySlug } from "@nice/common";
|
||||
import React, { useContext, useMemo } from "react";
|
||||
import { Image, Typography, Skeleton } from "antd"; // 引入 antd 组件
|
||||
import { Image, Typography, Skeleton, Tag } from "antd"; // 引入 antd 组件
|
||||
import { CourseDetailContext } from "./CourseDetailContext";
|
||||
import {
|
||||
CalendarOutlined,
|
||||
EditTwoTone,
|
||||
EyeOutlined,
|
||||
PlayCircleOutlined,
|
||||
ReloadOutlined,
|
||||
} from "@ant-design/icons";
|
||||
import dayjs from "dayjs";
|
||||
import { useNavigate } from "react-router-dom";
|
||||
import { useNavigate, useParams } from "react-router-dom";
|
||||
|
||||
export const CourseDetailDescription: React.FC = () => {
|
||||
const { course, isLoading, selectedLectureId, setSelectedLectureId } =
|
||||
|
@ -18,12 +20,14 @@ export const CourseDetailDescription: React.FC = () => {
|
|||
return course?.sections?.[0]?.lectures?.[0]?.id;
|
||||
}, [course]);
|
||||
const navigate = useNavigate();
|
||||
const { canEdit } = useContext(CourseDetailContext);
|
||||
const { id } = useParams();
|
||||
return (
|
||||
<div className="w-full bg-white shadow-md rounded-lg border border-gray-200 p-6">
|
||||
<div className="w-full bg-white shadow-md rounded-lg border border-gray-200 p-5 my-4">
|
||||
{isLoading || !course ? (
|
||||
<Skeleton active paragraph={{ rows: 4 }} />
|
||||
) : (
|
||||
<div className="space-y-4">
|
||||
<div className="space-y-2">
|
||||
{!selectedLectureId && (
|
||||
<>
|
||||
<div className="relative my-4 overflow-hidden flex justify-center items-center">
|
||||
|
@ -43,16 +47,61 @@ export const CourseDetailDescription: React.FC = () => {
|
|||
</>
|
||||
)}
|
||||
<div className="text-lg font-bold">{"课程简介:"}</div>
|
||||
<div className="text-gray-600 flex justify-start gap-4">
|
||||
<div className="flex gap-2 flex-wrap items-center">
|
||||
<div>{course?.subTitle}</div>
|
||||
<div className="flex gap-1">
|
||||
<EyeOutlined></EyeOutlined>
|
||||
<div>{course?.meta?.views || 0}</div>
|
||||
</div>
|
||||
{
|
||||
course.terms.map((term) => {
|
||||
return (
|
||||
<Tag
|
||||
key={term.id}
|
||||
// color={term.taxonomy.slug===TaxonomySlug.CATEGORY? "blue" : "green"}
|
||||
color={
|
||||
term?.taxonomy?.slug ===
|
||||
TaxonomySlug.CATEGORY
|
||||
? "blue"
|
||||
: term?.taxonomy?.slug ===
|
||||
TaxonomySlug.LEVEL
|
||||
? "green"
|
||||
: "orange"
|
||||
}
|
||||
className="px-3 py-1 rounded-full bg-blue-100 text-blue-600 border-0">
|
||||
{term.name}
|
||||
</Tag>
|
||||
)
|
||||
})
|
||||
}
|
||||
</div>
|
||||
<div className="text-gray-800 flex justify-start gap-5">
|
||||
|
||||
|
||||
<div className="flex gap-1">
|
||||
<CalendarOutlined></CalendarOutlined>
|
||||
{dayjs(course?.createdAt).format("YYYY年M月D日")}
|
||||
</div>
|
||||
<div className="flex gap-1">
|
||||
<ReloadOutlined></ReloadOutlined>
|
||||
{dayjs(course?.updatedAt).format("YYYY年M月D日")}
|
||||
</div>
|
||||
<div className="flex gap-1">
|
||||
<EyeOutlined></EyeOutlined>
|
||||
<div>{course?.meta?.views || 0}</div>
|
||||
</div>
|
||||
{
|
||||
canEdit && (
|
||||
<div
|
||||
className="flex gap-1 text-primary hover:cursor-pointer"
|
||||
onClick={() => {
|
||||
const url = id
|
||||
? `/course/${id}/editor`
|
||||
: "/course/editor";
|
||||
navigate(url);
|
||||
}}
|
||||
>
|
||||
<EditTwoTone></EditTwoTone>
|
||||
{"点击编辑课程"}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
</div>
|
||||
<Paragraph
|
||||
className="text-gray-600"
|
||||
|
|
|
@ -24,8 +24,8 @@ export function CourseDetailHeader() {
|
|||
|
||||
return (
|
||||
<Header className="select-none flex items-center justify-center bg-white shadow-md border-b border-gray-100 fixed w-full z-30">
|
||||
<div className="w-full flex items-center justify-between h-full">
|
||||
<div className="flex items-center space-x-2">
|
||||
<div className="w-full flex items-center justify-between h-full">
|
||||
<div className="flex items-center space-x-10">
|
||||
<HomeOutlined
|
||||
onClick={() => {
|
||||
navigate("/");
|
||||
|
@ -33,7 +33,7 @@ export function CourseDetailHeader() {
|
|||
className="text-2xl text-primary-500 hover:scale-105 cursor-pointer"
|
||||
/>
|
||||
|
||||
<div className="text-2xl font-bold bg-gradient-to-r from-primary-600 via-primary-500 to-primary-400 bg-clip-text text-transparent transition-transform ">
|
||||
<div className="text-2xl tracking-widest font-bold bg-gradient-to-r from-primary-600 via-primary-500 to-primary-400 bg-clip-text text-transparent transition-transform ">
|
||||
{course?.title}
|
||||
</div>
|
||||
{/* <NavigationMenu /> */}
|
||||
|
|
|
@ -111,7 +111,7 @@ export function CourseFormProvider({
|
|||
delete formattedValues.sections;
|
||||
delete formattedValues.deptIds;
|
||||
|
||||
console.log(course.meta);
|
||||
console.log(course?.meta);
|
||||
console.log(formattedValues?.meta);
|
||||
try {
|
||||
if (editId) {
|
||||
|
|
Loading…
Reference in New Issue