mirror of
https://github.com/SyncrowIOT/web.git
synced 2025-07-10 15:17:31 +00:00
Enhanced the side tree design
This commit is contained in:
@ -69,7 +69,7 @@ class DeviceManagementBody extends StatelessWidget with HelperResponsiveLayout {
|
|||||||
},
|
},
|
||||||
)),
|
)),
|
||||||
Expanded(
|
Expanded(
|
||||||
flex: 3,
|
flex: 4,
|
||||||
child: state is DeviceManagementLoading
|
child: state is DeviceManagementLoading
|
||||||
? const Center(child: CircularProgressIndicator())
|
? const Center(child: CircularProgressIndicator())
|
||||||
: Column(
|
: Column(
|
||||||
|
@ -33,24 +33,16 @@ class _RoutinesViewState extends State<RoutinesView> {
|
|||||||
return Row(
|
return Row(
|
||||||
children: [
|
children: [
|
||||||
Expanded(
|
Expanded(
|
||||||
child:
|
child: SpaceTreeView(
|
||||||
// SideSpacesView(
|
|
||||||
// onSelectAction: (String communityId, String spaceId) {
|
|
||||||
// // context.read<RoutineBloc>()
|
|
||||||
// // ..add(LoadScenes(spaceId, communityId))
|
|
||||||
// // ..add(LoadAutomation(spaceId));
|
|
||||||
// },
|
|
||||||
// )
|
|
||||||
SpaceTreeView(
|
|
||||||
onSelect: () {},
|
onSelect: () {},
|
||||||
)),
|
)),
|
||||||
Expanded(
|
Expanded(
|
||||||
flex: 3,
|
flex: 4,
|
||||||
child: Padding(
|
child: ListView(children: [
|
||||||
|
Container(
|
||||||
padding: const EdgeInsets.all(16),
|
padding: const EdgeInsets.all(16),
|
||||||
child: Row(
|
height: MediaQuery.sizeOf(context).height,
|
||||||
children: [
|
child: Column(
|
||||||
Column(
|
|
||||||
mainAxisSize: MainAxisSize.min,
|
mainAxisSize: MainAxisSize.min,
|
||||||
crossAxisAlignment: CrossAxisAlignment.start,
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||||||
mainAxisAlignment: MainAxisAlignment.start,
|
mainAxisAlignment: MainAxisAlignment.start,
|
||||||
@ -88,9 +80,8 @@ class _RoutinesViewState extends State<RoutinesView> {
|
|||||||
const Expanded(child: FetchRoutineScenesAutomation()),
|
const Expanded(child: FetchRoutineScenesAutomation()),
|
||||||
],
|
],
|
||||||
),
|
),
|
||||||
],
|
|
||||||
),
|
|
||||||
),
|
),
|
||||||
|
]),
|
||||||
),
|
),
|
||||||
],
|
],
|
||||||
);
|
);
|
||||||
|
@ -10,10 +10,23 @@ import 'package:syncrow_web/pages/spaces_management/all_spaces/model/space_model
|
|||||||
import 'package:syncrow_web/utils/color_manager.dart';
|
import 'package:syncrow_web/utils/color_manager.dart';
|
||||||
import 'package:syncrow_web/utils/style.dart';
|
import 'package:syncrow_web/utils/style.dart';
|
||||||
|
|
||||||
class SpaceTreeView extends StatelessWidget {
|
class SpaceTreeView extends StatefulWidget {
|
||||||
final Function onSelect;
|
final Function onSelect;
|
||||||
const SpaceTreeView({required this.onSelect, super.key});
|
const SpaceTreeView({required this.onSelect, super.key});
|
||||||
|
|
||||||
|
@override
|
||||||
|
State<SpaceTreeView> createState() => _SpaceTreeViewState();
|
||||||
|
}
|
||||||
|
|
||||||
|
class _SpaceTreeViewState extends State<SpaceTreeView> {
|
||||||
|
final ScrollController _scrollController = ScrollController();
|
||||||
|
|
||||||
|
@override
|
||||||
|
void dispose() {
|
||||||
|
_scrollController.dispose();
|
||||||
|
super.dispose();
|
||||||
|
}
|
||||||
|
|
||||||
@override
|
@override
|
||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
return BlocBuilder<SpaceTreeBloc, SpaceTreeState>(builder: (context, state) {
|
return BlocBuilder<SpaceTreeBloc, SpaceTreeState>(builder: (context, state) {
|
||||||
@ -21,7 +34,6 @@ class SpaceTreeView extends StatelessWidget {
|
|||||||
return Container(
|
return Container(
|
||||||
height: MediaQuery.sizeOf(context).height,
|
height: MediaQuery.sizeOf(context).height,
|
||||||
decoration: subSectionContainerDecoration,
|
decoration: subSectionContainerDecoration,
|
||||||
// padding: const EdgeInsets.all(16.0),
|
|
||||||
child: state is SpaceTreeLoadingState
|
child: state is SpaceTreeLoadingState
|
||||||
? const Center(child: CircularProgressIndicator())
|
? const Center(child: CircularProgressIndicator())
|
||||||
: Column(
|
: Column(
|
||||||
@ -33,55 +45,71 @@ class SpaceTreeView extends StatelessWidget {
|
|||||||
),
|
),
|
||||||
const SizedBox(height: 16),
|
const SizedBox(height: 16),
|
||||||
Expanded(
|
Expanded(
|
||||||
child: Padding(
|
child: ListView(
|
||||||
|
shrinkWrap: true,
|
||||||
|
scrollDirection: Axis.horizontal,
|
||||||
|
children: [
|
||||||
|
Container(
|
||||||
|
width: MediaQuery.sizeOf(context).width * 0.5,
|
||||||
padding: const EdgeInsets.all(8.0),
|
padding: const EdgeInsets.all(8.0),
|
||||||
child: list.isEmpty
|
child: list.isEmpty
|
||||||
? Center(
|
? Center(
|
||||||
child: Text(
|
child: Text(
|
||||||
'No results found',
|
'No results found',
|
||||||
style: Theme.of(context).textTheme.bodySmall!.copyWith(
|
style: Theme.of(context).textTheme.bodySmall!.copyWith(
|
||||||
color: ColorsManager.lightGrayColor, // Gray when not selected
|
color: ColorsManager.lightGrayColor,
|
||||||
fontWeight: FontWeight.w400,
|
fontWeight: FontWeight.w400,
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
)
|
)
|
||||||
: ListView(
|
: Scrollbar(
|
||||||
|
scrollbarOrientation: ScrollbarOrientation.left,
|
||||||
|
thumbVisibility: true,
|
||||||
|
controller: _scrollController,
|
||||||
|
child: Padding(
|
||||||
|
padding: const EdgeInsets.only(left: 16),
|
||||||
|
child: ListView(
|
||||||
|
controller: _scrollController,
|
||||||
shrinkWrap: true,
|
shrinkWrap: true,
|
||||||
children: list
|
children: list
|
||||||
.map(
|
.map(
|
||||||
(community) => CustomExpansionTileSpaceTree(
|
(community) => CustomExpansionTileSpaceTree(
|
||||||
title: community.name,
|
title: community.name,
|
||||||
isSelected:
|
isSelected: state.selectedCommunities
|
||||||
state.selectedCommunities.contains(community.uuid),
|
.contains(community.uuid),
|
||||||
isSoldCheck:
|
isSoldCheck: state.selectedCommunities
|
||||||
state.selectedCommunities.contains(community.uuid),
|
.contains(community.uuid),
|
||||||
onExpansionChanged: () {
|
onExpansionChanged: () {
|
||||||
context
|
context
|
||||||
.read<SpaceTreeBloc>()
|
.read<SpaceTreeBloc>()
|
||||||
.add(OnCommunityExpanded(community.uuid));
|
.add(OnCommunityExpanded(community.uuid));
|
||||||
},
|
},
|
||||||
isExpanded:
|
isExpanded: state.expandedCommunities
|
||||||
state.expandedCommunities.contains(community.uuid),
|
.contains(community.uuid),
|
||||||
onItemSelected: () {
|
onItemSelected: () {
|
||||||
context.read<SpaceTreeBloc>().add(
|
context.read<SpaceTreeBloc>().add(
|
||||||
OnCommunitySelected(community.uuid, community.spaces));
|
OnCommunitySelected(
|
||||||
|
community.uuid, community.spaces));
|
||||||
onSelect();
|
widget.onSelect();
|
||||||
},
|
},
|
||||||
children: community.spaces.map((space) {
|
children: community.spaces.map((space) {
|
||||||
return CustomExpansionTileSpaceTree(
|
return CustomExpansionTileSpaceTree(
|
||||||
title: space.name,
|
title: space.name,
|
||||||
isExpanded: state.expandedSpaces.contains(space.uuid),
|
isExpanded:
|
||||||
|
state.expandedSpaces.contains(space.uuid),
|
||||||
onItemSelected: () {
|
onItemSelected: () {
|
||||||
context.read<SpaceTreeBloc>().add(OnSpaceSelected(
|
context.read<SpaceTreeBloc>().add(
|
||||||
community.uuid, space.uuid ?? '', space.children));
|
OnSpaceSelected(community.uuid,
|
||||||
onSelect();
|
space.uuid ?? '', space.children));
|
||||||
|
widget.onSelect();
|
||||||
},
|
},
|
||||||
onExpansionChanged: () {
|
onExpansionChanged: () {
|
||||||
context.read<SpaceTreeBloc>().add(
|
context.read<SpaceTreeBloc>().add(
|
||||||
OnSpaceExpanded(community.uuid, space.uuid ?? ''));
|
OnSpaceExpanded(
|
||||||
|
community.uuid, space.uuid ?? ''));
|
||||||
},
|
},
|
||||||
isSelected: state.selectedSpaces.contains(space.uuid) ||
|
isSelected:
|
||||||
|
state.selectedSpaces.contains(space.uuid) ||
|
||||||
state.soldCheck.contains(space.uuid),
|
state.soldCheck.contains(space.uuid),
|
||||||
isSoldCheck: state.soldCheck.contains(space.uuid),
|
isSoldCheck: state.soldCheck.contains(space.uuid),
|
||||||
children: _buildNestedSpaces(
|
children: _buildNestedSpaces(
|
||||||
@ -94,6 +122,73 @@ class SpaceTreeView extends StatelessWidget {
|
|||||||
),
|
),
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
),
|
||||||
|
|
||||||
|
// Expanded(
|
||||||
|
// child: Padding(
|
||||||
|
// padding: const EdgeInsets.all(8.0),
|
||||||
|
// child: list.isEmpty
|
||||||
|
// ? Center(
|
||||||
|
// child: Text(
|
||||||
|
// 'No results found',
|
||||||
|
// style: Theme.of(context).textTheme.bodySmall!.copyWith(
|
||||||
|
// color: ColorsManager.lightGrayColor, // Gray when not selected
|
||||||
|
// fontWeight: FontWeight.w400,
|
||||||
|
// ),
|
||||||
|
// ),
|
||||||
|
// )
|
||||||
|
// : ListView(
|
||||||
|
// shrinkWrap: true,
|
||||||
|
// children: list
|
||||||
|
// .map(
|
||||||
|
// (community) => CustomExpansionTileSpaceTree(
|
||||||
|
// title: community.name,
|
||||||
|
// isSelected:
|
||||||
|
// state.selectedCommunities.contains(community.uuid),
|
||||||
|
// isSoldCheck:
|
||||||
|
// state.selectedCommunities.contains(community.uuid),
|
||||||
|
// onExpansionChanged: () {
|
||||||
|
// context
|
||||||
|
// .read<SpaceTreeBloc>()
|
||||||
|
// .add(OnCommunityExpanded(community.uuid));
|
||||||
|
// },
|
||||||
|
// isExpanded:
|
||||||
|
// state.expandedCommunities.contains(community.uuid),
|
||||||
|
// onItemSelected: () {
|
||||||
|
// context.read<SpaceTreeBloc>().add(
|
||||||
|
// OnCommunitySelected(community.uuid, community.spaces));
|
||||||
|
|
||||||
|
// onSelect();
|
||||||
|
// },
|
||||||
|
// children: community.spaces.map((space) {
|
||||||
|
// return CustomExpansionTileSpaceTree(
|
||||||
|
// title: space.name,
|
||||||
|
// isExpanded: state.expandedSpaces.contains(space.uuid),
|
||||||
|
// onItemSelected: () {
|
||||||
|
// context.read<SpaceTreeBloc>().add(OnSpaceSelected(
|
||||||
|
// community.uuid, space.uuid ?? '', space.children));
|
||||||
|
// onSelect();
|
||||||
|
// },
|
||||||
|
// onExpansionChanged: () {
|
||||||
|
// context.read<SpaceTreeBloc>().add(
|
||||||
|
// OnSpaceExpanded(community.uuid, space.uuid ?? ''));
|
||||||
|
// },
|
||||||
|
// isSelected: state.selectedSpaces.contains(space.uuid) ||
|
||||||
|
// state.soldCheck.contains(space.uuid),
|
||||||
|
// isSoldCheck: state.soldCheck.contains(space.uuid),
|
||||||
|
// children: _buildNestedSpaces(
|
||||||
|
// context, state, space, community.uuid),
|
||||||
|
// );
|
||||||
|
// }).toList(),
|
||||||
|
// ),
|
||||||
|
// )
|
||||||
|
// .toList(),
|
||||||
|
// ),
|
||||||
|
// ),
|
||||||
|
// ),
|
||||||
],
|
],
|
||||||
),
|
),
|
||||||
);
|
);
|
||||||
@ -113,7 +208,7 @@ class SpaceTreeView extends StatelessWidget {
|
|||||||
context
|
context
|
||||||
.read<SpaceTreeBloc>()
|
.read<SpaceTreeBloc>()
|
||||||
.add(OnSpaceSelected(communityId, child.uuid ?? '', child.children));
|
.add(OnSpaceSelected(communityId, child.uuid ?? '', child.children));
|
||||||
onSelect();
|
widget.onSelect();
|
||||||
},
|
},
|
||||||
onExpansionChanged: () {
|
onExpansionChanged: () {
|
||||||
context.read<SpaceTreeBloc>().add(OnSpaceExpanded(communityId, child.uuid ?? ''));
|
context.read<SpaceTreeBloc>().add(OnSpaceExpanded(communityId, child.uuid ?? ''));
|
||||||
|
Reference in New Issue
Block a user