Rev 16259 | Rev 16264 | Ir a la última revisión | Autoría | Comparar con el anterior | Ultima modificación | Ver Log |
import React, { useState, useEffect } from "react";
import { axios } from "../../../../utils";
import { useDispatch } from "react-redux";
import { useForm } from "react-hook-form";
import { Modal } from "@mui/material";
import Datetime from "react-datetime";
import FormErrorFeedback from "../../../../shared/form-error-feedback/FormErrorFeedback";
const ConferenceModal = ({
show = false,
timezones = {},
zoomUrl = "",
onCreate = () => null,
}) => {
const dt = new Date();
const { handleSubmit, register, errors, reset } = useForm({ mode: "all" });
const [date, setDate] = useState({
year: dt.toLocaleString("default", { year: "numeric" }),
month: dt.toLocaleString("default", { month: "2-digit" }),
day: dt.toLocaleString("default", { day: "2-digit" }),
});
const [time, setTime] = useState(
dt.toLocaleString("es", {
hour: "numeric",
minute: "2-digit",
second: "2-digit",
})
);
const [coferenceType, setConferenceType] = useState(1);
const [isShow, setIsShow] = useState(show);
const dispatch = useDispatch();
const closeModal = () => {
setIsShow(false);
};
const handleChange = (value) => {
setConferenceType(value);
};
const handleDateTime = (value) => {
setDate({
...date,
year: new Intl.DateTimeFormat("es", { year: "numeric" }).format(value),
month: new Intl.DateTimeFormat("es", { month: "2-digit" }).format(value),
day: new Intl.DateTimeFormat("es", { day: "2-digit" }).format(value),
});
setTime(
new Intl.DateTimeFormat("es", {
hour: "numeric",
minute: "2-digit",
second: "numeric",
}).format(value)
);
};
const onSubmit = async (data) => {
try {
const formData = new FormData();
Object.entries(data).forEach(([key, value]) =>
formData.append(key, value)
);
formData.append("date", `${date.year}-${date.month}-${date.day}`);
formData.append("time", time);
const { data: response } = await axios.post(zoomUrl, formData);
if (!response.success && typeof response.data === "string") {
dispatch(addNotification({ msg: response.data, style: "danger" }));
return;
}
if (!response.success && typeof response.data === "object") {
Object.entries(response.data).forEach(([key, value]) => {
dispatch(
addNotification({ msg: `${key}: ${value[0]}`, style: "danger" })
);
});
return;
}
dispatch(addNotification({ msg: response.data, style: "success" }));
onCreate();
reset();
} catch (error) {
console.log(`Error: ${error.message}`);
return dispatch(
addNotification({ msg: "Ha ocurrido un error", style: "danger" })
);
}
};
useEffect(() => {
setIsShow(show);
}, [show]);
return (
<Modal show={isShow} onHide={closeModal}>
<Modal.Header closeButton>
<Modal.Title>Crear Conferencia</Modal.Title>
</Modal.Header>
<Modal.Body></Modal.Body>
</Modal>
);
};
export default ConferenceModal;