work-hub-server/apps/web/app/pages/projects/[id]/edit.vue
2026-06-22 15:46:46 +04:00

71 lines
1.7 KiB
Vue

<script setup lang="ts">
import type { Project } from "@workspace/schema";
const { t } = useI18n();
definePageMeta({
title: "Edit Project",
});
const route = useRoute();
const router = useRouter();
const { updateProject } = useProjectApi();
const saving = ref(false);
const project = ref<Project | null>(null);
const loading = ref(true);
const notFound = ref(false);
onMounted(async () => {
try {
project.value = await $fetch<Project>(`${useRuntimeConfig().public.apiBaseUrl as string}/projects/${route.params.id}`);
} catch {
notFound.value = true;
} finally {
loading.value = false;
}
});
async function handleSubmit(body: { name: string; description?: string; status: string }) {
saving.value = true;
const updated = await updateProject(route.params.id as string, body);
saving.value = false;
if (updated) router.push("/projects");
}
</script>
<template>
<UPage>
<UPageHeader :title="t('projects.edit')" :description="t('projects.editDescription')">
<template #right>
<UButton
:label="t('form.back')"
icon="i-lucide-chevron-left"
color="neutral"
variant="outline"
to="/projects" />
</template>
</UPageHeader>
<UPageBody>
<UAlert
v-if="notFound"
color="warning"
variant="soft"
icon="i-lucide-alert-triangle"
:title="t('projects.notFound')" />
<UProgress v-else-if="loading" />
<UCard v-else-if="project">
<ProjectForm
:name="project.name"
:description="project.description ?? undefined"
:status="project.status"
:saving
@submit="handleSubmit" />
</UCard>
</UPageBody>
</UPage>
</template>