mirror of
https://github.com/IRBorisov/ConceptPortal.git
synced 2025-06-26 21:10:38 +03:00
103 lines
3.8 KiB
TypeScript
103 lines
3.8 KiB
TypeScript
import { useEffect, useState } from 'react';
|
||
|
||
import Modal, { ModalProps } from '../../components/Common/Modal';
|
||
import SelectSingle from '../../components/Common/SelectSingle';
|
||
import TextArea from '../../components/Common/TextArea';
|
||
import RSInput from '../../components/RSInput';
|
||
import { CstType,ICstCreateData } from '../../models/rsform';
|
||
import { labelCstType } from '../../utils/labels';
|
||
import { SelectorCstType } from '../../utils/selectors';
|
||
|
||
interface DlgCreateCstProps
|
||
extends Pick<ModalProps, 'hideWindow'> {
|
||
initial?: ICstCreateData
|
||
onCreate: (data: ICstCreateData) => void
|
||
}
|
||
|
||
function DlgCreateCst({ hideWindow, initial, onCreate }: DlgCreateCstProps) {
|
||
const [validated, setValidated] = useState(false);
|
||
const [selectedType, setSelectedType] = useState<CstType>(CstType.BASE);
|
||
|
||
const [term, setTerm] = useState('');
|
||
const [textDefinition, setTextDefinition] = useState('');
|
||
const [expression, setExpression] = useState('');
|
||
const [convention, setConvention] = useState('');
|
||
|
||
function getData(): ICstCreateData {
|
||
return {
|
||
cst_type: selectedType,
|
||
insert_after: initial?.insert_after ?? null,
|
||
alias: '',
|
||
convention: convention,
|
||
definition_formal: expression,
|
||
definition_raw: textDefinition,
|
||
term_raw: term
|
||
};
|
||
}
|
||
|
||
const handleSubmit = () => onCreate(getData());
|
||
|
||
useEffect(() => {
|
||
if (initial) {
|
||
setSelectedType(initial.cst_type);
|
||
setTerm(initial.term_raw);
|
||
setTextDefinition(initial.definition_raw);
|
||
setExpression(initial.definition_formal);
|
||
setConvention(initial.convention);
|
||
}
|
||
}, [initial]);
|
||
|
||
useEffect(() => setValidated(selectedType !== undefined), [selectedType]);
|
||
|
||
return (
|
||
<Modal
|
||
title='Создание конституенты'
|
||
hideWindow={hideWindow}
|
||
canSubmit={validated}
|
||
onSubmit={handleSubmit}
|
||
>
|
||
<div className='h-fit w-[35rem] px-2 mb-2 flex flex-col justify-stretch gap-3'>
|
||
<div className='flex justify-center w-full'>
|
||
<SelectSingle
|
||
className='my-2 min-w-[15rem] self-center'
|
||
options={SelectorCstType}
|
||
placeholder='Выберите тип'
|
||
value={selectedType ? { value: selectedType, label: labelCstType(selectedType) } : null}
|
||
onChange={data => setSelectedType(data?.value ?? CstType.BASE)}
|
||
/>
|
||
</div>
|
||
<TextArea id='term' label='Термин'
|
||
placeholder='Схемный или предметный термин, обозначающий данное понятие или утверждение'
|
||
rows={2}
|
||
value={term}
|
||
spellCheck
|
||
onChange={event => setTerm(event.target.value)}
|
||
/>
|
||
<RSInput id='expression' label='Формальное выражение'
|
||
placeholder='Родоструктурное выражение, задающее формальное определение'
|
||
editable
|
||
height='5.5rem'
|
||
value={expression}
|
||
onChange={value => setExpression(value)}
|
||
/>
|
||
<TextArea id='definition' label='Текстовое определение'
|
||
placeholder='Лингвистическая интерпретация формального выражения'
|
||
rows={2}
|
||
value={textDefinition}
|
||
spellCheck
|
||
onChange={event => setTextDefinition(event.target.value)}
|
||
/>
|
||
<TextArea id='convention' label='Конвенция / Комментарий'
|
||
placeholder='Договоренность об интерпретации неопределяемого понятия
Комментарий к производному понятию'
|
||
rows={2}
|
||
value={convention}
|
||
spellCheck
|
||
onChange={event => setConvention(event.target.value)}
|
||
/>
|
||
</div>
|
||
</Modal>
|
||
);
|
||
}
|
||
|
||
export default DlgCreateCst;
|