37 lines
892 B
JavaScript
37 lines
892 B
JavaScript
import { useMemo, useState } from 'react';
|
|
import { getData } from '../data';
|
|
import { Gantt, Editor, getEditorItems } from '../../src';
|
|
|
|
function GanttEditorValidation({ skinSettings }) {
|
|
const data = useMemo(() => getData(), []);
|
|
const [api, setApi] = useState();
|
|
|
|
const items = useMemo(
|
|
() =>
|
|
getEditorItems().map((ed) => ({
|
|
...ed,
|
|
...(ed.comp === 'text' && { required: true }),
|
|
...(ed.comp === 'counter' && {
|
|
validation: (v) => v <= 50,
|
|
validationMessage: 'Task duration should not exceed 50 days',
|
|
}),
|
|
})),
|
|
[],
|
|
);
|
|
|
|
return (
|
|
<>
|
|
<Gantt
|
|
init={setApi}
|
|
{...skinSettings}
|
|
tasks={data.tasks}
|
|
links={data.links}
|
|
scales={data.scales}
|
|
/>
|
|
{api && <Editor api={api} items={items} autoSave={false} />}
|
|
</>
|
|
);
|
|
}
|
|
|
|
export default GanttEditorValidation;
|