mirror of https://github.com/Mai-with-u/MaiBot.git
feat(dashboard): convert ChatSection to Hook component
DrSmoothl
parent
ed27217c94
commit
b382747398
|
|
@ -0,0 +1,617 @@
|
||||||
|
import React, { useState, useEffect, useMemo } from 'react'
|
||||||
|
import { Button } from '@/components/ui/button'
|
||||||
|
import { Input } from '@/components/ui/input'
|
||||||
|
import { Label } from '@/components/ui/label'
|
||||||
|
import { Switch } from '@/components/ui/switch'
|
||||||
|
import { Slider } from '@/components/ui/slider'
|
||||||
|
import {
|
||||||
|
Select,
|
||||||
|
SelectContent,
|
||||||
|
SelectItem,
|
||||||
|
SelectTrigger,
|
||||||
|
SelectValue,
|
||||||
|
} from '@/components/ui/select'
|
||||||
|
import {
|
||||||
|
AlertDialog,
|
||||||
|
AlertDialogAction,
|
||||||
|
AlertDialogCancel,
|
||||||
|
AlertDialogContent,
|
||||||
|
AlertDialogDescription,
|
||||||
|
AlertDialogFooter,
|
||||||
|
AlertDialogHeader,
|
||||||
|
AlertDialogTitle,
|
||||||
|
AlertDialogTrigger,
|
||||||
|
} from '@/components/ui/alert-dialog'
|
||||||
|
import {
|
||||||
|
Popover,
|
||||||
|
PopoverContent,
|
||||||
|
PopoverTrigger,
|
||||||
|
} from '@/components/ui/popover'
|
||||||
|
import { Plus, Trash2, Eye, Clock } from 'lucide-react'
|
||||||
|
import type { FieldHookComponent } from '@/lib/field-hooks'
|
||||||
|
import type { ChatConfig } from '../types'
|
||||||
|
|
||||||
|
// 时间选择组件
|
||||||
|
const TimeRangePicker = React.memo(function TimeRangePicker({
|
||||||
|
value,
|
||||||
|
onChange,
|
||||||
|
}: {
|
||||||
|
value: string
|
||||||
|
onChange: (value: string) => void
|
||||||
|
}) {
|
||||||
|
// 解析初始值
|
||||||
|
const parsedValue = useMemo(() => {
|
||||||
|
const parts = value.split('-')
|
||||||
|
if (parts.length === 2) {
|
||||||
|
const [start, end] = parts
|
||||||
|
const [sh, sm] = start.split(':')
|
||||||
|
const [eh, em] = end.split(':')
|
||||||
|
return {
|
||||||
|
startHour: sh ? sh.padStart(2, '0') : '00',
|
||||||
|
startMinute: sm ? sm.padStart(2, '0') : '00',
|
||||||
|
endHour: eh ? eh.padStart(2, '0') : '23',
|
||||||
|
endMinute: em ? em.padStart(2, '0') : '59',
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return {
|
||||||
|
startHour: '00',
|
||||||
|
startMinute: '00',
|
||||||
|
endHour: '23',
|
||||||
|
endMinute: '59',
|
||||||
|
}
|
||||||
|
}, [value])
|
||||||
|
|
||||||
|
const [startHour, setStartHour] = useState(parsedValue.startHour)
|
||||||
|
const [startMinute, setStartMinute] = useState(parsedValue.startMinute)
|
||||||
|
const [endHour, setEndHour] = useState(parsedValue.endHour)
|
||||||
|
const [endMinute, setEndMinute] = useState(parsedValue.endMinute)
|
||||||
|
|
||||||
|
// 当value变化时同步状态
|
||||||
|
useEffect(() => {
|
||||||
|
setStartHour(parsedValue.startHour)
|
||||||
|
setStartMinute(parsedValue.startMinute)
|
||||||
|
setEndHour(parsedValue.endHour)
|
||||||
|
setEndMinute(parsedValue.endMinute)
|
||||||
|
}, [parsedValue])
|
||||||
|
|
||||||
|
const updateTime = (
|
||||||
|
newStartHour: string,
|
||||||
|
newStartMinute: string,
|
||||||
|
newEndHour: string,
|
||||||
|
newEndMinute: string
|
||||||
|
) => {
|
||||||
|
const newValue = `${newStartHour}:${newStartMinute}-${newEndHour}:${newEndMinute}`
|
||||||
|
onChange(newValue)
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Popover>
|
||||||
|
<PopoverTrigger asChild>
|
||||||
|
<Button variant="outline" className="w-full justify-start font-mono text-sm">
|
||||||
|
<Clock className="h-4 w-4 mr-2" />
|
||||||
|
{value || '选择时间段'}
|
||||||
|
</Button>
|
||||||
|
</PopoverTrigger>
|
||||||
|
<PopoverContent className="w-72 sm:w-80">
|
||||||
|
<div className="space-y-4">
|
||||||
|
<div>
|
||||||
|
<h4 className="font-medium text-sm mb-3">开始时间</h4>
|
||||||
|
<div className="grid grid-cols-2 gap-2 sm:gap-3">
|
||||||
|
<div>
|
||||||
|
<Label className="text-xs">小时</Label>
|
||||||
|
<Select
|
||||||
|
value={startHour}
|
||||||
|
onValueChange={(v) => {
|
||||||
|
setStartHour(v)
|
||||||
|
updateTime(v, startMinute, endHour, endMinute)
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<SelectTrigger>
|
||||||
|
<SelectValue />
|
||||||
|
</SelectTrigger>
|
||||||
|
<SelectContent>
|
||||||
|
{Array.from({ length: 24 }, (_, i) => i).map((h) => (
|
||||||
|
<SelectItem key={h} value={h.toString().padStart(2, '0')}>
|
||||||
|
{h.toString().padStart(2, '0')}
|
||||||
|
</SelectItem>
|
||||||
|
))}
|
||||||
|
</SelectContent>
|
||||||
|
</Select>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<Label className="text-xs">分钟</Label>
|
||||||
|
<Select
|
||||||
|
value={startMinute}
|
||||||
|
onValueChange={(v) => {
|
||||||
|
setStartMinute(v)
|
||||||
|
updateTime(startHour, v, endHour, endMinute)
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<SelectTrigger>
|
||||||
|
<SelectValue />
|
||||||
|
</SelectTrigger>
|
||||||
|
<SelectContent>
|
||||||
|
{Array.from({ length: 60 }, (_, i) => i).map((m) => (
|
||||||
|
<SelectItem key={m} value={m.toString().padStart(2, '0')}>
|
||||||
|
{m.toString().padStart(2, '0')}
|
||||||
|
</SelectItem>
|
||||||
|
))}
|
||||||
|
</SelectContent>
|
||||||
|
</Select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<h4 className="font-medium text-sm mb-3">结束时间</h4>
|
||||||
|
<div className="grid grid-cols-2 gap-2 sm:gap-3">
|
||||||
|
<div>
|
||||||
|
<Label className="text-xs">小时</Label>
|
||||||
|
<Select
|
||||||
|
value={endHour}
|
||||||
|
onValueChange={(v) => {
|
||||||
|
setEndHour(v)
|
||||||
|
updateTime(startHour, startMinute, v, endMinute)
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<SelectTrigger>
|
||||||
|
<SelectValue />
|
||||||
|
</SelectTrigger>
|
||||||
|
<SelectContent>
|
||||||
|
{Array.from({ length: 24 }, (_, i) => i).map((h) => (
|
||||||
|
<SelectItem key={h} value={h.toString().padStart(2, '0')}>
|
||||||
|
{h.toString().padStart(2, '0')}
|
||||||
|
</SelectItem>
|
||||||
|
))}
|
||||||
|
</SelectContent>
|
||||||
|
</Select>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<Label className="text-xs">分钟</Label>
|
||||||
|
<Select
|
||||||
|
value={endMinute}
|
||||||
|
onValueChange={(v) => {
|
||||||
|
setEndMinute(v)
|
||||||
|
updateTime(startHour, startMinute, endHour, v)
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<SelectTrigger>
|
||||||
|
<SelectValue />
|
||||||
|
</SelectTrigger>
|
||||||
|
<SelectContent>
|
||||||
|
{Array.from({ length: 60 }, (_, i) => i).map((m) => (
|
||||||
|
<SelectItem key={m} value={m.toString().padStart(2, '0')}>
|
||||||
|
{m.toString().padStart(2, '0')}
|
||||||
|
</SelectItem>
|
||||||
|
))}
|
||||||
|
</SelectContent>
|
||||||
|
</Select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</PopoverContent>
|
||||||
|
</Popover>
|
||||||
|
)
|
||||||
|
})
|
||||||
|
|
||||||
|
// 预览窗口组件
|
||||||
|
const RulePreview = React.memo(function RulePreview({ rule }: { rule: { target: string; time: string; value: number } }) {
|
||||||
|
const previewText = `{ target = "${rule.target}", time = "${rule.time}", value = ${rule.value.toFixed(1)} }`
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Popover>
|
||||||
|
<PopoverTrigger asChild>
|
||||||
|
<Button variant="outline" size="sm">
|
||||||
|
<Eye className="h-4 w-4 mr-1" />
|
||||||
|
预览
|
||||||
|
</Button>
|
||||||
|
</PopoverTrigger>
|
||||||
|
<PopoverContent className="w-80 sm:w-96">
|
||||||
|
<div className="space-y-2">
|
||||||
|
<h4 className="font-medium text-sm">配置预览</h4>
|
||||||
|
<div className="rounded-md bg-muted p-3 font-mono text-xs break-all">
|
||||||
|
{previewText}
|
||||||
|
</div>
|
||||||
|
<p className="text-xs text-muted-foreground">
|
||||||
|
这是保存到 bot_config.toml 文件中的格式
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</PopoverContent>
|
||||||
|
</Popover>
|
||||||
|
)
|
||||||
|
})
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ChatSection as a Field Hook Component
|
||||||
|
* This component replaces the entire 'chat' nested config section rendering
|
||||||
|
*/
|
||||||
|
export const ChatSectionHook: FieldHookComponent = ({ value, onChange }) => {
|
||||||
|
// Cast value to ChatConfig (assuming it's the entire chat config object)
|
||||||
|
const config = value as ChatConfig
|
||||||
|
|
||||||
|
// Helper to update config
|
||||||
|
const updateConfig = (updates: Partial<ChatConfig>) => {
|
||||||
|
if (onChange) {
|
||||||
|
onChange({ ...config, ...updates })
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 添加发言频率规则
|
||||||
|
const addTalkValueRule = () => {
|
||||||
|
updateConfig({
|
||||||
|
talk_value_rules: [
|
||||||
|
...config.talk_value_rules,
|
||||||
|
{ target: '', time: '00:00-23:59', value: 1.0 },
|
||||||
|
],
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 删除发言频率规则
|
||||||
|
const removeTalkValueRule = (index: number) => {
|
||||||
|
updateConfig({
|
||||||
|
talk_value_rules: config.talk_value_rules.filter((_, i) => i !== index),
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 更新发言频率规则
|
||||||
|
const updateTalkValueRule = (
|
||||||
|
index: number,
|
||||||
|
field: 'target' | 'time' | 'value',
|
||||||
|
value: string | number
|
||||||
|
) => {
|
||||||
|
const newRules = [...config.talk_value_rules]
|
||||||
|
newRules[index] = {
|
||||||
|
...newRules[index],
|
||||||
|
[field]: value,
|
||||||
|
}
|
||||||
|
updateConfig({
|
||||||
|
talk_value_rules: newRules,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="rounded-lg border bg-card p-4 sm:p-6 space-y-6">
|
||||||
|
<div>
|
||||||
|
<h3 className="text-lg font-semibold mb-4">聊天设置</h3>
|
||||||
|
<div className="grid gap-4">
|
||||||
|
<div className="grid gap-2">
|
||||||
|
<Label htmlFor="talk_value">聊天频率（基础值）</Label>
|
||||||
|
<Input
|
||||||
|
id="talk_value"
|
||||||
|
type="number"
|
||||||
|
step="0.1"
|
||||||
|
min="0"
|
||||||
|
max="1"
|
||||||
|
value={config.talk_value}
|
||||||
|
onChange={(e) => updateConfig({ talk_value: parseFloat(e.target.value) })}
|
||||||
|
/>
|
||||||
|
<p className="text-xs text-muted-foreground">越小越沉默，范围 0-1</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="grid gap-2">
|
||||||
|
<Label htmlFor="think_mode">思考模式</Label>
|
||||||
|
<Select
|
||||||
|
value={config.think_mode || 'classic'}
|
||||||
|
onValueChange={(value) => updateConfig({ think_mode: value as 'classic' | 'deep' | 'dynamic' })}
|
||||||
|
>
|
||||||
|
<SelectTrigger id="think_mode">
|
||||||
|
<SelectValue placeholder="选择思考模式" />
|
||||||
|
</SelectTrigger>
|
||||||
|
<SelectContent>
|
||||||
|
<SelectItem value="classic">经典模式 - 浅度思考和回复</SelectItem>
|
||||||
|
<SelectItem value="deep">深度模式 - 进行深度思考和回复</SelectItem>
|
||||||
|
<SelectItem value="dynamic">动态模式 - 自动选择思考深度</SelectItem>
|
||||||
|
</SelectContent>
|
||||||
|
</Select>
|
||||||
|
<p className="text-xs text-muted-foreground">
|
||||||
|
控制麦麦的思考深度。经典模式回复快但简单；深度模式更深入但较慢；动态模式根据情况自动选择
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="flex items-center space-x-2">
|
||||||
|
<Switch
|
||||||
|
id="mentioned_bot_reply"
|
||||||
|
checked={config.mentioned_bot_reply}
|
||||||
|
onCheckedChange={(checked) =>
|
||||||
|
updateConfig({ mentioned_bot_reply: checked })
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
<Label htmlFor="mentioned_bot_reply" className="cursor-pointer">
|
||||||
|
启用提及必回复
|
||||||
|
</Label>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="grid gap-2">
|
||||||
|
<Label htmlFor="max_context_size">上下文长度</Label>
|
||||||
|
<Input
|
||||||
|
id="max_context_size"
|
||||||
|
type="number"
|
||||||
|
min="1"
|
||||||
|
value={config.max_context_size}
|
||||||
|
onChange={(e) =>
|
||||||
|
updateConfig({ max_context_size: parseInt(e.target.value) })
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="grid gap-2">
|
||||||
|
<Label htmlFor="planner_smooth">规划器平滑</Label>
|
||||||
|
<Input
|
||||||
|
id="planner_smooth"
|
||||||
|
type="number"
|
||||||
|
step="1"
|
||||||
|
min="0"
|
||||||
|
value={config.planner_smooth}
|
||||||
|
onChange={(e) =>
|
||||||
|
updateConfig({ planner_smooth: parseFloat(e.target.value) })
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
<p className="text-xs text-muted-foreground">
|
||||||
|
增大数值会减小 planner 负荷，推荐 1-5，0 为关闭
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="grid gap-2">
|
||||||
|
<Label htmlFor="plan_reply_log_max_per_chat">每个聊天流最大日志数量</Label>
|
||||||
|
<Input
|
||||||
|
id="plan_reply_log_max_per_chat"
|
||||||
|
type="number"
|
||||||
|
step="1"
|
||||||
|
min="100"
|
||||||
|
value={config.plan_reply_log_max_per_chat ?? 1024}
|
||||||
|
onChange={(e) =>
|
||||||
|
updateConfig({ plan_reply_log_max_per_chat: parseInt(e.target.value) })
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
<p className="text-xs text-muted-foreground">
|
||||||
|
每个聊天流保存的 Plan/Reply 日志最大数量，超过此数量时会自动删除最老的日志
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="flex items-center space-x-2">
|
||||||
|
<Switch
|
||||||
|
id="llm_quote"
|
||||||
|
checked={config.llm_quote ?? false}
|
||||||
|
onCheckedChange={(checked) =>
|
||||||
|
updateConfig({ llm_quote: checked })
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
<Label htmlFor="llm_quote" className="cursor-pointer">
|
||||||
|
启用 LLM 控制引用
|
||||||
|
</Label>
|
||||||
|
</div>
|
||||||
|
<p className="text-xs text-muted-foreground -mt-2 ml-10">
|
||||||
|
启用后，LLM 可以决定是否在回复时引用消息
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<div className="flex items-center space-x-2">
|
||||||
|
<Switch
|
||||||
|
id="enable_talk_value_rules"
|
||||||
|
checked={config.enable_talk_value_rules}
|
||||||
|
onCheckedChange={(checked) =>
|
||||||
|
updateConfig({ enable_talk_value_rules: checked })
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
<Label htmlFor="enable_talk_value_rules" className="cursor-pointer">
|
||||||
|
启用动态发言频率规则
|
||||||
|
</Label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* 动态发言频率规则配置 */}
|
||||||
|
{config.enable_talk_value_rules && (
|
||||||
|
<div className="border-t pt-6">
|
||||||
|
<div className="flex items-center justify-between mb-4">
|
||||||
|
<div>
|
||||||
|
<h4 className="text-base font-semibold">动态发言频率规则</h4>
|
||||||
|
<p className="text-xs text-muted-foreground mt-1">
|
||||||
|
按时段或聊天流ID调整发言频率，优先匹配具体聊天，再匹配全局规则
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<Button onClick={addTalkValueRule} size="sm">
|
||||||
|
<Plus className="h-4 w-4 mr-1" />
|
||||||
|
添加规则
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{config.talk_value_rules && config.talk_value_rules.length > 0 ? (
|
||||||
|
<div className="space-y-4">
|
||||||
|
{config.talk_value_rules.map((rule, index) => (
|
||||||
|
<div key={index} className="rounded-lg border p-4 bg-muted/50 space-y-4">
|
||||||
|
<div className="flex items-center justify-between">
|
||||||
|
<span className="text-sm font-medium text-muted-foreground">
|
||||||
|
规则 #{index + 1}
|
||||||
|
</span>
|
||||||
|
<div className="flex items-center gap-2">
|
||||||
|
<RulePreview rule={rule} />
|
||||||
|
<AlertDialog>
|
||||||
|
<AlertDialogTrigger asChild>
|
||||||
|
<Button variant="ghost" size="sm">
|
||||||
|
<Trash2 className="h-4 w-4 text-destructive" />
|
||||||
|
</Button>
|
||||||
|
</AlertDialogTrigger>
|
||||||
|
<AlertDialogContent>
|
||||||
|
<AlertDialogHeader>
|
||||||
|
<AlertDialogTitle>确认删除</AlertDialogTitle>
|
||||||
|
<AlertDialogDescription>
|
||||||
|
确定要删除规则 #{index + 1} 吗？此操作无法撤销。
|
||||||
|
</AlertDialogDescription>
|
||||||
|
</AlertDialogHeader>
|
||||||
|
<AlertDialogFooter>
|
||||||
|
<AlertDialogCancel>取消</AlertDialogCancel>
|
||||||
|
<AlertDialogAction onClick={() => removeTalkValueRule(index)}>
|
||||||
|
删除
|
||||||
|
</AlertDialogAction>
|
||||||
|
</AlertDialogFooter>
|
||||||
|
</AlertDialogContent>
|
||||||
|
</AlertDialog>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="space-y-4">
|
||||||
|
{/* 配置类型选择 */}
|
||||||
|
<div className="grid gap-2">
|
||||||
|
<Label className="text-xs font-medium">配置类型</Label>
|
||||||
|
<Select
|
||||||
|
value={rule.target === '' ? 'global' : 'specific'}
|
||||||
|
onValueChange={(value) => {
|
||||||
|
if (value === 'global') {
|
||||||
|
updateTalkValueRule(index, 'target', '')
|
||||||
|
} else {
|
||||||
|
updateTalkValueRule(index, 'target', 'qq::group')
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<SelectTrigger>
|
||||||
|
<SelectValue />
|
||||||
|
</SelectTrigger>
|
||||||
|
<SelectContent>
|
||||||
|
<SelectItem value="global">全局配置</SelectItem>
|
||||||
|
<SelectItem value="specific">详细配置</SelectItem>
|
||||||
|
</SelectContent>
|
||||||
|
</Select>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* 详细配置选项 - 只在非全局时显示 */}
|
||||||
|
{rule.target !== '' && (() => {
|
||||||
|
const parts = rule.target.split(':')
|
||||||
|
const platform = parts[0] || 'qq'
|
||||||
|
const chatId = parts[1] || ''
|
||||||
|
const chatType = parts[2] || 'group'
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="grid gap-4 p-3 sm:p-4 rounded-lg bg-muted/50">
|
||||||
|
<div className="grid grid-cols-1 sm:grid-cols-3 gap-3">
|
||||||
|
<div className="grid gap-2">
|
||||||
|
<Label className="text-xs font-medium">平台</Label>
|
||||||
|
<Select
|
||||||
|
value={platform}
|
||||||
|
onValueChange={(value) => {
|
||||||
|
updateTalkValueRule(index, 'target', `${value}:${chatId}:${chatType}`)
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<SelectTrigger>
|
||||||
|
<SelectValue />
|
||||||
|
</SelectTrigger>
|
||||||
|
<SelectContent>
|
||||||
|
<SelectItem value="qq">QQ</SelectItem>
|
||||||
|
<SelectItem value="wx">微信</SelectItem>
|
||||||
|
</SelectContent>
|
||||||
|
</Select>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="grid gap-2">
|
||||||
|
<Label className="text-xs font-medium">群 ID</Label>
|
||||||
|
<Input
|
||||||
|
value={chatId}
|
||||||
|
onChange={(e) => {
|
||||||
|
updateTalkValueRule(index, 'target', `${platform}:${e.target.value}:${chatType}`)
|
||||||
|
}}
|
||||||
|
placeholder="输入群 ID"
|
||||||
|
className="font-mono text-sm"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="grid gap-2">
|
||||||
|
<Label className="text-xs font-medium">类型</Label>
|
||||||
|
<Select
|
||||||
|
value={chatType}
|
||||||
|
onValueChange={(value) => {
|
||||||
|
updateTalkValueRule(index, 'target', `${platform}:${chatId}:${value}`)
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<SelectTrigger>
|
||||||
|
<SelectValue />
|
||||||
|
</SelectTrigger>
|
||||||
|
<SelectContent>
|
||||||
|
<SelectItem value="group">群组（group）</SelectItem>
|
||||||
|
<SelectItem value="private">私聊（private）</SelectItem>
|
||||||
|
</SelectContent>
|
||||||
|
</Select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<p className="text-xs text-muted-foreground">
|
||||||
|
当前聊天流 ID：{rule.target || '（未设置）'}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
})()}
|
||||||
|
|
||||||
|
{/* 时间段选择器 */}
|
||||||
|
<div className="grid gap-2">
|
||||||
|
<Label className="text-xs font-medium">时间段 (Time)</Label>
|
||||||
|
<TimeRangePicker
|
||||||
|
value={rule.time}
|
||||||
|
onChange={(v) => updateTalkValueRule(index, 'time', v)}
|
||||||
|
/>
|
||||||
|
<p className="text-xs text-muted-foreground">
|
||||||
|
支持跨夜区间，例如 23:00-02:00
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* 发言频率滑块 */}
|
||||||
|
<div className="grid gap-3">
|
||||||
|
<div className="flex items-center justify-between">
|
||||||
|
<Label htmlFor={`rule-value-${index}`} className="text-xs font-medium">
|
||||||
|
发言频率值 (Value)
|
||||||
|
</Label>
|
||||||
|
<Input
|
||||||
|
id={`rule-value-${index}`}
|
||||||
|
type="number"
|
||||||
|
step="0.01"
|
||||||
|
min="0.01"
|
||||||
|
max="1"
|
||||||
|
value={rule.value}
|
||||||
|
onChange={(e) => {
|
||||||
|
const val = parseFloat(e.target.value)
|
||||||
|
if (!isNaN(val)) {
|
||||||
|
updateTalkValueRule(index, 'value', Math.max(0.01, Math.min(1, val)))
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
className="w-20 h-8 text-xs"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<Slider
|
||||||
|
value={[rule.value]}
|
||||||
|
onValueChange={(values) =>
|
||||||
|
updateTalkValueRule(index, 'value', values[0])
|
||||||
|
}
|
||||||
|
min={0.01}
|
||||||
|
max={1}
|
||||||
|
step={0.01}
|
||||||
|
className="w-full"
|
||||||
|
/>
|
||||||
|
<div className="flex justify-between text-xs text-muted-foreground">
|
||||||
|
<span>0.01 (极少发言)</span>
|
||||||
|
<span>0.5</span>
|
||||||
|
<span>1.0 (正常)</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
) : (
|
||||||
|
<div className="text-center py-8 text-muted-foreground">
|
||||||
|
<p className="text-sm">暂无规则，点击"添加规则"按钮创建</p>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
|
||||||
|
<div className="mt-4 p-4 bg-blue-50 dark:bg-blue-950/20 border border-blue-200 dark:border-blue-800 rounded-lg">
|
||||||
|
<h5 className="text-sm font-semibold text-blue-900 dark:text-blue-100 mb-2">
|
||||||
|
📝 规则说明
|
||||||
|
</h5>
|
||||||
|
<ul className="text-xs text-blue-800 dark:text-blue-200 space-y-1">
|
||||||
|
<li>• <strong>Target 为空</strong>：全局规则，对所有聊天生效</li>
|
||||||
|
<li>• <strong>Target 指定</strong>：仅对特定聊天流生效（格式：platform:id:type）</li>
|
||||||
|
<li>• <strong>优先级</strong>：先匹配具体聊天流规则，再匹配全局规则</li>
|
||||||
|
<li>• <strong>时间支持跨夜</strong>：例如 23:00-02:00 表示晚上11点到次日凌晨2点</li>
|
||||||
|
<li>• <strong>数值范围</strong>：建议 0-1，0 表示完全沉默，1 表示正常发言</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue