This commit is contained in:
@@ -14,7 +14,7 @@ import { createEventsServicePlugin } from '@schedule-x/events-service';
|
||||
import { createEventModalPlugin} from '@schedule-x/event-modal';
|
||||
import { createEventRecurrencePlugin } from "@schedule-x/event-recurrence";
|
||||
import '@schedule-x/theme-default/dist/calendar.css';
|
||||
import { Archive, PencilSquare, Filter, Plus } from "react-bootstrap-icons";
|
||||
import { Archive, PencilSquare, Filter, Plus, X } from "react-bootstrap-icons";
|
||||
import DatePicker from "react-datepicker";
|
||||
import { vehicleSlice } from "../../store";
|
||||
import Select from 'react-select';
|
||||
@@ -911,11 +911,37 @@ const EventsCalendar = () => {
|
||||
}
|
||||
}
|
||||
|
||||
const dismissEventModal = () => {
|
||||
try {
|
||||
calendar?.config?.plugins?.eventModal?.close();
|
||||
} catch (e) {
|
||||
document.querySelectorAll('.sx__event-modal').forEach(el => el.remove());
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
const customComponents = {
|
||||
eventModal: ({calendarEvent}) => {
|
||||
return <>
|
||||
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'flex-start', gap: '8px' }}>
|
||||
<div className="sx__event-modal__title">{currentTab === 'medicalCalendar' ? calendarEvent?.customer : calendarEvent?.title}</div>
|
||||
<button
|
||||
type="button"
|
||||
onClick={dismissEventModal}
|
||||
aria-label="Close"
|
||||
title="Close"
|
||||
style={{
|
||||
border: 'none',
|
||||
background: 'transparent',
|
||||
padding: 0,
|
||||
cursor: 'pointer',
|
||||
lineHeight: 1,
|
||||
color: '#666'
|
||||
}}
|
||||
>
|
||||
<X size={18} />
|
||||
</button>
|
||||
</div>
|
||||
{calendarEvent?.doctor && <div className="sx__event-modal__time">{`${calendarEvent?.doctor}`}</div>}
|
||||
<div className="sx__event-modal__time">{`${calendarEvent?.start}`}</div>
|
||||
<div className="sx__event-modal__time" style={{ display: 'flex', gap: '12px', marginTop: '8px' }}>
|
||||
|
||||
@@ -13,7 +13,7 @@ import {
|
||||
import { createEventsServicePlugin } from '@schedule-x/events-service';
|
||||
import { createEventModalPlugin} from '@schedule-x/event-modal';
|
||||
import '@schedule-x/theme-default/dist/calendar.css';
|
||||
import { Archive, Filter, PencilSquare } from "react-bootstrap-icons";
|
||||
import { Archive, Filter, PencilSquare, X } from "react-bootstrap-icons";
|
||||
import DatePicker from "react-datepicker";
|
||||
|
||||
|
||||
@@ -317,10 +317,36 @@ const EventsCalendar = () => {
|
||||
setSelectedColorFilters([]);
|
||||
}
|
||||
|
||||
const dismissEventModal = () => {
|
||||
try {
|
||||
calendar?.config?.plugins?.eventModal?.close();
|
||||
} catch (e) {
|
||||
document.querySelectorAll('.sx__event-modal').forEach(el => el.remove());
|
||||
}
|
||||
};
|
||||
|
||||
const customComponents = {
|
||||
eventModal: ({calendarEvent}) => {
|
||||
return <>
|
||||
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'flex-start', gap: '8px' }}>
|
||||
<div className="sx__event-modal__title">{calendarEvent?.customer}</div>
|
||||
<button
|
||||
type="button"
|
||||
onClick={dismissEventModal}
|
||||
aria-label="Close"
|
||||
title="Close"
|
||||
style={{
|
||||
border: 'none',
|
||||
background: 'transparent',
|
||||
padding: 0,
|
||||
cursor: 'pointer',
|
||||
lineHeight: 1,
|
||||
color: '#666'
|
||||
}}
|
||||
>
|
||||
<X size={18} />
|
||||
</button>
|
||||
</div>
|
||||
{calendarEvent?.doctor && <div className="sx__event-modal__time">{`${calendarEvent?.doctor}`}</div>}
|
||||
<div className="sx__event-modal__time">{`${calendarEvent?.start}`}</div>
|
||||
{AuthService.canEditMedicalEvents() && <div className="sx__event-modal__time" style={{ display: 'flex', gap: '12px', marginTop: '8px' }}>
|
||||
|
||||
Reference in New Issue
Block a user