存客宝 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/workspace/group-sync/components/auto-group-creator.tsx
+++ b/Cunkebao/app/workspace/group-sync/components/auto-group-creator.tsx
@@ -0,0 +1,151 @@
+"use client"
+
+import { useState } from "react"
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"
+import { Button } from "@/components/ui/button"
+import { Input } from "@/components/ui/input"
+import { Label } from "@/components/ui/label"
+import { Textarea } from "@/components/ui/textarea"
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select"
+import { Badge } from "@/components/ui/badge"
+import { Plus, X, Users } from "lucide-react"
+import { useToast } from "@/components/ui/use-toast"
+
+export function AutoGroupCreator() {
+  const { toast } = useToast()
+  const [groupName, setGroupName] = useState("")
+  const [welcomeMessage, setWelcomeMessage] = useState("欢迎加入我们的群聊！")
+  const [groupSize, setGroupSize] = useState(50)
+  const [groupType, setGroupType] = useState("business")
+  const [tags, setTags] = useState<string[]>([])
+  const [tagInput, setTagInput] = useState("")
+
+  const handleAddTag = () => {
+    if (tagInput && !tags.includes(tagInput)) {
+      setTags([...tags, tagInput])
+      setTagInput("")
+    }
+  }
+
+  const handleRemoveTag = (tag: string) => {
+    setTags(tags.filter((t) => t !== tag))
+  }
+
+  const handleCreateGroup = () => {
+    if (!groupName) {
+      toast({
+        title: "请输入群名称",
+        variant: "destructive",
+      })
+      return
+    }
+
+    // 模拟创建群聊
+    toast({
+      title: "群聊创建成功",
+      description: `已成功创建"${groupName}"群聊`,
+    })
+
+    // 重置表单
+    setGroupName("")
+    setWelcomeMessage("欢迎加入我们的群聊！")
+    setGroupSize(50)
+    setGroupType("business")
+    setTags([])
+  }
+
+  return (
+    <Card>
+      <CardHeader>
+        <CardTitle className="flex items-center">
+          <Users className="mr-2 h-5 w-5" />
+          自动建群
+        </CardTitle>
+      </CardHeader>
+      <CardContent className="space-y-4">
+        <div className="space-y-2">
+          <Label htmlFor="group-name">群聊名称</Label>
+          <Input
+            id="group-name"
+            placeholder="请输入群聊名称"
+            value={groupName}
+            onChange={(e) => setGroupName(e.target.value)}
+          />
+        </div>
+
+        <div className="space-y-2">
+          <Label htmlFor="welcome-message">欢迎语</Label>
+          <Textarea
+            id="welcome-message"
+            placeholder="请输入群欢迎语"
+            value={welcomeMessage}
+            onChange={(e) => setWelcomeMessage(e.target.value)}
+            rows={3}
+          />
+        </div>
+
+        <div className="grid grid-cols-2 gap-4">
+          <div className="space-y-2">
+            <Label htmlFor="group-size">群人数上限</Label>
+            <Input
+              id="group-size"
+              type="number"
+              min={1}
+              max={500}
+              value={groupSize}
+              onChange={(e) => setGroupSize(Number.parseInt(e.target.value))}
+            />
+          </div>
+
+          <div className="space-y-2">
+            <Label htmlFor="group-type">群类型</Label>
+            <Select value={groupType} onValueChange={setGroupType}>
+              <SelectTrigger id="group-type">
+                <SelectValue placeholder="选择群类型" />
+              </SelectTrigger>
+              <SelectContent>
+                <SelectItem value="business">业务群</SelectItem>
+                <SelectItem value="customer">客户群</SelectItem>
+                <SelectItem value="team">团队群</SelectItem>
+              </SelectContent>
+            </Select>
+          </div>
+        </div>
+
+        <div className="space-y-2">
+          <Label>群标签</Label>
+          <div className="flex space-x-2">
+            <Input
+              placeholder="添加标签"
+              value={tagInput}
+              onChange={(e) => setTagInput(e.target.value)}
+              onKeyDown={(e) => {
+                if (e.key === "Enter") {
+                  e.preventDefault()
+                  handleAddTag()
+                }
+              }}
+            />
+            <Button type="button" size="sm" onClick={handleAddTag}>
+              <Plus className="h-4 w-4" />
+            </Button>
+          </div>
+
+          <div className="flex flex-wrap gap-2 mt-2">
+            {tags.map((tag) => (
+              <Badge key={tag} variant="secondary" className="flex items-center gap-1">
+                {tag}
+                <X className="h-3 w-3 cursor-pointer" onClick={() => handleRemoveTag(tag)} />
+              </Badge>
+            ))}
+          </div>
+        </div>
+
+        <Button className="w-full mt-4" onClick={handleCreateGroup}>
+          创建群聊
+        </Button>
+      </CardContent>
+    </Card>
+  )
+}
+