55 lines
1.5 KiB
Vue
55 lines
1.5 KiB
Vue
<script setup lang="ts">
|
|
import { PROJECT_STATUSES, type ProjectStatus } from "@workspace/schema/constants";
|
|
|
|
const props = withDefaults(
|
|
defineProps<{
|
|
name?: string;
|
|
description?: string;
|
|
status?: ProjectStatus;
|
|
saving?: boolean;
|
|
}>(),
|
|
{
|
|
name: "",
|
|
description: "",
|
|
status: "active",
|
|
},
|
|
);
|
|
|
|
const emit = defineEmits<{
|
|
submit: [body: { name: string; description?: string; status: string }];
|
|
}>();
|
|
|
|
const name = ref(props.name);
|
|
const description = ref(props.description);
|
|
const status = ref(props.status);
|
|
|
|
function onSubmit() {
|
|
emit("submit", {
|
|
name: name.value,
|
|
description: description.value || undefined,
|
|
status: status.value,
|
|
});
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<form class="space-y-6" @submit.prevent="onSubmit">
|
|
<UFormField label="Name" required>
|
|
<UInput v-model="name" placeholder="Project name" class="w-full" required />
|
|
</UFormField>
|
|
|
|
<UFormField label="Description">
|
|
<UTextarea v-model="description" placeholder="Optional description" class="w-full" :rows="3" />
|
|
</UFormField>
|
|
|
|
<UFormField label="Status">
|
|
<USelect v-model="status" :items="PROJECT_STATUSES.map((s) => ({ label: s, value: s }))" class="w-full" />
|
|
</UFormField>
|
|
|
|
<div class="flex gap-3 justify-end">
|
|
<UButton label="Cancel" icon="i-lucide-x" color="neutral" variant="outline" to="/projects" />
|
|
<UButton type="submit" label="Save" icon="i-lucide-save" color="primary" :loading="saving" />
|
|
</div>
|
|
</form>
|
|
</template>
|