feat(web): AgentKindEditView (create + edit)

This commit is contained in:
2026-05-07 12:00:23 +08:00
parent 996c3c8c9b
commit e5a921c26f
+90
View File
@@ -0,0 +1,90 @@
<script setup lang="ts">
import { ref, onMounted, computed } from 'vue'
import { useRoute, useRouter } from 'vue-router'
import AppShell from '@/layouts/AppShell.vue'
import AgentKindForm from '@/components/acp/AgentKindForm.vue'
import { useAcpStore } from '@/stores/acp'
import type { UpdateAgentKindReq } from '@/api/acp'
const route = useRoute()
const router = useRouter()
const store = useAcpStore()
const id = computed(() => (route.params.id as string | undefined) ?? null)
const isEdit = computed(() => id.value !== null)
const form = ref({
name: '',
display_name: '',
description: '',
binary_path: '',
args: [] as string[],
env: {} as Record<string, string>,
enabled: true,
})
const existingEnvKeys = ref<string[]>([])
onMounted(async () => {
if (isEdit.value && id.value) {
const k = await store.getAgentKind(id.value)
form.value = {
name: k.name,
display_name: k.display_name,
description: k.description,
binary_path: k.binary_path,
args: [...k.args],
env: {}, // Edit mode: do not prefill values; user must replace entirely if they want to change.
enabled: k.enabled,
}
existingEnvKeys.value = [...k.env_keys]
}
})
async function submit() {
try {
if (isEdit.value && id.value) {
const req: UpdateAgentKindReq = {
display_name: form.value.display_name,
description: form.value.description,
binary_path: form.value.binary_path,
args: form.value.args,
enabled: form.value.enabled,
}
// Only send env if user actually entered some values; an empty map would
// wipe existing env on the backend (per service patch semantics).
if (Object.keys(form.value.env).length > 0) req.env = form.value.env
await store.updateAgentKind(id.value, req)
} else {
await store.createAgentKind({
name: form.value.name,
display_name: form.value.display_name,
description: form.value.description,
binary_path: form.value.binary_path,
args: form.value.args,
env: form.value.env,
enabled: form.value.enabled,
})
}
router.push('/admin/acp/agent-kinds')
} catch (e) {
alert(`Save failed: ${e instanceof Error ? e.message : 'unknown'}`)
}
}
</script>
<template>
<AppShell>
<div class="p-6 max-w-2xl">
<h1 class="text-2xl font-semibold mb-4">
{{ isEdit ? 'Edit Agent Kind' : 'New Agent Kind' }}
</h1>
<AgentKindForm
v-model="form"
:is-edit="isEdit"
:existing-env-keys="existingEnvKeys"
@submit="submit"
@cancel="router.push('/admin/acp/agent-kinds')"
/>
</div>
</AppShell>
</template>