Untitled

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:get/get.dart';
import 'package:get/get_core/src/get_main.dart';
import 'package:percent_indicator/circular_percent_indicator.dart';
import 'package:the_citizen_app/src/config/base.dart';
import 'package:the_citizen_app/src/helpers/hex_color.dart';
import 'package:the_citizen_app/src/helpers/k_text.dart';
import 'package:the_citizen_app/src/helpers/global_helper.dart';
import 'package:the_citizen_app/src/helpers/loading.dart';
import 'package:the_citizen_app/src/helpers/route.dart';
import 'package:the_citizen_app/src/pages/report_details_page.dart';

import 'package:collection/collection.dart';

import '../config/app_theme.dart';

class SyncOfflineShoutPage extends StatefulWidget {
  @override
  State<SyncOfflineShoutPage> createState() => _SyncOfflineShoutPageState();
}

class _SyncOfflineShoutPageState extends State<SyncOfflineShoutPage> with Base {
  @override
  void initState() {
    super.initState();
    SystemChrome.setPreferredOrientations([
      DeviceOrientation.portraitUp,
      DeviceOrientation.portraitDown,
    ]);
  }

  @override
  dispose() {
    SystemChrome.setPreferredOrientations([
      DeviceOrientation.landscapeRight,
      DeviceOrientation.landscapeLeft,
      DeviceOrientation.portraitUp,
      DeviceOrientation.portraitDown,
    ]);
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SingleChildScrollView(
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            SizedBox(height: 10),
            ShoutStoredInDevice(),
            SizedBox(height: 10),
            ShoutStoredShoutList(),
          ],
        ),
      ),
      bottomNavigationBar: authC.loginType.value == 'online' ? SyncButton() : SizedBox(),
    );
  }
}

class ShoutStoredInDevice extends StatelessWidget with Base {
  @override
  Widget build(BuildContext context) {
    return Obx(
      () => CircularPercentIndicator(
        header: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: [
              KText(
                text: 'Offline shouts stored in this device:',
                fontSize: 16,
                bold: true,
              ),
              SizedBox(height: 10),
            ],
          ),
        ),
        // animationDuration: 2200,
        // animation: true,
        radius: 100.0,
        lineWidth: 20.0,
        percent: 0.0,
        center: Row(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                Text(
                  '${shoutC.offlineShoutList.length}',
                  style: TextStyle(
                    fontWeight: FontWeight.w700,
                    fontSize: 50,
                    color: Colors.grey,
                  ),
                )
              ],
            )
          ],
        ),

        circularStrokeCap: CircularStrokeCap.butt,
        backgroundColor: shoutC.offlineShoutList == 0 ? Colors.grey.shade300 : Colors.grey,
        progressColor: Colors.green,
      ),
    );
  }
}

class ShoutStoredShoutList extends StatelessWidget with Base {
  @override
  Widget build(BuildContext context) {
    return Obx(() => shoutC.offlineShoutList.isEmpty
        ? SizedBox()
        : Container(
            height: 350,
            child: SingleChildScrollView(
              scrollDirection: Axis.vertical,
              child: SingleChildScrollView(
                scrollDirection: Axis.horizontal,
                physics: BouncingScrollPhysics(),
                child: Container(
                  width: Get.width,
                  margin: EdgeInsets.symmetric(horizontal: 10.0, vertical: 5.0),
                  child: DataTable(
                    headingRowHeight: 35,
                    columnSpacing: 13,
                    showCheckboxColumn: false,
                    horizontalMargin: 10,
                    dividerThickness: 1,
                    showBottomBorder: true,
                    headingRowColor: MaterialStateColor.resolveWith((states) => hexToColor('#EFF6FF')),
                    // headingTextStyle: TextStyle(color: Colors.black),
                    columns: [
                      DataColumn(
                        numeric: false,
                        label: Expanded(
                          child: Text(
                            "Date",
                            style: TextStyle(
                              fontFamily: 'Manrope',
                              fontSize: 15.0,
                              color: hexToColor('#141C44'),
                              fontWeight: FontWeight.w700,
                            ),
                          ),
                        ),
                      ),
                      DataColumn(
                        numeric: false,
                        label: Expanded(
                          child: Text(
                            "Type",
                            style: TextStyle(
                              fontFamily: 'Manrope',
                              fontSize: 15.0,
                              color: hexToColor('#141C44'),
                              fontWeight: FontWeight.w700,
                            ),
                          ),
                        ),
                      ),
                    ],

                    rows: shoutC.offlineShoutList
                        .mapIndexed((index, item) => DataRow(
                              cells: <DataCell>[
                                DataCell(
                                  KText(
                                    text: '${formatDate(date: item.reportedAt!)}',
                                  ),
                                  onTap: () async {
                                    push(OfflineReportDetailsPage(
                                      item: item,
                                    ));
                                  },
                                ),
                                DataCell(
                                  KText(
                                    // text: myReports.subcategoryName,
                                    text: '${item.subcategoryName!}',
                                    maxLines: 2,
                                  ),
                                  onTap: () {
                                    push(OfflineReportDetailsPage(
                                      item: item,
                                    ));
                                  },
                                ),
                              ],
                            ))
                        .toList(),
                  ),
                ),
              ),
            ),
          ));
  }
}

class SyncButton extends StatelessWidget with Base {
  @override
  Widget build(BuildContext context) {
    return Obx(
      () => SizedBox(
        width: Get.width,
        height: 40,
        child: ElevatedButton(
          style: ButtonStyle(
            shape: MaterialStateProperty.all<RoundedRectangleBorder>(
              RoundedRectangleBorder(
                borderRadius: BorderRadius.circular(0.0),
              ),
            ),
            foregroundColor: MaterialStateProperty.all(Colors.white),
            backgroundColor: MaterialStateProperty.all(hexToColor('#F2BA14')),
          ),
          child: shoutC.isSubmitOfflineShout.value
              ? Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    SizedBox(
                      height: 20,
                      width: 20,
                      child: Loading(
                        color: Colors.white,
                      ),
                    ),
                    SizedBox(
                      width: 10,
                    ),
                    Text(
                      'Sync Shout',
                      style: TextStyle(
                        fontFamily: 'Manrope',
                        fontSize: 18.0,
                        color: AppTheme.white,
                        fontWeight: FontWeight.w700,
                      ),
                    ),
                  ],
                )
              : Row(
                  crossAxisAlignment: CrossAxisAlignment.center,
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    Icon(
                      Icons.sync,
                      color: AppTheme.white,
                    ),
                    Text(
                      'Sync Shout',
                      style: TextStyle(
                        fontFamily: 'Manrope',
                        fontSize: 18.0,
                        color: AppTheme.white,
                        fontWeight: FontWeight.w700,
                      ),
                    ),
                  ],
                ),
          onPressed: () async {
            if (shoutC.isSubmitOfflineShout.value == false) {
              shoutC.syncOfflineShouts();
            }
          },
        ),
      ),
    );
  }
}