add: validation for aspect management form modal
This commit is contained in:
parent
6416aeb243
commit
b0a77bb1f2
|
|
@ -93,6 +93,12 @@ export default function AspectFormModal() {
|
||||||
|
|
||||||
const handleSubmit = async (values: typeof form.values) => {
|
const handleSubmit = async (values: typeof form.values) => {
|
||||||
try {
|
try {
|
||||||
|
// Name field validation
|
||||||
|
if (values.name.trim() === "") {
|
||||||
|
form.setErrors({ name: "Nama aspek harus diisi" });
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
let payload: CreateAspectPayload | EditAspectPayload;
|
let payload: CreateAspectPayload | EditAspectPayload;
|
||||||
|
|
||||||
if (formType === "create") {
|
if (formType === "create") {
|
||||||
|
|
@ -108,6 +114,7 @@ export default function AspectFormModal() {
|
||||||
};
|
};
|
||||||
await createAspect(payload);
|
await createAspect(payload);
|
||||||
} else if (formType === "edit") {
|
} else if (formType === "edit") {
|
||||||
|
// Add validation for aspect name here
|
||||||
payload = {
|
payload = {
|
||||||
id: values.id,
|
id: values.id,
|
||||||
name: values.name,
|
name: values.name,
|
||||||
|
|
@ -135,6 +142,18 @@ export default function AspectFormModal() {
|
||||||
navigate({ search: {} });
|
navigate({ search: {} });
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error("Error during submit:", error);
|
console.error("Error during submit:", error);
|
||||||
|
|
||||||
|
if (error instanceof Error && error.message === "Aspect name already exists") {
|
||||||
|
notifications.show({
|
||||||
|
message: "Nama aspek sudah ada. Silakan gunakan nama lain.",
|
||||||
|
color: "red",
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
notifications.show({
|
||||||
|
message: "Terjadi kesalahan saat menyimpan aspek.",
|
||||||
|
color: "red",
|
||||||
|
});
|
||||||
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
@ -152,36 +171,39 @@ export default function AspectFormModal() {
|
||||||
label="Nama"
|
label="Nama"
|
||||||
{...form.getInputProps("name")}
|
{...form.getInputProps("name")}
|
||||||
disabled={formType === "detail"}
|
disabled={formType === "detail"}
|
||||||
|
error={form.errors.name}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
{form.values.subAspects.map((field, index) => (
|
{form.values.subAspects.map((field, index) => (
|
||||||
<Group key={index} mt="md" align="center">
|
<Group key={index} mt="md" align="center">
|
||||||
<TextInput
|
<TextInput
|
||||||
type="text"
|
type="text"
|
||||||
label={`Sub Aspek ${index + 1}`}
|
label={`Sub Aspek ${index + 1}`}
|
||||||
value={field.name}
|
value={field.name}
|
||||||
onChange={(event) => {
|
onChange={(event) => {
|
||||||
const newSubAspects = [...form.values.subAspects];
|
const newSubAspects = [...form.values.subAspects];
|
||||||
newSubAspects[index] = { ...newSubAspects[index], name: event.target.value };
|
newSubAspects[index] = { ...newSubAspects[index], name: event.target.value };
|
||||||
|
form.setValues({ subAspects: newSubAspects });
|
||||||
|
}}
|
||||||
|
disabled={formType === "detail"}
|
||||||
|
style={{ flex: 1 }}
|
||||||
|
/>
|
||||||
|
{formType === "detail" && (
|
||||||
|
<Text>Jumlah Soal: {field.questionCount}</Text>
|
||||||
|
)}
|
||||||
|
{formType !== "detail" && (
|
||||||
|
<Button
|
||||||
|
className="mt-6"
|
||||||
|
variant="outline"
|
||||||
|
onClick={() => {
|
||||||
|
const newSubAspects = form.values.subAspects.filter((_, i) => i !== index);
|
||||||
form.setValues({ subAspects: newSubAspects });
|
form.setValues({ subAspects: newSubAspects });
|
||||||
}}
|
}}
|
||||||
disabled={formType === "detail"}
|
>
|
||||||
/>
|
Hapus
|
||||||
{formType === "detail" && (
|
</Button>
|
||||||
<Text>Jumlah Soal: {field.questionCount}</Text>
|
)}
|
||||||
)}
|
</Group>
|
||||||
{formType !== "detail" && (
|
|
||||||
<Button
|
|
||||||
variant="outline"
|
|
||||||
onClick={() => {
|
|
||||||
const newSubAspects = form.values.subAspects.filter((_, i) => i !== index);
|
|
||||||
form.setValues({ subAspects: newSubAspects });
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
Hapus
|
|
||||||
</Button>
|
|
||||||
)}
|
|
||||||
</Group>
|
|
||||||
))}
|
))}
|
||||||
|
|
||||||
{formType !== "detail" && (
|
{formType !== "detail" && (
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue
Block a user