syncrow-web/lib/pages/device_managment/shared/table/report_table.dart

import 'package:flutter/material.dart';
import 'package:syncrow_web/pages/device_managment/all_devices/models/device_reports.dart';
import 'package:syncrow_web/pages/device_managment/shared/table/table_cell_widget.dart';
import 'package:syncrow_web/pages/device_managment/shared/table/table_header.dart';

class ReportsTable extends StatelessWidget {
  final DeviceReport report;
  final Function(int index) onRowTap;
  final VoidCallback onClose;

  const ReportsTable({
    super.key,
    required this.report,
    required this.onRowTap,
    required this.onClose,
  });

  @override
  Widget build(BuildContext context) {
    return Stack(
      children: [
        Padding(
          padding: const EdgeInsets.all(20.0),
          child: Table(
            border: TableBorder.all(color: Colors.grey.shade300, width: 1),
            columnWidths: const {
              0: FlexColumnWidth(),
              1: FlexColumnWidth(),
              2: FlexColumnWidth(),
            },
            children: [
              TableRow(
                decoration: BoxDecoration(color: Colors.grey.shade200),
                children: const [
                  TableHeader(title: 'Date'),
                  TableHeader(title: 'Time'),
                  TableHeader(title: 'Status'),
                ],
              ),
              ...report.data!.asMap().entries.map((entry) {
                int index = entry.key;
                var data = entry.value;
                return TableRow(
                  children: [
                    TableCellWidget(value: data['date']),
                    TableCellWidget(value: data['time']),
                    TableCellWidget(
                      value: data['status'],
                      onTap: () => onRowTap(index),
                    ),
                  ],
                );
              }).toList(),
            ],
          ),
        ),
        Positioned(
          top: 0,
          right: 0,
          child: IconButton(
            icon: const Icon(
              Icons.close,
              color: Colors.red,
              size: 18,
            ),
            onPressed: onClose,
          ),
        ),
      ],
    );
  }
}