/*
    Парус 8 - Панели мониторинга - ТОиР - Прогнозирование технического состояния
    Закладка администрирования
*/

//---------------------
//Подключение библиотек
//---------------------

import React, { useState, useEffect } from "react"; //Классы React
import { Box, Grid, Stack, Icon, Button } from "@mui/material"; //Интерфейсные компоненты
import { EquipDataSelectionList, EquipDataSelectionClassMachineList, EquipDataSelectionClassMachineCard } from "./admin_tab_layout"; //Вспомогательные компоненты и вёрстка
import {
    DS_RN_DEFAULT,
    useEquipDataSelectionList,
    useEquipDataSelectionClassMachineList,
    useEquipDataSelectionClassMachineFilesList,
    useEquipDataSelectionClassMachineModelsList
} from "./admin_tab_hooks"; //Вспомогательные хуки

//---------
//Константы
//---------

//Стили
const STYLES = {
    DATA_SELECTION_STACK: { alignItems: "center" },
    CLASS_MACHINE_ADD_BUTTON: { margin: "5px" }
};

//-----------
//Тело модуля
//-----------

//Закладка администрирования
const AdminTab = () => {
    //Собственное состояние - выбранная выборка данных
    const [equipDataSelection, setDataSelection] = useState(DS_RN_DEFAULT);

    //Собственное состояние - выбранный класс оборудования
    const [equipDataSelectionClassMachine, setDataSelectionClassMachine] = useState(null);

    //Загрузка списка выборок данных
    const { equipDataSelectionList } = useEquipDataSelectionList();

    //Загрузка классов оборудования выбранной выборки данных
    const { equipDataSelectionClassMachineList } = useEquipDataSelectionClassMachineList(equipDataSelection);

    //Загрузка файлов класса оборудования
    const { equipDataSelectionClassMachineFilesList } = useEquipDataSelectionClassMachineFilesList(equipDataSelectionClassMachine);

    //Загрузка файлов класса оборудования
    const { equipDataSelectionClassMachineModelsList } = useEquipDataSelectionClassMachineModelsList(equipDataSelectionClassMachine);

    //При подключении компонента к странице
    useEffect(() => {}, []);

    //При смене выборки данных
    const handleDataSelectionChange = value => {
        setDataSelectionClassMachine(null);
        setDataSelection(value);
    };

    //При нажатии на класс оборудования
    const handleDataSelectionClassMachineClick = value => setDataSelectionClassMachine(value);

    //Генерация содержимого
    return (
        <Box>
            <Grid container>
                <Grid item xs={12}>
                    <Stack direction="row" spacing={2} p={2} sx={STYLES.DATA_SELECTION_STACK}>
                        <EquipDataSelectionList list={equipDataSelectionList} value={equipDataSelection} onChange={handleDataSelectionChange} />
                        <Button variant="contained" startIcon={<Icon>add</Icon>}>
                            Добавить выборку
                        </Button>
                    </Stack>
                </Grid>
                <Grid item xs={12}>
                    <Grid container>
                        <Grid item xs={2} hidden={equipDataSelection == DS_RN_DEFAULT}>
                            <Button fullWidth startIcon={<Icon>add</Icon>} sx={STYLES.CLASS_MACHINE_ADD_BUTTON}>
                                Добавить класс
                            </Button>
                            <EquipDataSelectionClassMachineList
                                list={equipDataSelectionClassMachineList}
                                value={equipDataSelectionClassMachine}
                                onClick={handleDataSelectionClassMachineClick}
                            />
                        </Grid>
                        <Grid item xs={10} hidden={equipDataSelectionClassMachine == null}>
                            <EquipDataSelectionClassMachineCard
                                filesList={equipDataSelectionClassMachineFilesList}
                                modelsList={equipDataSelectionClassMachineModelsList}
                            />
                        </Grid>
                    </Grid>
                </Grid>
            </Grid>
        </Box>
    );
};

//----------------
//Интерфейс модуля
//----------------

export { AdminTab };