added web tablet pages

This commit is contained in:
llsajjad
2025-10-13 11:54:23 +03:30
parent 5e382e78ad
commit be6b0bbe98
16 changed files with 2059 additions and 355 deletions
@@ -0,0 +1,326 @@
import 'package:dotted_border/dotted_border.dart';
import 'package:flutter/material.dart';
import 'package:flutter_svg/svg.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 'package:tm_app/views/shared/tablet_desktop_appbar.dart';
import '../../shared/main_drop_down.dart';
class DesktopFinalCompletionOfDocumentsPage extends StatelessWidget {
const DesktopFinalCompletionOfDocumentsPage({super.key});
@override
Widget build(BuildContext context) {
SizeConfig.init(context);
return Scaffold(
body: Consumer<FinalCompletionOfDocumentsViewModel>(
builder:
(context, viewModel, child) => SafeArea(
child: Column(
children: [
const DesktopNavigationWidget(currentIndex: 1),
const SizedBox(height: 64.0),
SizedBox(
width: 740,
child: Column(
children: [
Expanded(
child: SizedBox(
child: SingleChildScrollView(
child: Column(
children: [
const TabletDesktopAppbar(
title:
FinalCompletionOfDocumentsStrings
.completionOfDocuments,
),
SizedBox(height: 32.0.h()),
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,
hintText: FinalCompletionOfDocumentsStrings.describeYourTeamHint,
hintStyle: 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) {},
),
],
);
}
}
@@ -1,316 +1,52 @@
import 'package:dotted_border/dotted_border.dart';
import 'package:flutter/material.dart';
import 'package:flutter_svg/svg.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 'package:tm_app/views/shared/tablet_desktop_appbar.dart';
import 'package:tm_app/views/final_completion_of_documents/pages/desktop_final_completion_of_documents_page.dart';
import 'package:tm_app/views/final_completion_of_documents/pages/tablet_final_completion_of_documents_page.dart';
import '../../shared/main_drop_down.dart';
import '../../../core/utils/size_config.dart';
import '../../shared/responsive_builder.dart';
class FinalCompletionOfDocumentsScreen extends StatelessWidget {
class FinalCompletionOfDocumentsScreen extends StatefulWidget {
const FinalCompletionOfDocumentsScreen({super.key});
@override
State<FinalCompletionOfDocumentsScreen> createState() =>
_FinalCompletionOfDocumentsScreenState();
}
class _FinalCompletionOfDocumentsScreenState
extends State<FinalCompletionOfDocumentsScreen> {
// late final HomeViewModel _viewModel;
// late final TabNavigationService _tabService;
@override
void initState() {
super.initState();
// _viewModel = context.read<HomeViewModel>();
// _tabService = context.read<TabNavigationService>();
// _tabService.addListener(_onTabChanged);
}
@override
void dispose() {
// _tabService.removeListener(_onTabChanged);
super.dispose();
}
// void _onTabChanged() {
// // Tab index 0 is Home
// if (_tabService.currentTabIndex == 0 && mounted) {
// _viewModel.init();
// }
// }
@override
Widget build(BuildContext context) {
SizeConfig.init(context);
return Scaffold(
body: Consumer<FinalCompletionOfDocumentsViewModel>(
builder:
(context, viewModel, child) => SafeArea(
child: Column(
children: [
const DesktopNavigationWidget(currentIndex: 1),
const SizedBox(height: 64.0),
Expanded(
child: SizedBox(
width: 740,
child: SingleChildScrollView(
child: Column(
children: [
const TabletDesktopAppbar(
title:
FinalCompletionOfDocumentsStrings
.completionOfDocuments,
),
SizedBox(height: 32.0.h()),
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,
hintText: FinalCompletionOfDocumentsStrings.describeYourTeamHint,
hintStyle: 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) {},
),
],
return const ResponsiveBuilder(
//mobile: MobileFinalCompletionOfDocumentsPage(),
mobile: TabletFinalCompletionOfDocumentsPage(),
tablet: TabletFinalCompletionOfDocumentsPage(),
desktop: DesktopFinalCompletionOfDocumentsPage(),
);
}
}
@@ -0,0 +1,314 @@
// import 'package:dotted_border/dotted_border.dart';
// import 'package:flutter/material.dart';
// import 'package:flutter_svg/svg.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/tablet_desktop_appbar.dart';
// import '../../shared/main_drop_down.dart';
// class MobileFinalCompletionOfDocumentsPage extends StatelessWidget {
// const MobileFinalCompletionOfDocumentsPage({super.key});
// @override
// Widget build(BuildContext context) {
// SizeConfig.init(context);
// return Scaffold(
// body: Consumer<FinalCompletionOfDocumentsViewModel>(
// builder:
// (context, viewModel, child) => SafeArea(
// child: Column(
// children: [
// const SizedBox(height: 64.0),
// Padding(
// padding: EdgeInsets.symmetric(vertical: 24.0.h()),
// child: Expanded(
// child: SingleChildScrollView(
// child: Column(
// children: [
// const TabletDesktopAppbar(
// title:
// FinalCompletionOfDocumentsStrings
// .completionOfDocuments,
// ),
// SizedBox(height: 32.0.h()),
// 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,
// hintText: FinalCompletionOfDocumentsStrings.describeYourTeamHint,
// hintStyle: 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) {},
// ),
// ],
// );
// }
// }
@@ -0,0 +1,343 @@
import 'package:dotted_border/dotted_border.dart';
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.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/main_drop_down.dart';
import 'package:tm_app/views/shared/tablet_desktop_appbar.dart';
import 'package:tm_app/views/shared/tablet_navigation_widget.dart';
import 'package:tm_app/views/shared/tender_app_bar.dart';
class TabletFinalCompletionOfDocumentsPage extends StatelessWidget {
const TabletFinalCompletionOfDocumentsPage({super.key});
@override
Widget build(BuildContext context) {
final GlobalKey<ScaffoldState> key = GlobalKey();
SizeConfig.init(context);
return Scaffold(
key: key,
backgroundColor: AppColors.backgroundColor,
appBar: tabletAppBar(
title: FinalCompletionOfDocumentsStrings.completionOfDocuments,
key: key,
context: context,
),
drawer: const TabletNavigationWidget(currentIndex: 1),
body: Consumer<FinalCompletionOfDocumentsViewModel>(
builder: (context, viewModel, _) {
return SafeArea(
child: Center(
child: SizedBox(
width: 720,
child: Padding(
padding: EdgeInsets.symmetric(vertical: 24.0.h()),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const TabletDesktopAppbar(
title:
FinalCompletionOfDocumentsStrings
.completionOfDocuments,
haveFilter: false,
),
Expanded(
child: SingleChildScrollView(
padding: EdgeInsets.symmetric(vertical: 32.0.h()),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const CommentBox(),
SizedBox(height: 32.0.h()),
FormCard(viewModel: viewModel),
SizedBox(height: 40.0.h()),
Row(
mainAxisAlignment: MainAxisAlignment.end,
children: [
BaseButton(
isEnabled: true,
onPressed: () {},
width: 176.0.w(),
backgroundColor: AppColors.primary10,
textColor: AppColors.mainBlue,
text:
FinalCompletionOfDocumentsStrings.back,
),
SizedBox(width: 16.0.w()),
BaseButton(
isEnabled: true,
onPressed: () {},
width: 176.0.w(),
text:
FinalCompletionOfDocumentsStrings.next,
),
],
),
SizedBox(height: 35.0.h()),
],
),
),
),
],
),
),
),
),
);
},
),
);
}
}
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: EdgeInsets.symmetric(horizontal: 16.0.w(), vertical: 24.0.h()),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(4),
border: Border.all(color: AppColors.borderColor),
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
_progressCard(),
SizedBox(height: 48.0.h()),
_infoSection(
title: FinalCompletionOfDocumentsStrings.numberOfServersListedTitle,
value: '12 servers across 2 data centers',
),
SizedBox(height: 24.0.h()),
Divider(color: AppColors.borderColor),
SizedBox(height: 24.0.h()),
_infoSection(
title:
FinalCompletionOfDocumentsStrings
.technicalTeamOrganizationChartUploadedTitle,
value: 'PDF submitted with full team roles and structure',
),
SizedBox(height: 24.0.h()),
Divider(color: AppColors.borderColor),
SizedBox(height: 48.0.h()),
_titleDropDownRow(
text:
FinalCompletionOfDocumentsStrings
.describeInfrastructureCapabilitiestitle,
),
SizedBox(height: 16.0.h()),
_uploadFileCard(viewModel: viewModel),
SizedBox(height: 40.0.h()),
_titleDropDownRow(
text:
FinalCompletionOfDocumentsStrings
.uploadTechnicalTeamOrgChartTitle,
),
SizedBox(height: 16.0.h()),
_describeYourTeamTextField(),
SizedBox(height: 48.0.h()),
_titleDropDownRow(
text:
FinalCompletionOfDocumentsStrings
.noCertificationInISO27001Title,
),
SizedBox(height: 16.0.h()),
_uploadFileCard(viewModel: viewModel),
SizedBox(height: 48.0.h()),
_titleDropDownRow(
text:
FinalCompletionOfDocumentsStrings
.uploadCompletionCertificateTitle,
),
SizedBox(height: 16.0.h()),
_uploadFileCard(viewModel: viewModel),
],
),
);
}
Widget _progressCard() {
return Container(
width: double.infinity,
height: 64.0.h(),
padding: EdgeInsets.symmetric(horizontal: 16.0.w(), vertical: 16.0.h()),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(4),
border: Border.all(color: AppColors.borderColor),
),
alignment: AlignmentDirectional.centerStart,
child: Container(
width: 118.0.w(),
height: 32.0.h(),
decoration: BoxDecoration(
color: AppColors.yellow3,
borderRadius: BorderRadius.circular(8),
),
alignment: Alignment.center,
child: Text(
'50% Completed',
style: TextStyle(color: AppColors.yellow4, fontSize: 14.0.sp()),
),
),
);
}
Widget _infoSection({required String title, required String value}) {
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
title,
style: TextStyle(
fontSize: 16.0.sp(),
fontWeight: FontWeight.w400,
color: AppColors.grey60,
),
),
SizedBox(height: 12.0.h()),
Text(
value,
style: TextStyle(
fontSize: 16.0.sp(),
fontWeight: FontWeight.w400,
color: AppColors.grey80,
),
),
],
);
}
Widget _describeYourTeamTextField() {
return TextFormField(
maxLines: 5,
decoration: InputDecoration(
filled: true,
fillColor: AppColors.grey0,
hintText: FinalCompletionOfDocumentsStrings.describeYourTeamHint,
hintStyle: TextStyle(
fontSize: 12.0.sp(),
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.0.h(),
decoration: BoxDecoration(
color: AppColors.grey0,
borderRadius: BorderRadius.circular(12),
),
child: DottedBorder(
options: RoundedRectDottedBorderOptions(
radius: const Radius.circular(12),
dashPattern: const [4, 4],
strokeWidth: 1,
color: AppColors.secondaryborder,
padding: EdgeInsets.all(16.0.w()),
),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
SvgPicture.asset(AssetsManager.uploadFile, height: 32.0.h()),
SizedBox(height: 12.0.h()),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
FinalCompletionOfDocumentsStrings.chooseFile,
style: TextStyle(
fontSize: 14.0.sp(),
fontWeight: FontWeight.w500,
color: AppColors.mainBlue,
),
),
SizedBox(width: 4.0.w()),
Text(
FinalCompletionOfDocumentsStrings.toUpload,
style: TextStyle(
fontSize: 14.0.sp(),
fontWeight: FontWeight.w500,
color: AppColors.grey60,
),
),
],
),
SizedBox(height: 8.0.h()),
Text(
FinalCompletionOfDocumentsStrings.selectZipOrEtcTitle,
style: TextStyle(
fontSize: 12.0.sp(),
fontWeight: FontWeight.w400,
color: AppColors.grey60,
),
),
],
),
),
),
);
}
Widget _titleDropDownRow({required String text}) {
return Row(
children: [
SvgPicture.asset(
AssetsManager.dangerFill,
height: 20.0.h(),
width: 20.0.w(),
),
SizedBox(width: 8.0.w()),
Expanded(
child: Text(
text,
style: TextStyle(
fontSize: 16.0.sp(),
fontWeight: FontWeight.w400,
color: AppColors.grey60,
),
),
),
MainDropDown(
text: FinalCompletionOfDocumentsStrings.statusTitle,
items: const [
FinalCompletionOfDocumentsStrings.statusWaitingForOthers,
FinalCompletionOfDocumentsStrings.statusToDo,
FinalCompletionOfDocumentsStrings.statusDone,
],
onSelect: (String item) {},
),
],
);
}
}