diff --git a/apps/server/src/models/post/post.router.ts b/apps/server/src/models/post/post.router.ts
index 3181ae7..7766164 100755
--- a/apps/server/src/models/post/post.router.ts
+++ b/apps/server/src/models/post/post.router.ts
@@ -68,6 +68,11 @@ export class PostRouter {
         const { staff } = ctx;
         return await this.postService.findById(input.id, input.args);
       }),
+    findFirst: this.trpc.procedure
+      .input(PostFindFirstArgsSchema) // Assuming StaffMethodSchema.findMany is the Zod schema for finding staffs by keyword
+      .query(async ({ input }) => {
+        return await this.postService.findFirst(input);
+      }),
     deleteMany: this.trpc.protectProcedure
       .input(PostDeleteManyArgsSchema)
       .mutation(async ({ input }) => {
diff --git a/apps/web/src/components/models/post/detail/PostDetail.tsx b/apps/web/src/components/models/post/detail/PostDetail.tsx
new file mode 100644
index 0000000..74eea24
--- /dev/null
+++ b/apps/web/src/components/models/post/detail/PostDetail.tsx
@@ -0,0 +1,12 @@
+import { PostDetailProvider } from "./context/PostDetailContext";
+import PostDetailLayout from "./layout/PostDetailLayout";
+
+export default function PostDetail({ id }: { id?: string }) {
+	return (
+		<>
+			<PostDetailProvider editId={id}>
+				<PostDetailLayout></PostDetailLayout>
+			</PostDetailProvider>
+		</>
+	);
+}
diff --git a/apps/web/src/components/models/post/detail/context/PostDetailContext.tsx b/apps/web/src/components/models/post/detail/context/PostDetailContext.tsx
index 974d390..0632ef4 100644
--- a/apps/web/src/components/models/post/detail/context/PostDetailContext.tsx
+++ b/apps/web/src/components/models/post/detail/context/PostDetailContext.tsx
@@ -1,54 +1,45 @@
 import { api, usePost } from "@nice/client";
-import {} from "@nice/common";
+import { Post } from "@nice/common";
 import React, { createContext, ReactNode, useState } from "react";
 import { string } from "zod";
 
 interface PostDetailContextType {
 	editId?: string; // 添加 editId
-	course?: CourseDto;
-	selectedLectureId?: string | undefined;
-	setSelectedLectureId?: React.Dispatch<React.SetStateAction<string>>;
+	post?: Post;
 	isLoading?: boolean;
-	isHeaderVisible: boolean; // 新增
-	setIsHeaderVisible: (visible: boolean) => void; // 新增
 }
-interface CourseFormProviderProps {
+interface PostFormProviderProps {
 	children: ReactNode;
 	editId?: string; // 添加 editId 参数
 }
-export const CourseDetailContext =
-	createContext<PostDetailContextType | null>(null);
-export function CourseDetailProvider({
+export const PostDetailContext = createContext<PostDetailContextType | null>(
+	null
+);
+export function PostDetailProvider({
 	children,
 	editId,
-}: CourseFormProviderProps) {
-	const { data: course, isLoading }: { data: CourseDto; isLoading: boolean } =
-		api.course.findFirst.useQuery(
-			{
-				where: { id: editId },
-				include: {
-					sections: { include: { lectures: true } },
-					enrollments: true,
-				},
-			},
-			{ enabled: Boolean(editId) }
-		);
-	const [selectedLectureId, setSelectedLectureId] = useState<
-		string | undefined
-	>(undefined);
-	const [isHeaderVisible, setIsHeaderVisible] = useState(true); // 新增
+}: PostFormProviderProps) {
+	const { data: post, isLoading }: { data: Post; isLoading: boolean } = (
+		api.post.findFirst as any
+	).useQuery(
+		{
+			where: { id: editId },
+		},
+		{ enabled: Boolean(editId) }
+	);
+    // const {}:{} =(
+	// 	api.post.fin as any
+	// )
+
 	return (
-		<CourseDetailContext.Provider
+		<PostDetailContext.Provider
 			value={{
 				editId,
-				course,
-				selectedLectureId,
-				setSelectedLectureId,
+				post,
+
 				isLoading,
-				isHeaderVisible,
-				setIsHeaderVisible,
 			}}>
 			{children}
-		</CourseDetailContext.Provider>
+		</PostDetailContext.Provider>
 	);
 }
diff --git a/apps/web/src/components/models/post/detail/layout/PostDetailLayout.tsx b/apps/web/src/components/models/post/detail/layout/PostDetailLayout.tsx
new file mode 100644
index 0000000..d762aa9
--- /dev/null
+++ b/apps/web/src/components/models/post/detail/layout/PostDetailLayout.tsx
@@ -0,0 +1,12 @@
+import { motion } from "framer-motion";
+import { useContext } from "react";
+import { PostDetailContext } from "../context/PostDetailContext";
+
+export default function PostDetailLayout() {
+	const { post } = useContext(PostDetailContext);
+
+	return <div>
+
+
+	</div>;
+}