new city

2024-03-13 13:59:33 -05:00
parent 312cc3d863
commit a25bc6a987
26 changed files with 684 additions and 60 deletions
@@ -0,0 +1,165 @@
+import 'package:city_repository/city_repository.dart';
+import 'package:flutter/material.dart';
+import 'package:injector/injector.dart';
+import 'package:intl_phone_field/helpers.dart';
+import 'package:prosappco/src/components/pop_appbar.dart';
+import 'package:shimmer/shimmer.dart';
+
+class CityScreen extends StatefulWidget {
+  const CityScreen({Key? key}) : super(key: key);
+
+  @override
+  State<CityScreen> createState() => _CityScreenState();
+}
+
+class _CityScreenState extends State<CityScreen> {
+  final _searchController = TextEditingController();
+  final cityRepository = Injector.appInstance.get<CityRepository>();
+  List<CityUi>? _cities;
+  List<CityUi>? _filteredCities;
+
+  bool _isLoading = true;
+
+  @override
+  void initState() {
+    super.initState();
+    _loadCities();
+  }
+
+  void _loadCities() {
+    cityRepository.getCities().then((List<CityUi> element) {
+      setState(() {
+        _cities = element;
+        _filteredCities = _cities;
+        _isLoading = false;
+      });
+    });
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return SafeArea(
+      child: Scaffold(
+        appBar: PopAppbar(
+          onPressed: () {
+            Navigator.pop(context);
+          },
+          label: 'Ciudad',
+        ),
+        body: Column(
+          children: [
+            Padding(
+              padding: const EdgeInsets.only(left: 15, right: 15, bottom: 15),
+              child: TextField(
+                controller: _searchController,
+                onChanged: (value) {
+                  _filterCities(value);
+                },
+                decoration: const InputDecoration(
+                  hintText: 'Busca una ciudad',
+                  prefixIcon: Icon(Icons.search),
+                ),
+              ),
+            ),
+            _isLoading
+                ? _buildShimmerEffect()
+                : Expanded(
+                    child: _filteredCities != null && _filteredCities!.isNotEmpty
+                        ? ListView.builder(
+                            itemCount: _filteredCities!.length,
+                            itemBuilder: (BuildContext context, int index) {
+                              return ListTile(
+                                title: Text(
+                                  _filteredCities![index].cityName,
+                                  style: const TextStyle(
+                                    fontWeight: FontWeight.bold,
+                                    color: Colors.black87,
+                                  ),
+                                ),
+                                subtitle: Text(
+                                  "${_filteredCities![index].stateOfCity}, ${_filteredCities![index].countryOfCity}",
+                                  style: const TextStyle(color: Colors.black54),
+                                ),
+                                onTap: () {
+                                  // Handle city selection
+                                },
+                              );
+                            },
+                          )
+                        : const Center(
+                            child: Text('No se encontraron ciudades.'),
+                          ),
+                  ),
+          ],
+        ),
+      ),
+    );
+  }
+
+  void _filterCities(String query) {
+    if (_cities != null) {
+      setState(() {
+        _filteredCities = _cities!
+            .where((city) => removeDiacritics(city.cityName.toLowerCase())
+                .contains(removeDiacritics(query.toLowerCase())))
+            .toList();
+      });
+    }
+  }
+
+  Widget _buildShimmerEffect() {
+    return Expanded(
+      child: Shimmer.fromColors(
+        baseColor: Colors.grey[300]!,
+        highlightColor: Colors.grey[100]!,
+        child: ListView.builder(
+          itemCount: 8,
+          itemBuilder: (_, __) => const ListTileShimmer(),
+        ),
+      ),
+    );
+  }
+}
+
+class ListTileShimmer extends StatelessWidget {
+  const ListTileShimmer({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return ListTile(
+      title: Row(
+        children: [
+          Container(
+            width: MediaQuery.of(context).size.width * 0.8,
+            height: 18.0,
+            decoration: BoxDecoration(
+              color: Colors.white,
+              borderRadius: BorderRadius.circular(8),
+            ),
+          ),
+        ],
+      ),
+      subtitle: Row(
+        children: [
+          Container(
+            width: MediaQuery.of(context).size.width * 0.3,
+            height: 15.0,
+            decoration: BoxDecoration(
+              color: Colors.white,
+              borderRadius: BorderRadius.circular(8),
+            ),
+          ),
+          const SizedBox(width: 5),
+          Container(
+            width: MediaQuery.of(context).size.width * 0.3,
+            height: 15.0,
+            decoration: BoxDecoration(
+              color: Colors.white,
+              borderRadius: BorderRadius.circular(8),
+            ),
+          )
+        ],
+      ),
+    );
+  }
+}