diff --git a/app/panels/rrp_conf_editor/hooks.js b/app/panels/rrp_conf_editor/hooks.js index bcafbaa..6f9226b 100644 --- a/app/panels/rrp_conf_editor/hooks.js +++ b/app/panels/rrp_conf_editor/hooks.js @@ -17,15 +17,18 @@ import { useState, useLayoutEffect } from "react"; //Классы React const useWindowResize = () => { //Состояние размера рабочей области const [size, setSize] = useState([0, 0]); + //При изменении размера useLayoutEffect(() => { - function updateSize() { + const updateSize = () => { setSize([document.documentElement.clientWidth, document.documentElement.clientHeight]); - } + }; window.addEventListener("resize", updateSize); updateSize(); return () => window.removeEventListener("resize", updateSize); }, []); + + //Вернём размеры return size; }; diff --git a/app/panels/rrp_conf_editor/iud_form_text_field.js b/app/panels/rrp_conf_editor/iud_form_text_field.js index 4ef0877..4d16ea0 100644 --- a/app/panels/rrp_conf_editor/iud_form_text_field.js +++ b/app/panels/rrp_conf_editor/iud_form_text_field.js @@ -16,7 +16,7 @@ import { Box, FormControl, InputLabel, Input, InputAdornment, IconButton, Icon } //--------- //Стили -export const STYLES = { +const STYLES = { DIALOG_WINDOW_WIDTH: { width: 400 } }; @@ -24,6 +24,7 @@ export const STYLES = { //Тело компонента //--------------- +//Поле ввода const IUDFormTextField = ({ elementCode, elementValue, labelText, onChange, dictionary, ...other }) => { //Значение элемента const [value, setValue] = useState(elementValue); @@ -45,7 +46,7 @@ const IUDFormTextField = ({ elementCode, elementValue, labelText, onChange, dict //Генерация содержимого return ( - + {labelText} { +//Генерация представления ячейки c данными показателя раздела регламентированного отчета +export const confSctnMrkCellRender = ({ row, columnDef, onLinkClick, onEditClick, onDeleteClick }) => { let data = row[columnDef.name]; columnDef.name != "SROW_NAME" && data != undefined && columnDef.visible == true ? (data = ( - { - showRrpConfSctnMrk(row["NRN_" + columnDef.name.substring(5)]); - }} - > + (onLinkClick ? onLinkClick(row["NRN_" + columnDef.name.substring(5)]) : null)}> {row[columnDef.name]} - editCR(row["NRN_" + columnDef.name.substring(5)], row[columnDef.name])}> + (onEditClick ? onEditClick(row["NRN_" + columnDef.name.substring(5)], row[columnDef.name]) : null)}> edit - deleteCR(row["NRN_" + columnDef.name.substring(5)], row[columnDef.name])}> + (onDeleteClick ? onDeleteClick(row["NRN_" + columnDef.name.substring(5)], row[columnDef.name]) : null)}> delete diff --git a/app/panels/rrp_conf_editor/rrp_conf_editor.js b/app/panels/rrp_conf_editor/rrp_conf_editor.js index 3c3d8de..ae089c7 100644 --- a/app/panels/rrp_conf_editor/rrp_conf_editor.js +++ b/app/panels/rrp_conf_editor/rrp_conf_editor.js @@ -17,11 +17,11 @@ import { NavigationCtx } from "../../context/navigation"; //Контекст н import { MessagingСtx } from "../../context/messaging"; //Контекст сообщений import { SectionTabPanel } from "./section_tab_panel"; //Компонент вкладки раздела import { IUDFormDialog } from "./iud_form_dialog"; //Диалог добавления/исправления/удаления компонентов настройки регламентированного отчёта -import { dataCellRender } from "./layouts"; //Дополнительная разметка и вёрстка клиентских элементов +import { confSctnMrkCellRender } from "./layouts"; //Дополнительная разметка и вёрстка клиентских элементов import { STATUSES } from "./iud_form_dialog"; //Статусы диалогового окна import { TEXTS } from "../../../app.text"; //Текстовые константы import { STYLES as COMMON_STYLES } from "./layouts"; //Общие стили -import { useWindowResize } from "./hooks"; +import { useWindowResize } from "./hooks"; //Пользовательские хуки //--------- //Константы @@ -35,18 +35,21 @@ const pxPanelHeaderH = 64; const pxSectionAddButtonW = 40; //Стили -export const STYLES = { +const STYLES = { + CONTAINER: { width: "100%" }, PANELS_MAIN_COLOR: { backgroundColor: "#1976d2" }, ICON_WHITE: { color: "white" }, TABS_BOTTOM_LINE: { borderBottom: 1, borderColor: "divider" }, TABS_PADDING: { padding: "5px" }, - TABS_SIZES: { maxHeight: 150 }, + TABS_SIZES: (width, pxSectionAddButtonW) => ({ maxHeight: 150, maxWidth: width - pxSectionAddButtonW }), GRID_PADDING: { paddingTop: 1, paddingBottom: 1 }, - GRID_SIZES: { + GRID_SIZES: (width, height, pxOuterMenuH, pxPanelHeaderH, pxTabsH) => ({ padding: 0, - minWidth: 400, - minHeight: 300 - } + minWidth: width * 0.95, + minHeight: (height - pxOuterMenuH - pxPanelHeaderH - pxTabsH) * 0.88, + maxWidth: width * 0.95, + maxHeight: (height - pxOuterMenuH - pxPanelHeaderH - pxTabsH) * 0.88 + }) }; //----------- @@ -165,23 +168,45 @@ const RrpConfEditor = () => { }; //Отработка нажатия на кнопку добавления показателя раздела - const addRRPCONFSCTNMRKClick = (prn, sctnCode, sctnName) => { + const addSectionMarkClick = (prn, sctnCode, sctnName) => { setFormData({ status: STATUSES.RRPCONFSCTNMRK_CREATE, prn: prn, sctnCode: sctnCode, sctnName: sctnName }); openForm(); }; //Отработка нажатия на кнопку исправления показателя раздела - const editRRPCONFSCTNMRKClick = (rn, name) => { + const editSectionMarkClick = (rn, name) => { setFormData({ status: STATUSES.RRPCONFSCTNMRK_EDIT, rn: rn, name: name }); openForm(); }; //Отработка нажатия на кнопку удаления показателя раздела - const deleteRRPCONFSCTNMRKClick = (rn, name) => { + const deleteSectionMarkClick = (rn, name) => { setFormData({ status: STATUSES.RRPCONFSCTNMRK_DELETE, rn: rn, name: name }); openForm(); }; + //Отображение показателя раздела + const showSectionMark = async rn => { + const data = await executeStored({ + stored: "PKG_P8PANELS_RRPCONFED.RRPCONFSCTNMRK_GET_CODES", + args: { + NRN: rn + }, + tagValueProcessor: () => undefined + }); + if (data) { + pOnlineShowUnit({ + unitCode: "RRPConfig", + showMethod: "main_mrk_settings", + inputParameters: [ + { name: "in_CODE", value: data.SRRPCONF }, + { name: "in_SCTN_CODE", value: data.SRRPCONFSCTN }, + { name: "in_MRK_CODE", value: data.SRRPCONFSCTNMRK } + ] + }); + } else showMsgErr(TEXTS.NO_DATA_FOUND); + }; + //Формирование разделов const a11yProps = index => { return { @@ -269,27 +294,6 @@ const RrpConfEditor = () => { // eslint-disable-next-line react-hooks/exhaustive-deps }, [rrpDoc.reload, rrpDoc.docLoaded, dataGrid.reload, dataGrid.docLoaded, executeStored]); - //Отбор показателя раздела по ид. - const showRrpConfSctnMrk = async rn => { - const data = await executeStored({ - stored: "PKG_P8PANELS_RRPCONFED.RRPCONFSCTNMRK_GET_CODES", - args: { - NRN: rn - } - }); - if (data) { - pOnlineShowUnit({ - unitCode: "RRPConfig", - showMethod: "main_mrk_settings", - inputParameters: [ - { name: "in_CODE", value: data.SRRPCONF }, - { name: "in_SCTN_CODE", value: data.SRRPCONFSCTN }, - { name: "in_MRK_CODE", value: data.SRRPCONFSCTNMRK } - ] - }); - } else showMsgErr(TEXTS.NO_DATA_FOUND); - }; - //При необходимости обновить данные таблицы useEffect(() => { loadData(); @@ -319,7 +323,7 @@ const RrpConfEditor = () => { //Генерация содержимого return ( - + {formOpen ? : null} {rrpDoc.docLoaded ? ( @@ -332,7 +336,7 @@ const RrpConfEditor = () => { scrollButtons={false} visibleScrollbar aria-label="section tab" - sx={{ ...STYLES.TABS_SIZES, maxWidth: width - pxSectionAddButtonW }} + sx={STYLES.TABS_SIZES(width, pxSectionAddButtonW)} > {rrpDoc.sections.map((s, i) => { return ( @@ -365,18 +369,14 @@ const RrpConfEditor = () => { {rrpDoc.sections.map((s, i) => { return ( - + {s.dataLoaded && s.columnsDef.length > 1 ? ( { size={P8P_DATA_GRID_SIZE.LARGE} reloading={s.reload} dataCellRender={prms => - dataCellRender({ ...prms }, showRrpConfSctnMrk, editRRPCONFSCTNMRKClick, deleteRRPCONFSCTNMRKClick) + confSctnMrkCellRender({ + ...prms, + onLinkClick: showSectionMark, + onEditClick: editSectionMarkClick, + onDeleteClick: deleteSectionMarkClick + }) } /> diff --git a/app/panels/rrp_conf_editor/section_tab_panel.js b/app/panels/rrp_conf_editor/section_tab_panel.js index ff67ee9..afed14c 100644 --- a/app/panels/rrp_conf_editor/section_tab_panel.js +++ b/app/panels/rrp_conf_editor/section_tab_panel.js @@ -22,7 +22,7 @@ const SectionTabPanel = props => { return (