import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:test_sa/controllers/localization/localization.dart';
import 'package:test_sa/models/lookup.dart';
import 'package:test_sa/models/service_request/service_request_search.dart';
import 'package:test_sa/models/subtitle.dart';
import 'package:test_sa/views/app_style/sizing.dart';
import 'package:test_sa/views/widgets/buttons/app_button.dart';
import 'package:test_sa/views/widgets/buttons/app_small_button.dart';
import 'package:test_sa/views/widgets/hospitals/hospital_auto_complete_field.dart';
import 'package:test_sa/views/widgets/status/service_request/service_request_status_mune.dart';
import 'package:test_sa/views/widgets/status/service_request/service_request_types_mune.dart';
import 'package:test_sa/views/widgets/titles/app_sub_title.dart';

import '../app_text_form_field.dart';
import 'filter_item.dart';
class ServiceRequestsSearchDialog extends StatefulWidget {
  final ServiceRequestSearch initialSearchValue;
  final bool expandedSearch;
  final Function(ServiceRequestSearch) onSearch;

  const ServiceRequestsSearchDialog({
    Key key,
    this.initialSearchValue,
    this.expandedSearch,
    this.onSearch
  }) : super(key: key);
  @override
  _ServiceRequestsSearchDialogState createState() => _ServiceRequestsSearchDialogState();
}

class _ServiceRequestsSearchDialogState extends State<ServiceRequestsSearchDialog>
    with TickerProviderStateMixin{
  ServiceRequestSearch _search;
  List<Lookup> status = [
    Lookup(name: "New", id: 4,),

    Lookup(name: "Repaired", id: 6,),
    Lookup(name: "Repeated", id: 8),
    Lookup(name: "Closed", id: 9,),
    Lookup(name: "Under Repair", id: 5,),
  ];

  final GlobalKey<FormState> _formKey = GlobalKey<FormState>();

  @override
  void initState() {
    super.initState();
    _search = ServiceRequestSearch();
    _search.fromSearch(widget.initialSearchValue);
  }
  @override
  Widget build(BuildContext context) {
    Subtitle _subtitle = AppLocalization.of(context).subtitle;
    return  SizedBox(
      height: MediaQuery.of(context).size.height / 1.2,
      child: Form(
        key: _formKey,
        child: Padding(
          padding: const EdgeInsets.all(16.0),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  ASmallButton(
                    text: _subtitle.cancel,
                    onPressed: (){
                      Navigator.of(context).pop();
                    },
                  ),

                  ASmallButton(
                    text: _subtitle.search,
                    onPressed: (){
                      if(!_formKey.currentState.validate()) {
                        return;
                      }
                      _formKey.currentState.save();
                      Navigator.of(context).pop(_search);
                    },
                  )
                ],
              ),
              SizedBox(height: 8.0 * AppStyle.getScaleFactor(context),),
              ATextFormField(
                initialValue: _search.deviceSerialNumber,
                hintText: _subtitle.serialNumber,
                style:  Theme.of(context).textTheme.headline6,
                textInputAction: TextInputAction.search,
                onAction: (){
                  if(!_formKey.currentState.validate()) {
                    return;
                  }
                  _formKey.currentState.save();
                  Navigator.of(context).pop(_search);
                },
                onSaved: (value){
                  _search.deviceSerialNumber = value;
                },
              ),
              SizedBox(height: 8.0 * AppStyle.getScaleFactor(context),),
              HospitalAutoCompleteField(
                initialValue: _search.hospital?.name,
                // onSave: (value){
                //   _search.hospital = value;
                // },
                onSearch: (value){
                  _search.hospital = value;
                  Navigator.of(context).pop(_search);
                },
              ),
              SizedBox(height: 8.0 * AppStyle.getScaleFactor(context),),
              ATextFormField(
                initialValue: _search.deviceName,
                hintText: _subtitle.deviceName,
                style:  Theme.of(context).textTheme.headline6,
                textInputAction: TextInputAction.search,
                onAction: (){
                  if(!_formKey.currentState.validate()) {
                    return;
                  }
                  _formKey.currentState.save();
                  Navigator.of(context).pop(_search);
                },
                onSaved: (value){
                  _search.deviceName = value;
                },
              ),
              SizedBox(height: 8.0 * AppStyle.getScaleFactor(context),),
              ATextFormField(
                initialValue: _search.model,
                hintText: _subtitle.model,
                style:  Theme.of(context).textTheme.headline6,
                textInputAction: TextInputAction.search,
                onAction: (){
                  if(!_formKey.currentState.validate()) {
                    return;
                  }
                  _formKey.currentState.save();
                  Navigator.of(context).pop(_search);
                },
                onSaved: (value){
                  _search.model = value;
                },
              ),
              SizedBox(height: 16 * AppStyle.getScaleFactor(context),),
              const ASubTitle("Status"),
              const SizedBox(height: 4,),
              ServiceRequestStatusMenu(
                initialValue: _search.statusValue,
                onSelect: (status){
                  _search.statusValue = status;
                },
              ),
              // Padding(
              //   padding: const EdgeInsets.symmetric(horizontal: 12),
              //   child: Wrap(
              //     spacing: 10,
              //     runSpacing: 10,
              //     alignment: WrapAlignment.spaceEvenly,
              //     children: List.generate(
              //         status.length,
              //             (index) {
              //           bool isSelected = _search.statusValue == status[index];
              //           return FilterItem(
              //             isSelected: isSelected,
              //             onSelected: (){
              //               if(isSelected) {
              //                 _search.statusValue = null;
              //               } else {
              //                 _search.statusValue = status[index];
              //               }
              //
              //               setState(() {});
              //             },
              //             status: status[index],
              //           );
              //         }
              //
              //     ),
              //   ),
              // ),

              Visibility(
                visible: widget.initialSearchValue.toMap().isNotEmpty,
                child: Padding(
                  padding: const EdgeInsets.symmetric(vertical: 8,horizontal: 16),
                  child: AButton(
                    padding: EdgeInsets.zero,
                    text: _subtitle.clearSearch,
                    onPressed: (){
                      _search = ServiceRequestSearch();
                     Navigator.of(context).pop(_search);
                    },
                  ),
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}