Finalização da funcionalidade de lembrete/agendameto com remoção das variáveis não usadas

pull/1/head
adriano 2022-03-30 11:09:20 -03:00
parent a36e05992b
commit 56fccf8414
6 changed files with 144 additions and 258 deletions

View File

@ -13,27 +13,14 @@ import DatePicker from '../../Report/DatePicker'
import TimerPickerSelect from '../TimerPickerSelect'
import TextareaAutosize from '@mui/material/TextareaAutosize';
import { subHours, addDays, isEqual, subDays} from "date-fns";
import { subHours, addDays, subDays} from "date-fns";
import TextFieldSelectHourBefore from '@mui/material/TextField';
import MenuItem from '@mui/material/MenuItem';
import {
IconButton,
Paper,
Table,
TableBody,
TableCell,
TableHead,
TableRow,
} from "@material-ui/core";
import { DeleteOutline } from "@material-ui/icons";
import { toast } from "react-toastify";
import api from "../../../services/api";
import toastError from "../../../errors/toastError";
import ConfirmationModal from "../../ConfirmationModal";
const reducer = (state, action) => {
@ -109,8 +96,7 @@ Item.propTypes = {
const Modal = (props) => {
// const [clientSchedules, dispatch] = useReducer(reducer, []);
const [selectedSchedule, setSelectedSchedule] = useState(null);
const [confirmModalOpen, setConfirmModalOpen] = useState(false);
// const [selectedSchedule, setSelectedSchedule] = useState(null);
const [open, setOpen] = useState(true);
const [scroll, /*setScroll*/] = useState('body');
const [statusChatEndId, setStatusChatEnd] = useState(null)
@ -162,22 +148,17 @@ const Modal = (props) => {
const handleCloseConfirmationModal = () => {
setConfirmModalOpen(false);
setSelectedSchedule(null);
};
const handleDeleteSchedule = async (scheduleId) => {
try {
await api.delete(`/schedule/${scheduleId}`);
toast.success(("Lembrete/Agendamento deletado com sucesso!"));
dispatch({ type: "DELETE_SCHEDULE", payload: scheduleId });
} catch (err) {
toastError(err);
}
setSelectedSchedule(null);
};
// const handleDeleteSchedule = async (scheduleId) => {
// try {
// await api.delete(`/schedule/${scheduleId}`);
// toast.success(("Lembrete/Agendamento deletado com sucesso!"));
// dispatch({ type: "DELETE_SCHEDULE", payload: scheduleId });
// } catch (err) {
// toastError(err);
// }
// setSelectedSchedule(null);
// };
// Get from child 2
const datePickerValue = (data) => {
@ -225,7 +206,7 @@ const timerPickerValue = (data) => {
console.log('Entrou! textArea1: ', textArea1)
if( startDate.trim().length==0){
if( startDate.trim().length === 0){
alert('Selecione uma data atual ou futura!')
@ -579,70 +560,9 @@ const handleChangeHourBefore = (event) => {
}
{/* {schedulesContact.length>0 &&
<Item>
<ConfirmationModal
title={selectedSchedule && `Deletar lembrete do dia ${selectedSchedule.schedulingTime.split(' ')[0]} ${selectedSchedule.schedulingTime.split(' ')[1]} ?`}
open={confirmModalOpen}
onClose={handleCloseConfirmationModal}
onConfirm={() => handleDeleteSchedule(selectedSchedule.id)}
>
<span>Deseja realmente deletar esse Lembrete? </span>
</ConfirmationModal>
<span>Lembretes</span>
<Paper variant="outlined">
<Table size="small">
<TableHead>
<TableRow>
<TableCell align="center">
Data
</TableCell>
<TableCell align="center">
Hora
</TableCell>
<TableCell align="center">
Mensagem
</TableCell>
<TableCell align="center">
Deletar
</TableCell>
</TableRow>
</TableHead>
<TableBody>
<>
{schedulesContact.map((scheduleData, index) => (
<TableRow key={scheduleData.id}>
<TableCell align="center">{scheduleData.schedulingDate.split(' ')[0]}</TableCell>
<TableCell align="center">{scheduleData.schedulingTime.split(' ')[1]}</TableCell>
<TableCell align="center">{scheduleData.message}</TableCell>
<TableCell align="center">
<IconButton
size="small"
onClick={() => {
setSelectedSchedule(scheduleData);
setConfirmModalOpen(true);
}}
>
<DeleteOutline />
</IconButton>
</TableCell>
</TableRow>
))}
</>
</TableBody>
</Table>
</Paper>
</Item>} */}
{schedulesContact.length>0 &&
<div></div>
}
</Box>

View File

@ -31,8 +31,6 @@ function formatDate(strDate){
function ResponsiveDatePickers(props) {
console.log('schedulingDate schedulingDate schedulingDate2: ', (props.schedulingDate))
console.log('schedulingDate schedulingDate schedulingDate: ', formatDate(props.schedulingDate))
const [selectedDate, handleDateChange] = useState(new Date(formatDate(props.schedulingDate)));

View File

@ -14,29 +14,16 @@ import DatePicker from './DatePicker2'
import TimerPickerSelect from './TimerPickerSelect2'
import TextareaAutosize from '@mui/material/TextareaAutosize';
import { subHours, addDays, isEqual, subDays} from "date-fns";
import { subHours, addDays, subDays} from "date-fns";
import TextFieldSelectHourBefore from '@mui/material/TextField';
import MenuItem from '@mui/material/MenuItem';
import {
IconButton,
Paper,
Table,
TableBody,
TableCell,
TableHead,
TableRow,
} from "@material-ui/core";
import { DeleteOutline } from "@material-ui/icons";
import { toast } from "react-toastify";
import api from "../../services/api";
import toastError from "../../errors/toastError";
import ConfirmationModal from "../ConfirmationModal";
const reducer = (state, action) => {
@ -111,8 +98,8 @@ Item.propTypes = {
const Modal = (props) => {
const [selectedSchedule, setSelectedSchedule] = useState(null);
const [confirmModalOpen, setConfirmModalOpen] = useState(false);
// const [selectedSchedule, setSelectedSchedule] = useState(null);
// const [confirmModalOpen, setConfirmModalOpen] = useState(false);
const [open, setOpen] = useState(true);
const [scroll, /*setScroll*/] = useState('body');
@ -124,10 +111,10 @@ const Modal = (props) => {
const [currencyHourBefore, setCurrency] = useState(props.rowData.schedulingTime.split(' ')[1].slice(0,5));
const [currenciesTimeBefore, setCurrenciesTimeBefore] = useState(null);
const [contador, setCount] = useState(0)
const [currencyHourBeforeAux, ] = useState(props.rowData.schedulingTime.split(' ')[1].slice(0,5));
if(schedulesContact){}
const handleCancel = (event, reason) => {
@ -170,26 +157,26 @@ const Modal = (props) => {
const handleCloseConfirmationModal = () => {
setConfirmModalOpen(false);
setSelectedSchedule(null);
};
// const handleCloseConfirmationModal = () => {
// setConfirmModalOpen(false);
// setSelectedSchedule(null);
// };
const handleDeleteSchedule = async (scheduleId) => {
try {
await api.delete(`/schedule/${scheduleId}`);
toast.success(("Lembrete/Agendamento deletado com sucesso!"));
dispatch({ type: "DELETE_SCHEDULE", payload: scheduleId });
} catch (err) {
toastError(err);
}
setSelectedSchedule(null);
};
// const handleDeleteSchedule = async (scheduleId) => {
// try {
// await api.delete(`/schedule/${scheduleId}`);
// toast.success(("Lembrete/Agendamento deletado com sucesso!"));
// dispatch({ type: "DELETE_SCHEDULE", payload: scheduleId });
// } catch (err) {
// toastError(err);
// }
// setSelectedSchedule(null);
// };
// Get from child 2
const datePickerValue = (data) => {
console.log('datePickerValue: ',(data));
setDatePicker(data)
@ -197,7 +184,7 @@ const datePickerValue = (data) => {
// Get from child 3
const timerPickerValue = (data) => {
console.log('timerPickerValue: ',(data));
setTimerPicker(data)
@ -235,7 +222,7 @@ const dateCurrentFormated = (dateF=null) => {
if (statusChatEndId === '2'|| statusChatEndId === '3'){
console.log('Entrou! textArea1: ', textArea1)
if(textArea1 && textArea1.trim().length<5){
@ -278,18 +265,17 @@ const dateCurrentFormated = (dateF=null) => {
if(sendMessageDayBefore.length > 0 && timeBefore === formatedTimeHour(timerPicker))
{
console.log('ENVIAR MENSAGEM UM DIA ANTES!')
console.log('MENSAGEM SERÁ ENVIA NO DIA: ', dateCurrentFormated( new Date(subDays(new Date(startDate+' '+formatedTimeHour(new Date(`${startDate} ${timerPicker.getHours()}:${timerPicker.getMinutes()}:00`))), 1))))
dateSendMessage = dateCurrentFormated( new Date(subDays(new Date(startDate+' '+formatedTimeHour(new Date(`${startDate} ${timerPicker.getHours()}:${timerPicker.getMinutes()}:00`))), 1)))
}
console.log('AGENDAMENTO ENVIO MENSAGEM1: ', `${dateSendMessage} ${timeBefore}:00` )
} else if (statusChatEndId === '2'){
console.log('AGENDAMENTO ENVIO MENSAGEM2: ', startDate+' '+formatedTimeHour(new Date(`${startDate} ${timerPicker.getHours()}:${timerPicker.getMinutes()}`)) )
}
@ -328,7 +314,18 @@ const dateCurrentFormated = (dateF=null) => {
useEffect(()=>{
setCount(contador+1)
const selectedTimeOld = (_hours) => {
let selectedOld = _hours.filter((h)=>(h.value===currencyHourBeforeAux))[0]
if(selectedOld){
return selectedOld
}
return null
}
const hoursBeforeAvalible = (timer) =>{
@ -338,15 +335,13 @@ const dateCurrentFormated = (dateF=null) => {
if(typeof(startDate)==='string' && startDate.trim().length>0 && startDate === dateCurrentFormated()){
console.log('HOJE++++')
while(subHours(timer, hour).getHours()>=6 &&
subHours(timer, hour).getHours()>=new Date().getHours() &&
subHours(timer, hour).getHours()<=20){
console.log('******** TIMER: ', formatedTimeHour(subHours(timer,hour)))
hours.push({value: formatedTimeHour(subHours(timer,hour)), label: `${hour} HORA ANTES DO HORÁRIO DO AGENDAMENTO`})
hour++;
@ -355,8 +350,9 @@ const dateCurrentFormated = (dateF=null) => {
if(hours.length>1){
hours.pop()
if(contador>1)
setCurrency( hours[0].value)
let selectedOld = selectedTimeOld(hours)
setCurrency(selectedOld ? selectedOld.value : hours[0].value)
}
else{
setCurrency(null)
@ -367,8 +363,6 @@ const dateCurrentFormated = (dateF=null) => {
while(subHours(timer, hour).getHours()>=6 && subHours(timer, hour).getHours()<=20){
console.log('******** another day TIMER: ', formatedTimeHour(subHours(timer,hour)))
hours.push(
{value: formatedTimeHour(subHours(timer,hour)),
label: `${hour} HORA ANTES DO HORÁRIO DO AGENDAMENTO`})
@ -378,8 +372,12 @@ const dateCurrentFormated = (dateF=null) => {
if(hours.length>0){
if(contador>1)
setCurrency( hours[0].value)
let selectedOld = selectedTimeOld(hours)
setCurrency(selectedOld ? selectedOld.value : hours[0].value)
//if(contador>1)
// setCurrency( hours[0].value)
}
else{
setCurrency(null)
@ -392,19 +390,19 @@ const dateCurrentFormated = (dateF=null) => {
hours.push({value: formatedTimeHour(timerPicker) , label: `24 HORAS ANTES DO HORÁRIO DO AGENDAMENTO`})
console.log('#subDays: ', dateCurrentFormated( new Date(subDays(new Date(startDate+' '+formatedTimeHour(new Date(`${startDate} ${timerPicker.getHours()}:${timerPicker.getMinutes()}:00`))), 1))))
let selectedOld = selectedTimeOld(hours)
if(selectedOld)
setCurrency(selectedOld.value)
}
return {time: hours, hour:hour}
}
console.log('CONTADOR 1: ', contador)
setCurrenciesTimeBefore(hoursBeforeAvalible(timerPicker).time)
},[timerPicker, startDate])
},[timerPicker, startDate, currencyHourBeforeAux])
@ -423,7 +421,7 @@ const dateCurrentFormated = (dateF=null) => {
// Get from child 1
const textFieldSelect = (data) => {
console.log('textFieldSelect: ',data);
setStatusChatEnd(data)
}
@ -441,7 +439,6 @@ const handleChangeHourBefore = (event) => {
setCurrency(event.target.value);
console.log('CONTADOR 2: ', contador)
};
@ -557,14 +554,14 @@ const handleChangeHourBefore = (event) => {
func={datePickerValue}
minDate={true}
schedulingDate={props.rowData.schedulingDate}
title={'Data do lembrete'}/>
title={'Data'}/>
</Item>
<Item>
<TimerPickerSelect
func={timerPickerValue}
schedulingDate={props.rowData.schedulingDate}
title={'Hora do lembrete'}/>
title={'Hora'}/>
</Item>
</Box>

View File

@ -9,7 +9,7 @@ const SelectTextFields = (props) => {
// const [currency, setCurrency] = useState(props.emptyField ? '0' : '1');
console.log(':::::::::::::::::::::: props.textBoxFieldSelected: ', props.textBoxFieldSelected)
const [currency, setCurrency] = useState(props.textBoxFieldSelected ? props.textBoxFieldSelected: '0');

View File

@ -17,7 +17,7 @@ const reducerQ = (state, action) =>{
if(action.type === 'LOAD_QUERY'){
console.log('----------------action.payload: ', action.payload)
const queries = action.payload
const newQueries = []
@ -234,19 +234,19 @@ const Report = () => {
// Get from child 1
const datePicker1Value = (data) => {
console.log('DATE1: ',(data));
setDatePicker1(data)
}
// Get from child 2
const datePicker2Value = (data) => {
console.log('DATE2: ',(data));
setDatePicker2(data)
}
// Get from child 3
const textFieldSelectUser = (data) => {
console.log('textField: ',data);
setUser(data)
}

View File

@ -1,16 +1,16 @@
import React, { useState, useEffect, useReducer, useContext} from "react";
import React, { useState, useEffect, useReducer} from "react";
import MainContainer from "../../components/MainContainer";
import api from "../../services/api";
import SelectField from "../../components/Report/SelectField";
//import { data } from '../../components/Report/MTable/data';
import DatePicker1 from '../../components/Report/DatePicker'
import DatePicker2 from '../../components/Report/DatePicker'
//import { Button } from "@material-ui/core";
import MTable from "../../components/Report/MTable";
import PropTypes from 'prop-types';
import Box from '@mui/material/Box';
import { AuthContext } from "../../context/Auth/AuthContext";
import { Can } from "../../components/Can";
import SearchIcon from "@material-ui/icons/Search";
import TextField from "@material-ui/core/TextField";
@ -21,9 +21,8 @@ import MaterialTable from 'material-table';
import Delete from '@material-ui/icons/Delete';
import Edit from '@material-ui/icons/Edit';
import Save from '@material-ui/icons/Save';
import Dialog from '@mui/material/Dialog';
import { render } from '@testing-library/react';
// import Modal from "../../../..ChatEnd/ModalChatEnd";
@ -32,17 +31,8 @@ import Modal from "../../components/ModalUpdateScheduleReminder";
import openSocket from "socket.io-client";
import {
IconButton,
Paper,
Table,
TableBody,
TableCell,
TableHead,
TableRow,
} from "@material-ui/core";
import { DeleteOutline } from "@material-ui/icons";
import { toast } from "react-toastify";
import toastError from "../../errors/toastError";
import ConfirmationModal from "../../components/ConfirmationModal";
@ -53,7 +43,7 @@ const reducerQ = (state, action) =>{
if(action.type === 'LOAD_QUERY'){
console.log('----------------action.payload: ', action.payload)
const queries = action.payload
const newQueries = []
@ -80,7 +70,7 @@ const reducerQ = (state, action) =>{
// const scheduling = action.payload;
// const schedulingIndex = state.findIndex((u) => u.id === +scheduling.id);
// console.log('**************** UPDATE_SCHEDULING scheduleIndex: ', schedulingIndex)
//
// if (schedulingIndex !== -1) {
// state[schedulingIndex] = scheduling;
@ -95,7 +85,7 @@ const reducerQ = (state, action) =>{
const scheduleId = action.payload;
const scheduleIndex = state.findIndex((u) => u.id === scheduleId);
console.log('**************** scheduleIndex: ', scheduleIndex)
if (scheduleIndex !== -1) {
state.splice(scheduleIndex, 1);
}
@ -199,7 +189,7 @@ Item.propTypes = {
const SchedulesReminder = () => {
const { user: userA } = useContext(AuthContext);
//--------
const [searchParam] = useState("");
@ -210,7 +200,7 @@ const SchedulesReminder = () => {
//const [columns, setColums] = useState([])
const [startDate, setDatePicker1] = useState(new Date())
const [endDate, setDatePicker2] = useState(new Date())
const [userId, setUser] = useState(null)
const [query, dispatchQ] = useReducer(reducerQ, [])
const [contactNumber, setContactNumber] = useState("");
@ -231,19 +221,19 @@ const SchedulesReminder = () => {
socket.on("schedulingNotify", (data) => {
console.log('SOCKET IO')
setLoading(true);
// if (data.action === "update" || data.action === "create") {
// console.log('UPDATE_SCHEDULING: ', data.schedulingNotifyCreate)
//
// // dispatchQ({ type: "UPDATE_SCHEDULING", payload: data.schedulingNotifyCreate });
// }
if (data.action === "delete") {
console.log('DELETE_SCHEDULING id: ', data.schedulingNotifyId)
dispatchQ({ type: "DELETE_SCHEDULING", payload: +data.schedulingNotifyId });
//handleDeleteRows(data.schedulingNotifyId)
}
@ -281,10 +271,14 @@ const SchedulesReminder = () => {
// dispatch({ type: "LOAD_STATUS_CHAT_END", payload: statusChatEndLoad.data });
console.log(':::::::::::::: statusChatEndLoad: ', statusChatEndLoad.data)
setStatusEndChat(statusChatEndLoad.data.filter(status => (status.id == '2' || status.id == '3')))
// setStatusEndChat(statusChatEndLoad.data.filter(status => (status.id == '2' || status.id == '3')))
setStatusEndChat(statusChatEndLoad.data.filter(status => (`${status.id}` === '2' || `${status.id}` === '3')))
//setHasMore(data.hasMore);
// setLoading(false);
} catch (err) {
@ -331,41 +325,30 @@ const SchedulesReminder = () => {
useEffect(() => {
if(!loading){
console.log('carregando table...')
// const dataLoad = query.map(({ scheduleReminder, ...others }) => (
// { ...others, 'scheduleReminder': others.statusChatEndId == '3' ? 'Agendamento' : 'Lembrete' }
// ));
// console.log('NEW DATA: ', dataLoad)
setData(query.map(({ scheduleReminder, ...others }) => (
{ ...others, 'scheduleReminder': others.statusChatEndId == '3' ? 'Agendamento' : 'Lembrete' }
{ ...others, 'scheduleReminder': `${others.statusChatEndId}` === '3' ? 'Agendamento' : 'Lembrete' }
)))
}
}, [loading])
}, [loading, query])
// Get from child 1
const datePicker1Value = (data) => {
console.log('DATE1: ',(data));
setDatePicker1(data)
}
// Get from child 2
const datePicker2Value = (data) => {
console.log('DATE2: ',(data));
setDatePicker2(data)
}
// Get from child 3
const textFieldSelectUser = (data) => {
console.log('textField: ',data);
setUser(data)
}
const handleSearch = (event) => {
setContactNumber(event.target.value.toLowerCase());
@ -381,21 +364,21 @@ const handleClear = () => {
const handleCloseConfirmationModal = () => {
setConfirmModalOpen(false);
console.log('cancelou NULL 1')
setSelectedSchedule(null);
};
const handleDeleteRows = (id) => {
// const handleDeleteRows = (id) => {
let _data = [...dataRows];
// let _data = [...dataRows];
_data.forEach(rd => {
_data = _data.filter(t => t.id !== id);
});
setData(_data);
// _data.forEach(rd => {
// _data = _data.filter(t => t.id !== id);
// });
// setData(_data);
};
// };
const handleDeleteSchedule = async (scheduleId) => {
@ -406,7 +389,7 @@ const handleDeleteSchedule = async (scheduleId) => {
} catch (err) {
toastError(err);
}
console.log('cancelou NULL 2')
setSelectedSchedule(null);
};
@ -424,7 +407,7 @@ const handleUpdateSchedule = async (scheduleData, rowsDataNew) => {
dataUpdate[index] = rowsDataNew;
setData([...dataUpdate].map(({ scheduleReminder, ...others }) => (
{ ...others, 'scheduleReminder': others.statusChatEndId == '3' ? 'Agendamento' : 'Lembrete' }
{ ...others, 'scheduleReminder': `${others.statusChatEndId}` === '3' ? 'Agendamento' : 'Lembrete' }
)));
@ -436,7 +419,7 @@ const handleUpdateSchedule = async (scheduleData, rowsDataNew) => {
} catch (err) {
toastError(err);
}
//console.log('cancelou NULL 3')
//
setSelectedSchedule(null);
};
@ -445,10 +428,10 @@ const chatEndVal = (data, rowsDataNew) => {
if(data){
console.log('DATA SCHECULE: ', data)
console.log(':::::::::::::::::::: ChatEnd2: ',(data));
console.log(':::::::::::::::::::: Rows data fro child: ',(rowsDataNew));
handleUpdateSchedule(data, rowsDataNew)
@ -493,12 +476,7 @@ const handleModal = (rowData) => {
/>
</Item>
{/* <Item>
<SelectField func={textFieldSelectUser} emptyField={true} header={'Usuário'} currencies={users.map((obj)=>{
return {'value': obj.id, 'label': obj.name}
})}/>
</Item> */}
<Item><DatePicker1 func={datePicker1Value} minDate={false} startEmpty={true} reset={resetChild} setReset={setReset} title={'Data inicio'}/></Item>
<Item><DatePicker2 func={datePicker2Value} minDate={false} startEmpty={true} reset={resetChild} setReset={setReset} title={'Data fim'}/></Item>
@ -527,7 +505,7 @@ const handleModal = (rowData) => {
<ConfirmationModal
title={selectedSchedule && `Deletar ${selectedSchedule.statusChatEndId=='2' ? 'lembrete' : 'agendamento'} do dia ${selectedSchedule.schedulingDate.split(' ')[0]} ${selectedSchedule.schedulingDate.split(' ')[1]} ?`}
title={selectedSchedule && `Deletar ${''+selectedSchedule.statusChatEndId === '2' ? 'lembrete' : 'agendamento'} do dia ${selectedSchedule.schedulingDate.split(' ')[0]} ${selectedSchedule.schedulingDate.split(' ')[1]} ?`}
open={confirmModalOpen}
onClose={handleCloseConfirmationModal}
onConfirm={() => handleDeleteSchedule(selectedSchedule.id)}
@ -540,7 +518,7 @@ const handleModal = (rowData) => {
columns={
[
{ title: 'Foto', field: 'ticket.contact.profilePicUrl', render: rowData => <img src={rowData['ticket.contact.profilePicUrl']} style={{width: 40, borderRadius: '50%'}}/> },
{ title: 'Foto', field: 'ticket.contact.profilePicUrl', render: rowData => <img src={rowData['ticket.contact.profilePicUrl']} alt="imagem de perfil do whatsapp" style={{width: 40, borderRadius: '50%'}}/> },
{ title: 'Nome', field: 'ticket.contact.name' },
{ title: 'Contato', field: 'ticket.contact.number' },
{ title: 'Lemb/Agen', field: 'scheduleReminder'},
@ -558,7 +536,7 @@ const handleModal = (rowData) => {
icon: Edit,
tooltip: 'Editar',
onClick: (event, rowData) => {
console.log("You want edit data ",rowData)
setSelectedSchedule(rowData);
handleModal(rowData)
}
@ -568,7 +546,7 @@ const handleModal = (rowData) => {
icon: Delete,
tooltip: 'Deletar',
onClick: (event, rowData) => {
console.log("You want to delete ",rowData)
setSelectedSchedule(rowData);
setConfirmModalOpen(true);
}
@ -588,13 +566,6 @@ const handleModal = (rowData) => {
width: 300,
},
pageSize: 20,
headerStyle: {
position: "sticky",
top: "0"
},
maxBodyHeight: "400px",
rowStyle: {
fontSize: 12,
}