diff --git a/apps/web/src/components/models/course/editor/form/CourseContentForm copy.tsx b/apps/web/src/components/models/course/editor/form/CourseContentForm copy.tsx
index e5c5dbc..8ab2ad2 100644
--- a/apps/web/src/components/models/course/editor/form/CourseContentForm copy.tsx	
+++ b/apps/web/src/components/models/course/editor/form/CourseContentForm copy.tsx	
@@ -5,8 +5,17 @@ import {
 	CaretRightOutlined,
 	SaveOutlined,
 } from "@ant-design/icons";
-import { Form, Alert, Button, Input, Select, Space, Collapse, message } from "antd";
-import React, { useState } from "react";
+import {
+	Form,
+	Alert,
+	Button,
+	Input,
+	Select,
+	Space,
+	Collapse,
+	message,
+} from "antd";
+import React, { useCallback, useEffect, useState } from "react";
 import {
 	DndContext,
 	closestCenter,
@@ -14,8 +23,9 @@ import {
 	PointerSensor,
 	useSensor,
 	useSensors,
+	DragEndEvent,
 } from "@dnd-kit/core";
-import { usePost } from "@nice/client";
+import { api, emitDataChange } from "@nice/client";
 import {
 	arrayMove,
 	SortableContext,
@@ -26,9 +36,27 @@ import {
 import { CSS } from "@dnd-kit/utilities";
 import QuillEditor from "../../../../common/editor/quill/QuillEditor";
 import { TusUploader } from "../../../../common/uploader/TusUploader";
-import { LectureType } from "@nice/common";
+import { Lecture, LectureType, PostType } from "@nice/common";
 import { useCourseEditor } from "../context/CourseEditorContext";
+import { usePost } from "@nice/client";
+import toast from "react-hot-toast";
+interface SectionData {
+	id: string;
+	title: string;
+	content?: string;
+	courseId?: string;
+}
 
+interface LectureData {
+	id: string;
+	title: string;
+	meta?: {
+		type?: LectureType;
+		fieldIds?: [];
+	};
+	content?: string;
+	sectionId?: string;
+}
 const CourseContentFormHeader = () => (
 	<Alert
 		type="info"
@@ -57,236 +85,356 @@ const CourseSectionEmpty = () => (
 	</div>
 );
 
-const SortableSection = ({ id, field, remove, children }: any) => {
-	const { attributes, listeners, setNodeRef, transform, transition } =
-		useSortable({ id });
-	const [form] = Form.useForm();
-	const { update, create } = usePost();
-	const [loading, setLoading] = useState(false);
+interface SortableSectionProps {
+	courseId?: string;
+	field: SectionData;
+	remove: () => void;
+	children: React.ReactNode;
+}
 
-	const style = {
-		transform: CSS.Transform.toString(transform),
+const SortableSection: React.FC<SortableSectionProps> = ({
+	field,
+	remove,
+	courseId,
+	children,
+}) => {
+	const {
+		attributes,
+		listeners,
+		setNodeRef,
+		transform,
 		transition,
-	};
+		isDragging,
+	} = useSortable({ id: field?.id });
+
+	const [form] = Form.useForm();
+	const [editing, setEditing] = useState(field.id ? false : true);
+	const [loading, setLoading] = useState(false);
+	const { create, update } = usePost();
 
 	const handleSave = async () => {
+		if (!courseId) {
+			toast.error("课程未创建，请先填写课程基本信息完成创建");
+			return;
+		}
 		try {
-			const values = await form.validateFields();
 			setLoading(true);
-			
-			if (values.id) {
-				// await update({ ...values, type: 'section' });
-				message.success('章节更新成功');
-			} else {
-				// await create({ ...values, type: 'section' });
-				message.success('章节创建成功');
+			const values = await form.validateFields();
+			let result;
+			try {
+				if (!field?.id) {
+					result = await create.mutateAsync({
+						data: {
+							title: values?.title,
+							type: PostType.SECTION,
+							parentId: courseId,
+						},
+					});
+				} else {
+					result = await update.mutateAsync({
+						data: {
+							title: values?.title,
+						},
+					});
+				}
+			} catch (err) {
+				console.log(err);
 			}
-		} catch (error: any) {
-			message.error(error.message || '保存失败');
+
+			field.id = result.id;
+			setEditing(false);
+			message.success("保存成功");
+		} catch (error) {
+			console.log(error);
+			message.error("保存失败");
 		} finally {
 			setLoading(false);
 		}
 	};
 
-	const items = [
-		{
-			key: field.name,
-			label: (
-				<Form
-					form={form}
-					initialValues={field.value}>
-					<div className="flex items-center justify-between flex-1">
-						<Form.Item
-							name="title"
-							rules={[{ required: true, message: "请输入章节标题" }]}
-							className="mb-0 flex-1 mr-4">
-							<Input placeholder="输入章节标题" />
-						</Form.Item>
-						<div className="flex items-center gap-2">
-							<Button
-								type="primary"
-								icon={<SaveOutlined />}
-								loading={loading}
-								onClick={handleSave}>
-								保存
-							</Button>
-							<span
-								{...listeners}
-								{...attributes}
-								className="cursor-move">
-								<DragOutlined className="text-gray-400 hover:text-gray-600" />
-							</span>
-							<DeleteOutlined
-								onClick={() => remove(field.name)}
-								className="text-red-500 cursor-pointer"
-							/>
-						</div>
-					</div>
-				</Form>
-			),
-			children: <div className="mt-4">{children}</div>,
-		},
-	];
-
-	return (
-		<div ref={setNodeRef} style={style} className="mb-4">
-			<Collapse
-				items={items}
-				defaultActiveKey={[field.name]}
-				expandIcon={({ isActive }) => (
-					<CaretRightOutlined rotate={isActive ? 90 : 0} />
-				)}
-				className="bg-gray-50"
-			/>
-		</div>
-	);
-};
-
-const SortableLecture = ({ id, field, remove, sectionId }: any) => {
-	const { attributes, listeners, setNodeRef, transform, transition } =
-		useSortable({ id });
-
 	const style = {
 		transform: CSS.Transform.toString(transform),
 		transition,
+		backgroundColor: isDragging ? "#f5f5f5" : undefined,
 	};
 
-	const { form, taxonomies } = useCourseEditor();
-	const lectureType =
-		Form.useWatch(
-			["sections", sectionId, "lectures", field.name, "type"],
-			form
-		) || LectureType.VIDEO;
-
-	const renderLabel = () => (
-		<div className="flex items-center justify-between w-full">
-			<Form.Item
-				{...field}
-				name={[field.name, "title"]}
-				rules={[{ required: true, message: "请输入课时标题" }]}
-				className="mb-0 flex-1 mr-4">
-				<Input placeholder="输入课时标题" />
-			</Form.Item>
-			<Form.Item
-				{...field}
-				name={[field.name, "type"]}
-				rules={[{ required: true }]}
-				initialValue={LectureType.VIDEO}
-				className="mb-0 w-32">
-				<Select
-					options={[
-						{ label: "视频", value: LectureType.VIDEO },
-						{ label: "文章", value: LectureType.ARTICLE },
-					]}
-				/>
-			</Form.Item>
-			<div className="flex items-center">
-				<DeleteOutlined
-					onClick={() => remove(field.name)}
-					className="text-red-500 cursor-pointer mx-2"
-				/>
-				<span {...listeners} {...attributes} className="cursor-move">
-					<DragOutlined className="text-gray-400 hover:text-gray-600" />
-				</span>
-			</div>
-		</div>
-	);
-
-	const renderContent = () => (
-		<div className="mt-4">
-			{lectureType === LectureType.ARTICLE && (
-				<Form.Item
-					{...field}
-					name={[field.name, "content"]}
-					rules={[{ required: true, message: "请输入文章内容" }]}>
-					<QuillEditor />
-				</Form.Item>
-			)}
-
-			{lectureType === LectureType.VIDEO && (
-				<Form.Item
-					{...field}
-					name={[field.name, "resourceIds"]}
-					rules={[{ required: true, message: "请上传视频" }]}>
-					<TusUploader />
-				</Form.Item>
-			)}
-		</div>
-	);
-
 	return (
 		<div ref={setNodeRef} style={style} className="mb-4">
-			<Collapse
-				defaultActiveKey={[field.key]}
-				expandIcon={({ isActive }) => (
-					<CaretRightOutlined rotate={isActive ? 90 : 0} />
-				)}
-				className="bg-white shadow-sm border">
-				<Collapse.Panel key={field.key} header={renderLabel()}>
-					{renderContent()}
+			<Collapse>
+				<Collapse.Panel
+					header={
+						editing ? (
+							<Form
+								form={form}
+								className="flex items-center gap-4">
+								<Form.Item
+									name="title"
+									className="mb-0 flex-1"
+									initialValue={field?.title}>
+									<Input placeholder="章节标题" />
+								</Form.Item>
+								<Space>
+									<Button
+										onClick={handleSave}
+										loading={loading}
+										icon={<SaveOutlined />}
+										type="primary">
+										保存
+									</Button>
+									<Button
+										onClick={() => {
+											setEditing(false);
+											if (!field?.id) {
+												remove();
+											}
+										}}>
+										取消
+									</Button>
+								</Space>
+							</Form>
+						) : (
+							<div className="flex items-center justify-between">
+								<Space>
+									<DragOutlined
+										{...attributes}
+										{...listeners}
+										className="cursor-move"
+									/>
+									<span>{field.title || "未命名章节"}</span>
+								</Space>
+								<Space>
+									<Button
+										type="link"
+										onClick={() => setEditing(true)}>
+										编辑
+									</Button>
+									<Button type="link" danger onClick={remove}>
+										删除
+									</Button>
+								</Space>
+							</div>
+						)
+					}
+					key={field.id || "new"}>
+					{children}
 				</Collapse.Panel>
 			</Collapse>
 		</div>
 	);
 };
 
-const LectureList = ({ field }: any) => {
-	const sensors = useSensors(
-		useSensor(PointerSensor),
-		useSensor(KeyboardSensor, {
-			coordinateGetter: sortableKeyboardCoordinates,
-		})
-	);
+interface SortableLectureProps {
+	field: LectureData;
+	remove: () => void;
+	sectionFieldKey: string;
+}
+
+const SortableLecture: React.FC<SortableLectureProps> = ({
+	field,
+	remove,
+	sectionFieldKey,
+}) => {
+	const {
+		attributes,
+		listeners,
+		setNodeRef,
+		transform,
+		transition,
+		isDragging,
+	} = useSortable({ id: field?.id });
+	const { create, update } = usePost();
+	const [form] = Form.useForm();
+	const [editing, setEditing] = useState(field?.id ? false : true);
+	const [loading, setLoading] = useState(false);
+	const lectureType =
+		Form.useWatch(["meta", "type"], form) || LectureType.ARTICLE;
+	const handleSave = async () => {
+		try {
+			setLoading(true);
+			const values = await form.validateFields();
+			let result;
+			try {
+				if (!field.id) {
+					result = await create.mutateAsync({
+						data: {
+							parentId: sectionFieldKey,
+							type: PostType.LECTURE,
+							title: values?.title,
+							meta: {
+								type: values?.meta?.type,
+								fileIds: values?.meta?.fileIds,
+							},
+							resources: {
+								connect: (values?.meta?.fileIds || []).map(
+									(fileId) => ({
+										fileId,
+									})
+								),
+							},
+							content: values?.content,
+						},
+					});
+				} else {
+					result = await update.mutateAsync({
+						where: {
+							id: field?.id,
+						},
+						data: {
+							title: values?.title,
+							meta: {
+								type: values?.meta?.type,
+								fieldIds: values?.meta?.fileIds,
+							},
+							resources: {
+								connect: (values?.meta?.fileIds || []).map(
+									(fileId) => ({
+										fileId,
+									})
+								),
+							},
+							content: values?.content,
+						},
+					});
+				}
+			} catch (err) {
+				console.log(err);
+			}
+
+			field.id = result.id;
+			setEditing(false);
+			message.success("保存成功");
+		} catch (error) {
+			message.error("保存失败");
+		} finally {
+			setLoading(false);
+		}
+	};
+
+	const style = {
+		transform: CSS.Transform.toString(transform),
+		transition,
+		borderBottom: "1px solid #f0f0f0",
+		backgroundColor: isDragging ? "#f5f5f5" : undefined,
+	};
 
 	return (
-		<Form.List name={[field.name, "lectures"]}>
-			{(fields, { add, remove, move }) => (
-				<>
-					<DndContext
-						sensors={sensors}
-						collisionDetection={closestCenter}
-						onDragEnd={({ active, over }) => {
-							if (over && active.id !== over.id) {
-								const oldIndex = fields.findIndex(
-									(field) => field.key === active.id
-								);
-								const newIndex = fields.findIndex(
-									(field) => field.key === over.id
-								);
-								if (oldIndex !== -1 && newIndex !== -1) {
-									move(oldIndex, newIndex);
+		<div ref={setNodeRef} style={style} className="p-4">
+			{editing ? (
+				<Form form={form} initialValues={field}>
+					<div className="flex gap-4">
+						<Form.Item
+							name="title"
+							initialValue={field?.title}
+							className="mb-0 flex-1"
+							rules={[{ required: true }]}>
+							<Input placeholder="课时标题" />
+						</Form.Item>
+						<Form.Item
+							name={["meta", "type"]}
+							className="mb-0 w-32"
+							rules={[{ required: true }]}>
+							<Select
+								placeholder="选择类型"
+								options={[
+									{ label: "视频", value: LectureType.VIDEO },
+									{
+										label: "文章",
+										value: LectureType.ARTICLE,
+									},
+								]}
+							/>
+						</Form.Item>
+					</div>
+					<div className="mt-4 flex flex-1 ">
+						{lectureType === LectureType.VIDEO ? (
+							<Form.Item
+								name={["meta", "fileIds"]}
+								className="mb-0 flex-1"
+								rules={[{ required: true }]}>
+								<TusUploader multiple={false} />
+							</Form.Item>
+						) : (
+							<Form.Item
+								name="content"
+								className="mb-0 flex-1"
+								rules={[{ required: true }]}>
+								<QuillEditor />
+							</Form.Item>
+						)}
+					</div>
+
+					<div className="mt-4 flex justify-end gap-2">
+						<Button
+							onClick={handleSave}
+							loading={loading}
+							type="primary"
+							icon={<SaveOutlined />}>
+							保存
+						</Button>
+						<Button
+							onClick={() => {
+								setEditing(false);
+								if (!field?.id) {
+									remove();
 								}
-							}
-						}}>
-						<SortableContext
-							items={fields.map((f) => f.key)}
-							strategy={verticalListSortingStrategy}>
-							{fields.map((lectureField) => (
-								<SortableLecture
-									key={lectureField.key}
-									id={lectureField.key}
-									field={lectureField}
-									sectionId={field.name}
-									remove={remove}
-								/>
-							))}
-						</SortableContext>
-					</DndContext>
-					<Button
-						type="dashed"
-						onClick={() => add({ type: LectureType.VIDEO })}
-						block
-						icon={<PlusOutlined />}>
-						添加课时
-					</Button>
-				</>
+							}}>
+							取消
+						</Button>
+					</div>
+				</Form>
+			) : (
+				<div className="flex items-center justify-between">
+					<Space>
+						<DragOutlined
+							{...attributes}
+							{...listeners}
+							className="cursor-move"
+						/>
+						<CaretRightOutlined />
+						<span>{field?.title || "未命名课时"}</span>
+					</Space>
+					<Space>
+						<Button type="link" onClick={() => setEditing(true)}>
+							编辑
+						</Button>
+						<Button type="link" danger onClick={remove}>
+							删除
+						</Button>
+					</Space>
+				</div>
 			)}
-		</Form.List>
+		</div>
 	);
 };
 
-export default function CourseContentForm() {
-	const { form, taxonomies } = useCourseEditor();
+interface LectureListProps {
+	field: SectionData;
+	sectionId: string;
+}
+
+const LectureList: React.FC<LectureListProps> = ({ field, sectionId }) => {
+	const { softDeleteByIds } = usePost();
+	const { data: lectures = [], isLoading } = (
+		api.post.findMany as any
+	).useQuery(
+		{
+			where: {
+				parentId: sectionId,
+				type: PostType.LECTURE,
+				deletedAt: null,
+			},
+		},
+		{
+			enabled: !!sectionId,
+		}
+	);
+	useEffect(() => {
+		if (lectures && !isLoading) {
+			setItems(lectures);
+		}
+	}, [lectures, isLoading]);
+	const [items, setItems] = useState<LectureData[]>(lectures);
+
 	const sensors = useSensors(
 		useSensor(PointerSensor),
 		useSensor(KeyboardSensor, {
@@ -294,58 +442,163 @@ export default function CourseContentForm() {
 		})
 	);
 
+	const handleDragEnd = (event: DragEndEvent) => {
+		const { active, over } = event;
+		if (!over || active.id === over.id) return;
+
+		setItems((items) => {
+			const oldIndex = items.findIndex((item) => item.id === active.id);
+			const newIndex = items.findIndex((item) => item.id === over.id);
+			return arrayMove(items, oldIndex, newIndex);
+		});
+	};
+
+	return (
+		<div className="pl-8">
+			<div
+				onClick={() => {
+					console.log(lectures);
+				}}>
+				123
+			</div>
+			<DndContext
+				sensors={sensors}
+				collisionDetection={closestCenter}
+				onDragEnd={handleDragEnd}>
+				<SortableContext
+					items={items}
+					strategy={verticalListSortingStrategy}>
+					{items.map((lecture) => (
+						<SortableLecture
+							key={lecture.id}
+							field={lecture}
+							remove={async () => {
+								if (lecture?.id) {
+									await softDeleteByIds.mutateAsync({
+										ids: [lecture.id],
+									});
+								}
+								setItems(lectures);
+							}}
+							sectionFieldKey={sectionId}
+						/>
+					))}
+				</SortableContext>
+			</DndContext>
+			<Button
+				type="dashed"
+				block
+				icon={<PlusOutlined />}
+				className="mt-4"
+				onClick={() => {
+					setItems([
+						...items.filter((item) => !!item.id),
+						{
+							id: null,
+							title: "",
+							meta: {
+								type: LectureType.ARTICLE,
+							},
+						},
+					]);
+				}}>
+				添加课时
+			</Button>
+		</div>
+	);
+};
+
+const CourseContentForm: React.FC = () => {
+	const { editId } = useCourseEditor();
+	const sensors = useSensors(
+		useSensor(PointerSensor),
+		useSensor(KeyboardSensor, {
+			coordinateGetter: sortableKeyboardCoordinates,
+		})
+	);
+	const { softDeleteByIds } = usePost();
+	const { data: sections = [], isLoading } = api.post.findMany.useQuery(
+		{
+			where: {
+				parentId: editId,
+				type: PostType.SECTION,
+				deletedAt: null,
+			},
+		},
+		{
+			enabled: !!editId,
+		}
+	);
+
+	const [items, setItems] = useState<any[]>(sections);
+	useEffect(() => {
+		if (sections && !isLoading) {
+			setItems(sections);
+		}
+	}, [sections]);
+	const handleDragEnd = (event: DragEndEvent) => {
+		const { active, over } = event;
+		if (!over || active.id === over.id) return;
+
+		setItems((items) => {
+			const oldIndex = items.findIndex((item) => item.id === active.id);
+			const newIndex = items.findIndex((item) => item.id === over.id);
+			return arrayMove(items, oldIndex, newIndex);
+		});
+	};
+
 	return (
 		<div className="max-w-4xl mx-auto p-6">
 			<CourseContentFormHeader />
 
-			<Form.List name="sections">
-				{(fields, { add, remove, move }) => (
-					<DndContext
-						sensors={sensors}
-						collisionDetection={closestCenter}
-						onDragEnd={({ active, over }) => {
-							if (over && active.id !== over.id) {
-								const oldIndex = fields.findIndex(
-									(field) => field.key === active.id
-								);
-								const newIndex = fields.findIndex(
-									(field) => field.key === over.id
-								);
-								if (oldIndex !== -1 && newIndex !== -1) {
-									move(oldIndex, newIndex);
-								}
-							}
-						}}>
-						<SortableContext
-							items={fields.map((f) => f.key)}
-							strategy={verticalListSortingStrategy}>
-							{fields.length === 0 && <CourseSectionEmpty />}
-							{fields.map((field) => (
-								<SortableSection
-									key={field.key}
-									id={field.key}
-									field={field}
-									remove={remove}>
-									<LectureList field={field} />
-								</SortableSection>
-							))}
-						</SortableContext>
-						<Form.Item>
-							<Button
-								block
-								size="large"
-								onClick={() =>
-									add({ title: "新章节", lectures: [] })
-								}
-								icon={<PlusOutlined />}
-								type="primary"
-								className="mt-4">
-								添加新章节
-							</Button>
-						</Form.Item>
-					</DndContext>
-				)}
-			</Form.List>
+			{items.length === 0 ? (
+				<CourseSectionEmpty />
+			) : (
+				<DndContext
+					sensors={sensors}
+					collisionDetection={closestCenter}
+					onDragEnd={handleDragEnd}>
+					<SortableContext
+						items={items}
+						strategy={verticalListSortingStrategy}>
+						{items?.map((section, index) => (
+							<SortableSection
+								courseId={editId}
+								key={section.id}
+								field={section}
+								remove={async () => {
+									if (section?.id) {
+										await softDeleteByIds.mutateAsync({
+											ids: [section.id],
+										});
+									}
+									setItems(sections);
+								}}>
+								<LectureList
+									field={section}
+									sectionId={section.id}
+								/>
+							</SortableSection>
+						))}
+					</SortableContext>
+				</DndContext>
+			)}
+
+			<Button
+				type="dashed"
+				block
+				icon={<PlusOutlined />}
+				className="mt-4"
+				onClick={() => {
+					setItems([
+						...items.filter((item) => !!item.id),
+						{ id: null, title: "" },
+					]);
+				}}>
+				添加章节
+			</Button>
 		</div>
 	);
-}
+};
+
+export default CourseContentForm;