Merge branch 'main' of http://113.45.157.195:3003/insiinc/re-mooc

2025-02-26 16:11:10 +08:00 · 2025-02-26 16:11:10 +08:00 · 5c943711a4
parent 37da7cbbf8 5391ddbb3a
commit 5c943711a4
10 changed files with 83 additions and 36 deletions
--- a/apps/web/src/app/main/courses/components/CourseCard.tsx
+++ b/apps/web/src/app/main/courses/components/CourseCard.tsx
@ -24,8 +24,7 @@ export default function CourseCard({ course }: CourseCardProps) {
 			onClick={() => handleClick(course)}
 			key={course.id}
 			hoverable
-			className="group overflow-hidden rounded-2xl border border-gray-200 bg-white 
-      shadow-xl hover:shadow-2xl transition-all duration-300 transform hover:-translate-y-2"
+			className="group overflow-hidden rounded-2xl border border-gray-200 bg-white shadow-xl hover:shadow-2xl transition-all duration-300 transform hover:-translate-y-2"
 			cover={
 				<div className="relative h-56 bg-gradient-to-br from-gray-900 to-gray-800 overflow-hidden">
 					<div
@ -48,10 +47,10 @@ export default function CourseCard({ course }: CourseCardProps) {
 								// color={term.taxonomy.slug===TaxonomySlug.CATEGORY? "blue" : "green"}
 								color={
 									term?.taxonomy?.slug ===
-									TaxonomySlug.CATEGORY
+										TaxonomySlug.CATEGORY
 										? "blue"
 										: term?.taxonomy?.slug ===
-											  TaxonomySlug.LEVEL
+											TaxonomySlug.LEVEL
 											? "green"
 											: "orange"
 								}
--- a/apps/web/src/app/main/home/components/CategorySection.tsx
+++ b/apps/web/src/app/main/home/components/CategorySection.tsx
@ -43,7 +43,7 @@ const CategorySection = () => {
 	return (
 		<section className="py-8 relative overflow-hidden">
 			<div className="max-w-screen-2xl mx-auto px-4 relative">
-				<div className="text-center mb-24">
+				<div className="text-center mb-12">
 					<Title
 						level={2}
 						className="font-bold text-5xl mb-6 bg-gradient-to-r from-gray-900 via-gray-700 to-gray-800 bg-clip-text text-transparent motion-safe:animate-gradient-x">
--- a/apps/web/src/app/main/home/components/CoursesSection.tsx
+++ b/apps/web/src/app/main/home/components/CoursesSection.tsx
@ -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
@ -43,16 +44,16 @@ const CoursesSection: React.FC<CoursesSectionProps> = ({
 		type: TaxonomySlug.CATEGORY,
 	});
 	return (
-		<section className="relative py-20 overflow-hidden bg-gradient-to-b from-gray-50 to-white">
+    <section className="relative py-16 overflow-hidden bg-gray-200">
+      <div className="absolute inset-0 bg-white max-w-screen-2xl mx-auto px-6"></div>
 			<div className="max-w-screen-2xl mx-auto px-6 relative">
-				<div className="flex justify-between items-end mb-16">
+				<div className="flex justify-between items-end mb-16 ">
 					<div>
 						<Title
 							level={2}
 							className="font-bold text-5xl mb-6 bg-gradient-to-r from-blue-600 to-purple-600 bg-clip-text text-transparent">
 							{title}
 						</Title>
-					
 						<Text
 							type="secondary"
 							className="text-xl font-light text-gray-600">
--- a/apps/web/src/app/main/home/components/HeroSection.tsx
+++ b/apps/web/src/app/main/home/components/HeroSection.tsx
@ -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: "注册学员" },
@ -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
--- a/apps/web/src/app/main/layout/MainLayout.tsx
+++ b/apps/web/src/app/main/layout/MainLayout.tsx
@ -11,7 +11,7 @@ export function MainLayout() {
 		<MainProvider>
 			<Layout className="min-h-screen  bg-gray-100">
 				<MainHeader />
-				<Content className="mt-16 bg-gray-50 ">
+				<Content className="mt-16 bg-gray-200 ">
 					<Outlet />
 				</Content>
 				<MainFooter />
--- a/apps/web/src/components/models/course/detail/CourseDetailContext.tsx
+++ b/apps/web/src/components/models/course/detail/CourseDetailContext.tsx
@ -50,10 +50,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) }
 		);
--- a/apps/web/src/components/models/course/detail/CourseDetailDescription.tsx
+++ b/apps/web/src/components/models/course/detail/CourseDetailDescription.tsx
@ -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"
--- a/apps/web/src/components/models/course/detail/CourseDetailHeader/CourseDetailHeader.tsx
+++ b/apps/web/src/components/models/course/detail/CourseDetailHeader/CourseDetailHeader.tsx
@ -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 /> */}
--- a/apps/web/src/components/models/course/editor/context/CourseEditorContext.tsx
+++ b/apps/web/src/components/models/course/editor/context/CourseEditorContext.tsx
@ -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) {
--- a/apps/web/src/components/models/term/term-parent-selector.tsx
+++ b/apps/web/src/components/models/term/term-parent-selector.tsx
@ -2,7 +2,6 @@ import { api } from "@nice/client/";
 import { Checkbox, Form } from "antd";
 import { TermDto } from "@nice/common";
 import { useCallback, useEffect, useState } from "react";
-
 export default function TermParentSelector({
    value,
    onChange,
@ -13,11 +12,7 @@ export default function TermParentSelector({
    domainId,
    style,
 }: any) {
-    const utils = api.useUtils();
    const [selectedValues, setSelectedValues] = useState<string[]>([]); // 用于存储选中的值
-    const [termsData, setTermsData] = useState<any[]>([]);
-
-
    const {
        data,
        isLoading,
@ -42,7 +37,7 @@ export default function TermParentSelector({
                    <Checkbox.Group onChange={handleCheckboxChange}>
                        {data?.map((category) => (
                            <div className="w-full h-9 p-2 my-1">
-                                <Checkbox className="text-base text-slate-700"  key={category.id} value={category.id}>
+                                <Checkbox className="text-base text-slate-700" key={category.id} value={category.id}>
                                    {category.name}
                                </Checkbox>
                            </div>