yangli/worldshine-redesign
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix

Browse Source
This commit is contained in:
Lixian Zhou
2026-02-09 15:53:03 -05:00
parent 9fa92a1dce
commit 5bda671a59
16 changed files with 249 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
.DS_Store vendored
View File

Binary file not shown.

BIN
app/.DS_Store vendored
View File

Binary file not shown.

BIN
app/views/.DS_Store vendored
View File

Binary file not shown.

12
app/views/asset-manifest.json
View File

@@ -1,16 +1,16 @@
{
"files": {
"main.css": "/static/css/main.934f61ea.css",
"main.js": "/static/js/main.1d0beffa.js",
"main.css": "/static/css/main.6d8e0960.css",
"main.js": "/static/js/main.34bdd0b7.js",
"static/js/787.c4e7f8f9.chunk.js": "/static/js/787.c4e7f8f9.chunk.js",
"static/media/landing.png": "/static/media/landing.d4c6072db7a67dff6a78.png",
"index.html": "/index.html",
"main.934f61ea.css.map": "/static/css/main.934f61ea.css.map",
"main.1d0beffa.js.map": "/static/js/main.1d0beffa.js.map",
"main.6d8e0960.css.map": "/static/css/main.6d8e0960.css.map",
"main.34bdd0b7.js.map": "/static/js/main.34bdd0b7.js.map",
"787.c4e7f8f9.chunk.js.map": "/static/js/787.c4e7f8f9.chunk.js.map"
},
"entrypoints": [
"static/css/main.934f61ea.css",
"static/js/main.1d0beffa.js"
"static/css/main.6d8e0960.css",
"static/js/main.34bdd0b7.js"
]
}

2
app/views/index.html
View File

@@ -1 +1 @@
<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="icon" href="/favicon.ico"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><meta name="description" content="Web site created using create-react-app"/><link rel="apple-touch-icon" href="/logo192.png"/><script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.10/lodash.min.js"></script><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css"><link rel="manifest" href="/manifest.json"/><title>Worldshine Transportation</title><script defer="defer" src="/static/js/main.1d0beffa.js"></script><link href="/static/css/main.934f61ea.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div></body></html>
<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="icon" href="/favicon.ico"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><meta name="description" content="Web site created using create-react-app"/><link rel="apple-touch-icon" href="/logo192.png"/><script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.10/lodash.min.js"></script><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css"><link rel="manifest" href="/manifest.json"/><title>Worldshine Transportation</title><script defer="defer" src="/static/js/main.34bdd0b7.js"></script><link href="/static/css/main.6d8e0960.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div></body></html>

4
app/views/static/css/main.934f61ea.css → app/views/static/css/main.6d8e0960.css
View File

File diff suppressed because one or more lines are too long

1
app/views/static/css/main.6d8e0960.css.map Normal file
View File

File diff suppressed because one or more lines are too long

1
app/views/static/css/main.934f61ea.css.map
View File

File diff suppressed because one or more lines are too long

3
app/views/static/js/main.1d0beffa.js
View File

File diff suppressed because one or more lines are too long

3
app/views/static/js/main.34bdd0b7.js Normal file
View File

File diff suppressed because one or more lines are too long

0
app/views/static/js/main.1d0beffa.js.LICENSE.txt → app/views/static/js/main.34bdd0b7.js.LICENSE.txt
View File

2
app/views/static/js/main.1d0beffa.js.map → app/views/static/js/main.34bdd0b7.js.map
View File

File diff suppressed because one or more lines are too long

BIN
client/.DS_Store vendored
View File

Binary file not shown.

22
client/src/App.css
View File

@@ -449,7 +449,10 @@ table .group td {
.list-func-panel .dropdown-menu {
padding: 20px;
width: 250px;
min-width: 280px;
width: max-content;
right: 0 !important;
left: auto !important;
transform: translate(0px, 37px)!important;
}
@@ -886,6 +889,23 @@ input[type="checkbox"] {
background-color: #FFD1DC !important;
}
.event-no-click {
pointer-events: none;
cursor: default;
}
.event-member_related {
border-inline-start: 4px solid #0066B1 !important;
color: #0066B1 !important;
background-color: #E0F2FE !important;
}
.event-vehicle_maintenance {
border-inline-start: 4px solid #9C2A10 !important;
color: #9C2A10 !important;
background-color: #FEF0C7 !important;
}
/* Calendar event title styles - auto-truncate based on container width */
.sx__month-grid-event .sx__month-grid-event__title,
.sx__week-grid__event .sx__event-title,

167
client/src/components/center-calendar/CenterCalendar.js
View File

@@ -37,6 +37,7 @@ const EventsCalendar = () => {
const [currentTotalTranslate2, setCurrentTotalTranslate2] = useState(0);
const [currentTotalResource, setCurrentTotalResource] = useState(0);
const [showDeletedItems, setShowDeletedItems] = useState(false);
const [selectedColorFilters, setSelectedColorFilters] = useState([]);
const [timeData, setTimeData] = useState([]);
const [showFilterDropdown, setShowFilterDropdown] = useState(false);
const eventsServicePlugin = createEventsServicePlugin();
@@ -157,8 +158,15 @@ const EventsCalendar = () => {
setToDate(new Date(endDate.getFullYear(), endDate.getMonth() + 1, 0));
},
onClickDate(date) {
setNewEventStartDateTime(new Date(date))
setNewEventEndDateTime(new Date(date));
// Parse as local date to avoid UTC timezone offset shifting the day
const [y, m, d] = date.split('-').map(Number);
const localDate = new Date(y, m - 1, d);
// Default to 10:00 AM for Medical Appointments and Activities tabs
if (currentTab === 'medicalCalendar' || currentTab === 'activitiesCalendar') {
localDate.setHours(10, 0, 0, 0);
}
setNewEventStartDateTime(localDate);
setNewEventEndDateTime(localDate);
setShowCreationModal(true);
},
onClickDateTime(dateTime) {
@@ -277,17 +285,51 @@ const EventsCalendar = () => {
item.totalResource = totalResource;
setCurrentTotalResource(item.totalResource);
return item;
})?.filter(item => (!showDeletedItems && item.status === 'active') || showDeletedItems));
})?.filter(item => (!showDeletedItems && item.status === 'active') || showDeletedItems)
?.filter(item => {
if (selectedColorFilters.length === 0) return true;
if (selectedColorFilters.includes(item.color)) return true;
// When "Drop-Off Only" (purple) is selected, also show events with no label
if (selectedColorFilters.includes('purple') && !item.color) return true;
return false;
}));
}
} else {
const originalEvents = [...allEvents];
let filteredEvents = originalEvents?.filter(item => item.type === eventTypeMap[currentTab])?.map(item => ({
let filteredEvents = originalEvents?.filter(item => item.type === eventTypeMap[currentTab])?.map(item => {
// For Important Dates, remap old blue/orange colors to new member_related/vehicle_maintenance
let eventColor = item?.color;
if (currentTab === 'reminderDatesCalendar') {
const isMember = ['birthday', 'adcaps_completion', 'center_qualification_expiration'].includes(item?.event_reminder_type) || item?.target_type === 'customer';
eventColor = isMember ? 'member_related' : 'vehicle_maintenance';
}
const additionalClasses = [`event-${eventColor || 'primary'}`];
// Disable clicking for birthday events on Important Dates tab
if (currentTab === 'reminderDatesCalendar' && item?.event_reminder_type === 'birthday') {
additionalClasses.push('event-no-click');
}
// For Important Dates, use date-only format so tiles don't show hour:minute
const dateFormat = (currentTab === 'reminderDatesCalendar' || currentTab === 'incidentsCalendar') ? 'YYYY-MM-DD' : 'YYYY-MM-DD HH:mm';
return {
...item,
color: eventColor,
title: item?.title,
start: item?.start_time? `${moment(new Date(item?.start_time)).format('YYYY-MM-DD HH:mm')}` : `${moment().format('YYYY-MM-DD HH:mm')}`,
end: item?.stop_time? `${moment(new Date(item?.stop_time)).format('YYYY-MM-DD HH:mm')}` : (item?.start_time? `${moment(item?.start_time).format('YYYY-MM-DD HH:mm')}` : `${moment().format('YYYY-MM-DD HH:mm')}`),
_options: { additionalClasses: [`event-${item?.color || 'primary'}`]}
}))?.filter(item => (!showDeletedItems && item.status === 'active') || showDeletedItems);
start: item?.start_time? `${moment(new Date(item?.start_time)).format(dateFormat)}` : `${moment().format(dateFormat)}`,
end: item?.stop_time? `${moment(new Date(item?.stop_time)).format(dateFormat)}` : (item?.start_time? `${moment(item?.start_time).format(dateFormat)}` : `${moment().format(dateFormat)}`),
_options: { additionalClasses }
};
})?.filter(item => (!showDeletedItems && item.status === 'active') || showDeletedItems)
?.filter(item => {
if (selectedColorFilters.length === 0) return true;
// For Important Dates, filter by event_reminder_type
if (currentTab === 'reminderDatesCalendar') {
return selectedColorFilters.includes(item.event_reminder_type);
}
if (selectedColorFilters.includes(item.color)) return true;
// When "Drop-Off Only" (purple) is selected, also show events with no label
if (selectedColorFilters.includes('purple') && !item.color) return true;
return false;
});
// For Important Dates tab, filter to only show events for active customers
if (currentTab === 'reminderDatesCalendar' && customers?.length > 0) {
@@ -308,7 +350,7 @@ const EventsCalendar = () => {
setEvents(filteredEvents);
}
}, [customers, resources, timeData, currentTab, allEvents, showDeletedItems])
}, [customers, resources, timeData, currentTab, allEvents, showDeletedItems, selectedColorFilters])
@@ -416,6 +458,14 @@ const EventsCalendar = () => {
});
}
const toggleColorFilter = (colorValue) => {
setSelectedColorFilters(prev =>
prev.includes(colorValue)
? prev.filter(c => c !== colorValue)
: [...prev, colorValue]
);
};
const FilterAndClose = () => {
setShowFilterDropdown(false);
}
@@ -423,11 +473,13 @@ const EventsCalendar = () => {
const cleanFilterAndClose = () => {
setShowFilterDropdown(false);
setShowDeletedItems(false);
setSelectedColorFilters([]);
}
const goToTab = (value) => {
setTargetedEventType(eventTypeMap[value]);
setCurrentTab(value);
setSelectedColorFilters([]);
}
@@ -471,7 +523,97 @@ const EventsCalendar = () => {
<input type="checkbox" value={showDeletedItems} checked={showDeletedItems === true} onClick={() => setShowDeletedItems(!showDeletedItems)} />
</div>
</div>
<div className="list row">
<hr style={{ margin: '8px 0' }} />
<div style={{ display: 'flex', flexDirection: 'column' }}>
<div className="field-label" style={{ marginBottom: '8px' }}>Filter by Type</div>
{currentTab === 'reminderDatesCalendar' ? (
<>
<div style={{ fontSize: '11px', fontWeight: '600', color: '#0066B1', marginBottom: '4px', marginTop: '4px' }}>Member-Related</div>
{EventsService.importantDatesFilterOptions.filter(o => o.group === 'member_related').map((item) => (
<div key={item.value} className="d-flex align-items-center mb-1" style={{ cursor: 'pointer', paddingLeft: '4px' }} onClick={() => toggleColorFilter(item.value)}>
<input
type="checkbox"
checked={selectedColorFilters.includes(item.value)}
onChange={() => toggleColorFilter(item.value)}
style={{ marginRight: '8px', marginLeft: '0' }}
onClick={(e) => e.stopPropagation()}
/>
<span
className="event-member_related"
style={{
width: '14px',
height: '14px',
borderRadius: '3px',
display: 'inline-block',
marginRight: '6px',
flexShrink: 0
}}
></span>
<span style={{ fontSize: '12px' }}>{item.label}</span>
</div>
))}
<div style={{ fontSize: '11px', fontWeight: '600', color: '#9C2A10', marginBottom: '4px', marginTop: '8px' }}>Vehicle Maintenance</div>
{EventsService.importantDatesFilterOptions.filter(o => o.group === 'vehicle_maintenance').map((item) => (
<div key={item.value} className="d-flex align-items-center mb-1" style={{ cursor: 'pointer', paddingLeft: '4px' }} onClick={() => toggleColorFilter(item.value)}>
<input
type="checkbox"
checked={selectedColorFilters.includes(item.value)}
onChange={() => toggleColorFilter(item.value)}
style={{ marginRight: '8px', marginLeft: '0' }}
onClick={(e) => e.stopPropagation()}
/>
<span
className="event-vehicle_maintenance"
style={{
width: '14px',
height: '14px',
borderRadius: '3px',
display: 'inline-block',
marginRight: '6px',
flexShrink: 0
}}
></span>
<span style={{ fontSize: '12px' }}>{item.label}</span>
</div>
))}
</>
) : (
getLegendOptions().map((item) => (
<div key={item.value} className="d-flex align-items-center mb-1" style={{ cursor: 'pointer' }} onClick={() => toggleColorFilter(item.value)}>
<input
type="checkbox"
checked={selectedColorFilters.includes(item.value)}
onChange={() => toggleColorFilter(item.value)}
style={{ marginRight: '8px', marginLeft: '0' }}
onClick={(e) => e.stopPropagation()}
/>
<span
className={`event-${item.value}`}
style={{
width: '14px',
height: '14px',
borderRadius: '3px',
display: 'inline-block',
marginRight: '6px',
flexShrink: 0
}}
></span>
<span style={{ fontSize: '12px' }}>{item.label}</span>
</div>
))
)}
{selectedColorFilters.length > 0 && (
<div style={{ marginTop: '4px' }}>
<span
style={{ fontSize: '11px', color: '#0066B1', cursor: 'pointer', textDecoration: 'underline' }}
onClick={() => setSelectedColorFilters([])}
>
Clear all
</span>
</div>
)}
</div>
<div className="list row" style={{ marginTop: '8px' }}>
<div className="col-md-12">
<button className="btn btn-default btn-sm float-right" onClick={() => cleanFilterAndClose()}> Cancel </button>
<button className="btn btn-primary btn-sm float-right" onClick={() => FilterAndClose()}> Filter </button>
@@ -494,7 +636,7 @@ const EventsCalendar = () => {
case 'mealPlanCalendar':
return EventsService.mealPlanColorOptions;
case 'reminderDatesCalendar':
return EventsService.colorOptions;
return EventsService.importantDatesLegendOptions;
default:
return [];
}
@@ -744,7 +886,7 @@ const handleSave = () => {
target_uuid: newReminderAssociatedEntity?.value,
target_name: newReminderAssociatedEntity?.label,
rrule: newEventRecurring,
color: isMemberCategory ? 'blue' : 'orange',
color: isMemberCategory ? 'member_related' : 'vehicle_maintenance',
};
}
@@ -1026,7 +1168,6 @@ const getReminderTitleLabel = (value) => {
}}>
<option value="">Select Title</option>
<optgroup label="Member">
<option value="birthday">Birthday</option>
<option value="adcaps_completion">ADCAPS Completion</option>
<option value="center_qualification_expiration">Center Qualification Expiration</option>
</optgroup>

58
client/src/services/EventsService.js
View File

@@ -208,6 +208,62 @@ const mealPlanColorOptions = [
// Legacy alias for backward compatibility
const colorOptions = labelOptions;
// Important Dates legend options (two visual groups)
const importantDatesLegendOptions = [
{
value: 'member_related',
label: 'Member-Related'
},
{
value: 'vehicle_maintenance',
label: 'Vehicle Maintenance'
}
];
// Important Dates filter options (matching the title dropdown in the creation popup)
const importantDatesFilterOptions = [
{
value: 'birthday',
label: 'Birthday',
group: 'member_related'
},
{
value: 'adcaps_completion',
label: 'ADCAPS Completion',
group: 'member_related'
},
{
value: 'center_qualification_expiration',
label: 'Center Qualification Expiration',
group: 'member_related'
},
{
value: 'oil_change',
label: 'Oil Change',
group: 'vehicle_maintenance'
},
{
value: 'monthly_vehicle_inspection',
label: 'Monthly Vehicle Inspection',
group: 'vehicle_maintenance'
},
{
value: 'emissions_inspection',
label: 'Emissions Inspection',
group: 'vehicle_maintenance'
},
{
value: 'insurance_expiration',
label: 'Insurance Expiration',
group: 'vehicle_maintenance'
},
{
value: 'license_plate_expiration',
label: 'License Plate Expiration',
group: 'vehicle_maintenance'
}
];
// Transportation Support options
const transportationTypeOptions = [
{
@@ -284,6 +340,8 @@ export const EventsService = {
incidentColorOptions,
mealPlanColorOptions,
transportationTypeOptions,
importantDatesLegendOptions,
importantDatesFilterOptions,
// Legacy aliases for backward compatibility
interpreterLevelOptions,
colorOptions