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

import '../states/region.dart';

class RegionSelector extends StatelessWidget {
  const RegionSelector({Key key}) : super(key: key);

  // 拼接城市
  String spliceCityName(String pname, String cname) {
    if (pname == '') return '未选择城市';
    StringBuffer sb = StringBuffer();
    sb.write(pname);
    // if (cname == '') return sb.toString();
    if (cname == '') return '未选择城市';
    sb.write(' - ');
    sb.write(cname);
    return sb.toString();
  }

  @override
  Widget build(BuildContext context) {
    return SizedBox(
        width: 420,
        height: 100,
        child: Consumer<RegionProvider>(
            builder: (context, regionProvider, child) => Column(
                  children: [
                    InkWell(
                      onTap: () {
                        Pickers.showAddressPicker(context,
                            addAllItem: false,
                            initProvince: regionProvider.provinceName,
                            initCity: regionProvider.cityName,
                            onConfirm: (p, c, t) {
                          regionProvider.updateRegion(p, c);
                        });
                      },
                      child: Container(
                          constraints: const BoxConstraints(minHeight: 42),
                          padding: const EdgeInsets.fromLTRB(10, 0, 12, 0),
                          decoration: BoxDecoration(
                            border: Border.all(color: Colors.grey),
                            borderRadius: BorderRadius.circular(6),
                          ),
                          child: Row(
                            // mainAxisSize: MainAxisSize.min,
                            mainAxisAlignment: MainAxisAlignment.spaceBetween,
                            crossAxisAlignment: CrossAxisAlignment.center,
                            children: [
                              Text(spliceCityName(
                                  regionProvider.tempProvinceName,
                                  regionProvider.tempCityName)),
                              // SizedBox(width: 8),
                              Row(
                                children: [
                                  (regionProvider.tempProvinceName != '')
                                      ? InkWell(
                                          child: Icon(Icons.close,
                                              size: 30,
                                              color: Colors.grey[500]),
                                          onTap: () {
                                            regionProvider.clearTemp();
                                          })
                                      : const SizedBox(),
                                  Icon(Icons.keyboard_arrow_down,
                                      size: 30, color: Colors.grey[500]),
                                ],
                              )
                            ],
                          )),
                    ),
                    const SizedBox(
                      height: 20,
                    ),
                    Text(
                      '磁偏角 : ${regionProvider.tempDeclination}°',
                      style: const TextStyle(fontSize: 24),
                    )
                  ],
                )));
  }
}