88 lines
2.2 KiB
JavaScript
88 lines
2.2 KiB
JavaScript
import { useMemo, useRef } from 'react';
|
|
import { getData } from '../data';
|
|
import { Gantt, registerScaleUnit } from '../../src/';
|
|
import {
|
|
startOfMonth,
|
|
endOfMonth,
|
|
isSameMonth,
|
|
addMonths,
|
|
addDays,
|
|
format,
|
|
} from 'date-fns';
|
|
|
|
export default function GanttScaleUnit(props) {
|
|
const { skinSettings } = props;
|
|
|
|
const data = useMemo(() => getData(), []);
|
|
|
|
const getMidDate = (d) => {
|
|
const m = d.getMonth();
|
|
return m === 1 ? 15 : 16;
|
|
};
|
|
|
|
const sprintStart = (d) => {
|
|
const monthStart = startOfMonth(d);
|
|
const midDate = getMidDate(d);
|
|
if (d.getDate() >= midDate) monthStart.setDate(midDate);
|
|
return monthStart;
|
|
};
|
|
|
|
const sprintEnd = (d) => {
|
|
const monthEnd = endOfMonth(d);
|
|
const midDate = getMidDate(d);
|
|
if (d.getDate() < midDate) monthEnd.setDate(midDate - 1);
|
|
return monthEnd;
|
|
};
|
|
|
|
const sprintFormat = (d) => {
|
|
const monthStr = format(d, 'MMMM');
|
|
const start = d.getDate();
|
|
const end = sprintEnd(d).getDate();
|
|
return `${monthStr} ${start} - ${end}`;
|
|
};
|
|
|
|
const registeredRef = useRef(false);
|
|
if (!registeredRef.current) {
|
|
registerScaleUnit('sprint', {
|
|
start: sprintStart,
|
|
end: sprintEnd,
|
|
isSame: (a, b) => {
|
|
const sameMonth = isSameMonth(a, b);
|
|
if (!sameMonth) return false;
|
|
const midDate = getMidDate(a);
|
|
return a.getDate() < midDate == b.getDate() < midDate;
|
|
},
|
|
add: (d, amount) => {
|
|
const date = d.getDate();
|
|
const start = sprintStart(d);
|
|
const diff = date - start.getDate();
|
|
let newDate = addMonths(start, Math.floor(amount / 2));
|
|
const midDate = getMidDate(newDate);
|
|
if (amount % 2) {
|
|
newDate = addDays(newDate, midDate);
|
|
newDate = sprintStart(newDate);
|
|
}
|
|
return addDays(newDate, diff);
|
|
},
|
|
});
|
|
registeredRef.current = true;
|
|
}
|
|
|
|
return (
|
|
<Gantt
|
|
{...skinSettings}
|
|
tasks={data.tasks}
|
|
links={data.links}
|
|
scales={[
|
|
{ unit: 'month', step: 1, format: '%F %Y' },
|
|
{ unit: 'sprint', step: 1, format: sprintFormat },
|
|
{ unit: 'day', step: 1, format: '%j' },
|
|
]}
|
|
zoom={true}
|
|
start={new Date(2026, 3, 1)}
|
|
end={new Date(2026, 5, 1)}
|
|
cellWidth={60}
|
|
/>
|
|
);
|
|
}
|