completion of documents web screen added
This commit is contained in:
amirrezaghabeli
+330
@@ -0,0 +1,330 @@
|
||||
import 'package:dotted_border/dotted_border.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_svg/svg.dart';
|
||||
import 'package:go_router/go_router.dart';
|
||||
import 'package:provider/provider.dart';
|
||||
import 'package:tm_app/core/constants/assets.dart';
|
||||
import 'package:tm_app/core/theme/colors.dart';
|
||||
import 'package:tm_app/core/utils/size_config.dart';
|
||||
import 'package:tm_app/view_models/final_completion_of_documents_view_model.dart';
|
||||
import 'package:tm_app/views/final_completion_of_documents/strings/final_completion_of_documents_strings.dart';
|
||||
import 'package:tm_app/views/final_completion_of_documents/widgets/comment_box.dart';
|
||||
import 'package:tm_app/views/login/widgets/widgets.dart';
|
||||
import 'package:tm_app/views/shared/desktop_navigation_widget.dart';
|
||||
|
||||
import '../../shared/main_drop_down.dart';
|
||||
|
||||
class FinalCompletionOfDocumentsScreen extends StatelessWidget {
|
||||
const FinalCompletionOfDocumentsScreen({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
SizeConfig.init(context);
|
||||
return Scaffold(
|
||||
body: Consumer<FinalCompletionOfDocumentsViewModel>(
|
||||
builder:
|
||||
(context, viewModel, child) => Column(
|
||||
children: [
|
||||
const DesktopNavigationWidget(currentIndex: 1),
|
||||
const SizedBox(height: 64.0),
|
||||
Expanded(
|
||||
child: SizedBox(
|
||||
width: 740,
|
||||
child: SingleChildScrollView(
|
||||
child: Column(
|
||||
children: [
|
||||
Row(
|
||||
children: [
|
||||
InkWell(
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
onTap: () => context.pop(),
|
||||
child: SvgPicture.asset(
|
||||
AssetsManager.arrowLeft,
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 8.0),
|
||||
Text(
|
||||
FinalCompletionOfDocumentsStrings
|
||||
.completionOfDocuments,
|
||||
style: TextStyle(
|
||||
fontSize: 20.0,
|
||||
fontWeight: FontWeight.bold,
|
||||
color: AppColors.grey70,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 32.0),
|
||||
const CommentBox(),
|
||||
const SizedBox(height: 32.0),
|
||||
FormCard(viewModel: viewModel),
|
||||
const SizedBox(height: 40.0),
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.end,
|
||||
children: [
|
||||
BaseButton(
|
||||
isEnabled: true,
|
||||
onPressed: () {},
|
||||
width: 176,
|
||||
backgroundColor: AppColors.primary10,
|
||||
textColor: AppColors.mainBlue,
|
||||
text: FinalCompletionOfDocumentsStrings.back,
|
||||
),
|
||||
const SizedBox(width: 16.0),
|
||||
BaseButton(
|
||||
isEnabled: true,
|
||||
onPressed: () {},
|
||||
width: 176,
|
||||
text: FinalCompletionOfDocumentsStrings.next,
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 35.0),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class FormCard extends StatelessWidget {
|
||||
const FormCard({required this.viewModel, super.key});
|
||||
final FinalCompletionOfDocumentsViewModel viewModel;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Container(
|
||||
width: double.infinity,
|
||||
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 24),
|
||||
decoration: BoxDecoration(
|
||||
borderRadius: BorderRadius.circular(4),
|
||||
border: Border.all(color: AppColors.borderColor),
|
||||
),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Container(
|
||||
width: double.infinity,
|
||||
height: 64.0,
|
||||
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 16),
|
||||
decoration: BoxDecoration(
|
||||
borderRadius: BorderRadius.circular(4),
|
||||
border: Border.all(color: AppColors.borderColor),
|
||||
),
|
||||
alignment: AlignmentDirectional.centerStart,
|
||||
child: Container(
|
||||
width: 118,
|
||||
height: 32,
|
||||
decoration: BoxDecoration(
|
||||
color: AppColors.yellow3,
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
),
|
||||
alignment: Alignment.center,
|
||||
child: const Text(
|
||||
'50% Completed',
|
||||
style: TextStyle(color: AppColors.yellow4),
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 48.0),
|
||||
Text(
|
||||
FinalCompletionOfDocumentsStrings.numberOfServersListedTitle,
|
||||
style: TextStyle(
|
||||
fontSize: 16.0,
|
||||
fontWeight: FontWeight.w400,
|
||||
color: AppColors.grey60,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 12.0),
|
||||
Text(
|
||||
'12 servers across 2 data centers',
|
||||
style: TextStyle(
|
||||
fontSize: 16.0,
|
||||
fontWeight: FontWeight.w400,
|
||||
color: AppColors.grey80,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 24),
|
||||
Divider(color: AppColors.borderColor),
|
||||
const SizedBox(height: 24),
|
||||
Text(
|
||||
FinalCompletionOfDocumentsStrings
|
||||
.technicalTeamOrganizationChartUploadedTitle,
|
||||
style: TextStyle(
|
||||
fontSize: 16.0,
|
||||
fontWeight: FontWeight.w400,
|
||||
color: AppColors.grey60,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 12.0),
|
||||
Text(
|
||||
'PDF submitted with full team roles and structure',
|
||||
style: TextStyle(
|
||||
fontSize: 16.0,
|
||||
fontWeight: FontWeight.w400,
|
||||
color: AppColors.grey80,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 24),
|
||||
Divider(color: AppColors.borderColor),
|
||||
const SizedBox(height: 48),
|
||||
_titleDropDownRow(
|
||||
text:
|
||||
FinalCompletionOfDocumentsStrings
|
||||
.describeInfrastructureCapabilitiestitle,
|
||||
),
|
||||
const SizedBox(height: 16),
|
||||
_uploadFileCard(viewModel: viewModel),
|
||||
const SizedBox(height: 40),
|
||||
_titleDropDownRow(
|
||||
text:
|
||||
FinalCompletionOfDocumentsStrings
|
||||
.uploadTechnicalTeamOrgChartTitle,
|
||||
),
|
||||
const SizedBox(height: 16),
|
||||
_describeYourTeamTextField(),
|
||||
const SizedBox(height: 48),
|
||||
_titleDropDownRow(
|
||||
text:
|
||||
FinalCompletionOfDocumentsStrings
|
||||
.noCertificationInISO27001Title,
|
||||
),
|
||||
const SizedBox(height: 16),
|
||||
_uploadFileCard(viewModel: viewModel),
|
||||
const SizedBox(height: 48),
|
||||
_titleDropDownRow(
|
||||
text:
|
||||
FinalCompletionOfDocumentsStrings
|
||||
.uploadCompletionCertificateTitle,
|
||||
),
|
||||
const SizedBox(height: 16),
|
||||
_uploadFileCard(viewModel: viewModel),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _describeYourTeamTextField() {
|
||||
return TextFormField(
|
||||
maxLines: 5,
|
||||
decoration: InputDecoration(
|
||||
filled: true,
|
||||
fillColor: AppColors.grey0,
|
||||
hint: Text(
|
||||
FinalCompletionOfDocumentsStrings.describeYourTeamHint,
|
||||
style: TextStyle(
|
||||
fontSize: 12.0,
|
||||
fontWeight: FontWeight.w400,
|
||||
color: AppColors.grey60,
|
||||
),
|
||||
),
|
||||
border: OutlineInputBorder(
|
||||
borderSide: const BorderSide(color: AppColors.secondaryborder2),
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
),
|
||||
enabledBorder: OutlineInputBorder(
|
||||
borderSide: const BorderSide(color: AppColors.secondaryborder2),
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
),
|
||||
focusedBorder: OutlineInputBorder(
|
||||
borderSide: const BorderSide(color: AppColors.secondaryborder2),
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _uploadFileCard({
|
||||
required FinalCompletionOfDocumentsViewModel viewModel,
|
||||
}) {
|
||||
return InkWell(
|
||||
onTap: () => viewModel.pickFile(),
|
||||
child: Container(
|
||||
width: double.infinity,
|
||||
height: 140,
|
||||
decoration: BoxDecoration(color: AppColors.grey0),
|
||||
child: DottedBorder(
|
||||
options: const RoundedRectDottedBorderOptions(
|
||||
radius: Radius.circular(12),
|
||||
dashPattern: [4, 4],
|
||||
strokeWidth: 1,
|
||||
color: AppColors.secondaryborder,
|
||||
padding: EdgeInsets.all(16),
|
||||
),
|
||||
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
children: [
|
||||
SvgPicture.asset(AssetsManager.uploadFile),
|
||||
const SizedBox(height: 12),
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
const Text(
|
||||
FinalCompletionOfDocumentsStrings.chooseFile,
|
||||
style: TextStyle(
|
||||
fontSize: 14,
|
||||
fontWeight: FontWeight.w500,
|
||||
color: AppColors.mainBlue,
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 4),
|
||||
Text(
|
||||
FinalCompletionOfDocumentsStrings.toUpload,
|
||||
style: TextStyle(
|
||||
fontSize: 14,
|
||||
fontWeight: FontWeight.w500,
|
||||
color: AppColors.grey60,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
Text(
|
||||
FinalCompletionOfDocumentsStrings.selectZipOrEtcTitle,
|
||||
style: TextStyle(
|
||||
fontSize: 12,
|
||||
fontWeight: FontWeight.w400,
|
||||
color: AppColors.grey60,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _titleDropDownRow({required String text}) {
|
||||
return Row(
|
||||
children: [
|
||||
SvgPicture.asset(AssetsManager.dangerFill),
|
||||
const SizedBox(width: 8),
|
||||
Text(
|
||||
text,
|
||||
style: TextStyle(
|
||||
fontSize: 16,
|
||||
fontWeight: FontWeight.w400,
|
||||
color: AppColors.grey60,
|
||||
),
|
||||
),
|
||||
const Spacer(),
|
||||
MainDropDown(
|
||||
text: FinalCompletionOfDocumentsStrings.statusTitle,
|
||||
items: const [
|
||||
FinalCompletionOfDocumentsStrings.statusWaitingForOthers,
|
||||
FinalCompletionOfDocumentsStrings.statusToDo,
|
||||
FinalCompletionOfDocumentsStrings.statusDone,
|
||||
],
|
||||
onSelect: (String item) {},
|
||||
),
|
||||
],
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user