feat: add save feedback prompts, featured agent fields, dynamic Dify API config, and chat improvements

- Add success/error feedback messages near submit buttons in all admin forms
- Display success prompt for 1s before redirect after save
- Show API error details on save failure
- Add isFeatured/featuredOrder fields to Agent model and admin UI
- Add difyApiUrl/difyApiKey fields for per-agent Dify API configuration
- Show featured badge column in agent admin list
- Display featured agents on homepage sorted by order
- Refactor chat page streaming with AbortController and stable userId
- Improve Dify API proxy to use per-agent credentials
This commit is contained in:
root
2026-05-08 20:15:54 +08:00
parent 362c37fb42
commit f2d7037ca2
16 changed files with 298 additions and 102 deletions
+83 -2
View File
@@ -18,7 +18,11 @@ export default function AgentForm({
features?: string
hotQuestions?: string
quickQuestions?: string
difyApiUrl?: string
difyApiKey?: string
status?: string
isFeatured?: boolean
featuredOrder?: number
}
}) {
const router = useRouter()
@@ -31,10 +35,15 @@ export default function AgentForm({
features: agent?.features || "",
hotQuestions: agent?.hotQuestions ? JSON.parse(agent.hotQuestions).join('\n') : '',
quickQuestions: agent?.quickQuestions ? JSON.parse(agent.quickQuestions).join('\n') : '',
difyApiUrl: agent?.difyApiUrl || "",
difyApiKey: agent?.difyApiKey || "",
status: agent?.status || "active",
isFeatured: agent?.isFeatured ?? false,
featuredOrder: agent?.featuredOrder ?? 0,
})
const [loading, setLoading] = useState(false)
const [error, setError] = useState("")
const [success, setSuccess] = useState(false)
const handleSubmit = async (e: React.FormEvent) => {
e.preventDefault()
@@ -50,6 +59,8 @@ export default function AgentForm({
const body = {
...formData,
isFeatured: formData.isFeatured,
featuredOrder: formData.featuredOrder,
hotQuestions: JSON.stringify(formData.hotQuestions.split('\n').filter(q => q.trim())),
quickQuestions: JSON.stringify(formData.quickQuestions.split('\n').filter(q => q.trim())),
}
@@ -61,9 +72,12 @@ export default function AgentForm({
})
if (res.ok) {
setSuccess(true)
await new Promise(r => setTimeout(r, 1000))
router.push("/admin/agents")
} else {
setError("保存失败")
const data = await res.json().catch(() => ({}))
setError(data.error || "保存失败")
}
} catch (err) {
setError("保存失败,请稍后重试")
@@ -185,6 +199,34 @@ export default function AgentForm({
/>
</div>
<div className="bg-orange-50 border border-orange-200 rounded-xl p-4">
<h3 className="text-sm font-semibold text-orange-800 mb-3"></h3>
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
<label className="flex items-center gap-3 cursor-pointer">
<input
type="checkbox"
checked={formData.isFeatured}
onChange={(e) => setFormData({ ...formData, isFeatured: e.target.checked })}
className="w-5 h-5 text-orange-600 border-gray-300 rounded focus:ring-orange-500"
/>
<span className="text-sm font-medium text-gray-700"></span>
</label>
<div>
<label className="block text-sm font-medium text-gray-700 mb-2">
</label>
<input
type="number"
min={0}
value={formData.featuredOrder}
onChange={(e) => setFormData({ ...formData, featuredOrder: parseInt(e.target.value) || 0 })}
className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500"
placeholder="0"
/>
</div>
</div>
</div>
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
<div>
<label className="block text-sm font-medium text-gray-700 mb-2">
@@ -212,10 +254,49 @@ export default function AgentForm({
</div>
</div>
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
<div>
<label className="block text-sm font-medium text-gray-700 mb-2">
Dify API
</label>
<input
type="text"
value={formData.difyApiUrl}
onChange={(e) => setFormData({ ...formData, difyApiUrl: e.target.value })}
className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500"
placeholder="https://api.dify.ai/v1"
/>
</div>
<div>
<label className="block text-sm font-medium text-gray-700 mb-2">
Dify API Key
</label>
<input
type="password"
value={formData.difyApiKey}
onChange={(e) => setFormData({ ...formData, difyApiKey: e.target.value })}
className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500"
placeholder="app-xxxxxxxxxxxx"
/>
</div>
</div>
{success && (
<div className="bg-green-50 border border-green-200 text-green-700 px-4 py-3 rounded-lg text-sm">
</div>
)}
{error && (
<div className="bg-red-50 border border-red-200 text-red-700 px-4 py-3 rounded-lg text-sm">
{error}
</div>
)}
<div className="flex gap-4">
<button
type="submit"
disabled={loading}
disabled={loading || success}
className="bg-blue-600 text-white px-6 py-2 rounded-lg hover:bg-blue-700 disabled:bg-blue-400"
>
{loading ? "保存中..." : "保存"}
+4
View File
@@ -51,7 +51,11 @@ export default async function EditAgentPage({
features: agent.features,
hotQuestions: agent.hotQuestions,
quickQuestions: agent.quickQuestions,
difyApiUrl: agent.difyApiUrl || "",
difyApiKey: agent.difyApiKey || "",
status: agent.status,
isFeatured: agent.isFeatured,
featuredOrder: agent.featuredOrder,
}}
/>
</div>
+10
View File
@@ -39,6 +39,7 @@ export default async function AdminAgentsPage() {
<tr>
<th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase"></th>
<th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase"></th>
<th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase"></th>
<th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase"></th>
<th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase">使</th>
<th className="px-6 py-3 text-right text-xs font-medium text-gray-500 uppercase"></th>
@@ -59,6 +60,15 @@ export default async function AdminAgentsPage() {
<td className="px-6 py-4 text-sm text-gray-600">
{agent.category?.name || "-"}
</td>
<td className="px-6 py-4">
{agent.isFeatured ? (
<span className="inline-flex px-2 py-1 text-xs font-medium rounded-full bg-orange-100 text-orange-700">
</span>
) : (
<span className="text-sm text-gray-400">-</span>
)}
</td>
<td className="px-6 py-4">
<span className={`inline-flex px-2 py-1 text-xs font-medium rounded-full ${
agent.status === "active"