存客宝 React

2025-03-29 16:50:39 +08:00
parent caea0b4b99
commit 7e7c199996
388 changed files with 53282 additions and 2076 deletions
--- a/Cunkebao/app/content/[id]/materials/new/page.tsx
+++ b/Cunkebao/app/content/[id]/materials/new/page.tsx
@@ -0,0 +1,131 @@
+"use client"
+
+import type React from "react"
+
+import { useState } from "react"
+import { useRouter } from "next/navigation"
+import { ChevronLeft, Plus, X } from "lucide-react"
+import { Card } from "@/components/ui/card"
+import { Button } from "@/components/ui/button"
+import { Input } from "@/components/ui/input"
+import { Textarea } from "@/components/ui/textarea"
+import { Label } from "@/components/ui/label"
+import { Badge } from "@/components/ui/badge"
+import { toast } from "@/components/ui/use-toast"
+
+export default function NewMaterialPage({ params }: { params: { id: string } }) {
+  const router = useRouter()
+  const [content, setContent] = useState("")
+  const [newTag, setNewTag] = useState("")
+  const [tags, setTags] = useState<string[]>([])
+
+  const handleAddTag = () => {
+    if (newTag && !tags.includes(newTag)) {
+      setTags([...tags, newTag])
+      setNewTag("")
+    }
+  }
+
+  const handleRemoveTag = (tagToRemove: string) => {
+    setTags(tags.filter((tag) => tag !== tagToRemove))
+  }
+
+  const handleSubmit = async (e: React.FormEvent) => {
+    e.preventDefault()
+    if (!content) {
+      toast({
+        title: "错误",
+        description: "请输入素材内容",
+        variant: "destructive",
+      })
+      return
+    }
+    try {
+      // 模拟保存新素材
+      await new Promise((resolve) => setTimeout(resolve, 1000))
+      toast({
+        title: "成功",
+        description: "新素材已创建",
+      })
+      router.push(`/content/${params.id}/materials`)
+    } catch (error) {
+      console.error("Failed to create new material:", error)
+      toast({
+        title: "错误",
+        description: "创建新素材失败",
+        variant: "destructive",
+      })
+    }
+  }
+
+  return (
+    <div className="flex-1 bg-gray-50 min-h-screen">
+      <header className="sticky top-0 z-10 bg-white border-b">
+        <div className="flex items-center justify-between p-4">
+          <div className="flex items-center space-x-3">
+            <Button variant="ghost" size="icon" onClick={() => router.back()}>
+              <ChevronLeft className="h-5 w-5" />
+            </Button>
+            <h1 className="text-lg font-medium">新建素材</h1>
+          </div>
+        </div>
+      </header>
+
+      <div className="p-4">
+        <Card className="p-4">
+          <form onSubmit={handleSubmit} className="space-y-4">
+            <div>
+              <Label htmlFor="content">素材内容</Label>
+              <Textarea
+                id="content"
+                value={content}
+                onChange={(e) => setContent(e.target.value)}
+                placeholder="请输入素材内容"
+                className="mt-1"
+                rows={5}
+              />
+            </div>
+
+            <div>
+              <Label htmlFor="tags">标签</Label>
+              <div className="flex items-center mt-1">
+                <Input
+                  id="tags"
+                  value={newTag}
+                  onChange={(e) => setNewTag(e.target.value)}
+                  placeholder="输入标签"
+                  className="flex-1"
+                />
+                <Button type="button" onClick={handleAddTag} className="ml-2">
+                  <Plus className="h-4 w-4" />
+                  添加
+                </Button>
+              </div>
+              <div className="flex flex-wrap gap-2 mt-2">
+                {tags.map((tag, index) => (
+                  <Badge key={index} variant="secondary" className="flex items-center">
+                    {tag}
+                    <Button
+                      type="button"
+                      variant="ghost"
+                      size="sm"
+                      className="h-4 w-4 ml-1 p-0"
+                      onClick={() => handleRemoveTag(tag)}
+                    >
+                      <X className="h-3 w-3" />
+                    </Button>
+                  </Badge>
+                ))}
+              </div>
+            </div>
+
+            <Button type="submit" className="w-full">
+              保存素材
+            </Button>
+          </form>
+        </Card>
+      </div>
+    </div>
+  )
+}
+