CITKParus/P8-Panels
2
0
Fork 2
Code Issues Pull Requests Projects Releases Wiki Activity

WEBAPP: Функция сокрытия заголовка приложения ("ApplicationCtx.appBarShow")

Browse Source
This commit is contained in:
Mim 2026-04-02 17:45:41 +03:00
parent a5f46513ca
commit e441d940ba
4 changed files with 61 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
app/app.js
View File

@ -102,6 +102,7 @@ const Workspace = ({ panels = [], selectedPanel, children } = {}) => {
panels={panels}
selectedPanel={selectedPanel}
caption={appState.appBarTitle}
showAppBar={appState.appBarShow}
onHomeNavigate={handleHomeNavigate}
onItemNavigate={handleItemNavigate}
>

87
app/components/p8p_app_workspace.js
View File

@ -47,7 +47,17 @@ const STYLES = {
//-----------
//Рабочее пространство
const P8PAppWorkspace = ({ children, panels = [], selectedPanel, caption, closeCaption, homeCaption, onHomeNavigate, onItemNavigate } = {}) => {
const P8PAppWorkspace = ({
children,
panels = [],
selectedPanel,
caption,
showAppBar = true,
closeCaption,
homeCaption,
onHomeNavigate,
onItemNavigate
} = {}) => {
//Собственное состояния
const [open, setOpen] = useState(false);
@ -73,42 +83,46 @@ const P8PAppWorkspace = ({ children, panels = [], selectedPanel, caption, closeC
//Генерация содержимого
return (
<Box sx={STYLES.ROOT_BOX}>
<CssBaseline />
<AppBar sx={STYLES.APP_BAR}>
<Toolbar>
<IconButton
color="inherit"
aria-label="open drawer"
onClick={open ? handleDrawerClose : handleDrawerOpen}
edge="start"
sx={STYLES.APP_BAR_BUTTON}
>
<Icon>{open ? "chevron_left" : "menu"}</Icon>
</IconButton>
<Typography variant="h6" noWrap component="div">
{caption || selectedPanel?.caption}
</Typography>
</Toolbar>
</AppBar>
<Drawer anchor="left" open={open} onClose={handleDrawerClose} sx={STYLES.DRAWER}>
<List>
<ListItemButton onClick={handleDrawerClose}>
<ListItemIcon>
<Icon>close</Icon>
</ListItemIcon>
<ListItemText primary={closeCaption} />
</ListItemButton>
<ListItemButton onClick={handleHomeClick}>
<ListItemIcon>
<Icon>home</Icon>
</ListItemIcon>
<ListItemText primary={homeCaption} />
</ListItemButton>
</List>
<P8PPanelsMenuDrawer panels={panels} selectedPanel={selectedPanel} onItemNavigate={handleItemNavigate} />
</Drawer>
{showAppBar && (
<>
<CssBaseline />
<AppBar sx={STYLES.APP_BAR}>
<Toolbar>
<IconButton
color="inherit"
aria-label="open drawer"
onClick={open ? handleDrawerClose : handleDrawerOpen}
edge="start"
sx={STYLES.APP_BAR_BUTTON}
>
<Icon>{open ? "chevron_left" : "menu"}</Icon>
</IconButton>
<Typography variant="h6" noWrap component="div">
{caption || selectedPanel?.caption}
</Typography>
</Toolbar>
</AppBar>
<Drawer anchor="left" open={open} onClose={handleDrawerClose} sx={STYLES.DRAWER}>
<List>
<ListItemButton onClick={handleDrawerClose}>
<ListItemIcon>
<Icon>close</Icon>
</ListItemIcon>
<ListItemText primary={closeCaption} />
</ListItemButton>
<ListItemButton onClick={handleHomeClick}>
<ListItemIcon>
<Icon>home</Icon>
</ListItemIcon>
<ListItemText primary={homeCaption} />
</ListItemButton>
</List>
<P8PPanelsMenuDrawer panels={panels} selectedPanel={selectedPanel} onItemNavigate={handleItemNavigate} />
</Drawer>
</>
)}
<main style={STYLES.MAIN}>
<Toolbar />
{showAppBar && <Toolbar />}
{children}
</main>
</Box>
@ -121,6 +135,7 @@ P8PAppWorkspace.propTypes = {
panels: PropTypes.arrayOf(P8P_PANELS_MENU_PANEL_SHAPE).isRequired,
selectedPanel: P8P_PANELS_MENU_PANEL_SHAPE,
caption: PropTypes.string,
showAppBar: PropTypes.bool,
closeCaption: PropTypes.string.isRequired,
homeCaption: PropTypes.string.isRequired,
onHomeNavigate: PropTypes.func,

4
app/context/application.js
View File

@ -59,6 +59,9 @@ export const ApplicationContext = ({ errors, displaySizeGetter, guidGenerator, c
//Установка заголовка в шапке приложения
const setAppBarTitle = useCallback(appBarTitle => dispatch({ type: APP_AT.SET_APP_BAR_TITLE, payload: appBarTitle }), []);
//Установка флага отображения шапки приложения
const setAppBarShow = useCallback(appBarShow => dispatch({ type: APP_AT.SET_APP_BAR_SHOW, payload: appBarShow }), []);
//Поиск раздела по имени
const findPanelByName = name => state.panels.find(panel => panel.name == name);
@ -173,6 +176,7 @@ export const ApplicationContext = ({ errors, displaySizeGetter, guidGenerator, c
<ApplicationCtx.Provider
value={{
setAppBarTitle,
setAppBarShow,
findPanelByName,
pOnlineShowTab,
pOnlineShowUnit,

6
app/context/application_reducer.js
View File

@ -13,13 +13,15 @@ const APP_AT = {
LOAD_PANELS: "LOAD_PANELS", //Загрузка списка панелей
SET_INITIALIZED: "SET_INITIALIZED", //Установка флага инициализированности приложения
SET_DISPLAY_SIZE: "SET_DISPLAY_SIZE", //Установка текущего типового размера экрана
SET_APP_BAR_TITLE: "SET_APP_BAR_TITLE" //Установка заголовка в шапке приложения
SET_APP_BAR_TITLE: "SET_APP_BAR_TITLE", //Установка заголовка в шапке приложения
SET_APP_BAR_SHOW: "SET_APP_BAR_SHOW" //Установка флага отображения шапки приложения
};
//Состояние приложения по умолчанию
const INITIAL_STATE = displaySizeGetter => ({
displaySize: displaySizeGetter(),
appBarTitle: "",
appBarShow: true,
urlBase: "",
panels: [],
panelsLoaded: false,
@ -50,6 +52,8 @@ const handlers = {
[APP_AT.SET_DISPLAY_SIZE]: (state, { payload }) => ({ ...state, displaySize: payload }),
//Установка заголовка в шапке приложения
[APP_AT.SET_APP_BAR_TITLE]: (state, { payload }) => ({ ...state, appBarTitle: payload }),
//Установка флага отображения шапки приложения
[APP_AT.SET_APP_BAR_SHOW]: (state, { payload }) => ({ ...state, appBarShow: payload }),
//Обработчик по умолчанию
DEFAULT: state => state
};