feat:增加用户信息编辑功能
This commit is contained in:
251
lib/views/profile_form.dart
Normal file
251
lib/views/profile_form.dart
Normal file
@@ -0,0 +1,251 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_common/widget/dialog_widget.dart';
|
||||
import 'package:flutter_common/widget/loading_widget.dart';
|
||||
import 'package:flutter_form_builder/flutter_form_builder.dart';
|
||||
import 'package:flutter_input_chips/flutter_input_chips.dart';
|
||||
import 'package:form_builder_validators/form_builder_validators.dart';
|
||||
import 'package:food_hub_app/provider/user_provider.dart';
|
||||
import 'package:food_hub_app/widgets/common/form.dart';
|
||||
import 'package:intl/intl.dart';
|
||||
|
||||
import 'package:provider/provider.dart';
|
||||
|
||||
class ProfileForm extends StatefulWidget {
|
||||
const ProfileForm({super.key});
|
||||
|
||||
@override
|
||||
State<ProfileForm> createState() => _ProfileFormState();
|
||||
}
|
||||
|
||||
class _ProfileFormState extends State<ProfileForm> {
|
||||
final _formKey = GlobalKey<FormBuilderState>();
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
}
|
||||
|
||||
Widget _buildFormBuilder(UserProvider provider) {
|
||||
final double sizeBoxHeight = 8;
|
||||
|
||||
return FormBuilder(
|
||||
key: _formKey,
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
buildFormLabel(context: context, text: '用户名', isRequired: true),
|
||||
SizedBox(height: sizeBoxHeight),
|
||||
FormBuilderTextField(
|
||||
name: 'username',
|
||||
initialValue: provider.userFormItem.username,
|
||||
onChanged: (value) {
|
||||
provider.updateUserFormItem(username: value);
|
||||
},
|
||||
decoration: buildInputDecoration(
|
||||
context: context,
|
||||
hintText: '请输入用户名',
|
||||
),
|
||||
validator: FormBuilderValidators.required(errorText: '请输入用户名'),
|
||||
),
|
||||
SizedBox(height: sizeBoxHeight),
|
||||
|
||||
buildFormLabel(context: context, text: '性别', isRequired: true),
|
||||
SizedBox(height: sizeBoxHeight),
|
||||
FormBuilderDropdown<int>(
|
||||
name: 'gender',
|
||||
initialValue: provider.userFormItem.gender,
|
||||
decoration: buildInputDecoration(
|
||||
context: context,
|
||||
hintText: '请选择性别',
|
||||
),
|
||||
items: const [
|
||||
DropdownMenuItem(value: 1, child: Text('男')),
|
||||
DropdownMenuItem(value: 2, child: Text('女')),
|
||||
],
|
||||
onChanged: (value) {
|
||||
provider.updateUserFormItem(gender: value);
|
||||
},
|
||||
),
|
||||
SizedBox(height: sizeBoxHeight),
|
||||
|
||||
buildFormLabel(context: context, text: '手机号', isRequired: true),
|
||||
SizedBox(height: sizeBoxHeight),
|
||||
FormBuilderTextField(
|
||||
name: 'phoneNumber',
|
||||
initialValue: provider.userFormItem.phoneNumber,
|
||||
keyboardType: TextInputType.phone,
|
||||
decoration: buildInputDecoration(
|
||||
context: context,
|
||||
hintText: '请输入手机号',
|
||||
),
|
||||
onChanged: (value) {
|
||||
provider.updateUserFormItem(phoneNumber: value);
|
||||
},
|
||||
validator: FormBuilderValidators.compose([
|
||||
FormBuilderValidators.required(errorText: '请输入手机号'),
|
||||
FormBuilderValidators.match(
|
||||
RegExp(r'^1[3-9]\d{9}$'),
|
||||
errorText: '请输入正确的11位手机号',
|
||||
),
|
||||
]),
|
||||
),
|
||||
SizedBox(height: sizeBoxHeight),
|
||||
|
||||
buildFormLabel(context: context, text: '邮箱', isRequired: true),
|
||||
SizedBox(height: sizeBoxHeight),
|
||||
FormBuilderTextField(
|
||||
name: 'email',
|
||||
initialValue: provider.userFormItem.email,
|
||||
keyboardType: TextInputType.emailAddress,
|
||||
decoration: buildInputDecoration(
|
||||
context: context,
|
||||
hintText: '请输入邮箱',
|
||||
),
|
||||
onChanged: (value) {
|
||||
provider.updateUserFormItem(email: value);
|
||||
},
|
||||
validator: FormBuilderValidators.compose([
|
||||
FormBuilderValidators.email(errorText: '邮箱格式不正确'),
|
||||
]),
|
||||
),
|
||||
SizedBox(height: sizeBoxHeight),
|
||||
|
||||
buildFormLabel(context: context, text: '出生日期', isRequired: true),
|
||||
SizedBox(height: sizeBoxHeight),
|
||||
FormBuilderDateTimePicker(
|
||||
name: 'birthDate',
|
||||
initialValue: provider.userFormItem.birthDate,
|
||||
inputType: InputType.date,
|
||||
format: DateFormat('yyyy-MM-dd'),
|
||||
firstDate: DateTime(1900),
|
||||
lastDate: DateTime.now(),
|
||||
decoration: buildInputDecoration(
|
||||
context: context,
|
||||
hintText: '请选择出生日期',
|
||||
),
|
||||
onChanged: (value) {
|
||||
provider.updateUserFormItem(birthDate: value);
|
||||
},
|
||||
),
|
||||
SizedBox(height: sizeBoxHeight),
|
||||
|
||||
buildFormLabel(context: context, text: '详细地址', isRequired: false),
|
||||
SizedBox(height: sizeBoxHeight),
|
||||
FormBuilderTextField(
|
||||
name: 'address',
|
||||
initialValue: provider.userFormItem.address,
|
||||
decoration: buildInputDecoration(
|
||||
context: context,
|
||||
hintText: '请输入详细地址',
|
||||
),
|
||||
onChanged: (value) {
|
||||
provider.updateUserFormItem(address: value);
|
||||
},
|
||||
),
|
||||
SizedBox(height: sizeBoxHeight),
|
||||
|
||||
buildFormLabel(context: context, text: '职业', isRequired: false),
|
||||
SizedBox(height: sizeBoxHeight),
|
||||
FormBuilderTextField(
|
||||
name: 'job',
|
||||
initialValue: provider.userFormItem.job,
|
||||
decoration: buildInputDecoration(
|
||||
context: context,
|
||||
hintText: '请输入职业',
|
||||
),
|
||||
onChanged: (value) {
|
||||
provider.updateUserFormItem(job: value);
|
||||
},
|
||||
),
|
||||
SizedBox(height: sizeBoxHeight),
|
||||
|
||||
buildFormLabel(context: context, text: '标签', isRequired: false),
|
||||
SizedBox(height: sizeBoxHeight),
|
||||
FormBuilderField<List<String>>(
|
||||
name: 'tags',
|
||||
initialValue: provider.userFormItem.tags,
|
||||
validator: FormBuilderValidators.minLength(
|
||||
1,
|
||||
errorText: '至少添加一个标签',
|
||||
),
|
||||
builder: (FormFieldState<List<String>> field) {
|
||||
return FlutterInputChips(
|
||||
padding: EdgeInsets.all(0),
|
||||
initialValue: field.value ?? [],
|
||||
onChanged: (value) {
|
||||
provider.updateUserFormItem(tags: value);
|
||||
},
|
||||
inputDecoration: buildInputDecoration(
|
||||
context: context,
|
||||
hintText: '请输入标签，多个标签用回车键隔开',
|
||||
),
|
||||
);
|
||||
},
|
||||
),
|
||||
SizedBox(height: sizeBoxHeight),
|
||||
|
||||
buildFormLabel(context: context, text: '简介', isRequired: false),
|
||||
SizedBox(height: sizeBoxHeight),
|
||||
FormBuilderTextField(
|
||||
name: 'description',
|
||||
initialValue: provider.userFormItem.description,
|
||||
decoration: buildInputDecoration(
|
||||
context: context,
|
||||
hintText: '请输入简介',
|
||||
),
|
||||
onChanged: (value) {
|
||||
provider.updateUserFormItem(description: value);
|
||||
},
|
||||
),
|
||||
SizedBox(height: sizeBoxHeight),
|
||||
|
||||
buildFormButtonGroup(
|
||||
context: context,
|
||||
isShowDelete: false,
|
||||
onConfirm: () => _submitForm(provider),
|
||||
onDelete: () => {},
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
/// 提交表单
|
||||
void _submitForm(UserProvider provider) async {
|
||||
if (_formKey.currentState?.saveAndValidate() ?? false) {
|
||||
LoadingDialog.show(context, message: '提交中');
|
||||
|
||||
final result = await provider.handleUser();
|
||||
if (result == true) {
|
||||
LoadingDialog.hide(context);
|
||||
|
||||
showSuccessTip(context, '更新信息成功');
|
||||
|
||||
Future.delayed(Duration(milliseconds: 1500), () {
|
||||
if (mounted) {
|
||||
Navigator.pop(context);
|
||||
}
|
||||
});
|
||||
} else {
|
||||
LoadingDialog.hide(context);
|
||||
showErrorTip(context, '更新信息失败');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final provider = context.watch<UserProvider>();
|
||||
|
||||
return AnimatedPadding(
|
||||
duration: const Duration(milliseconds: 200),
|
||||
padding: MediaQuery.of(context).viewInsets,
|
||||
child: SingleChildScrollView(
|
||||
child: Padding(
|
||||
padding: EdgeInsets.all(16),
|
||||
child: _buildFormBuilder(provider),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user