Compare commits
6 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
 victorAnumudu
|
08665d51a7 | ||
 victor.ebuka
|
dff0bd72ed | ||
|
victorAnumudu
|
823ff83f88 | ||
|
victor.ebuka
|
82f0efe6e5 | ||
|
victorAnumudu
|
3eaf99f212 | ||
|
victor.ebuka
|
5d93817555 |
@@ -5,6 +5,12 @@ REACT_APP_MAIN_API="https://devapi.mermsemr.com"
|
||||
REACT_APP_MEDIA_SERVER="https://dev-media.mermsemr.com"
|
||||
REACT_APP_MAIN_SOCKET="https://dev-socket.mermsemr.com"
|
||||
|
||||
# login footer links
|
||||
REACT_APP_HOME_LINK='https://dev-www.mermsemr.com/'
|
||||
REACT_APP_ABOUT_LINK='https://dev-www.mermsemr.com/about'
|
||||
REACT_APP_CONTACTS_LINK='https://dev-www.mermsemr.com/contacts'
|
||||
REACT_APP_TERMS_LINK='https://dev-www.mermsemr.com/terms'
|
||||
|
||||
# Inactivity timeout/logout AT 10MINS
|
||||
REACT_APP_TIMEOUT=600000
|
||||
|
||||
|
||||
@@ -5,5 +5,11 @@ REACT_APP_MAIN_API="https://devapi.mermsemr.com"
|
||||
REACT_APP_MEDIA_SERVER="https://dev-media.mermsemr.com"
|
||||
REACT_APP_MAIN_SOCKET="https://dev-socket.mermsemr.com"
|
||||
|
||||
# login footer links
|
||||
REACT_APP_HOME_LINK='https://dev-www.mermsemr.com/'
|
||||
REACT_APP_ABOUT_LINK='https://dev-www.mermsemr.com/about'
|
||||
REACT_APP_CONTACTS_LINK='https://dev-www.mermsemr.com/contacts'
|
||||
REACT_APP_TERMS_LINK='https://dev-www.mermsemr.com/terms'
|
||||
|
||||
# Inactivity timeout/logout AT 10MINS
|
||||
REACT_APP_TIMEOUT=600000
|
||||
|
||||
@@ -4,5 +4,11 @@ REACT_APP_SOCKET_URL="https://socket.mermsemr.com"
|
||||
REACT_APP_MAIN_API="https://api.mermsemr.com"
|
||||
REACT_APP_MEDIA_SERVER="https://media.mermsemr.com"
|
||||
|
||||
# login footer links
|
||||
REACT_APP_HOME_LINK='https://www.mermsemr.com/'
|
||||
REACT_APP_ABOUT_LINK='https://www.mermsemr.com/about'
|
||||
REACT_APP_CONTACTS_LINK='https://www.mermsemr.com/contacts'
|
||||
REACT_APP_TERMS_LINK='https://www.mermsemr.com/terms'
|
||||
|
||||
# Inactivity timeout/logout AT 10MINS
|
||||
REACT_APP_TIMEOUT=600000
|
||||
+27
@@ -8,4 +8,31 @@
|
||||
background-image: url('./assets/bg/signup_bg.jpg') !important;
|
||||
background-size: cover;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
|
||||
.register{
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.login-links{
|
||||
margin-top: 50px;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.login-links a {
|
||||
font-size: 15px;
|
||||
font-weight: 700;
|
||||
padding: 0px 20px;
|
||||
border-right: 2px solid;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.login-links a:nth-of-type(1){
|
||||
padding-left: 0px;
|
||||
}
|
||||
|
||||
.login-links a:last-child{
|
||||
border: 0px;
|
||||
}
|
||||
+1
-1
@@ -11,7 +11,7 @@ function App() {
|
||||
refetchOnWindowFocus: false,
|
||||
retry: 3,
|
||||
// refetchOnMount: false,
|
||||
staleTime: 3000
|
||||
staleTime: Infinity // can also be a number in millisecond
|
||||
},
|
||||
},
|
||||
})
|
||||
|
||||
@@ -71,7 +71,7 @@ export default function Login() {
|
||||
<div className="row no-gutters justify-content-center">
|
||||
<div className="col-11 col-sm-6 col-lg-5 col-xxl-3 align-self-center order-2 order-sm-1">
|
||||
<div className="mt-5 d-flex">
|
||||
<div className="bg-white register p-5">
|
||||
<div className="bg-white register px-5 pt-5 pb-3">
|
||||
<h1 className="mb-2">MERMS Panel</h1>
|
||||
<p>Welcome back, please login to your account.</p>
|
||||
<form className="mt-3 mt-sm-5">
|
||||
@@ -132,6 +132,13 @@ export default function Login() {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="login-links">
|
||||
<a href={process.env.REACT_APP_HOME_LINK}>Home</a>
|
||||
<a href={process.env.REACT_APP_ABOUT_LINK}>About</a>
|
||||
<a href={process.env.REACT_APP_CONTACTS_LINK}>Contact</a>
|
||||
<a href={process.env.REACT_APP_TERMS_LINK}>Terms</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -85,6 +85,7 @@ export default function Calendar(){
|
||||
|
||||
{category.map((item, index) => {
|
||||
let color = item?.cid == '1' ? 'fc-event-success' : item?.cid == '2' ? 'fc-event-danger' : item?.cid == '3' ? 'fc-event-warning' : 'fc-event-primary'
|
||||
let circleColor = item?.cid == '1' ? 'text-success' : item?.cid == '2' ? 'text-danger' : item?.cid == '3' ? 'text-warning' : 'text-primary'
|
||||
return (
|
||||
// <div key={index} className={`fc-event ${color}`} data-color={`${color}`}
|
||||
// // draggable={false}
|
||||
@@ -94,12 +95,26 @@ export default function Calendar(){
|
||||
// >
|
||||
// <span>{item.description}</span>
|
||||
// </div>
|
||||
<div key={index} className={`form-check ${color}`}>
|
||||
<input className="form-check-input" type="radio" value={item.cid}
|
||||
id={item.cid} name='category' checked={item.cid == activeCategory} onChange={() => handleActiveCategory(item.cid)} />
|
||||
<label className={`w-100 form-check-label`} htmlFor={item.cid}>
|
||||
{item.description}
|
||||
</label>
|
||||
|
||||
// <div key={index} className={`form-check ${color}`}>
|
||||
// <input className="form-check-input" type="radio" value={item.cid}
|
||||
// id={item.cid} name='category' checked={item.cid == activeCategory} onChange={() => handleActiveCategory(item.cid)} />
|
||||
// <label className={`w-100 form-check-label`} htmlFor={item.cid}>
|
||||
// {item.description}
|
||||
// </label>
|
||||
// </div>
|
||||
|
||||
<div key={index} className={`form-check ${color}`} onClick={() => handleActiveCategory(item.cid)} style={{cursor: 'pointer'}}>
|
||||
<div>
|
||||
<span className="nav align-items-center">
|
||||
<span>
|
||||
<i className={`fa fa-circle-o pr-4 ${item.cid == activeCategory ? circleColor : 'text-light'}`}></i>
|
||||
</span>
|
||||
<span>
|
||||
<span>{item?.description}</span>
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -14,18 +14,34 @@ export default function Contacts(){
|
||||
queryFn: () => contactData()
|
||||
})
|
||||
|
||||
const contactsData = contacts?.data?.calendar_data?.contacts
|
||||
const contactsData = contacts?.data?.calendar_data?.contacts // LIST OF CONTACTS
|
||||
const contactsCategory = contacts?.data?.calendar_data?.category // LIST OF CATEGORY
|
||||
|
||||
const [activeCategoryUID, setActiveCategoryUID] = useState('0') // HOLDS VALUE OF THE ACTIVE CATEGORY
|
||||
|
||||
const [activeContactUID, setActiveContactUID] = useState(null)
|
||||
|
||||
const [activeDetail, setActiveDetail] = useState(null)
|
||||
|
||||
const [filteredContactData, setFiltererdContactData] = useState(null)
|
||||
|
||||
const changeActiveUID = (uid) => {
|
||||
setActiveContactUID(uid)
|
||||
let detail = contactsData.filter(item => item.uid == uid)
|
||||
setActiveDetail(detail)
|
||||
}
|
||||
|
||||
const changeActiveCategoryUID = (id) => {
|
||||
let filteredConData = []
|
||||
setActiveCategoryUID(id)
|
||||
if(id == '0'){
|
||||
filteredConData = contactsData
|
||||
}else{
|
||||
filteredConData = contactsData.filter(item => item.category == id)
|
||||
}
|
||||
setFiltererdContactData(filteredConData)
|
||||
changeActiveUID(filteredConData[0]?.uid)
|
||||
}
|
||||
|
||||
return(
|
||||
<>
|
||||
<BreadcrumbComBS title='Contacts' paths={['Dashboard', 'Contacts']} />
|
||||
@@ -53,16 +69,16 @@ export default function Contacts(){
|
||||
<div className="col-md-4 col-xxl-2 col-md-4">
|
||||
<div className="mail-sidebar">
|
||||
<div className="row justify-content-center">
|
||||
<div className="col-12">
|
||||
<div className="d-none col-12">
|
||||
<div className="text-center mail-sidebar-title px-4">
|
||||
<a href="javascript:void(0)" className="btn btn-primary btn-block py-3 font-weight-bold font-18"><i className="fa fa-plus pl-2"></i></a>
|
||||
<a href="#" className="btn btn-primary btn-block py-3 font-weight-bold font-18"><i className="fa fa-plus pl-2"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-12">
|
||||
<div className="px-4 py-4">
|
||||
<ul className="pl-0">
|
||||
<li className="py-2">
|
||||
<a href="javascript:void(0)">
|
||||
<a href="#">
|
||||
<span className="nav align-items-center">
|
||||
<span>
|
||||
<i className="fa fa-envelope-o text-primary pr-4"></i>
|
||||
@@ -71,13 +87,13 @@ export default function Contacts(){
|
||||
<span>Inbox</span>
|
||||
</span>
|
||||
<span className="nav-item ml-auto text-right">
|
||||
<span className="badge badge-pill badge-primary float-right">0+</span>
|
||||
<span className="badge badge-pill badge-primary float-right">{contactsData?.length}</span>
|
||||
</span>
|
||||
</span>
|
||||
</a>
|
||||
</li>
|
||||
<li className="py-2">
|
||||
<a href="javascript:void(0)">
|
||||
<a href="#">
|
||||
<span className="nav align-items-center">
|
||||
<span>
|
||||
<i className="fa fa-paper-plane-o pr-4"></i>
|
||||
@@ -90,21 +106,36 @@ export default function Contacts(){
|
||||
</li>
|
||||
|
||||
</ul>
|
||||
|
||||
<ul className="pl-0 mt-5">
|
||||
<li className="py-2">
|
||||
<a href="javascript:void(0)">
|
||||
<span className="nav align-items-center">
|
||||
<span>
|
||||
<i className="fa fa-circle-o text-danger pr-4"></i>
|
||||
</span>
|
||||
<span>
|
||||
<span>Personal</span>
|
||||
</span>
|
||||
</span>
|
||||
</a>
|
||||
</li>
|
||||
<li className="py-2">
|
||||
<a href="javascript:void(0)">
|
||||
<li className="py-2" onClick={()=>changeActiveCategoryUID('0')} style={{cursor: 'pointer'}}>
|
||||
<div>
|
||||
<span className="nav align-items-center">
|
||||
<span>
|
||||
<i className={`fa fa-circle-o pr-4 ${activeCategoryUID == '0' ? 'text-primary' : 'text-warning'}`}></i>
|
||||
</span>
|
||||
<span>
|
||||
<span>All</span>
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
</li>
|
||||
{contactsCategory && contactsCategory.map(item => (
|
||||
<li key={item?.product_id} className="py-2" onClick={()=>changeActiveCategoryUID(item?.product_id)} style={{cursor: 'pointer'}}>
|
||||
<div>
|
||||
<span className="nav align-items-center">
|
||||
<span>
|
||||
<i className={`fa fa-circle-o pr-4 ${activeCategoryUID == item?.product_id ? 'text-primary' : 'text-warning'}`}></i>
|
||||
</span>
|
||||
<span>
|
||||
<span>{item?.title}</span>
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
</li>
|
||||
))}
|
||||
{/* <li className="py-2">
|
||||
<a href="#">
|
||||
<span className="nav align-items-center">
|
||||
<span>
|
||||
<i className="fa fa-circle-o pr-4 text-warning"></i>
|
||||
@@ -116,7 +147,7 @@ export default function Contacts(){
|
||||
</a>
|
||||
</li>
|
||||
<li className="py-2">
|
||||
<a href="javascript:void(0)">
|
||||
<a href="#">
|
||||
<span className="nav align-items-center">
|
||||
<span>
|
||||
<i className="fa fa-plus pr-4"></i>
|
||||
@@ -126,7 +157,7 @@ export default function Contacts(){
|
||||
</span>
|
||||
</span>
|
||||
</a>
|
||||
</li>
|
||||
</li> */}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
@@ -146,7 +177,7 @@ export default function Contacts(){
|
||||
</div>
|
||||
</div>
|
||||
<div className="mail-msg scrollbar scroll_dark">
|
||||
{contactsData && contactsData.map((contact, index)=> {
|
||||
{contactsData && (filteredContactData || contactsData).map((contact, index)=> {
|
||||
const isActive = (contact.uid == activeContactUID) || (!activeContactUID && index == 0)
|
||||
return (
|
||||
<div key={contact.uid} onClick={()=>changeActiveUID(contact.uid)} className={`mail-msg-item ${isActive && 'bg-light'}`}>
|
||||
@@ -161,11 +192,16 @@ export default function Contacts(){
|
||||
<div className="mail-msg-item-titel justify-content-between">
|
||||
<p>{contact.sender}</p>
|
||||
{/* <p className="d-none d-xl-block">06:59 <span> PM </span></p> */}
|
||||
<p className="d-none d-xl-block"><span>{getCustomTime(contact.added)}</span></p>
|
||||
<p className="d-none d-xl-block"><span>{new Date(contact.added).toDateString()}</span></p>
|
||||
</div>
|
||||
<h5 className="mb-0 my-2">{contact.title}</h5>
|
||||
<p>{contact.message.length < 150 ? contact.message : contact.message.substring(0,151) + '...' }</p>
|
||||
<p className="d-xl-none"><span>{getCustomTime(contact.added)}</span></p>
|
||||
<p>{contact.message.length < 100 ? contact.message : contact.message.substring(0,101) + ' ...' }</p>
|
||||
<p className="d-xl-none">
|
||||
<span>
|
||||
{new Date(contact.added).toDateString()}
|
||||
{/* {getCustomTime(contact.added)} */}
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
@@ -184,7 +220,7 @@ export default function Contacts(){
|
||||
</div>
|
||||
<div>
|
||||
<h4 className="mb-0">{activeContactUID ? activeDetail[0].sender : contactsData[0].sender}</h4>
|
||||
<p>{activeContactUID ? getCustomTime(activeDetail[0].added) : getCustomTime(contactsData[0].added)}</p>
|
||||
<p>{activeContactUID ? new Date(activeDetail[0].added).toDateString() : new Date(contactsData[0].added).toDateString()}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="mt-4 d-flex justify-content-between">
|
||||
@@ -212,7 +248,7 @@ export default function Contacts(){
|
||||
<div className="bg-light mail-f px-4 py-3">
|
||||
<div className="py-2 bg-white px-4 py-3 d-flex justify-content-between">
|
||||
<p>Click here to <a href="#editer" data-toggle="collapse" className="text-primary px-1">Reply</a>or<a href="#forward" data-toggle="collapse" className="text-primary px-1">Forward</a></p>
|
||||
<a href="javascript:void(0)" className="text-primary"><i className="fa fa-microphone"></i></a>
|
||||
<a href="#" className="text-primary"><i className="fa fa-microphone"></i></a>
|
||||
</div>
|
||||
<div className="collapse" id="editer">
|
||||
<div className="form-group">
|
||||
|
||||
Reference in New Issue
Block a user