diff --git a/app/(main)/post/new/page.tsx b/app/(main)/post/new/page.tsx index 1b8bb50..10cc394 100644 --- a/app/(main)/post/new/page.tsx +++ b/app/(main)/post/new/page.tsx @@ -13,15 +13,16 @@ import { SelectValue, } from "@/components/ui/select" import { Textarea } from "@/components/ui/textarea" +import { createPost, listOrders, uploadFile } from "@/lib/api" +import { toApiError } from "@/lib/errors" +import { notifyInfo, notifySuccess } from "@/lib/toast" import { useRequireAuth } from "@/lib/use-require-auth" import { useAuthStore } from "@/store/auth" -import { useOrderStore } from "@/store/orders" -import { usePostStore } from "@/store/posts" import { standardSchemaResolver } from "@hookform/resolvers/standard-schema" import { ArrowLeft, ImagePlus, X } from "lucide-react" import Link from "next/link" import { useRouter } from "next/navigation" -import { useState } from "react" +import { type ChangeEvent, useEffect, useState } from "react" import { useForm } from "react-hook-form" import { z } from "zod" @@ -32,19 +33,16 @@ const postSchema = z.object({ const tagOptions = ["英雄联盟", "王者荣耀", "CS2", "原神", "上分", "攻略", "好评", "吐槽", "求组队"] +type PostType = "normal" | "show_order" + export default function NewPostPage() { const router = useRouter() const { isAuthenticated, requireAuth } = useRequireAuth() const currentRole = useAuthStore((state) => state.currentRole) - const userId = useAuthStore((state) => state.user?.id) - const user = useAuthStore((state) => state.user) - const orders = useOrderStore((state) => state.orders) - const posts = usePostStore((state) => state.posts) - const createPost = usePostStore((state) => state.createPost) - const [postType, setPostType] = useState("normal") + const [orders, setOrders] = useState>>([]) + const [postType, setPostType] = useState("normal") const [selectedTags, setSelectedTags] = useState([]) - const [imageCount, setImageCount] = useState(0) - const [selectedQuotePostId, setSelectedQuotePostId] = useState(undefined) + const [imageFiles, setImageFiles] = useState([]) const [selectedOrderId, setSelectedOrderId] = useState(undefined) const canShowOrder = currentRole === "consumer" const effectivePostType = canShowOrder || postType !== "show_order" ? postType : "normal" @@ -63,9 +61,37 @@ export default function NewPostPage() { ) } - const availableOrders = orders.filter( - (order) => order.status === "completed" && order.consumerId === userId, - ) + useEffect(() => { + if (!isAuthenticated || !canShowOrder) { + return + } + + let cancelled = false + + listOrders({ role: "consumer", status: "completed" }) + .then((items) => { + if (cancelled) return + setOrders(items) + }) + .catch((error) => { + if (cancelled) return + notifyInfo(toApiError(error).msg) + }) + + return () => { + cancelled = true + } + }, [canShowOrder, isAuthenticated]) + + const handleSelectImages = (event: ChangeEvent) => { + const files = Array.from(event.target.files ?? []) + if (files.length === 0) return + + setImageFiles((prev) => [...prev, ...files].slice(0, 9)) + event.target.value = "" + } + + const availableOrders = isAuthenticated && canShowOrder ? orders : [] const onSubmit = async (data: z.infer) => { if (!isAuthenticated) { @@ -73,20 +99,21 @@ export default function NewPostPage() { return } - requireAuth(() => { - if (!user) return - - createPost({ - author: user, + try { + const images = await Promise.all(imageFiles.map((file) => uploadFile(file, "post"))) + await createPost({ title: data.title, content: data.content, - images: Array.from({ length: imageCount }).map(() => "/posts/p1-1.jpg"), + images, tags: selectedTags, linkedOrderId: effectivePostType === "show_order" ? selectedOrderId : undefined, }) + notifySuccess("帖子已发布") router.push("/community") - }) + } catch (error) { + notifyInfo(toApiError(error).msg) + } } return ( @@ -107,14 +134,16 @@ export default function NewPostPage() {
- setPostType(value as PostType)} + > 普通帖 {canShowOrder && 秀单帖} - 引用帖
@@ -137,48 +166,6 @@ export default function NewPostPage() { )} - {effectivePostType === "quote" && ( -
- - -
-

预览:

- {selectedQuotePostId ? ( - (() => { - const post = posts.find((p) => p.id === selectedQuotePostId) - if (!post) return

未找到帖子

- return ( -
-

{post.title}

-

- {post.content} -

-
- @{post.author.nickname} - · - {new Date(post.createdAt).toLocaleDateString("zh-CN")} -
-
- ) - })() - ) : ( -

选择一个帖子以查看预览...

- )} -
-
- )} -
@@ -196,30 +183,41 @@ export default function NewPostPage() {
- {Array.from({ length: imageCount }).map((_, i) => ( + {imageFiles.map((file) => (
- 图片 + + {file.name} +
))} - {imageCount < 9 && ( - + + )}