Compare commits
9 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
 victorAnumudu
|
56125b427d | ||
 victor.ebuka
|
16066d030b | ||
|
victorAnumudu
|
b6c79303ae | ||
|
victor.ebuka
|
ada406eb3f | ||
|
victorAnumudu
|
9479be61f1 | ||
|
victorAnumudu
|
9c8405cf1c | ||
|
victorAnumudu
|
92ddea329d | ||
|
CHIEFSOFT\ameye
|
a79ab63163 | ||
|
victor.ebuka
|
d7fce908cc |
@@ -1,4 +1,4 @@
|
||||
import React, { useCallback, useState } from "react";
|
||||
import React, { useCallback, useEffect, useState } from "react";
|
||||
import { useQuery } from '@tanstack/react-query'
|
||||
|
||||
import BreadcrumbComBS from "../breadcrumb/BreadcrumbComBS";
|
||||
@@ -25,14 +25,7 @@ export default function Calendar(){
|
||||
const category = receievedEvents?.category //EVENT CATEGORIES FROM API
|
||||
const eventList = receievedEvents?.list //EVENT LIST FROM API
|
||||
|
||||
const events = [
|
||||
{id: '1111', title: 'Family Vacation', color: 'fc-event-primary', start: new Date('2025-01-18')},
|
||||
{id: '2222', title: 'Meeting In Office', color: 'fc-event-warning', start: new Date('2025-01-19')},
|
||||
{id: '3333', title: 'Client Call', color: 'fc-event-danger', start: new Date('2025-01-22')},
|
||||
{id: '4444', title: 'Interview', color: 'fc-event-success', start: new Date('2025-01-1')}
|
||||
]
|
||||
|
||||
const [dummyEvents, setDummyEvents] = useState(events)
|
||||
const [activeCategory, setActiveCategory] = useState('1')
|
||||
|
||||
const [removeAfterDrop, setRemoveAfterDrop] = useState(false)
|
||||
|
||||
@@ -47,11 +40,14 @@ export default function Calendar(){
|
||||
const handleAddNewEvent = () => {
|
||||
if(newEvent.title && newEvent.color){
|
||||
const eventToAdd = {...newEvent}
|
||||
setDummyEvents(prev => ([...prev, eventToAdd]))
|
||||
setDefaultCategory(prev => ([...prev, eventToAdd]))
|
||||
setNewEvent({title: '', color: ''})
|
||||
}
|
||||
}
|
||||
|
||||
const handleActiveCategory = (id) => {
|
||||
setActiveCategory(id)
|
||||
}
|
||||
|
||||
return(
|
||||
<>
|
||||
@@ -79,38 +75,54 @@ export default function Calendar(){
|
||||
:
|
||||
<>
|
||||
<div className="col-xl-3">
|
||||
<div id="external-events">
|
||||
{/* <button className="btn btn-primary btn-block" data-bs-toggle="modal" data-bs-target="#eventModal">
|
||||
Add New Event
|
||||
</button>
|
||||
<p className="mt-3">
|
||||
Drag and drop your event or click in the calendar.
|
||||
</p> */}
|
||||
{/* {dummyEvents.map((item, index) => (
|
||||
<div key={index} className={`fc-event ${item.color}`} data-color={`${item.color}`}
|
||||
draggable="true"
|
||||
onDragStart={() =>
|
||||
handleDragStart({...item})
|
||||
}
|
||||
>
|
||||
<span></span> {item.title}
|
||||
|
||||
{/* <button className="btn btn-primary btn-block" data-bs-toggle="modal" data-bs-target="#eventModal">
|
||||
Add New Event
|
||||
</button>
|
||||
<p className="mt-3">
|
||||
Drag and drop your event or click in the calendar.
|
||||
</p> */}
|
||||
|
||||
{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'
|
||||
return (
|
||||
// <div key={index} className={`fc-event ${color}`} data-color={`${color}`}
|
||||
// // draggable={false}
|
||||
// // onDragStart={() =>
|
||||
// // handleDragStart({...item})
|
||||
// // }
|
||||
// >
|
||||
// <span>{item.description}</span>
|
||||
// </div>
|
||||
<div key={index} className={`fc-event 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={`${color} form-check-label`} htmlFor={item.cid}>
|
||||
{item.description}
|
||||
</label>
|
||||
</div>
|
||||
))} */}
|
||||
)
|
||||
}
|
||||
)}
|
||||
|
||||
{/* <div id="external-events">
|
||||
<ExternalDraggable category={category} />
|
||||
{/* <div className="form-check">
|
||||
<input className="form-check-input" type="checkbox" value={removeAfterDrop}
|
||||
id="defaultCheck1" onChange={() => setRemoveAfterDrop(prev => !prev)} />
|
||||
<label className="form-check-label" htmlFor="defaultCheck1">
|
||||
Remove After Drop
|
||||
</label>
|
||||
</div> */}
|
||||
</div>
|
||||
</div> */}
|
||||
|
||||
{/* <div className="form-check">
|
||||
<input className="form-check-input" type="checkbox" value={removeAfterDrop}
|
||||
id="defaultCheck1" onChange={() => setRemoveAfterDrop(prev => !prev)} />
|
||||
<label className="form-check-label" htmlFor="defaultCheck1">
|
||||
Remove After Drop
|
||||
</label>
|
||||
</div> */}
|
||||
</div>
|
||||
<div className="col-xl-9">
|
||||
<div className="event-calendar">
|
||||
<EventCalendar
|
||||
removeAfterDrop={removeAfterDrop}
|
||||
eventList={eventList}
|
||||
activeCategory={activeCategory}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -6,7 +6,7 @@ import timeGridPlugin from '@fullcalendar/timegrid';
|
||||
import interactionPlugin from '@fullcalendar/interaction';
|
||||
import { INITIAL_EVENTS, createEventId } from './event-utils';
|
||||
|
||||
export default function EventCalendar({removeAfterDrop, eventList}) {
|
||||
export default function EventCalendar({removeAfterDrop, eventList, activeCategory}) {
|
||||
const [weekendsVisible, setWeekendsVisible] = useState(true);
|
||||
const [currentEvents, setCurrentEvents] = useState([]);
|
||||
|
||||
@@ -79,9 +79,11 @@ export default function EventCalendar({removeAfterDrop, eventList}) {
|
||||
}
|
||||
|
||||
useEffect(()=>{
|
||||
let newEventList = eventList.map(item => ({...item, start: new Date(item?.start)}))
|
||||
// let newEventList = eventList?.map(item => ({...item, start: new Date(item?.start)}))
|
||||
let newEventList = eventList?.filter(item => (Number(item.category) == Number(activeCategory)))?.map(item => ({...item, start: new Date(item?.start)}))
|
||||
console.log('newEventList', newEventList)
|
||||
setCurrentEvents(newEventList)
|
||||
},[eventList])
|
||||
},[activeCategory])
|
||||
|
||||
return (
|
||||
<div className="demo-app">
|
||||
|
||||
@@ -18,7 +18,7 @@ export default function Comments(){
|
||||
<div className="row justify-content-center">
|
||||
<div className="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">className= <i className="fa fa-plus pl-2"></i></a>
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-12">
|
||||
|
||||
@@ -18,7 +18,7 @@ export default function Contacts(){
|
||||
<div className="row justify-content-center">
|
||||
<div className="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">className= <i className="fa fa-plus pl-2"></i></a>
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-12">
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
import React from "react";
|
||||
import getImage from "../../../utils/getImage";
|
||||
import { useNavigate } from "react-router-dom";
|
||||
import { Link, useNavigate } from "react-router-dom";
|
||||
import { useSelector } from "react-redux";
|
||||
import siteLinks from "../../../links/siteLinks";
|
||||
|
||||
@@ -83,31 +83,33 @@ export default function UserHeader(){
|
||||
</div>
|
||||
</div>
|
||||
<div className="p-4">
|
||||
<a className="dropdown-item d-flex nav-link" href="#">
|
||||
<i className="fa fa-user pr-2 text-success"></i> Profile</a>
|
||||
<a className="dropdown-item d-flex nav-link" href="#">
|
||||
<i className="fa fa-envelope pr-2 text-primary"></i> Inbox
|
||||
<Link className="dropdown-item d-flex nav-link" to={siteLinks.user}>
|
||||
<i className="fa fa-user pr-2 text-success"></i> Users</Link>
|
||||
<Link className="dropdown-item d-flex nav-link" to={siteLinks.contacts}>
|
||||
<i className="fa fa-envelope pr-2 text-primary"></i> Contacts
|
||||
<span className="badge badge-primary ml-auto">6</span>
|
||||
</a>
|
||||
<a className="dropdown-item d-flex nav-link" href={siteLinks.settings}>
|
||||
</Link>
|
||||
<Link className="dropdown-item d-flex nav-link" to={siteLinks.settings}>
|
||||
<i className=" ti ti-settings pr-2 text-info"></i> Settings
|
||||
</a>
|
||||
</Link>
|
||||
<a className="dropdown-item d-flex nav-link" href="#">
|
||||
<i className="fa fa-compass pr-2 text-warning"></i> Need help?</a>
|
||||
<div className="row mt-2">
|
||||
<div className="col">
|
||||
<a className="bg-light p-3 text-center d-block" href="#">
|
||||
<i className="fe fe-mail font-20 text-primary"></i>
|
||||
<span className="d-block font-13 mt-2">My messages</span>
|
||||
</a>
|
||||
</div>
|
||||
<div className="col">
|
||||
<a className="bg-light p-3 text-center d-block" href="#">
|
||||
<i className="fe fe-plus font-20 text-primary"></i>
|
||||
<span className="d-block font-13 mt-2">Compose new</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/*<div className="row mt-2">*/}
|
||||
{/* <div className="col">*/}
|
||||
{/* <a className="bg-light p-3 text-center d-block" href="#">*/}
|
||||
{/* <i className="fe fe-mail font-20 text-primary"></i>*/}
|
||||
{/* <span className="d-block font-13 mt-2">My messages</span>*/}
|
||||
{/* </a>*/}
|
||||
{/* </div>*/}
|
||||
{/* <div className="col">*/}
|
||||
{/* <a className="bg-light p-3 text-center d-block" href="#">*/}
|
||||
{/* <i className="fe fe-plus font-20 text-primary"></i>*/}
|
||||
{/* <span className="d-block font-13 mt-2">Compose new</span>*/}
|
||||
{/* </a>*/}
|
||||
{/* </div>*/}
|
||||
{/*</div>*/}
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
|
||||
@@ -12,11 +12,17 @@ export default function ProductProvision(props){
|
||||
const productTitle = props?.productData?.title;
|
||||
const productDescription = props?.productData?.description;
|
||||
const productID = props?.productData?.product_id
|
||||
const productUID = props?.productData?.product_uid
|
||||
const productSubUID = props?.productData?.product_subscription_uid
|
||||
|
||||
const reqData = {
|
||||
product_id : productID,
|
||||
product_subscription_uid: productSubUID
|
||||
}
|
||||
|
||||
const {data:provision, isFetching, isError, error} = useQuery({
|
||||
queryKey: queryKeys.myproduct_provision,
|
||||
queryFn: () => productProvision(productID)
|
||||
queryFn: () => productProvision(reqData)
|
||||
})
|
||||
|
||||
const provisionData = provision?.data?.provision
|
||||
|
||||
@@ -31,13 +31,14 @@
|
||||
.fc-event {
|
||||
border-radius: 2px;
|
||||
border: none;
|
||||
cursor: move;
|
||||
// cursor: move;
|
||||
font-size: 13px;
|
||||
margin: 5px 0px;
|
||||
padding: 10px 10px 10px 40px;
|
||||
text-align: left;
|
||||
position:relative;
|
||||
&:before {
|
||||
display: none;
|
||||
content:'';
|
||||
position:absolute;
|
||||
width:15px;
|
||||
|
||||
@@ -40,8 +40,10 @@
|
||||
align-items: center;
|
||||
}
|
||||
.mail-msg{
|
||||
max-height: 747px;
|
||||
overflow: hidden;
|
||||
max-height: 500px;
|
||||
min-height: 400px;
|
||||
// max-height: 747px;
|
||||
overflow-y: auto;
|
||||
outline: none;
|
||||
@include laptop {
|
||||
max-height: 450px;
|
||||
|
||||
@@ -112,9 +112,9 @@ export const recentActions = () => {
|
||||
}
|
||||
|
||||
// FUNCTION TO GET MY PRODUCT PROVISION DATA
|
||||
export const productProvision = (productID) => {
|
||||
const reqData = { product_id : productID}
|
||||
return getAuxEnd(`/panel/myproduct/provision`,reqData)
|
||||
export const productProvision = (reqData) => {
|
||||
const postData = { ...reqData }
|
||||
return getAuxEnd(`/panel/myproduct/provision`, postData)
|
||||
}
|
||||
|
||||
// FUNCTION TO GET DASHBOARD PRODUCT DATA SECTION
|
||||
|
||||
Reference in New Issue
Block a user