일단 잡까지 되는것 저장

lib/career_page.dart

@@ -1,7 +1,9 @@
 
 import 'package:flutter/material.dart';
-import 'package:csp2/common/widgets/custom_bottom_nav_bar.dart';
-
+import 'package:csp2/common/widgets/job_card.dart';
+import 'package:http/http.dart' as http;
+import 'dart:convert';
+import 'package:csp2/job.dart';
 class JobsPage extends StatefulWidget {
   const JobsPage({super.key});
 
@@ -10,50 +12,98 @@ class JobsPage extends StatefulWidget {
 }
 
 class _JobsPageState extends State<JobsPage> {
-  int _selectedIndex = 3; // Assuming Jobs is the 4th item (index 3)
   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();
   }
 
-  void _onItemTapped(int index) {
+  Future<void> _fetchJobData() async {
     setState(() {
-      _selectedIndex = index;
+      _isLoading = true;
     });
-    // TODO: Add navigation logic here based on index
-    // For now, we'll just print the index
-    print('Tapped index: $index');
+    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 Scaffold(
-      body: Padding(
-        padding: const EdgeInsets.all(16.0), // 상단에 패딩 추가
-        child: Column(
-          mainAxisAlignment: MainAxisAlignment.start, // 상단 정렬
-          crossAxisAlignment: CrossAxisAlignment.start, // 왼쪽 정렬
+    return DefaultTabController(
+      length: _jobTags.length,
+      child: Scaffold(
+        body: Column(
           children: [
-            DropdownButton<String>(
-              value: _selectedDropdownValue,
-              onChanged: (String? newValue) {
-                setState(() {
-                  _selectedDropdownValue = newValue;
-                });
-              },
-              items: <String>['Indonesia', 'Hongkong', 'Singapore', 'South Korea',' Japan']
-                .map<DropdownMenuItem<String>>((String value) {
-                return DropdownMenuItem<String>(
-                  value: value,
-                  child: Text(value),
-                );
-              }).toList(),
+            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(),
+              ),
             ),
-            const SizedBox(height: 20),
-            Text('Selected: $_selectedDropdownValue'),
           ],
         ),
       ),