60 lines
2.4 KiB
React
60 lines
2.4 KiB
React
import styles from "./createEventBtn.module.css"
|
|
import { useState } from "react";
|
|
import Modal from "../ui/modal/modal.jsx";
|
|
import Button from "../ui/button/button.jsx";
|
|
import TextInput from "../ui/input/input.jsx";
|
|
import createEvent from "../../utils/events/createEvent.js"
|
|
|
|
|
|
export default function CreateEventBtn() {
|
|
|
|
const [isOpen, setIsOpen] = useState(false);
|
|
const [name, setName] = useState("");
|
|
const [description, setDescription] = useState("");
|
|
const [start, setStart] = useState("");
|
|
const [end, setEnd] = useState("");
|
|
|
|
const handleCreateEvent = async () => {
|
|
|
|
if(name !== "" || description !== "" || start !== "" || end !== "") {
|
|
await createEvent(name, description, start, end);
|
|
console.log(start);
|
|
}
|
|
setIsOpen(false);
|
|
}
|
|
|
|
return <>
|
|
<Button className={`${styles.createButton} glassCard`} variant={"default"} onClick={() => setIsOpen(true)}> + </Button>
|
|
|
|
<Modal title={"Créer un événement"} open={isOpen} onClose={() => setIsOpen(false)}>
|
|
|
|
<section className={styles.section}>
|
|
<div className={styles.inputContainer}>
|
|
<h2>Titre</h2>
|
|
<TextInput className={styles.input} placeholder={"Nom de l'événement"} value={name} onChange={e => setName(e.target.value)} />
|
|
</div>
|
|
|
|
<div className={styles.inputContainer}>
|
|
<h2>Description</h2>
|
|
<TextInput className={styles.input} placeholder={"Description de l'événement"} value={description} onChange={e => setDescription(e.target.value)} />
|
|
</div>
|
|
|
|
<div className={styles.inputContainer}>
|
|
<h2>Date</h2>
|
|
<div className={styles.dateInputContainer}>
|
|
<div className={styles.dateInput}>
|
|
<p>Début</p>
|
|
<TextInput type={"datetime-local"} value={start} onChange={e => setStart(e.target.value)} />
|
|
</div>
|
|
<div className={styles.dateInput}>
|
|
<p>Fin</p>
|
|
<TextInput type={"datetime-local"} value={end} onChange={e => setEnd(e.target.value)} />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<Button onClick={handleCreateEvent} className={styles.create}>Créer</Button>
|
|
</section>
|
|
</Modal>
|
|
</>
|
|
} |