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,50 @@
import 'package:flutter/material.dart';
import 'package:tm_app/views/completion_of_documents/pages/d_completion_of_documents_page.dart';
import 'package:tm_app/views/completion_of_documents/pages/m_completion_of_documents_page.dart';
import 'package:tm_app/views/completion_of_documents/pages/t_completion_of_documents_page.dart';
import '../../../core/utils/size_config.dart';
import '../../shared/responsive_builder.dart';
class CompletionOfDocumentsScreen extends StatefulWidget {
const CompletionOfDocumentsScreen({super.key});
@override
State<CompletionOfDocumentsScreen> createState() => _CompletionOfDocumentsScreenState();
}
class _CompletionOfDocumentsScreenState extends State<CompletionOfDocumentsScreen> {
// 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 const ResponsiveBuilder(
mobile: CompletionOfDocumentsMobilePage(),
tablet: CompletionOfDocumentsTabletPage(),
desktop: CompletionOfDocumentsDesktopPage(),
);
}
}
@@ -0,0 +1,390 @@
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.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/views/completion_of_documents/strings/completion_of_documents_string.dart';
import 'package:tm_app/views/shared/base_button.dart';
import 'package:tm_app/views/shared/desktop_navigation_widget.dart';
class CompletionOfDocumentsDesktopPage extends StatelessWidget {
const CompletionOfDocumentsDesktopPage({super.key});
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: AppColors.backgroundColor,
body: Column(
children: [
const DesktopNavigationWidget(currentIndex: 0),
SizedBox(
width: 760,
child: SingleChildScrollView(
child: Center(
child: SizedBox(
child: Padding(
padding: EdgeInsets.symmetric(vertical: 24.0.h()),
child: Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
children: [
SvgPicture.asset(
AssetsManager.arrowLeft,
width: 24.0.w(),
height: 24.0.h(),
),
SizedBox(width: 8.0.w()),
Text(
CompletionOfDocumentsStrings
.completionOfDocuments,
style: TextStyle(
color: AppColors.grey70,
fontSize: 16.0.sp(),
fontWeight: FontWeight.w600,
),
),
],
),
SizedBox(height: 24.0.h()),
_deadlineContainer(),
SizedBox(height: 16.0.h()),
_matchProfileProgress(),
SizedBox(height: 24.0.h()),
_docCardsSection(),
SizedBox(height: 24.0.h()),
_deadlinePicker(),
SizedBox(height: 16.0.h()),
_noteField(),
SizedBox(height: 24.0.h()),
BaseButton(
isEnabled: true,
onPressed: () {},
text:
CompletionOfDocumentsStrings
.submitForCompletion,
textColor: AppColors.textBlue,
backgroundColor: AppColors.primary30,
),
],
),
),
),
),
),
),
),
],
),
);
}
Widget _deadlineContainer() {
return Container(
width: double.infinity,
height: 24.0.h(),
padding: EdgeInsets.symmetric(horizontal: 8.0.w()),
decoration: BoxDecoration(
color: AppColors.primary20,
borderRadius: BorderRadius.circular(4),
),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
CompletionOfDocumentsStrings.submissionDeadline,
style: TextStyle(
color: AppColors.textBlue,
fontSize: 14.0.sp(),
fontWeight: FontWeight.w500,
),
),
Text(
'2025-06-15',
style: TextStyle(
color: AppColors.grey80,
fontSize: 14.0.sp(),
fontWeight: FontWeight.w500,
),
),
],
),
);
}
Widget _matchProfileProgress() {
return Container(
height: 58.0.h(),
width: double.infinity,
padding: EdgeInsets.symmetric(horizontal: 12.0.w(), vertical: 8.0.h()),
decoration: BoxDecoration(
border: Border.all(color: AppColors.orange10),
borderRadius: BorderRadius.circular(8),
color: AppColors.orange0,
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
children: [
Text(
'Match with your profile',
style: TextStyle(
fontSize: 12.0.sp(),
color: AppColors.grey80,
fontWeight: FontWeight.w400,
),
),
const Spacer(),
Text(
'75%',
style: TextStyle(
fontSize: 12.0.sp(),
color: AppColors.cyanTeal,
fontWeight: FontWeight.w600,
),
),
],
),
SizedBox(height: 4.0.h()),
LinearProgressIndicator(
value: 0.75,
backgroundColor: const Color(0xFFE0E0E0),
color: AppColors.cyanTeal,
minHeight: 6,
borderRadius: BorderRadius.circular(10),
),
],
),
);
}
Widget _docCardsSection() {
return Column(
children: [
_docCard(
title: 'Company Registration Certificate',
subtitle: 'Legal document proving business registration',
status: 'Completed',
statusColor: AppColors.green30,
statusBackgroundColor: AppColors.green10,
backgroundColor: AppColors.primary10Light,
borderSideColor: AppColors.primary30,
),
_docCard(
title: 'Tax Compliance Certificate',
subtitle: 'Proof of tax registration and compliance',
status: 'Completed',
statusColor: AppColors.green30,
statusBackgroundColor: AppColors.green10,
backgroundColor: AppColors.primary10Light,
borderSideColor: AppColors.primary30,
),
_docCard(
title: 'Technical Proposal',
subtitle: 'Detailed technical solution for the tender',
status: 'Incomplete',
statusColor: AppColors.red20,
statusBackgroundColor: AppColors.red10,
backgroundColor: AppColors.red0,
tag: 'Self apply',
tagColor: AppColors.green30,
borderSideColor: AppColors.red10,
tagBackgroundColor: AppColors.green20,
),
_docCard(
title: 'Financial Proposal',
subtitle: 'Detailed cost breakdown and pricing',
status: 'Incomplete',
statusColor: AppColors.red20,
statusBackgroundColor: AppColors.red10,
backgroundColor: AppColors.red0,
tag: 'Partnership',
tagColor: AppColors.purple,
borderSideColor: AppColors.red10,
tagBackgroundColor: AppColors.purpleLight,
),
_docCard(
title: 'Financial Proposal',
subtitle: 'Detailed cost breakdown and pricing',
status: 'Incomplete',
statusColor: AppColors.red20,
statusBackgroundColor: AppColors.red10,
backgroundColor: AppColors.red0,
borderSideColor: AppColors.red10,
),
],
);
}
Widget _deadlinePicker() {
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
CompletionOfDocumentsStrings.setDeadline,
style: TextStyle(
fontSize: 16.0.sp(),
color: AppColors.grey80,
fontWeight: FontWeight.w600,
),
),
SizedBox(height: 8.0.h()),
Container(
height: 48.0.h(),
padding: EdgeInsets.symmetric(horizontal: 12.0.w()),
decoration: BoxDecoration(
border: Border.all(color: AppColors.grey40),
borderRadius: BorderRadius.circular(12),
),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
'2025/04/10',
style: TextStyle(
fontSize: 16.0.sp(),
fontWeight: FontWeight.w700,
color: AppColors.grey60,
),
),
SvgPicture.asset(
AssetsManager.calendar,
height: 24.0.h(),
width: 24.0.w(),
),
],
),
),
],
);
}
Widget _noteField() {
return Container(
padding: const EdgeInsets.all(12),
height: 100.0.h(),
decoration: BoxDecoration(
border: Border.all(color: AppColors.borderColor),
borderRadius: BorderRadius.circular(8),
color: AppColors.grey0,
),
child: TextField(
maxLines: null,
decoration: const InputDecoration.collapsed(
hintText: CompletionOfDocumentsStrings.note,
),
style: TextStyle(
fontSize: 16.0.sp(),
color: AppColors.grey60,
fontWeight: FontWeight.w400,
),
),
);
}
Widget _docCard({
required String title,
required String subtitle,
required String status,
required Color statusColor,
required Color backgroundColor,
required Color borderSideColor,
required Color statusBackgroundColor,
String? tag,
Color? tagColor,
Color? tagBackgroundColor,
}) {
return Container(
width: double.infinity,
margin: EdgeInsets.only(bottom: 12.0.h()),
padding: const EdgeInsets.all(12),
decoration: BoxDecoration(
color: backgroundColor,
border: Border(
left: BorderSide(color: borderSideColor, width: 2.0.w()),
),
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
children: [
if (tag != null) ...[
const Spacer(),
Container(
margin: const EdgeInsets.only(right: 8),
height: 32.0.h(),
width: 91.0.w(),
decoration: BoxDecoration(
color: tagBackgroundColor,
borderRadius: BorderRadius.circular(8),
),
child: Center(
child: Text(
tag,
style: TextStyle(
fontSize: 12.0.sp(),
fontWeight: FontWeight.w500,
color: tagColor,
),
),
),
),
] else
const Spacer(),
Container(
height: 32.0.h(),
width: 91.0.w(),
decoration: BoxDecoration(
color: statusBackgroundColor,
borderRadius: BorderRadius.circular(8),
),
child: Center(
child: Text(
status,
style: TextStyle(
fontSize: 12.0.sp(),
fontWeight: FontWeight.w500,
color: statusColor,
),
),
),
),
],
),
SizedBox(height: 8.0.h()),
Text(
title,
style: TextStyle(
fontSize: 20.0.sp(),
fontWeight: FontWeight.w600,
color: AppColors.grey70,
),
),
SizedBox(height: 4.0.h()),
Text(
subtitle,
style: TextStyle(
fontSize: 16.0.sp(),
color: AppColors.grey,
fontWeight: FontWeight.w400,
),
),
],
),
);
}
}
@@ -5,7 +5,6 @@ import 'package:tm_app/core/theme/colors.dart';
import 'package:tm_app/core/utils/size_config.dart';
import 'package:tm_app/views/completion_of_documents/strings/completion_of_documents_string.dart';
import 'package:tm_app/views/shared/base_button.dart';
import 'package:tm_app/views/shared/tender_app_bar.dart';
class CompletionOfDocumentsMobilePage extends StatelessWidget {
const CompletionOfDocumentsMobilePage({super.key});
@@ -14,10 +13,10 @@ class CompletionOfDocumentsMobilePage extends StatelessWidget {
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: AppColors.backgroundColor,
appBar: appBar(
context: context,
title: CompletionOfDocumentsStrings.completionOfDocuments,
),
// appBar: appBar(
// context: context,
// title: CompletionOfDocumentsStrings.completionOfDocuments,
// ),
body: SafeArea(
child: SingleChildScrollView(
padding: EdgeInsets.symmetric(
@@ -27,6 +26,26 @@ class CompletionOfDocumentsMobilePage extends StatelessWidget {
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
children: [
SvgPicture.asset(
AssetsManager.arrowLeft,
width: 24.0.w(),
height: 24.0.h(),
),
SizedBox(width: 8.0.w()),
Text(
CompletionOfDocumentsStrings.completionOfDocuments,
style: TextStyle(
color: AppColors.grey70,
fontSize: 16.0.sp(),
fontWeight: FontWeight.w600,
),
),
],
),
SizedBox(height: 24.0.h()),
Container(
width: double.infinity,
height: 24.0.h(),
@@ -0,0 +1,385 @@
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.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/views/completion_of_documents/strings/completion_of_documents_string.dart';
import 'package:tm_app/views/shared/base_button.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 CompletionOfDocumentsTabletPage extends StatelessWidget {
const CompletionOfDocumentsTabletPage({super.key});
@override
Widget build(BuildContext context) {
final GlobalKey<ScaffoldState> key = GlobalKey();
return Scaffold(
key: key,
backgroundColor: AppColors.backgroundColor,
appBar: tabletAppBar(
title: CompletionOfDocumentsStrings.completionOfDocuments,
key: key,
context: context,
),
drawer: const TabletNavigationWidget(currentIndex: 0),
body: SafeArea(
child: Center(
child: SizedBox(
width: 720,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const TabletDesktopAppbar(
title: CompletionOfDocumentsStrings.completionOfDocuments,
haveFilter: false,
),
Expanded(
child: SingleChildScrollView(
child: Padding(
padding: EdgeInsets.symmetric(vertical: 24.0.h()),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
_deadlineContainer(),
SizedBox(height: 16.0.h()),
_matchProfileProgress(),
SizedBox(height: 24.0.h()),
_docCardsSection(),
SizedBox(height: 24.0.h()),
_deadlinePicker(),
SizedBox(height: 16.0.h()),
_noteField(),
SizedBox(height: 24.0.h()),
BaseButton(
isEnabled: true,
onPressed: () {},
text:
CompletionOfDocumentsStrings
.submitForCompletion,
textColor: AppColors.textBlue,
backgroundColor: AppColors.primary30,
),
],
),
),
),
),
],
),
),
),
),
);
}
Widget _deadlineContainer() {
return Container(
width: double.infinity,
height: 24.0.h(),
padding: EdgeInsets.symmetric(horizontal: 8.0.w()),
decoration: BoxDecoration(
color: AppColors.primary20,
borderRadius: BorderRadius.circular(4),
),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
CompletionOfDocumentsStrings.submissionDeadline,
style: TextStyle(
color: AppColors.textBlue,
fontSize: 14.0.sp(),
fontWeight: FontWeight.w500,
),
),
Text(
'2025-06-15',
style: TextStyle(
color: AppColors.grey80,
fontSize: 14.0.sp(),
fontWeight: FontWeight.w500,
),
),
],
),
);
}
Widget _matchProfileProgress() {
return Container(
height: 58.0.h(),
width: double.infinity,
padding: EdgeInsets.symmetric(horizontal: 12.0.w(), vertical: 8.0.h()),
decoration: BoxDecoration(
border: Border.all(color: AppColors.orange10),
borderRadius: BorderRadius.circular(8),
color: AppColors.orange0,
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
children: [
Text(
'Match with your profile',
style: TextStyle(
fontSize: 12.0.sp(),
color: AppColors.grey80,
fontWeight: FontWeight.w400,
),
),
const Spacer(),
Text(
'75%',
style: TextStyle(
fontSize: 12.0.sp(),
color: AppColors.cyanTeal,
fontWeight: FontWeight.w600,
),
),
],
),
SizedBox(height: 4.0.h()),
LinearProgressIndicator(
value: 0.75,
backgroundColor: const Color(0xFFE0E0E0),
color: AppColors.cyanTeal,
minHeight: 6,
borderRadius: BorderRadius.circular(10),
),
],
),
);
}
Widget _docCardsSection() {
return Column(
children: [
_docCard(
title: 'Company Registration Certificate',
subtitle: 'Legal document proving business registration',
status: 'Completed',
statusColor: AppColors.green30,
statusBackgroundColor: AppColors.green10,
backgroundColor: AppColors.primary10Light,
borderSideColor: AppColors.primary30,
),
_docCard(
title: 'Tax Compliance Certificate',
subtitle: 'Proof of tax registration and compliance',
status: 'Completed',
statusColor: AppColors.green30,
statusBackgroundColor: AppColors.green10,
backgroundColor: AppColors.primary10Light,
borderSideColor: AppColors.primary30,
),
_docCard(
title: 'Technical Proposal',
subtitle: 'Detailed technical solution for the tender',
status: 'Incomplete',
statusColor: AppColors.red20,
statusBackgroundColor: AppColors.red10,
backgroundColor: AppColors.red0,
tag: 'Self apply',
tagColor: AppColors.green30,
borderSideColor: AppColors.red10,
tagBackgroundColor: AppColors.green20,
),
_docCard(
title: 'Financial Proposal',
subtitle: 'Detailed cost breakdown and pricing',
status: 'Incomplete',
statusColor: AppColors.red20,
statusBackgroundColor: AppColors.red10,
backgroundColor: AppColors.red0,
tag: 'Partnership',
tagColor: AppColors.purple,
borderSideColor: AppColors.red10,
tagBackgroundColor: AppColors.purpleLight,
),
_docCard(
title: 'Financial Proposal',
subtitle: 'Detailed cost breakdown and pricing',
status: 'Incomplete',
statusColor: AppColors.red20,
statusBackgroundColor: AppColors.red10,
backgroundColor: AppColors.red0,
borderSideColor: AppColors.red10,
),
],
);
}
Widget _deadlinePicker() {
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
CompletionOfDocumentsStrings.setDeadline,
style: TextStyle(
fontSize: 16.0.sp(),
color: AppColors.grey80,
fontWeight: FontWeight.w600,
),
),
SizedBox(height: 8.0.h()),
Container(
height: 48.0.h(),
padding: EdgeInsets.symmetric(horizontal: 12.0.w()),
decoration: BoxDecoration(
border: Border.all(color: AppColors.grey40),
borderRadius: BorderRadius.circular(12),
),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
'2025/04/10',
style: TextStyle(
fontSize: 16.0.sp(),
fontWeight: FontWeight.w700,
color: AppColors.grey60,
),
),
SvgPicture.asset(
AssetsManager.calendar,
height: 24.0.h(),
width: 24.0.w(),
),
],
),
),
],
);
}
Widget _noteField() {
return Container(
padding: const EdgeInsets.all(12),
height: 100.0.h(),
decoration: BoxDecoration(
border: Border.all(color: AppColors.borderColor),
borderRadius: BorderRadius.circular(8),
color: AppColors.grey0,
),
child: TextField(
maxLines: null,
decoration: const InputDecoration.collapsed(
hintText: CompletionOfDocumentsStrings.note,
),
style: TextStyle(
fontSize: 16.0.sp(),
color: AppColors.grey60,
fontWeight: FontWeight.w400,
),
),
);
}
// -------------------- Document Card --------------------
Widget _docCard({
required String title,
required String subtitle,
required String status,
required Color statusColor,
required Color backgroundColor,
required Color borderSideColor,
required Color statusBackgroundColor,
String? tag,
Color? tagColor,
Color? tagBackgroundColor,
}) {
return Container(
width: double.infinity,
margin: EdgeInsets.only(bottom: 12.0.h()),
padding: const EdgeInsets.all(12),
decoration: BoxDecoration(
color: backgroundColor,
border: Border(
left: BorderSide(color: borderSideColor, width: 2.0.w()),
),
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
children: [
if (tag != null) ...[
const Spacer(),
Container(
margin: const EdgeInsets.only(right: 8),
height: 32.0.h(),
width: 91.0.w(),
decoration: BoxDecoration(
color: tagBackgroundColor,
borderRadius: BorderRadius.circular(8),
),
child: Center(
child: Text(
tag,
style: TextStyle(
fontSize: 12.0.sp(),
fontWeight: FontWeight.w500,
color: tagColor,
),
),
),
),
] else
const Spacer(),
Container(
height: 32.0.h(),
width: 91.0.w(),
decoration: BoxDecoration(
color: statusBackgroundColor,
borderRadius: BorderRadius.circular(8),
),
child: Center(
child: Text(
status,
style: TextStyle(
fontSize: 12.0.sp(),
fontWeight: FontWeight.w500,
color: statusColor,
),
),
),
),
],
),
SizedBox(height: 8.0.h()),
Text(
title,
style: TextStyle(
fontSize: 20.0.sp(),
fontWeight: FontWeight.w600,
color: AppColors.grey70,
),
),
SizedBox(height: 4.0.h()),
Text(
subtitle,
style: TextStyle(
fontSize: 16.0.sp(),
color: AppColors.grey,
fontWeight: FontWeight.w400,
),
),
],
),
);
}
}