Adjust menu navigation
This commit is contained in:
parent
349d071c2b
commit
71c08d7cb5
|
|
@ -104,7 +104,8 @@ const kProductPlans = [
|
||||||
|
|
||||||
const double kMobileLayoutWidth = 700;
|
const double kMobileLayoutWidth = 700;
|
||||||
const double kMobileDialogPadding = 12;
|
const double kMobileDialogPadding = 12;
|
||||||
const double kDrawerWidth = 272;
|
const double kDrawerWidthMobile = 272;
|
||||||
|
const double kDrawerWidthDesktop = 220;
|
||||||
const double kTableColumnGap = 16;
|
const double kTableColumnGap = 16;
|
||||||
const double kTopBottomBarHeight = 50;
|
const double kTopBottomBarHeight = 50;
|
||||||
const double kDialogWidth = 400;
|
const double kDialogWidth = 400;
|
||||||
|
|
|
||||||
|
|
@ -49,7 +49,7 @@ class HistoryDrawer extends StatelessWidget {
|
||||||
}
|
}
|
||||||
|
|
||||||
return SizedBox(
|
return SizedBox(
|
||||||
width: kDrawerWidth,
|
width: kDrawerWidthMobile,
|
||||||
child: Drawer(
|
child: Drawer(
|
||||||
child: Scaffold(
|
child: Scaffold(
|
||||||
appBar: AppBar(
|
appBar: AppBar(
|
||||||
|
|
|
||||||
|
|
@ -255,7 +255,11 @@ class MenuDrawer extends StatelessWidget {
|
||||||
|
|
||||||
return FocusTraversalGroup(
|
return FocusTraversalGroup(
|
||||||
child: Container(
|
child: Container(
|
||||||
width: state.isMenuCollapsed ? 65 : kDrawerWidth,
|
width: state.isMenuCollapsed
|
||||||
|
? 65
|
||||||
|
: isDesktop(context)
|
||||||
|
? kDrawerWidthDesktop
|
||||||
|
: kDrawerWidthMobile,
|
||||||
child: Drawer(
|
child: Drawer(
|
||||||
child: SafeArea(
|
child: SafeArea(
|
||||||
child: Column(
|
child: Column(
|
||||||
|
|
@ -565,7 +569,7 @@ class DrawerTile extends StatefulWidget {
|
||||||
}
|
}
|
||||||
|
|
||||||
class _DrawerTileState extends State<DrawerTile> {
|
class _DrawerTileState extends State<DrawerTile> {
|
||||||
//bool _isHovered = false;
|
bool _isHovered = false;
|
||||||
|
|
||||||
@override
|
@override
|
||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
|
|
@ -643,43 +647,76 @@ class _DrawerTileState extends State<DrawerTile> {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
Widget trailingWidget;
|
final onTap = () {
|
||||||
if (!state.isMenuCollapsed) {
|
if (widget.entityType != null) {
|
||||||
if (widget.title == localization.dashboard) {
|
viewEntitiesByType(
|
||||||
trailingWidget = IconButton(
|
entityType: widget.entityType,
|
||||||
icon: Icon(
|
|
||||||
Icons.search,
|
|
||||||
color: textColor,
|
|
||||||
),
|
|
||||||
onPressed: () {
|
|
||||||
if (isMobile(context)) {
|
|
||||||
navigator.pop();
|
|
||||||
}
|
|
||||||
store.dispatch(ViewDashboard(
|
|
||||||
filter: uiState.mainRoute == 'dashboard' && uiState.filter == ''
|
|
||||||
? null
|
|
||||||
: ''));
|
|
||||||
},
|
|
||||||
);
|
);
|
||||||
} else if (userCompany.canCreate(widget.entityType)) {
|
} else {
|
||||||
trailingWidget = IconButton(
|
widget.onTap();
|
||||||
tooltip: prefState.enableTooltips ? widget.iconTooltip : null,
|
}
|
||||||
icon: Icon(
|
};
|
||||||
Icons.add_circle_outline,
|
|
||||||
color: textColor,
|
final onLongPress = () {
|
||||||
),
|
if (widget.onLongPress != null) {
|
||||||
onPressed: () {
|
widget.onLongPress();
|
||||||
if (isMobile(context)) {
|
} else if (widget.entityType != null) {
|
||||||
navigator.pop();
|
createEntityByType(
|
||||||
}
|
context: context,
|
||||||
createEntityByType(
|
entityType: widget.entityType,
|
||||||
context: context,
|
applyFilter: false,
|
||||||
entityType: widget.entityType,
|
|
||||||
applyFilter: false,
|
|
||||||
);
|
|
||||||
},
|
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
if (state.isMenuCollapsed) {
|
||||||
|
return InkWell(
|
||||||
|
onTap: onTap,
|
||||||
|
onLongPress: onLongPress,
|
||||||
|
child: SizedBox(
|
||||||
|
height: 40,
|
||||||
|
child: Icon(
|
||||||
|
widget.icon,
|
||||||
|
color: textColor,
|
||||||
|
),
|
||||||
|
));
|
||||||
|
}
|
||||||
|
|
||||||
|
Widget iconWidget;
|
||||||
|
if (widget.title == localization.dashboard) {
|
||||||
|
iconWidget = IconButton(
|
||||||
|
icon: Icon(
|
||||||
|
Icons.search,
|
||||||
|
color: textColor,
|
||||||
|
),
|
||||||
|
onPressed: () {
|
||||||
|
if (isMobile(context)) {
|
||||||
|
navigator.pop();
|
||||||
|
}
|
||||||
|
store.dispatch(ViewDashboard(
|
||||||
|
filter: uiState.mainRoute == 'dashboard' && uiState.filter == ''
|
||||||
|
? null
|
||||||
|
: ''));
|
||||||
|
},
|
||||||
|
);
|
||||||
|
} else if (userCompany.canCreate(widget.entityType)) {
|
||||||
|
iconWidget = IconButton(
|
||||||
|
tooltip: prefState.enableTooltips ? widget.iconTooltip : null,
|
||||||
|
icon: Icon(
|
||||||
|
Icons.add_circle_outline,
|
||||||
|
color: textColor,
|
||||||
|
),
|
||||||
|
onPressed: () {
|
||||||
|
if (isMobile(context)) {
|
||||||
|
navigator.pop();
|
||||||
|
}
|
||||||
|
createEntityByType(
|
||||||
|
context: context,
|
||||||
|
entityType: widget.entityType,
|
||||||
|
applyFilter: false,
|
||||||
|
);
|
||||||
|
},
|
||||||
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
bool isLoading = false;
|
bool isLoading = false;
|
||||||
|
|
@ -695,56 +732,30 @@ class _DrawerTileState extends State<DrawerTile> {
|
||||||
opacity: isSelected ? 1 : .8,
|
opacity: isSelected ? 1 : .8,
|
||||||
child: ListTile(
|
child: ListTile(
|
||||||
dense: true,
|
dense: true,
|
||||||
leading: Padding(
|
leading: _isHovered && isDesktop(context) && iconWidget != null
|
||||||
padding: const EdgeInsets.only(left: 4),
|
? iconWidget
|
||||||
child: isLoading
|
: isLoading
|
||||||
? SizedBox(
|
? SizedBox(
|
||||||
child: CircularProgressIndicator(),
|
child: CircularProgressIndicator(),
|
||||||
width: 22,
|
width: 22,
|
||||||
height: 22,
|
height: 22,
|
||||||
)
|
|
||||||
: Icon(
|
|
||||||
widget.icon,
|
|
||||||
size: 22,
|
|
||||||
color: textColor,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
title: state.isMenuCollapsed
|
|
||||||
? SizedBox()
|
|
||||||
: Text(
|
|
||||||
widget.title,
|
|
||||||
key: ValueKey('menu_${widget.title}'),
|
|
||||||
style: Theme.of(context).textTheme.bodyText1.copyWith(
|
|
||||||
fontSize: 14,
|
|
||||||
color: textColor,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
onTap: () {
|
|
||||||
if (widget.entityType != null) {
|
|
||||||
viewEntitiesByType(
|
|
||||||
entityType: widget.entityType,
|
|
||||||
);
|
|
||||||
} else {
|
|
||||||
widget.onTap();
|
|
||||||
}
|
|
||||||
},
|
|
||||||
onLongPress: () => widget.onLongPress != null
|
|
||||||
? widget.onLongPress()
|
|
||||||
: widget.entityType != null
|
|
||||||
? createEntityByType(
|
|
||||||
context: context,
|
|
||||||
entityType: widget.entityType,
|
|
||||||
applyFilter: false,
|
|
||||||
)
|
)
|
||||||
: null,
|
: IconButton(
|
||||||
/*
|
icon: Icon(widget.icon),
|
||||||
trailing: _isHovered ||
|
color: textColor,
|
||||||
!RendererBinding.instance.mouseTracker.mouseIsConnected
|
onPressed: onTap,
|
||||||
? trailingWidget
|
),
|
||||||
: null,
|
title: Text(
|
||||||
|
widget.title,
|
||||||
*/
|
key: ValueKey('menu_${widget.title}'),
|
||||||
trailing: state.isMenuCollapsed ? null : trailingWidget,
|
style: Theme.of(context).textTheme.bodyText1.copyWith(
|
||||||
|
fontSize: 14,
|
||||||
|
color: textColor,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
onTap: onTap,
|
||||||
|
onLongPress: onLongPress,
|
||||||
|
trailing: isMobile(context) ? iconWidget : null,
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
);
|
);
|
||||||
|
|
@ -757,8 +768,8 @@ class _DrawerTileState extends State<DrawerTile> {
|
||||||
}
|
}
|
||||||
|
|
||||||
return MouseRegion(
|
return MouseRegion(
|
||||||
//onEnter: (event) => setState(() => _isHovered = true),
|
onEnter: (event) => setState(() => _isHovered = true),
|
||||||
//onExit: (event) => setState(() => _isHovered = false),
|
onExit: (event) => setState(() => _isHovered = false),
|
||||||
child: child,
|
child: child,
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue