842 lines
24 KiB
TypeScript
842 lines
24 KiB
TypeScript
"use client";
|
||
|
||
import SiteBreadcrumb from "@/components/site-breadcrumb";
|
||
import { zodResolver } from "@hookform/resolvers/zod";
|
||
import { Check, ChevronsUpDown } from "lucide-react";
|
||
import { useForm } from "react-hook-form";
|
||
import { z } from "zod";
|
||
|
||
import { cn, getCookiesDecrypt } from "@/lib/utils";
|
||
import { Button } from "@/components/ui/button";
|
||
import {
|
||
Command,
|
||
CommandEmpty,
|
||
CommandGroup,
|
||
CommandInput,
|
||
CommandItem,
|
||
CommandList,
|
||
} from "@/components/ui/command";
|
||
import {
|
||
Form,
|
||
FormControl,
|
||
FormField,
|
||
FormItem,
|
||
FormLabel,
|
||
FormMessage,
|
||
} from "@/components/ui/form";
|
||
import {
|
||
Popover,
|
||
PopoverContent,
|
||
PopoverTrigger,
|
||
} from "@/components/ui/popover";
|
||
import {
|
||
AdministrationLevelList,
|
||
getListCompetencies,
|
||
getListEducation,
|
||
getListSchools,
|
||
getUserById,
|
||
updateUserInternal,
|
||
} from "@/service/management-user/management-user";
|
||
import { useEffect, useState } from "react";
|
||
import { Input } from "@/components/ui/input";
|
||
import { Textarea } from "@/components/ui/textarea";
|
||
import { Link, useRouter } from "@/i18n/routing";
|
||
import { RadioGroup, RadioGroupItem } from "@/components/ui/radio-group";
|
||
import dynamic from "next/dynamic";
|
||
import { Checkbox } from "@/components/ui/checkbox";
|
||
import {
|
||
Select,
|
||
SelectContent,
|
||
SelectItem,
|
||
SelectTrigger,
|
||
SelectValue,
|
||
} from "@/components/ui/select";
|
||
import Swal from "sweetalert2";
|
||
import withReactContent from "sweetalert2-react-content";
|
||
import { close, error, loading } from "@/config/swal";
|
||
import { useParams } from "next/navigation";
|
||
import { getUserLevels } from "@/service/approval-workflows";
|
||
|
||
const PasswordChecklist = dynamic(() => import("react-password-checklist"), {
|
||
ssr: false,
|
||
});
|
||
|
||
const sns = [
|
||
{
|
||
key: 1,
|
||
id: "comment",
|
||
typeId: 1,
|
||
name: "Komentar Konten",
|
||
},
|
||
{
|
||
key: 2,
|
||
id: "fb",
|
||
typeId: 2,
|
||
name: "Facebook",
|
||
},
|
||
{
|
||
key: 3,
|
||
id: "ig",
|
||
typeId: 3,
|
||
name: "Instagram",
|
||
},
|
||
{
|
||
key: 4,
|
||
id: "twt",
|
||
typeId: 4,
|
||
name: "Twitter",
|
||
},
|
||
{
|
||
key: 5,
|
||
id: "yt",
|
||
typeId: 5,
|
||
name: "Youtube",
|
||
},
|
||
{
|
||
key: 6,
|
||
id: "emergency",
|
||
typeId: 6,
|
||
name: "Emergency Issue",
|
||
},
|
||
{
|
||
key: 7,
|
||
id: "email",
|
||
typeId: 7,
|
||
name: "Email",
|
||
},
|
||
{
|
||
key: 8,
|
||
id: "inbox",
|
||
typeId: 8,
|
||
name: "Pesan Masuk",
|
||
},
|
||
{
|
||
key: 9,
|
||
id: "whatsapp",
|
||
typeId: 9,
|
||
name: "Whatssapp",
|
||
},
|
||
{
|
||
key: 10,
|
||
id: "tiktok",
|
||
typeId: 10,
|
||
name: "Tiktok",
|
||
},
|
||
];
|
||
|
||
interface RoleData {
|
||
id: number;
|
||
label: string;
|
||
name: string;
|
||
value: string;
|
||
levelNumber: number;
|
||
}
|
||
|
||
const FormSchema = z.object({
|
||
level: z.string({
|
||
required_error: "Required",
|
||
}),
|
||
fullname: z.string({
|
||
required_error: "Required",
|
||
}),
|
||
username: z.string({
|
||
required_error: "Required",
|
||
}),
|
||
role: z.string({
|
||
required_error: "Required",
|
||
}),
|
||
// nrp: z.string({
|
||
// required_error: "Required",
|
||
// }),
|
||
address: z.string({
|
||
required_error: "Required",
|
||
}),
|
||
email: z.string({
|
||
required_error: "Required",
|
||
}),
|
||
phoneNumber: z.string({
|
||
required_error: "Required",
|
||
}),
|
||
password: z.string({
|
||
required_error: "Required",
|
||
}),
|
||
confirmPassword: z.string({
|
||
required_error: "Required",
|
||
}),
|
||
isValidPassword: z.boolean().refine((val) => val === true, {
|
||
message: "Check Password",
|
||
}),
|
||
sns: z.array(z.string()).optional(),
|
||
education: z.string().optional(),
|
||
school: z.string().optional(),
|
||
competency: z.string().optional(),
|
||
});
|
||
|
||
export default function EditUserForm() {
|
||
const router = useRouter();
|
||
const params = useParams();
|
||
const id = params?.id;
|
||
const MySwal = withReactContent(Swal);
|
||
const levelName = getCookiesDecrypt("ulnae");
|
||
const [roleList, setRoleList] = useState<RoleData[]>([]);
|
||
|
||
const [userEducations, setUserEducations] = useState<any>();
|
||
const [userSchools, setUserSchools] = useState<any>();
|
||
const [userCompetencies, setUserCompetencies] = useState<any>();
|
||
|
||
const form = useForm<z.infer<typeof FormSchema>>({
|
||
resolver: zodResolver(FormSchema),
|
||
defaultValues: {
|
||
password: "",
|
||
confirmPassword: "",
|
||
sns: [],
|
||
education: "1",
|
||
school: "4",
|
||
competency: "2",
|
||
},
|
||
});
|
||
|
||
const passwordVal = form.watch("password");
|
||
const confPasswordVal = form.watch("confirmPassword");
|
||
const selectedRole = form.watch("role");
|
||
|
||
useEffect(() => {
|
||
getDataAdditional();
|
||
initData();
|
||
}, []);
|
||
|
||
const initData = async () => {
|
||
loading();
|
||
|
||
// 1️⃣ Ambil level dulu
|
||
const levels = await initFetch();
|
||
console.log("LEVEL READY:", levels);
|
||
|
||
// 2️⃣ Ambil user
|
||
const response = await getUserById(String(id));
|
||
close();
|
||
|
||
const list = response?.data?.data;
|
||
const user = list?.find((item: any) => item.id === Number(id));
|
||
|
||
if (!user) {
|
||
error("User tidak ditemukan");
|
||
return;
|
||
}
|
||
|
||
console.log("RESET WITH USER:", user);
|
||
|
||
// 3️⃣ Reset SETELAH level ADA
|
||
form.reset({
|
||
fullname: user.fullname ?? "",
|
||
username: user.username ?? "",
|
||
email: user.email ?? "",
|
||
address: user.address ?? "",
|
||
phoneNumber: user.phoneNumber ?? "",
|
||
// nrp: user.identityNumber ?? "",
|
||
level: String(user.userLevelId),
|
||
role: String(user.userRoleId ?? ""),
|
||
password: "",
|
||
confirmPassword: "",
|
||
sns: [],
|
||
education: "",
|
||
school: "",
|
||
competency: "",
|
||
});
|
||
};
|
||
|
||
// const initData = async () => {
|
||
// console.log("PARAM ID:", id);
|
||
|
||
// loading();
|
||
// const response = await getUserById(String(id));
|
||
// const res = response?.data?.data;
|
||
// close();
|
||
// console.log("FULL RESPONSE:", response);
|
||
// console.log("RESPONSE.DATA:", response?.data);
|
||
// console.log("RESPONSE.DATA.DATA:", response?.data?.data);
|
||
// if (Number(res.roleId) > 4) {
|
||
// form.setValue("fullname", res?.fullname);
|
||
// form.setValue("username", res?.username);
|
||
// form.setValue("phoneNumber", res?.phoneNumber);
|
||
// form.setValue("nrp", res?.memberIdentity);
|
||
// form.setValue("address", res?.address);
|
||
// form.setValue("email", res?.email);
|
||
// form.setValue("role", res?.role?.code);
|
||
// form.setValue("level", String(res?.userLevelId));
|
||
// } else {
|
||
// initFetch();
|
||
// form.setValue("fullname", res?.fullname);
|
||
// form.setValue("username", res?.username);
|
||
// form.setValue("phoneNumber", res?.phoneNumber);
|
||
// form.setValue("nrp", res?.memberIdentity);
|
||
// form.setValue("address", res?.address);
|
||
// form.setValue("email", res?.email);
|
||
// form.setValue("role", res?.role?.code);
|
||
// form.setValue("level", String(res?.userLevelId));
|
||
// }
|
||
// };
|
||
|
||
const initFetch = async () => {
|
||
const response = await getUserLevels();
|
||
const res = response?.data?.data ?? [];
|
||
|
||
const levelsArr: RoleData[] = res.map((levels: any) => ({
|
||
id: levels.id,
|
||
label: levels.aliasName ?? levels.name,
|
||
name: levels.name,
|
||
value: String(levels.id),
|
||
levelNumber: levels.levelNumber,
|
||
}));
|
||
|
||
setRoleList(levelsArr);
|
||
return levelsArr; // ⬅️ PENTING
|
||
};
|
||
|
||
async function getDataAdditional() {
|
||
const resEducations = await getListEducation();
|
||
setUserEducations(resEducations?.data?.data);
|
||
const resSchools = await getListSchools();
|
||
setUserSchools(resSchools?.data?.data);
|
||
const resCompetencies = await getListCompetencies();
|
||
setUserCompetencies(resCompetencies?.data?.data);
|
||
}
|
||
|
||
const rawRoleId = getCookiesDecrypt("urie");
|
||
const userRoleId = rawRoleId ? Number(rawRoleId) : undefined;
|
||
|
||
if (!userRoleId || Number.isNaN(userRoleId)) {
|
||
error("Role user tidak valid, silakan login ulang");
|
||
return;
|
||
}
|
||
|
||
const roles =
|
||
levelName == "MABES POLRI"
|
||
? [
|
||
{
|
||
id: "ADM-ID",
|
||
name: "Admin",
|
||
},
|
||
{
|
||
id: "APP-ID",
|
||
name: "Approver",
|
||
},
|
||
{
|
||
id: "CON-ID",
|
||
name: "Kontributor",
|
||
},
|
||
{
|
||
id: "SPV-ID",
|
||
name: "Supervisor Feedback Center",
|
||
},
|
||
{
|
||
id: "OPT-ID",
|
||
name: "Operator Feedback Center",
|
||
},
|
||
{
|
||
id: "KKUR-ID",
|
||
name: "Koor Kurator",
|
||
},
|
||
{
|
||
id: "KUR-ID",
|
||
name: "Kurator",
|
||
},
|
||
]
|
||
: [
|
||
{
|
||
id: "APP-ID",
|
||
name: "Approver",
|
||
},
|
||
{
|
||
id: "CON-ID",
|
||
name: "Kontributor",
|
||
},
|
||
];
|
||
|
||
async function save(data: z.infer<typeof FormSchema>) {
|
||
const req = {
|
||
fullname: data.fullname,
|
||
username: data.username,
|
||
email: data.email,
|
||
address: data.address,
|
||
phoneNumber: data.phoneNumber,
|
||
userLevelId: Number(data.level),
|
||
userRoleId: userRoleId,
|
||
};
|
||
|
||
// let req: any = {
|
||
// id: Number(id),
|
||
// firstName: data.fullname,
|
||
// username: data.username,
|
||
// roleId: data.role,
|
||
// userLevelId: Number(data.level),
|
||
// memberIdentity: data.nrp,
|
||
// address: data.address,
|
||
// email: data.email,
|
||
// password: data.password,
|
||
// passwordConf: data.confirmPassword,
|
||
// isDefault: false,
|
||
// isAdmin: true,
|
||
// };
|
||
|
||
console.log("USER ROLE ID FROM COOKIE:", rawRoleId, userRoleId);
|
||
console.log("REQUEST UPDATE:", req);
|
||
|
||
loading();
|
||
const response = await updateUserInternal(Number(id), req);
|
||
|
||
if (response?.error) {
|
||
error(response.message);
|
||
return false;
|
||
}
|
||
|
||
close();
|
||
MySwal.fire({
|
||
title: "Sukses",
|
||
icon: "success",
|
||
confirmButtonColor: "#3085d6",
|
||
confirmButtonText: "Oke",
|
||
}).then((result) => {
|
||
if (result.isConfirmed) {
|
||
router.push("/admin/management-user");
|
||
}
|
||
});
|
||
return false;
|
||
}
|
||
|
||
async function onSubmit(data: z.infer<typeof FormSchema>) {
|
||
MySwal.fire({
|
||
title: "Simpan Data?",
|
||
text: "",
|
||
icon: "warning",
|
||
showCancelButton: true,
|
||
cancelButtonColor: "#d33",
|
||
confirmButtonColor: "#3085d6",
|
||
confirmButtonText: "Simpan",
|
||
}).then((result) => {
|
||
if (result.isConfirmed) {
|
||
save(data);
|
||
}
|
||
});
|
||
}
|
||
|
||
return (
|
||
<div>
|
||
<SiteBreadcrumb />
|
||
<Form {...form}>
|
||
<form
|
||
onSubmit={form.handleSubmit(onSubmit)}
|
||
className="space-y-6 bg-white p-10 w-full"
|
||
>
|
||
<p className="text-xl">Data User</p>
|
||
<FormField
|
||
control={form.control}
|
||
name="level"
|
||
render={({ field }) => (
|
||
<FormItem className="flex flex-col">
|
||
<FormLabel>Pilih Level</FormLabel>
|
||
<Popover>
|
||
<PopoverTrigger asChild>
|
||
<FormControl>
|
||
<Button
|
||
variant="outline"
|
||
role="combobox"
|
||
className={cn(
|
||
"w-[400px] justify-between",
|
||
!field.value && "text-muted-foreground",
|
||
)}
|
||
>
|
||
{field.value
|
||
? roleList.find((role) => role.value === field.value)
|
||
?.label
|
||
: "Pilih level"}
|
||
<ChevronsUpDown className="ml-2 h-4 w-4 shrink-0 opacity-50" />
|
||
</Button>
|
||
</FormControl>
|
||
</PopoverTrigger>
|
||
<PopoverContent className="w-[400px] p-0">
|
||
<Command>
|
||
<CommandInput />
|
||
<CommandList>
|
||
<CommandEmpty>No role found.</CommandEmpty>
|
||
<CommandGroup>
|
||
{roleList.map((role) => (
|
||
<CommandItem
|
||
value={role.label}
|
||
key={role.value}
|
||
onSelect={() => {
|
||
form.setValue("level", role.value);
|
||
}}
|
||
>
|
||
{role.label}
|
||
<Check
|
||
className={cn(
|
||
"ml-auto",
|
||
role.value === field.value
|
||
? "opacity-100"
|
||
: "opacity-0",
|
||
)}
|
||
/>
|
||
</CommandItem>
|
||
))}
|
||
</CommandGroup>
|
||
</CommandList>
|
||
</Command>
|
||
</PopoverContent>
|
||
</Popover>
|
||
<FormMessage />
|
||
</FormItem>
|
||
)}
|
||
/>
|
||
<FormField
|
||
control={form.control}
|
||
name="fullname"
|
||
render={({ field }) => (
|
||
<FormItem>
|
||
<FormLabel>Nama Lengkap</FormLabel>
|
||
<FormControl>
|
||
<Input
|
||
placeholder="Masukkan nama lengkap"
|
||
{...field}
|
||
className="w-1/2"
|
||
/>
|
||
</FormControl>
|
||
|
||
<FormMessage />
|
||
</FormItem>
|
||
)}
|
||
/>
|
||
<FormField
|
||
control={form.control}
|
||
name="username"
|
||
render={({ field }) => (
|
||
<FormItem>
|
||
<FormLabel>Username</FormLabel>
|
||
<FormControl>
|
||
<Input
|
||
placeholder="Masukkan username"
|
||
{...field}
|
||
className="w-1/2"
|
||
/>
|
||
</FormControl>
|
||
|
||
<FormMessage />
|
||
</FormItem>
|
||
)}
|
||
/>
|
||
|
||
{/* <FormField
|
||
control={form.control}
|
||
name="role"
|
||
render={({ field }) => (
|
||
<FormItem className="space-y-3">
|
||
<FormLabel>Role</FormLabel>
|
||
<FormControl>
|
||
<RadioGroup
|
||
onValueChange={field.onChange}
|
||
value={field.value}
|
||
className="flex flex-wrap gap-3 w-1/2"
|
||
>
|
||
{roles.map((role) => (
|
||
<FormItem
|
||
key={role.id}
|
||
className="flex items-center space-x-3 space-y-0"
|
||
>
|
||
<FormControl>
|
||
<RadioGroupItem value={role.id} />
|
||
</FormControl>
|
||
<FormLabel className="font-normal">
|
||
{role.name}
|
||
</FormLabel>
|
||
</FormItem>
|
||
))}
|
||
</RadioGroup>
|
||
</FormControl>
|
||
<FormMessage />
|
||
</FormItem>
|
||
)}
|
||
/> */}
|
||
{/* {selectedRole === "OPT-ID" && (
|
||
<FormField
|
||
control={form.control}
|
||
name="sns"
|
||
render={() => (
|
||
<FormItem>
|
||
<div className="mb-4">
|
||
<FormLabel>Social Media Yang Ditangani</FormLabel>
|
||
</div>
|
||
<div className="grid grid-cols-5 gap-2 w-1/2">
|
||
{sns.map((item) => (
|
||
<FormField
|
||
key={item.id}
|
||
control={form.control}
|
||
name="sns"
|
||
render={({ field }) => {
|
||
return (
|
||
<FormItem
|
||
key={item.typeId}
|
||
className="flex flex-row items-start space-x-3 space-y-0"
|
||
>
|
||
<FormControl>
|
||
<Checkbox
|
||
checked={field.value?.includes(
|
||
String(item.typeId),
|
||
)}
|
||
onCheckedChange={(checked) => {
|
||
return checked
|
||
? field.onChange([
|
||
...(field.value || []),
|
||
String(item.typeId),
|
||
])
|
||
: field.onChange(
|
||
(field.value || []).filter(
|
||
(value) =>
|
||
value !== String(item.typeId),
|
||
),
|
||
);
|
||
}}
|
||
/>
|
||
</FormControl>
|
||
<FormLabel className="font-normal">
|
||
{item.name}
|
||
</FormLabel>
|
||
</FormItem>
|
||
);
|
||
}}
|
||
/>
|
||
))}
|
||
</div>
|
||
|
||
<FormMessage />
|
||
</FormItem>
|
||
)}
|
||
/>
|
||
)}
|
||
|
||
{selectedRole === "KUR-ID" && (
|
||
<>
|
||
<FormField
|
||
control={form.control}
|
||
name="education"
|
||
render={({ field }) => (
|
||
<FormItem>
|
||
<FormLabel>Pendidikan Terakhir</FormLabel>
|
||
<Select onValueChange={field.onChange} value={field.value}>
|
||
<FormControl>
|
||
<SelectTrigger>
|
||
<SelectValue />
|
||
</SelectTrigger>
|
||
</FormControl>
|
||
<SelectContent>
|
||
{userEducations?.map((edu: any) => (
|
||
<SelectItem key={edu.id} value={String(edu.id)}>
|
||
{edu.name}
|
||
</SelectItem>
|
||
))}
|
||
</SelectContent>
|
||
</Select>
|
||
|
||
<FormMessage />
|
||
</FormItem>
|
||
)}
|
||
/>
|
||
<FormField
|
||
control={form.control}
|
||
name="school"
|
||
render={({ field }) => (
|
||
<FormItem>
|
||
<FormLabel>Universitas / Perguruan Tinggi</FormLabel>
|
||
<Select onValueChange={field.onChange} value={field.value}>
|
||
<FormControl>
|
||
<SelectTrigger>
|
||
<SelectValue />
|
||
</SelectTrigger>
|
||
</FormControl>
|
||
<SelectContent>
|
||
{userSchools?.map((edu: any) => (
|
||
<SelectItem key={edu.id} value={String(edu.id)}>
|
||
{edu.name}
|
||
</SelectItem>
|
||
))}
|
||
</SelectContent>
|
||
</Select>
|
||
|
||
<FormMessage />
|
||
</FormItem>
|
||
)}
|
||
/>
|
||
<FormField
|
||
control={form.control}
|
||
name="competency"
|
||
render={({ field }) => (
|
||
<FormItem>
|
||
<FormLabel>Kompetensi</FormLabel>
|
||
<Select onValueChange={field.onChange} value={field.value}>
|
||
<FormControl>
|
||
<SelectTrigger>
|
||
<SelectValue />
|
||
</SelectTrigger>
|
||
</FormControl>
|
||
<SelectContent>
|
||
{userCompetencies?.map((edu: any) => (
|
||
<SelectItem key={edu.id} value={String(edu.id)}>
|
||
{edu.name}
|
||
</SelectItem>
|
||
))}
|
||
</SelectContent>
|
||
</Select>
|
||
|
||
<FormMessage />
|
||
</FormItem>
|
||
)}
|
||
/>
|
||
</>
|
||
)}
|
||
<FormField
|
||
control={form.control}
|
||
name="nrp"
|
||
render={({ field }) => (
|
||
<FormItem>
|
||
<FormLabel>Nomor Regitrasi Polri {`(NRP)`}</FormLabel>
|
||
<FormControl>
|
||
<Input
|
||
type="number"
|
||
placeholder="Masukkan NRP"
|
||
{...field}
|
||
className="w-1/2"
|
||
/>
|
||
</FormControl>
|
||
|
||
<FormMessage />
|
||
</FormItem>
|
||
)}
|
||
/> */}
|
||
|
||
<FormField
|
||
control={form.control}
|
||
name="address"
|
||
render={({ field }) => (
|
||
<FormItem>
|
||
<FormLabel>Alamat</FormLabel>
|
||
<FormControl>
|
||
<Textarea
|
||
placeholder="Masukkan alamat"
|
||
className="resize-none w-1/2"
|
||
{...field}
|
||
/>
|
||
</FormControl>
|
||
|
||
<FormMessage />
|
||
</FormItem>
|
||
)}
|
||
/>
|
||
|
||
<FormField
|
||
control={form.control}
|
||
name="email"
|
||
render={({ field }) => (
|
||
<FormItem>
|
||
<FormLabel>Email</FormLabel>
|
||
<FormControl>
|
||
<Input
|
||
type="email"
|
||
placeholder="Masukkan email"
|
||
{...field}
|
||
className="w-1/2"
|
||
/>
|
||
</FormControl>
|
||
|
||
<FormMessage />
|
||
</FormItem>
|
||
)}
|
||
/>
|
||
|
||
<FormField
|
||
control={form.control}
|
||
name="phoneNumber"
|
||
render={({ field }) => (
|
||
<FormItem>
|
||
<FormLabel>No. Handphone</FormLabel>
|
||
<FormControl>
|
||
<Input
|
||
type="number"
|
||
placeholder="Masukkan nomor handphone"
|
||
{...field}
|
||
className="w-1/2"
|
||
/>
|
||
</FormControl>
|
||
|
||
<FormMessage />
|
||
</FormItem>
|
||
)}
|
||
/>
|
||
|
||
<FormField
|
||
control={form.control}
|
||
name="password"
|
||
render={({ field }) => (
|
||
<FormItem>
|
||
<FormLabel>Password</FormLabel>
|
||
<FormControl>
|
||
<Input
|
||
type="password"
|
||
placeholder="Masukkan kata sandi"
|
||
{...field}
|
||
className="w-1/2"
|
||
/>
|
||
</FormControl>
|
||
|
||
<FormMessage />
|
||
</FormItem>
|
||
)}
|
||
/>
|
||
<FormField
|
||
control={form.control}
|
||
name="confirmPassword"
|
||
render={({ field }) => (
|
||
<FormItem>
|
||
<FormLabel>Konfirmasi Kata Sandi</FormLabel>
|
||
<FormControl>
|
||
<Input
|
||
type="password"
|
||
placeholder="Masukkan kata sandi"
|
||
{...field}
|
||
className="w-1/2"
|
||
/>
|
||
</FormControl>
|
||
|
||
<FormMessage />
|
||
</FormItem>
|
||
)}
|
||
/>
|
||
<PasswordChecklist
|
||
rules={["minLength", "specialChar", "number", "capital", "match"]}
|
||
minLength={8}
|
||
value={passwordVal || ""}
|
||
valueAgain={confPasswordVal || ""}
|
||
onChange={(isValid) => {
|
||
form.setValue("isValidPassword", isValid);
|
||
}}
|
||
className="text-sm"
|
||
messages={{
|
||
minLength: "Password harus lebih dari 8 karakter",
|
||
specialChar: "Password harus memiliki spesial karakter",
|
||
number: "Password harus memiliki angka",
|
||
capital: "Password harus memiliki huruf kapital",
|
||
match: "Password sama",
|
||
}}
|
||
/>
|
||
<Link href="/admin/management-user">
|
||
<Button type="button" color="primary" variant="outline">
|
||
Back
|
||
</Button>
|
||
</Link>
|
||
<Button type="submit" color="primary" className="mx-3">
|
||
Submit
|
||
</Button>
|
||
</form>
|
||
</Form>
|
||
</div>
|
||
);
|
||
}
|