diff --git a/lib/modules/asset_tracking/asset_tracking_provider.dart b/lib/modules/asset_tracking/asset_tracking_provider.dart index 389ec57c..fe99bd86 100644 --- a/lib/modules/asset_tracking/asset_tracking_provider.dart +++ b/lib/modules/asset_tracking/asset_tracking_provider.dart @@ -90,12 +90,9 @@ class AssetTrackingProvider extends ChangeNotifier { try { assetsOnTheFloorList.clear(); final response = await ApiManager.instance.post(URLs.getAssetsFromPenguin, body: { - // "campusId": selectedSite!.id, - // "venueIds": [selectedBuilding!.id], - // "floorIds": [selectedFloor!.id] - "campusId": 1, - "venueIds": [9], - "floorIds": [19] + "campusId": selectedSite!.id, + "venueIds": [selectedBuilding!.id], + "floorIds": [selectedFloor!.id] }); if (response.statusCode >= 200 && response.statusCode < 300) { final Map jsonData = json.decode(response.body); diff --git a/lib/modules/asset_tracking/map_tracking_page.dart b/lib/modules/asset_tracking/map_tracking_page.dart index a37bab4e..882b5212 100644 --- a/lib/modules/asset_tracking/map_tracking_page.dart +++ b/lib/modules/asset_tracking/map_tracking_page.dart @@ -10,6 +10,7 @@ import 'package:test_sa/extensions/widget_extensions.dart'; import 'package:test_sa/helper/utils.dart'; import 'package:test_sa/new_views/app_style/app_color.dart'; import 'package:test_sa/new_views/common_widgets/default_app_bar.dart'; +import 'package:test_sa/new_views/common_widgets/multiple_item_drop_down_menu.dart'; import 'package:test_sa/new_views/common_widgets/single_item_drop_down_menu.dart'; import 'package:test_sa/providers/loading_list_notifier.dart'; import 'package:test_sa/views/widgets/item_views/info_text_widget.dart'; @@ -39,7 +40,7 @@ class _MapTrackingPageState extends State { FloorMapModel? floorMapModel; Map? _geojson; - List markers = []; + List markers = []; // move to provider LatLngBounds? _computedBounds; final ExpansibleController expansibleController = ExpansibleController(); @@ -175,33 +176,69 @@ class _MapTrackingPageState extends State { userAgentPackageName: 'com.hmg.atoms', ), if (_geojson != null) ...[ - GeoJsonLayer.memory( - _geojson!, - styleDefaults: GeoJsonStyleDefaults.leaflet, - ), - if (!inAppView) MarkerLayer(markers: markers), + GeoJsonLayer.memory(_geojson!, styleDefaults: GeoJsonStyleDefaults.leaflet), + // if (!inAppView || ) + if (markers.isNotEmpty) MarkerLayer(markers: markers), if (inAppView) - Selector>( - selector: (_, myModel) => myModel.assetsOnTheFloorList, - builder: (_, assetsOnTheFloorList, __) { - return assetsOnTheFloorList.isEmpty - ? const SizedBox() - : DraggableScrollableSheet( - initialChildSize: _sheetPosition, - maxChildSize: .8, - minChildSize: .15, - builder: (BuildContext context, ScrollController scrollController) { - return ListView.separated( - controller: scrollController, - padding: EdgeInsets.zero, - itemCount: assetsOnTheFloorList.length, - separatorBuilder: (BuildContext context, int index) => 12.height, - itemBuilder: (BuildContext context, int index) { - return AssetTrackingListItemView(assetsOnTheFloorList[index]); - }, - ).bottomSheetContainer(context, padding: const EdgeInsets.all(16)); - }); - }), + Positioned( + bottom: 0, + left: 0, + right: 0, + child: Selector>( + selector: (_, myModel) => myModel.assetsOnTheFloorList, + builder: (_, assetsOnTheFloorList, __) { + return assetsOnTheFloorList.isEmpty + ? const SizedBox() + : Container( + margin: const EdgeInsets.all(16), + padding: const EdgeInsets.only(right: 0, left: 0), + decoration: BoxDecoration( + color: AppColor.tabBarBackground(context), + border: Border.all(color: AppColor.tabBarBorder(context)), + borderRadius: BorderRadius.circular(20), + ), + child: UpwardExpansionTile(title: InfoTextLabelWidget(label: "${assetsOnTheFloorList.length} Assets found on this floor"), children: [ + LimitedBox( + maxHeight: 120, + child: MultipleItemDropDownMenu( + context: context, + title: 'Select Assets To View ', + initialValue: [], + showShadow: false, + staticData: assetsOnTheFloorList, + showCancel: true, + showAsFullScreenDialog: true, + onSelect: (selectedAssets) { + print("selectedAssets:${selectedAssets?.length}"); + setState(() { + markers = [ + for (var asset in selectedAssets!) + Marker( + point: LatLng(asset.location!.latitude!, asset.location!.longitude!), + child: const Icon(Icons.location_pin, color: AppColor.red30), + ), + ]; + }); + // markers + }, + ).paddingOnly(start: 16, end: 16, top: 16), + ), + ]), + ); + + // Column( + // mainAxisSize: MainAxisSize.min, + // children: [ + // Container( + // width: 50.toScreenWidth, + // height: 6.toScreenHeight, + // decoration: BoxDecoration(color: AppColor.white50, borderRadius: BorderRadius.circular(30)), + // ).center, + // InfoTextLabelWidget(label: "There is ${assetsOnTheFloorList.length} assets on this floor"), + // ], + // ).bottomSheetContainer(context, padding: const EdgeInsets.all(16)); + }), + ), ] ], ); @@ -295,3 +332,55 @@ class _MapTrackingPageState extends State { : Scaffold(appBar: const DefaultAppBar(title: "Live Asset Tracking"), body: mapWidget); } } + +class UpwardExpansionTile extends StatefulWidget { + final Widget title; + final List children; + + const UpwardExpansionTile({Key? key, required this.title, required this.children}) : super(key: key); + + @override + _UpwardExpansionTileState createState() => _UpwardExpansionTileState(); +} + +class _UpwardExpansionTileState extends State { + bool _isExpanded = false; + + @override + Widget build(BuildContext context) { + return Column( + mainAxisSize: MainAxisSize.min, + crossAxisAlignment: CrossAxisAlignment.stretch, + children: [ + // Expanded content appears ABOVE the title + AnimatedCrossFade( + firstChild: const SizedBox.shrink(), + secondChild: Column( + mainAxisSize: MainAxisSize.min, + children: widget.children, + ), + crossFadeState: _isExpanded ? CrossFadeState.showSecond : CrossFadeState.showFirst, + duration: const Duration(milliseconds: 200), + ), + // The clickable header/title sits at the bottom + InkWell( + onTap: () { + setState(() { + _isExpanded = !_isExpanded; + }); + }, + child: Padding( + padding: const EdgeInsets.all(16.0), + child: Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + widget.title, + Icon(_isExpanded ? Icons.expand_less : Icons.expand_more), + ], + ), + ), + ), + ], + ); + } +} diff --git a/lib/modules/asset_tracking/models/asset_tracking_model.dart b/lib/modules/asset_tracking/models/asset_tracking_model.dart index 5eb45b2c..289588f1 100644 --- a/lib/modules/asset_tracking/models/asset_tracking_model.dart +++ b/lib/modules/asset_tracking/models/asset_tracking_model.dart @@ -1,4 +1,6 @@ -class AssetTrackingModel { +import 'package:test_sa/models/base.dart'; + +class AssetTrackingModel extends Base { int? id; String? label; String? serialNumber; @@ -10,11 +12,14 @@ class AssetTrackingModel { Tag? tag; Alerts? alerts; - AssetTrackingModel({this.id, this.label, this.serialNumber, this.group, this.type, this.department, this.status, this.location, this.tag, this.alerts}); + AssetTrackingModel({this.id, this.label, this.serialNumber, this.group, this.type, this.department, this.status, this.location, this.tag, this.alerts}) + : super(identifier: id?.toString(), name: label); AssetTrackingModel.fromJson(Map json) { id = json['id']; + identifier = json['id']?.toString(); label = json['label']; + name = json['label']; serialNumber = json['serialNumber']; group = json['group']; type = json['type'] != null ? new Type.fromJson(json['type']) : null; diff --git a/lib/new_views/common_widgets/multiple_item_drop_down_menu.dart b/lib/new_views/common_widgets/multiple_item_drop_down_menu.dart index dd199c0c..95d26ceb 100644 --- a/lib/new_views/common_widgets/multiple_item_drop_down_menu.dart +++ b/lib/new_views/common_widgets/multiple_item_drop_down_menu.dart @@ -236,45 +236,47 @@ class _MultipleItemDropDownMenuState AnimatedSize( - duration: const Duration(milliseconds: 300), - curve: Curves.easeInOut, - child: AnimatedOpacity( - opacity: _selectedItem.contains(_selectedItem[index]) ? 1.0 : 0.0, + Flexible( + child: Wrap( + runSpacing: 4.toScreenHeight, + spacing: 4.toScreenWidth, + children: List.generate( + _selectedItem.length, + (index) => AnimatedSize( duration: const Duration(milliseconds: 300), curve: Curves.easeInOut, - child: Theme( - data: Theme.of(context).copyWith( - splashColor: Colors.transparent, - highlightColor: Colors.transparent, - ), - child: Chip( - backgroundColor: AppColor.backgroundTabBarColor(context), - side: BorderSide(color: AppColor.border2Color(context)), - label: Text(_selectedItem[index].name!), - shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(30.0)), - labelStyle: AppTextStyles.tinyFont2.copyWith( - color: AppColor.labelTextStyleColor(context), + child: AnimatedOpacity( + opacity: _selectedItem.contains(_selectedItem[index]) ? 1.0 : 0.0, + duration: const Duration(milliseconds: 300), + curve: Curves.easeInOut, + child: Theme( + data: Theme.of(context).copyWith( + splashColor: Colors.transparent, + highlightColor: Colors.transparent, + ), + child: Chip( + backgroundColor: AppColor.backgroundTabBarColor(context), + side: BorderSide(color: AppColor.border2Color(context)), + label: Text(_selectedItem[index].name!), + shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(30.0)), + labelStyle: AppTextStyles.tinyFont2.copyWith( + color: AppColor.labelTextStyleColor(context), + ), + deleteIconColor: AppColor.icon2Color(context), + materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, + onDeleted: () { + setState(() { + _selectedItem.removeAt(index); + }); + widget.onSelect!(_selectedItem); + }, ), - deleteIconColor: AppColor.icon2Color(context), - materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, - onDeleted: () { - setState(() { - _selectedItem.removeAt(index); - }); - widget.onSelect!(_selectedItem); - }, ), ), ), ), - ), - ).paddingOnly(top: 4), + ).paddingOnly(top: 4), + ), ], ) .onPress(