2025-12-29 First Commit

2025-12-29 15:20:40 +08:00
commit fb2603c6f0
92 changed files with 6006 additions and 0 deletions
@@ -0,0 +1,181 @@
+import 'package:flutter/material.dart';
+import './person_api.dart';
+import './person_model.dart';
+import './person_detail.dart'; // 稍後創建
+
+class PersonManager extends StatefulWidget {
+  const PersonManager({super.key});
+
+  @override
+  State<StatefulWidget> createState() {
+    return _PersonManagerState();
+  }
+}
+
+class _PersonManagerState extends State<PersonManager> {
+  late PersonApiService _apiService;
+  late Future<List<Person>> _peopleFuture;
+
+  // 新增：搜尋文字控制器
+  final TextEditingController _searchController = TextEditingController();
+
+  // 新增：用於記錄當前的搜尋關鍵字
+  String _currentSearchTerm = '';
+
+  @override
+  void initState() {
+    super.initState();
+    _apiService = PersonApiService();
+    // 頁面加載時自動開始獲取資料
+    _peopleFuture = _apiService.fetchPeople();
+
+    // 新增：監聽搜尋框文字變更
+    _searchController.addListener(_onSearchChanged);
+  }
+
+  @override
+  void dispose() {
+    // 釋放資源
+    _searchController.removeListener(_onSearchChanged);
+    _searchController.dispose();
+    super.dispose();
+  }
+
+  // 搜尋文字變更時觸發的邏輯
+  void _onSearchChanged() {
+    final newTerm = _searchController.text;
+    // 只有當關鍵字真正改變時才刷新
+    if (newTerm != _currentSearchTerm) {
+      _currentSearchTerm = newTerm;
+      _refreshPeople();
+    }
+  }
+
+  // 刷新資料的函數
+  void _refreshPeople() {
+    setState(() {
+      // 調用 API 時傳入目前的搜尋關鍵字
+      _peopleFuture = _apiService.fetchPeople(searchName: _currentSearchTerm);
+    });
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      appBar: AppBar(
+        title: const Text('公司通訊錄'),
+        actions: <Widget>[
+          IconButton(
+            icon: const Icon(Icons.refresh),
+            tooltip: '刷新列表',
+            onPressed: _refreshPeople,
+          ),
+        ],
+        // 新增：底部放置搜尋框
+        bottom: PreferredSize(
+          preferredSize: const Size.fromHeight(60.0),
+          child: Padding(
+            padding: const EdgeInsets.all(8.0),
+            child: TextField(
+              controller: _searchController,
+              decoration: InputDecoration(
+                hintText: '輸入姓名進行查詢...',
+                prefixIcon: const Icon(Icons.search),
+                suffixIcon: _currentSearchTerm.isNotEmpty
+                    ? IconButton(
+                  icon: const Icon(Icons.clear),
+                  onPressed: () {
+                    _searchController.clear(); // 清空文字會觸發 _onSearchChanged
+                  },
+                )
+                    : null,
+                border: OutlineInputBorder(
+                  borderRadius: BorderRadius.circular(10.0),
+                  borderSide: BorderSide.none,
+                ),
+                filled: true,
+                fillColor: Colors.white,
+              ),
+            ),
+          ),
+        ),
+      ),
+      body: FutureBuilder<List<Person>>(
+        future: _peopleFuture,
+        builder: (context, snapshot) {
+          if (snapshot.connectionState == ConnectionState.waiting) {
+            return const Center(child: CircularProgressIndicator());
+          } else if (snapshot.hasError) {
+            return Center(
+              child: Column(
+                mainAxisAlignment: MainAxisAlignment.center,
+                children: [
+                  Text('載入失敗: ${snapshot.error}', textAlign: TextAlign.center),
+                  const SizedBox(height: 16),
+                  ElevatedButton(onPressed: _refreshPeople, child: const Text('重試')),
+                ],
+              ),
+            );
+          } else if (snapshot.hasData && snapshot.data!.isNotEmpty) {
+            return PersonList(people: snapshot.data!);
+          } else {
+            return const Center(child: Text('查無人員資料。'));
+          }
+        },
+      ),
+    );
+  }
+}
+
+// -----------------------------------------------------------
+// 列表顯示小部件 (PersonList)
+// -----------------------------------------------------------
+
+class PersonList extends StatelessWidget {
+  final List<Person> people;
+
+  const PersonList({required this.people, super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return ListView.builder(
+      itemCount: people.length,
+      itemBuilder: (BuildContext context, int index) {
+        final person = people[index];
+
+        return Card(
+          elevation: 3,
+          margin: const EdgeInsets.symmetric(vertical: 6.0, horizontal: 16.0),
+          child: InkWell(
+            onTap: () {
+              // 點擊項目：導航到詳細頁面
+              Navigator.push(
+                context,
+                MaterialPageRoute(
+                  builder: (context) => PersonDetail(person: person),
+                ),
+              );
+            },
+            child: ListTile(
+              // 左側性別指示器
+              leading: Icon(
+                person.sexIcon,
+                color: person.sexColor,
+                size: 32,
+              ),
+              title: Text(
+                person.personCName ?? '姓名未知',
+                style: const TextStyle(fontWeight: FontWeight.bold),
+              ),
+              subtitle: Text(
+                '${person.departmentId ?? '無部門'} | ${person.jobName ?? '無職稱'}',
+                style: const TextStyle(fontSize: 12),
+              ),
+              trailing: const Icon(Icons.arrow_forward_ios, size: 16, color: Colors.grey),
+            ),
+          ),
+        );
+      },
+    );
+  }
+}