mirror of
https://github.com/SyncrowIOT/web.git
synced 2025-07-09 14:47:23 +00:00
295 lines
8.7 KiB
Dart
295 lines
8.7 KiB
Dart
import 'package:flutter/material.dart';
|
|
import 'package:flutter_svg/flutter_svg.dart';
|
|
import 'package:syncrow_web/utils/color_manager.dart';
|
|
import 'package:syncrow_web/utils/constants/assets.dart';
|
|
|
|
class DynamicTable extends StatefulWidget {
|
|
final List<String> headers;
|
|
final String? tableName;
|
|
final List<List<dynamic>> data;
|
|
final BoxDecoration? headerDecoration;
|
|
final BoxDecoration? cellDecoration;
|
|
final Size size;
|
|
final bool withCheckBox;
|
|
final bool withSelectAll;
|
|
final bool isEmpty;
|
|
final void Function(bool?)? selectAll;
|
|
final void Function(int, bool, dynamic)? onRowSelected;
|
|
final List<String>? initialSelectedIds;
|
|
final int uuidIndex;
|
|
const DynamicTable({
|
|
super.key,
|
|
required this.headers,
|
|
required this.data,
|
|
required this.size,
|
|
this.tableName,
|
|
required this.isEmpty,
|
|
required this.withCheckBox,
|
|
required this.withSelectAll,
|
|
this.headerDecoration,
|
|
this.cellDecoration,
|
|
this.selectAll,
|
|
this.onRowSelected,
|
|
this.initialSelectedIds,
|
|
required this.uuidIndex,
|
|
});
|
|
|
|
@override
|
|
_DynamicTableState createState() => _DynamicTableState();
|
|
}
|
|
|
|
class _DynamicTableState extends State<DynamicTable> {
|
|
late List<bool> _selected;
|
|
bool _selectAll = false;
|
|
|
|
@override
|
|
void initState() {
|
|
super.initState();
|
|
_initializeSelection();
|
|
}
|
|
|
|
@override
|
|
void didUpdateWidget(DynamicTable oldWidget) {
|
|
super.didUpdateWidget(oldWidget);
|
|
if (oldWidget.data != widget.data) {
|
|
_initializeSelection();
|
|
}
|
|
}
|
|
|
|
void _initializeSelection() {
|
|
_selected = List<bool>.generate(widget.data.length, (index) {
|
|
// Check if the initialSelectedIds contains the deviceUuid
|
|
// uuidIndex is the index of the column containing the deviceUuid
|
|
final deviceUuid = widget.data[index][widget.uuidIndex];
|
|
return widget.initialSelectedIds != null &&
|
|
widget.initialSelectedIds!.contains(deviceUuid);
|
|
});
|
|
}
|
|
|
|
void _toggleRowSelection(int index) {
|
|
setState(() {
|
|
_selected[index] = !_selected[index];
|
|
|
|
if (widget.onRowSelected != null) {
|
|
widget.onRowSelected!(index, _selected[index], widget.data[index]);
|
|
}
|
|
});
|
|
}
|
|
|
|
|
|
void _toggleSelectAll(bool? value) {
|
|
setState(() {
|
|
_selectAll = value ?? false;
|
|
_selected = List<bool>.filled(widget.data.length, _selectAll);
|
|
if (widget.selectAll != null) {
|
|
widget.selectAll!(_selectAll);
|
|
}
|
|
});
|
|
}
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return Container(
|
|
decoration: widget.cellDecoration,
|
|
child: SingleChildScrollView(
|
|
scrollDirection: Axis.horizontal,
|
|
child: SizedBox(
|
|
width: widget.size.width,
|
|
child: Column(
|
|
children: [
|
|
Container(
|
|
decoration: widget.headerDecoration ??
|
|
BoxDecoration(color: Colors.grey[200]),
|
|
child: Row(
|
|
children: [
|
|
if (widget.withCheckBox) _buildSelectAllCheckbox(),
|
|
...widget.headers
|
|
.map((header) => _buildTableHeaderCell(header)),
|
|
],
|
|
),
|
|
),
|
|
widget.isEmpty
|
|
? Expanded(
|
|
child: Column(
|
|
mainAxisAlignment: MainAxisAlignment.center,
|
|
children: [
|
|
Row(
|
|
crossAxisAlignment: CrossAxisAlignment.center,
|
|
mainAxisAlignment: MainAxisAlignment.center,
|
|
children: [
|
|
Column(
|
|
children: [
|
|
SvgPicture.asset(Assets.emptyTable),
|
|
const SizedBox(
|
|
height: 15,
|
|
),
|
|
Text(
|
|
// no password
|
|
widget.tableName=='AccessManagement'? 'No Password ' : 'No Devices',
|
|
style: Theme.of(context)
|
|
.textTheme
|
|
.bodySmall!
|
|
.copyWith(
|
|
color: ColorsManager.grayColor),
|
|
)
|
|
],
|
|
),
|
|
],
|
|
),
|
|
],
|
|
),
|
|
)
|
|
: Expanded(
|
|
child: Container(
|
|
color: Colors.white,
|
|
child: ListView.builder(
|
|
shrinkWrap: true,
|
|
itemCount: widget.data.length,
|
|
itemBuilder: (context, index) {
|
|
final row = widget.data[index];
|
|
return Row(
|
|
children: [
|
|
if (widget.withCheckBox)
|
|
_buildRowCheckbox(
|
|
index, widget.size.height * 0.10),
|
|
...row.map((cell) => _buildTableCell(
|
|
cell.toString(),
|
|
widget.size.height * 0.10)),
|
|
],
|
|
);
|
|
},
|
|
),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildSelectAllCheckbox() {
|
|
return Container(
|
|
width: 50,
|
|
padding: const EdgeInsets.all(8.0),
|
|
decoration: const BoxDecoration(
|
|
border: Border.symmetric(
|
|
vertical: BorderSide(color: ColorsManager.boxDivider),
|
|
),
|
|
),
|
|
child: Checkbox(
|
|
value: _selected.every((element) => element == true),
|
|
onChanged:widget.withSelectAll?_toggleSelectAll:null,
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildRowCheckbox(int index, double size) {
|
|
return Container(
|
|
width: 50,
|
|
padding: const EdgeInsets.all(8.0),
|
|
height: size,
|
|
decoration: const BoxDecoration(
|
|
border: Border(
|
|
bottom: BorderSide(
|
|
color: ColorsManager.boxDivider,
|
|
width: 1.0,
|
|
),
|
|
),
|
|
),
|
|
alignment: Alignment.centerLeft,
|
|
child: Center(
|
|
child: Checkbox(
|
|
value: _selected[index],
|
|
onChanged: (bool? value) {
|
|
_toggleRowSelection(index);
|
|
},
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildTableHeaderCell(String title) {
|
|
return Expanded(
|
|
child: Container(
|
|
decoration: const BoxDecoration(
|
|
border: Border.symmetric(
|
|
vertical: BorderSide(color: ColorsManager.boxDivider),
|
|
),
|
|
),
|
|
alignment: Alignment.centerLeft,
|
|
child: Padding(
|
|
padding: const EdgeInsets.all(8.0),
|
|
child: Text(
|
|
title,
|
|
style: const TextStyle(
|
|
fontWeight: FontWeight.w400,
|
|
fontSize: 13,
|
|
color: Color(0xFF999999),
|
|
),
|
|
maxLines: 2,
|
|
),
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildTableCell(String content, double size) {
|
|
bool isBatteryLevel = content.endsWith('%');
|
|
double? batteryLevel;
|
|
|
|
if (isBatteryLevel) {
|
|
batteryLevel = double.tryParse(content.replaceAll('%', '').trim());
|
|
}
|
|
|
|
Color? statusColor;
|
|
switch (content) {
|
|
case 'Effective':
|
|
statusColor = ColorsManager.textGreen;
|
|
break;
|
|
case 'Expired':
|
|
statusColor = ColorsManager.red;
|
|
break;
|
|
case 'To be effective':
|
|
statusColor = ColorsManager.yaGreen;
|
|
break;
|
|
case 'Online':
|
|
statusColor = ColorsManager.green;
|
|
break;
|
|
case 'Offline':
|
|
statusColor = ColorsManager.red;
|
|
break;
|
|
default:
|
|
statusColor = Colors.black;
|
|
}
|
|
|
|
return Expanded(
|
|
child: Container(
|
|
height: size,
|
|
padding: const EdgeInsets.all(5.0),
|
|
decoration: const BoxDecoration(
|
|
border: Border(
|
|
bottom: BorderSide(
|
|
color: ColorsManager.boxDivider,
|
|
width: 1.0,
|
|
),
|
|
),
|
|
),
|
|
alignment: Alignment.centerLeft,
|
|
child: Text(
|
|
content,
|
|
style: TextStyle(
|
|
color: (batteryLevel != null && batteryLevel < 20)
|
|
? ColorsManager.red
|
|
: (batteryLevel != null && batteryLevel > 20)
|
|
? ColorsManager.green
|
|
: statusColor,
|
|
fontSize: 10,
|
|
fontWeight: FontWeight.w400),
|
|
maxLines: 2,
|
|
),
|
|
),
|
|
);
|
|
}
|
|
}
|