P8-Panels/app/panels/samples/p8online.js

129 lines
5.4 KiB
JavaScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

/*
Парус 8 - Панели мониторинга - Примеры для разработчиков
Пример: API для взаимодействия с "ПАРУС 8 Онлайн" и ядром фреймворка
*/
//---------------------
//Подключение библиотек
//---------------------
import React, { useState, useContext } from "react"; //Классы React
import PropTypes from "prop-types"; //Контроль свойств компонента
import { Typography, Button, Divider } from "@mui/material"; //Интерфейсные элементы
import { ApplicationCtx } from "../../context/application"; //Контекст приложения
//---------
//Константы
//---------
//Стили
const STYLES = {
CONTAINER: { textAlign: "center", paddingTop: "20px" },
TITLE: { paddingBottom: "15px" },
DIVIDER: { margin: "15px" }
};
//-----------
//Тело модуля
//-----------
//Пример: API для взаимодействия с "ПАРУС 8 Онлайн" и ядром фреймворка
const P8Online = ({ title }) => {
//Собственное состояние - флаг отображения пользовательского текста заголовка
const [titleCustom, setTitleCustom] = useState(false);
//Собственное состояние - флаг отображения заголовка
const [titleVisible, setTitleVisible] = useState(true);
//Собственное состояние - выбранный контрагент
const [agent, setAgent] = useState("");
//Подключение к контексту приложения
const { pOnlineShowUnit, pOnlineShowTab, pOnlineShowDocument, pOnlineShowDictionary, setAppBarTitle, setAppBarShow, findPanelByName } =
useContext(ApplicationCtx);
//Генерация содержимого
return (
<div style={STYLES.CONTAINER}>
<Typography sx={STYLES.TITLE} variant={"h6"}>
{title}
</Typography>
{/* Изменение текста заголовка */}
{titleVisible && (
<>
<Button
variant="contained"
onClick={() => {
setAppBarTitle(titleCustom ? "" : "Пользовательский текст");
setTitleCustom(!titleCustom);
}}
>
{`${titleCustom ? "Восстановить" : "Изменить"} текст заголовка`}
</Button>
<Divider sx={STYLES.DIVIDER} />
</>
)}
{/* Сокрытие/отображение заголовка */}
<Button
variant="contained"
onClick={() => {
setAppBarShow(!titleVisible);
setTitleVisible(!titleVisible);
}}
>
{`${titleVisible ? "Скрыть" : "Отобразить"} заголовок`}
</Button>
<Divider sx={STYLES.DIVIDER} />
{/* Поиск панели */}
<Button variant="contained" onClick={() => console.log(findPanelByName("Samples"))}>
Вывести в консоль сведения о данной панели
</Button>
<Divider sx={STYLES.DIVIDER} />
{/* Открыть новую закладку */}
<Button variant="contained" onClick={() => pOnlineShowTab({ caption: "PARUS.COM", url: "https://www.parus.com" })}>
Открыть закладку
</Button>
<Divider sx={STYLES.DIVIDER} />
{/* Открыть раздел */}
<Button variant="contained" onClick={() => pOnlineShowUnit({ unitCode: "Contracts" })}>
Открыть раздел Договоры
</Button>
<Divider sx={STYLES.DIVIDER} />
{/* Открыть раздел в режиме словаря */}
<Button
variant="contained"
onClick={() => {
pOnlineShowDictionary({
unitCode: "AGNLIST",
inputParameters: [{ name: "in_AGNABBR", value: agent }],
callBack: res => (res.success === true ? setAgent(res.outParameters.out_AGNABBR) : null)
});
}}
>
Выбрать контрагента
</Button>
{/* Позиционирование/отбор документа */}
{agent ? (
<>
<Divider sx={STYLES.DIVIDER} />
<Button
variant="contained"
onClick={() => pOnlineShowDocument({ unitCode: "AGNLIST", document: agent, inRnParameter: "in_AGNABBR" })}
>{`Показать контрагента "${agent}"`}</Button>
</>
) : null}
</div>
);
};
//Контроль свойств - Пример: API для взаимодействия с "ПАРУС 8 Онлайн"
P8Online.propTypes = {
title: PropTypes.string.isRequired
};
//----------------
//Интерфейс модуля
//----------------
export { P8Online };