主頁-住戶-新增個人資料修改介面

This commit is contained in:
jasonchenwork 2025-05-09 14:31:29 +08:00
parent 7c8926e95c
commit cbc755b68f
2 changed files with 226 additions and 9 deletions

209
lib/edit_profile.dart Normal file
View File

@ -0,0 +1,209 @@
import 'package:flutter/material.dart';
class EditProfilePage extends StatefulWidget {
const EditProfilePage({super.key});
@override
State<EditProfilePage> createState() => _EditProfilePageState();
}
class _EditProfilePageState extends State<EditProfilePage> {
final TextEditingController fullNameController = TextEditingController(
text: '林小安',
);
final TextEditingController birthdayController = TextEditingController(
text: '1995-05-01',
);
final TextEditingController phoneController = TextEditingController(
text: '0912-345-678',
);
final TextEditingController emailController = TextEditingController(
text: 'linxiaoan@gmail.com',
);
final TextEditingController carPlateController = TextEditingController(
text: 'ABC-1234',
);
String gender = '';
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: const Color(0xFFF7F8FA),
appBar: AppBar(
backgroundColor: const Color(0xFF9EAFAF),
title: const Text('編輯個人資料'),
centerTitle: true,
leading: IconButton(
icon: const Icon(Icons.arrow_back, color: Colors.white),
onPressed: () => Navigator.pop(context),
),
),
body: SingleChildScrollView(
padding: const EdgeInsets.all(16),
child: Column(
children: [
_buildSection(
children: [
_buildTextField(label: '姓名', controller: fullNameController),
_buildDropdownField(label: '性別'),
_buildTextField(
label: '生日',
controller: birthdayController,
isDate: true,
),
_buildTextField(
label: '手機號碼',
controller: phoneController,
keyboardType: TextInputType.phone,
),
_buildTextField(
label: '電子郵件',
controller: emailController,
keyboardType: TextInputType.emailAddress,
),
_buildTextField(label: '車牌號碼', controller: carPlateController),
const SizedBox(height: 24),
Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
ElevatedButton(
onPressed: () {},
style: ElevatedButton.styleFrom(
backgroundColor: Colors.green,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(24),
),
padding: const EdgeInsets.symmetric(
horizontal: 24,
vertical: 10,
),
),
child: const Text(
'儲存',
style: TextStyle(fontSize: 16, color: Colors.white),
),
),
ElevatedButton(
onPressed: () => Navigator.pop(context),
style: ElevatedButton.styleFrom(
backgroundColor: Colors.grey[400],
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(24),
),
padding: const EdgeInsets.symmetric(
horizontal: 24,
vertical: 10,
),
),
child: const Text(
'取消',
style: TextStyle(fontSize: 16, color: Colors.black87),
),
),
],
),
],
),
],
),
),
bottomNavigationBar: BottomNavigationBar(
type: BottomNavigationBarType.fixed,
items: const [
BottomNavigationBarItem(icon: Icon(Icons.home), label: '首頁'),
BottomNavigationBarItem(
icon: Icon(Icons.door_front_door),
label: '出入',
),
BottomNavigationBarItem(icon: Icon(Icons.message), label: '訊息'),
BottomNavigationBarItem(icon: Icon(Icons.person), label: '住戶'),
],
currentIndex: 3,
onTap: (index) {
// Add navigation logic here if needed
},
),
);
}
Widget _buildSection({required List<Widget> children}) {
return Container(
padding: const EdgeInsets.all(20),
margin: const EdgeInsets.symmetric(vertical: 8),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(12),
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: children,
),
);
}
Widget _buildTextField({
required String label,
required TextEditingController controller,
TextInputType? keyboardType,
bool isDate = false,
}) {
return Padding(
padding: const EdgeInsets.symmetric(vertical: 8),
child: TextField(
controller: controller,
keyboardType: keyboardType,
readOnly: isDate,
onTap:
isDate
? () async {
DateTime? picked = await showDatePicker(
context: context,
initialDate:
DateTime.tryParse(controller.text) ?? DateTime.now(),
firstDate: DateTime(1900),
lastDate: DateTime.now(),
);
if (picked != null) {
controller.text = picked.toIso8601String().split('T').first;
}
}
: null,
decoration: InputDecoration(
labelText: label,
border: const OutlineInputBorder(),
),
),
);
}
Widget _buildDropdownField({required String label}) {
return Padding(
padding: const EdgeInsets.symmetric(vertical: 8),
child: InputDecorator(
decoration: InputDecoration(
labelText: label,
border: const OutlineInputBorder(),
),
child: DropdownButtonHideUnderline(
child: DropdownButton<String>(
value: gender,
isExpanded: true,
items:
['', '', '其他'].map((value) {
return DropdownMenuItem<String>(
value: value,
child: Text(value),
);
}).toList(),
onChanged: (newValue) {
setState(() {
gender = newValue!;
});
},
),
),
),
);
}
}

View File

@ -1,4 +1,6 @@
import 'package:flutter/material.dart';
import 'login_page.dart';
import 'edit_profile.dart';
class PersonalPage extends StatelessWidget {
const PersonalPage({super.key});
@ -50,7 +52,7 @@ class PersonalPage extends StatelessWidget {
const SizedBox(height: 10),
_buildNotificationsSection(),
const SizedBox(height: 30),
_buildLogoutButton(),
_buildLogoutButton(context),
const SizedBox(height: 60),
],
),
@ -98,7 +100,12 @@ class PersonalPage extends StatelessWidget {
),
TextButton(
onPressed: () {
// TODO:
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => const EditProfilePage(),
),
);
},
style: TextButton.styleFrom(
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 4),
@ -250,11 +257,14 @@ class PersonalPage extends StatelessWidget {
);
}
Widget _buildLogoutButton() {
Widget _buildLogoutButton(BuildContext context) {
return Center(
child: ElevatedButton.icon(
onPressed: () {
// TODO:
Navigator.pushReplacement(
context,
MaterialPageRoute(builder: (context) => const LoginPage()),
);
},
style: ElevatedButton.styleFrom(
backgroundColor: const Color(0xFFF08080),
@ -265,12 +275,10 @@ class PersonalPage extends StatelessWidget {
shadowColor: Colors.black,
elevation: 6,
),
icon: GestureDetector(
onTap: () {
// TODO: icon單獨點擊
},
/*icon: GestureDetector(
onTap: () {},
child: Image.asset('assets/icons/logout.png', width: 18, height: 18),
),
),*/
label: const Text('登出', style: TextStyle(fontSize: 16)),
),
);