TF-1844 Apply new design for advanced search form view

(cherry picked from commit d87ec1253730bcb067c058144dcb1ddc2481f181)
This commit is contained in:
dab246
2023-05-18 16:53:28 +07:00
committed by Dat Vu
parent 8d1f3f19b7
commit 4aaebfb09c
5 changed files with 114 additions and 99 deletions
@@ -55,96 +55,99 @@ class MailboxDashBoardView extends BaseMailboxDashBoardView {
ResponsiveWidget( ResponsiveWidget(
responsiveUtils: responsiveUtils, responsiveUtils: responsiveUtils,
desktop: Scaffold( desktop: Scaffold(
body: Container( body: GestureDetector(
color: AppColor.colorBgDesktop, onTap: () => FocusScope.of(context).unfocus(),
child: Column(children: [ child: Container(
Row(children: [ color: AppColor.colorBgDesktop,
Container( child: Column(children: [
width: ResponsiveUtils.defaultSizeMenu, Row(children: [
color: Colors.white, Container(
padding: EdgeInsets.only(
left: AppUtils.isDirectionRTL(context) ? 0 : 28,
right: AppUtils.isDirectionRTL(context) ? 28 : 0,
),
alignment: Alignment.center,
height: 80,
child: Row(children: [
SloganBuilder(
sizeLogo: 24,
text: AppLocalizations.of(context).app_name,
textAlign: TextAlign.center,
textStyle: const TextStyle(color: Colors.black, fontSize: 20, fontWeight: FontWeight.bold),
logo: imagePaths.icLogoTMail
),
Obx(() {
if (controller.appInformation.value != null) {
return Padding(padding: const EdgeInsets.only(top: 6),
child: Text(
'v${controller.appInformation.value!.version}',
textAlign: TextAlign.center,
style: const TextStyle(
fontSize: 13,
color: AppColor.colorContentEmail,
fontWeight: FontWeight.w500),
));
} else {
return const SizedBox.shrink();
}
}),
])
),
Expanded(child: Container(
color: Colors.white,
alignment: Alignment.center,
padding: EdgeInsets.only(
right: AppUtils.isDirectionRTL(context) ? 0 : 10,
left: AppUtils.isDirectionRTL(context) ? 10 : 0,
),
height: 80,
child: _buildRightHeader(context)))
]),
Expanded(child: Row(children: [
Column(children: [
_buildComposerButton(context),
Expanded(child: SizedBox(
width: ResponsiveUtils.defaultSizeMenu, width: ResponsiveUtils.defaultSizeMenu,
child: Obx(() { color: Colors.white,
if (controller.searchMailboxActivated.isTrue) { padding: EdgeInsets.only(
return const SearchMailboxView( left: AppUtils.isDirectionRTL(context) ? 0 : 28,
backgroundColor: AppColor.colorBgDesktop right: AppUtils.isDirectionRTL(context) ? 28 : 0,
);
} else {
return MailboxView();
}
})
))
]),
Expanded(child: Column(children: [
const SpamReportBannerWebWidget(),
_buildEmptyTrashButton(context),
QuotasWarningBannerWidget(
margin: EdgeInsets.only(
right: AppUtils.isDirectionRTL(context) ? 0 : 16,
left: AppUtils.isDirectionRTL(context) ? 16 : 0,
top: 8
), ),
alignment: Alignment.center,
height: 80,
child: Row(children: [
SloganBuilder(
sizeLogo: 24,
text: AppLocalizations.of(context).app_name,
textAlign: TextAlign.center,
textStyle: const TextStyle(color: Colors.black, fontSize: 20, fontWeight: FontWeight.bold),
logo: imagePaths.icLogoTMail
),
Obx(() {
if (controller.appInformation.value != null) {
return Padding(padding: const EdgeInsets.only(top: 6),
child: Text(
'v${controller.appInformation.value!.version}',
textAlign: TextAlign.center,
style: const TextStyle(
fontSize: 13,
color: AppColor.colorContentEmail,
fontWeight: FontWeight.w500),
));
} else {
return const SizedBox.shrink();
}
}),
])
), ),
_buildVacationNotificationMessage(context), Expanded(child: Container(
_buildListButtonQuickSearchFilter(context), color: Colors.white,
_buildMarkAsMailboxReadLoading(context), alignment: Alignment.center,
Expanded(child: Obx(() { padding: EdgeInsets.only(
switch(controller.dashboardRoute.value) { right: AppUtils.isDirectionRTL(context) ? 0 : 10,
case DashboardRoutes.thread: left: AppUtils.isDirectionRTL(context) ? 10 : 0,
return _buildThreadViewForWebDesktop(context); ),
case DashboardRoutes.emailDetailed: height: 80,
return EmailView(); child: _buildRightHeader(context)))
default: ]),
return const SizedBox.shrink(); Expanded(child: Row(children: [
} Column(children: [
})) _buildComposerButton(context),
Expanded(child: SizedBox(
width: ResponsiveUtils.defaultSizeMenu,
child: Obx(() {
if (controller.searchMailboxActivated.isTrue) {
return const SearchMailboxView(
backgroundColor: AppColor.colorBgDesktop
);
} else {
return MailboxView();
}
})
))
]),
Expanded(child: Column(children: [
const SpamReportBannerWebWidget(),
_buildEmptyTrashButton(context),
QuotasWarningBannerWidget(
margin: EdgeInsets.only(
right: AppUtils.isDirectionRTL(context) ? 0 : 16,
left: AppUtils.isDirectionRTL(context) ? 16 : 0,
top: 8
),
),
_buildVacationNotificationMessage(context),
_buildListButtonQuickSearchFilter(context),
_buildMarkAsMailboxReadLoading(context),
Expanded(child: Obx(() {
switch(controller.dashboardRoute.value) {
case DashboardRoutes.thread:
return _buildThreadViewForWebDesktop(context);
case DashboardRoutes.emailDetailed:
return EmailView();
default:
return const SizedBox.shrink();
}
}))
]))
])) ]))
])) ]),
]), ),
), ),
), ),
tabletLarge: Obx(() { tabletLarge: Obx(() {
@@ -362,24 +362,28 @@ class AdvancedSearchInputForm extends GetWidget<AdvancedFilterController>
onTap: onTap, onTap: onTap,
decoration: InputDecoration( decoration: InputDecoration(
filled: true, filled: true,
fillColor: AppColor.loginTextFieldBackgroundColor, fillColor: isSelectFormList ? AppColor.colorItemSelected : Colors.white,
contentPadding: const EdgeInsets.only( contentPadding: const EdgeInsets.only(
right: 8, right: 8,
left: 12, left: 12,
), ),
enabledBorder: const OutlineInputBorder( enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.all( borderRadius: const BorderRadius.all(
Radius.circular(10), Radius.circular(10),
), ),
borderSide: BorderSide( borderSide: BorderSide(
width: 0.5, width: isSelectFormList ? 0.5 : 1,
color: AppColor.colorInputBorderCreateMailbox, color: AppColor.colorInputBorderCreateMailbox,
), ),
), ),
border: const OutlineInputBorder( border: OutlineInputBorder(
borderRadius: BorderRadius.all( borderRadius: const BorderRadius.all(
Radius.circular(10), Radius.circular(10),
), ),
borderSide: BorderSide(
width: isSelectFormList ? 0.5 : 1,
color: AppColor.colorInputBorderCreateMailbox,
),
), ),
hintText: advancedSearchFilterField.getHintText(context), hintText: advancedSearchFilterField.getHintText(context),
hintStyle: TextStyle( hintStyle: TextStyle(
@@ -22,7 +22,7 @@ class AdvancedSearchFilterOverlay extends StatelessWidget {
child: GestureDetector( child: GestureDetector(
onTap: () => FocusManager.instance.primaryFocus?.unfocus(), onTap: () => FocusManager.instance.primaryFocus?.unfocus(),
child: Padding( child: Padding(
padding: const EdgeInsets.only(top: 4, bottom: 16), padding: const EdgeInsets.only(top: 4, bottom: 16, right: 22),
child: Container( child: Container(
constraints: BoxConstraints( constraints: BoxConstraints(
maxHeight: _getHeightOverlay(context, responsiveUtils), maxHeight: _getHeightOverlay(context, responsiveUtils),
@@ -40,7 +40,7 @@ class DateDropDownButton extends StatelessWidget {
borderRadius: BorderRadius.circular(10), borderRadius: BorderRadius.circular(10),
border: Border.all( border: Border.all(
color: AppColor.colorInputBorderCreateMailbox, color: AppColor.colorInputBorderCreateMailbox,
width: 1, width: 0.5,
), ),
color: AppColor.colorInputBackgroundCreateMailbox color: AppColor.colorInputBackgroundCreateMailbox
), ),
@@ -140,7 +140,7 @@ class _TextFieldAutoCompleteEmailAddressState
textInputAction: TextInputAction.next, textInputAction: TextInputAction.next,
decoration: InputDecoration( decoration: InputDecoration(
filled: true, filled: true,
fillColor: AppColor.loginTextFieldBackgroundColor, fillColor: Colors.white,
contentPadding: const EdgeInsets.only( contentPadding: const EdgeInsets.only(
right: 8, right: 8,
left: 12, left: 12,
@@ -150,7 +150,7 @@ class _TextFieldAutoCompleteEmailAddressState
Radius.circular(10), Radius.circular(10),
), ),
borderSide: BorderSide( borderSide: BorderSide(
width: 0.5, width: 1,
color: AppColor.colorInputBorderCreateMailbox, color: AppColor.colorInputBorderCreateMailbox,
), ),
), ),
@@ -158,10 +158,14 @@ class _TextFieldAutoCompleteEmailAddressState
borderRadius: BorderRadius.all( borderRadius: BorderRadius.all(
Radius.circular(10), Radius.circular(10),
), ),
borderSide: BorderSide(
width: 1,
color: AppColor.colorInputBorderCreateMailbox,
),
), ),
hintText: widget.advancedSearchFilterField.getHintText(context), hintText: widget.advancedSearchFilterField.getHintText(context),
hintStyle: const TextStyle( hintStyle: const TextStyle(
fontSize: 14, fontSize: 16,
color: AppColor.colorHintSearchBar, color: AppColor.colorHintSearchBar,
), ),
prefixIconConstraints: BoxConstraints(maxWidth: _distanceToField * 0.74), prefixIconConstraints: BoxConstraints(maxWidth: _distanceToField * 0.74),
@@ -177,10 +181,14 @@ class _TextFieldAutoCompleteEmailAddressState
: null, : null,
), ),
onChanged: (value) { onChanged: (value) {
onChanged?.call(value); if (value.trim().isNotEmpty) {
onChanged?.call(value);
}
}, },
onSubmitted: (tag) { onSubmitted: (tag) {
onSubmitted?.call(tag); if (tag.trim().isNotEmpty) {
onSubmitted?.call(tag);
}
}, },
), ),
); );