feat: add org admin SPA for models, roles and provider

Introduce admin-web (Skeleton/SvelteKit), Prisma models for provider connection / OrgModel / OrgRole, DB-backed runtime settings, and admin API routes so org admins can manage agent configuration end-to-end.
2026-07-11 12:33:56 +08:00
parent 461d2e89b0
commit 552c1c353e
50 changed files with 6986 additions and 151 deletions
@@ -0,0 +1,148 @@
+<script lang="ts">
+	import { api, type OrgRoleRow, type OrgModelRow } from '$lib/api';
+	import { fmtDate } from '$lib/format';
+	import { TOOL_OPTIONS } from '$lib/constants';
+	import { toastError, toastSuccess } from '$lib/toast';
+
+	let {
+		r,
+		models,
+		slug,
+		onremoved,
+		onupdated
+	}: {
+		r: OrgRoleRow;
+		models: OrgModelRow[];
+		slug: string;
+		onremoved: () => void;
+		onupdated: (updated: OrgRoleRow) => void;
+	} = $props();
+
+	// Local edit buffer intentionally seeded once from the row props.
+	const initial = {
+		roleId: r.roleId,
+		label: r.label,
+		defaultModelId: r.defaultModelId ?? '',
+		systemPrompt: r.systemPrompt ?? '',
+		unrestricted: r.tools === null,
+		tools: r.tools ?? []
+	};
+	let roleId = $state(initial.roleId);
+	let label = $state(initial.label);
+	let defaultModelId = $state(initial.defaultModelId);
+	let systemPrompt = $state(initial.systemPrompt);
+	let unrestricted = $state(initial.unrestricted);
+	let selectedTools = $state<Set<string>>(new Set(initial.tools));
+	let saving = $state(false);
+
+	function toggleTool(id: string) {
+		const next = new Set(selectedTools);
+		if (next.has(id)) next.delete(id);
+		else next.add(id);
+		selectedTools = next;
+	}
+
+	async function save() {
+		saving = true;
+		const tools = unrestricted ? null : [...selectedTools];
+		try {
+			const updated = await api.updateRole(slug, r.id, {
+				roleId: roleId.trim(),
+				label: label.trim(),
+				defaultModelId: defaultModelId === '' ? null : defaultModelId,
+				systemPrompt: systemPrompt === '' ? null : systemPrompt,
+				tools
+			});
+			onupdated(updated);
+			toastSuccess('角色已保存');
+		} catch (err) {
+			toastError(err instanceof Error ? err.message : String(err));
+		} finally {
+			saving = false;
+		}
+	}
+
+	const groupedTools = TOOL_OPTIONS.reduce(
+		(acc, t) => {
+			(acc[t.group] ??= []).push(t);
+			return acc;
+		},
+		{} as Record<string, typeof TOOL_OPTIONS>
+	);
+</script>
+
+<div class="saas-card-pad">
+	<div class="mb-4 flex flex-wrap items-center gap-2">
+		<span class="saas-badge-primary font-mono">/{roleId || r.roleId}</span>
+		<span class="text-sm text-surface-500">{label || r.label}</span>
+	</div>
+
+	<div class="grid grid-cols-1 gap-4 md:grid-cols-2">
+		<div>
+			<label for="role-id-{r.id}" class="saas-label">roleId</label>
+			<input id="role-id-{r.id}" class="saas-input font-mono text-sm" bind:value={roleId} />
+		</div>
+		<div>
+			<label for="role-label-{r.id}" class="saas-label">label</label>
+			<input id="role-label-{r.id}" class="saas-input" bind:value={label} />
+		</div>
+	</div>
+
+	<div class="mt-4">
+		<label for="role-model-{r.id}" class="saas-label">默认模型</label>
+		<select id="role-model-{r.id}" class="saas-select" bind:value={defaultModelId}>
+			<option value="">（角色默认 → 首模型）</option>
+			{#each models as m}
+				<option value={m.modelId}>{m.label} ({m.modelId})</option>
+			{/each}
+		</select>
+	</div>
+
+	<div class="mt-4">
+		<span class="saas-label">工具白名单</span>
+		<label class="mb-3 flex cursor-pointer items-center gap-2 rounded-lg border border-surface-200 bg-surface-100/40 px-3 py-2">
+			<input type="checkbox" class="checkbox" bind:checked={unrestricted} />
+			<span class="text-sm">不限（使用全部注册工具）</span>
+		</label>
+		<div class="space-y-3 {unrestricted ? 'pointer-events-none opacity-40' : ''}">
+			{#each Object.entries(groupedTools) as [group, tools]}
+				<div>
+					<p class="mb-1.5 text-xs font-semibold uppercase tracking-wide text-surface-400">{group}</p>
+					<div class="grid grid-cols-1 gap-1.5 sm:grid-cols-2">
+						{#each tools as t}
+							<label class="flex cursor-pointer items-center gap-2 rounded-md px-2 py-1.5 text-sm hover:bg-surface-100">
+								<input
+									type="checkbox"
+									class="checkbox"
+									checked={selectedTools.has(t.id)}
+									onchange={() => toggleTool(t.id)}
+								/>
+								{t.label}
+							</label>
+						{/each}
+					</div>
+				</div>
+			{/each}
+		</div>
+	</div>
+
+	<div class="mt-4">
+		<label for="role-prompt-{r.id}" class="saas-label">系统提示词</label>
+		<textarea
+			id="role-prompt-{r.id}"
+			class="saas-textarea"
+			rows="4"
+			placeholder="系统提示词（可选）。会话开始时注入，定义 agent 人格/指令。"
+			bind:value={systemPrompt}
+		></textarea>
+	</div>
+
+	<div class="mt-4 flex flex-wrap items-center gap-3 border-t border-surface-100 pt-4">
+		<span class="text-xs text-surface-400">更新于 {fmtDate(r.updatedAt)}</span>
+		<div class="flex-1"></div>
+		<button class="saas-btn-danger" onclick={onremoved}>删除角色</button>
+		<button class="saas-btn-primary" onclick={save} disabled={saving}>
+			{saving ? '保存中…' : '保存'}
+		</button>
+	</div>
+</div>