dang ki du an

This commit is contained in:
Phuoc Nguyen
2025-11-26 11:21:35 +07:00
parent 7ef12fa83a
commit 3741239d83
5 changed files with 913 additions and 313 deletions

View File

@@ -0,0 +1,791 @@
/// Submission Create Page
///
/// Form for creating new project submissions.
library;
import 'dart:io';
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
import 'package:image_picker/image_picker.dart';
import 'package:worker/core/constants/ui_constants.dart';
import 'package:worker/core/theme/colors.dart';
/// Project Submission Create Page
class SubmissionCreatePage extends ConsumerStatefulWidget {
const SubmissionCreatePage({super.key});
@override
ConsumerState<SubmissionCreatePage> createState() =>
_SubmissionCreatePageState();
}
class _SubmissionCreatePageState extends ConsumerState<SubmissionCreatePage> {
final _formKey = GlobalKey<FormState>();
// Form controllers
final _projectNameController = TextEditingController();
final _addressController = TextEditingController();
final _ownerController = TextEditingController();
final _designUnitController = TextEditingController();
final _constructionUnitController = TextEditingController();
final _areaController = TextEditingController();
final _productsController = TextEditingController();
final _descriptionController = TextEditingController();
// Form state
String? _selectedProgress;
DateTime? _expectedStartDate;
final List<File> _uploadedFiles = [];
bool _showStartDateField = false;
@override
void dispose() {
_projectNameController.dispose();
_addressController.dispose();
_ownerController.dispose();
_designUnitController.dispose();
_constructionUnitController.dispose();
_areaController.dispose();
_productsController.dispose();
_descriptionController.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: const Color(0xFFF4F6F8),
appBar: AppBar(
leading: IconButton(
icon: const FaIcon(
FontAwesomeIcons.arrowLeft,
color: Colors.black,
size: 20,
),
onPressed: () => Navigator.of(context).pop(),
),
title: const Text(
'Đăng ký Công trình',
style: TextStyle(color: Colors.black),
),
actions: [
IconButton(
icon: const FaIcon(
FontAwesomeIcons.circleInfo,
color: Colors.black,
size: 20,
),
onPressed: _showInfoDialog,
),
const SizedBox(width: AppSpacing.sm),
],
elevation: AppBarSpecs.elevation,
backgroundColor: AppColors.white,
centerTitle: false,
),
body: Form(
key: _formKey,
child: ListView(
padding: const EdgeInsets.all(4),
children: [
// Basic Information
_buildBasicInfoCard(),
const SizedBox(height: 16),
// Project Details
_buildProjectDetailsCard(),
const SizedBox(height: 16),
// Additional Information
_buildAdditionalInfoCard(),
const SizedBox(height: 16),
// File Upload
_buildFileUploadCard(),
const SizedBox(height: 24),
// Submit Button
_buildSubmitButton(),
const SizedBox(height: 40),
],
),
),
);
}
Widget _buildBasicInfoCard() {
return Card(
elevation: 1,
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
child: Padding(
padding: const EdgeInsets.all(12),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text(
'Thông tin cơ bản',
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.w700,
color: AppColors.grey900,
),
),
const SizedBox(height: 16),
_buildTextField(
controller: _projectNameController,
label: 'Tên công trình',
required: true,
hint: 'Nhập tên công trình',
),
const SizedBox(height: 16),
_buildTextField(
controller: _addressController,
label: 'Địa chỉ',
required: true,
hint: 'Nhập địa chỉ đầy đủ',
maxLines: 2,
),
const SizedBox(height: 16),
_buildTextField(
controller: _ownerController,
label: 'Chủ đầu tư',
required: true,
hint: 'Tên chủ đầu tư',
),
const SizedBox(height: 16),
_buildTextField(
controller: _designUnitController,
label: 'Đơn vị thiết kế',
hint: 'Tên đơn vị thiết kế',
),
const SizedBox(height: 16),
_buildTextField(
controller: _constructionUnitController,
label: 'Đơn vị thi công',
hint: 'Tên đơn vị thi công',
),
],
),
),
);
}
Widget _buildProjectDetailsCard() {
return Card(
elevation: 1,
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
child: Padding(
padding: const EdgeInsets.all(16),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text(
'Chi tiết dự án',
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.w700,
color: AppColors.grey900,
),
),
const SizedBox(height: 16),
_buildTextField(
controller: _areaController,
label: 'Tổng diện tích',
required: true,
hint: 'Nhập diện tích m²',
keyboardType: TextInputType.number,
),
const SizedBox(height: 16),
_buildTextField(
controller: _productsController,
label: 'Sản phẩm đưa vào thiết kế',
required: true,
hint: 'Liệt kê các sản phẩm gạch đã sử dụng trong công trình (tên sản phẩm, mã SP, số lượng...)',
maxLines: 4,
helperText: 'Ví dụ: Gạch granite 60x60 - GP-001 - 100m², Gạch mosaic - MS-002 - 50m²',
),
const SizedBox(height: 16),
_buildProgressDropdown(),
if (_showStartDateField) ...[
const SizedBox(height: 16),
_buildDateField(),
],
],
),
),
);
}
Widget _buildAdditionalInfoCard() {
return Card(
elevation: 1,
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
child: Padding(
padding: const EdgeInsets.all(16),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text(
'Thông tin bổ sung',
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.w700,
color: AppColors.grey900,
),
),
const SizedBox(height: 16),
_buildTextField(
controller: _descriptionController,
label: 'Mô tả công trình',
hint: 'Mô tả ngắn gọn về công trình, diện tích, đặc điểm nổi bật...',
maxLines: 3,
),
],
),
),
);
}
Widget _buildFileUploadCard() {
return Card(
elevation: 1,
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
child: Padding(
padding: const EdgeInsets.all(16),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text(
'Ảnh minh chứng',
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.w700,
color: AppColors.grey900,
),
),
const SizedBox(height: 16),
// Upload Area
InkWell(
onTap: _pickFiles,
borderRadius: BorderRadius.circular(8),
child: Container(
padding: const EdgeInsets.symmetric(vertical: 40, horizontal: 20),
width: double.infinity,
decoration: BoxDecoration(
border: Border.all(
color: AppColors.grey100,
width: 2,
style: BorderStyle.solid,
),
borderRadius: BorderRadius.circular(8),
),
child: const Column(
children: [
FaIcon(
FontAwesomeIcons.cloudArrowUp,
size: 48,
color: AppColors.grey500,
),
SizedBox(height: 12),
Text(
'Kéo thả ảnh vào đây',
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.w500,
color: AppColors.grey900,
),
),
SizedBox(height: 4),
Text(
'hoặc nhấn để chọn file',
style: TextStyle(
fontSize: 14,
color: AppColors.grey500,
),
),
],
),
),
),
if (_uploadedFiles.isNotEmpty) ...[
const SizedBox(height: 16),
..._uploadedFiles.asMap().entries.map((entry) {
final index = entry.key;
final file = entry.value;
return Padding(
padding: const EdgeInsets.only(bottom: 8),
child: _buildFileItem(file, index),
);
}),
],
const SizedBox(height: 8),
const Text(
'Hỗ trợ: JPG, PNG, PDF. Tối đa 10MB mỗi file.',
style: TextStyle(
fontSize: 12,
color: AppColors.grey500,
),
),
],
),
),
);
}
Widget _buildTextField({
required TextEditingController controller,
required String label,
String? hint,
bool required = false,
int maxLines = 1,
TextInputType? keyboardType,
String? helperText,
}) {
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
children: [
Text(
label,
style: const TextStyle(
fontSize: 14,
fontWeight: FontWeight.w600,
color: AppColors.grey900,
),
),
if (required)
const Text(
' *',
style: TextStyle(
fontSize: 14,
color: AppColors.danger,
),
),
],
),
const SizedBox(height: 8),
TextFormField(
controller: controller,
maxLines: maxLines,
keyboardType: keyboardType,
decoration: InputDecoration(
hintText: hint,
hintStyle: const TextStyle(color: AppColors.grey500),
filled: true,
fillColor: AppColors.white,
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(8),
borderSide: const BorderSide(color: AppColors.grey100),
),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8),
borderSide: const BorderSide(color: AppColors.grey100),
),
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8),
borderSide: const BorderSide(color: AppColors.primaryBlue, width: 2),
),
errorBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8),
borderSide: const BorderSide(color: AppColors.danger),
),
contentPadding: const EdgeInsets.symmetric(
horizontal: 16,
vertical: 12,
),
),
validator: required
? (value) {
if (value == null || value.trim().isEmpty) {
return 'Vui lòng nhập $label';
}
return null;
}
: null,
),
if (helperText != null) ...[
const SizedBox(height: 4),
Text(
helperText,
style: const TextStyle(
fontSize: 12,
color: AppColors.grey500,
),
),
],
],
);
}
Widget _buildProgressDropdown() {
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Row(
children: [
Text(
'Tiến độ công trình',
style: TextStyle(
fontSize: 14,
fontWeight: FontWeight.w600,
color: AppColors.grey900,
),
),
Text(
' *',
style: TextStyle(
fontSize: 14,
color: AppColors.danger,
),
),
],
),
const SizedBox(height: 8),
DropdownButtonFormField<String>(
value: _selectedProgress,
decoration: InputDecoration(
filled: true,
fillColor: AppColors.white,
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(8),
borderSide: const BorderSide(color: AppColors.grey100),
),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8),
borderSide: const BorderSide(color: AppColors.grey100),
),
contentPadding: const EdgeInsets.symmetric(
horizontal: 16,
vertical: 12,
),
),
hint: const Text('Chọn tiến độ'),
items: const [
DropdownMenuItem(
value: 'not-started',
child: Text('Chưa khởi công'),
),
DropdownMenuItem(
value: 'foundation',
child: Text('Khởi công móng'),
),
DropdownMenuItem(
value: 'rough-construction',
child: Text('Đang phần thô'),
),
DropdownMenuItem(
value: 'finishing',
child: Text('Đang hoàn thiện'),
),
DropdownMenuItem(
value: 'topped-out',
child: Text('Cất nóc'),
),
],
onChanged: (value) {
setState(() {
_selectedProgress = value;
_showStartDateField = value == 'not-started';
if (!_showStartDateField) {
_expectedStartDate = null;
}
});
},
validator: (value) {
if (value == null || value.isEmpty) {
return 'Vui lòng chọn tiến độ công trình';
}
return null;
},
),
],
);
}
Widget _buildDateField() {
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text(
'Ngày dự kiến khởi công',
style: TextStyle(
fontSize: 14,
fontWeight: FontWeight.w600,
color: AppColors.grey900,
),
),
const SizedBox(height: 8),
InkWell(
onTap: _pickDate,
child: Container(
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
decoration: BoxDecoration(
color: AppColors.white,
border: Border.all(color: AppColors.grey100),
borderRadius: BorderRadius.circular(8),
),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
_expectedStartDate != null
? '${_expectedStartDate!.day}/${_expectedStartDate!.month}/${_expectedStartDate!.year}'
: 'Chọn ngày',
style: TextStyle(
color: _expectedStartDate != null
? AppColors.grey900
: AppColors.grey500,
),
),
const FaIcon(
FontAwesomeIcons.calendar,
size: 16,
color: AppColors.grey500,
),
],
),
),
),
],
);
}
Widget _buildFileItem(File file, int index) {
final fileName = file.path.split('/').last;
final fileSizeInBytes = file.lengthSync();
final fileSizeInMB = (fileSizeInBytes / (1024 * 1024)).toStringAsFixed(2);
return Container(
padding: const EdgeInsets.all(12),
decoration: BoxDecoration(
color: const Color(0xFFF8F9FA),
border: Border.all(color: AppColors.grey100),
borderRadius: BorderRadius.circular(6),
),
child: Row(
children: [
ClipRRect(
borderRadius: BorderRadius.circular(4),
child: Image.file(
file,
width: 48,
height: 48,
fit: BoxFit.cover,
errorBuilder: (context, error, stackTrace) {
return Container(
width: 48,
height: 48,
color: AppColors.grey100,
child: const FaIcon(
FontAwesomeIcons.image,
size: 24,
color: AppColors.grey500,
),
);
},
),
),
const SizedBox(width: 12),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
fileName,
style: const TextStyle(
fontWeight: FontWeight.w500,
color: AppColors.grey900,
),
maxLines: 1,
overflow: TextOverflow.ellipsis,
),
const SizedBox(height: 2),
Text(
'${fileSizeInMB}MB',
style: const TextStyle(
fontSize: 12,
color: AppColors.grey500,
),
),
],
),
),
IconButton(
icon: const FaIcon(
FontAwesomeIcons.xmark,
size: 16,
color: AppColors.danger,
),
onPressed: () {
setState(() {
_uploadedFiles.removeAt(index);
});
},
),
],
),
);
}
Widget _buildSubmitButton() {
return SizedBox(
width: double.infinity,
height: 48,
child: ElevatedButton(
onPressed: _handleSubmit,
style: ElevatedButton.styleFrom(
backgroundColor: AppColors.primaryBlue,
foregroundColor: AppColors.white,
elevation: 0,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(8),
),
),
child: const Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
FaIcon(FontAwesomeIcons.paperPlane, size: 16),
SizedBox(width: 8),
Text(
'Gửi đăng ký',
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.w600,
),
),
],
),
),
);
}
Future<void> _pickDate() async {
final date = await showDatePicker(
context: context,
initialDate: DateTime.now(),
firstDate: DateTime.now(),
lastDate: DateTime.now().add(const Duration(days: 365)),
);
if (date != null) {
setState(() {
_expectedStartDate = date;
});
}
}
Future<void> _pickFiles() async {
try {
final ImagePicker picker = ImagePicker();
final List<XFile> images = await picker.pickMultiImage(
maxWidth: 1920,
maxHeight: 1920,
imageQuality: 85,
);
if (images.isNotEmpty) {
setState(() {
for (final image in images) {
_uploadedFiles.add(File(image.path));
}
});
if (mounted) {
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(
content: Text('Đã thêm ${images.length} ảnh'),
duration: const Duration(seconds: 2),
),
);
}
}
} catch (e) {
if (mounted) {
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(content: Text('Lỗi khi chọn ảnh: $e')),
);
}
}
}
Future<void> _handleSubmit() async {
if (_formKey.currentState!.validate()) {
final confirmed = await showDialog<bool>(
context: context,
builder: (context) => AlertDialog(
title: const Text('Xác nhận'),
content: const Text('Xác nhận gửi đăng ký công trình?'),
actions: [
TextButton(
onPressed: () => Navigator.pop(context, false),
child: const Text('Hủy'),
),
TextButton(
onPressed: () => Navigator.pop(context, true),
child: const Text('Xác nhận'),
),
],
),
);
if (confirmed == true && mounted) {
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(
content: Text(
'Đăng ký công trình đã được gửi thành công!\nChúng tôi sẽ xem xét và liên hệ với bạn sớm nhất.',
),
),
);
Navigator.pop(context);
}
}
}
void _showInfoDialog() {
showDialog<void>(
context: context,
builder: (context) => AlertDialog(
title: const Text('Hướng dẫn đăng ký'),
content: const SingleChildScrollView(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisSize: MainAxisSize.min,
children: [
Text(
'Đây là nội dung hướng dẫn sử dụng cho tính năng Đăng ký Công trình:',
),
SizedBox(height: 12),
Text('• Điền đầy đủ thông tin công trình theo yêu cầu'),
Text('• Upload ảnh minh chứng chất lượng cao'),
Text('• Mô tả chi tiết sản phẩm đã sử dụng'),
Text('• Chọn đúng tiến độ hiện tại của công trình'),
Text('• Kiểm tra kỹ thông tin trước khi gửi'),
],
),
),
actions: [
TextButton(
onPressed: () => Navigator.pop(context),
child: const Text('Đóng'),
),
],
),
);
}
}