From b47fb2558dfaa4a1e7fbcd8d0867be5652f495dd Mon Sep 17 00:00:00 2001
From: Mikhail Chechnev <mim_@mail.ru>
Date: Mon, 27 May 2024 13:07:05 +0300
Subject: [PATCH] =?UTF-8?q?WEB=20APP:=20=D0=9F=D0=B0=D0=BD=D0=B5=D0=BB?=
 =?UTF-8?q?=D1=8C=20"=D0=9C=D0=BE=D0=BD=D0=B8=D1=82=D0=BE=D1=80=D0=B8?=
 =?UTF-8?q?=D0=BD=D0=B3=20=D1=81=D0=B1=D0=BE=D1=80=D0=BA=D0=B8=20=D0=B8?=
 =?UTF-8?q?=D0=B7=D0=B4=D0=B5=D0=BB=D0=B8=D0=B9"=20-=20=D0=B8=D0=BD=D0=B4?=
 =?UTF-8?q?=D0=B8=D0=B2=D0=B8=D0=B4=D1=83=D0=B0=D0=BB=D1=8C=D0=BD=D1=8B?=
 =?UTF-8?q?=D0=B5=20=D0=B8=D0=BD=D0=B4=D0=B8=D0=BA=D0=B0=D1=82=D0=BE=D1=80?=
 =?UTF-8?q?=D1=8B=20=D0=B7=D0=B0=D0=B3=D1=80=D1=83=D0=B7=D0=BA=D0=B8=20?=
 =?UTF-8?q?=D0=B4=D0=BB=D1=8F=20=D1=82=D0=B0=D0=B1=D0=BB=D0=B8=D1=86=20?=
 =?UTF-8?q?=D0=B4=D0=B5=D1=82=D0=B0=D0=BB=D0=B8=D0=B7=D0=B0=D1=86=D0=B8?=
 =?UTF-8?q?=D0=B8=20=D0=BC=D0=B0=D1=80=D1=88=D1=80=D1=83=D1=82=D0=B0=20?=
 =?UTF-8?q?=D0=B8=20=D0=BA=D0=BE=D0=BC=D0=BF=D0=BB=D0=B5=D0=BA=D1=82=D0=B0?=
 =?UTF-8?q?=D1=86=D0=B8=D0=B8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/plan_detail.js                   | 17 ++++++++++-------
 app/panels/mech_rec_assembly_mon/hooks.js       |  9 ++++++---
 2 files changed, 16 insertions(+), 10 deletions(-)

diff --git a/app/panels/mech_rec_assembly_mon/components/plan_detail.js b/app/panels/mech_rec_assembly_mon/components/plan_detail.js
index 9a9c47a..05d9df5 100644
--- a/app/panels/mech_rec_assembly_mon/components/plan_detail.js
+++ b/app/panels/mech_rec_assembly_mon/components/plan_detail.js
@@ -9,7 +9,7 @@
 
 import React, { useEffect, useState } from "react"; //Классы React
 import PropTypes from "prop-types"; //Контроль свойств компонента
-import { Box, Grid, Container, Button, Typography, Icon, Stack, IconButton } from "@mui/material"; //Интерфейсные элементы
+import { Box, Grid, Container, Button, Typography, Icon, Stack, IconButton, CircularProgress } from "@mui/material"; //Интерфейсные элементы
 import { P8PDataGrid, P8P_DATA_GRID_SIZE } from "../../../components/p8p_data_grid"; //Таблица данных
 import { P8PSVG } from "../../../components/p8p_svg"; //Интерактивные изображения
 import { P8P_DATA_GRID_CONFIG_PROPS } from "../../../config_wrapper"; //Подключение компонентов к настройкам приложения
@@ -69,7 +69,7 @@ const STYLES = {
         width: "280px",
         borderBottom: "1px solid"
     },
-    TABLE_DETAILS: { height: "230px" },
+    TABLE_DETAILS: { height: "240px" },
     TABLE_DETAILS_HEADER_CELL: maxWidth => ({
         padding: "2px 2px",
         fontSize: "11px",
@@ -78,7 +78,7 @@ const STYLES = {
         ...(maxWidth ? { maxWidth } : {})
     }),
     TABLE_DETAILS_DATA_CELL: textAlign => ({ padding: "2px 2px", fontSize: "11px", ...(textAlign ? { textAlign } : {}) }),
-    TABLE_DETAILS_MORE_BUTTON: { borderRadius: "25px" },
+    TABLE_DETAILS_MORE_BUTTON: { borderRadius: "25px", height: "20px" },
     CARD_DETAILS_CONTAINER: { minWidth: "1200px", maxWidth: "1400px" },
     CARD_DETAILS_NAVIGATION_STACK: { width: "100%" }
 };
@@ -196,11 +196,14 @@ const ProductDetailsTable = ({ plan, product, stored, noProductMessage, noDataFo
                 <Typography variant="UDO_body2">{noProductMessage}</Typography>
             ) : (
                 <>
-                    <Typography variant="h4">
-                        <b>{title}</b>
-                    </Typography>
+                    <Stack direction="row" spacing={2} justifyContent="center" alignItems="center">
+                        <CircularProgress size={18} sx={{ opacity: isLoading ? 1 : 0 }} />
+                        <Typography variant="h4">
+                            <b>{title}</b>
+                        </Typography>
+                    </Stack>
                     <P8PDataGrid
-                        {...{ ...P8P_DATA_GRID_CONFIG_PROPS, noDataFoundText: isLoading ? "" : noDataFoundMessage }}
+                        {...{ ...P8P_DATA_GRID_CONFIG_PROPS, noDataFoundText: isLoading || !data.init ? "" : noDataFoundMessage }}
                         containerComponentProps={{ sx: STYLES.TABLE_DETAILS, elevation: 0 }}
                         columnsDef={data.columnsDef}
                         rows={data.rows}
diff --git a/app/panels/mech_rec_assembly_mon/hooks.js b/app/panels/mech_rec_assembly_mon/hooks.js
index de1c9a1..03dc372 100644
--- a/app/panels/mech_rec_assembly_mon/hooks.js
+++ b/app/panels/mech_rec_assembly_mon/hooks.js
@@ -163,10 +163,11 @@ const useCostProductComposition = plan => {
 //Хук для таблицы детализации изделия
 const useProductDetailsTable = (plan, product, orders, pageNumber, stored) => {
     //Собственное состояние - флаг загрузки
-    const [isLoading, setLoading] = useState(true);
+    const [isLoading, setLoading] = useState(false);
 
     //Собственное состояние - таблица данных
     const [data, setData] = useState({
+        init: false,
         columnsDef: [],
         rows: [],
         morePages: true
@@ -190,13 +191,15 @@ const useProductDetailsTable = (plan, product, orders, pageNumber, stored) => {
                         NPAGE_SIZE: DATA_GRID_PAGE_SIZE,
                         NINCLUDE_DEF: pageNumber == 1 ? 1 : 0
                     },
-                    respArg: "COUT"
+                    respArg: "COUT",
+                    loader: false
                 });
                 setData(pv => ({
                     ...pv,
                     columnsDef: data.XCOLUMNS_DEF ? [...data.XCOLUMNS_DEF] : pv.columnsDef,
                     rows: pageNumber == 1 ? [...(data.XROWS || [])] : [...pv.rows, ...(data.XROWS || [])],
-                    morePages: DATA_GRID_PAGE_SIZE == 0 ? false : (data.XROWS || []).length >= DATA_GRID_PAGE_SIZE
+                    morePages: DATA_GRID_PAGE_SIZE == 0 ? false : (data.XROWS || []).length >= DATA_GRID_PAGE_SIZE,
+                    init: true
                 }));
             } finally {
                 setLoading(false);