import 'package:flutter/material.dart';
import 'package:provider/provider.dart';

import '../../../controllers/localization/localization.dart';
import '../../../controllers/providers/api/service_requests_provider.dart';
import '../../../controllers/validator/validator.dart';
import '../../../models/issue.dart';
import '../../../models/service_request/service_request.dart';
import '../../app_style/colors.dart';
import '../../app_style/sizing.dart';
import '../../widgets/app_text_form_field.dart';
import '../../widgets/buttons/app_back_button.dart';
import '../../widgets/buttons/app_button.dart';
import '../../widgets/issues/report_issue_item.dart';
import '../../widgets/loaders/loading_manager.dart';

class ReportIssuesPage extends StatefulWidget {
  static const String id = "/report-issue";
  final ServiceRequest? serviceRequest;

  const ReportIssuesPage({Key? key, this.serviceRequest}) : super(key: key);

  @override
  ReportIssuesPageState createState() => ReportIssuesPageState();
}

class ReportIssuesPageState extends State<ReportIssuesPage> {
  final List<String> _issues = [];
  final Issue _issue = Issue(reports: []);
  late double _height;
  late ServiceRequestsProvider _serviceRequestsProvider;
  final GlobalKey<FormState> _formKey = GlobalKey<FormState>();

  @override
  Widget build(BuildContext context) {
    final subtitle = AppLocalization.of(context)?.subtitle;
    _serviceRequestsProvider = Provider.of<ServiceRequestsProvider>(context);
    _height = MediaQuery.of(context).size.height;
    subtitle?.setIssues(_issues);
    return Scaffold(
      body: SafeArea(
        child: Form(
          key: _formKey,
          child: LoadingManager(
            onRefresh: () async {},
            stateCode: 200,
            isFailedLoading: false,
            isLoading: _serviceRequestsProvider.loading,
            child: Stack(
              children: [
                SingleChildScrollView(
                  child: Column(
                    children: [
                      Center(
                        child: Padding(
                          padding: EdgeInsets.symmetric(
                            horizontal: 16 * AppStyle.getScaleFactor(context),
                            vertical: 24 * AppStyle.getScaleFactor(context),
                          ),
                          child: Text(
                            subtitle?.reportIssue ?? '',
                            style: Theme.of(context).textTheme.headlineSmall?.copyWith(color: AColors.cyan, fontWeight: FontWeight.bold),
                          ),
                        ),
                      ),
                      Image(height: _height / 8, image: const AssetImage("assets/images/logo.png")),
                      Container(
                        padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 16),
                        decoration: BoxDecoration(
                            color: AColors.grey,
                            borderRadius: BorderRadius.only(
                              topLeft: Radius.circular(AppStyle.getBorderRadius(context)),
                              topRight: Radius.circular(AppStyle.getBorderRadius(context)),
                            ),
                            boxShadow: const [
                              BoxShadow(
                                color: AColors.grey,
                                offset: Offset(0, -1),
                              )
                            ]),
                        child: Column(
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: [
                            ATextFormField(
                              initialValue: _issue.title,
                              hintText: subtitle?.title,
                              textAlign: TextAlign.center,
                              style: Theme.of(context).textTheme.titleLarge,
                              validator: (value) => Validator.hasValue(value) ? null : subtitle?.titleValidateMessage,
                              textInputType: TextInputType.name,
                              onSaved: (value) {
                                _issue.title = value;
                              },
                            ),
                            const SizedBox(height: 8),
                            Column(
                                children: List.generate(
                                    _issues.length,
                                    (index) => ReportIssueItem(
                                          isSelected: _issue.reports?.contains(index),
                                          issueInfo: _issues[index],
                                          onChange: (info, value) {
                                            if (value) {
                                              _issue.reports?.add(index);
                                            } else {
                                              _issue.reports?.remove(index);
                                            }
                                            setState(() {});
                                          },
                                        ))),
                            Padding(
                              padding: const EdgeInsets.all(8.0),
                              child: Text(
                                "${subtitle?.shareAntherIssue} :",
                                style: Theme.of(context).textTheme.titleLarge,
                              ),
                            ),
                            ATextFormField(
                              hintText: subtitle?.description,
                              style: Theme.of(context).textTheme.titleMedium,
                              textInputType: TextInputType.multiline,
                              onSaved: (value) {
                                _issue.description = value;
                              },
                            ),
                            Padding(
                              padding: const EdgeInsets.all(8.0),
                              child: AButton(
                                text: subtitle?.submit ?? '',
                                onPressed: () async {
                                  if (_formKey.currentState?.validate() ?? false) {
                                    _issue.serviceRequestId = widget.serviceRequest?.id;
                                    _formKey.currentState?.save();
                                    await _serviceRequestsProvider.createIssueReport(context, issue: _issue);
                                  }
                                },
                              ),
                            ),
                          ],
                        ),
                      ),
                    ],
                  ),
                ),
                const ABackButton(),
              ],
            ),
          ),
        ),
      ),
    );
  }
}