TF-2042 Display calendar event information widget

(cherry picked from commit d804b98c5904d014b8bec031cc08614af84c4a42)
This commit is contained in:
dab246
2023-07-26 19:19:03 +07:00
committed by Dat Vu
parent f6b2d5e3f5
commit 2f0c4474b6
7 changed files with 199 additions and 69 deletions
@@ -0,0 +1,93 @@
import 'package:core/presentation/extensions/color_extension.dart';
import 'package:flutter/material.dart';
import 'package:jmap_dart_client/jmap/mail/calendar/calendar_event.dart';
import 'package:tmail_ui_user/features/email/presentation/extensions/calendar_event_extension.dart';
import 'package:tmail_ui_user/features/email/presentation/styles/calendar_date_icon_widget_styles.dart';
class CalendarDateIconWidget extends StatelessWidget {
final CalendarEvent calendarEvent;
final double width;
const CalendarDateIconWidget({
super.key,
required this.calendarEvent,
this.width = 100
});
@override
Widget build(BuildContext context) {
return Container(
clipBehavior: Clip.antiAlias,
width: width,
margin: const EdgeInsets.all(CalendarIconWidgetStyles.margin),
decoration: const ShapeDecoration(
shape: RoundedRectangleBorder(borderRadius: BorderRadius.all(Radius.circular(CalendarIconWidgetStyles.borderRadius))),
color: Colors.white,
shadows: [
BoxShadow(
color: AppColor.colorShadowBgContentEmail,
blurRadius: 80,
offset: Offset(0, 1),
spreadRadius: 0,
),
BoxShadow(
color: AppColor.colorShadowCalendarDateIcon,
blurRadius: 3,
offset: Offset(0, 1),
spreadRadius: 1,
)
],
),
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Container(
color: AppColor.primaryColor,
padding: const EdgeInsetsDirectional.symmetric(
vertical: CalendarIconWidgetStyles.headerVerticalContentPadding,
horizontal: CalendarIconWidgetStyles.headerHorizontalContentPadding
),
width: width,
child: Text(
calendarEvent.monthStartDateAsString,
textAlign: TextAlign.center,
style: const TextStyle(
fontSize: CalendarIconWidgetStyles.headerTextSize,
fontWeight: FontWeight.w400,
color: Colors.white
),
),
),
Padding(
padding: const EdgeInsets.all(CalendarIconWidgetStyles.bodyContentPadding),
child: Text(
calendarEvent.dayStartDateAsString,
style: const TextStyle(
fontSize: CalendarIconWidgetStyles.bodyDayTextSize,
fontWeight: FontWeight.w700,
color: Colors.black
),
),
),
const Padding(
padding: EdgeInsets.symmetric(horizontal: CalendarIconWidgetStyles.bodyContentPadding),
child: Divider(color: AppColor.colorCalendarEventInformationStroke, height: 2)
),
Padding(
padding: const EdgeInsets.all(CalendarIconWidgetStyles.bodyContentPadding),
child: Text(
calendarEvent.weekDayStartDateAsString,
style: const TextStyle(
fontSize: CalendarIconWidgetStyles.bodyWeekDayTextSize,
fontWeight: FontWeight.w400,
color: Colors.black
),
),
),
],
),
);
}
}
@@ -0,0 +1,101 @@
import 'package:core/presentation/extensions/color_extension.dart';
import 'package:core/presentation/resources/image_paths.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:get/get.dart';
import 'package:jmap_dart_client/jmap/mail/calendar/calendar_event.dart';
import 'package:jmap_dart_client/jmap/mail/email/email_address.dart';
import 'package:model/extensions/email_address_extension.dart';
import 'package:tmail_ui_user/features/email/presentation/extensions/calendar_event_extension.dart';
import 'package:tmail_ui_user/features/email/presentation/styles/calendar_event_action_banner_styles.dart';
class CalendarEventActionBannerWidget extends StatelessWidget {
final CalendarEvent calendarEvent;
final Set<EmailAddress>? listFromEmailAddress;
const CalendarEventActionBannerWidget({
super.key,
required this.calendarEvent,
required this.listFromEmailAddress,
});
@override
Widget build(BuildContext context) {
final imagePaths = Get.find<ImagePaths>();
return Container(
decoration: BoxDecoration(
borderRadius: const BorderRadius.all(Radius.circular(CalendarEventActionBannerStyles.borderRadius)),
color: calendarEvent.getColorEventActionBanner(_getSenderEmailAddress()).withOpacity(0.12)
),
padding: const EdgeInsets.all(CalendarEventActionBannerStyles.contentPadding),
margin: const EdgeInsets.symmetric(
horizontal: CalendarEventActionBannerStyles.viewHorizontalMargin,
vertical: CalendarEventActionBannerStyles.viewVerticalMargin,
),
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
if (calendarEvent.getIconEventAction(imagePaths).isNotEmpty)
Padding(
padding: const EdgeInsetsDirectional.only(end: 8),
child: SvgPicture.asset(
calendarEvent.getIconEventAction(imagePaths),
width: CalendarEventActionBannerStyles.iconSize,
height: CalendarEventActionBannerStyles.iconSize,
fit: BoxFit.fill,
),
),
Expanded(child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisSize: MainAxisSize.min,
children: [
RichText(
text: TextSpan(
style: TextStyle(
fontSize: CalendarEventActionBannerStyles.titleTextSize,
fontWeight: FontWeight.w400,
color: calendarEvent.getColorEventActionText(_getSenderEmailAddress())
),
children: [
TextSpan(
text: calendarEvent.getUserNameEventAction(
context: context,
imagePaths: imagePaths,
senderEmailAddress: _getSenderEmailAddress()
),
style: TextStyle(
color: calendarEvent.getColorEventActionText(_getSenderEmailAddress()),
fontSize: CalendarEventActionBannerStyles.titleTextSize,
fontWeight: FontWeight.w700
),
),
TextSpan(text: calendarEvent.getTitleEventAction(context, _getSenderEmailAddress()))
]
)
),
if (calendarEvent.getSubTitleEventAction(context).isNotEmpty)
Text(
calendarEvent.getSubTitleEventAction(context),
style: const TextStyle(
color: AppColor.colorSubTitleEventActionText,
fontSize: CalendarEventActionBannerStyles.subTileTextSize,
fontWeight: FontWeight.w400
),
)
]
))
]
),
);
}
String _getSenderEmailAddress() {
if (listFromEmailAddress?.isNotEmpty == true) {
return listFromEmailAddress!.first.emailAddress;
} else {
return '';
}
}
}
@@ -0,0 +1,189 @@
import 'package:core/presentation/extensions/color_extension.dart';
import 'package:core/presentation/utils/responsive_utils.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:jmap_dart_client/jmap/mail/calendar/calendar_event.dart';
import 'package:tmail_ui_user/features/email/presentation/extensions/calendar_event_extension.dart';
import 'package:tmail_ui_user/features/email/presentation/styles/calendar_event_information_widget_styles.dart';
import 'package:tmail_ui_user/features/email/presentation/widgets/calendar_event/event_attendee_information_widget.dart';
import 'package:tmail_ui_user/features/email/presentation/widgets/calendar_event/calendar_date_icon_widget.dart';
import 'package:tmail_ui_user/features/email/presentation/widgets/calendar_event/event_location_information_widget.dart';
import 'package:tmail_ui_user/features/email/presentation/widgets/calendar_event/event_time_information_widget.dart';
import 'package:tmail_ui_user/main/localizations/app_localizations.dart';
class CalendarEventInformationWidget extends StatelessWidget {
final CalendarEvent calendarEvent;
const CalendarEventInformationWidget({
super.key,
required this.calendarEvent
});
@override
Widget build(BuildContext context) {
final responsiveUtils = Get.find<ResponsiveUtils>();
return Container(
clipBehavior: Clip.antiAlias,
decoration: const ShapeDecoration(
color: AppColor.colorCalendarEventInformationBackground,
shape: RoundedRectangleBorder(
side: BorderSide(
width: 0.5,
color: AppColor.colorCalendarEventInformationStroke,
),
borderRadius: BorderRadius.all(Radius.circular(CalendarEventInformationWidgetStyles.borderRadius)),
),
),
margin: const EdgeInsetsDirectional.symmetric(
vertical: CalendarEventInformationWidgetStyles.verticalMargin,
horizontal: CalendarEventInformationWidgetStyles.horizontalMargin),
child: responsiveUtils.isPortraitMobile(context)
? Column(
children: [
CalendarDateIconWidget(
calendarEvent: calendarEvent,
width: double.infinity,
),
Container(
decoration: const ShapeDecoration(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.only(
bottomLeft: Radius.circular(CalendarEventInformationWidgetStyles.borderRadius),
bottomRight: Radius.circular(CalendarEventInformationWidgetStyles.borderRadius)
)
),
color: Colors.white
),
clipBehavior: Clip.antiAlias,
padding: const EdgeInsets.all(CalendarEventInformationWidgetStyles.calendarInformationMargin),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
RichText(
text: TextSpan(
style: const TextStyle(
fontSize: CalendarEventInformationWidgetStyles.invitationMessageTextSize,
fontWeight: FontWeight.w500,
color: Colors.black
),
children: [
TextSpan(
text: calendarEvent.organizer?.name,
style: const TextStyle(
color: Colors.black,
fontSize: CalendarEventInformationWidgetStyles.invitationMessageTextSize,
fontWeight: FontWeight.w700
),
),
TextSpan(text: AppLocalizations.of(context).invitationMessageCalendarInformation)
]
)
),
const SizedBox(height: CalendarEventInformationWidgetStyles.space),
Text(
calendarEvent.title ?? '',
style: const TextStyle(
fontWeight: FontWeight.w500,
fontSize: CalendarEventInformationWidgetStyles.titleTextSize,
color: Colors.black
)
),
if (calendarEvent.dateTimeEventAsString.isNotEmpty)
Padding(
padding: const EdgeInsets.only(top: CalendarEventInformationWidgetStyles.fieldTopPadding),
child: EventTimeInformationWidget(timeEvent: calendarEvent.dateTimeEventAsString),
),
if (calendarEvent.location?.isNotEmpty == true)
Padding(
padding: const EdgeInsets.only(top: CalendarEventInformationWidgetStyles.fieldTopPadding),
child: EventLocationInformationWidget(locationEvent: calendarEvent.location!),
),
if (calendarEvent.participants?.isNotEmpty == true && calendarEvent.organizer != null)
Padding(
padding: const EdgeInsets.only(top: CalendarEventInformationWidgetStyles.fieldTopPadding),
child: EventAttendeeInformationWidget(
attendees: calendarEvent.participants!,
organizer: calendarEvent.organizer!,
),
),
],
),
)
],
)
: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
CalendarDateIconWidget(calendarEvent: calendarEvent),
Expanded(child: Container(
clipBehavior: Clip.antiAlias,
decoration: const ShapeDecoration(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.only(
topRight: Radius.circular(CalendarEventInformationWidgetStyles.borderRadius),
bottomRight: Radius.circular(CalendarEventInformationWidgetStyles.borderRadius)
)
),
color: Colors.white
),
padding: const EdgeInsets.all(CalendarEventInformationWidgetStyles.calendarInformationMargin),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
RichText(
text: TextSpan(
style: const TextStyle(
fontSize: CalendarEventInformationWidgetStyles.invitationMessageTextSize,
fontWeight: FontWeight.w500,
color: Colors.black
),
children: [
TextSpan(
text: calendarEvent.organizer?.name,
style: const TextStyle(
color: Colors.black,
fontSize: CalendarEventInformationWidgetStyles.invitationMessageTextSize,
fontWeight: FontWeight.w700
),
),
TextSpan(text: AppLocalizations.of(context).invitationMessageCalendarInformation)
]
)
),
const SizedBox(height: CalendarEventInformationWidgetStyles.space),
Text(
calendarEvent.title ?? '',
style: const TextStyle(
fontWeight: FontWeight.w500,
fontSize: CalendarEventInformationWidgetStyles.titleTextSize,
color: Colors.black
)
),
if (calendarEvent.dateTimeEventAsString.isNotEmpty)
Padding(
padding: const EdgeInsets.only(top: CalendarEventInformationWidgetStyles.fieldTopPadding),
child: EventTimeInformationWidget(timeEvent: calendarEvent.dateTimeEventAsString),
),
if (calendarEvent.location?.isNotEmpty == true)
Padding(
padding: const EdgeInsets.only(top: CalendarEventInformationWidgetStyles.fieldTopPadding),
child: EventLocationInformationWidget(locationEvent: calendarEvent.location!),
),
if (calendarEvent.participants?.isNotEmpty == true && calendarEvent.organizer != null)
Padding(
padding: const EdgeInsets.only(top: CalendarEventInformationWidgetStyles.fieldTopPadding),
child: EventAttendeeInformationWidget(
attendees: calendarEvent.participants!,
organizer: calendarEvent.organizer!,
),
),
],
),
))
],
),
);
}
}