From b5cb67157c664a7bccc06c0ad27c9ae3abdc41ce Mon Sep 17 00:00:00 2001 From: PH2 <1293456824@qq.com> Date: Mon, 26 Oct 2020 18:17:22 +0800 Subject: [PATCH] =?UTF-8?q?1=E3=80=81=E6=B6=88=E6=81=AF=E4=B8=AD=E5=BF=83?= =?UTF-8?q?=E7=9A=84=E5=AE=8C=E5=96=84=EF=BC=8C=E8=BF=98=E7=BC=BA=E5=85=AC?= =?UTF-8?q?=E5=85=B1=E8=B7=B3=E8=BD=AC=202=E3=80=81Android=20=E5=90=AF?= =?UTF-8?q?=E5=8A=A8=E4=BC=98=E5=8C=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../android/app/src/main/AndroidManifest.xml | 7 +- .../main/res/drawable/launch_background.xml | 2 +- .../main/res/drawable/normal_background.xml | 5 + .../app/src/main/res/values/styles.xml | 4 + .../bloc/message_notice_bloc.dart | 38 +- .../bloc/message_notice_repository.dart | 59 +- .../bloc/message_notice_state.dart | 12 +- .../message_notice_page.dart | 619 ++++++++++-------- .../message_notice_page_sk.dart | 58 ++ .../model/message_notice_data_model.dart | 121 ++++ .../model/message_notice_style_model.dart | 12 + lib/register.dart | 2 +- 12 files changed, 648 insertions(+), 291 deletions(-) create mode 100644 example/android/app/src/main/res/drawable/normal_background.xml create mode 100644 lib/pages/message_notice_page/message_notice_page_sk.dart create mode 100644 lib/pages/message_notice_page/model/message_notice_data_model.dart diff --git a/example/android/app/src/main/AndroidManifest.xml b/example/android/app/src/main/AndroidManifest.xml index 5c2c46e..b6bbd5d 100644 --- a/example/android/app/src/main/AndroidManifest.xml +++ b/example/android/app/src/main/AndroidManifest.xml @@ -39,12 +39,13 @@ - + - + diff --git a/example/android/app/src/main/res/drawable/normal_background.xml b/example/android/app/src/main/res/drawable/normal_background.xml new file mode 100644 index 0000000..e9b6c76 --- /dev/null +++ b/example/android/app/src/main/res/drawable/normal_background.xml @@ -0,0 +1,5 @@ + + + + + \ No newline at end of file diff --git a/example/android/app/src/main/res/values/styles.xml b/example/android/app/src/main/res/values/styles.xml index 00fa441..33fc5ee 100644 --- a/example/android/app/src/main/res/values/styles.xml +++ b/example/android/app/src/main/res/values/styles.xml @@ -5,4 +5,8 @@ Flutter draws its first frame --> @drawable/launch_background + + diff --git a/lib/pages/message_notice_page/bloc/message_notice_bloc.dart b/lib/pages/message_notice_page/bloc/message_notice_bloc.dart index c25a87f..48de94f 100644 --- a/lib/pages/message_notice_page/bloc/message_notice_bloc.dart +++ b/lib/pages/message_notice_page/bloc/message_notice_bloc.dart @@ -3,6 +3,7 @@ import 'dart:async'; import 'package:bloc/bloc.dart'; import 'package:equatable/equatable.dart'; import 'package:zhiying_base_widget/pages/message_notice_page/bloc/message_notice_repository.dart'; +import 'package:zhiying_base_widget/pages/message_notice_page/model/message_notice_data_model.dart'; import 'package:zhiying_base_widget/pages/message_notice_page/model/message_notice_style_model.dart'; import 'package:zhiying_comm/util/empty_util.dart'; import 'package:zhiying_comm/util/log/let_log.dart'; @@ -44,20 +45,43 @@ class MessageNoticeBloc extends Bloc { /// 初始化 Stream _mapInitEventToState(MessageNoticeInitEvent event) async* { var cacheStyle = await repository.fetchCachedStyle(); - if(!EmptyUtil.isEmpty(cacheStyle)){ - yield MessageNoticeLoadedState(cacheStyle); + if (!EmptyUtil.isEmpty(cacheStyle)) { + // yield MessageNoticeLoadedState(styleModel: cacheStyle); } var netStyle = await repository.fetchNetStyle(); - if(!EmptyUtil.isEmpty(netStyle)){ - yield MessageNoticeLoadedState(netStyle); + if (!EmptyUtil.isEmpty(netStyle)) { + // yield MessageNoticeLoadedState(styleModel: netStyle); Logger.log(netStyle.toJson().toString()); } - + var data = await repository.fetchInitData(); + if (!EmptyUtil.isEmpty(data) && (!EmptyUtil.isEmpty(netStyle) || !EmptyUtil.isEmpty(cacheStyle))) { + yield MessageNoticeLoadedState(dataModel: data, styleModel: !EmptyUtil.isEmpty(netStyle) ? netStyle : cacheStyle); + } else { + yield MessageNoticeInitErrorState(); + } } /// 下拉刷新 - Stream _mapOnRefreshEventToState(MessageNoticeOnRefreshEvent event) async* {} + Stream _mapOnRefreshEventToState(MessageNoticeOnRefreshEvent event) async* { + var style = repository.getStyleModel(); + var data = await repository.fetchRefreshData(); + if (!EmptyUtil.isEmpty(data)) { + yield MessageNoticeOnRefreshSuccessState(); + yield MessageNoticeLoadedState(styleModel: style, dataModel: data); + } else { + yield MessageNoticeOnRefreshErrorState(); + } + } /// 上拉更多 - Stream _mapOnLoadEventToState(MessageNoticeOnLoadEvent event) async* {} + Stream _mapOnLoadEventToState(MessageNoticeOnLoadEvent event) async* { + var style = repository.getStyleModel(); + var data = await repository.fetchLoadData(); + if (!EmptyUtil.isEmpty(data)) { + yield MessageNoticeOnLoadSuccessState(); + yield MessageNoticeLoadedState(styleModel: style, dataModel: data); + } else { + yield MessageNoticeOnLoadErrorState(); + } + } } diff --git a/lib/pages/message_notice_page/bloc/message_notice_repository.dart b/lib/pages/message_notice_page/bloc/message_notice_repository.dart index 05801b6..105f349 100644 --- a/lib/pages/message_notice_page/bloc/message_notice_repository.dart +++ b/lib/pages/message_notice_page/bloc/message_notice_repository.dart @@ -1,5 +1,6 @@ import 'dart:convert'; +import 'package:zhiying_base_widget/pages/message_notice_page/model/message_notice_data_model.dart'; import 'package:zhiying_base_widget/pages/message_notice_page/model/message_notice_style_model.dart'; import 'package:zhiying_comm/util/empty_util.dart'; import 'package:zhiying_comm/util/global_config.dart'; @@ -7,11 +8,28 @@ import 'package:zhiying_comm/util/log/let_log.dart'; import 'package:zhiying_comm/util/net_util.dart'; class MessageNoticeRepository { + String _type; + String _title; + final int _maxSize = 5; int _currentPage = 1; bool _hasMoreData = true; MessageNoticeStyleModel _styleModel; - List _oldData = []; + List _oldData = []; + + MessageNoticeRepository(final Map data) { + try { + _type = !EmptyUtil.isEmpty(data) ? data.containsKey('type') ? data['type'] : 'main' : 'main'; + _title = !EmptyUtil.isEmpty(data) ? data.containsKey('title') ? data['title'] : '消息中心' : '消息中心'; + } catch (e, s) { + _type = 'main'; + } + } + + /// 获取样式数据 + MessageNoticeStyleModel getStyleModel() { + return _styleModel; + } /// 样式初始化(获取网络) Future fetchNetStyle() async { @@ -21,6 +39,13 @@ class MessageNoticeRepository { var modListData = result[GlobalConfig.HTTP_RESPONSE_KEY_DATA]['mod_list'][0]['data']; if (!EmptyUtil.isEmpty(modListData)) { _styleModel = MessageNoticeStyleModel.fromJson(jsonDecode(modListData.toString())); + if (_type == 'main') { + _styleModel.isFist = true; + } else { + _styleModel.isFist = false; + } + _styleModel.styleType = _type; + _styleModel.styleTitle = _title ?? _styleModel.app_bar_name; return _styleModel; } } @@ -38,6 +63,13 @@ class MessageNoticeRepository { var modListData = result['mod_list'][0]['data']; if (!EmptyUtil.isEmpty(modListData)) { _styleModel = MessageNoticeStyleModel.fromJson(jsonDecode(modListData.toString())); + if (_type == 'main') { + _styleModel.isFist = true; + } else { + _styleModel.isFist = false; + } + _styleModel.styleType = _type; + _styleModel.styleTitle = _title ?? _styleModel.app_bar_name; return _styleModel; } } @@ -48,12 +80,12 @@ class MessageNoticeRepository { } /// 下拉刷新 - Future fetchRefreshData() async { + Future fetchRefreshData() async { return fetchInitData(); } /// 上拉更多 - Future fetchLoadData() async { + Future fetchLoadData() async { if (_hasMoreData) { return _baseRequest(); } @@ -61,7 +93,7 @@ class MessageNoticeRepository { } /// 数据初始化 - Future fetchInitData() async { + Future fetchInitData() async { _currentPage = 1; _hasMoreData = true; _oldData.clear(); @@ -69,8 +101,23 @@ class MessageNoticeRepository { } /// 基础请求 - Future _baseRequest() async { - try {} catch (e, s) { + Future _baseRequest() async { + try { + var result = await NetUtil.post('/api/v1/user/notice/$_type?page=${_currentPage.toString()}', method: NetMethod.GET); + if (NetUtil.isSuccess(result) && !EmptyUtil.isEmpty(result[GlobalConfig.HTTP_RESPONSE_KEY_DATA])) { + MessageNoticeDataModel dataModel = MessageNoticeDataModel.fromJson(result[GlobalConfig.HTTP_RESPONSE_KEY_DATA]); + if (!EmptyUtil.isEmpty(dataModel) && !EmptyUtil.isEmpty(dataModel.list)) { + // if (dataModel.list.length >= _maxSize) { + ++_currentPage; + _hasMoreData = true; + dataModel.list.insertAll(0, _oldData); + // } + _oldData.addAll(dataModel.list); + return dataModel; + } + } + _hasMoreData = false; + } catch (e, s) { Logger.error(e, s); } return null; diff --git a/lib/pages/message_notice_page/bloc/message_notice_state.dart b/lib/pages/message_notice_page/bloc/message_notice_state.dart index 4d1c23c..2d89f55 100644 --- a/lib/pages/message_notice_page/bloc/message_notice_state.dart +++ b/lib/pages/message_notice_page/bloc/message_notice_state.dart @@ -1,10 +1,10 @@ part of 'message_notice_bloc.dart'; -abstract class MessageNoticeState extends Equatable { +abstract class MessageNoticeState { const MessageNoticeState(); - @override - List get props => []; + // @override + // List get props => []; } class MessageNoticeInitial extends MessageNoticeState {} @@ -12,10 +12,11 @@ class MessageNoticeInitial extends MessageNoticeState {} /// 数据加载成功 class MessageNoticeLoadedState extends MessageNoticeState { MessageNoticeStyleModel styleModel; - MessageNoticeLoadedState(this.styleModel); + MessageNoticeDataModel dataModel; + MessageNoticeLoadedState({this.dataModel, this.styleModel}); @override - List get props => [this.styleModel]; + List get props => [this.styleModel, this.dataModel]; } /// 初始化失败 @@ -32,5 +33,6 @@ class MessageNoticeOnLoadErrorState extends MessageNoticeState {} /// 上拉更多成功 class MessageNoticeOnLoadSuccessState extends MessageNoticeState{} + /// 数据初始化加载失败 class MessageNoticeErrorState extends MessageNoticeState {} diff --git a/lib/pages/message_notice_page/message_notice_page.dart b/lib/pages/message_notice_page/message_notice_page.dart index be51db4..ef20ad4 100644 --- a/lib/pages/message_notice_page/message_notice_page.dart +++ b/lib/pages/message_notice_page/message_notice_page.dart @@ -4,9 +4,11 @@ import 'package:flutter_bloc/flutter_bloc.dart'; import 'package:pull_to_refresh/pull_to_refresh.dart'; import 'package:zhiying_base_widget/pages/message_notice_page/bloc/message_notice_bloc.dart'; import 'package:zhiying_base_widget/pages/message_notice_page/bloc/message_notice_repository.dart'; +import 'package:zhiying_base_widget/pages/message_notice_page/model/message_notice_data_model.dart'; import 'package:zhiying_base_widget/widgets/empty/empty_widget.dart'; import 'package:zhiying_comm/zhiying_comm.dart'; +import 'message_notice_page_sk.dart'; import 'model/message_notice_style_model.dart'; /// @@ -20,13 +22,17 @@ class MessageNoticePage extends StatelessWidget { @override Widget build(BuildContext context) { return BlocProvider( - create: (_) => MessageNoticeBloc(MessageNoticeRepository()), - child: _MessageNoticePageContainer(), + create: (_) => MessageNoticeBloc(MessageNoticeRepository(data)), + child: _MessageNoticePageContainer( + key: UniqueKey(), + ), ); } } class _MessageNoticePageContainer extends StatefulWidget { + _MessageNoticePageContainer({Key key}) : super(key: key); + @override __MessageNoticePageContainerState createState() => __MessageNoticePageContainerState(); } @@ -35,10 +41,25 @@ class __MessageNoticePageContainerState extends State<_MessageNoticePageContaine RefreshController _refreshController; /// 刷新 - void _onRefresh() async {} + void _onRefresh() async { + BlocProvider.of(context).add(MessageNoticeOnRefreshEvent()); + } /// 下拉更多 - void _onLoad() async {} + void _onLoad() async { + BlocProvider.of(context).add(MessageNoticeOnLoadEvent()); + } + + /// 子item点击事件 + void _onMainItemClick(MainNotificationStyleItem styleModel) { + /// 如果是消息中心，则重新打开页面加载 + Navigator.push(context, CupertinoPageRoute(builder: (_) => MessageNoticePage({'type': styleModel?.type, 'title': styleModel?.name}))); + } + + /// TODO 需要实现 子widget点击事件，公共跳转 + void _onItemClick(){ + + } @override void initState() { @@ -49,6 +70,12 @@ class __MessageNoticePageContainerState extends State<_MessageNoticePageContaine super.initState(); } + @override + void dispose() { + _refreshController?.dispose(); + super.dispose(); + } + @override Widget build(BuildContext context) { return BlocConsumer( @@ -87,7 +114,7 @@ class __MessageNoticePageContainerState extends State<_MessageNoticePageContaine builder: (context, state) { /// 数据加载成功 if (state is MessageNoticeLoadedState) { - return _buildDataListWidget(state?.styleModel); + return _buildDataListWidget(state?.styleModel, state?.dataModel); } /// 数据初始化失败 @@ -102,21 +129,52 @@ class __MessageNoticePageContainerState extends State<_MessageNoticePageContaine } /// 有数据 - Widget _buildDataListWidget(MessageNoticeStyleModel styleModel) { + Widget _buildDataListWidget(MessageNoticeStyleModel styleModel, MessageNoticeDataModel dataModel) { return Scaffold( - appBar: _buildAppBarWidget(), + appBar: _buildAppBarWidget(styleModel), body: SmartRefresher( controller: _refreshController, onRefresh: _onRefresh, onLoading: _onLoad, enablePullDown: true, - enablePullUp: true, + enablePullUp: styleModel.isFist ? false : true, child: ListView.builder( padding: const EdgeInsets.only(left: 12.5, right: 12.5, top: 8), - itemCount: styleModel?.main_notification?.list?.length ?? 0, + itemCount: dataModel?.list?.length ?? 0, itemBuilder: (context, index) { + /// 子视图的样式类型 + String styleType = styleModel?.styleType ?? 'main'; + MessageNoticeDataItemModel itemDataModel = !EmptyUtil.isEmpty(dataModel.list) ? dataModel.list[index] : null; + + /// 官方活动 + if (styleType == 'official_activity') { + return _buildOfficialActivitiesStyleWidget(styleModel?.official_activity, itemDataModel); + } + + ///官方通知 + if (styleType == 'official_notification') { + return _buildOfficialNoticeStyleWidget(styleModel?.official_notification, itemDataModel); + } + + /// 交易通知 + if (styleType == 'transaction_notification') { + return _buildTradeNoticeStyleWidget(styleModel?.transaction_notification, itemDataModel); + } + + /// 推广通知 + if (styleType == 'promotion_notification') { + return _buildPromoteNoticeStyleWidget(styleModel?.promotion_notification, itemDataModel); + } + + /// 反馈通知 + if (styleType == 'feedback_notification') { + return _buildFeedbackNoticeStyleWidget(styleModel?.feedback_notification, itemDataModel); + } + + /// 默认返回消息中心样式 return _buildMessageCenterStyleWidget( styleModel?.main_notification?.list[index], + dataModel.list[index], index, styleModel?.main_notification?.list?.length, styleModel?.main_notification?.unread_text_color, @@ -130,13 +188,14 @@ class __MessageNoticePageContainerState extends State<_MessageNoticePageContaine /// 没有数据 Widget _buildEmptyWidget() { return Scaffold( - appBar: _buildAppBarWidget(), + appBar: _buildAppBarWidget(null), body: SmartRefresher( controller: _refreshController, onRefresh: _onRefresh, enablePullDown: true, enablePullUp: false, child: ListView( + padding: const EdgeInsets.only(top: 30), children: [ EmptyWidget(), ], @@ -148,298 +207,325 @@ class __MessageNoticePageContainerState extends State<_MessageNoticePageContaine /// 骨架图 Widget _buildSkeletonWidget() { return Scaffold( - appBar: _buildAppBarWidget(), - body: Container(), + appBar: _buildAppBarWidget(null), + body: MessageNoticePageSkeleton(), ); } /// 消息中心样式 - Widget _buildMessageCenterStyleWidget(MainNotificationStyleItem styleModel, int index, int length, String unreadTextColor, String unreadBgColor) { + Widget _buildMessageCenterStyleWidget( + MainNotificationStyleItem styleModel, MessageNoticeDataItemModel dataModel, int index, int length, String unreadTextColor, String unreadBgColor) { var borderRadius = index == 0 ? BorderRadius.only(topLeft: Radius.circular(7.5), topRight: Radius.circular(7.5)) : index == length - 1 ? BorderRadius.only(bottomRight: Radius.circular(7.5), bottomLeft: Radius.circular(7.5)) : BorderRadius.only(); - return Container( - decoration: BoxDecoration(color: HexColor.fromHex(styleModel?.bg_color ?? '#FFFFFF'), borderRadius: borderRadius), - padding: const EdgeInsets.only(left: 15, right: 15, top: 16), - child: Column( - children: [ - Container( - height: 30, - width: double.infinity, - child: Row( + return GestureDetector( + behavior: HitTestBehavior.opaque, + onTap: () => _onMainItemClick(styleModel), + child: Container( + decoration: BoxDecoration(color: HexColor.fromHex(styleModel?.bg_color ?? '#FFFFFF'), borderRadius: borderRadius), + padding: const EdgeInsets.only(left: 15, right: 15, top: 16), + child: Column( + children: [ + Container( + height: 30, + width: double.infinity, + child: Row( + children: [ + _buildCustomerAvatarWidget(icon: styleModel?.icon, unreadBgColor: unreadBgColor, unreadTextColor: unreadTextColor, value: dataModel?.unread_count), + const SizedBox(width: 10), + Expanded( + child: Column( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + /// 官方活动 + Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + Text( + styleModel?.name ?? '官方活动', + style: TextStyle(color: HexColor.fromHex(styleModel?.name_color ?? '#333333'), fontWeight: FontWeight.bold, fontSize: 13), + ), + Text(dataModel?.date_time ?? '', style: TextStyle(color: HexColor.fromHex(styleModel?.time_color ?? '#D8D8D8'), fontSize: 12)), + ], + ), + Padding( + padding: const EdgeInsets.only(right: 22), + child: Text( + //'2020年6月23日4:00至6月30日4:00关闭提现aaa', + dataModel?.main_preview ?? '', + maxLines: 1, + overflow: TextOverflow.ellipsis, + style: TextStyle(color: HexColor.fromHex(styleModel?.value_color ?? '#999999'), fontSize: 12), + ), + ), + ], + ), + ) + ], + ), + ), + Padding(padding: const EdgeInsets.only(top: 14.5), child: Divider(height: 0.5, color: HexColor.fromHex('#EFEFEF'))) + ], + ), + ), + ); + } + + /// 官方通知样式 + Widget _buildOfficialNoticeStyleWidget(OfficialNotificationStyle styleModel, MessageNoticeDataItemModel dataModel) { + return GestureDetector( + onTap: ()=> _onItemClick(), + behavior: HitTestBehavior.opaque, + child: Container( + padding: const EdgeInsets.only(left: 15, right: 15, top: 12.5, bottom: 10), + margin: const EdgeInsets.only(bottom: 7.5), + decoration: BoxDecoration( + color: HexColor.fromHex(styleModel?.bg_color ?? '#FFFFFF'), + borderRadius: BorderRadius.circular(7.5), + ), + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Row( + crossAxisAlignment: CrossAxisAlignment.start, children: [ - _buildCustomerAvatarWidget(icon: styleModel?.icon, unreadBgColor: unreadBgColor, unreadTextColor: unreadTextColor), + _buildCustomerAvatarWidget(icon: styleModel?.icon), const SizedBox(width: 10), Expanded( child: Column( - mainAxisAlignment: MainAxisAlignment.spaceBetween, + crossAxisAlignment: CrossAxisAlignment.start, children: [ - /// 官方活动 - Row( - mainAxisAlignment: MainAxisAlignment.spaceBetween, - children: [ - Text( - styleModel?.name ?? '官方活动', - style: TextStyle(color: HexColor.fromHex(styleModel?.name_color ?? '#333333'), fontWeight: FontWeight.bold, fontSize: 13), - ), - Text('04-20 16:00', style: TextStyle(color: HexColor.fromHex(styleModel?.time_color ?? '#D8D8D8'), fontSize: 12)), - ], - ), - Padding( - padding: const EdgeInsets.only(right: 22), - child: Text( - '2020年6月23日4:00至6月30日4:00关闭提现aaa', - maxLines: 1, - overflow: TextOverflow.ellipsis, - style: TextStyle(color: HexColor.fromHex(styleModel?.value_color ?? '#999999'), fontSize: 12), - ), + /// 标题 + Text( + dataModel?.title ?? '', + style: TextStyle(color: HexColor.fromHex(styleModel?.title_value_color ?? '#333333'), fontSize: 14, fontWeight: FontWeight.bold), ), + const SizedBox(height: 5), + + /// 内容 + Text( + dataModel?.subtitle ?? '', + maxLines: 3, + overflow: TextOverflow.ellipsis, + style: TextStyle(color: HexColor.fromHex(styleModel?.message_value_color ?? '#999999'), fontSize: 11), + ) ], ), ) ], ), - ), - Padding(padding: const EdgeInsets.only(top: 14.5), child: Divider(height: 0.5, color: HexColor.fromHex('#EFEFEF'))) - ], - ), - ); - } - - /// 官方通知样式 - Widget _buildOfficialNoticeStyleWidget(OfficialNotificationStyle styleModel) { - return Container( - padding: const EdgeInsets.only(left: 15, right: 15, top: 12.5, bottom: 10), - margin: const EdgeInsets.only(bottom: 7.5), - decoration: BoxDecoration( - color: HexColor.fromHex(styleModel?.bg_color ?? '#FFFFFF'), - borderRadius: BorderRadius.circular(7.5), - ), - child: Column( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - Row( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - _buildCustomerAvatarWidget(icon: styleModel?.icon), - const SizedBox(width: 10), - Expanded( - child: Column( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - /// 标题 - Text( - '关于关闭提现功能通知', - style: TextStyle(color: HexColor.fromHex(styleModel?.title_value_color ?? '#333333'), fontSize: 14, fontWeight: FontWeight.bold), - ), - const SizedBox(height: 5), - - /// 内容 - Text( - '由于微信官方的限制，我们暂时将嗨如意小程序内的提现功能进行关闭并进行维护，关闭功能时间为2020年6月23日4:00至6月30日4:00，请谅解', - maxLines: 3, - overflow: TextOverflow.ellipsis, - style: TextStyle(color: HexColor.fromHex(styleModel?.message_value_color ?? '#999999'), fontSize: 11), - ) - ], - ), - ) - ], - ), - /// 时间 - Padding( - padding: const EdgeInsets.only(top: 16), - child: Text( - '2020-06-23 01:00:06', - style: TextStyle(color: HexColor.fromHex(styleModel?.time_color ?? '#D8D8D8'), fontSize: 11), - )) - ], + /// 时间 + Padding( + padding: const EdgeInsets.only(top: 16), + child: Text( + dataModel?.date_time ?? '', + style: TextStyle(color: HexColor.fromHex(styleModel?.time_color ?? '#D8D8D8'), fontSize: 11), + )) + ], + ), ), ); } /// 官方活动样式 - Widget _buildOfficialActivitiesStyleWidget(OfficialActivityStyle styleModel) { - return Container( - padding: const EdgeInsets.only(left: 15, right: 15, top: 12.5, bottom: 10), - margin: const EdgeInsets.only(bottom: 7.5), - decoration: BoxDecoration(borderRadius: BorderRadius.circular(7.5), color: HexColor.fromHex(styleModel?.bg_color ?? '#FFFFFF')), - child: Column( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - /// 标题 - Text( - '8.8淘宝会员节大促', - style: TextStyle(color: HexColor.fromHex(styleModel?.title_value_color ?? '#333333'), fontWeight: FontWeight.bold, fontSize: 14), - maxLines: 1, - overflow: TextOverflow.ellipsis, - ), - const SizedBox(height: 6), - - /// 图片海报 - ClipRRect( - borderRadius: BorderRadius.circular(7.5), - child: CachedNetworkImage( - imageUrl: 'http://ossq.izhyin.cn/index_carousel_1.png', - width: double.infinity, - )), - const SizedBox(height: 6.5), - - /// 活动内容 - Text( - '京东家电815周年庆，全场家电最低五折起，买一送一等超多优惠活动，点击查看活动详情', - maxLines: 2, - overflow: TextOverflow.ellipsis, - style: TextStyle(fontSize: 11, color: HexColor.fromHex(styleModel?.message_value_color ?? '#999999')), - ), + Widget _buildOfficialActivitiesStyleWidget(OfficialActivityStyle styleModel, MessageNoticeDataItemModel dataModel) { + return GestureDetector( + onTap: ()=> _onItemClick(), + behavior: HitTestBehavior.opaque, + child: Container( + padding: const EdgeInsets.only(left: 15, right: 15, top: 12.5, bottom: 10), + margin: const EdgeInsets.only(bottom: 7.5), + decoration: BoxDecoration(borderRadius: BorderRadius.circular(7.5), color: HexColor.fromHex(styleModel?.bg_color ?? '#FFFFFF')), + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + /// 标题 + Text( + dataModel?.title ?? '', + style: TextStyle(color: HexColor.fromHex(styleModel?.title_value_color ?? '#333333'), fontWeight: FontWeight.bold, fontSize: 14), + maxLines: 1, + overflow: TextOverflow.ellipsis, + ), + const SizedBox(height: 6), + + /// 图片海报 + ClipRRect( + borderRadius: BorderRadius.circular(7.5), + child: CachedNetworkImage( + imageUrl: dataModel?.img ?? '', + width: double.infinity, + )), + const SizedBox(height: 6.5), + + /// 活动内容 + Text( + dataModel?.subtitle ?? '', + maxLines: 2, + overflow: TextOverflow.ellipsis, + style: TextStyle(fontSize: 11, color: HexColor.fromHex(styleModel?.message_value_color ?? '#999999')), + ), - /// 时间 - const SizedBox(height: 7), - Text('2020-06-23 01:00:06', style: TextStyle(color: HexColor.fromHex(styleModel?.time_color ?? '#D8D8D8'), fontSize: 11)) - ], + /// 时间 + const SizedBox(height: 7), + Text(dataModel?.date_time ?? '', style: TextStyle(color: HexColor.fromHex(styleModel?.time_color ?? '#D8D8D8'), fontSize: 11)) + ], + ), ), ); } /// 交易通知样式 - Widget _buildTradeNoticeStyleWidget(TransactionNotificationStyle styleModel) { - return Container( - padding: const EdgeInsets.only(left: 15, right: 15, top: 12.5, bottom: 10), - margin: const EdgeInsets.only(bottom: 7.5), - decoration: BoxDecoration( - color: HexColor.fromHex(styleModel?.bg_color ?? '#FFFFFF'), - borderRadius: BorderRadius.circular(7.5), - ), - child: Column( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - Row( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - _buildCustomerAvatarWidget(icon: styleModel?.icon), - const SizedBox(width: 10), - Expanded( - child: Column( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - /// 标题 - Text('自购订单收益', style: TextStyle(color: HexColor.fromHex(styleModel?.title_value_color ?? '#333333'), fontSize: 14, fontWeight: FontWeight.bold)), - const SizedBox(height: 5), - - /// 内容 - _buildCustomerTradeContentWidget(styleModel), - ], - ), - ) - ], - ), + Widget _buildTradeNoticeStyleWidget(TransactionNotificationStyle styleModel, MessageNoticeDataItemModel dataModel) { + return GestureDetector( + onTap: ()=> _onItemClick(), + behavior: HitTestBehavior.opaque, + child: Container( + padding: const EdgeInsets.only(left: 15, right: 15, top: 12.5, bottom: 10), + margin: const EdgeInsets.only(bottom: 7.5), + decoration: BoxDecoration( + color: HexColor.fromHex(styleModel?.bg_color ?? '#FFFFFF'), + borderRadius: BorderRadius.circular(7.5), + ), + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Row( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + _buildCustomerAvatarWidget(icon: styleModel?.icon), + const SizedBox(width: 10), + Expanded( + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + /// 标题 + Text(dataModel?.title ?? '', style: TextStyle(color: HexColor.fromHex(styleModel?.title_value_color ?? '#333333'), fontSize: 14, fontWeight: FontWeight.bold)), + const SizedBox(height: 5), - /// 时间 - Padding( - padding: const EdgeInsets.only(top: 16), - child: Text('2020-06-23 01:00:06', style: TextStyle(color: HexColor.fromHex(styleModel?.time_color ?? '#D8D8D8'), fontSize: 11))) - ], + /// 内容 + _buildCustomerTradeContentWidget(styleModel, dataModel?.transactions), + ], + ), + ) + ], + ), + + /// 时间 + Padding( + padding: const EdgeInsets.only(top: 16), + child: Text(dataModel?.date_time ?? '', style: TextStyle(color: HexColor.fromHex(styleModel?.time_color ?? '#D8D8D8'), fontSize: 11))) + ], + ), ), ); } /// 推广通知样式 - Widget _buildPromoteNoticeStyleWidget(PromotionNotificationStyle styleModel) { - return Container( - padding: const EdgeInsets.only(left: 15, right: 15, top: 12.5, bottom: 10), - margin: const EdgeInsets.only(bottom: 7.5), - decoration: BoxDecoration( - color: HexColor.fromHex(styleModel?.bg_color ?? '#FFFFFF'), - borderRadius: BorderRadius.circular(7.5), - ), - child: Column( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - Row( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - _buildCustomerAvatarWidget(icon: styleModel?.icon), - const SizedBox(width: 10), - Expanded( - child: Column( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - /// 标题 - Text( - '新增直推粉丝', - style: TextStyle(color: HexColor.fromHex(styleModel?.title_value_color ?? '#333333'), fontSize: 14, fontWeight: FontWeight.bold), - ), - const SizedBox(height: 5), - - /// 内容 - Text( - '恭喜您成功邀请152****5887加入您的团队，快带领小伙伴走向致富之路吧！', - maxLines: 3, - overflow: TextOverflow.ellipsis, - style: TextStyle(color: HexColor.fromHex(styleModel?.message_value_color ?? '#999999'), fontSize: 11), - ) - ], - ), - ) - ], - ), + Widget _buildPromoteNoticeStyleWidget(PromotionNotificationStyle styleModel, MessageNoticeDataItemModel dataModel) { + return GestureDetector( + onTap: ()=> _onItemClick(), + behavior: HitTestBehavior.opaque, + child: Container( + padding: const EdgeInsets.only(left: 15, right: 15, top: 12.5, bottom: 10), + margin: const EdgeInsets.only(bottom: 7.5), + decoration: BoxDecoration( + color: HexColor.fromHex(styleModel?.bg_color ?? '#FFFFFF'), + borderRadius: BorderRadius.circular(7.5), + ), + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Row( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + _buildCustomerAvatarWidget(icon: styleModel?.icon), + const SizedBox(width: 10), + Expanded( + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + /// 标题 + Text( + dataModel?.title ?? '', + style: TextStyle(color: HexColor.fromHex(styleModel?.title_value_color ?? '#333333'), fontSize: 14, fontWeight: FontWeight.bold), + ), + const SizedBox(height: 5), + + /// 内容 + Text( + dataModel?.subtitle ?? '恭喜您成功邀请152****5887加入您的团队，快带领小伙伴走向致富之路吧！', + maxLines: 3, + overflow: TextOverflow.ellipsis, + style: TextStyle(color: HexColor.fromHex(styleModel?.message_value_color ?? '#999999'), fontSize: 11), + ) + ], + ), + ) + ], + ), - /// 时间 - Padding( - padding: const EdgeInsets.only(top: 16), - child: Text('2020-06-23 01:00:06', style: TextStyle(color: HexColor.fromHex(styleModel?.time_color ?? '#D8D8D8'), fontSize: 11))) - ], + /// 时间 + Padding( + padding: const EdgeInsets.only(top: 16), + child: Text(dataModel?.date_time ?? '', style: TextStyle(color: HexColor.fromHex(styleModel?.time_color ?? '#D8D8D8'), fontSize: 11))) + ], + ), ), ); } /// 反馈通知样式 - Widget _buildFeedbackNoticeStyleWidget(FeedbackNotificationStyle styleModel) { - return Container( - padding: const EdgeInsets.only(left: 15, right: 15, top: 14, bottom: 10), - margin: const EdgeInsets.only(bottom: 7.5), - decoration: BoxDecoration( - color: HexColor.fromHex(styleModel?.bg_color ?? '#FFFFFF'), - borderRadius: BorderRadius.circular(7.5), - ), - child: Column( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - Row( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - _buildCustomerAvatarWidget(icon: styleModel?.icon), - const SizedBox(width: 10), - Expanded( - child: Column( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - /// 标题 - Text('您的反馈有回复啦', style: TextStyle(color: HexColor.fromHex(styleModel?.title_value_color ?? '#333333'), fontSize: 14, fontWeight: FontWeight.bold)), - const SizedBox(height: 3), - - /// 内容 - Text('点击查看回复详情', - maxLines: 1, overflow: TextOverflow.ellipsis, style: TextStyle(color: HexColor.fromHex(styleModel?.message_value_color ?? '#999999'), fontSize: 11)) - ], - ), - ) - ], - ), + Widget _buildFeedbackNoticeStyleWidget(FeedbackNotificationStyle styleModel, MessageNoticeDataItemModel dataModel) { + return GestureDetector( + onTap: ()=> _onItemClick(), + behavior: HitTestBehavior.opaque, + child: Container( + padding: const EdgeInsets.only(left: 15, right: 15, top: 14, bottom: 10), + margin: const EdgeInsets.only(bottom: 7.5), + decoration: BoxDecoration( + color: HexColor.fromHex(styleModel?.bg_color ?? '#FFFFFF'), + borderRadius: BorderRadius.circular(7.5), + ), + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Row( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + _buildCustomerAvatarWidget(icon: styleModel?.icon), + const SizedBox(width: 10), + Expanded( + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + /// 标题 + Text(dataModel?.title ?? '', style: TextStyle(color: HexColor.fromHex(styleModel?.title_value_color ?? '#333333'), fontSize: 14, fontWeight: FontWeight.bold)), + const SizedBox(height: 3), - /// 时间 - Padding( - padding: const EdgeInsets.only(top: 16), - child: Text(styleModel?.time_color ?? '2020-06-23 01:00:06', style: TextStyle(color: HexColor.fromHex('#D8D8D8'), fontSize: 11))) - ], + /// 内容 + Text(dataModel?.subtitle ?? '', + maxLines: 1, overflow: TextOverflow.ellipsis, style: TextStyle(color: HexColor.fromHex(styleModel?.message_value_color ?? '#999999'), fontSize: 11)) + ], + ), + ) + ], + ), + + /// 时间 + Padding( + padding: const EdgeInsets.only(top: 16), + child: Text(dataModel?.date_time ?? '', style: TextStyle(color: HexColor.fromHex(styleModel?.time_color ?? '#D8D8D8'), fontSize: 11))) + ], + ), ), ); } /// APPBar - Widget _buildAppBarWidget() { + Widget _buildAppBarWidget(MessageNoticeStyleModel styleModel) { return AppBar( leading: IconButton( icon: Icon( @@ -450,11 +536,11 @@ class __MessageNoticePageContainerState extends State<_MessageNoticePageContaine onPressed: () => Navigator.maybePop(context), ), title: Text( - '消息中心', - style: TextStyle(color: HexColor.fromHex('#333333'), fontSize: 15, fontWeight: FontWeight.bold), + styleModel?.isFist ?? true ? styleModel?.app_bar_name ?? '消息中心' : styleModel?.styleTitle ?? '', + style: TextStyle(color: HexColor.fromHex(styleModel?.app_bar_name_color ?? '#333333'), fontSize: 15, fontWeight: FontWeight.bold), ), centerTitle: true, - backgroundColor: HexColor.fromHex('#FFFFFF'), + backgroundColor: HexColor.fromHex(styleModel?.app_bar_bg_color ?? '#FFFFFF'), elevation: 0, ); } @@ -477,7 +563,7 @@ class __MessageNoticePageContainerState extends State<_MessageNoticePageContaine ), ), Visibility( - visible: !EmptyUtil.isEmpty(value), + visible: !EmptyUtil.isEmpty(value) && value != '0', child: Transform.translate( offset: Offset(5, -4.5), child: Container( @@ -502,27 +588,24 @@ class __MessageNoticePageContainerState extends State<_MessageNoticePageContaine ); } - Widget _buildCustomerTradeContentWidget(TransactionNotificationStyle styleModel) { - Map datas = { - '订单编号：': '154547896541651464788', - '订单类型：': '京东', - '预估收益：': '8.00', - '下单时间：': '2020-08-14 11:35:39', - '预估结算：': '次月25日结算', - }; + Widget _buildCustomerTradeContentWidget(TransactionNotificationStyle styleModel, List transactions) { List lists = []; - datas.forEach((key, value) { + transactions.forEach((element) { + bool isearnings = (element?.type ?? '') == 'earnings'; lists.add(Padding( padding: const EdgeInsets.only(bottom: 5), child: RichText( textAlign: TextAlign.start, text: TextSpan(children: [ - TextSpan(text: key, style: TextStyle(fontSize: 11, color: HexColor.fromHex('#999999'))), - TextSpan(text: value, style: TextStyle(fontSize: 11, color: HexColor.fromHex('#999999'))), + TextSpan(text: element?.text ?? '', style: TextStyle(fontSize: 11, color: HexColor.fromHex( styleModel?.message_value_color ?? '#999999'))), + TextSpan(text: element?.data ?? '', style: TextStyle(fontSize: 11, color: HexColor.fromHex( isearnings ? + styleModel?.earnings ?? '#FF0100' + : styleModel?.message_value_color ?? '#999999'))), ]), ), )); }); + return Column( crossAxisAlignment: CrossAxisAlignment.start, children: lists, diff --git a/lib/pages/message_notice_page/message_notice_page_sk.dart b/lib/pages/message_notice_page/message_notice_page_sk.dart new file mode 100644 index 0000000..34130dd --- /dev/null +++ b/lib/pages/message_notice_page/message_notice_page_sk.dart @@ -0,0 +1,58 @@ +import 'package:shimmer/shimmer.dart'; +import 'package:flutter/material.dart'; + +class MessageNoticePageSkeleton extends StatelessWidget { + @override + Widget build(BuildContext context) { + return ListView.builder( + padding: const EdgeInsets.only(left: 12.5, right: 12.5, top: 8, bottom: 20), + itemBuilder: (context, index) { + return Container( + padding: const EdgeInsets.only(left: 15, right: 15, top: 12.5, bottom: 12.5), + margin: const EdgeInsets.only(bottom: 7.5), + decoration: BoxDecoration( + borderRadius: BorderRadius.circular(7.5), + color: Colors.white, + ), + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Row( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + // 头像 + _shimmerWidget(width: 40, height: 40, radius: 30), + const SizedBox(width: 10), + Expanded( + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + _shimmerWidget(width: 140, height: 18), + const SizedBox(height: 5), + _shimmerWidget(height: 30, width: double.infinity), + ], + ), + ) + ], + ), + + ], + ), + ); + }, + itemCount: 5, + ); + } + + Widget _shimmerWidget({double width, double height, double radius = 0}) { + return Shimmer.fromColors( + baseColor: Colors.grey[300], + highlightColor: Colors.grey[100], + child: Container( + width: width, + height: height, + decoration: BoxDecoration(color: Colors.white, borderRadius: BorderRadius.circular(radius)), + ), + ); + } +} diff --git a/lib/pages/message_notice_page/model/message_notice_data_model.dart b/lib/pages/message_notice_page/model/message_notice_data_model.dart new file mode 100644 index 0000000..b0c6426 --- /dev/null +++ b/lib/pages/message_notice_page/model/message_notice_data_model.dart @@ -0,0 +1,121 @@ +import 'dart:convert'; + +import 'package:zhiying_comm/util/empty_util.dart'; + +class MessageNoticeDataModel { + List list; + + MessageNoticeDataModel({this.list}); + + factory MessageNoticeDataModel.fromJson(Map json) { + return MessageNoticeDataModel( + list: json['list'] != null ? (json['list'] as List).map((i) => MessageNoticeDataItemModel.fromJson(i)).toList() : null, + ); + } + + Map toJson() { + final Map data = new Map(); + if (this.list != null) { + data['list'] = this.list.map((v) => v.toJson()).toList(); + } + return data; + } +} + +class MessageNoticeDataItemModel { + String unread_count; + String receiver; + String body; + String date_time; + String id; + String img; + String main_preview; + String oid; + String sender; + String status; + String subtitle; + String title; + String type; + List transactions; + + MessageNoticeDataItemModel({ + this.unread_count, + this.receiver, + this.body, + this.date_time, + this.id, + this.img, + this.main_preview, + this.oid, + this.sender, + this.status, + this.subtitle, + this.title, + this.type, + this.transactions, + }); + + factory MessageNoticeDataItemModel.fromJson(Map json) { + return MessageNoticeDataItemModel( + unread_count: json['unread_count']?.toString(), + receiver: json['receiver']?.toString(), + body: json['body']?.toString(), + date_time: json['date_time']?.toString(), + id: json['id']?.toString(), + img: json['img']?.toString(), + main_preview: json['main_preview']?.toString(), + oid: json['oid']?.toString(), + sender: json['sender']?.toString(), + status: json['status']?.toString(), + subtitle: json['subtitle']?.toString(), + title: json['title']?.toString(), + type: json['type']?.toString(), + transactions: + (!EmptyUtil.isEmpty(json['body']) && jsonDecode(json['body']) != null) ? (jsonDecode(json['body']) as List).map((e) => TransactionBodyItemModel.fromJson(e)).toList() : null, + ); + } + + Map toJson() { + final Map data = new Map(); + data['receiver'] = this.receiver; + data['body'] = this.body; + data['date_time'] = this.date_time; + data['id'] = this.id; + data['img'] = this.img; + data['main_preview'] = this.main_preview; + data['oid'] = this.oid; + data['sender'] = this.sender; + data['status'] = this.status; + data['subtitle'] = this.subtitle; + data['title'] = this.title; + data['type'] = this.type; + if (null != this.transactions) { + data['transactions'] = this.transactions.map((e) => e.toJson()).toList(); + } + return data; + } +} + +class TransactionBodyItemModel { + String data; + String text; + String type; + + TransactionBodyItemModel({this.data, this.text, this.type}); + + factory TransactionBodyItemModel.fromJson(Map json) { + return TransactionBodyItemModel( + data: json['data'], + text: json['text'], + type: json['type'], + ); + } + + Map toJson() { + final Map data = new Map(); + data['data'] = this.data; + data['text'] = this.text; + data['type'] = this.type; + return data; + } +} diff --git a/lib/pages/message_notice_page/model/message_notice_style_model.dart b/lib/pages/message_notice_page/model/message_notice_style_model.dart index 1a890ac..5e19417 100644 --- a/lib/pages/message_notice_page/model/message_notice_style_model.dart +++ b/lib/pages/message_notice_page/model/message_notice_style_model.dart @@ -1,4 +1,7 @@ class MessageNoticeStyleModel { + bool isFist; + String styleType; + String styleTitle; String app_bar_bg_color; String app_bar_bg_img; String app_bar_name; @@ -11,6 +14,9 @@ class MessageNoticeStyleModel { TransactionNotificationStyle transaction_notification; MessageNoticeStyleModel({ + this.isFist, + this.styleTitle, + this.styleType, this.app_bar_bg_color, this.app_bar_bg_img, this.app_bar_name, @@ -25,6 +31,9 @@ class MessageNoticeStyleModel { factory MessageNoticeStyleModel.fromJson(Map json) { return MessageNoticeStyleModel( + isFist: json['isFist'], + styleTitle: json['styleTitle'], + styleType: json['styleType'], app_bar_bg_color: json['app_bar_bg_color'], app_bar_bg_img: json['app_bar_bg_img'], app_bar_name: json['app_bar_name'], @@ -40,6 +49,9 @@ class MessageNoticeStyleModel { Map toJson() { final Map data = new Map(); + data['isFist'] = this.isFist; + data['styleTitle'] = this.styleTitle; + data['styleType'] = this.styleType; data['app_bar_bg_color'] = this.app_bar_bg_color; data['app_bar_bg_img'] = this.app_bar_bg_img; data['app_bar_name'] = this.app_bar_name; diff --git a/lib/register.dart b/lib/register.dart index c5879ca..8708633 100644 --- a/lib/register.dart +++ b/lib/register.dart @@ -153,7 +153,7 @@ class BaseWidgetRegister { /// 消息中心 PageFactory.regist( - 'pub.flutter.message_notice', (model) => MessageNoticePage(model)); + 'pub.flutter.message_center', (model) => MessageNoticePage(model)); } // 注册控件