Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- import React, { useState,useEffect } from 'react';
- import moment from 'moment-timezone'
- import {EventNote,KeyboardArrowLeft,KeyboardArrowRight} from '@material-ui/icons'
- import { history } from './Routes';
- import ResizablePanels from './ResizeablePanels/index'
- import { minutesOfDay, stringToColour } from './Utilities';
- import { useGlobalState } from './GlobalStateMgmt/store';
- //2801
- export const ReminderListScheduler = () => {
- const [dateOffsetReminders,setDateOffsetReminders] = useState(0)
- const [dateOffsetMeetings,setDateOffsetMeetings] = useState(0)
- const [dateOffsetMyMeetings,setDateOffsetMyMeetings] = useState(0)
- const [dateOffsetMeetingsBefore,setDateOffsetMeetingsBefore] = useState(0)
- const [reminders,setReminders] = useState([])
- const [meetings,setMeetings] = useState([])
- const [myMeetings,setMyMeetings] = useState([])
- const [premeetings,setPreMeetings] = useState([])
- const [userId] = useGlobalState('id')
- const [socket] = useGlobalState('socket')
- useEffect(() => {
- socket.removeListener('GET_USER_MEETINGS')
- socket.on('GET_USER_MEETINGS', meetings => {
- setMeetings(meetings.filter(i => i.userId._id != userId).sort((a,b) => minutesOfDay(a.startTime) - minutesOfDay(b.startTime)))
- })
- socket.emit('a',{name:'GET_USER_MEETINGS',data:{userId,date:moment().add(dateOffsetMeetings,'days')}})
- },[dateOffsetMeetings])
- useEffect(() => {
- socket.removeListener('GET_MY_MEETINGS')
- socket.on('GET_MY_MEETINGS', myMeetings => {
- setMyMeetings(myMeetings.filter(i => i.userId._id == userId).sort((a,b) => minutesOfDay(a.startTime) - minutesOfDay(b.startTime)))
- })
- socket.emit('a',{name:'GET_MY_MEETINGS',data:{userId,date:moment().add(dateOffsetMyMeetings,'days')}})
- },[dateOffsetMyMeetings])
- useEffect(() => {
- socket.removeListener('GET_USER_PREMEETINGS')
- socket.on('GET_USER_PREMEETINGS', premeetings => {
- setPreMeetings(premeetings.sort((a,b) => minutesOfDay(a.startTime) - minutesOfDay(b.startTime)))
- })
- socket.emit('a',{name:'GET_USER_PREMEETINGS',data:{userId}})
- },[/* dateOffsetMeetingsBefore */])
- useEffect(() => {
- socket.removeListener('GET_USER_REMINDERS')
- socket.on('GET_USER_REMINDERS', reminders => {
- setReminders(reminders.sort((a,b) => minutesOfDay(a.startTime) - minutesOfDay(b.startTime)))
- })
- socket.emit('a',{name:'GET_USER_REMINDERS',data:{userId,date:moment().add(dateOffsetReminders,'days')}})
- },[dateOffsetReminders])
- return (
- <div style={{direction:'ltr',height:'100%',width:'100%'}}>
- <ResizablePanels
- displayDirection="row"
- width="100%"
- height="100%"
- panelsSize={[25, 25,25,25]}
- sizeUnitMeasure="%"
- >
- <div style={{height:'100%',width:'100%',display:'flex',flexDirection:'column',backgroundColor:'#448CA2',direction:'rtl'}}>
- <div style={{display:'flex',justifyContent:'space-between',alignItems:'center',flexDirection:'row',padding:10,borderBottom:'1px solid white',flexWrap:'wrap'}}>
- <div style={{display:'flex',flex:.4,textAlign:'center',color:'white',flexDirection:'row',justifyContent:'center',alignItems:'center'}}>
- <EventNote style={{display:'flex',flex:.3,color:'white'}} size={30} />
- <p style={{display:'flex',flex:.7,textAlign:'right',color:'white'}}>
- {
- `הפגישות שלי`
- }
- </p>
- </div>
- <div style={{display:'flex',flex:.3,textAlign:'center',color:'white',alignItems:'center'}}>
- {`${moment().add(dateOffsetMyMeetings,'days').format('DD-MM-YYYY')}`}
- </div>
- <div style={{display:'flex',flexDirection:'row',flex:.3,justifyContent:'space-around'}}>
- <div style={{cursor:'pointer'}} onClick={() => setDateOffsetMyMeetings(dateOffsetMyMeetings+1)}>
- <KeyboardArrowRight size={30} style={{color:"white"}} />
- </div>
- <div style={{cursor:'pointer'}} onClick={() => setDateOffsetMyMeetings(dateOffsetMyMeetings-1)}>
- <KeyboardArrowLeft size={30} style={{color:"white"}} />
- </div>
- </div>
- </div>
- <div style={{overflow:'auto'}}>
- {
- myMeetings.map(item => {
- return (
- <div onClick={() => {history.push('/app/NewMeeting',{item})} /* NavigationService.replace('NewMeeting',{item}) */} key={item._id} style={{cursor:'pointer',display:'flex',flexDirection:'column',justifyContent:'space-around',alignItems:'center',borderBottomWidth:1,padding:10,borderBottomColor:'white'}}>
- <div style={{display:'flex',justifyContent:'space-around',alignItems:'center',width:'100%'}}>
- <div style={{display:'flex',flex:.3,textAlign:'center',color:'white',whiteSpace:'pre-wrap'}}>
- {`${moment(item.endTime).format('HH:mm')} - ${moment(item.startTime).format('HH:mm')}\n`}
- {`(${item.userId.name})`}
- </div>
- <div style={{display:'flex',flex:.7,textAlign:'justify',color:'white'}}>
- {`פגישה בין ${item.tenantId.name}, ${item.tenantId.primaryPhone} ל${item.agentId && item.agentId.name || 'אין סוכן'}, לגבי הנכס ${item.propertyId && item.propertyId.addressId && item.propertyId.addressId.streetId.neighborhoodId.name}, ${item.propertyId && item.propertyId.addressId && item.propertyId.addressId.streetId.name} ${item.propertyId && item.propertyId.addressId && item.propertyId.addressId.streetNumber}`}
- </div>
- </div>
- <div style={{display:'flex',justifyContent:'space-around',alignItems:'center',width:'100%'}}>
- <div style={{display:'flex',flex:.3,textAlign:'center',color:'white'}}>
- </div>
- <div style={{display:'flex',flex:.7,textAlign:'justify',color:'white'}}>
- <p style={{color:'white'}}>{`${item.comment}`}</p>
- </div>
- </div>
- </div>
- )
- })
- }
- </div>
- </div>
- <div style={{height:'100%',width:'100%',display:'flex',flexDirection:'column',backgroundColor:'#448CA2',direction:'rtl'}}>
- <div style={{display:'flex',justifyContent:'space-between',alignItems:'center',flexDirection:'row',padding:10,borderBottom:'1px solid white',flexWrap:'wrap'}}>
- <div style={{display:'flex',flex:.4,textAlign:'center',color:'white',flexDirection:'row',justifyContent:'center',alignItems:'center'}}>
- <EventNote style={{display:'flex',flex:.3,color:'white'}} size={30} />
- <p style={{display:'flex',flex:.7,textAlign:'right',color:'white'}}>
- {
- `כל הפגישות`
- }
- </p>
- </div>
- <div style={{display:'flex',flex:.3,textAlign:'center',color:'white',alignItems:'center'}}>
- {`${moment().add(dateOffsetMeetings,'days').format('DD-MM-YYYY')}`}
- </div>
- <div style={{display:'flex',flexDirection:'row',flex:.3,justifyContent:'space-around'}}>
- <div style={{cursor:'pointer'}} onClick={() => setDateOffsetMeetings(dateOffsetMeetings+1)}>
- <KeyboardArrowRight size={30} style={{color:"white"}} />
- </div>
- <div style={{cursor:'pointer'}} onClick={() => setDateOffsetMeetings(dateOffsetMeetings-1)}>
- <KeyboardArrowLeft size={30} style={{color:"white"}} />
- </div>
- </div>
- </div>
- <div style={{overflow:'auto'}}>
- {
- meetings.map(item => {
- return (
- <div onClick={() => {
- if (userId == item.tenantId.createdBy)
- history.push('/app/NewMeeting',{item})
- } /* NavigationService.replace('NewMeeting',{item}) */} key={item._id} style={{
- cursor:'pointer',display:'flex',flexDirection:'column',justifyContent:'space-around',alignItems:'center',
- borderBottomWidth:1,padding:10,borderBottomColor:'white',color:stringToColour(item.userId.name),
- textShadow:'1px 1px 1px #000,1px 1px 1px #000,1px 1px 1px #000, 1px 1px 1px #000'
- }}>
- <div style={{display:'flex',justifyContent:'space-around',alignItems:'center',width:'100%'}}>
- <div style={{display:'flex',flex:.3,textAlign:'center',whiteSpace:'pre-wrap'}}>
- {`${moment(item.endTime).format('HH:mm')} - ${moment(item.startTime).format('HH:mm')}\n`}
- {`(${item.userId.name})`}
- </div>
- <div style={{display:'flex',flex:.7,textAlign:'justify'}}>
- {`פגישה בין ${item.tenantId.name}, ${item.tenantId.primaryPhone} ל${item.agentId && item.agentId.name || 'אין סוכן'}, לגבי הנכס ${item.propertyId && item.propertyId.addressId && item.propertyId.addressId.streetId.neighborhoodId.name}, ${item.propertyId && item.propertyId.addressId && item.propertyId.addressId.streetId.name} ${item.propertyId && item.propertyId.addressId && item.propertyId.addressId.streetNumber}`}
- </div>
- </div>
- <div style={{display:'flex',justifyContent:'space-around',alignItems:'center',width:'100%'}}>
- <div style={{display:'flex',flex:.3,textAlign:'center',color:'white'}}>
- </div>
- <div style={{display:'flex',flex:.7,textAlign:'justify'}}>
- {`${item.comment}`}
- </div>
- </div>
- </div>
- )
- })
- }
- </div>
- </div>
- <div style={{height:'100%',width:'100%',display:'flex',flexDirection:'column',backgroundColor:'#448CA2',direction:'rtl'}}>
- <div style={{display:'flex',justifyContent:'space-between',alignItems:'center',flexDirection:'row',padding:10,borderBottom:'1px solid white',flexWrap:'wrap'}}>
- <div style={{display:'flex',flex:.4,textAlign:'center',color:'white',flexDirection:'row',justifyContent:'center',alignItems:'center'}}>
- <EventNote style={{display:'flex',flex:.3,color:'white'}} size={30} />
- <p style={{display:'flex',flex:.7,textAlign:'right',color:'white'}}>
- {
- `בקשות לפגישות`
- }
- </p>
- </div>
- <div style={{display:'flex',flex:.3,textAlign:'center',color:'white',alignItems:'center'}}>
- {`${moment().add(dateOffsetMeetingsBefore,'days').format('DD-MM-YYYY')}`}
- </div>
- <div style={{display:'flex',flexDirection:'row',flex:.3,justifyContent:'space-around'}}>
- <div style={{cursor:'pointer'}} onClick={() => setDateOffsetMeetingsBefore(dateOffsetMeetingsBefore+1)}>
- <KeyboardArrowRight size={30} style={{color:"white"}} />
- </div>
- <div style={{cursor:'pointer'}} onClick={() => setDateOffsetMeetingsBefore(dateOffsetMeetingsBefore-1)}>
- <KeyboardArrowLeft size={30} style={{color:"white"}} />
- </div>
- </div>
- </div>
- <div style={{overflow:'auto'}}>
- {
- premeetings.map(item =>{
- let str = ''
- str = (`לקבוע פגישה עם ${item.tenantId.name}, ${item.tenantId.primaryPhone} לגבי הנכס ${item.propertyId && item.propertyId.addressId &&item.propertyId.addressId.streetId.neighborhoodId.name}, ${item.propertyId && item.propertyId.addressId &&item.propertyId.addressId.streetId.name} ${item.propertyId && item.propertyId.addressId &&item.propertyId.addressId.streetNumber}`)
- return (
- <div onClick={() => {history.push('/app/NewMeetingRequest',{item})} /* NavigationService.replace('NewMeeting',{item}) */} key={item._id} style={{cursor:'pointer',display:'flex',flexDirection:'column',justifyContent:'space-around',alignItems:'center',borderBottomWidth:1,padding:10,borderBottomColor:'white'}}>
- <div style={{display:'flex',justifyContent:'space-around',alignItems:'center',width:'100%'}}>
- <div style={{display:'flex',flex:.2,textAlign:'center',color:'white'}}>
- {`(${item.userId.name})`}
- </div>
- <div style={{display:'flex',flex:.8,textAlign:'justify',color:'white'}}>
- {`${str}`}
- </div>
- </div>
- <div style={{display:'flex',justifyContent:'space-around',alignItems:'center',width:'100%'}}>
- <div style={{display:'flex',flex:.2,textAlign:'center',color:'white'}}>
- </div>
- <div style={{display:'flex',flex:.8,textAlign:'justify',color:'white'}}>
- <p style={{color:'white'}}>{`${item.comment}`}</p>
- </div>
- </div>
- </div>
- )
- })
- }
- </div>
- </div>
- <div style={{height:'100%',width:'100%',display:'flex',flexDirection:'column',backgroundColor:'#448CA2',direction:'rtl'}}>
- <div style={{display:'flex',justifyContent:'space-between',alignItems:'center',flexDirection:'row',padding:10,borderBottom:'1px solid white',flexWrap:'wrap'}}>
- <div style={{display:'flex',flex:.4,textAlign:'center',color:'white',flexDirection:'row',justifyContent:'center',alignItems:'center'}}>
- <EventNote style={{display:'flex',flex:.3,color:'white'}} size={30} />
- <p style={{display:'flex',flex:.7,textAlign:'right',color:'white'}}>
- {
- `תזכורות`
- }
- </p>
- </div>
- <div style={{display:'flex',flex:.3,textAlign:'center',color:'white',alignItems:'center'}}>
- {`${moment().add(dateOffsetReminders,'days').format('DD-MM-YYYY')}`}
- </div>
- <div style={{display:'flex',flexDirection:'row',flex:.3,justifyContent:'space-around'}}>
- <div style={{cursor:'pointer'}} onClick={() => setDateOffsetReminders(dateOffsetReminders+1)}>
- <KeyboardArrowRight size={30} style={{color:"white"}} />
- </div>
- <div style={{cursor:'pointer'}} onClick={() => setDateOffsetReminders(dateOffsetReminders-1)}>
- <KeyboardArrowLeft size={30} style={{color:"white"}} />
- </div>
- </div>
- </div>
- <div style={{overflow:'auto'}}>
- {
- reminders.map(item => {
- let str = ''
- if (item.propertyId && item.tenantId){
- str += `לחזור ל ${`לחזור ל${item.tenantId.name}, ${item.tenantId.primaryPhone}${item.tenantId.secondaryPhone ? `, ${item.tenantId.secondaryPhone}`:``}`}`
- str += ` לגבי הנכס: ${item.propertyId && item.propertyId.addressId &&item.propertyId.addressId.streetId.neighborhoodId.name}, ${item.propertyId && item.propertyId.addressId &&item.propertyId.addressId.streetId.name} ${item.propertyId && item.propertyId.addressId &&item.propertyId.addressId.streetNumber}, ${item.propertyId && item.propertyId.addressId &&item.propertyId.renterId && item.propertyId.renterId.name}, ${item.propertyId && item.propertyId.renterId && item.propertyId.renterId.primaryPhone}`
- }
- else if (item.propertyId){
- str += `לחזור ל${item.propertyId.renterId && item.propertyId.renterId.name}, ${item.propertyId.renterId && item.propertyId.renterId.primaryPhone}, הנכס: ${item.propertyId && item.propertyId.addressId &&item.propertyId.addressId.streetId.neighborhoodId.name}, ${item.propertyId.addressId.streetId.name} ${item.propertyId && item.propertyId.addressId &&item.propertyId.addressId.streetNumber}`
- }
- else if (item.tenantId){
- str += `${`לחזור ל${item.tenantId.name}, ${item.tenantId.primaryPhone}${item.tenantId.secondaryPhone ? `, ${item.tenantId.secondaryPhone}`:``}`}`
- }
- return(
- <div onClick={() => {history.push('/app/NewReminder',{item})}/* NavigationService.replace('NewReminder',{item}) */} key={item._id} style={{cursor:'pointer',display:'flex',justifyContent:'space-around',alignItems:'center',borderBottomWidth:1,flexDirection:'row',padding:10,borderBottomColor:'white'}}>
- <div style={{display:'flex',flex:.3,textAlign:'center',color:'white'}}>
- {`${moment(item.endTime).format('HH:mm')} - ${moment(item.startTime).format('HH:mm')}`}
- </div>
- <div style={{display:'flex',flex:.7,textAlign:'justify',color:'white'}}>
- {`${str || ''} - ${item.comment}`}
- </div>
- </div>
- )
- })
- }
- </div>
- </div>
- </ResizablePanels>
- </div>
- )
- }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement