ЦИТК-826, ЦИТК-827, ЦИТК-828, ЦИТК-852 - Общее изменение панелей ПУДП

This commit is contained in:
Dollerino 2024-07-10 15:41:09 +03:00
parent 8d12d71cad
commit 745c3a3983
21 changed files with 3433 additions and 2498 deletions

View File

@ -25,7 +25,8 @@ const STYLES = {
BOX_INFO_MAIN: {
border: "1px solid",
borderRadius: "25px",
height: "35vh"
height: "35vh",
backgroundColor: "background.detail_table"
},
BOX_INFO_SUB: isMessage => ({
overflow: "hidden",
@ -45,7 +46,8 @@ const STYLES = {
alignItems: "center",
border: "1px solid",
borderRadius: "25px",
height: "17vh"
height: "17vh",
backgroundColor: "background.detail_info"
},
PRODUCT_SELECTOR_CONTAINER: {
display: "flex",
@ -55,7 +57,8 @@ const STYLES = {
border: "1px solid",
borderRadius: "25px",
height: "53vh",
marginTop: "16px"
marginTop: "16px",
backgroundColor: "background.product_selector"
},
PRODUCT_SELECTOR_MODEL: { width: "70%" },
PLAN_INFO_MAIN: {
@ -69,45 +72,55 @@ const STYLES = {
width: "280px",
borderBottom: "1px solid"
},
TABLE_DETAILS: { height: "240px" },
TABLE_DETAILS: { backgroundColor: "background.detail_table", height: "240px" },
TABLE_DETAILS_HEADER_CELL: maxWidth => ({
backgroundColor: "background.detail_table",
color: "text.detail_table.fontColor",
padding: "2px 2px",
fontSize: "11px",
textAlign: "center",
lineHeight: "1rem",
...(maxWidth ? { maxWidth } : {})
}),
TABLE_DETAILS_DATA_CELL: textAlign => ({ padding: "2px 2px", fontSize: "11px", ...(textAlign ? { textAlign } : {}) }),
TABLE_DETAILS_MORE_BUTTON: { borderRadius: "25px", height: "20px" },
TABLE_DETAILS_DATA_CELL: textAlign => ({
backgroundColor: "background.detail_table",
color: "text.detail_table.fontColor",
padding: "2px 2px",
fontSize: "11px",
...(textAlign ? { textAlign } : {})
}),
TABLE_DETAILS_MORE_BUTTON: { borderRadius: "25px", height: "20px", color: "text.more_button.fontColor" },
TABLE_DETAILS_TEXT: { color: "text.detail_table.fontColor" },
CARD_DETAILS_CONTAINER: { minWidth: "1200px", maxWidth: "1400px" },
CARD_DETAILS_NAVIGATION_STACK: { width: "100%" }
CARD_DETAILS_NAVIGATION_STACK: { width: "100%" },
NAVIGATE_BUTTONS: { color: "text.title.fontColor" }
};
//------------------------------------
//Вспомогательные функции и компоненты
//------------------------------------
//Информация о плане
const PlanInfo = ({ plan }) => {
//Информация о выпуске плана
const PlanSpecInfo = ({ planSpec }) => {
return (
<>
<Box sx={STYLES.PLAN_INFO_MAIN}>
<Box sx={STYLES.PLAN_INFO_SUB}>
<Typography variant="UDO_body1" mt={1}>
<Typography variant="PlanSpecInfo" mt={1}>
Номер борта:
</Typography>
<Typography variant="subtitle2">{plan.SNUMB}</Typography>
<Typography variant="subtitle2">{planSpec.SNUMB}</Typography>
</Box>
<Box sx={STYLES.PLAN_INFO_SUB}>
<Typography variant="UDO_body1" mt={1}>
<Typography variant="PlanSpecInfo" mt={1}>
Год выпуска:
</Typography>
<Typography variant="subtitle2">{plan.NYEAR}</Typography>
<Typography variant="subtitle2">{planSpec.NYEAR}</Typography>
</Box>
</Box>
<ProgressBox
progress={plan.NPROGRESS}
detail={plan.SDETAIL}
progress={planSpec.NPROGRESS}
detail={planSpec.SDETAIL}
width={"110px"}
height={"110px"}
progressVariant={"subtitle2"}
@ -117,13 +130,13 @@ const PlanInfo = ({ plan }) => {
);
};
//Контроль свойств - Информация о плане
PlanInfo.propTypes = {
plan: PropTypes.object
//Контроль свойств - Информация о спецификации плана
PlanSpecInfo.propTypes = {
planSpec: PropTypes.object
};
//Модель выпуска плана
const PlanProductCompositionModel = ({ model, products, onProductSelect }) => {
const PlanSpecProductCompositionModel = ({ model, products, onProductSelect }) => {
//При выборе детали на модели
const handleProductClick = ({ item }) => {
const product = products.find(p => p.SMODEL_ID == item.id);
@ -150,7 +163,7 @@ const PlanProductCompositionModel = ({ model, products, onProductSelect }) => {
};
//Контроль свойств - Модель выпуска плана
PlanProductCompositionModel.propTypes = {
PlanSpecProductCompositionModel.propTypes = {
model: PropTypes.any,
products: PropTypes.array,
onProductSelect: PropTypes.func
@ -171,12 +184,12 @@ const dataCellRender = ({ row, columnDef }) => ({
});
//Таблица детализации изделия
const ProductDetailsTable = ({ plan, product, stored, noProductMessage, noDataFoundMessage, title }) => {
const ProductDetailsTable = ({ planSpec, product, stored, noProductMessage, noPlanSpecMessage, noDataFoundMessage, title }) => {
//Собственное состояние
const [state, setState] = useState({ plan: null, product: null, orders: null, pageNumber: 1 });
const [state, setState] = useState({ planSpec: null, product: null, orders: null, pageNumber: 1 });
//Собственное состояние - данные таблицы
const { data, isLoading } = useProductDetailsTable(state.plan, state.product, state.orders, state.pageNumber, stored);
const { data, isLoading } = useProductDetailsTable(state.planSpec, state.product, state.orders, state.pageNumber, stored);
//При изменении состояния сортировки
const handleOrderChanged = ({ orders }) => setState(pv => ({ ...pv, orders: [...orders], pageNumber: 1 }));
@ -186,19 +199,25 @@ const ProductDetailsTable = ({ plan, product, stored, noProductMessage, noDataFo
//При изменении изделия
useEffect(() => {
setState(pv => ({ ...pv, plan, product, orders: null, pageNumber: 1 }));
}, [product, plan]);
setState(pv => ({ ...pv, planSpec, product, orders: null, pageNumber: 1 }));
}, [product, planSpec]);
//Генерация содержимого
return (
<Box sx={STYLES.BOX_INFO_SUB(!product || data.rows.length === 0)}>
{!product ? (
<Typography variant="UDO_body2">{noProductMessage}</Typography>
<Typography variant="ProductDetailMessage" sx={STYLES.TABLE_DETAILS_TEXT}>
{noProductMessage}
</Typography>
) : !planSpec ? (
<Typography variant="ProductDetailMessage" sx={STYLES.TABLE_DETAILS_TEXT}>
{noPlanSpecMessage}
</Typography>
) : (
<>
<Stack direction="row" spacing={2} justifyContent="center" alignItems="center">
<CircularProgress size={18} sx={{ opacity: isLoading ? 1 : 0 }} />
<Typography variant="h4">
<Typography variant="h4" sx={STYLES.TABLE_DETAILS_TEXT}>
<b>{title}</b>
</Typography>
</Stack>
@ -225,10 +244,11 @@ const ProductDetailsTable = ({ plan, product, stored, noProductMessage, noDataFo
//Контроль свойств - Таблица детализации изделия
ProductDetailsTable.propTypes = {
plan: PropTypes.number.isRequired,
planSpec: PropTypes.number,
product: PropTypes.number,
stored: PropTypes.string.isRequired,
noProductMessage: PropTypes.string.isRequired,
noPlanSpecMessage: PropTypes.string.isRequired,
noDataFoundMessage: PropTypes.string.isRequired,
title: PropTypes.string.isRequired
};
@ -238,9 +258,9 @@ ProductDetailsTable.propTypes = {
//-----------
//Детализация по объекту
const PlanDetail = ({ plan, disableNavigatePrev = false, disableNavigateNext = false, onNavigate, onBack }) => {
const PlanSpecDetail = ({ planSpec, disableNavigatePrev = false, disableNavigateNext = false, onNavigate, onBack }) => {
//Собственное состояние - данные производственных составов SVG
const [costProductComposition, setCostProductComposition] = useCostProductComposition(plan.NRN);
const [costProductComposition, setCostProductComposition] = useCostProductComposition(planSpec.NRN);
//Выбор элемента изделия
const setProduct = product => {
@ -260,14 +280,14 @@ const PlanDetail = ({ plan, disableNavigatePrev = false, disableNavigateNext = f
<Grid item display="flex" justifyContent="center" xs={1}>
<Stack display="flex" direction="row" justifyContent="flex-end" alignItems="center" sx={STYLES.CARD_DETAILS_NAVIGATION_STACK}>
<IconButton disabled={disableNavigatePrev} onClick={() => handleNavigate(-1)}>
<Icon>navigate_before</Icon>
<Icon sx={STYLES.NAVIGATE_BUTTONS}>navigate_before</Icon>
</IconButton>
</Stack>
</Grid>
<Grid item xs={10}>
<Container maxWidth={false}>
<Button onClick={() => (onBack ? onBack() : null)}>
<Stack direction="row">
<Stack direction="row" color="text.title.fontColor">
<Icon>chevron_left</Icon>Назад
</Stack>
</Button>
@ -276,31 +296,33 @@ const PlanDetail = ({ plan, disableNavigatePrev = false, disableNavigateNext = f
<Grid item xs={5}>
<Box sx={STYLES.BOX_INFO_MAIN}>
<ProductDetailsTable
plan={plan.NRN}
planSpec={costProductComposition.selectedProduct?.NFCPRODPLANSP_LINK}
product={costProductComposition.selectedProduct?.NRN}
stored={"PKG_P8PANELS_MECHREC.FCROUTLST_DG_BY_PRDCMPSP_GET"}
stored={"PKG_P8PANELS_MECHREC.FCROUTLST_DG_BY_LINKED_GET"}
noProductMessage={"Укажите элемент модели, чтобы увидеть информацию о маршрутных картах"}
noPlanSpecMessage={"Не определена связанная запись производственной программы"}
noDataFoundMessage={"Маршрутные карты не найдены"}
title={"Маршрутные карты"}
/>
</Box>
<Box sx={STYLES.BOX_INFO_MAIN} mt={2}>
<ProductDetailsTable
plan={plan.NRN}
planSpec={costProductComposition.selectedProduct?.NFCPRODPLANSP_LINK}
product={costProductComposition.selectedProduct?.NRN}
stored={"PKG_P8PANELS_MECHREC.FCDELIVSH_DG_BY_PRDCMPSP_GET"}
stored={"PKG_P8PANELS_MECHREC.FCDELIVSH_DG_BY_LINKED_GET"}
noProductMessage={"Укажите элемент модели, чтобы увидеть информацию о комплектовочных ведомостях"}
noPlanSpecMessage={"Не определена связанная запись производственной программы"}
noDataFoundMessage={"Комплектовочные ведомости не найдены"}
title={"Дефицит комплектации"}
title={"Дефицит комплектующих"}
/>
</Box>
</Grid>
<Grid item xs={7}>
<Box sx={STYLES.DETAIL_INFO}>
<PlanInfo plan={plan} />
<PlanSpecInfo planSpec={planSpec} />
</Box>
<Box sx={STYLES.PRODUCT_SELECTOR_CONTAINER}>
<PlanProductCompositionModel
<PlanSpecProductCompositionModel
model={costProductComposition.model}
products={costProductComposition.products}
onProductSelect={setProduct}
@ -313,7 +335,7 @@ const PlanDetail = ({ plan, disableNavigatePrev = false, disableNavigateNext = f
<Grid item display="flex" justifyContent="center" xs={1}>
<Stack display="flex" direction="row" justifyContent="flex-start" alignItems="center" sx={STYLES.CARD_DETAILS_NAVIGATION_STACK}>
<IconButton disabled={disableNavigateNext} onClick={() => handleNavigate(1)}>
<Icon>navigate_next</Icon>
<Icon sx={STYLES.NAVIGATE_BUTTONS}>navigate_next</Icon>
</IconButton>
</Stack>
</Grid>
@ -323,8 +345,8 @@ const PlanDetail = ({ plan, disableNavigatePrev = false, disableNavigateNext = f
};
//Контроль свойств - Детализация по объекту
PlanDetail.propTypes = {
plan: PropTypes.object,
PlanSpecDetail.propTypes = {
planSpec: PropTypes.object,
disableNavigatePrev: PropTypes.bool,
disableNavigateNext: PropTypes.bool,
onNavigate: PropTypes.func,
@ -335,4 +357,4 @@ PlanDetail.propTypes = {
//Интерфейс модуля
//----------------
export { PlanDetail };
export { PlanSpecDetail };

View File

@ -1,6 +1,6 @@
/*
Парус 8 - Панели мониторинга - ПУП - Мониторинг сборки изделий
Компонент: Список планов
Компонент: Список выпусков планов
*/
//---------------------
@ -10,7 +10,7 @@
import React, { useState } from "react"; //Классы React
import { Container, Grid, IconButton, Icon } from "@mui/material"; //Интерфейсные элементы
import PropTypes from "prop-types"; //Контроль свойств компонента
import { PlansListItem } from "./plans_list_item"; //Элемент списка планов
import { PlanSpecsListItem } from "./plans_list_item"; //Элемент списка выпусков планов
//---------
//Константы
@ -21,23 +21,24 @@ const DEFAULT_PAGE_SIZE = 5;
//Стили
const STYLES = {
PLAN_DOCUMENTS_LIST: { minWidth: "1024px" }
PLAN_DOCUMENTS_LIST: { minWidth: "1024px" },
NAVIGATE_BUTTONS: { color: "text.title.fontColor" }
};
//-----------
//Тело модуля
//-----------
//Список планов
const PlansList = ({ plans, pageSize = DEFAULT_PAGE_SIZE, onItemClick }) => {
//Список выпусков планов
const PlanSpecsList = ({ planSpecs, pageSize = DEFAULT_PAGE_SIZE, onItemClick }) => {
//Состояние прокрутки списка отображаемых планов
const [scroll, setScroll] = useState(0);
//Отработка нажатия на прокрутку списка планов влево
//Отработка нажатия на прокрутку списка выпусков планов влево
const handleScrollLeft = () => setScroll(pv => (pv <= 1 ? 0 : pv - 1));
//Отработка нажатия на прокрутку списка планов вправо
const handleScrollRight = () => setScroll(pv => (pv + pageSize >= plans.length ? pv : pv + 1));
//Отработка нажатия на прокрутку списка выпусков планов вправо
const handleScrollRight = () => setScroll(pv => (pv + pageSize >= planSpecs.length ? pv : pv + 1));
//Сборка представления
return (
@ -45,13 +46,13 @@ const PlansList = ({ plans, pageSize = DEFAULT_PAGE_SIZE, onItemClick }) => {
<Grid container direction="row" justifyContent="center" alignItems="center" spacing={2} sx={STYLES.PLAN_DOCUMENTS_LIST}>
<Grid item display="flex" justifyContent="center" xs={1}>
<IconButton onClick={handleScrollLeft} disabled={scroll <= 0}>
<Icon>navigate_before</Icon>
<Icon sx={STYLES.NAVIGATE_BUTTONS}>navigate_before</Icon>
</IconButton>
</Grid>
{plans.map((el, i) =>
{planSpecs.map((el, i) =>
i >= scroll && i < scroll + pageSize ? (
<Grid item key={`${el.NRN}_${i}`} xs={2}>
<PlansListItem
<PlanSpecsListItem
card={el}
cardIndex={i}
onClick={(card, cardIndex) => (onItemClick ? onItemClick(card, cardIndex) : null)}
@ -60,8 +61,8 @@ const PlansList = ({ plans, pageSize = DEFAULT_PAGE_SIZE, onItemClick }) => {
) : null
)}
<Grid item display="flex" justifyContent="center" xs={1}>
<IconButton onClick={handleScrollRight} disabled={scroll + pageSize >= plans.length}>
<Icon>navigate_next</Icon>
<IconButton onClick={handleScrollRight} disabled={scroll + pageSize >= planSpecs.length}>
<Icon sx={STYLES.NAVIGATE_BUTTONS}>navigate_next</Icon>
</IconButton>
</Grid>
</Grid>
@ -69,9 +70,9 @@ const PlansList = ({ plans, pageSize = DEFAULT_PAGE_SIZE, onItemClick }) => {
);
};
//Контроль свойств - Список планов
PlansList.propTypes = {
plans: PropTypes.arrayOf(PropTypes.object),
//Контроль свойств - Список выпусков планов
PlanSpecsList.propTypes = {
planSpecs: PropTypes.arrayOf(PropTypes.object),
pageSize: PropTypes.number,
onItemClick: PropTypes.func
};
@ -80,4 +81,4 @@ PlansList.propTypes = {
//Интерфейс модуля
//----------------
export { PlansList };
export { PlanSpecsList };

View File

@ -1,6 +1,6 @@
/*
Парус 8 - Панели мониторинга - ПУП - Мониторинг сборки изделий
Компонент: Элемент списка планов
Компонент: Элемент списка выпусков планов
*/
//---------------------
@ -26,8 +26,10 @@ const STYLES = {
gap: "24px",
border: "1px solid",
borderRadius: "25px",
cursor: "pointer"
cursor: "pointer",
backgroundColor: "background.secondary"
},
TEXT_INFO_FIELD: { color: "text.secondary.fontColor" },
IMAGE_BOX: { width: "180px", height: "180px", alignItems: "center", justifyContent: "center", display: "flex" },
IMAGE_LIST_ITEM: { textAlign: "center" },
IMAGE_IMG: { width: "160px" }
@ -38,7 +40,7 @@ const STYLES = {
//------------------------------------
//Изображение для элемента
const PlansListItemImage = ({ card }) => {
const PlanSpecsListItemImage = ({ card }) => {
return (
<Box sx={STYLES.IMAGE_BOX}>
<ImageList variant="masonry" cols={1} gap={8}>
@ -55,7 +57,7 @@ const PlansListItemImage = ({ card }) => {
};
//Контроль свойств - Изображение для элемента
PlansListItemImage.propTypes = {
PlanSpecsListItemImage.propTypes = {
card: PropTypes.object
};
@ -63,13 +65,13 @@ PlansListItemImage.propTypes = {
//Тело модуля
//-----------
//Элемент списка планов
const PlansListItem = ({ card, cardIndex, onClick }) => {
//Элемент списка выпусков планов
const PlanSpecsListItem = ({ card, cardIndex, onClick }) => {
return (
<Box sx={STYLES.CONTAINER} onClick={() => (onClick ? onClick(card, cardIndex) : null)}>
<PlansListItemImage card={card} />
<PlanSpecsListItemImage card={card} />
<Box textAlign="center">
<Typography variant="UDO_body1" color="text.secondary.fontColor">
<Typography variant="PlanSpecInfo" sx={STYLES.TEXT_INFO_FIELD}>
Номер борта
</Typography>
<Typography variant="h2">{card.SNUMB}</Typography>
@ -80,10 +82,10 @@ const PlansListItem = ({ card, cardIndex, onClick }) => {
width={"155px"}
height={"155px"}
progressVariant={"h3"}
detailVariant={"UDO_body2"}
detailVariant={"PlanSpecProgressDetail"}
/>
<Box>
<Typography variant="UDO_body1" color="text.secondary.fontColor">
<Typography variant="PlanSpecInfo" sx={STYLES.TEXT_INFO_FIELD}>
Год выпуска:
</Typography>
<Typography variant="subtitle1" mt={-1}>
@ -94,8 +96,8 @@ const PlansListItem = ({ card, cardIndex, onClick }) => {
);
};
//Контроль свойств - Элемент списка планов
PlansListItem.propTypes = {
//Контроль свойств - Элемент списка выпусков планов
PlanSpecsListItem.propTypes = {
card: PropTypes.object,
cardIndex: PropTypes.number,
onClick: PropTypes.func
@ -105,4 +107,4 @@ PlansListItem.propTypes = {
//Интерфейс модуля
//----------------
export { PlansListItem };
export { PlanSpecsListItem };

View File

@ -24,6 +24,7 @@ const STYLES = {
flexDirection: "column",
margin: "0px 32px",
borderRadius: "50%",
backgroundColor: "background.progress",
...(width ? { width } : {}),
...(height ? { height } : {})
})

View File

@ -16,7 +16,7 @@ import { object2Base64XML } from "../../core/utils"; //Вспомогатель
//---------
//Размер страницы данных
const DATA_GRID_PAGE_SIZE = 50;
const DATA_GRID_PAGE_SIZE = 5;
//-----------
//Тело модуля
@ -44,9 +44,9 @@ const useMechRecAssemblyMon = () => {
planCtlgs: [],
planCtlgsLoaded: false,
selectedPlanCtlg: {},
plans: [],
plansLoaded: false,
selectedPlan: {}
planSpecs: [],
planSpecsLoaded: false,
selectedPlanSpec: {}
});
//Подключение к контексту взаимодействия с сервером
@ -76,7 +76,7 @@ const useMechRecAssemblyMon = () => {
respArg: "COUT",
isArray: name => name === "XFCPRODPLAN_INFO"
});
setState(pv => ({ ...pv, init: true, plans: [...(data?.XFCPRODPLAN_INFO || [])], plansLoaded: true }));
setState(pv => ({ ...pv, init: true, planSpecs: [...(data?.XFCPRODPLAN_INFO || [])], planSpecsLoaded: true }));
}
// eslint-disable-next-line react-hooks/exhaustive-deps
},
@ -88,7 +88,7 @@ const useMechRecAssemblyMon = () => {
setState(pv => ({
...pv,
selectedPlanCtlg: { ...planCtlg },
selectedPlan: {},
selectedPlanSpec: {},
showPlanList: false
}));
};
@ -98,7 +98,7 @@ const useMechRecAssemblyMon = () => {
setState(pv => ({
...pv,
selectedPlanCtlg: {},
selectedPlan: {},
selectedPlanSpec: {},
showPlanList: false
}));
@ -114,7 +114,7 @@ const useMechRecAssemblyMon = () => {
if (state.selectedPlanCtlg) {
loadPlans(state.selectedPlanCtlg.NRN);
} else {
setState(pv => ({ ...pv, plans: [], plansLoaded: false }));
setState(pv => ({ ...pv, planSpecs: [], planSpecsLoaded: false }));
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [state.selectedPlanCtlg]);
@ -123,7 +123,7 @@ const useMechRecAssemblyMon = () => {
};
//Хук для информации по производственным составам
const useCostProductComposition = plan => {
const useCostProductComposition = planSpec => {
//Собственное состояние
let [costProductComposition, setCostProductComposition] = useState({
showPlanList: false,
@ -141,7 +141,7 @@ const useCostProductComposition = plan => {
const loadData = async () => {
const data = await executeStored({
stored: "PKG_P8PANELS_MECHREC.FCPRODCMP_DETAILS_GET",
args: { NFCPRODPLAN: plan },
args: { NFCPRODPLANSP: planSpec },
respArg: "COUT",
isArray: name => name === "XFCPRODCMP"
});
@ -153,15 +153,15 @@ const useCostProductComposition = plan => {
selectedProduct: null
}));
};
if (plan) loadData();
}, [plan, executeStored]);
if (planSpec) loadData();
}, [planSpec, executeStored]);
//Вернём данные
return [costProductComposition, setCostProductComposition];
};
//Хук для таблицы детализации изделия
const useProductDetailsTable = (plan, product, orders, pageNumber, stored) => {
const useProductDetailsTable = (planSpec, product, orders, pageNumber, stored) => {
//Собственное состояние - флаг загрузки
const [isLoading, setLoading] = useState(false);
@ -184,8 +184,7 @@ const useProductDetailsTable = (plan, product, orders, pageNumber, stored) => {
const data = await executeStored({
stored,
args: {
NPRODCMPSP: product,
NFCPRODPLAN: plan,
NFCPRODPLANSP: planSpec,
CORDERS: { VALUE: object2Base64XML(orders, { arrayNodeName: "orders" }), SDATA_TYPE: SERV_DATA_TYPE_CLOB },
NPAGE_NUMBER: pageNumber,
NPAGE_SIZE: DATA_GRID_PAGE_SIZE,
@ -205,8 +204,8 @@ const useProductDetailsTable = (plan, product, orders, pageNumber, stored) => {
setLoading(false);
}
};
if (plan && product) loadData();
}, [plan, product, orders, pageNumber, stored, executeStored, SERV_DATA_TYPE_CLOB]);
if (planSpec && product) loadData();
}, [planSpec, product, orders, pageNumber, stored, executeStored, SERV_DATA_TYPE_CLOB]);
//Вернём данные
return { data, isLoading };

View File

@ -7,14 +7,29 @@
//Подключение библиотек
//---------------------
import React, { useState, useContext } from "react"; //Классы React
import React, { useState } from "react"; //Классы React
import PropTypes from "prop-types"; //Контроль свойств компонента
import { Drawer, Fab, Box, List, ListItemButton, ListItemText, Typography, TextField, FormGroup, FormControlLabel, Checkbox } from "@mui/material"; //Интерфейсные элементы
import {
Drawer,
Fab,
Box,
List,
ListItemButton,
ListItemText,
Typography,
TextField,
FormGroup,
FormControlLabel,
Checkbox,
Container,
IconButton,
Stack,
Icon
} from "@mui/material"; //Интерфейсные элементы
import { ThemeProvider } from "@mui/material/styles"; //Подключение темы
import { MessagingСtx } from "../../context/messaging"; //Контекст сообщений
import { PlansList } from "./components/plans_list"; //Список планов
import { PlanDetail } from "./components/plan_detail"; //Детали плана
import { theme } from "./styles/themes"; //Стиль темы
import { PlanSpecsList } from "./components/plans_list"; //Список планов
import { PlanSpecDetail } from "./components/plan_detail"; //Детали плана
import { lightTheme, darkTheme } from "./styles/themes"; //Стиль темы
import { useMechRecAssemblyMon, useFilteredPlanCtlgs } from "./hooks"; //Вспомогательные хуки
//---------
@ -23,9 +38,19 @@ import { useMechRecAssemblyMon, useFilteredPlanCtlgs } from "./hooks"; //Всп
//Стили
const STYLES = {
PLANS_FINDER: { marginTop: "10px", marginLeft: "10px", width: "93%" },
PLANS_CHECKBOX_HAVEDOCS: { alignContent: "space-around" },
PLANS_LIST_ITEM_ZERODOCS: { backgroundColor: "#ebecec" },
PLANS_FINDER: {
marginTop: "10px",
marginLeft: "10px",
width: "93%",
[`& .MuiFormLabel-root.Mui-focused`]: { color: "text.title.fontColor" },
[`& .MuiInputBase-root`]: { color: "text.plans_finder.fontColor" },
[`& .MuiInputBase-root.Mui-focused::after`]: { borderBottom: "2px solid black" }
},
PLANS_CHECKBOX_HAVEDOCS: {
alignContent: "space-around",
[`& .MuiCheckbox-root.Mui-checked`]: { color: "text.title.fontColor" }
},
PLANS_LIST_ITEM_ZERODOCS: { backgroundColor: "background.plans_zero_docs" },
PLANS_LIST_ITEM_PRIMARY: { wordWrap: "break-word" },
PLANS_LIST_ITEM_SECONDARY: { wordWrap: "break-word", fontSize: "0.6rem", textTransform: "uppercase" },
PLANS_BUTTON: { position: "absolute" },
@ -33,9 +58,18 @@ const STYLES = {
width: "350px",
display: "inline-block",
flexShrink: 0,
[`& .MuiDrawer-paper`]: { width: "350px", display: "inline-block", boxSizing: "border-box" }
[`& .MuiDrawer-paper`]: {
width: "350px",
display: "inline-block",
boxSizing: "border-box",
backgroundColor: "background.plans_drawer_paper",
color: "text.plans_finder.fontColor"
}
},
PLANS_LIST_BOX: { paddingTop: "20px" }
PLANS_LIST_BOX: { paddingTop: "20px" },
ROOT_BG: { backgroundColor: "background.main", minHeight: "calc(100vh - 64px)", overflow: "hidden" },
THEME_CHANGER: { color: "text.title.fontColor" },
MAIN_TITLE: { textAlign: "center", color: "text.title.fontColor", marginTop: "-24px" }
};
//------------------------------------
@ -116,6 +150,8 @@ PlanCtlgsList.propTypes = {
//Корневая панель мониторинга сборки изделий
const MechRecAssemblyMon = () => {
//Состояние - текущая тема
const [theme, setTheme] = useState(lightTheme);
//Собственное состояние
const [state, setState, selectPlanCtlg, unselectPlanCtlg] = useMechRecAssemblyMon();
@ -132,9 +168,6 @@ const MechRecAssemblyMon = () => {
//Массив отфильтрованных каталогов
const filteredPlanCtgls = useFilteredPlanCtlgs(state.planCtlgs, filter);
//Подключение к контексту сообщений
const { InlineMsgInfo } = useContext(MessagingСtx);
//Обработка нажатия на элемент в списке каталогов планов
const handlePlanCtlgClick = planCtlg => {
if (state.selectedPlanCtlg.NRN != planCtlg.NRN) selectPlanCtlg(planCtlg);
@ -144,15 +177,15 @@ const MechRecAssemblyMon = () => {
//Перемещение к нужному плану
const navigateToPlan = planIndex => {
if (planIndex < 0) planIndex = 0;
if (planIndex > state.plans.length - 1) planIndex = state.plans.length - 1;
if (planIndex > state.planSpecs.length - 1) planIndex = state.planSpecs.length - 1;
setState(pv => ({
...pv,
selectedPlan: { ...state.plans[planIndex] }
selectedPlanSpec: { ...state.planSpecs[planIndex] }
}));
setPlanDetailNavigation(pv => ({
...pv,
disableNavigatePrev: planIndex == 0 ? true : false,
disableNavigateNext: planIndex == state.plans.length - 1 ? true : false,
disableNavigateNext: planIndex == state.planSpecs.length - 1 ? true : false,
currentPlanIndex: planIndex
}));
};
@ -162,12 +195,17 @@ const MechRecAssemblyMon = () => {
//Обработка нажатия на кнопку "Назад"
const handlePlanDetailBackClick = () => {
setState(pv => ({ ...pv, selectedPlan: {} }));
setState(pv => ({ ...pv, selectedPlanSpec: {} }));
};
//Обработка навигации из карточки с деталями плана
const handlePlanDetailNavigateClick = direction => navigateToPlan(planDetailNavigation.currentPlanIndex + direction);
//Обработка изменения темы
const handleThemeChange = () => {
setTheme(theme.palette.type === "light" ? darkTheme : lightTheme);
};
//Формирование текста заголовка
const title = `${state.selectedPlanCtlg.SNAME} на ${state.selectedPlanCtlg.NMIN_YEAR} ${
state.selectedPlanCtlg.NMIN_YEAR == state.selectedPlanCtlg.NMAX_YEAR ? "г." : `- ${state.selectedPlanCtlg.NMAX_YEAR} г.г.`
@ -175,53 +213,62 @@ const MechRecAssemblyMon = () => {
//Генерация содержимого
return (
<Box p={2}>
<ThemeProvider theme={theme}>
<Fab variant="extended" sx={STYLES.PLANS_BUTTON} onClick={() => setState(pv => ({ ...pv, showPlanList: !pv.showPlanList }))}>
Программы
</Fab>
<Drawer
anchor={"left"}
open={state.showPlanList}
onClose={() => setState(pv => ({ ...pv, showPlanList: false }))}
sx={STYLES.PLANS_DRAWER}
>
<PlanCtlgsList
planCtlgs={filteredPlanCtgls}
selectedPlanCtlg={state.selectedPlanCtlg.NRN}
filter={filter}
setFilter={setFilter}
onClick={handlePlanCtlgClick}
/>
</Drawer>
{state.init == true ? (
state.selectedPlanCtlg.NRN ? (
<>
<Typography variant="h3" align="center" color="text.title.fontColor" py={2}>
{title}
<ThemeProvider theme={theme}>
<Container maxWidth={false} disableGutters sx={STYLES.ROOT_BG}>
<Box p={2}>
<Fab variant="extended" sx={STYLES.PLANS_BUTTON} onClick={() => setState(pv => ({ ...pv, showPlanList: !pv.showPlanList }))}>
Каталоги планов
</Fab>
<Drawer
anchor={"left"}
open={state.showPlanList}
onClose={() => setState(pv => ({ ...pv, showPlanList: false }))}
sx={STYLES.PLANS_DRAWER}
>
<PlanCtlgsList
planCtlgs={filteredPlanCtgls}
selectedPlanCtlg={state.selectedPlanCtlg.NRN}
filter={filter}
setFilter={setFilter}
onClick={handlePlanCtlgClick}
/>
</Drawer>
<Stack display="flex" direction="row" justifyContent="flex-end" alignItems="center">
<IconButton onClick={() => handleThemeChange()}>
<Icon sx={STYLES.THEME_CHANGER}>{theme.palette.type === "light" ? "brightness_4" : "brightness_7"}</Icon>
</IconButton>
</Stack>
{state.init == true ? (
state.selectedPlanCtlg.NRN ? (
<>
<Typography variant="h3" sx={STYLES.MAIN_TITLE} pb={2}>
{title}
</Typography>
{state.planSpecsLoaded == true ? (
state.selectedPlanSpec.NRN ? (
<PlanSpecDetail
planSpec={state.selectedPlanSpec}
disableNavigatePrev={planDetailNavigation.disableNavigatePrev}
disableNavigateNext={planDetailNavigation.disableNavigateNext}
onNavigate={handlePlanDetailNavigateClick}
onBack={handlePlanDetailBackClick}
/>
) : (
<Box sx={STYLES.PLANS_LIST_BOX}>
<PlanSpecsList planSpecs={state.planSpecs} onItemClick={handlePlanClick} />
</Box>
)
) : null}
</>
) : (
<Typography variant="h4" sx={STYLES.MAIN_TITLE}>
Укажите каталог планов для отображения спецификаций
</Typography>
{state.plansLoaded == true ? (
state.selectedPlan.NRN ? (
<PlanDetail
plan={state.selectedPlan}
disableNavigatePrev={planDetailNavigation.disableNavigatePrev}
disableNavigateNext={planDetailNavigation.disableNavigateNext}
onNavigate={handlePlanDetailNavigateClick}
onBack={handlePlanDetailBackClick}
/>
) : (
<Box sx={STYLES.PLANS_LIST_BOX}>
<PlansList plans={state.plans} onItemClick={handlePlanClick} />
</Box>
)
) : null}
</>
) : (
<InlineMsgInfo okBtn={false} text={"Укажите каталог планов для отображения его спецификаций"} />
)
) : null}
</ThemeProvider>
</Box>
)
) : null}
</Box>
</Container>
</ThemeProvider>
);
};

View File

@ -1,67 +1,130 @@
import { createTheme } from "@mui/material/styles"; //Интерфейсные элементы
//---------
//Константы
//---------
//Насыщенность шрифта
const FONT_WEIGHT_NORMAL = 400;
const FONT_WEIGHT_BOLD = 700;
//Выравнивание текста
const TEXT_ALIGN_CENTER = "center";
//Стиль для детализации прогресса и сообщения таблицы детализации
const smallSizedText = {
fontSize: "12px",
fontWeight: FONT_WEIGHT_NORMAL,
whiteSpace: "pre-line",
textAlign: TEXT_ALIGN_CENTER,
wordWrap: "break-word",
letterSpacing: "0.00938em",
lineHeight: "1.5"
};
//Стили кастомных шрифтов
const customTypography = {
h1: {
fontSize: "40px",
fontWeight: FONT_WEIGHT_NORMAL,
textAlign: TEXT_ALIGN_CENTER
},
h2: {
fontSize: "40px",
fontWeight: FONT_WEIGHT_BOLD,
textAlign: TEXT_ALIGN_CENTER
},
h3: {
fontSize: "30px",
fontWeight: FONT_WEIGHT_BOLD,
textAlign: TEXT_ALIGN_CENTER
},
h4: {
fontSize: "16px",
fontWeight: FONT_WEIGHT_NORMAL,
textAlign: TEXT_ALIGN_CENTER
},
subtitle1: {
fontSize: "30px",
fontWeight: FONT_WEIGHT_NORMAL,
textAlign: TEXT_ALIGN_CENTER
},
subtitle2: {
fontSize: "20px",
fontWeight: FONT_WEIGHT_BOLD,
textAlign: TEXT_ALIGN_CENTER
},
body3: {
fontSize: "9px",
whiteSpace: "pre-line",
textAlign: TEXT_ALIGN_CENTER
},
PlanSpecInfo: {
fontSize: "14px",
fontWeight: FONT_WEIGHT_NORMAL,
textAlign: TEXT_ALIGN_CENTER,
wordWrap: "break-word",
letterSpacing: "0.00938em",
lineHeight: "1.5"
},
PlanSpecProgressDetail: {
...smallSizedText
},
ProductDetailMessage: {
...smallSizedText
}
};
//---------
//Описание темы
const theme = createTheme({
//---------
const lightTheme = createTheme({
palette: {
type: "light",
background: {
main: "#fff",
secondary: "#fff",
progress: "#fff",
detail_table: "#fff",
detail_info: "#fff",
product_selector: "#fff",
plans_zero_docs: "#ebecec",
plans_drawer_paper: "#fff"
},
text: {
title: { fontColor: "rgba(0, 0, 0, 0.65)" },
secondary: { fontColor: "rgba(0, 0, 0, 0.298)" }
detail_table: { fontColor: "rgba(0, 0, 0, 0.87)" },
secondary: { fontColor: "rgba(0, 0, 0, 0.298)" },
plans_finder: { fontColor: "black" },
more_button: { fontColor: "#1976d2" }
}
},
typography: {
h1: {
fontSize: "40px",
fontWeight: 400,
textAlign: "center"
},
h2: {
fontSize: "40px",
fontWeight: 700,
textAlign: "center"
},
h3: {
fontSize: "30px",
fontWeight: 700,
textAlign: "center"
},
h4: {
fontSize: "16px",
fontWeight: 400,
textAlign: "center"
},
subtitle1: {
fontSize: "30px",
fontWeight: 400,
textAlign: "center"
},
subtitle2: {
fontSize: "20px",
fontWeight: 700,
textAlign: "center"
},
UDO_body1: {
fontSize: "14px",
fontWeight: 400,
textAlign: "center",
wordWrap: "break-word",
letterSpacing: "0.00938em",
lineHeight: "1.5"
},
UDO_body2: {
fontSize: "12px",
fontWeight: 400,
whiteSpace: "pre-line",
textAlign: "center",
wordWrap: "break-word",
letterSpacing: "0.00938em",
lineHeight: "1.5"
},
body3: {
fontSize: "9px",
whiteSpace: "pre-line",
textAlign: "center"
}
}
typography: { ...customTypography }
});
export { theme };
const darkTheme = createTheme({
palette: {
type: "dark",
background: {
main: "#161616",
secondary: "#d2d2d2",
progress: "#e8e8e8",
detail_table: "#3f3f3f",
detail_info: "#d0d0d0",
product_selector: "#eee",
plans_zero_docs: "#323232",
plans_drawer_paper: "#3f3f3f"
},
text: {
title: { fontColor: "#fff" },
detail_table: { fontColor: "#fff" },
secondary: { fontColor: "rgba(0, 0, 0, 0.298)" },
plans_finder: { fontColor: "#fff" },
more_button: { fontColor: "#fff" }
}
},
typography: { ...customTypography }
});
export { lightTheme, darkTheme };

View File

@ -1,337 +0,0 @@
//---------------------
//Подключение библиотек
//---------------------
import { useState, useCallback, useEffect, useContext } from "react"; //Классы React
import { BackEndСtx } from "../../context/backend"; //Контекст взаимодействия с сервером
import { object2Base64XML } from "../../core/utils"; //Вспомогательные функции
//---------
//Константы
//---------
//Размер страницы данных
const DATA_GRID_PAGE_SIZE = 5;
const DATA_GRID_PAGE_FCEQUIPMENT = 10;
//---------------------------------------------
//Вспомогательные функции форматирования данных
//---------------------------------------------
//Переиницализация выбранных значений строк (необходимо при сортировке или добавлении записей строк)
const updatingSelected = (rows, selectedRows) => {
//Если полученный массив строк не пустой
if (rows.length > 0 && selectedRows.length > 0) {
//Устанавливаем выбор там, где он был установлен
let updatedRows = rows.map(item => {
if (selectedRows.includes(item.NRN)) {
return { ...item, NSELECT: 1 };
} else {
return item;
}
});
return updatedRows;
}
//Возвращаем
return rows;
};
//-----------
//Тело модуля
//-----------
//Хук для таблицы маршрутных листов
const useCostRouteLists = (task, processIdent) => {
//Собственное состояние - таблица данных
const [costRouteLists, setCostRouteLists] = useState({
task: null,
dataLoaded: false,
columnsDef: [],
orders: null,
rows: [],
selectedRows: [],
reload: true,
pageNumber: 1,
morePages: true
});
//Подключение к контексту взаимодействия с сервером
const { executeStored, SERV_DATA_TYPE_CLOB } = useContext(BackEndСtx);
//Загрузка данных таблицы с сервера
const loadData = useCallback(async () => {
if (costRouteLists.reload) {
const data = await executeStored({
stored: "PKG_P8PANELS_MECHREC.FCJOBSSP_FCROUTLST_DG_GET",
args: {
NFCJOBS: task,
CORDERS: { VALUE: object2Base64XML(costRouteLists.orders, { arrayNodeName: "orders" }), SDATA_TYPE: SERV_DATA_TYPE_CLOB },
NPAGE_NUMBER: costRouteLists.pageNumber,
NPAGE_SIZE: DATA_GRID_PAGE_SIZE,
NINCLUDE_DEF: costRouteLists.dataLoaded ? 0 : 1
},
respArg: "COUT",
attributeValueProcessor: (name, val) => (["NSELECT"].includes(name) ? val === 1 : val)
});
setCostRouteLists(pv => ({
...pv,
task: task,
columnsDef: data.XCOLUMNS_DEF ? [...data.XCOLUMNS_DEF] : pv.columnsDef,
rows:
pv.pageNumber == 1
? updatingSelected([...(data.XROWS || [])], costRouteLists.selectedRows)
: updatingSelected([...pv.rows, ...(data.XROWS || [])], costRouteLists.selectedRows),
dataLoaded: true,
reload: false,
morePages: (data.XROWS || []).length >= DATA_GRID_PAGE_SIZE
}));
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [
costRouteLists.reload,
costRouteLists.filters,
costRouteLists.orders,
costRouteLists.dataLoaded,
costRouteLists.pageNumber,
executeStored,
SERV_DATA_TYPE_CLOB
]);
//Добавление/удаление записи в селектлисте
const modifySelectList = useCallback(
async prms => {
try {
if (prms.NSELECT) {
await executeStored({
stored: "PKG_P8PANELS_MECHREC.SELECTLIST_FCROUTLST_ADD",
args: { NIDENT: processIdent, NFCROUTLST: prms.NFCROUTLST }
});
} else {
await executeStored({
stored: "PKG_P8PANELS_MECHREC.SELECTLIST_FCROUTLST_DEL",
args: { NIDENT: processIdent, NFCROUTLST: prms.NFCROUTLST }
});
}
} catch (e) {
throw new Error(e.message);
}
},
// eslint-disable-next-line react-hooks/exhaustive-deps
[executeStored]
);
//При необходимости обновить данные таблицы
useEffect(() => {
loadData();
}, [costRouteLists.reload, loadData]);
//При изменении сменного задания
useEffect(() => {
setCostRouteLists(pv => ({
...pv,
dataLoaded: false,
columnsDef: [],
orders: null,
rows: [],
selectedRows: [],
reload: true,
pageNumber: 1,
morePages: true
}));
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [task]);
return [costRouteLists, setCostRouteLists, modifySelectList];
};
//Хук для таблицы операций
const useCostJobsSpecs = (task, fcroutlstList, processIdent) => {
//Собственное состояние - таблица данных
const [costJobsSpecs, setCostJobsSpecs] = useState({
task: null,
dataLoaded: false,
columnsDef: [],
orders: null,
rows: [],
selectedRows: [],
reload: true,
pageNumber: 1,
morePages: true
});
//Подключение к контексту взаимодействия с сервером
const { executeStored, SERV_DATA_TYPE_CLOB } = useContext(BackEndСtx);
//Загрузка данных таблицы с сервера
const loadData = useCallback(async () => {
if (costJobsSpecs.reload) {
const data = await executeStored({
stored: "PKG_P8PANELS_MECHREC.FCJOBSSP_DG_GET",
args: {
NFCJOBS: task,
NIDENT: processIdent,
//SFCROUTLST_LIST: fcroutlstList.join(","),
CORDERS: { VALUE: object2Base64XML(costJobsSpecs.orders, { arrayNodeName: "orders" }), SDATA_TYPE: SERV_DATA_TYPE_CLOB },
NPAGE_NUMBER: costJobsSpecs.pageNumber,
NPAGE_SIZE: DATA_GRID_PAGE_SIZE,
NINCLUDE_DEF: costJobsSpecs.dataLoaded ? 0 : 1
},
respArg: "COUT",
attributeValueProcessor: (name, val) => (["NSELECT"].includes(name) ? val === 1 : val)
});
setCostJobsSpecs(pv => ({
...pv,
task: task,
columnsDef: data.XCOLUMNS_DEF ? [...data.XCOLUMNS_DEF] : pv.columnsDef,
rows:
pv.pageNumber == 1
? updatingSelected([...(data.XROWS || [])], costJobsSpecs.selectedRows)
: updatingSelected([...pv.rows, ...(data.XROWS || [])], costJobsSpecs.selectedRows),
dataLoaded: true,
reload: false,
morePages: (data.XROWS || []).length >= DATA_GRID_PAGE_SIZE
}));
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [
costJobsSpecs.reload,
costJobsSpecs.filters,
costJobsSpecs.orders,
costJobsSpecs.dataLoaded,
costJobsSpecs.pageNumber,
executeStored,
SERV_DATA_TYPE_CLOB
]);
//Выдача задания
const issueCostJobsSpecs = useCallback(
async prms => {
try {
await executeStored({
stored: "PKG_P8PANELS_MECHREC.FCJOBSSP_ISSUE",
args: { NFCJOBS: prms.NFCJOBS, SFCJOBSSP_LIST: prms.SFCJOBSSP_LIST }
});
} catch (e) {
throw new Error(e.message);
}
},
[executeStored]
);
//При необходимости обновить данные таблицы
useEffect(() => {
loadData();
}, [costJobsSpecs.reload, loadData]);
//При изменении сменного задания
useEffect(() => {
setCostJobsSpecs(pv => ({
...pv,
dataLoaded: false,
columnsDef: [],
orders: null,
rows: [],
selectedRows: [],
reload: true,
pageNumber: 1,
morePages: true
}));
}, [task, fcroutlstList]);
return [costJobsSpecs, setCostJobsSpecs, issueCostJobsSpecs];
};
//Хук для таблицы рабочих центров
const useCostEquipment = () => {
//Собственное состояние - таблица данных
const [costEquipment, setCostEquipment] = useState({
dataLoaded: false,
columnsDef: [],
orders: null,
rows: [],
selectedRows: [],
selectedLoaded: false,
reload: true,
pageNumber: 1,
morePages: true
});
//Подключение к контексту взаимодействия с сервером
const { executeStored, SERV_DATA_TYPE_CLOB } = useContext(BackEndСtx);
//Загрузка данных таблицы с сервера
const loadData = useCallback(async () => {
if (costEquipment.reload) {
const data = await executeStored({
stored: "PKG_P8PANELS_MECHREC.FCEQUIPMENT_DG_GET",
args: {
CORDERS: { VALUE: object2Base64XML(costEquipment.orders, { arrayNodeName: "orders" }), SDATA_TYPE: SERV_DATA_TYPE_CLOB },
NPAGE_NUMBER: costEquipment.pageNumber,
NPAGE_SIZE: DATA_GRID_PAGE_FCEQUIPMENT,
NINCLUDE_DEF: costEquipment.dataLoaded ? 0 : 1
},
respArg: "COUT",
attributeValueProcessor: (name, val) => (["NSELECT"].includes(name) ? val === 1 : val)
});
setCostEquipment(pv => ({
...pv,
columnsDef: data.XCOLUMNS_DEF ? [...data.XCOLUMNS_DEF] : pv.columnsDef,
rows:
pv.pageNumber == 1
? updatingSelected([...(data.XROWS || [])], costEquipment.selectedRows)
: updatingSelected([...pv.rows, ...(data.XROWS || [])], costEquipment.selectedRows),
dataLoaded: true,
reload: false,
morePages: (data.XROWS || []).length >= DATA_GRID_PAGE_FCEQUIPMENT
}));
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [
costEquipment.reload,
costEquipment.filters,
costEquipment.orders,
costEquipment.dataLoaded,
costEquipment.pageNumber,
executeStored,
SERV_DATA_TYPE_CLOB
]);
//Включение оборудования в операции
const includeCostEquipment = useCallback(
async prms => {
try {
await executeStored({
stored: "PKG_P8PANELS_MECHREC.FCJOBSSP_INC_FCEQUIPMENT",
args: { NFCEQUIPMENT: prms.NFCEQUIPMENT, NFCJOBS: prms.NFCJOBS, SFCJOBSSP_LIST: prms.SFCJOBSSP_LIST }
});
} catch (e) {
throw new Error(e.message);
}
},
[executeStored]
);
//Исключение оборудования из операции
const excludeCostEquipment = useCallback(
async prms => {
try {
await executeStored({
stored: "PKG_P8PANELS_MECHREC.FCJOBSSP_EXC_FCEQUIPMENT",
args: { NFCEQUIPMENT: prms.NFCEQUIPMENT, NFCJOBS: prms.NFCJOBS, SFCJOBSSP_LIST: prms.SFCJOBSSP_LIST }
});
} catch (e) {
throw new Error(e.message);
}
},
[executeStored]
);
//При необходимости обновить данные таблицы
useEffect(() => {
loadData();
}, [costEquipment.reload, loadData]);
return [costEquipment, setCostEquipment, includeCostEquipment, excludeCostEquipment];
};
export { useCostRouteLists, useCostJobsSpecs, useCostEquipment, updatingSelected };

View File

@ -1,124 +1,139 @@
/*
Парус 8 - Панели мониторинга - ПУП - Выдача сменного задания
Компонент панели: Таблица информации об операциях сменного задания
Компонент панели: Таблица информации о строках сменного задания
*/
//---------------------
//Подключение библиотек
//---------------------
import React from "react"; //Классы React
import React, { useState } from "react"; //Классы React
import PropTypes from "prop-types"; //Контроль свойств компонента
import { Typography, Box, Checkbox, Grid, Icon, Button } from "@mui/material"; //Интерфейсные элементы
import { Typography, Box, Checkbox, Grid, Icon, Button, Dialog, DialogContent, TextField, DialogActions, Tooltip } from "@mui/material"; //Интерфейсные элементы
import { P8PDataGrid, P8P_DATA_GRID_SIZE } from "../../components/p8p_data_grid"; //Таблица данных
import { P8P_DATA_GRID_CONFIG_PROPS } from "../../config_wrapper"; //Подключение компонентов к настройкам приложения
import { useCostRouteLists, useCostJobsSpecs, useCostEquipment } from "./backend"; //Собственные хуки таблиц
import { useCostJobsSpecs, useEquipConfiguration } from "./hooks"; //Собственные хуки таблиц
//---------
//Константы
//---------
const sUnitCostRouteLists = "CostRouteLists"; //Мнемокод раздела маршрутных листов
const sUnitCostJobsSpecs = "CostJobsSpecs"; //Мнемокод раздела операций
const sUnitCostEquipment = "CostEquipment"; //Мнемокод раздела рабочих центров
//Стили
const STYLES = {
CONTAINER: { textAlign: "center" },
DATA_GRID_CONTAINER: { minHeight: "65vh", maxHeight: "65vh" },
TABLE: { paddingTop: "15px" },
TABLE_SUM: { textAlign: "right", paddingTop: "5px", paddingRight: "15px" },
TABLE_BUTTONS: { display: "flex", justifyContent: "flex-end" },
CHECK_BOX: { textAlign: "center" },
OPERATIONS_SEPARATOR: { padding: "3px 0px", backgroundColor: "lightblue" },
INFORMATION_HALF: { minWidth: "50%", maxWidth: "50%", textAlign: "center" }
JOBS_INFO: { minWidth: "60%", maxWidth: "60%", textAlign: "center" },
EQUIPMENT_INFO: { minWidth: "40%", maxWidth: "40%", textAlign: "center" }
};
//Цвета
const colors = {
LINKED: "#bce0de",
UNAVAILABLE: "#949494",
WITH_EQCONFIG: "#82df83"
};
//---------------------------------------------
//Вспомогательные функции форматирования данных
//Вспомогательные функции и компоненты
//---------------------------------------------
//Формирование списка отмеченных записей
function selectedReducer(accumulator, current) {
if (current.NSELECT == 1) {
accumulator.push(current.NRN);
}
return accumulator;
}
//Форматирование значения ячейки
const dataCellRender = ({ row, columnDef, handleSelectChange, sUnit, selectedEquip }) => {
//Инициализируем доступность выбора
let disabled = false;
const dataCellRender = ({ row, columnDef, handleSelectChange, sUnit, selectedRow, selectedJobSpec }) => {
//Стиль
let cellStyle = {};
//Если это рабочие центры
if (sUnit === sUnitCostEquipment) {
//Признак недоступности
let disabled = true;
//Если в выбранной строке смены указано рабочее место
if (selectedJobSpec.NEQCONFIG) {
//Если это текущее рабочее место
if (row["NRN"] === selectedJobSpec.NEQCONFIG) {
//Подсвечиваем строку рабочего места
cellStyle = { backgroundColor: colors.LINKED };
}
} else {
//Если выбрана строка смены
if (selectedJobSpec.NRN) {
//Если на текущее рабочее место возможно добавить задание
if (row["NLOADING"] < 100 && row["NEQUIPMENT"] === selectedJobSpec.NEQUIP_PLAN) {
//Подсвечиваем строку рабочего места
cellStyle = { backgroundColor: colors.LINKED };
disabled = false;
}
}
}
//Если рабочий центр загружен
if (row["NLOADING"] >= 100) {
//Если поле не поле выбора
if (columnDef.name !== "NSELECT") {
//Указываем, что рабочее место недоступно
cellStyle = { ...cellStyle, color: colors.UNAVAILABLE };
}
}
//Для колонки выбора
if (columnDef.name === "NSELECT") {
return {
cellStyle,
data: (
<Box sx={STYLES.CHECK_BOX}>
<Checkbox
disabled={selectedEquip.length === 1 && selectedEquip[0] !== row["NRN"]}
checked={row[columnDef.name]}
//checked={row[columnDef.name] === 1}
onChange={() => handleSelectChange(row["NRN"], sUnit, row["NCOEFF"] <= row["NLOADING"])}
disabled={disabled}
checked={row["NRN"] === selectedRow}
onChange={() => handleSelectChange({ NRN: row["NRN"], SUNIT: sUnit, BFULL_LOADED: row["NLOADING"] >= 100 })}
/>
</Box>
)
};
}
//Если оборудование загружено
if (row["NCOEFF"] <= row["NLOADING"]) {
//Если поле не поле выбора
if (columnDef.name !== "NSELECT") {
return {
cellStyle: { color: "lightgrey" },
data: row[columnDef.name]
};
}
}
}
//Если это операции
if (sUnit === sUnitCostJobsSpecs) {
//Если "Оборудование план" операции сходится с выбранным оборудованием
if (selectedEquip.includes(row["NEQUIP_PLAN"])) {
//Если колонка выбора
if (columnDef.name === "NSELECT") {
return {
cellStyle: { backgroundColor: "#bce0de" },
data: (
<Box sx={STYLES.CHECK_BOX}>
<Checkbox
disabled={disabled}
checked={row[columnDef.name]}
//checked={row[columnDef.name] === 1}
onChange={() => handleSelectChange(row["NRN"], sUnit)}
/>
</Box>
)
};
} else {
return {
cellStyle: { backgroundColor: "#bce0de" },
data: row[columnDef.name]
};
}
}
}
//Для колонки выбора
if (columnDef.name === "NSELECT") {
//Отформатированная колонка
return {
data: (
<Box sx={STYLES.CHECK_BOX}>
<Checkbox
disabled={disabled}
checked={row[columnDef.name]}
//checked={row[columnDef.name] === 1}
onChange={() => handleSelectChange(row["NRN"], sUnit)}
/>
</Box>
)
cellStyle,
data: row[columnDef.name]
};
}
//Если это сменное задание
if (sUnit === sUnitCostJobsSpecs) {
//Если указан станок
if (row["SEQCONFIG"]) {
//Подсвечиваем сменное задание зеленым
cellStyle = { ...cellStyle, backgroundColor: colors.WITH_EQCONFIG };
}
//Для колонки выбора
if (columnDef.name === "NSELECT") {
return {
cellStyle,
data: (
<Box sx={STYLES.CHECK_BOX}>
<Checkbox
disabled={row["DBEG_FACT"] ? true : false}
checked={row["NRN"] === selectedRow}
onChange={() =>
handleSelectChange({
NRN: row["NRN"],
SUNIT: sUnit,
NEQCONFIG: row["NEQCONFIG"],
NEQUIP_PLAN: row["NEQUIP_PLAN"],
NQUANT_PLAN: row["NQUANT_PLAN"]
})
}
/>
</Box>
)
};
}
//Отформатированная колонка
return {
cellStyle,
data: row[columnDef.name]
};
}
//Необрабатываемый раздел
return {
data: row[columnDef.name]
};
@ -139,26 +154,108 @@ export const headCellRender = ({ columnDef }) => {
}
};
//Диалог включения станка в сменное задание
const CostJobsSpecsInclude = ({ includeEquipment, setIncludeEquipment, setCostJobsSpecs, setEquipConfiguration, includeEquipConfiguration }) => {
//Собственное состояние - Значение приоритета
const [state, setState] = useState(includeEquipment.NVALUE);
//При закрытии включения станка
const handlePriorEditClose = () => {
setIncludeEquipment({
NFCJOBSSP: null,
NEQCONFIG: null,
NVALUE: 0
});
};
//При включении станка в строку сменного задания
const costJobsSpecIncludeCostEquipment = () => {
//Делаем асинхронно, чтобы при ошибке ничего не обновлять
const includeAsync = async () => {
//Включаем станок в строку сменного задания
try {
await includeEquipConfiguration({
NEQCONFIG: includeEquipment.NEQCONFIG,
NFCJOBSSP: includeEquipment.NFCJOBSSP,
NQUANT_PLAN: state
});
//Необходимо обновить все данные
setCostJobsSpecs(pv => ({ ...pv, selectedRow: {}, pageNumber: 1, reload: true }));
setEquipConfiguration(pv => ({ ...pv, selectedRow: {}, pageNumber: 1, reload: true }));
handlePriorEditClose();
} catch (e) {
throw new Error(e.message);
}
};
//Включаем станок асинхронно
includeAsync();
};
return (
<Dialog open onClose={() => handlePriorEditClose()}>
<DialogContent>
<Box>
<TextField
name="editInculdeValue"
label="Количество"
variant="standard"
fullWidth
InputProps={{
type: "number",
inputProps: {
max: includeEquipment.NVALUE,
min: 0
}
}}
value={state}
onChange={event => {
var value = parseInt(event.target.value, 10);
if (value > includeEquipment.NVALUE) {
value = includeEquipment.NVALUE;
}
if (value < 0) {
value = 0;
}
setState(value);
}}
/>
<Box>
<Button onClick={costJobsSpecIncludeCostEquipment} variant="contained" sx={STYLES.DIALOG_BUTTONS}>
Включить в задание
</Button>
</Box>
</Box>
</DialogContent>
<DialogActions>
<Button onClick={() => handlePriorEditClose(null)}>Закрыть</Button>
</DialogActions>
</Dialog>
);
};
//Контроль свойств - Диалог включения станка в сменное задание
CostJobsSpecsInclude.propTypes = {
includeEquipment: PropTypes.object.isRequired,
setIncludeEquipment: PropTypes.func.isRequired,
setCostJobsSpecs: PropTypes.func.isRequired,
setEquipConfiguration: PropTypes.func.isRequired,
includeEquipConfiguration: PropTypes.func.isRequired
};
//-----------
//Тело модуля
//-----------
//Таблица информации об операциях сменного задания
const CostJobsSpecsDataGrid = ({ task, processIdent, clearSelectlist }) => {
//Собственное состояние - таблица данных маршрутных листов
const [costRouteLists, setCostRouteLists, modifySelectList] = useCostRouteLists(task, processIdent);
//Таблица информации о строках сменного задания
const CostJobsSpecsDataGrid = ({ task, haveNote }) => {
//Собственное состояние - Включение в задание
const [includeEquipment, setIncludeEquipment] = useState({ NFCJOBSSP: null, NEQCONFIG: null, NVALUE: 0 });
//Собственное состояние - таблица данных операций
const [costJobsSpecs, setCostJobsSpecs, issueCostJobsSpecs] = useCostJobsSpecs(task, costRouteLists.selectedRows, processIdent);
//Собственное состояние - таблица данных сменных заданий
const [costJobsSpecs, setCostJobsSpecs, issueCostJobsSpecs] = useCostJobsSpecs(task);
//Собственное состояние - таблица рабочих центров
const [costEquipment, setCostEquipment, includeCostEquipment, excludeCostEquipment] = useCostEquipment();
//При изменении состояния сортировки маршрутных листов
const costRouteListOrderChanged = ({ orders }) => setCostRouteLists(pv => ({ ...pv, orders: [...orders], pageNumber: 1, reload: true }));
//При изменении количества отображаемых страниц маршрутных листов
const costRouteListPagesCountChanged = () => setCostRouteLists(pv => ({ ...pv, pageNumber: pv.pageNumber + 1, reload: true }));
const [equipConfiguration, setEquipConfiguration, includeEquipConfiguration, excludeEquipConfiguration] = useEquipConfiguration(task);
//При изменении состояния сортировки операций
const costJobsSpecOrderChanged = ({ orders }) => setCostJobsSpecs(pv => ({ ...pv, orders: [...orders], pageNumber: 1, reload: true }));
@ -167,52 +264,28 @@ const CostJobsSpecsDataGrid = ({ task, processIdent, clearSelectlist }) => {
const costJobsSpecPagesCountChanged = () => setCostJobsSpecs(pv => ({ ...pv, pageNumber: pv.pageNumber + 1, reload: true }));
//При изменении состояния сортировки рабочих центров
const costEquipmentOrderChanged = ({ orders }) => setCostEquipment(pv => ({ ...pv, orders: [...orders], pageNumber: 1, reload: true }));
const costEquipmentOrderChanged = ({ orders }) => setEquipConfiguration(pv => ({ ...pv, orders: [...orders], pageNumber: 1, reload: true }));
//При изменении количества отображаемых страниц рабочих центров
const costEquipmentPagesCountChanged = () => setCostEquipment(pv => ({ ...pv, pageNumber: pv.pageNumber + 1, reload: true }));
const costEquipmentPagesCountChanged = () => setEquipConfiguration(pv => ({ ...pv, pageNumber: pv.pageNumber + 1, reload: true }));
//При включении оборудования в операции
const costJobsSpecIncludeCostEquipment = () => {
//Делаем асинхронно, чтобы при ошибке ничего не обновлять
const includeAsync = async () => {
//Включаем оборудование в операции
try {
await includeCostEquipment({
NFCEQUIPMENT: costEquipment.selectedRows[0],
NFCJOBS: task,
SFCJOBSSP_LIST: costJobsSpecs.selectedRows.join(";")
});
//Необходимо обновить все данные
setCostJobsSpecs(pv => ({ ...pv, selectedRows: [], reload: true }));
setCostEquipment(pv => ({ ...pv, selectedRows: [], selectedLoaded: false, reload: true }));
} catch (e) {
throw new Error(e.message);
}
};
//Включаем оборудование асинхронно
includeAsync();
};
//При исключении оборудования из операции
//При исключении станка из строки сменного задания
const costJobsSpecExcludeCostEquipment = () => {
//Делаем асинхронно, чтобы при ошибке ничего не обновлять
const excludeAsync = async () => {
//Включаем оборудование в операции
//Исключаем станок из строки сменного задания
try {
await excludeCostEquipment({
NFCEQUIPMENT: costEquipment.selectedRows[0],
NFCJOBS: task,
SFCJOBSSP_LIST: costJobsSpecs.selectedRows.join(";")
await excludeEquipConfiguration({
NFCJOBSSP: costJobsSpecs.selectedRow.NRN
});
//Необходимо обновить данные о маршрутных листах и оборудовании
setCostJobsSpecs(pv => ({ ...pv, selectedRows: [], reload: true }));
setCostEquipment(pv => ({ ...pv, selectedRows: [], reload: true }));
//Необходимо обновить данные
setCostJobsSpecs(pv => ({ ...pv, selectedRow: {}, pageNumber: 1, reload: true }));
setEquipConfiguration(pv => ({ ...pv, selectedRow: {}, pageNumber: 1, reload: true }));
} catch (e) {
throw new Error(e.message);
}
};
//Исключаем операции асинхронно
//Исключаем станок асинхронно
excludeAsync();
};
@ -222,14 +295,10 @@ const CostJobsSpecsDataGrid = ({ task, processIdent, clearSelectlist }) => {
const issueAsync = async () => {
//Включаем оборудование в операции
try {
await issueCostJobsSpecs({
NFCJOBS: task,
SFCJOBSSP_LIST: costJobsSpecs.selectedRows.join(";")
});
//Необходимо обновить данные о маршрутных листах и оборудовании
clearSelectlist(processIdent);
setCostRouteLists(pv => ({ ...pv, selectedRows: [], reload: true }));
setCostEquipment(pv => ({ ...pv, selectedRows: [], reload: true }));
await issueCostJobsSpecs({ NFCJOBS: task });
//Необходимо обновить данные
setCostJobsSpecs(pv => ({ ...pv, selectedRow: {}, pageNumber: 1, reload: true }));
setEquipConfiguration(pv => ({ ...pv, selectedRow: {}, pageNumber: 1, reload: true }));
} catch (e) {
throw new Error(e.message);
}
@ -239,49 +308,33 @@ const CostJobsSpecsDataGrid = ({ task, processIdent, clearSelectlist }) => {
};
//При изменение состояния выбора
const handleSelectChange = (NRN, sUnit, selectedLoaded) => {
//Инициализируем строки таблицы
let rows = [];
//Индекс элемента в массиве
let indexRow = null;
const handleSelectChange = prms => {
//Выбранный элемент
let selectedRow = null;
//Исходим от раздела
switch (sUnit) {
//Маршрутные листы
case sUnitCostRouteLists:
//Инициализируем маршрутными листами
rows = costRouteLists.rows;
//Определяем индекс элемента в массиве
indexRow = rows.findIndex(obj => obj.NRN == NRN);
//Изменяем значение выбора
rows[indexRow].NSELECT = !rows[indexRow].NSELECT;
//Добавляем/удаляем маршрутный лист из селектлиста
modifySelectList({ NFCROUTLST: NRN, NSELECT: rows[indexRow].NSELECT });
//Актуализируем строки
setCostRouteLists(pv => ({ ...pv, rows: rows, selectedRows: rows.reduce(selectedReducer, []) }));
//Выходим
break;
//Операции
switch (prms.SUNIT) {
//Сменное задание
case sUnitCostJobsSpecs:
//Инициализируем операциями
rows = costJobsSpecs.rows;
//Определяем индекс элемента в массиве
indexRow = rows.findIndex(obj => obj.NRN == NRN);
//Изменяем значение выбора
rows[indexRow].NSELECT = !rows[indexRow].NSELECT;
//Определяем это новое отмеченное сменное задание или сброс старого
selectedRow = costJobsSpecs.selectedRow.NRN ? (costJobsSpecs.selectedRow.NRN === prms.NRN ? null : prms.NRN) : prms.NRN;
//Актуализируем строки
setCostJobsSpecs(pv => ({ ...pv, rows: rows, selectedRows: rows.reduce(selectedReducer, []) }));
setCostJobsSpecs(pv => ({
...pv,
selectedRow: selectedRow
? { NRN: selectedRow, NEQCONFIG: prms.NEQCONFIG, NEQUIP_PLAN: prms.NEQUIP_PLAN, NQUANT_PLAN: prms.NQUANT_PLAN }
: { NRN: null, NEQCONFIG: null, NEQUIP_PLAN: null, NQUANT_PLAN: null }
}));
//Выходим
break;
//Рабочие центры
case sUnitCostEquipment:
//Инициализируем рабочими центрами
rows = costEquipment.rows;
//Определяем индекс элемента в массиве
indexRow = rows.findIndex(obj => obj.NRN == NRN);
//Изменяем значение выбора
rows[indexRow].NSELECT = !rows[indexRow].NSELECT;
//Определяем это новое отмеченное сменное задание или сброс старого
selectedRow = equipConfiguration.selectedRow.NRN ? (equipConfiguration.selectedRow.NRN === prms.NRN ? null : prms.NRN) : prms.NRN;
//Актуализируем строки
setCostEquipment(pv => ({ ...pv, rows: rows, selectedRows: rows.reduce(selectedReducer, []), selectedLoaded: selectedLoaded }));
setEquipConfiguration(pv => ({
...pv,
selectedRow: selectedRow ? { NRN: selectedRow, BFULL_LOADED: prms.BFULL_LOADED } : { NRN: null, BFULL_LOADED: null }
}));
//Выходим
break;
default:
@ -289,79 +342,74 @@ const CostJobsSpecsDataGrid = ({ task, processIdent, clearSelectlist }) => {
}
};
//При открытии окна включения в задание
const handleIncludeEquipmentOpen = () => {
//Актуализируем строки
setIncludeEquipment({
NFCJOBSSP: costJobsSpecs.selectedRow.NRN,
NEQCONFIG: equipConfiguration.selectedRow.NRN,
NVALUE: costJobsSpecs.selectedRow.NQUANT_PLAN
});
};
//Генерация содержимого
return (
<div style={STYLES.CONTAINER}>
<Grid container spacing={2}>
<Grid item sx={STYLES.INFORMATION_HALF}>
<Typography variant={"h6"}>Маршрутные листы</Typography>
{costRouteLists.dataLoaded ? (
<Grid item sx={STYLES.JOBS_INFO}>
<Typography variant={"h6"}>Сменное задание</Typography>
{costJobsSpecs.dataLoaded ? (
<>
<Box sx={STYLES.TABLE_BUTTONS}>
<Button
variant="contained"
size="small"
disabled={costJobsSpecs.selectedRows.length === 0}
onClick={costJobsSpecIssue}
>
Выдать задания
</Button>
<Tooltip title={haveNote ? "Сменное задание имеет строку с примечанием" : null}>
<Box>
<Button variant="contained" size="small" disabled={haveNote} onClick={costJobsSpecIssue}>
Выдать задания
</Button>
</Box>
</Tooltip>
</Box>
<Box sx={STYLES.TABLE}>
<P8PDataGrid
{...P8P_DATA_GRID_CONFIG_PROPS}
columnsDef={costRouteLists.columnsDef}
rows={costRouteLists.rows}
containerComponentProps={{ sx: STYLES.DATA_GRID_CONTAINER, elevation: 1 }}
columnsDef={costJobsSpecs.columnsDef}
rows={costJobsSpecs.rows}
size={P8P_DATA_GRID_SIZE.SMALL}
morePages={costRouteLists.morePages}
reloading={costRouteLists.reload}
onOrderChanged={costRouteListOrderChanged}
onPagesCountChanged={costRouteListPagesCountChanged}
dataCellRender={prms => dataCellRender({ ...prms, handleSelectChange, sUnit: sUnitCostRouteLists })}
morePages={costJobsSpecs.morePages}
reloading={costJobsSpecs.reload}
onOrderChanged={costJobsSpecOrderChanged}
onPagesCountChanged={costJobsSpecPagesCountChanged}
dataCellRender={prms =>
dataCellRender({
...prms,
handleSelectChange,
sUnit: sUnitCostJobsSpecs,
selectedRow: costJobsSpecs.selectedRow.NRN,
selectedJobSpec: costJobsSpecs.selectedRow
})
}
headCellRender={prms => headCellRender({ ...prms })}
fixedHeader={true}
/>
{costRouteLists.selectedRows.length > 0 ? (
<>
<Box sx={STYLES.OPERATIONS_SEPARATOR}>Операции выбранных маршрутных листов</Box>
<P8PDataGrid
{...P8P_DATA_GRID_CONFIG_PROPS}
columnsDef={costJobsSpecs.columnsDef}
rows={costJobsSpecs.rows}
size={P8P_DATA_GRID_SIZE.SMALL}
morePages={costJobsSpecs.morePages}
reloading={costJobsSpecs.reload}
onOrderChanged={costJobsSpecOrderChanged}
onPagesCountChanged={costJobsSpecPagesCountChanged}
dataCellRender={prms =>
dataCellRender({
...prms,
handleSelectChange,
sUnit: sUnitCostJobsSpecs,
selectedEquip: costEquipment.selectedRows
})
}
headCellRender={prms => headCellRender({ ...prms })}
/>
</>
) : null}
</Box>
</>
) : null}
</Grid>
<Grid item sx={STYLES.INFORMATION_HALF}>
<Grid item sx={STYLES.EQUIPMENT_INFO}>
<Typography variant={"h6"}>Рабочие центры</Typography>
{costEquipment.dataLoaded ? (
{equipConfiguration.dataLoaded ? (
<>
<Box sx={STYLES.TABLE_BUTTONS}>
<Button
variant="contained"
size="small"
disabled={
costEquipment.selectedRows.length !== 1 ||
(costEquipment.selectedRows.length === 1 && costJobsSpecs.selectedRows.length === 0) ||
costEquipment.selectedLoaded
!equipConfiguration.selectedRow.NRN ||
!costJobsSpecs.selectedRow.NRN ||
(equipConfiguration.selectedRow.NRN && equipConfiguration.selectedRow.BFULL_LOADED)
}
onClick={costJobsSpecIncludeCostEquipment}
onClick={handleIncludeEquipmentOpen}
>
Включить в задание
</Button>
@ -369,10 +417,7 @@ const CostJobsSpecsDataGrid = ({ task, processIdent, clearSelectlist }) => {
<Button
variant="contained"
size="small"
disabled={
costEquipment.selectedRows.length !== 1 ||
(costEquipment.selectedRows.length === 1 && costJobsSpecs.selectedRows.length === 0)
}
disabled={!costJobsSpecs.selectedRow.NRN || !costJobsSpecs.selectedRow.NEQCONFIG}
onClick={costJobsSpecExcludeCostEquipment}
>
Исключить из задания
@ -382,11 +427,12 @@ const CostJobsSpecsDataGrid = ({ task, processIdent, clearSelectlist }) => {
<Box sx={STYLES.TABLE}>
<P8PDataGrid
{...P8P_DATA_GRID_CONFIG_PROPS}
columnsDef={costEquipment.columnsDef}
rows={costEquipment.rows}
containerComponentProps={{ sx: STYLES.DATA_GRID_CONTAINER, elevation: 1 }}
columnsDef={equipConfiguration.columnsDef}
rows={equipConfiguration.rows}
size={P8P_DATA_GRID_SIZE.SMALL}
morePages={costEquipment.morePages}
reloading={costEquipment.reload}
morePages={equipConfiguration.morePages}
reloading={equipConfiguration.reload}
onOrderChanged={costEquipmentOrderChanged}
onPagesCountChanged={costEquipmentPagesCountChanged}
dataCellRender={prms =>
@ -394,25 +440,35 @@ const CostJobsSpecsDataGrid = ({ task, processIdent, clearSelectlist }) => {
...prms,
handleSelectChange,
sUnit: sUnitCostEquipment,
selectedEquip: costEquipment.selectedRows
selectedRow: equipConfiguration.selectedRow.NRN,
selectedJobSpec: costJobsSpecs.selectedRow
})
}
headCellRender={prms => headCellRender({ ...prms })}
fixedHeader={true}
/>
</Box>
</>
) : null}
</Grid>
</Grid>
{includeEquipment.NFCJOBSSP && includeEquipment.NFCJOBSSP ? (
<CostJobsSpecsInclude
includeEquipment={includeEquipment}
setIncludeEquipment={setIncludeEquipment}
setCostJobsSpecs={setCostJobsSpecs}
setEquipConfiguration={setEquipConfiguration}
includeEquipConfiguration={includeEquipConfiguration}
/>
) : null}
</div>
);
};
//Контроль свойств - Таблица информации об операциях сменного задания
//Контроль свойств - Таблица информации о строках сменного задания
CostJobsSpecsDataGrid.propTypes = {
task: PropTypes.number.isRequired,
processIdent: PropTypes.number,
clearSelectlist: PropTypes.func
haveNote: PropTypes.bool.isRequired
};
//----------------

View File

@ -1,13 +1,21 @@
/*
Парус 8 - Панели мониторинга - ПУП - Выдача сменного задания
Кастомные хуки
*/
//---------------------
//Подключение библиотек
//---------------------
import React from "react"; //Классы React
import React, { useState, useCallback, useEffect, useContext } from "react"; //Классы React
import { BackEndСtx } from "../../context/backend"; //Контекст взаимодействия с сервером
import { object2Base64XML } from "../../core/utils"; //Вспомогательные функции
//---------
//Константы
//---------
//Размер страницы данных
const DATA_GRID_PAGE_SIZE = 50;
//---------------------------------------------
//Вспомогательные функции форматирования данных
//---------------------------------------------
//-----------
//Тело модуля
@ -21,3 +29,242 @@ export const useFilteredFcjobs = (jobs, filter) => {
return filteredJobs;
};
//Хук для основной таблицы
const useCostJobs = () => {
//Собственное состояние - таблица данных
const [state, setState] = useState({
init: false,
showJobList: false,
jobList: [],
jobListLoaded: false,
selectedJob: {},
dataLoaded: false
});
//Подключение к контексту взаимодействия с сервером
const { executeStored } = useContext(BackEndСtx);
//При подключении компонента к странице
useEffect(() => {
const initPlans = async () => {
const data = await executeStored({
stored: "PKG_P8PANELS_MECHREC.FCJOBS_INIT",
args: {},
respArg: "COUT",
isArray: name => name === "XFCJOBS",
attributeValueProcessor: (name, val) => (["NHAVE_NOTE"].includes(name) ? val == 1 : val)
});
setState(pv => ({
...pv,
init: true,
jobList: [...(data.XFCJOBS || [])],
jobListLoaded: true
}));
};
if (!state.init) {
initPlans();
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);
return [state, setState];
};
//Хук для таблицы операций
const useCostJobsSpecs = task => {
//Собственное состояние - таблица данных
const [costJobsSpecs, setCostJobsSpecs] = useState({
task: null,
dataLoaded: false,
columnsDef: [],
orders: null,
rows: [],
selectedRow: {},
reload: true,
pageNumber: 1,
morePages: true
});
//Подключение к контексту взаимодействия с сервером
const { executeStored, SERV_DATA_TYPE_CLOB } = useContext(BackEndСtx);
//Выдача задания
const issueCostJobsSpecs = useCallback(
async prms => {
try {
await executeStored({
stored: "PKG_P8PANELS_MECHREC.FCJOBSSP_ISSUE",
args: { NFCJOBS: prms.NFCJOBS, SFCJOBSSP_LIST: prms.SFCJOBSSP_LIST }
});
} catch (e) {
throw new Error(e.message);
}
},
[executeStored]
);
//При необходимости обновить данные таблицы
useEffect(() => {
//Если изменилось сменное задание - обновляем состояние
if (costJobsSpecs.dataLoaded && costJobsSpecs.task !== task) {
setCostJobsSpecs(pv => ({
...pv,
dataLoaded: false,
columnsDef: [],
orders: null,
rows: [],
selectedRow: {},
reload: true,
pageNumber: 1,
morePages: true
}));
}
//Если необходимо перезагрузить
if (costJobsSpecs.reload) {
const loadData = async () => {
const data = await executeStored({
stored: "PKG_P8PANELS_MECHREC.FCJOBSSP_DG_GET",
args: {
NFCJOBS: task,
NPAGE_NUMBER: costJobsSpecs.pageNumber,
NPAGE_SIZE: DATA_GRID_PAGE_SIZE,
CORDERS: { VALUE: object2Base64XML(costJobsSpecs.orders, { arrayNodeName: "orders" }), SDATA_TYPE: SERV_DATA_TYPE_CLOB },
NINCLUDE_DEF: costJobsSpecs.dataLoaded ? 0 : 1
},
respArg: "COUT",
attributeValueProcessor: (name, val) => (["NSELECT"].includes(name) ? val === 1 : val)
});
setCostJobsSpecs(pv => ({
...pv,
task: task,
columnsDef: data.XCOLUMNS_DEF ? [...data.XCOLUMNS_DEF] : pv.columnsDef,
rows: pv.pageNumber == 1 ? [...(data.XROWS || [])] : [...pv.rows, ...(data.XROWS || [])],
dataLoaded: true,
reload: false,
morePages: (data.XROWS || []).length >= DATA_GRID_PAGE_SIZE
}));
};
loadData();
}
}, [
SERV_DATA_TYPE_CLOB,
costJobsSpecs.dataLoaded,
costJobsSpecs.orders,
costJobsSpecs.pageNumber,
costJobsSpecs.reload,
costJobsSpecs.selectedRow,
costJobsSpecs.task,
executeStored,
task
]);
return [costJobsSpecs, setCostJobsSpecs, issueCostJobsSpecs];
};
//Хук для таблицы рабочих центров
const useEquipConfiguration = task => {
//Собственное состояние - таблица данных
const [equipConfiguration, setEquipConfiguration] = useState({
task: null,
dataLoaded: false,
columnsDef: [],
orders: null,
rows: [],
selectedRow: {},
reload: true,
pageNumber: 1,
morePages: true
});
//Подключение к контексту взаимодействия с сервером
const { executeStored, SERV_DATA_TYPE_CLOB } = useContext(BackEndСtx);
//Включение станка в строку сменного задания
const includeEquipConfiguration = useCallback(
async prms => {
try {
await executeStored({
stored: "PKG_P8PANELS_MECHREC.FCJOBSSP_INC_EQCONFIG",
args: { NEQCONFIG: prms.NEQCONFIG, NFCJOBSSP: prms.NFCJOBSSP, NQUANT_PLAN: prms.NQUANT_PLAN }
});
} catch (e) {
throw new Error(e.message);
}
},
[executeStored]
);
//Исключение станка из строки сменного задания
const excludeEquipConfiguration = useCallback(
async prms => {
try {
await executeStored({
stored: "PKG_P8PANELS_MECHREC.FCJOBSSP_EXC_EQCONFIG",
args: { NFCJOBSSP: prms.NFCJOBSSP }
});
} catch (e) {
throw new Error(e.message);
}
},
[executeStored]
);
//При необходимости обновить данные таблицы
useEffect(() => {
//Если изменилось сменное задание - обновляем состояние
if (equipConfiguration.dataLoaded && equipConfiguration.task !== task) {
setEquipConfiguration(pv => ({
...pv,
dataLoaded: false,
columnsDef: [],
orders: null,
rows: [],
selectedRow: {},
reload: true,
pageNumber: 1,
morePages: true
}));
}
if (equipConfiguration.reload) {
const loadData = async () => {
const data = await executeStored({
stored: "PKG_P8PANELS_MECHREC.EQCONFIG_DG_GET",
args: {
NFCJOBS: task,
CORDERS: { VALUE: object2Base64XML(equipConfiguration.orders, { arrayNodeName: "orders" }), SDATA_TYPE: SERV_DATA_TYPE_CLOB },
NPAGE_NUMBER: equipConfiguration.pageNumber,
NPAGE_SIZE: DATA_GRID_PAGE_SIZE,
NINCLUDE_DEF: equipConfiguration.dataLoaded ? 0 : 1
},
respArg: "COUT",
attributeValueProcessor: (name, val) => (["NSELECT"].includes(name) ? val === 1 : val)
});
setEquipConfiguration(pv => ({
...pv,
task: task,
columnsDef: data.XCOLUMNS_DEF ? [...data.XCOLUMNS_DEF] : pv.columnsDef,
rows: pv.pageNumber == 1 ? [...(data.XROWS || [])] : [...pv.rows, ...(data.XROWS || [])],
dataLoaded: true,
reload: false,
morePages: (data.XROWS || []).length >= DATA_GRID_PAGE_SIZE
}));
};
loadData();
}
}, [
SERV_DATA_TYPE_CLOB,
equipConfiguration.dataLoaded,
equipConfiguration.orders,
equipConfiguration.pageNumber,
equipConfiguration.reload,
equipConfiguration.selectedRow,
equipConfiguration.task,
task,
executeStored
]);
return [equipConfiguration, setEquipConfiguration, includeEquipConfiguration, excludeEquipConfiguration];
};
export { useCostJobs, useCostJobsSpecs, useEquipConfiguration };

View File

@ -7,13 +7,12 @@
//Подключение библиотек
//---------------------
import React, { useContext, useState, useCallback, useEffect } from "react"; //Классы React
import React, { useContext, useState } from "react"; //Классы React
import PropTypes from "prop-types"; //Контроль свойств компонента
import { Drawer, Fab, Box, List, ListItemButton, ListItemText, Typography, TextField } from "@mui/material"; //Интерфейсные элементы
import { BackEndСtx } from "../../context/backend"; //Контекст взаимодействия с сервером
import { MessagingСtx } from "../../context/messaging"; //Контекст сообщений
import { useFilteredFcjobs } from "./hooks"; //Вспомогательные хуки
import { CostJobsSpecsDataGrid } from "./fcjobssp"; //Собственные хуки таблиц
import { useCostJobs, useFilteredFcjobs } from "./hooks"; //Вспомогательные хуки
//---------
//Константы
@ -30,7 +29,7 @@ const STYLES = {
flexShrink: 0,
[`& .MuiDrawer-paper`]: { width: "350px", display: "inline-block", boxSizing: "border-box" }
},
CONTAINER: { margin: "5px 0px", textAlign: "center" }
CONTAINER: { textAlign: "center" }
};
//------------------------------------
@ -80,15 +79,7 @@ JobList.propTypes = {
//Корневая панель выдачи сменного задания
const MechRecCostJobs = () => {
//Собственное состояние - таблица данных
const [state, setState] = useState({
init: false,
showJobList: false,
jobList: [],
jobListLoaded: false,
selectedJob: {},
processIdent: null,
dataLoaded: false
});
const [state, setState] = useCostJobs();
//Состояние для фильтра каталогов
const [filter, setFilter] = useState({ jobName: "" });
@ -96,57 +87,11 @@ const MechRecCostJobs = () => {
//Массив отфильтрованных каталогов
const filteredJobs = useFilteredFcjobs(state.jobList, filter);
//Подключение к контексту взаимодействия с сервером
const { executeStored } = useContext(BackEndСtx);
//Подключение к контексту сообщений
const { InlineMsgInfo } = useContext(MessagingСtx);
//Инициализация каталогов планов
const initPlans = useCallback(async () => {
if (!state.init) {
const data = await executeStored({
stored: "PKG_P8PANELS_MECHREC.FCJOBS_INIT",
args: {},
respArg: "COUT",
fullResponse: true,
isArray: name => name === "XFCJOBS"
});
setState(pv => ({
...pv,
init: true,
jobList: [...(data.XPAYLOAD?.XFCJOBS || [])],
jobListLoaded: true,
processIdent: data.XPAYLOAD.XINFO.NPROCESS_IDENT
}));
}
}, [state.init, executeStored]);
//При подключении компонента к странице
useEffect(() => {
initPlans();
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);
//Очистка селектлиста по идентификатору процесса
const clearSelectlist = useCallback(
async NIDENT => {
try {
await executeStored({
stored: "P_SELECTLIST_CLEAR",
args: { NIDENT: NIDENT }
});
} catch (e) {
throw new Error(e.message);
}
},
[executeStored]
);
//Выбор плана
const selectJob = job => {
//Очищаем селектлист
clearSelectlist(state.processIdent);
//Обновляем состояние
setState(pv => ({
...pv,
@ -158,8 +103,6 @@ const MechRecCostJobs = () => {
//Сброс выбора плана
const unselectJob = () => {
//Очищаем селектлист
clearSelectlist(state.processIdent);
//Обновляем состояние
setState(pv => ({
...pv,
@ -187,11 +130,12 @@ const MechRecCostJobs = () => {
<div style={STYLES.CONTAINER}>
{state.selectedJob.NRN ? (
<>
<Typography variant={"h6"}>{`Сменное задание "${state.selectedJob.SSUBDIV}" на ${state.selectedJob.SPERIOD}`}</Typography>
<CostJobsSpecsDataGrid task={state.selectedJob.NRN} processIdent={state.processIdent} clearSelectlist={clearSelectlist} />
<Typography variant={"h6"}>{`Сменное задание №${state.selectedJob.SDOC_NUMB} на ${state.selectedJob.SPERIOD}`}</Typography>
<Typography variant={"h6"}>{`${state.selectedJob.SSUBDIV}`}</Typography>
<CostJobsSpecsDataGrid task={state.selectedJob.NRN} haveNote={state.selectedJob.NHAVE_NOTE} />
</>
) : !state.selectedJob.NRN ? (
<InlineMsgInfo okBtn={false} text={"Укажите сменное задание"} />
<InlineMsgInfo okBtn={false} text={"Укажите сменное задание для отображения информации"} />
) : null}
</div>
</Box>

View File

@ -0,0 +1,137 @@
/*
Парус 8 - Панели мониторинга - ПУП - Загрузка цеха
Компонент панели: Фильтр
*/
//---------------------
//Подключение библиотек
//---------------------
import React from "react"; //Классы React
import PropTypes from "prop-types"; //Контроль свойств компонента
import {
Typography,
Box,
Dialog,
DialogContent,
DialogActions,
Button,
IconButton,
Icon,
FormControl,
InputLabel,
OutlinedInput,
InputAdornment
} from "@mui/material"; //Интерфейсные элементы
import { InsDepartmentDataGrid } from "./ins_department_dg"; //Таблица подразделений цехов
//---------
//Константы
//---------
//Текущая дата
const currentDate = new Date();
const currentMonth = currentDate.getUTCMonth() + 1;
const currentYear = currentDate.getUTCFullYear();
//Стили
const STYLES = {
FILTER_BLOCK: { maxWidth: "200px" }
};
//------------------------------------
//Вспомогательные функции и компоненты
//------------------------------------
//Диалог выбора подразделения
const DepartmentsDataGrid = ({ filter, setFilter, handleSelectDeparture }) => {
return (
<Dialog fullWidth open onClose={() => setFilter(pv => ({ ...pv, openedDepartment: false }))}>
<DialogContent>
<InsDepartmentDataGrid fullDate={filter.date.fullDate} handleSelectDeparture={handleSelectDeparture} />
</DialogContent>
<DialogActions>
<Button onClick={() => setFilter(pv => ({ ...pv, openedDepartment: false }))}>Закрыть</Button>
</DialogActions>
</Dialog>
);
};
//Контроль свойств - Диалог выбора подразделения
DepartmentsDataGrid.propTypes = {
filter: PropTypes.object.isRequired,
setFilter: PropTypes.func.isRequired,
handleSelectDeparture: PropTypes.func.isRequired
};
//-----------
//Тело модуля
//-----------
//Компонент фильтра
const FilterComponent = ({ filter, setFilter, handleMonthChange, handleSelectDeparture }) => {
return (
<Box display="flex" flexDirection="row" justifyContent="flex-start" alignItems="flex-end" pt={1.5} pl={1}>
<FormControl sx={STYLES.FILTER_BLOCK} readOnly fullWidth variant="outlined">
<InputLabel required={!filter.department.SCODE} htmlFor="department-outlined">
Цех
</InputLabel>
<OutlinedInput
disabled
id="department-outlined"
value={filter.department.SCODE}
endAdornment={
<InputAdornment position="end">
<IconButton
aria-label="department select"
onClick={() => setFilter(pv => ({ ...pv, openedDepartment: true }))}
edge="end"
>
<Icon>list</Icon>
</IconButton>
</InputAdornment>
}
aria-describedby="department-outlined-helper-text"
label="Цех"
/>
</FormControl>
<Box sx={STYLES.FILTER_BLOCK} display="flex" pb={1}>
<Box>
<IconButton onClick={() => handleMonthChange(-1)}>
<Icon>navigate_before</Icon>
</IconButton>
</Box>
<Typography variant="h5" pt={0.5}>
{filter.date.fullDate}
</Typography>
<Box>
<IconButton
onClick={() => handleMonthChange(1)}
disabled={filter.date.year === currentYear && filter.date.month === currentMonth}
>
<Icon>navigate_next</Icon>
</IconButton>
</Box>
</Box>
<Typography variant="subtitle2" pl={2} pb={2}>{`Рабочих дней: ${filter.workDays}`}</Typography>
<Typography variant="subtitle2" pl={3.5} pb={2}>{`Рабочих часов: ${filter.totalWorkHours}`}</Typography>
{filter.openedDepartment ? (
<DepartmentsDataGrid filter={filter} setFilter={setFilter} handleSelectDeparture={handleSelectDeparture} />
) : null}
</Box>
);
};
//Контроль свойств - Компонент фильтра
FilterComponent.propTypes = {
filter: PropTypes.object.isRequired,
setFilter: PropTypes.func.isRequired,
handleMonthChange: PropTypes.func.isRequired,
handleSelectDeparture: PropTypes.func.isRequired
};
//----------------
//Интерфейс модуля
//----------------
export { FilterComponent };

View File

@ -0,0 +1,85 @@
/*
Парус 8 - Панели мониторинга - ПУП - Загрузка цеха
Компонент панели: Таблица строк подразделений цехов
*/
//---------------------
//Подключение библиотек
//---------------------
import React from "react"; //Классы React
import PropTypes from "prop-types"; //Контроль свойств компонента
import { Typography } from "@mui/material"; //Интерфейсные элементы
import { P8PDataGrid, P8P_DATA_GRID_SIZE } from "../../../components/p8p_data_grid"; //Таблица данных
import { P8P_DATA_GRID_CONFIG_PROPS } from "../../../config_wrapper"; //Подключение компонентов к настройкам приложения
import { useInsDepartment } from "../hooks"; //Состояние таблицы подразделений цехов
//---------
//Константы
//---------
//Стили
const STYLES = {
CONTAINER: { margin: "5px 0px", textAlign: "center" }
};
//------------------------------------
//Вспомогательные функции и компоненты
//------------------------------------
//Генерация ссылок на строках
const dataCellRender = ({ row, columnDef, handleSelectDeparture }) => {
return {
cellStyle: { cursor: "pointer", backgroundColor: "#ADD8E6" },
cellProps: {
onClick: () => {
handleSelectDeparture({ NRN: row["NRN"], SCODE: row["SCODE"].toString(), SNAME: row["SNAME"] });
}
},
data: row[columnDef.name]
};
};
//-----------
//Тело модуля
//-----------
//Таблица строк подразделений цехов
const InsDepartmentDataGrid = ({ fullDate, handleSelectDeparture }) => {
//Собственное состояние
let [insDepartments, setInsDepartments] = useInsDepartment(fullDate);
//При изменении количества отображаемых страниц
const handlePagesCountChanged = () => setInsDepartments(pv => ({ ...pv, pageNumber: pv.pageNumber + 1, reload: true }));
//Генерация содержимого
return (
<div style={STYLES.CONTAINER}>
<Typography variant={"subtitle2"}>Подразделения цехов</Typography>
{insDepartments.dataLoaded ? (
<P8PDataGrid
{...P8P_DATA_GRID_CONFIG_PROPS}
columnsDef={insDepartments.columnsDef}
rows={insDepartments.rows}
size={P8P_DATA_GRID_SIZE.LARGE}
morePages={insDepartments.morePages}
reloading={insDepartments.reload}
onPagesCountChanged={handlePagesCountChanged}
dataCellRender={prms => dataCellRender({ ...prms, handleSelectDeparture })}
/>
) : null}
</div>
);
};
//Контроль свойств - Таблица строк подразделений цехов
InsDepartmentDataGrid.propTypes = {
fullDate: PropTypes.string.isRequired,
handleSelectDeparture: PropTypes.func.isRequired
};
//----------------
//Интерфейс модуля
//----------------
export { InsDepartmentDataGrid };

View File

@ -0,0 +1,198 @@
/*
Парус 8 - Панели мониторинга - ПУП - Загрузка цеха
Кастомные хуки
*/
//---------------------
//Подключение библиотек
//---------------------
import { useState, useCallback, useEffect, useContext } from "react"; //Классы React
import { BackEndСtx } from "../../context/backend"; //Контекст взаимодействия с сервером
import { object2Base64XML, formatDateRF } from "../../core/utils"; //Вспомогательные функции
//---------
//Константы
//---------
//Размер страницы данных
const DATA_GRID_PAGE_SIZE_SMALL = 5;
const DATA_GRID_PAGE_SIZE_LARGE = 12;
//-----------
//Тело модуля
//-----------
//Хук для основной таблицы панели
const useMechRecDeptCostJobs = (subdiv, fullDate, workHours) => {
//Собственное состояние - таблица данных
const [costJobs, setCostJobs] = useState({
dataLoaded: false,
columnsDef: [],
orders: null,
rows: [],
reload: true,
pageNumber: 1,
morePages: true,
fixedHeader: false,
fixedColumns: 0,
date: null
});
//Подключение к контексту взаимодействия с сервером
const { executeStored, SERV_DATA_TYPE_CLOB } = useContext(BackEndСtx);
//При необходимости обновить данные таблицы
useEffect(() => {
//Если указано подразделение и необходимо обновить, либо изменилась дата
if (subdiv && (costJobs.reload || costJobs.date !== fullDate)) {
const loadData = async () => {
const data = await executeStored({
stored: "PKG_P8PANELS_MECHREC.FCJOBS_DEP_LOAD_DG_GET",
args: {
NSUBDIV: subdiv,
SMONTH_YEAR: fullDate,
NWORKHOURS: workHours,
CORDERS: { VALUE: object2Base64XML(costJobs.orders, { arrayNodeName: "orders" }), SDATA_TYPE: SERV_DATA_TYPE_CLOB },
NPAGE_NUMBER: costJobs.pageNumber,
NPAGE_SIZE: DATA_GRID_PAGE_SIZE_LARGE,
NINCLUDE_DEF: 1
},
respArg: "COUT"
});
setCostJobs(pv => ({
...pv,
fixedHeader: data.XDATA_GRID.fixedHeader,
fixedColumns: data.XDATA_GRID.fixedColumns,
columnsDef: data.XCOLUMNS_DEF ? [...data.XCOLUMNS_DEF] : pv.columnsDef,
rows: pv.pageNumber == 1 ? [...(data.XROWS || [])] : [...pv.rows, ...(data.XROWS || [])],
dataLoaded: true,
reload: false,
morePages: (data.XROWS || []).length >= DATA_GRID_PAGE_SIZE_LARGE,
date: fullDate
}));
};
loadData();
}
}, [costJobs.reload, subdiv, fullDate, costJobs.date, costJobs.orders, costJobs.pageNumber, executeStored, workHours, SERV_DATA_TYPE_CLOB]);
return [costJobs, setCostJobs];
};
//Хук таблицы подразделений цехов
const useInsDepartment = fullDate => {
//Собственное состояние
let [insDepartments, setInsDepartments] = useState({
dataLoaded: false,
columnsDef: [],
rows: [],
reload: true,
pageNumber: 1,
morePages: true
});
//Подключение к контексту взаимодействия с сервером
const { executeStored } = useContext(BackEndСtx);
//При необходимости обновить данные таблицы
useEffect(() => {
const loadData = async () => {
const data = await executeStored({
stored: "PKG_P8PANELS_MECHREC.INS_DEPARTMENT_DG_GET",
args: {
SMONTH_YEAR: fullDate,
NPAGE_SIZE: DATA_GRID_PAGE_SIZE_SMALL,
NINCLUDE_DEF: insDepartments.dataLoaded ? 0 : 1
},
respArg: "COUT",
attributeValueProcessor: (name, val) => (["DBGNDATE", "DENDDATE"].includes(name) ? formatDateRF(val) : val)
});
setInsDepartments(pv => ({
...pv,
columnsDef: data.XCOLUMNS_DEF ? [...data.XCOLUMNS_DEF] : pv.columnsDef,
rows: pv.pageNumber == 1 ? [...(data.XROWS || [])] : [...pv.rows, ...(data.XROWS || [])],
dataLoaded: true,
reload: false,
morePages: (data.XROWS || []).length >= DATA_GRID_PAGE_SIZE_SMALL
}));
};
if (insDepartments.reload) {
loadData();
}
}, [executeStored, fullDate, insDepartments.dataLoaded, insDepartments.reload]);
return [insDepartments, setInsDepartments];
};
//Хук для диалога фильтра
const useFilter = (currentMonth, currentYear) => {
//Собственное состояние - фильтр
const [filter, setFilter] = useState({
init: true,
openedDepartment: false,
date: {
month: currentMonth,
year: currentYear,
fullDate: currentMonth.toString().padStart(2, "0") + "." + currentYear
},
department: { NRN: null, SCODE: "", SNAME: "" },
workDays: 0,
workHours: 0,
totalWorkHours: 0
});
//Подключение к контексту взаимодействия с сервером
const { executeStored } = useContext(BackEndСtx);
//Считываем количества рабочих дней
const getWorkDays = useCallback(
async ({ newDate, init }) => {
const data = await executeStored({
stored: "PKG_P8PANELS_MECHREC.ENPERIOD_WORKDAYS_GET",
args: { SMONTH_YEAR: newDate.fullDate }
});
if (init) {
setFilter(pv => ({ ...pv, workDays: data.NWORKDAYS, init: false }));
} else {
setFilter(pv => ({
...pv,
date: { ...newDate },
department: filter.department,
workDays: data.NWORKDAYS,
totalWorkHours: data.NWORKDAYS * filter.workHours
}));
}
},
[executeStored, filter]
);
//Считываем количество рабочих часов
const getWorkHours = useCallback(
async department => {
const data = await executeStored({
stored: "PKG_P8PANELS_MECHREC.INS_DEPARTMENT_WORKHOURS_GET",
args: { NSUBDIV: department.NRN }
});
setFilter(pv => ({
...pv,
openedDepartment: false,
department: { ...department },
workHours: data.NWORKHOURS,
totalWorkHours: filter.workDays * data.NWORKHOURS
}));
},
[executeStored, filter.workDays]
);
//При необходимости обновить данные таблицы
useEffect(() => {
if (filter.init) {
getWorkDays({ newDate: { month: filter.date.month, year: filter.date.year, fullDate: filter.date.fullDate }, init: filter.init });
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [filter.init]);
return [filter, setFilter, getWorkDays, getWorkHours];
};
export { useMechRecDeptCostJobs, useInsDepartment, useFilter };

View File

@ -7,34 +7,62 @@
//Подключение библиотек
//---------------------
import React, { useState, useContext, useCallback, useEffect } from "react"; //Классы React
import { Typography, Box, Grid } from "@mui/material"; //Интерфейсные элементы
import { object2Base64XML } from "../../core/utils"; //Вспомогательные процедуры и функции
import React from "react"; //Классы React
import { Typography, Box } from "@mui/material"; //Интерфейсные элементы
import { P8PDataGrid, P8P_DATA_GRID_SIZE } from "../../components/p8p_data_grid"; //Таблица данных
import { P8P_DATA_GRID_CONFIG_PROPS } from "../../config_wrapper"; //Подключение компонентов к настройкам приложения
import { BackEndСtx } from "../../context/backend"; //Контекст взаимодействия с сервером
import { useMechRecDeptCostJobs, useFilter } from "./hooks"; //Кастомные состояния
import { FilterComponent } from "./components/filter"; //Компонент фильтра
//---------
//Константы
//---------
//Размер страницы данных
const DATA_GRID_PAGE_SIZE = 5;
//Текущая дата
const currentDate = new Date();
const currentMonth = currentDate.getUTCMonth() + 1;
const currentYear = currentDate.getUTCFullYear();
//Кастомные цвета
const colors = {
lightred: "#ef8989",
lightyellow: "#f5f5b0",
blue: "#0097ff"
};
//Стили
const STYLES = {
CONTAINER: { textAlign: "center", paddingTop: "20px" },
CONTAINER: { textAlign: "center", paddingTop: "10px" },
TITLE: { paddingBottom: "15px" },
DATA_GRID_CONTAINER: { minWidth: "95vw", maxWidth: "95vw", minHeight: "80vh", maxHeight: "80vh" },
DATA_GRID_CELL: (row, columnDef) => ({
padding: "8px",
textOverflow: "ellipsis",
overflow: "hidden",
whiteSpace: "pre",
...(columnDef.name.match(/N.*_VALUE/) && row[columnDef.name]
? { backgroundColor: row[`${columnDef.name.substring(0, 12)}_TYPE`] === 0 ? "lightgrey" : "lightgreen" }
: {})
})
DATA_GRID_CONTAINER: {
minWidth: "700px",
maxWidth: "100vw",
minHeight: "calc(100vh - 250px)",
maxHeight: "calc(100vh - 250px)"
},
DATA_GRID_CELL: (row, columnDef) => {
//Определяем тип дня
let dayType = columnDef.name.match(/N.*_VALUE/) ? row[`${columnDef.name.substring(0, 12)}_TYPE`] : null;
//Определяем процент загрузки
let procentLoad = columnDef.name === "SNAME" ? row["NPROCENT_LOAD"] : null;
return {
padding: "8px",
textOverflow: "ellipsis",
overflow: "hidden",
whiteSpace: "pre",
...(dayType
? {
backgroundColor: [1, 3].includes(dayType) ? "lightgrey" : dayType === 4 ? "lightgreen" : null,
color: [2, 3].includes(dayType) ? colors.blue : null
}
: procentLoad || procentLoad === 0
? {
backgroundColor:
procentLoad >= 85 ? "lightgreen" : procentLoad >= 50 ? colors.lightyellow : procentLoad > 0 ? colors.lightred : "lightgrey"
}
: {})
};
}
};
//------------------------------------
@ -54,54 +82,11 @@ const dataCellRender = ({ row, columnDef }) => ({
//Корневая панель загрузки цеха
const MechRecDeptCostJobs = () => {
//Собственное состояние - фильтр
const [filter, setFilter, getWorkDays, getWorkHours] = useFilter(currentMonth, currentYear);
//Собственное состояние - таблица данных
const [costJobs, setCostJobs] = useState({
subdiv: null,
dataLoaded: false,
columnsDef: [],
filters: [],
orders: null,
rows: [],
reload: true,
pageNumber: 1,
morePages: true,
fixedHeader: false,
fixedColumns: 0
});
//Подключение к контексту взаимодействия с сервером
const { executeStored, SERV_DATA_TYPE_CLOB } = useContext(BackEndСtx);
//Загрузка данных таблицы с сервера
const loadData = useCallback(async () => {
if (costJobs.reload) {
const data = await executeStored({
stored: "PKG_P8PANELS_MECHREC.FCJOBS_DEP_LOAD_DG_GET",
args: {
CFILTERS: { VALUE: object2Base64XML(costJobs.filters, { arrayNodeName: "filters" }), SDATA_TYPE: SERV_DATA_TYPE_CLOB },
CORDERS: { VALUE: object2Base64XML(costJobs.orders, { arrayNodeName: "orders" }), SDATA_TYPE: SERV_DATA_TYPE_CLOB },
NPAGE_NUMBER: costJobs.pageNumber,
NPAGE_SIZE: DATA_GRID_PAGE_SIZE,
NINCLUDE_DEF: costJobs.dataLoaded ? 0 : 1
},
respArg: "COUT"
});
setCostJobs(pv => ({
...pv,
fixedHeader: data.XFCJOBS.XDATA.XDATA_GRID.fixedHeader,
fixedColumns: data.XFCJOBS.XDATA.XDATA_GRID.fixedColumns,
subdiv: data.XINFO.SSUBDIV,
columnsDef: data.XFCJOBS.XDATA.XCOLUMNS_DEF ? [...data.XFCJOBS.XDATA.XCOLUMNS_DEF] : pv.columnsDef,
rows: pv.pageNumber == 1 ? [...(data.XFCJOBS.XDATA.XROWS || [])] : [...pv.rows, ...(data.XFCJOBS.XDATA.XROWS || [])],
dataLoaded: true,
reload: false,
morePages: (data.XFCJOBS.XDATA.XROWS || []).length >= DATA_GRID_PAGE_SIZE
}));
}
}, [costJobs.reload, costJobs.filters, costJobs.orders, costJobs.dataLoaded, costJobs.pageNumber, executeStored, SERV_DATA_TYPE_CLOB]);
//При изменении состояния фильтра
const handleFilterChanged = ({ filters }) => setCostJobs(pv => ({ ...pv, filters: [...filters], pageNumber: 1, reload: true }));
const [costJobs, setCostJobs] = useMechRecDeptCostJobs(filter.department.NRN, filter.date.fullDate, filter.totalWorkHours);
//При изменении состояния сортировки
const handleOrderChanged = ({ orders }) => setCostJobs(pv => ({ ...pv, orders: [...orders], pageNumber: 1, reload: true }));
@ -109,41 +94,69 @@ const MechRecDeptCostJobs = () => {
//При изменении количества отображаемых страниц
const handlePagesCountChanged = () => setCostJobs(pv => ({ ...pv, pageNumber: pv.pageNumber + 1, reload: true }));
//При необходимости обновить данные таблицы
useEffect(() => {
loadData();
}, [costJobs.reload, loadData]);
//При изменении месяца
const handleMonthChange = side => {
//Исходим от стороны, в которую идем
let newDate =
side === 1
? filter.date.month === 12
? { month: 1, year: filter.date.year + 1 }
: { month: filter.date.month + 1, year: filter.date.year }
: filter.date.month === 1
? { month: 12, year: filter.date.year - 1 }
: { month: filter.date.month - 1, year: filter.date.year };
//Формируем полное представление даты
newDate.fullDate = newDate.month.toString().padStart(2, "0") + "." + newDate.year;
//Считываем количество рабочих дней и обновляем состояние
getWorkDays({ newDate, init: filter.init });
};
//При выборе подразделения
const handleSelectDeparture = department => {
//Если подразделение изменилось
if (department.NRN !== filter.department.NRN) {
//Получаем количество рабочих часов
getWorkHours(department);
//Обновляем таблицу загрузки цеха
setCostJobs(pv => ({ ...pv, pageNumber: 1, reload: true }));
} else {
setFilter(pv => ({ ...pv, openedDepartment: false }));
}
};
//Генерация содержимого
return (
<div style={STYLES.CONTAINER}>
<Typography sx={STYLES.TITLE} variant={"h6"}>
{costJobs.dataLoaded ? `Загрузка станков "${costJobs.subdiv}"` : null}
</Typography>
<Grid container spacing={1}>
<Grid item xs={12}>
<Box pt={1} display="flex" justifyContent="center" alignItems="center">
{costJobs.dataLoaded ? (
<P8PDataGrid
{...P8P_DATA_GRID_CONFIG_PROPS}
containerComponentProps={{ elevation: 6, style: STYLES.DATA_GRID_CONTAINER }}
fixedHeader={costJobs.fixedHeader}
fixedColumns={costJobs.fixedColumns}
columnsDef={costJobs.columnsDef}
rows={costJobs.rows}
size={P8P_DATA_GRID_SIZE.LARGE}
morePages={costJobs.morePages}
reloading={costJobs.reload}
onOrderChanged={handleOrderChanged}
onFilterChanged={handleFilterChanged}
onPagesCountChanged={handlePagesCountChanged}
dataCellRender={prms => dataCellRender({ ...prms })}
/>
) : null}
</Box>
</Grid>
</Grid>
</div>
<Box>
<FilterComponent
filter={filter}
setFilter={setFilter}
handleMonthChange={handleMonthChange}
handleSelectDeparture={handleSelectDeparture}
/>
<div style={STYLES.CONTAINER}>
<Typography sx={STYLES.TITLE} variant={"h6"}>
{costJobs.dataLoaded ? `Загрузка станков "${filter.department.SNAME}"` : null}
</Typography>
<Box pt={1} display="flex" justifyContent="center" alignItems="center">
{costJobs.dataLoaded ? (
<P8PDataGrid
{...P8P_DATA_GRID_CONFIG_PROPS}
containerComponentProps={{ elevation: 6, style: STYLES.DATA_GRID_CONTAINER }}
fixedHeader={costJobs.fixedHeader}
fixedColumns={costJobs.fixedColumns}
columnsDef={costJobs.columnsDef}
rows={costJobs.rows}
size={P8P_DATA_GRID_SIZE.LARGE}
morePages={costJobs.morePages}
reloading={costJobs.reload}
onOrderChanged={handleOrderChanged}
onPagesCountChanged={handlePagesCountChanged}
dataCellRender={prms => dataCellRender({ ...prms })}
/>
) : null}
</Box>
</div>
</Box>
);
};

View File

@ -7,14 +7,14 @@
//Подключение библиотек
//---------------------
import React, { useState, useCallback, useEffect, useContext } from "react"; //Классы React
import React, { useState, useContext } from "react"; //Классы React
import PropTypes from "prop-types"; //Контроль свойств компонента
import { Typography, Box, Paper, Dialog, DialogContent, DialogActions, Button, TextField, IconButton, Icon } from "@mui/material"; //Интерфейсные элементы
import { P8PDataGrid, P8P_DATA_GRID_SIZE } from "../../components/p8p_data_grid"; //Таблица данных
import { P8P_DATA_GRID_CONFIG_PROPS } from "../../config_wrapper"; //Подключение компонентов к настройкам приложения
import { BackEndСtx } from "../../context/backend"; //Контекст взаимодействия с сервером
import { object2Base64XML } from "../../core/utils"; //Вспомогательные функции
import { CostRouteListsSpecsDataGrid } from "./fcroutlstsp"; //Состояние таблицы заказов маршрутных листов
import { useCostRouteLists } from "./hooks.js"; //Хук состояния таблицы маршрутных листов
//---------
//Константы
@ -24,12 +24,11 @@ import { CostRouteListsSpecsDataGrid } from "./fcroutlstsp"; //Состояни
const STYLES = {
CONTAINER: { textAlign: "center" },
TABLE: { paddingTop: "15px" },
TABLE_SUM: { textAlign: "right", paddingTop: "5px", paddingRight: "15px" },
DIALOG_BUTTONS: { marginTop: "10px", width: "240px" }
};
//---------------------------------------------
//Вспомогательные функции форматирования данных
//Вспомогательные функции и компоненты
//---------------------------------------------
//Генерация представления расширения строки
@ -43,113 +42,41 @@ export const rowExpandRender = ({ row }) => {
//Форматирование значений колонок
const dataCellRender = ({ row, columnDef, handlePriorEditOpen }) => {
//!!! Пока отключено - не удалять
switch (columnDef.name) {
case "NPRIOR_PARTY":
return {
data: (
<>
{row["NPRIOR_PARTY"]}
<IconButton edge="end" title="Изменить приоритет" onClick={() => handlePriorEditOpen(row["NRN"], row["NPRIOR_PARTY"])}>
<Icon>edit</Icon>
</IconButton>
</>
)
};
//Если колонка "Приоритет партии"
if (columnDef.name === "NPRIOR_PARTY") {
return {
data: (
<>
{row["NPRIOR_PARTY"]}
<IconButton edge="end" title="Изменить приоритет" onClick={() => handlePriorEditOpen(row["NRN"])}>
<Icon>edit</Icon>
</IconButton>
</>
)
};
}
return {
data: row[columnDef]
};
};
//-----------
//Тело модуля
//-----------
//Диалог с изменением приоритета маршрутного листа
const CostRouteListPriorChange = ({ costRouteLists, setCostRouteLists, executeStored }) => {
//Считывание изначального значения приоритета МЛ
const initPrior = costRouteLists.rows[costRouteLists.rows.findIndex(obj => obj.NRN == costRouteLists.editPriorNRN)].NPRIOR_PARTY;
//Таблица маршрутных листов
const CostRouteListsDataGrid = ({ task }) => {
//Собственное состояние - таблица данных
const [costRouteLists, setCostRouteLists] = useState({
dataLoaded: false,
columnsDef: [],
orders: null,
rows: [],
reload: true,
pageNumber: 1,
morePages: true,
editPriorNRN: null,
editPriorValue: null
});
//Подключение к контексту взаимодействия с сервером
const { executeStored, SERV_DATA_TYPE_CLOB } = useContext(BackEndСtx);
//Размер страницы данных
const DATA_GRID_PAGE_SIZE = 5;
//Загрузка данных таблицы с сервера
const loadData = useCallback(async () => {
if (costRouteLists.reload) {
const data = await executeStored({
stored: "PKG_P8PANELS_MECHREC.FCROUTLST_DEPT_DG_GET",
args: {
NFCPRODPLANSP: task,
CORDERS: { VALUE: object2Base64XML(costRouteLists.orders, { arrayNodeName: "orders" }), SDATA_TYPE: SERV_DATA_TYPE_CLOB },
NPAGE_NUMBER: costRouteLists.pageNumber,
NPAGE_SIZE: DATA_GRID_PAGE_SIZE,
NINCLUDE_DEF: costRouteLists.dataLoaded ? 0 : 1
},
respArg: "COUT"
});
setCostRouteLists(pv => ({
...pv,
columnsDef: data.XCOLUMNS_DEF ? [...data.XCOLUMNS_DEF] : pv.columnsDef,
rows: pv.pageNumber == 1 ? [...(data.XROWS || [])] : [...pv.rows, ...(data.XROWS || [])],
dataLoaded: true,
reload: false,
morePages: (data.XROWS || []).length >= DATA_GRID_PAGE_SIZE
}));
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [
costRouteLists.reload,
costRouteLists.filters,
costRouteLists.orders,
costRouteLists.dataLoaded,
costRouteLists.pageNumber,
executeStored,
SERV_DATA_TYPE_CLOB
]);
//При необходимости обновить данные таблицы
useEffect(() => {
loadData();
}, [costRouteLists.reload, loadData]);
//При изменении состояния сортировки
const handleOrderChanged = ({ orders }) => setCostRouteLists(pv => ({ ...pv, orders: [...orders], pageNumber: 1, reload: true }));
//При изменении количества отображаемых страниц
const handlePagesCountChanged = () => setCostRouteLists(pv => ({ ...pv, pageNumber: pv.pageNumber + 1, reload: true }));
//При открытии изменения приоритета партии
const handlePriorEditOpen = (NRN, nPriorValue) => {
setCostRouteLists(pv => ({ ...pv, editPriorNRN: NRN, editPriorValue: nPriorValue }));
};
//Собственное состояние - Значение приоритета
const [state, setState] = useState(initPrior);
//При закрытии изменения приоритета партии
const handlePriorEditClose = () => {
setCostRouteLists(pv => ({ ...pv, editPriorNRN: null, editPriorValue: null }));
setCostRouteLists(pv => ({ ...pv, editPriorNRN: null }));
};
//При изменении значения приоритета партии
const handlePriorFormChanged = e => {
setCostRouteLists(pv => ({ ...pv, editPriorValue: e.target.value }));
};
//Изменение приоритета
const priorChange = useCallback(
async (NRN, PriorValue, rows) => {
//При нажатии на изменение приоритета партии
const handlePriorChange = () => {
//Асинхронное изменение
const asyncChange = async (NRN, PriorValue, rows) => {
try {
await executeStored({
stored: "PKG_P8PANELS_MECHREC.FCROUTLST_PRIOR_PARTY_UPDATE",
@ -164,14 +91,68 @@ const CostRouteListsDataGrid = ({ task }) => {
} catch (e) {
throw new Error(e.message);
}
},
[executeStored]
);
//При нажатии на изменение приоритета партии
const handlePriorChange = () => {
};
//Изменяем значение
priorChange(costRouteLists.editPriorNRN, costRouteLists.editPriorValue, costRouteLists.rows);
asyncChange(costRouteLists.editPriorNRN, state, costRouteLists.rows);
};
return (
<Dialog open onClose={() => handlePriorEditClose()}>
<DialogContent>
<Box>
<TextField
name="editPriorValue"
label="Новое значение приоритета"
variant="standard"
fullWidth
type="number"
value={state}
onChange={event => {
setState(event.target.value);
}}
/>
<Box>
<Button onClick={handlePriorChange} variant="contained" sx={STYLES.DIALOG_BUTTONS}>
Изменить
</Button>
</Box>
</Box>
</DialogContent>
<DialogActions>
<Button onClick={() => handlePriorEditClose(null)}>Закрыть</Button>
</DialogActions>
</Dialog>
);
};
//Контроль свойств - Диалог с изменением приоритета маршрутного листа
CostRouteListPriorChange.propTypes = {
costRouteLists: PropTypes.object.isRequired,
setCostRouteLists: PropTypes.func.isRequired,
executeStored: PropTypes.func.isRequired
};
//-----------
//Тело модуля
//-----------
//Таблица маршрутных листов
const CostRouteListsDataGrid = ({ task }) => {
//Собственное состояние - таблица данных
const [costRouteLists, setCostRouteLists] = useCostRouteLists(task);
//Подключение к контексту взаимодействия с сервером
const { executeStored } = useContext(BackEndСtx);
//При изменении состояния сортировки
const handleOrderChanged = ({ orders }) => setCostRouteLists(pv => ({ ...pv, orders: [...orders], pageNumber: 1, reload: true }));
//При изменении количества отображаемых страниц
const handlePagesCountChanged = () => setCostRouteLists(pv => ({ ...pv, pageNumber: pv.pageNumber + 1, reload: true }));
//При открытии изменения приоритета партии
const handlePriorEditOpen = NRN => {
setCostRouteLists(pv => ({ ...pv, editPriorNRN: NRN }));
};
//Генерация содержимого
@ -198,29 +179,7 @@ const CostRouteListsDataGrid = ({ task }) => {
</>
) : null}
{costRouteLists.editPriorNRN ? (
<Dialog open onClose={() => handlePriorEditClose(null)}>
<DialogContent>
<Box>
<TextField
name="editPriorValue"
label="Новое значение приоритета"
variant="standard"
fullWidth
type="number"
value={costRouteLists.editPriorValue}
onChange={handlePriorFormChanged}
/>
<Box>
<Button onClick={handlePriorChange} variant="contained" sx={STYLES.DIALOG_BUTTONS}>
Изменить
</Button>
</Box>
</Box>
</DialogContent>
<DialogActions>
<Button onClick={() => handlePriorEditClose(null)}>Закрыть</Button>
</DialogActions>
</Dialog>
<CostRouteListPriorChange costRouteLists={costRouteLists} setCostRouteLists={setCostRouteLists} executeStored={executeStored} />
) : null}
</div>
);

View File

@ -7,13 +7,12 @@
//Подключение библиотек
//---------------------
import React, { useState, useCallback, useEffect, useContext } from "react"; //Классы React
import React from "react"; //Классы React
import PropTypes from "prop-types"; //Контроль свойств компонента
import { Typography } from "@mui/material"; //Интерфейсные элементы
import { P8PDataGrid, P8P_DATA_GRID_SIZE } from "../../components/p8p_data_grid"; //Таблица данных
import { P8P_DATA_GRID_CONFIG_PROPS } from "../../config_wrapper"; //Подключение компонентов к настройкам приложения
import { BackEndСtx } from "../../context/backend"; //Контекст взаимодействия с сервером
import { object2Base64XML } from "../../core/utils"; //Вспомогательные функции
import { useCostRouteListsSpecs } from "./hooks.js"; //Хук состояния таблицы строк маршрутного листа
//---------
//Константы
@ -31,60 +30,7 @@ const STYLES = {
//Таблица строк маршрутного листа
const CostRouteListsSpecsDataGrid = ({ mainRowRN }) => {
//Собственное состояние - таблица данных
const [costRouteListsSpecs, setCostRouteListsSpecs] = useState({
dataLoaded: false,
columnsDef: [],
orders: null,
rows: [],
reload: true,
pageNumber: 1,
morePages: true
});
//Подключение к контексту взаимодействия с сервером
const { executeStored, SERV_DATA_TYPE_CLOB } = useContext(BackEndСtx);
//Размер страницы данных
const DATA_GRID_PAGE_SIZE = 10;
//Загрузка данных таблицы с сервера
const loadData = useCallback(async () => {
if (costRouteListsSpecs.reload) {
const data = await executeStored({
stored: "PKG_P8PANELS_MECHREC.FCROUTLSTSP_DEPT_DG_GET",
args: {
NFCROUTLST: mainRowRN,
CORDERS: { VALUE: object2Base64XML(costRouteListsSpecs.orders, { arrayNodeName: "orders" }), SDATA_TYPE: SERV_DATA_TYPE_CLOB },
NPAGE_NUMBER: costRouteListsSpecs.pageNumber,
NPAGE_SIZE: DATA_GRID_PAGE_SIZE,
NINCLUDE_DEF: costRouteListsSpecs.dataLoaded ? 0 : 1
},
respArg: "COUT"
});
setCostRouteListsSpecs(pv => ({
...pv,
columnsDef: data.XCOLUMNS_DEF ? [...data.XCOLUMNS_DEF] : pv.columnsDef,
rows: pv.pageNumber == 1 ? [...(data.XROWS || [])] : [...pv.rows, ...(data.XROWS || [])],
dataLoaded: true,
reload: false,
morePages: (data.XROWS || []).length >= DATA_GRID_PAGE_SIZE
}));
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [
costRouteListsSpecs.reload,
costRouteListsSpecs.filters,
costRouteListsSpecs.orders,
costRouteListsSpecs.dataLoaded,
costRouteListsSpecs.pageNumber,
executeStored,
SERV_DATA_TYPE_CLOB
]);
//При необходимости обновить данные таблицы
useEffect(() => {
loadData();
}, [costRouteListsSpecs.reload, loadData]);
const [costRouteListsSpecs, setCostRouteListsSpecs] = useCostRouteListsSpecs(mainRowRN);
//При изменении состояния сортировки
const handleOrderChanged = ({ orders }) => setCostRouteListsSpecs(pv => ({ ...pv, orders: [...orders], pageNumber: 1, reload: true }));

View File

@ -7,7 +7,17 @@
//Подключение библиотек
//---------------------
import React from "react"; //Классы React
import React, { useState, useEffect, useContext } from "react"; //Классы React
import { BackEndСtx } from "../../context/backend"; //Контекст взаимодействия с сервером
import { object2Base64XML, formatDateRF } from "../../core/utils"; //Вспомогательные функции
//---------
//Константы
//---------
//Размер страницы данных
const DATA_GRID_PAGE_SIZE_SMALL = 5;
const DATA_GRID_PAGE_SIZE_LARGE = 10;
//-----------
//Тело модуля
@ -21,3 +31,246 @@ export const useFilteredPlans = (plans, filter) => {
return filteredPlans;
};
//Хук для основной таблицы
const useDeptCostProdPlans = () => {
//Собственное состояние - таблица данных
const [state, setState] = useState({
init: false,
showPlanList: false,
showIncomeFromDeps: null,
showFcroutelst: null,
planList: [],
planListLoaded: false,
selectedPlan: {},
dataLoaded: false,
columnsDef: [],
orders: null,
rows: [],
reload: true,
pageNumber: 1,
morePages: true,
fixedHeader: false,
fixedColumns: 0
});
//Подключение к контексту взаимодействия с сервером
const { executeStored, SERV_DATA_TYPE_CLOB } = useContext(BackEndСtx);
//При необходимости обновить данные таблицы
useEffect(() => {
if (state.selectedPlan.NRN) {
const loadData = async () => {
const data = await executeStored({
stored: "PKG_P8PANELS_MECHREC.FCPRODPLANSP_DEPT_DG_GET",
args: {
NFCPRODPLAN: state.selectedPlan.NRN,
CORDERS: { VALUE: object2Base64XML(state.orders, { arrayNodeName: "orders" }), SDATA_TYPE: SERV_DATA_TYPE_CLOB },
NPAGE_NUMBER: state.pageNumber,
NPAGE_SIZE: DATA_GRID_PAGE_SIZE_LARGE,
NINCLUDE_DEF: state.dataLoaded ? 0 : 1
},
respArg: "COUT",
attributeValueProcessor: (name, val) => (name === "caption" ? undefined : val)
});
setState(pv => ({
...pv,
fixedHeader: data.XDATA_GRID.fixedHeader,
fixedColumns: data.XDATA_GRID.fixedColumns,
columnsDef: data.XCOLUMNS_DEF ? [...data.XCOLUMNS_DEF] : pv.columnsDef,
rows: pv.pageNumber == 1 ? [...(data.XROWS || [])] : [...pv.rows, ...(data.XROWS || [])],
dataLoaded: true,
reload: false,
morePages: (data.XROWS || []).length >= DATA_GRID_PAGE_SIZE_LARGE
}));
};
if (state.reload) {
loadData();
}
}
}, [state.selectedPlan, state.reload, state.orders, state.pageNumber, state.dataLoaded, executeStored, SERV_DATA_TYPE_CLOB]);
//При подключении компонента к странице
useEffect(() => {
const initPlans = async () => {
const data = await executeStored({
stored: "PKG_P8PANELS_MECHREC.FCPRODPLAN_DEPT_INIT",
args: {},
respArg: "COUT",
isArray: name => name === "XFCPRODPLANS",
attributeValueProcessor: (name, val) => (name === "SPERIOD" ? undefined : val)
});
setState(pv => ({ ...pv, init: true, planList: [...(data?.XFCPRODPLANS || [])], planListLoaded: true }));
};
if (!state.init) {
initPlans();
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);
return [state, setState];
};
//Хук для таблицы маршрутных листов
const useCostRouteLists = task => {
//Собственное состояние - таблица данных
const [costRouteLists, setCostRouteLists] = useState({
dataLoaded: false,
columnsDef: [],
orders: null,
rows: [],
reload: true,
pageNumber: 1,
morePages: true,
editPriorNRN: null
});
//Подключение к контексту взаимодействия с сервером
const { executeStored, SERV_DATA_TYPE_CLOB } = useContext(BackEndСtx);
//При необходимости обновить данные таблицы
useEffect(() => {
const loadData = async () => {
const data = await executeStored({
stored: "PKG_P8PANELS_MECHREC.FCROUTLST_DEPT_DG_GET",
args: {
NFCPRODPLANSP: task,
CORDERS: { VALUE: object2Base64XML(costRouteLists.orders, { arrayNodeName: "orders" }), SDATA_TYPE: SERV_DATA_TYPE_CLOB },
NPAGE_NUMBER: costRouteLists.pageNumber,
NPAGE_SIZE: DATA_GRID_PAGE_SIZE_SMALL,
NINCLUDE_DEF: costRouteLists.dataLoaded ? 0 : 1
},
respArg: "COUT"
});
setCostRouteLists(pv => ({
...pv,
columnsDef: data.XCOLUMNS_DEF ? [...data.XCOLUMNS_DEF] : pv.columnsDef,
rows: pv.pageNumber == 1 ? [...(data.XROWS || [])] : [...pv.rows, ...(data.XROWS || [])],
dataLoaded: true,
reload: false,
morePages: (data.XROWS || []).length >= DATA_GRID_PAGE_SIZE_SMALL
}));
};
if (costRouteLists.reload && task) {
loadData();
}
}, [
SERV_DATA_TYPE_CLOB,
costRouteLists.dataLoaded,
costRouteLists.orders,
costRouteLists.pageNumber,
costRouteLists.reload,
executeStored,
task
]);
return [costRouteLists, setCostRouteLists];
};
//Хук для таблицы строк маршрутного листа
const useCostRouteListsSpecs = mainRowRN => {
//Собственное состояние - таблица данных
const [costRouteListsSpecs, setCostRouteListsSpecs] = useState({
dataLoaded: false,
columnsDef: [],
orders: null,
rows: [],
reload: true,
pageNumber: 1,
morePages: true
});
//Подключение к контексту взаимодействия с сервером
const { executeStored, SERV_DATA_TYPE_CLOB } = useContext(BackEndСtx);
//При необходимости обновить данные таблицы
useEffect(() => {
const loadData = async () => {
const data = await executeStored({
stored: "PKG_P8PANELS_MECHREC.FCROUTLSTSP_DEPT_DG_GET",
args: {
NFCROUTLST: mainRowRN,
CORDERS: {
VALUE: object2Base64XML(costRouteListsSpecs.orders, { arrayNodeName: "orders" }),
SDATA_TYPE: SERV_DATA_TYPE_CLOB
},
NPAGE_NUMBER: costRouteListsSpecs.pageNumber,
NPAGE_SIZE: DATA_GRID_PAGE_SIZE_LARGE,
NINCLUDE_DEF: costRouteListsSpecs.dataLoaded ? 0 : 1
},
respArg: "COUT"
});
setCostRouteListsSpecs(pv => ({
...pv,
columnsDef: data.XCOLUMNS_DEF ? [...data.XCOLUMNS_DEF] : pv.columnsDef,
rows: pv.pageNumber == 1 ? [...(data.XROWS || [])] : [...pv.rows, ...(data.XROWS || [])],
dataLoaded: true,
reload: false,
morePages: (data.XROWS || []).length >= DATA_GRID_PAGE_SIZE_LARGE
}));
};
if (costRouteListsSpecs.reload) {
loadData();
}
}, [
SERV_DATA_TYPE_CLOB,
costRouteListsSpecs.dataLoaded,
costRouteListsSpecs.orders,
costRouteListsSpecs.pageNumber,
costRouteListsSpecs.reload,
executeStored,
mainRowRN
]);
return [costRouteListsSpecs, setCostRouteListsSpecs];
};
//Хук для таблицы сдачи продукции
const useIncomFromDeps = task => {
//Собственное состояние - таблица данных
const [incomFromDeps, setIncomFromDeps] = useState({
dataLoaded: false,
columnsDef: [],
orders: null,
rows: [],
reload: true,
pageNumber: 1,
morePages: true
});
//Подключение к контексту взаимодействия с сервером
const { executeStored, SERV_DATA_TYPE_CLOB } = useContext(BackEndСtx);
//При необходимости обновить данные таблицы
useEffect(() => {
const loadData = async () => {
const data = await executeStored({
stored: "PKG_P8PANELS_MECHREC.INCOMEFROMDEPS_DEPT_DG_GET",
args: {
NFCPRODPLANSP: task,
CORDERS: { VALUE: object2Base64XML(incomFromDeps.orders, { arrayNodeName: "orders" }), SDATA_TYPE: SERV_DATA_TYPE_CLOB },
NPAGE_NUMBER: incomFromDeps.pageNumber,
NPAGE_SIZE: DATA_GRID_PAGE_SIZE_LARGE,
NINCLUDE_DEF: incomFromDeps.dataLoaded ? 0 : 1
},
attributeValueProcessor: (name, val) => (["DDUE_DATE"].includes(name) ? formatDateRF(val) : val),
respArg: "COUT"
});
setIncomFromDeps(pv => ({
...pv,
columnsDef: data.XCOLUMNS_DEF ? [...data.XCOLUMNS_DEF] : pv.columnsDef,
rows: pv.pageNumber == 1 ? [...(data.XROWS || [])] : [...pv.rows, ...(data.XROWS || [])],
dataLoaded: true,
reload: false,
morePages: (data.XROWS || []).length >= DATA_GRID_PAGE_SIZE_LARGE
}));
};
if (incomFromDeps.reload) {
loadData();
}
}, [SERV_DATA_TYPE_CLOB, executeStored, incomFromDeps.dataLoaded, incomFromDeps.orders, incomFromDeps.pageNumber, incomFromDeps.reload, task]);
return [incomFromDeps, setIncomFromDeps];
};
export { useDeptCostProdPlans, useCostRouteLists, useCostRouteListsSpecs, useIncomFromDeps };

View File

@ -7,13 +7,12 @@
//Подключение библиотек
//---------------------
import React, { useState, useCallback, useEffect, useContext } from "react"; //Классы React
import React from "react"; //Классы React
import PropTypes from "prop-types"; //Контроль свойств компонента
import { Typography, Box, Dialog, DialogContent, DialogActions, Button } from "@mui/material"; //Интерфейсные элементы
import { P8PDataGrid, P8P_DATA_GRID_SIZE } from "../../components/p8p_data_grid"; //Таблица данных
import { P8P_DATA_GRID_CONFIG_PROPS } from "../../config_wrapper"; //Подключение компонентов к настройкам приложения
import { BackEndСtx } from "../../context/backend"; //Контекст взаимодействия с сервером
import { object2Base64XML, formatDateRF } from "../../core/utils"; //Вспомогательные функции
import { useIncomFromDeps } from "./hooks"; //Хук состояния таблицы сдача продукции
//---------
//Константы
@ -32,53 +31,7 @@ const STYLES = {
//Таблица сдачи продукции
const IncomFromDepsDataGrid = ({ task }) => {
//Собственное состояние - таблица данных
const [incomFromDeps, setIncomFromDeps] = useState({
dataLoaded: false,
columnsDef: [],
orders: null,
rows: [],
reload: true,
pageNumber: 1,
morePages: true
});
//Размер страницы данных
const DATA_GRID_PAGE_SIZE = 10;
//Подключение к контексту взаимодействия с сервером
const { executeStored, SERV_DATA_TYPE_CLOB } = useContext(BackEndСtx);
//Загрузка данных таблицы с сервера
const loadData = useCallback(async () => {
if (incomFromDeps.reload) {
const data = await executeStored({
stored: "PKG_P8PANELS_MECHREC.INCOMEFROMDEPS_DEPT_DG_GET",
args: {
NFCPRODPLANSP: task,
CORDERS: { VALUE: object2Base64XML(incomFromDeps.orders, { arrayNodeName: "orders" }), SDATA_TYPE: SERV_DATA_TYPE_CLOB },
NPAGE_NUMBER: incomFromDeps.pageNumber,
NPAGE_SIZE: DATA_GRID_PAGE_SIZE,
NINCLUDE_DEF: incomFromDeps.dataLoaded ? 0 : 1
},
attributeValueProcessor: (name, val) => (["DDUE_DATE"].includes(name) ? formatDateRF(val) : val),
respArg: "COUT"
});
setIncomFromDeps(pv => ({
...pv,
columnsDef: data.XCOLUMNS_DEF ? [...data.XCOLUMNS_DEF] : pv.columnsDef,
rows: pv.pageNumber == 1 ? [...(data.XROWS || [])] : [...pv.rows, ...(data.XROWS || [])],
dataLoaded: true,
reload: false,
morePages: (data.XROWS || []).length >= DATA_GRID_PAGE_SIZE
}));
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [incomFromDeps.reload, incomFromDeps.orders, incomFromDeps.dataLoaded, incomFromDeps.pageNumber, executeStored, SERV_DATA_TYPE_CLOB]);
//При необходимости обновить данные таблицы
useEffect(() => {
loadData();
}, [incomFromDeps.reload, loadData]);
const [incomFromDeps, setIncomFromDeps] = useIncomFromDeps(task);
//При изменении состояния сортировки
const handleOrderChanged = ({ orders }) => setIncomFromDeps(pv => ({ ...pv, orders: [...orders], pageNumber: 1, reload: true }));

View File

@ -7,12 +7,10 @@
//Подключение библиотек
//---------------------
import React, { useContext, useState, useCallback, useEffect } from "react"; //Классы React
import React, { useContext, useState } from "react"; //Классы React
import PropTypes from "prop-types"; //Контроль свойств компонента
import { Drawer, Fab, Box, List, ListItemButton, ListItemText, Typography, TextField, Link, Grid } from "@mui/material"; //Интерфейсные элементы
import { BackEndСtx } from "../../context/backend"; //Контекст взаимодействия с сервером
import { useFilteredPlans } from "./hooks"; //Вспомогательные хуки
import { object2Base64XML } from "../../core/utils"; //Вспомогательные функции
import { useDeptCostProdPlans, useFilteredPlans } from "./hooks"; //Вспомогательные хуки
import { P8PDataGrid, P8P_DATA_GRID_SIZE } from "../../components/p8p_data_grid"; //Таблица данных
import { P8P_DATA_GRID_CONFIG_PROPS } from "../../config_wrapper"; //Подключение компонентов к настройкам приложения
import { MessagingСtx } from "../../context/messaging"; //Контекст сообщений
@ -27,14 +25,14 @@ import { CostRouteListsDataGridDialog } from "./fcroutlst"; //Диалог ма
const STYLES = {
PLANS_FINDER: { marginTop: "10px", marginLeft: "10px", width: "93%" },
PLANS_LIST_ITEM_PRIMARY: { wordWrap: "break-word" },
PLANS_BUTTON: { position: "absolute", marginTop: "10px", marginLeft: "10px" },
PLANS_BUTTON: { position: "absolute" },
PLANS_DRAWER: {
width: "350px",
display: "inline-block",
flexShrink: 0,
[`& .MuiDrawer-paper`]: { width: "350px", display: "inline-block", boxSizing: "border-box" }
},
CONTAINER: { paddingTop: "40px", margin: "5px 0px", textAlign: "center" },
CONTAINER: { textAlign: "center" },
DATA_GRID_CONTAINER: { minWidth: "95vw", maxWidth: "95vw", minHeight: "80vh", maxHeight: "80vh" },
DATA_GRID_GROUP_CELL: { padding: "2px" },
DATA_GRID_CELL: { padding: "8px", maxWidth: "300px", textOverflow: "ellipsis", overflow: "hidden", whiteSpace: "pre" },
@ -177,24 +175,7 @@ PlanList.propTypes = {
//Корневая панель производственного плана цеха
const MechRecDeptCostProdPlans = () => {
//Собственное состояние - таблица данных
const [state, setState] = useState({
init: false,
showPlanList: false,
showIncomeFromDeps: null,
showFcroutelst: null,
planList: [],
planListLoaded: false,
selectedPlan: {},
dataLoaded: false,
columnsDef: [],
orders: null,
rows: [],
reload: true,
pageNumber: 1,
morePages: true,
fixedHeader: false,
fixedColumns: 0
});
const [state, setState] = useDeptCostProdPlans();
//Состояние для фильтра каталогов
const [filter, setFilter] = useState({ planName: "" });
@ -202,77 +183,9 @@ const MechRecDeptCostProdPlans = () => {
//Массив отфильтрованных каталогов
const filteredPlanCtgls = useFilteredPlans(state.planList, filter);
//Размер страницы данных
const DATA_GRID_PAGE_SIZE = 10;
//Подключение к контексту взаимодействия с сервером
const { executeStored, SERV_DATA_TYPE_CLOB } = useContext(BackEndСtx);
//Подключение к контексту сообщений
const { InlineMsgInfo } = useContext(MessagingСtx);
// Инициализация каталогов планов
const initPlans = useCallback(async () => {
if (!state.init) {
const data = await executeStored({
stored: "PKG_P8PANELS_MECHREC.FCPRODPLAN_DEPT_INIT",
args: {},
respArg: "COUT",
isArray: name => name === "XFCPRODPLANS",
attributeValueProcessor: (name, val) => (name === "SPERIOD" ? undefined : val)
});
setState(pv => ({ ...pv, init: true, planList: [...(data?.XFCPRODPLANS || [])], planListLoaded: true }));
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [state.init, executeStored]);
//Загрузка данных таблицы с сервера
const loadData = useCallback(
async NRN => {
if (state.reload && NRN) {
const data = await executeStored({
stored: "PKG_P8PANELS_MECHREC.FCPRODPLANSP_DEPT_DG_GET",
args: {
NFCPRODPLAN: NRN,
CORDERS: { VALUE: object2Base64XML(state.orders, { arrayNodeName: "orders" }), SDATA_TYPE: SERV_DATA_TYPE_CLOB },
NPAGE_NUMBER: state.pageNumber,
NPAGE_SIZE: DATA_GRID_PAGE_SIZE,
NINCLUDE_DEF: state.dataLoaded ? 0 : 1
},
respArg: "COUT",
attributeValueProcessor: (name, val) => (name === "caption" ? undefined : val)
});
setState(pv => ({
...pv,
fixedHeader: data.XDATA_GRID.fixedHeader,
fixedColumns: data.XDATA_GRID.fixedColumns,
columnsDef: data.XCOLUMNS_DEF ? [...data.XCOLUMNS_DEF] : pv.columnsDef,
rows: pv.pageNumber == 1 ? [...(data.XROWS || [])] : [...pv.rows, ...(data.XROWS || [])],
dataLoaded: true,
reload: false,
morePages: (data.XROWS || []).length >= DATA_GRID_PAGE_SIZE
}));
}
},
// eslint-disable-next-line react-hooks/exhaustive-deps
[state.reload, state.orders, state.dataLoaded, state.pageNumber, executeStored, SERV_DATA_TYPE_CLOB]
);
//При необходимости обновить данные таблицы
useEffect(() => {
if (state.selectedPlan.NRN) {
loadData(state.selectedPlan.NRN);
} else {
setState(pv => ({ ...pv, dataLoaded: false, columnsDef: [], orders: null, rows: [], reload: true, pageNumber: 1, morePages: true }));
}
}, [state.selectedPlan, state.reload, loadData]);
//При подключении компонента к странице
useEffect(() => {
initPlans();
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);
//Выбор плана
const selectPlan = plan => {
setState(pv => ({
@ -332,7 +245,7 @@ const MechRecDeptCostProdPlans = () => {
//Генерация содержимого
return (
<>
<Box p={2}>
<Fab variant="extended" sx={STYLES.PLANS_BUTTON} onClick={() => setState(pv => ({ ...pv, showPlanList: !pv.showPlanList }))}>
Планы
</Fab>
@ -350,45 +263,47 @@ const MechRecDeptCostProdPlans = () => {
onClick={handlePlanClick}
/>
</Drawer>
<div style={STYLES.CONTAINER}>
{state.dataLoaded ? (
<Typography variant={"h6"}>
{`Производственный план цеха №${state.selectedPlan.SSUBDIV} на ${state.selectedPlan.SPERIOD}`}
</Typography>
) : null}
<Grid container spacing={1}>
<Grid item xs={12}>
<Box pt={1} display="flex" justifyContent="center" alignItems="center">
{state.dataLoaded ? (
<P8PDataGrid
{...P8P_DATA_GRID_CONFIG_PROPS}
containerComponentProps={{ elevation: 6, style: STYLES.DATA_GRID_CONTAINER }}
fixedHeader={state.fixedHeader}
fixedColumns={state.fixedColumns}
columnsDef={state.columnsDef}
rows={state.rows}
size={P8P_DATA_GRID_SIZE.MEDIUM}
morePages={state.morePages}
reloading={state.reload}
onOrderChanged={handleOrderChanged}
onPagesCountChanged={handlePagesCountChanged}
dataCellRender={prms => dataCellRender({ ...prms, handleProdOrderClick, handleMatresCodeClick })}
groupCellRender={groupCellRender}
/>
) : !state.selectedPlan.NRN ? (
<InlineMsgInfo okBtn={false} text={"Укажите план для отображения его спецификаций"} />
) : null}
</Box>
</Grid>
<Grid container spacing={1}>
<Grid item xs={12}>
<Box display="flex" justifyContent="center" alignItems="center">
{state.dataLoaded ? (
state.rows.length === 0 ? (
<InlineMsgInfo okBtn={false} text={"В плане отсутствуют записи спецификации"} />
) : (
<Box sx={STYLES.CONTAINER}>
<Typography pt={1} variant={"h6"}>
{`Производственный план цеха №${state.selectedPlan.SSUBDIV} на ${state.selectedPlan.SPERIOD}`}
</Typography>
<Box pt={2.5}>
<P8PDataGrid
{...P8P_DATA_GRID_CONFIG_PROPS}
containerComponentProps={{ elevation: 6, style: STYLES.DATA_GRID_CONTAINER }}
fixedHeader={state.fixedHeader}
fixedColumns={state.fixedColumns}
columnsDef={state.columnsDef}
rows={state.rows}
size={P8P_DATA_GRID_SIZE.MEDIUM}
morePages={state.morePages}
reloading={state.reload}
onOrderChanged={handleOrderChanged}
onPagesCountChanged={handlePagesCountChanged}
dataCellRender={prms => dataCellRender({ ...prms, handleProdOrderClick, handleMatresCodeClick })}
groupCellRender={groupCellRender}
/>
</Box>
</Box>
)
) : !state.selectedPlan.NRN ? (
<InlineMsgInfo okBtn={false} text={"Укажите план для отображения спецификаций"} />
) : null}
</Box>
</Grid>
{state.showIncomeFromDeps ? (
<IncomFromDepsDataGridDialog task={state.showIncomeFromDeps} onClose={() => handleProdOrderClick(null)} />
) : null}
{state.showFcroutelst ? (
<CostRouteListsDataGridDialog task={state.showFcroutelst} onClose={() => handleMatresCodeClick(null)} />
) : null}
</div>
</>
</Grid>
{state.showIncomeFromDeps ? (
<IncomFromDepsDataGridDialog task={state.showIncomeFromDeps} onClose={() => handleProdOrderClick(null)} />
) : null}
{state.showFcroutelst ? <CostRouteListsDataGridDialog task={state.showFcroutelst} onClose={() => handleMatresCodeClick(null)} /> : null}
</Box>
);
};

File diff suppressed because it is too large Load Diff