33 lines
1.2 KiB
Vue
33 lines
1.2 KiB
Vue
<script setup lang="ts">
|
|
const { activeAgent: agent, updateAgent } = await useAgents();
|
|
const route = useRoute()
|
|
|
|
if (agent.value === undefined) navigateTo('/');
|
|
|
|
const handleInput = (e: Event) => {
|
|
const target = e.target as HTMLInputElement;
|
|
if (target.value.length === 0) {
|
|
return;
|
|
}
|
|
|
|
updateAgent(agent.value!.id, { name: target.value });
|
|
};
|
|
</script>
|
|
|
|
<template>
|
|
<div class="flex flex-col gap-4 px-14">
|
|
<div class="flex items-center gap-4">
|
|
<div>
|
|
<img v-if="agent?.imageUrl" :src="agent.imageUrl" class="w-16 h-16 rounded-full object-cover" />
|
|
<Icon v-else name="mynaui:check-hexagon" class="text-16" />
|
|
</div>
|
|
<input @input="handleInput" placeholder="Agent Name..."
|
|
class="placeholder:text-[var(--color-highlight)] w-full bg-transparent rounded-none border-b-4 border-b-[var(--color-highlight-high)] text-12 p-0"
|
|
type="text" :value="agent?.name" />
|
|
</div>
|
|
<div class="flex items-center gap-2">
|
|
<span class="text-sm text-[var(--color-subtle)]">Agent ID:</span>
|
|
<span class="text-sm font-semibold">{{ route.params.id }}</span>
|
|
</div>
|
|
</div>
|
|
</template> |