eduvia/workavia-mail-front
11
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

TF-467 Apply new UI for mailbox mobile

Browse Source
This commit is contained in:
dab246
2022-04-08 12:43:45 +07:00
committed by Dat H. Pham
parent 3eb5f31dcd
commit 7b5a2dd820
22 changed files with 1058 additions and 435 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/features/mailbox_dashboard/presentation/mailbox_dashboard_view.dart
+11 -29
View File
@@ -2,8 +2,7 @@ import 'package:core/core.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:tmail_ui_user/features/base/mixin/network_connection_mixin.dart';
import 'package:tmail_ui_user/features/composer/presentation/composer_view.dart'
if (dart.library.html) 'package:tmail_ui_user/features/composer/presentation/composer_view_web.dart';
import 'package:tmail_ui_user/features/composer/presentation/composer_view.dart';
import 'package:tmail_ui_user/features/email/presentation/email_view.dart';
import 'package:tmail_ui_user/features/mailbox/presentation/mailbox_view.dart';
import 'package:tmail_ui_user/features/mailbox_dashboard/presentation/mailbox_dashboard_controller.dart';
@@ -23,9 +22,10 @@ class MailboxDashBoardView extends GetWidget<MailboxDashBoardController> with Ne
key: controller.scaffoldKey,
drawer: ResponsiveWidget(
responsiveUtils: _responsiveUtils,
mobile: Container(child: MailboxView(),
width: _responsiveUtils.isPortrait(context) ? _responsiveUtils.getSizeScreenWidth(context) : _responsiveUtils.getSizeScreenWidth(context) / 2),
tablet: Container(child: MailboxView(), width: _responsiveUtils.getSizeScreenWidth(context) / 2),
mobile: _responsiveUtils.isPortrait(context)
? SizedBox(child: MailboxView(), width: double.infinity)
: SizedBox(child: MailboxView(), width: _responsiveUtils.defaultSizeDrawerWidthMobileTablet),
tablet: SizedBox(child: MailboxView(), width: _responsiveUtils.defaultSizeDrawerWidthMobileTablet),
tabletLarge: SizedBox.shrink(),
desktop: SizedBox.shrink()
),
@@ -33,8 +33,8 @@ class MailboxDashBoardView extends GetWidget<MailboxDashBoardController> with Ne
body: Stack(children: [
ResponsiveWidget(
responsiveUtils: _responsiveUtils,
desktop: _buildDesktopView(context),
tabletLarge: _buildTabletLargeView(context),
desktop: _buildLargeScreenView(context),
tabletLarge: _buildLargeScreenView(context),
tablet: ThreadView(),
mobile: ThreadView()
),
@@ -84,8 +84,8 @@ class MailboxDashBoardView extends GetWidget<MailboxDashBoardController> with Ne
}
}
Widget _buildDesktopView(BuildContext context) {
if (controller.isDrawerOpen && _responsiveUtils.isDesktop(context)) {
Widget _buildLargeScreenView(BuildContext context) {
if (controller.isDrawerOpen && (_responsiveUtils.isDesktop(context) || _responsiveUtils.isTabletLarge(context))) {
WidgetsBinding.instance?.addPostFrameCallback((_) {
controller.closeDrawer();
});
@@ -95,26 +95,8 @@ class MailboxDashBoardView extends GetWidget<MailboxDashBoardController> with Ne
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Expanded(flex: 1, child: MailboxView()),
Expanded(flex: 3, child: _buildThreadAndEmailContainer(context)),
],
),
);
}
Widget _buildTabletLargeView(BuildContext context) {
if (controller.isDrawerOpen && _responsiveUtils.isTabletLarge(context)) {
WidgetsBinding.instance?.addPostFrameCallback((_) {
controller.closeDrawer();
});
}
return Container(
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Expanded(flex: 2, child: MailboxView()),
Expanded(flex: 4, child: _buildThreadAndEmailContainer(context)),
SizedBox(child: MailboxView(), width: _responsiveUtils.defaultSizeDrawerWidthMobileTablet),
Expanded(child: _buildThreadAndEmailContainer(context))
],
),
);
lib/features/mailbox_dashboard/presentation/mailbox_dashboard_view_web.dart
+121
View File
@@ -0,0 +1,121 @@
import 'package:core/core.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:tmail_ui_user/features/base/mixin/network_connection_mixin.dart';
import 'package:tmail_ui_user/features/composer/presentation/composer_view_web.dart';
import 'package:tmail_ui_user/features/email/presentation/email_view.dart';
import 'package:tmail_ui_user/features/mailbox/presentation/mailbox_view_web.dart';
import 'package:tmail_ui_user/features/mailbox_dashboard/presentation/mailbox_dashboard_controller.dart';
import 'package:tmail_ui_user/features/mailbox_dashboard/presentation/model/dashboard_action.dart';
import 'package:tmail_ui_user/features/setting/presentation/model/app_setting.dart';
import 'package:tmail_ui_user/features/setting/presentation/model/reading_pane.dart';
import 'package:tmail_ui_user/features/thread/presentation/thread_view.dart';
import 'package:tmail_ui_user/main/routes/app_routes.dart';
class MailboxDashBoardView extends GetWidget<MailboxDashBoardController> with NetworkConnectionMixin {
final _responsiveUtils = Get.find<ResponsiveUtils>();
@override
Widget build(BuildContext context) {
return Scaffold(
key: controller.scaffoldKey,
drawer: ResponsiveWidget(
responsiveUtils: _responsiveUtils,
mobile: Container(child: MailboxView(),
width: _responsiveUtils.isPortrait(context) ? _responsiveUtils.getSizeScreenWidth(context) : _responsiveUtils.getSizeScreenWidth(context) / 2),
tablet: Container(child: MailboxView(), width: _responsiveUtils.getSizeScreenWidth(context) / 2),
tabletLarge: SizedBox.shrink(),
desktop: SizedBox.shrink()
),
drawerEnableOpenDragGesture: !_responsiveUtils.isDesktop(context),
body: Stack(children: [
ResponsiveWidget(
responsiveUtils: _responsiveUtils,
desktop: _buildDesktopView(context),
tabletLarge: _buildTabletLargeView(context),
tablet: ThreadView(),
mobile: ThreadView()
),
Obx(() => controller.dashBoardAction == DashBoardAction.compose
? ComposerView()
: SizedBox.shrink()),
Obx(() => controller.isNetworkConnectionAvailable()
? SizedBox.shrink()
: Align(alignment: Alignment.bottomCenter, child: buildNetworkConnectionWidget(context))),
]),
);
}
Widget _buildThreadAndEmailContainer(BuildContext context) {
switch(AppSetting.readingPane) {
case ReadingPane.noSplit:
return Obx(() {
switch(controller.routePath.value) {
case AppRoutes.THREAD:
return ThreadView();
case AppRoutes.EMAIL:
return EmailView();
default:
return SizedBox.shrink();
}
});
case ReadingPane.rightOfInbox:
if (_responsiveUtils.isDesktop(context)) {
return Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Expanded(flex: 1, child: ThreadView()),
Expanded(flex: 2, child: EmailView()),
],
);
} else {
return Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Expanded(flex: 1, child: ThreadView()),
Expanded(flex: 1, child: EmailView()),
],
);
}
default:
return SizedBox.shrink();
}
}
Widget _buildDesktopView(BuildContext context) {
if (controller.isDrawerOpen && _responsiveUtils.isDesktop(context)) {
WidgetsBinding.instance?.addPostFrameCallback((_) {
controller.closeDrawer();
});
}
return Container(
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Expanded(flex: 1, child: MailboxView()),
Expanded(flex: 3, child: _buildThreadAndEmailContainer(context)),
],
),
);
}
Widget _buildTabletLargeView(BuildContext context) {
if (controller.isDrawerOpen && _responsiveUtils.isTabletLarge(context)) {
WidgetsBinding.instance?.addPostFrameCallback((_) {
controller.closeDrawer();
});
}
return Container(
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Expanded(flex: 2, child: MailboxView()),
Expanded(flex: 4, child: _buildThreadAndEmailContainer(context)),
],
),
);
}
}