WEB APP: В контекст сообщений (MessagingContext) добавлена возможность вызова встраиваемых (Inline) уведомлений

app/components/p8p_app_message.js

@@ -156,14 +156,14 @@ const P8PAppInlineMessage = ({ variant, text, okBtn, onOk, okBtnCaption }) => {
     //Генерация содержимого
     return (
         <Container style={STYLES.INLINE_MESSAGE}>
-            <Box p={5}>
+            <Box p={1}>
                 <Typography
                     color={variant === P8P_APP_MESSAGE_VARIANT.ERR ? "error" : variant === P8P_APP_MESSAGE_VARIANT.WARN ? "primary" : "textSecondary"}
                 >
                     {text}
                 </Typography>
                 {okBtn && okBtnCaption ? (
-                    <Box pt={2}>
+                    <Box pt={1}>
                         <Button onClick={() => (onOk ? onOk() : null)} color="primary" autoFocus>
                             {okBtnCaption}
                         </Button>

app/context/messaging.js

@@ -10,8 +10,8 @@
 import React, { useReducer, createContext, useCallback } from "react"; //ReactJS
 import PropTypes from "prop-types"; //Контроль свойств компонента
 import { P8PAppProgress } from "../components/p8p_app_progress"; //Индикатор процесса
-import { P8PAppMessage } from "../components/p8p_app_message"; //Диалог сообщения
+import { P8PAppMessage, P8PAppInlineMessage, P8PAppInlineError, P8PAppInlineWarn, P8PAppInlineInfo } from "../components/p8p_app_message"; //Диалог сообщения
-import { MSG_AT, MSG_DLGT, INITIAL_STATE, messagingReducer } from "./messaging_reducer"; //Редьюсер состояния
+import { MSG_AT, MSG_TYPE, INITIAL_STATE, messagingReducer } from "./messaging_reducer"; //Редьюсер состояния
 
 //---------
 //Константы
@@ -61,13 +61,13 @@ export const MessagingContext = ({ titles, texts, buttons, children }) => {
     );
 
     //Отображение сообщения - ошибка
-    const showMsgErr = useCallback((text, msgOnOk = null) => showMsg(MSG_DLGT.ERR, text, msgOnOk), [showMsg]);
+    const showMsgErr = useCallback((text, msgOnOk = null) => showMsg(MSG_TYPE.ERR, text, msgOnOk), [showMsg]);
 
     //Отображение сообщения - информация
-    const showMsgInfo = useCallback((text, msgOnOk = null) => showMsg(MSG_DLGT.INFO, text, msgOnOk), [showMsg]);
+    const showMsgInfo = useCallback((text, msgOnOk = null) => showMsg(MSG_TYPE.INFO, text, msgOnOk), [showMsg]);
 
     //Отображение сообщения - предупреждение
-    const showMsgWarn = useCallback((text, msgOnOk = null, msgOnCancel = null) => showMsg(MSG_DLGT.WARN, text, msgOnOk, msgOnCancel), [showMsg]);
+    const showMsgWarn = useCallback((text, msgOnOk = null, msgOnCancel = null) => showMsg(MSG_TYPE.WARN, text, msgOnOk, msgOnCancel), [showMsg]);
 
     //Сокрытие сообщения
     const hideMsg = useCallback(
@@ -89,11 +89,23 @@ export const MessagingContext = ({ titles, texts, buttons, children }) => {
         hideMsg(true);
     };
 
+    //Встраиваемое сообщение
+    const InlineMsg = useCallback(props => P8PAppInlineMessage({ okBtn: true, okBtnCaption: buttons.OK, ...props }), [buttons.OK]);
+
+    //Встраиваемое сообщение об ошибке
+    const InlineMsgErr = useCallback(props => P8PAppInlineError({ okBtn: true, okBtnCaption: buttons.OK, ...props }), [buttons.OK]);
+
+    //Встраиваемое сообщение с информацией
+    const InlineMsgInfo = useCallback(props => P8PAppInlineInfo({ okBtn: true, okBtnCaption: buttons.OK, ...props }), [buttons.OK]);
+
+    //Встраиваемое сообщение с предупреждением
+    const InlineMsgWarn = useCallback(props => P8PAppInlineWarn({ okBtn: true, okBtnCaption: buttons.OK, ...props }), [buttons.OK]);
+
     //Вернём компонент провайдера
     return (
         <MessagingСtx.Provider
             value={{
-                MSG_DLGT,
+                MSG_TYPE,
                 showLoader,
                 hideLoader,
                 showMsg,
@@ -101,6 +113,10 @@ export const MessagingContext = ({ titles, texts, buttons, children }) => {
                 showMsgInfo,
                 showMsgWarn,
                 hideMsg,
+                InlineMsg,
+                InlineMsgErr,
+                InlineMsgInfo,
+                InlineMsgWarn,
                 msgState: state
             }}
         >
@@ -111,11 +127,11 @@ export const MessagingContext = ({ titles, texts, buttons, children }) => {
                     variant={state.msgType}
                     text={state.msgText}
                     title
-                    titleText={state.msgType == MSG_DLGT.ERR ? titles.ERR : state.msgType == MSG_DLGT.WARN ? titles.WARN : titles.INFO}
+                    titleText={state.msgType == MSG_TYPE.ERR ? titles.ERR : state.msgType == MSG_TYPE.WARN ? titles.WARN : titles.INFO}
                     okBtn={true}
                     onOk={handleMessageOkClick}
-                    okBtnCaption={[MSG_DLGT.ERR, MSG_DLGT.INFO].includes(state.msgType) ? buttons.CLOSE : buttons.OK}
+                    okBtnCaption={[MSG_TYPE.ERR, MSG_TYPE.INFO].includes(state.msgType) ? buttons.CLOSE : buttons.OK}
-                    cancelBtn={state.msgType == MSG_DLGT.WARN}
+                    cancelBtn={state.msgType == MSG_TYPE.WARN}
                     onCancel={handleMessageCancelClick}
                     cancelBtnCaption={buttons.CANCEL}
                 />

app/context/messaging_reducer.js

@@ -21,8 +21,8 @@ const MSG_AT = {
     HIDE_MSG: "HIDE_MSG" //Сокрытие сообщения
 };
 
-//Типы диалогов сообщений
+//Типы сообщений
-const MSG_DLGT = {
+const MSG_TYPE = {
     INFO: P8P_APP_MESSAGE_VARIANT.INFO, //Тип диалога - информация
     WARN: P8P_APP_MESSAGE_VARIANT.WARN, //Тип диалога - предупреждение
     ERR: P8P_APP_MESSAGE_VARIANT.ERR //Тип диалога - ошибка
@@ -33,7 +33,7 @@ const INITIAL_STATE = {
     loading: false,
     loadingMessage: "",
     msg: false,
-    msgType: MSG_DLGT.ERR,
+    msgType: MSG_TYPE.ERR,
     msgText: null,
     msgOnOk: null,
     msgOnCancel: null
@@ -57,7 +57,7 @@ const handlers = {
     [MSG_AT.SHOW_MSG]: (state, { payload }) => ({
         ...state,
         msg: true,
-        msgType: payload.type || MSG_DLGT.APP_ERR,
+        msgType: payload.type || MSG_TYPE.APP_ERR,
         msgText: payload.text,
         msgOnOk: payload.msgOnOk,
         msgOnCancel: payload.msgOnCancel
@@ -73,7 +73,7 @@ const handlers = {
 //----------------
 
 //Константы
-export { MSG_AT, MSG_DLGT, INITIAL_STATE };
+export { MSG_AT, MSG_TYPE, INITIAL_STATE };
 
 //Редьюсер состояния
 export const messagingReducer = (state, action) => {

app/panels/prj_jobs/prj_jobs.js

@@ -31,7 +31,7 @@ const PrjJobs = () => {
     const { executeStored } = useContext(BackEndСtx);
 
     //Подключение к контексту сообщений
-    const { showMsgErr, showMsgWarn, showMsgInfo } = useContext(MessagingСtx);
+    const { MSG_TYPE, showMsgErr, showMsgWarn, showMsgInfo, InlineMsg, InlineMsgErr, InlineMsgInfo, InlineMsgWarn } = useContext(MessagingСtx);
 
     //Подключение к контексту приложения
     const { pOnlineShowTab, pOnlineShowDocument, pOnlineShowDictionary, pOnlineUserProcedure, pOnlineUserReport } = useContext(ApplicationСtx);
@@ -67,6 +67,14 @@ const PrjJobs = () => {
     //Генерация содержимого
     return (
         <div>
+            <InlineMsg
+                variant={MSG_TYPE.WARN}
+                text="Просто сообщение, очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень очень длинное"
+                onOk={() => console.log("INLINE MESSAGE ON OK")}
+            />
+            <InlineMsgInfo text="Информация" onOk={() => console.log("INLINE INFO ON OK")} />
+            <InlineMsgWarn text="Предупреждение" onOk={() => console.log("INLINE WARN ON OK")} />
+            <InlineMsgErr text="Ошибка" onOk={() => console.log("INLINE ERR ON OK")} />
             <h1>Это панель работ!</h1>
             <br />
             <h2>Параметры: {isNavigationState() ? JSON.stringify(getNavigationState()) : "НЕ ПЕРЕДАНЫ"}</h2>