import { Depan } from '@/components/Layouts'
import { useAuth } from '@/hooks/auth'
import { useFormik } from 'formik'
import Head from 'next/head'
import Image from 'next/image'
import Link from 'next/link'
import { Button } from 'primereact/button'
import { Captcha } from 'primereact/captcha'
import { InputText } from 'primereact/inputtext'
import { Password } from 'primereact/password'
import { Toast } from 'primereact/toast'
import { useRef, useState } from 'react'
export default function Login() {
const toast = useRef(null)
const { login } = useAuth({})
const [loading, setLoading] = useState(false)
const formik = useFormik({
initialValues: {
username: '',
password: '',
recaptcha: '',
},
validate: (data) => {
let errors = {}
if (!data.username) errors.username = 'Username is required.'
if (!data.password) errors.password = 'Password is required.'
if (!data.recaptcha) errors.recaptcha = 'Recaptcha is required.'
return errors
},
onSubmit: (data) => {
setLoading(true)
const username = data.username
const password = data.password
const recaptcha = data.recaptcha
login({ username, password, recaptcha, toast, setLoading })
},
validateOnChange: false,
})
const isFieldValid = (field) => !!(formik.touched[field] && formik.errors[field])
const errorFieldMessage = (field) => {
return (
isFieldValid(field) && (
{formik.errors[field]}
)
)
}
const handleCaptcha = (captcha) => {
formik.setFieldValue('recaptcha', captcha)
}
return (
<>
SISTEM APLIKASI
PENYELESAIAN TAGIHAN dan PERTANGGUNGJAWABAN KEUANGAN
Login
Enter your username and password to sign in