import 'package:flutter/material.dart';
import 'package:csp2/common/widgets/job_card.dart';
import 'package:http/http.dart' as http;
import 'dart:convert';
import 'package:csp2/common/data/job.dart';
class JobsPage extends StatefulWidget {
  const JobsPage({super.key});

  @override
  State<JobsPage> createState() => _JobsPageState();
}

class _JobsPageState extends State<JobsPage> {
  String? _selectedDropdownValue; // 드롭다운 선택 값 저장 변수
  String _selectedJobTag = 'Hair'; // 초기 탭 선택 값
  List<Job>? _jobData; // Job 모델 객체 리스트로 변경
  bool _isLoading = true;

  final List<String> _jobTags = ['Hair', 'Skincare', 'Bodycare', 'Service', 'IT', 'Education'];

  @override
  void initState() {
    super.initState();
    _selectedDropdownValue = 'Indonesia'; // 초기값 설정
    _fetchJobData();
  }

  Future<void> _fetchJobData() async {
    setState(() {
      _isLoading = true;
    });
    try {
      final response = await http.get(Uri.parse(
          'https://helloworld4-ad2uqhckxq-uc.a.run.app/?country=$_selectedDropdownValue&jobtag=$_selectedJobTag'));
      if (response.statusCode == 200) {
        setState(() {
          _jobData = (json.decode(response.body) as List)
              .map((item) => Job.fromJson(item))
              .toList();
        });
      } else {
        _jobData = null; // Clear data on error
      }
    } catch (e) {
      _jobData = null; // Clear data on error
    } finally {
      setState(() {
        _isLoading = false;
      });
    }
  }

  @override
  Widget build(BuildContext context) {
    return DefaultTabController(
      length: _jobTags.length,
      child: Scaffold(
        body: Column(
          children: [
            Padding(
              padding: const EdgeInsets.symmetric(horizontal: 8.0),
              child: DropdownButton<String>(
                value: _selectedDropdownValue,
                onChanged: (String? newValue) {
                  setState(() {
                    _selectedDropdownValue = newValue;
                  });
                  _fetchJobData(); // Fetch data when dropdown changes
                },
                items: <String>['Indonesia', 'Hongkong', 'Singapore', 'South Korea', 'Japan']
                    .map<DropdownMenuItem<String>>((String value) {
                  return DropdownMenuItem<String>(
                    value: value,
                    child: Text(value),
                  );
                }).toList(),
              ),
            ),
            TabBar(
              isScrollable: true,
              tabs: _jobTags.map((tag) => Tab(text: tag)).toList(),
              onTap: (index) {
                setState(() {
                  _selectedJobTag = _jobTags[index];
                });
                _fetchJobData();
              },
            ),
            Expanded(
              child: TabBarView(
                children: _jobTags.map((tag) {
                  return _isLoading
                      ? const Center(child: CircularProgressIndicator())
                      : _jobData == null || _jobData!.isEmpty
                          ? Center(child: Text('No jobs found for $tag.'))
                          : ListView.builder(
                              itemCount: _jobData!.length,
                              itemBuilder: (context, index) {
                                final job = _jobData![index];
                                return JobCard(job: job);
                              },
                            );
                }).toList(),
              ),
            ),
          ],
        ),
      ),
    );
  }
}