import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart';
import 'package:flutter_spinkit/flutter_spinkit.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:hub/components/organism_components/up_arrow_linked_locals_component/up_arrow_linked_locals_component_model.dart';
import 'package:hub/features/backend/index.dart';
import 'package:hub/flutter_flow/flutter_flow_theme.dart';
import 'package:hub/flutter_flow/flutter_flow_util.dart';
import 'package:hub/flutter_flow/nav/nav.dart';

class UpArrowLinkedLocalsComponentWidget extends StatefulWidget {
  const UpArrowLinkedLocalsComponentWidget({super.key});

  @override
  State<UpArrowLinkedLocalsComponentWidget> createState() =>
      _UpArrowLinkedLocalsComponentWidgetState();
}

class _UpArrowLinkedLocalsComponentWidgetState
    extends State<UpArrowLinkedLocalsComponentWidget> {
  late UpArrowLinkedLocalsComponentModel _model;

  @override
  void setState(VoidCallback callback) {
    super.setState(callback);
    _model.onUpdate();
  }

  @override
  void initState() {
    super.initState();
    _model = createModel(context, () => UpArrowLinkedLocalsComponentModel());
  }

  @override
  void dispose() {
    _model.maybeDispose();

    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Align(
      alignment: const AlignmentDirectional(0.0, -1.0),
      child: Container(
        width: double.infinity,
        height: 150.0,
        decoration: BoxDecoration(
          color: FlutterFlowTheme.of(context).primaryBackground,
          borderRadius: const BorderRadius.only(
            bottomLeft: Radius.circular(25.0),
            bottomRight: Radius.circular(25.0),
            topLeft: Radius.circular(0.0),
            topRight: Radius.circular(0.0),
          ),
        ),
        child: Column(
          mainAxisSize: MainAxisSize.max,
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Expanded(
              child: Column(
                mainAxisSize: MainAxisSize.min,
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  Container(
                    height: 150.0,
                    decoration: const BoxDecoration(
                      borderRadius: BorderRadius.only(
                        bottomLeft: Radius.circular(0.0),
                        bottomRight: Radius.circular(0.0),
                        topLeft: Radius.circular(0.0),
                        topRight: Radius.circular(0.0),
                      ),
                    ),
                    child: FutureBuilder<ApiCallResponse>(
                      future: PhpGroup.getLocalsCall.call(),
                      builder: (context, snapshot) {
                        // Customize what your widget looks like when it's loading.
                        if (!snapshot.hasData) {
                          return Center(
                            child: SizedBox(
                              width: 50.0,
                              height: 50.0,
                              child: SpinKitCircle(
                                color: FlutterFlowTheme.of(context).primary,
                                size: 50.0,
                              ),
                            ),
                          );
                        }
                        final gridViewGetLocalsResponse = snapshot.data!;

                        return Builder(
                          builder: (context) {
                            final eachLocals = (PhpGroup.getLocalsCall
                                        .locais(
                                          gridViewGetLocalsResponse.jsonBody,
                                        )
                                        ?.map((e) => e)
                                        .toList()
                                        .toList() ??
                                    [])
                                .take(2)
                                .toList();

                            return GridView.builder(
                              padding: EdgeInsets.zero,
                              gridDelegate:
                                  const SliverGridDelegateWithFixedCrossAxisCount(
                                crossAxisCount: 1,
                                crossAxisSpacing: 10.0,
                                mainAxisSpacing: 0.0,
                                childAspectRatio: 1.0,
                              ),
                              scrollDirection: Axis.horizontal,
                              itemCount: eachLocals.length,
                              itemBuilder: (context, eachLocalsIndex) {
                                final eachLocalsItem =
                                    eachLocals[eachLocalsIndex];
                                return InkWell(
                                  splashColor: Colors.transparent,
                                  focusColor: Colors.transparent,
                                  hoverColor: Colors.transparent,
                                  highlightColor: Colors.transparent,
                                  onTap: () async {
                                    _model.cliUUID = getJsonField(
                                      eachLocalsItem,
                                      r'''$.CLI_ID''',
                                    ).toString();
                                    setState(() {});
                                    _model.cliName = getJsonField(
                                      eachLocalsItem,
                                      r'''$.CLI_NOME''',
                                    ).toString();
                                    setState(() {});
                                    context.pop();
                                  },
                                  child: Container(
                                    width: 50.0,
                                    height: double.infinity,
                                    decoration: const BoxDecoration(),
                                    alignment:
                                        const AlignmentDirectional(0.0, 0.0),
                                    child: Column(
                                      mainAxisSize: MainAxisSize.max,
                                      mainAxisAlignment:
                                          MainAxisAlignment.center,
                                      children: [
                                        Container(
                                          width: 100.0,
                                          height: 100.0,
                                          decoration: BoxDecoration(
                                            color: FlutterFlowTheme.of(context)
                                                .primaryText,
                                            borderRadius:
                                                const BorderRadius.only(
                                              bottomLeft: Radius.circular(25.0),
                                              bottomRight:
                                                  Radius.circular(25.0),
                                              topLeft: Radius.circular(25.0),
                                              topRight: Radius.circular(25.0),
                                            ),
                                            border: Border.all(
                                              color:
                                                  FlutterFlowTheme.of(context)
                                                      .secondaryText,
                                              width: 3.0,
                                            ),
                                          ),
                                          child: ClipRRect(
                                            borderRadius:
                                                const BorderRadius.only(
                                              bottomLeft: Radius.circular(25.0),
                                              bottomRight:
                                                  Radius.circular(25.0),
                                              topLeft: Radius.circular(25.0),
                                              topRight: Radius.circular(25.0),
                                            ),
                                            child: CachedNetworkImage(
                                              imageUrl:
                                                  "https://freaccess.com.br/freaccess/Images/Clients/${getJsonField(
                                                eachLocalsItem,
                                                r'''$.CLI_ID''',
                                              ).toString()}.png",
                                              width: double.infinity,
                                              height: double.infinity,
                                              fit: BoxFit.fill,
                                              alignment:
                                                  const Alignment(0.0, 0.0),
                                            ),
                                          ),
                                        ),
                                        Padding(
                                          padding: const EdgeInsetsDirectional
                                              .fromSTEB(0.0, 10.0, 0.0, 0.0),
                                          child: Text(
                                            getJsonField(
                                              eachLocalsItem,
                                              r'''$.CLI_NOME''',
                                            ).toString(),
                                            style: FlutterFlowTheme.of(context)
                                                .bodyMedium
                                                .override(
                                                  fontFamily:
                                                      FlutterFlowTheme.of(
                                                              context)
                                                          .bodyMediumFamily,
                                                  color: FlutterFlowTheme.of(
                                                          context)
                                                      .primaryText,
                                                  letterSpacing: 0.0,
                                                  useGoogleFonts: GoogleFonts
                                                          .asMap()
                                                      .containsKey(
                                                          FlutterFlowTheme.of(
                                                                  context)
                                                              .bodyMediumFamily),
                                                ),
                                          ),
                                        ),
                                      ],
                                    ),
                                  ),
                                );
                              },
                            );
                          },
                        );
                      },
                    ),
                  ),
                ],
              ),
            ),
          ],
        ),
      ),
    );
  }
}
