Files
workavia-mail-front/lib/features/manage_account/presentation/vacation/vacation_view.dart
T
dab246 38442aaedc TF-1486 Fix duplicate cursor in vacation on android
(cherry picked from commit c0532ec7a0ebde3a2c4221f6282c60bc773fc648)
2023-07-14 16:24:47 +07:00

455 lines
22 KiB
Dart

import 'package:core/core.dart';
import 'package:core/presentation/utils/html_transformer/html_utils.dart';
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:get/get.dart';
import 'package:pointer_interceptor/pointer_interceptor.dart';
import 'package:rich_text_composer/rich_text_composer.dart';
import 'package:rich_text_composer/views/widgets/rich_text_keyboard_toolbar.dart';
import 'package:tmail_ui_user/features/base/widget/border_button_field.dart';
import 'package:tmail_ui_user/features/base/widget/text_input_field_builder.dart';
import 'package:tmail_ui_user/features/composer/presentation/mixin/rich_text_button_mixin.dart';
import 'package:tmail_ui_user/features/composer/presentation/model/button_layout_type.dart';
import 'package:tmail_ui_user/features/manage_account/presentation/base/setting_detail_view_builder.dart';
import 'package:tmail_ui_user/features/manage_account/presentation/model/vacation/date_type.dart';
import 'package:tmail_ui_user/features/manage_account/presentation/model/vacation/vacation_responder_status.dart';
import 'package:tmail_ui_user/features/manage_account/presentation/vacation/utils/vacation_utils.dart';
import 'package:tmail_ui_user/features/manage_account/presentation/vacation/vacation_controller.dart';
import 'package:tmail_ui_user/main/localizations/app_localizations.dart';
import 'package:html_editor_enhanced/html_editor.dart' as html_editor_browser;
import 'package:tmail_ui_user/main/utils/app_utils.dart';
class VacationView extends GetWidget<VacationController> with RichTextButtonMixin {
final _responsiveUtils = Get.find<ResponsiveUtils>();
final _imagePaths = Get.find<ImagePaths>();
VacationView({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
if (PlatformInfo.isWeb) {
return _buildVacationFormView(context);
} else {
return KeyboardRichText(
richTextController: controller.richTextControllerForMobile,
keyBroadToolbar: RichTextKeyboardToolBar(
titleBack: AppLocalizations.of(context).format,
backgroundKeyboardToolBarColor: PlatformInfo.isIOS
? AppColor.colorBackgroundKeyboard
: AppColor.colorBackgroundKeyboardAndroid,
titleFormatBottomSheet: AppLocalizations.of(context).format,
richTextController: controller.richTextControllerForMobile,
titleQuickStyleBottomSheet: AppLocalizations.of(context).quickStyles,
titleBackgroundBottomSheet: AppLocalizations.of(context).background,
titleForegroundBottomSheet: AppLocalizations.of(context).foreground,
),
child: _buildVacationFormView(context)
);
}
}
Widget _buildVacationFormView(BuildContext context) {
return SettingDetailViewBuilder(
responsiveUtils: _responsiveUtils,
padding: const EdgeInsets.symmetric(horizontal: 4),
onTapGestureDetector: () => controller.clearFocusEditor(context),
child: SingleChildScrollView(
physics: const ClampingScrollPhysics(),
controller: controller.scrollController,
child: Padding(
padding: VacationUtils.getPaddingView(context, _responsiveUtils),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
if (_responsiveUtils.isWebDesktop(context))
...[
Text(
AppLocalizations.of(context).vacation,
style: const TextStyle(
fontSize: 20,
fontWeight: FontWeight.w500,
color: Colors.black
)
),
const SizedBox(height: 8)
],
Text(
AppLocalizations.of(context).vacationSettingExplanation,
style: const TextStyle(
fontSize: 16,
fontWeight: FontWeight.normal,
color: AppColor.colorVacationSettingExplanation
)
),
const SizedBox(height: 24),
Row(children: [
Obx(() {
return InkWell(
onTap: () {
final newStatus = controller.isVacationDeactivated
? VacationResponderStatus.activated
: VacationResponderStatus.deactivated;
controller.updateVacationPresentation(newStatus: newStatus);
},
child: SvgPicture.asset(
controller.isVacationDeactivated ? _imagePaths.icSwitchOff : _imagePaths.icSwitchOn,
fit: BoxFit.fill,
width: 24,
height: 24
)
);
}),
const SizedBox(width: 16),
Expanded(
child: Text(
AppLocalizations.of(context).vacationSettingToggleButtonAutoReply,
style: const TextStyle(
fontSize: 16,
fontWeight: FontWeight.normal,
color: Colors.black
)
),
)
]),
const SizedBox(height: 28),
Padding(
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 14),
child: Column(children: [
Obx(() => AbsorbPointer(
absorbing: controller.isVacationDeactivated,
child: Opacity(
opacity: controller.isVacationDeactivated ? 0.3 : 1.0,
child: _responsiveUtils.isPortraitMobile(context)
? Column(children: [
BorderButtonField<DateTime>(
label: AppLocalizations.of(context).startDate,
value: controller.vacationPresentation.value.startDate,
mouseCursor: SystemMouseCursors.text,
backgroundColor: AppColor.colorBackgroundVacationSettingField,
isEmpty: !controller.isVacationDeactivated && controller.vacationPresentation.value.startDateIsNull,
hintText: AppLocalizations.of(context).startDate,
tapActionCallback: (value) => controller.selectDate(context, DateType.start, value)),
const SizedBox(height: 18),
BorderButtonField<TimeOfDay>(
label: AppLocalizations.of(context).startTime,
value: controller.vacationPresentation.value.startTime,
mouseCursor: SystemMouseCursors.text,
backgroundColor: AppColor.colorBackgroundVacationSettingField,
isEmpty: !controller.isVacationDeactivated && controller.vacationPresentation.value.starTimeIsNull,
hintText: AppLocalizations.of(context).noStartTime,
tapActionCallback: (value) => controller.selectTime(context, DateType.start, value)),
])
: Row(children: [
Expanded(child: BorderButtonField<DateTime>(
label: AppLocalizations.of(context).startDate,
value: controller.vacationPresentation.value.startDate,
mouseCursor: SystemMouseCursors.text,
backgroundColor: AppColor.colorBackgroundVacationSettingField,
isEmpty: !controller.isVacationDeactivated && controller.vacationPresentation.value.startDateIsNull,
hintText: AppLocalizations.of(context).startDate,
tapActionCallback: (value) => controller.selectDate(context, DateType.start, value))),
const SizedBox(width: 24),
Expanded(child: BorderButtonField<TimeOfDay>(
label: AppLocalizations.of(context).startTime,
value: controller.vacationPresentation.value.startTime,
mouseCursor: SystemMouseCursors.text,
backgroundColor: AppColor.colorBackgroundVacationSettingField,
isEmpty: !controller.isVacationDeactivated && controller.vacationPresentation.value.starTimeIsNull,
hintText: AppLocalizations.of(context).noStartTime,
tapActionCallback: (value) => controller.selectTime(context, DateType.start, value))),
]),
),
)),
const SizedBox(height: 24),
Obx(() => AbsorbPointer(
absorbing: controller.isVacationDeactivated,
child: Opacity(
opacity: controller.isVacationDeactivated ? 0.3 : 1.0,
child: Row(children: [
Obx(() => InkWell(
onTap: () {
final value = !controller.vacationPresentation.value.vacationStopEnabled;
controller.updateVacationPresentation(vacationStopEnabled: value);
},
child: SvgPicture.asset(
controller.vacationPresentation.value.vacationStopEnabled
? _imagePaths.icSwitchOn
: _imagePaths.icSwitchOff,
fit: BoxFit.fill,
width: 24,
height: 24
)
)),
const SizedBox(width: 16),
Expanded(
child: Text(
AppLocalizations.of(context).vacationStopsAt,
style: const TextStyle(
fontSize: 16,
fontWeight: FontWeight.normal,
color: Colors.black
)
),
)
]),
)
)),
const SizedBox(height: 24),
Obx(() => AbsorbPointer(
absorbing: !controller.canChangeEndDate,
child: Opacity(
opacity: !controller.canChangeEndDate ? 0.3 : 1.0,
child: _responsiveUtils.isPortraitMobile(context)
? Column(children: [
BorderButtonField<DateTime>(
label: AppLocalizations.of(context).endDate,
value: controller.vacationPresentation.value.endDate,
mouseCursor: SystemMouseCursors.text,
backgroundColor: AppColor.colorBackgroundVacationSettingField,
isEmpty: controller.canChangeEndDate && controller.vacationPresentation.value.endDateIsNull,
hintText: AppLocalizations.of(context).noEndDate,
tapActionCallback: (value) => controller.selectDate(context, DateType.end, value)),
const SizedBox(height: 18),
BorderButtonField<TimeOfDay>(
label: AppLocalizations.of(context).endTime,
value: controller.vacationPresentation.value.endTime,
mouseCursor: SystemMouseCursors.text,
backgroundColor: AppColor.colorBackgroundVacationSettingField,
isEmpty: controller.canChangeEndDate && controller.vacationPresentation.value.endTimeIsNull,
hintText: AppLocalizations.of(context).noEndTime,
tapActionCallback: (value) => controller.selectTime(context, DateType.end, value)),
])
: Row(children: [
Expanded(child: BorderButtonField<DateTime>(
label: AppLocalizations.of(context).endDate,
value: controller.vacationPresentation.value.endDate,
mouseCursor: SystemMouseCursors.text,
backgroundColor: AppColor.colorBackgroundVacationSettingField,
isEmpty: controller.canChangeEndDate && controller.vacationPresentation.value.endDateIsNull,
hintText: AppLocalizations.of(context).noEndDate,
tapActionCallback: (value) => controller.selectDate(context, DateType.end, value))),
const SizedBox(width: 24),
Expanded(child: BorderButtonField<TimeOfDay>(
label: AppLocalizations.of(context).endTime,
value: controller.vacationPresentation.value.endTime,
mouseCursor: SystemMouseCursors.text,
backgroundColor: AppColor.colorBackgroundVacationSettingField,
isEmpty: controller.canChangeEndDate && controller.vacationPresentation.value.endTimeIsNull,
hintText: AppLocalizations.of(context).noEndTime,
tapActionCallback: (value) => controller.selectTime(context, DateType.end, value))),
]),
)
)),
const SizedBox(height: 24),
Obx(() => AbsorbPointer(
absorbing: controller.isVacationDeactivated,
child: _responsiveUtils.isPortraitMobile(context)
? Opacity(
opacity: controller.isVacationDeactivated ? 0.3 : 1.0,
child: TextInputFieldBuilder(
label: AppLocalizations.of(context).subject,
hint: AppLocalizations.of(context).hintSubjectInputVacationSetting,
editingController: controller.subjectTextController,
focusNode: controller.subjectTextFocusNode,
),
)
: Row(children: [
Expanded(child: Opacity(
opacity: controller.isVacationDeactivated ? 0.3 : 1.0,
child: TextInputFieldBuilder(
label: AppLocalizations.of(context).subject,
hint: AppLocalizations.of(context).hintSubjectInputVacationSetting,
editingController: controller.subjectTextController,
focusNode: controller.subjectTextFocusNode,
),
)),
const SizedBox(width: 24),
const Expanded(child: SizedBox.shrink())
])
)),
const SizedBox(height: 24),
Obx(() => AbsorbPointer(
absorbing: controller.isVacationDeactivated,
child: Opacity(
opacity: controller.isVacationDeactivated ? 0.3 : 1.0,
child: _buildVacationMessage(context),
),
)),
const SizedBox(height: 24),
_buildListButtonAction(context)
]),
)
]
),
),
),
);
}
Widget _buildListButtonAction(BuildContext context) {
if (_responsiveUtils.isWebDesktop(context)) {
return Align(
alignment: Alignment.centerRight,
child: buildTextButton(
AppLocalizations.of(context).saveChanges,
textStyle: const TextStyle(
color: Colors.white,
fontWeight: FontWeight.normal,
fontSize: 16
),
width: 156,
height: 44,
radius: 10,
onTap: () => controller.saveVacation(context)),
);
} else {
if (_responsiveUtils.isPortraitMobile(context)) {
return Row(children: [
Expanded(
child: buildTextButton(
AppLocalizations.of(context).cancel,
textStyle: const TextStyle(
fontWeight: FontWeight.w500,
fontSize: 17,
color: AppColor.colorTextButton),
backgroundColor: AppColor.emailAddressChipColor,
width: 156,
height: 44,
radius: 10,
onTap: () => controller.backToUniversalSettings(context)),
),
const SizedBox(width: 12),
Expanded(
child: buildTextButton(
AppLocalizations.of(context).saveChanges,
textStyle: const TextStyle(
color: Colors.white,
fontWeight: FontWeight.normal,
fontSize: 16
),
width: 156,
height: 44,
radius: 10,
onTap: () => controller.saveVacation(context)),
)
]);
} else {
return Row(children: [
const Spacer(),
buildTextButton(
AppLocalizations.of(context).cancel,
textStyle: const TextStyle(
fontWeight: FontWeight.w500,
fontSize: 17,
color: AppColor.colorTextButton),
backgroundColor: AppColor.emailAddressChipColor,
width: 156,
height: 44,
radius: 10,
onTap: () => controller.backToUniversalSettings(context)),
const SizedBox(width: 12),
buildTextButton(
AppLocalizations.of(context).saveChanges,
textStyle: const TextStyle(
color: Colors.white,
fontWeight: FontWeight.normal,
fontSize: 16
),
width: 156,
height: 44,
radius: 10,
onTap: () => controller.saveVacation(context))
]);
}
}
}
Widget _buildVacationMessage(BuildContext context) {
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
AppLocalizations.of(context).message,
style: const TextStyle(
fontSize: 14,
fontWeight: FontWeight.normal,
color: AppColor.colorContentEmail
)
),
const SizedBox(height: 8),
_buildMessageTextEditor(context)
]
);
}
Widget _buildMessageTextEditor(BuildContext context) {
return Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(10),
border: Border.all(color: AppColor.colorInputBorderCreateMailbox),
color: Colors.white),
padding: const EdgeInsetsDirectional.only(start: 12, end: 12, top: 12),
child: Column(children: [
_buildMessageHtmlTextEditor(context),
if (PlatformInfo.isWeb)
Center(
child: PointerInterceptor(
child: buildToolbarRichTextForWeb(
context,
controller.richTextControllerForWeb,
layoutType: ButtonLayoutType.scrollHorizontal
)
)
)
]),
);
}
Widget _buildMessageHtmlTextEditor(BuildContext context) {
if (PlatformInfo.isWeb) {
return html_editor_browser.HtmlEditor(
key: const Key('vacation_message_html_text_editor_web'),
controller: controller.richTextControllerForWeb.editorController,
htmlEditorOptions: html_editor_browser.HtmlEditorOptions(
hint: '',
darkMode: false,
customBodyCssStyle: HtmlUtils.customCssStyleHtmlEditor(direction: AppUtils.getCurrentDirection(context))
),
blockQuotedContent: controller.vacationMessageHtmlText ?? '',
htmlToolbarOptions: const html_editor_browser.HtmlToolbarOptions(
toolbarType: html_editor_browser.ToolbarType.hide,
defaultToolbarButtons: []),
otherOptions: const html_editor_browser.OtherOptions(height: 150),
callbacks: html_editor_browser.Callbacks(
onChangeSelection: controller.richTextControllerForWeb.onEditorSettingsChange,
onChangeContent: controller.updateMessageHtmlText,
onFocus: () {
KeyboardUtils.hideKeyboard(context);
Future.delayed(const Duration(milliseconds: 500), () {
controller.richTextControllerForWeb.editorController.setFocus();
});
controller.richTextControllerForWeb.closeAllMenuPopup();
}
),
);
} else {
return HtmlEditor(
key: controller.htmlKey,
minHeight: controller.htmlEditorMinHeight,
addDefaultSelectionMenuItems: false,
initialContent: controller.vacationMessageHtmlText ?? '',
customStyleCss: HtmlUtils.customCssStyleHtmlEditor(direction: AppUtils.getCurrentDirection(context)),
onCreated: (htmlApi) {
controller.richTextControllerForMobile.onCreateHTMLEditor(
htmlApi,
onFocus: controller.onFocusHTMLEditor,
onEnterKeyDown: controller.onEnterKeyDown,
context: context,
);
}
);
}
}
}