52 lines
2.0 KiB
TypeScript
52 lines
2.0 KiB
TypeScript
import React from "react";
|
|
import styles from "./Landing.module.css";
|
|
import { customerState } from "../store";
|
|
import Calendar from "./Calendar";
|
|
import { fetchCustomerData } from "../api";
|
|
import { useAtom } from "jotai";
|
|
|
|
export default function Landing() {
|
|
const [customerData, setCustomerData] = useAtom(customerState);
|
|
|
|
const submitIdentifier = (formData: FormData) => {
|
|
const identifier = formData.get("identifier") as string;
|
|
if (identifier) {
|
|
fetchCustomerData(identifier)
|
|
.then((data) => {
|
|
setCustomerData(data);
|
|
}).catch((error) => {
|
|
console.error("Error fetching customer data:", error);
|
|
});
|
|
}
|
|
}
|
|
|
|
return (
|
|
customerData.identifier === 'Tuntematon' || customerData.identifier === 'Ei löydy' ? (
|
|
<>
|
|
<form action={submitIdentifier} className={styles.identifierForm}>
|
|
<label htmlFor="identifier" className={styles.identifierLabel}>Tunnus</label>
|
|
<input name="identifier" type="password" className={styles.identifierInput} />
|
|
<button type="submit" className={styles.submitButton} >Kirjaudu</button>
|
|
</form>
|
|
|
|
{customerData.identifier === 'Ei löydy' && (
|
|
<div className={styles.notFoundMessage}>
|
|
Tunnusta ei löydy. Ole hyvä ja tarkista tunnus.
|
|
</div>
|
|
)}
|
|
|
|
<div className={styles.infoText}>
|
|
Kirjaudu sisään tilauksesi tunnuksella.
|
|
<br />
|
|
Ongelmatilanteissa voit ottaa yhteyttä asiakaspalvelumme
|
|
<br />
|
|
<a href="mailto:livonsaaren.osuuspuutarha@gmail.com">
|
|
livonsaaren.osuuspuutarha@gmail.com
|
|
</a>
|
|
</div>
|
|
</>
|
|
) : (
|
|
<Calendar />
|
|
)
|
|
);
|
|
} |