fix(ui): display selected device name when add devices in DetailGroupScreen

This commit is contained in:
anhtunz
2025-02-11 11:55:51 +07:00
parent a98e84880b
commit bfeba03490
6 changed files with 124 additions and 98 deletions

View File

@@ -19,74 +19,84 @@ addDeviceDialog(BuildContext context, DetailGroupBloc detailGroupBloc,
devices.any((device) => device.thingId == element.thingId));
}
showDialog(
context: context,
builder: (dialogContext) {
return AlertDialog(
title: Center(child: Text(appLocalization(context).add_device_title)),
content: DropdownButtonFormField2<String>(
isExpanded: true,
decoration: InputDecoration(
contentPadding: const EdgeInsets.symmetric(vertical: 10),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(15),
context: context,
builder: (dialogContext) {
return StatefulBuilder(
builder: (context, setState) {
return AlertDialog(
title:
Center(child: Text(appLocalization(context).add_device_title)),
content: DropdownButtonFormField2<String>(
isExpanded: true,
decoration: InputDecoration(
contentPadding: const EdgeInsets.symmetric(vertical: 10),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(15),
),
),
),
hint: Text(
appLocalization(context).choose_device_dropdownButton,
style: const TextStyle(fontSize: 14),
),
items: ownerDevices
.map((item) => DropdownMenuItem<String>(
value: item.thingId,
child: StatefulBuilder(builder: (context, menuSetState) {
final isSelected = selectedItems.contains(item.thingId);
final isNameSelected = selectedItems.contains(item.name);
return InkWell(
onTap: () {
isSelected
? selectedItems.remove(item.thingId)
: selectedItems.add(item.thingId!);
isNameSelected
? selectedDevices.remove(item.name)
: selectedDevices.add(item.name!);
menuSetState(() {});
hint: Text(
appLocalization(context).choose_device_dropdownButton,
style: const TextStyle(fontSize: 14),
),
items: ownerDevices
.map(
(item) => DropdownMenuItem<String>(
value: item.thingId,
enabled: false,
child: StatefulBuilder(
builder: (context, menuSetState) {
final isSelected =
selectedItems.contains(item.thingId);
return InkWell(
onTap: () {
if (isSelected) {
selectedItems.remove(item.thingId);
} else {
selectedItems.add(item.thingId!);
}
selectedDevices =
getDevices(ownerDevices, selectedItems);
setState(() {});
menuSetState(() {});
},
child: Container(
height: double.infinity,
padding:
const EdgeInsets.symmetric(horizontal: 16.0),
child: Row(
children: [
if (isSelected)
const Icon(Icons.check_box_outlined)
else
const Icon(Icons.check_box_outline_blank),
const SizedBox(width: 10),
Expanded(
child: Text(
item.name!,
style: const TextStyle(fontSize: 14),
),
),
],
),
),
);
},
child: SizedBox(
height: double.infinity,
child: Row(
children: [
if (isSelected)
const Icon(Icons.check_box_outlined)
else
const Icon(Icons.check_box_outline_blank),
const SizedBox(width: 10),
Expanded(
child: Text(
item.name!,
style: const TextStyle(fontSize: 14),
))
],
),
),
);
})))
.toList(),
buttonStyleData: const ButtonStyleData(
padding: EdgeInsets.only(right: 8),
),
onChanged: (value) {
// thingID = value!;
// setState(() {});
},
onSaved: (value) {},
selectedItemBuilder: (context) {
return selectedDevices.map(
(item) {
),
),
)
.toList(),
value: selectedItems.isEmpty ? null : selectedItems.last,
buttonStyleData: const ButtonStyleData(
padding: EdgeInsets.only(right: 8),
),
onChanged: (value) {},
onSaved: (value) {},
selectedItemBuilder: (context) {
return ownerDevices.map((device) {
return Container(
alignment: AlignmentDirectional.center,
child: Text(
item,
selectedDevices.join(', '),
style: const TextStyle(
fontSize: 14,
overflow: TextOverflow.ellipsis,
@@ -94,41 +104,50 @@ addDeviceDialog(BuildContext context, DetailGroupBloc detailGroupBloc,
maxLines: 1,
),
);
},
).toList();
},
iconStyleData: IconStyleData(
icon: IconConstants.instance
.getMaterialIcon(Icons.arrow_drop_down)),
dropdownStyleData: DropdownStyleData(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(15),
),
),
menuItemStyleData: const MenuItemStyleData(
padding: EdgeInsets.symmetric(horizontal: 16),
),
),
actions: <Widget>[
TextButton(
onPressed: () {
Navigator.of(dialogContext).pop();
}).toList();
},
child: Text(
appLocalization(context).cancel_button_content,
style: const TextStyle(color: Colors.red),
iconStyleData: IconStyleData(
icon: IconConstants.instance
.getMaterialIcon(Icons.arrow_drop_down)),
dropdownStyleData: DropdownStyleData(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(15),
),
),
),
TextButton(
actions: <Widget>[
TextButton(
onPressed: () {
Navigator.of(dialogContext).pop();
},
child: Text(
appLocalization(context).cancel_button_content,
style: const TextStyle(color: Colors.red),
),
),
TextButton(
onPressed: () async {
for (var device in selectedItems) {
await detailGroupBloc.addDeviceToGroup(
context, groupID, device);
await detailGroupBloc.getGroupDetail(groupID);
}
Navigator.of(dialogContext).pop();
},
child: Text(appLocalization(context).add_device_title))
],
);
});
child: Text(appLocalization(context).add_device_title),
),
],
);
},
);
},
);
}
List<String> getDevices(List<Device> devices, List<String> selectedDevices) {
return devices
.where((device) => selectedDevices.contains(device.thingId))
.map((device) => device.name ?? '')
.toList();
}

View File

@@ -62,8 +62,10 @@ class _MainScreenState extends State<MainScreen> with WidgetsBindingObserver {
}
if (theme == AppThemes.LIGHT.name) {
isLight = true;
} else {
} else if (theme == AppThemes.DARK.name) {
isLight = false;
} else {
isLight = true;
}
mainBloc.sinkIsVNIcon.add(isVN);
mainBloc.sinkThemeMode.add(isLight);
@@ -325,7 +327,7 @@ class _MainScreenState extends State<MainScreen> with WidgetsBindingObserver {
controller: controller,
screens: _buildScreens(),
items: _navBarsItems(),
handleAndroidBackButtonPress: true,
handleAndroidBackButtonPress: false,
resizeToAvoidBottomInset: true,
stateManagement: true,
backgroundColor:

View File

@@ -245,9 +245,7 @@ class _MapScreenState extends State<MapScreen> with WidgetsBindingObserver {
hasOtherState = true;
}
}
// log("Has state = 1: $hasStateOne, Has other state: $hasOtherState");
if (hasStateOne) {
return true; // flameIcon
} else if (hasOtherState) {

View File

@@ -23,4 +23,6 @@ class ApplicationConstants {
static const DEVICE_NOTIFICATIONS_SETTINGS = "/device-notifications-settings";
static const OWNER_GROUP = "owner";
static const PARTICIPANT_GROUP = "participant";
static const NO_DATA = "no_data";
static const LOADING = "loading";
}

View File

@@ -136,9 +136,12 @@ class DeviceUtils {
List<Device> sortDeviceByState(List<Device> devices) {
List<Device> sortedDevices = List.from(devices);
sortedDevices.sort((a, b) {
int stateOrder = [2, 1, 3, 0, -1, 3].indexOf(a.state!) -
[2, 1, 3, 0, -1, 3].indexOf(b.state!);
return stateOrder;
int stateOrder = [2, 1, 3, 0, -1].indexOf(a.state!) -
[2, 1, 3, 0, -1].indexOf(b.state!);
if (stateOrder != 0) {
return stateOrder;
}
return a.name!.compareTo(b.name!);
});
return sortedDevices;

View File

@@ -21,3 +21,5 @@ void showSnackBarResponseByStatusCodeNoIcon(BuildContext context, int statusCode
showNoIconTopSnackBar(context, failedMessage, Colors.red, Colors.white);
}
}