From f4c665a74bb73d08c31818fc0f86c286a12a91b9 Mon Sep 17 00:00:00 2001 From: Mikhail Chechnev Date: Wed, 11 Jun 2025 21:51:41 +0300 Subject: [PATCH] =?UTF-8?q?WEBAPP:=20=D0=A2=D0=B8=D0=BF=D0=BE=D0=B2=D1=8B?= =?UTF-8?q?=D0=B5=20=D1=81=D0=BE=D1=81=D1=82=D0=BE=D1=8F=D0=BD=D0=B8=D1=8F?= =?UTF-8?q?=20=D0=B8=20=D1=86=D0=B2=D0=B5=D1=82=D0=B0=20=D0=B4=D0=BB=D1=8F?= =?UTF-8?q?=20=D1=81=D0=BE=D1=81=D1=82=D0=BE=D1=8F=D0=BD=D0=B8=D0=B9=20?= =?UTF-8?q?=D0=B2=20app.*.js,=20=D1=82=D0=B8=D0=BF=D0=BE=D0=B2=D0=BE=D0=B9?= =?UTF-8?q?=20=D0=B4=D0=B8=D0=B0=D0=BB=D0=BE=D0=B3=20=D0=BF=D0=BE=D0=B4?= =?UTF-8?q?=D1=81=D0=BA=D0=B0=D0=B7=D0=BA=D0=B8=20P8PHintDialog?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- app.styles.js | 39 ++++++++++++++ app.text.js | 12 ++++- app/components/p8p_app_message.js | 84 ++++++++++++++++++++----------- 3 files changed, 105 insertions(+), 30 deletions(-) diff --git a/app.styles.js b/app.styles.js index 9627d6b..ce9318e 100644 --- a/app.styles.js +++ b/app.styles.js @@ -3,10 +3,49 @@ Типовые стили */ +//--------------------- +//Подключение библиотек +//--------------------- + +import { STATE } from "./app.text"; //Текстовые ресурсы и константы +import { red, green, orange, grey } from "@mui/material/colors"; + //---------------- //Интерфейс модуля //---------------- +//Цвета +export const APP_COLORS = { + [STATE.UNDEFINED]: { + color: "#dcdcdca0", + contrColor: "black" + }, + [STATE.INFO]: { + color: "white", + contrColor: "black" + }, + [STATE.OK]: { + color: green[200], + contrColor: green[900] + }, + [STATE.ERR]: { + color: red[200], + contrColor: red[900] + }, + [STATE.WARN]: { + color: orange[200], + contrColor: orange[900] + }, + HOVER: { + color: grey[200], + contrColor: grey[900] + }, + ACTIVE: { + color: grey[400], + contrColor: grey[900] + } +}; + //Стили export const APP_STYLES = { SCROLL: { diff --git a/app.text.js b/app.text.js index ce5a66c..57dd8c0 100644 --- a/app.text.js +++ b/app.text.js @@ -18,7 +18,8 @@ export const TITLES = { //Текст export const TEXTS = { LOADING: "Ожидайте...", //Ожидание завершения процесса - NO_DATA_FOUND: "Данных не найдено" //Отсутствие данных + NO_DATA_FOUND: "Данных не найдено", //Отсутствие данных + NO_DATA_FOUND_SHORT: "Н.Д." //Отсутствие данных (кратко) }; //Текст кнопок @@ -65,3 +66,12 @@ export const ERRORS = { export const ERRORS_HTTP = { 404: "Адрес не найден" }; + +//Типовые статусы +export const STATE = { + UNDEFINED: "UNDEFINED", + INFO: "INFORMATION", + OK: "OK", + ERR: "ERR", + WARN: "WARN" +}; diff --git a/app/components/p8p_app_message.js b/app/components/p8p_app_message.js index c58acb1..08a6520 100644 --- a/app/components/p8p_app_message.js +++ b/app/components/p8p_app_message.js @@ -18,6 +18,8 @@ import Typography from "@mui/material/Typography"; //Текст import Button from "@mui/material/Button"; //Кнопки import Container from "@mui/material/Container"; //Контейнер import Box from "@mui/material/Box"; //Обёртка +import { BUTTONS, STATE } from "../../app.text"; //Типовые текстовые ресурсы и константы +import { APP_COLORS } from "../../app.styles"; //Типовые стили //--------- //Константы @@ -25,9 +27,9 @@ import Box from "@mui/material/Box"; //Обёртка //Варианты исполнения const P8P_APP_MESSAGE_VARIANT = { - INFO: "information", - WARN: "warning", - ERR: "error" + INFO: STATE.INFO, + WARN: STATE.WARN, + ERR: STATE.ERR }; //Стили @@ -36,28 +38,35 @@ const STYLES = { wordBreak: "break-word" }, INFO: { - titleText: {}, - bodyText: {} + titleText: { + color: APP_COLORS[STATE.INFO].contrColor + }, + bodyText: { + color: APP_COLORS[STATE.INFO].contrColor + } }, WARN: { titleText: { - color: "orange" + color: APP_COLORS[STATE.WARN].contrColor }, bodyText: { - color: "orange" + color: APP_COLORS[STATE.WARN].contrColor } }, ERR: { titleText: { - color: "red" + color: APP_COLORS[STATE.ERR].contrColor }, bodyText: { - color: "red" + color: APP_COLORS[STATE.ERR].contrColor } }, INLINE_MESSAGE: { with: "100%", textAlign: "center" + }, + FULL_ERROR_TEXT_BUTTON: { + color: APP_COLORS[STATE.WARN].contrColor } }; @@ -104,12 +113,7 @@ const P8PAppMessage = ({ //Заголовок let titlePart; - if (title && titleText) - titlePart = ( - - {titleText} - - ); + if (title && titleText) titlePart = {titleText}; //Кнопка Отмена let cancelBtnPart; @@ -120,7 +124,7 @@ const P8PAppMessage = ({ let okBtnPart; if (okBtn && okBtnCaption) okBtnPart = ( - ); @@ -129,7 +133,7 @@ const P8PAppMessage = ({ let fullErrorTextBtn; if (fullErrorText && showErrMoreCaption && hideErrMoreCaption && variant === P8P_APP_MESSAGE_VARIANT.ERR) fullErrorTextBtn = ( - ); @@ -147,17 +151,10 @@ const P8PAppMessage = ({ //Генерация содержимого return ( - (onCancel ? onCancel() : null)} - > + (onCancel ? onCancel() : null)}> {titlePart} - - {!showFullErrorText ? text : fullErrorText} - + {!showFullErrorText ? text : fullErrorText} {actionsPart} @@ -189,13 +186,19 @@ const P8PAppInlineMessage = ({ variant, text, okBtn, onOk, okBtnCaption }) => { {text} {okBtn && okBtnCaption ? ( - @@ -247,6 +250,28 @@ const P8PAppInlineWarn = props => buildVariantInlineMessage(props, P8P_APP_MESSA //Встраиваемое сообщение информации const P8PAppInlineInfo = props => buildVariantInlineMessage(props, P8P_APP_MESSAGE_VARIANT.INFO); +//Диалог подсказки +const P8PHintDialog = ({ title, hint, onOk }) => { + return ( + (onOk ? onOk() : null)}> + {title} + +
+ + + + + + ); +}; + +//Контроль свойств - Диалог подсказки +P8PHintDialog.propTypes = { + title: PropTypes.string.isRequired, + hint: PropTypes.string.isRequired, + onOk: PropTypes.func +}; + //---------------- //Интерфейс модуля //---------------- @@ -260,5 +285,6 @@ export { P8PAppInlineMessage, P8PAppInlineError, P8PAppInlineWarn, - P8PAppInlineInfo + P8PAppInlineInfo, + P8PHintDialog };