1、人脉的实现

lib/pages/team_details_page/bloc/team_details_bloc.dart

@@ -2,20 +2,41 @@ import 'dart:async';
 
 import 'package:bloc/bloc.dart';
 import 'package:equatable/equatable.dart';
+import 'package:flutter/cupertino.dart';
+import 'package:zhiying_base_widget/pages/team_details_page/bloc/team_details_repository.dart';
+import 'package:zhiying_comm/util/empty_util.dart';
 
 part 'team_details_event.dart';
+
 part 'team_details_state.dart';
 
 class TeamDetailsBloc extends Bloc<TeamDetailsEvent, TeamDetailsState> {
   // TeamDetailsBloc() : super(TeamDetailsInitial());
+  @override
+  TeamDetailsState get initialState => TeamDetailsInitial();
+
+  TeamDetailsRepository repository;
+
+  TeamDetailsBloc({@required this.repository});
 
   @override
   Stream<TeamDetailsState> mapEventToState(
     TeamDetailsEvent event,
   ) async* {
-
+    /// 初始化数据
+    if (event is TeamDetailsInitEvent) {
+      yield* _mapInitEventToState(event);
+    }
   }
 
-  @override
-  TeamDetailsState get initialState => TeamDetailsInitial();
+  /// 初始化数据
+  Stream<TeamDetailsState> _mapInitEventToState(TeamDetailsInitEvent event) async* {
+    var cache = repository.fetchCacheData();
+    var result = repository.fetchNetData();
+    if (!EmptyUtil.isEmpty(result)) {
+      yield TeamDetailsLoadedState();
+    } else {
+      yield TeamDetailsErrorState();
+    }
+  }
 }

lib/pages/team_details_page/bloc/team_details_event.dart

@@ -2,4 +2,9 @@ part of 'team_details_bloc.dart';
 
 abstract class TeamDetailsEvent extends Equatable {
   const TeamDetailsEvent();
+  @override
+  List<Object> get props => [];
 }
+
+/// 初始化
+class TeamDetailsInitEvent extends TeamDetailsEvent{}

lib/pages/team_details_page/bloc/team_details_repository.dart

@@ -1,4 +1,15 @@
 
 class TeamDetailsRepository{
 
+  /// 初始化数据
+  Future<dynamic> fetchNetData() async{
+
+  }
+
+  /// 获取缓存数据
+  Future<dynamic> fetchCacheData() async{
+
+  }
+
+
 }

lib/pages/team_details_page/bloc/team_details_state.dart

@@ -2,9 +2,15 @@ part of 'team_details_bloc.dart';
 
 abstract class TeamDetailsState extends Equatable {
   const TeamDetailsState();
-}
 
-class TeamDetailsInitial extends TeamDetailsState {
   @override
   List<Object> get props => [];
 }
+
+class TeamDetailsInitial extends TeamDetailsState {}
+
+/// 数据加载成功
+class TeamDetailsLoadedState extends TeamDetailsState {}
+
+/// 数据加载失败
+class TeamDetailsErrorState extends TeamDetailsState {}

lib/pages/team_details_page/team_details_page.dart

@@ -1,7 +1,10 @@
 
 import 'package:flutter/material.dart';
+import 'package:tab_indicator_styler/tab_indicator_styler.dart';
+import 'package:zhiying_base_widget/widgets/team_details/month_data/team_details_month_data_widget.dart';
+import 'package:zhiying_base_widget/widgets/team_details/referrer/team_details_referrer_widget.dart';
 import 'package:zhiying_comm/zhiying_comm.dart';
-import 'package:zhiying_base_widget/widgets/team/fans/team_fans_item.dart';
+import 'package:zhiying_base_widget/widgets/team/fans_list/team_fans_item.dart';
 
 ///
 /// 我的团队 - 用户详情
@@ -17,6 +20,7 @@ class _TeamDetailsPageState extends State<TeamDetailsPage> {
     return _getMainWidget();
   }
 
+  TabController controller = TabController(length: 2, vsync: ScrollableState());
 
   /// 主视图
   Widget _getMainWidget(){
@@ -49,12 +53,61 @@ class _TeamDetailsPageState extends State<TeamDetailsPage> {
           ),
 
           /// TA的推荐人
+          SliverToBoxAdapter(
+            child: TeamDetailsReferrerWidget(),
+          ),
 
           /// 推荐人的信息
           SliverToBoxAdapter(
-            child: TeamFansItem(),
+            child: TeamFansItem(null, null),
           ),
 
+          /// 本月数据 & 上个月数据
+          SliverToBoxAdapter(
+            child: Container(
+              height: 30,
+              width: double.infinity,
+              margin: const EdgeInsets.only(left: 50, right: 50, top: 10),
+              child: TabBar(
+                labelStyle: TextStyle(fontSize: 15, fontWeight: FontWeight.bold),
+                indicatorColor: HexColor.fromHex('#F94B47'),
+                indicator: MaterialIndicator(
+                  height: 2,
+                  bottomRightRadius: 2,
+                  bottomLeftRadius: 2,
+                  topRightRadius: 2,
+                  topLeftRadius: 2,
+                  color: HexColor.fromHex('#F94B47'),
+                  horizontalPadding: 17
+                ),
+                unselectedLabelStyle: TextStyle(fontSize: 15 ),
+                indicatorSize: TabBarIndicatorSize.label,
+                labelColor: HexColor.fromHex('#000000'),
+                unselectedLabelColor: HexColor.fromHex('#999999'),
+                controller: controller,
+                tabs: <Widget>[
+                  Text('本月数据'),
+                  Text('上月数据'),
+                ],
+              ),
+            ),
+          ),
+
+          /// 邀请贡献
+          SliverToBoxAdapter(
+            child: TeamDetailsMonthDataWidget(),
+          ),
+
+          SliverToBoxAdapter(
+            child: TeamDetailsMonthDataWidget(),
+          ),
+
+          SliverToBoxAdapter(
+            child: TeamDetailsMonthDataWidget(),
+          ),
+
+          SliverPadding(padding: const EdgeInsets.only(bottom: 28))
+
         ],
       ),
     );

lib/pages/team_page/bloc/team_bloc.dart

@@ -2,13 +2,23 @@ import 'dart:async';
 
 import 'package:bloc/bloc.dart';
 import 'package:equatable/equatable.dart';
+import 'package:flutter/cupertino.dart';
+import 'package:zhiying_base_widget/pages/team_page/bloc/team_repository.dart';
+import 'package:zhiying_base_widget/pages/team_page/model/team_data_model.dart';
+import 'package:zhiying_base_widget/pages/team_page/model/team_style_model.dart';
+import 'package:zhiying_comm/zhiying_comm.dart';
 
 part 'team_event.dart';
+
 part 'team_state.dart';
 
 class TeamBloc extends Bloc<TeamEvent, TeamState> {
   // TeamBloc() : super(TeamInitial());
 
+  TeamRepository repository;
+
+  TeamBloc({@required this.repository});
+
   @override
   TeamState get initialState => TeamInitial();
 
@@ -17,9 +27,32 @@ class TeamBloc extends Bloc<TeamEvent, TeamState> {
     TeamEvent event,
   ) async* {
 
+    /// 初始化
+    if (event is TeamInitEvent) {
+      yield* _mapInitEventToState(event);
+    }
 
+  }
 
+  /// 初始化数据
+  Stream<TeamState> _mapInitEventToState(TeamInitEvent event) async* {
+    var cache = await repository.fetchCacheStyleData(event.data);
+    if (!EmptyUtil.isEmpty(cache)) {
+      yield TeamLoadedState(styleModel: cache);
+    }
+    var resultStyle = await repository.fetchNetStyleData(event.data);
+    if (!EmptyUtil.isEmpty(resultStyle)) {
+      yield TeamLoadedState(styleModel: resultStyle);
+    }
+    var resultData = await repository.fetchNetData();
+    if (!EmptyUtil.isEmpty(resultData) && (!EmptyUtil.isEmpty(resultStyle) || !EmptyUtil.isEmpty(cache))) {
+      Logger.log('================================================= load =================');
+      yield TeamLoadedState(dataModel: resultData, styleModel: !EmptyUtil.isEmpty(resultStyle) ? resultStyle : cache);
+    } else {
+      yield TeamErrorState();
+    }
   }
 
 
+
 }

lib/pages/team_page/bloc/team_event.dart

@@ -2,4 +2,25 @@ part of 'team_bloc.dart';
 
 abstract class TeamEvent extends Equatable {
   const TeamEvent();
+
+  @override
+  List<Object> get props => [];
+}
+
+/// 初始化数据
+class TeamInitEvent extends TeamEvent {
+  final Map<String, dynamic> data;
+
+  const TeamInitEvent(this.data);
+
+  @override
+  List<Object> get props => [this.data];
 }
+
+/// 关联推荐人
+class TeamRelateEvent extends TeamEvent{
+  final String inviteCode;
+  TeamRelateEvent(this.inviteCode);
+  @override
+  List<Object> get props => [this.inviteCode];
+}

lib/pages/team_page/bloc/team_repository.dart

@@ -1,4 +1,58 @@
+import 'dart:convert';
 
-class TeamRepository{
+import 'package:zhiying_base_widget/pages/team_page/model/team_data_model.dart';
+import 'package:zhiying_base_widget/pages/team_page/model/team_style_model.dart';
+import 'package:zhiying_comm/zhiying_comm.dart';
 
+class TeamRepository {
+  TeamStyleModel _styleModel;
+  TeamDataModel _dataModel;
+
+  /// 获取网络style
+  Future<dynamic> fetchNetStyleData(final Map<String, dynamic> data) async {
+    try {
+      var result = await NetUtil.post('/api/v1/mod/${data['skip_identifier']}', method: NetMethod.GET, cache: true);
+      if (NetUtil.isSuccess(result) && !EmptyUtil.isEmpty(result[GlobalConfig.HTTP_RESPONSE_KEY_DATA])) {
+        var modListData = result[GlobalConfig.HTTP_RESPONSE_KEY_DATA]['mod_list'][0]['data'];
+        if (!EmptyUtil.isEmpty(modListData)) {
+          _styleModel = TeamStyleModel.fromJson(jsonDecode(modListData.toString()));
+          return _styleModel;
+        }
+      }
+    } catch (e, s) {
+      Logger.log('e = $e, s = $s');
+    }
+    return null;
+  }
+
+  /// 获取网络数据
+  Future<TeamDataModel> fetchNetData() async {
+    var data = await NetUtil.post('/api/v1/user/myteam', method: NetMethod.GET);
+    try {
+      if (NetUtil.isSuccess(data) && !EmptyUtil.isEmpty(data[GlobalConfig.HTTP_RESPONSE_KEY_DATA])) {
+        _dataModel = TeamDataModel.fromJson(data[GlobalConfig.HTTP_RESPONSE_KEY_DATA]);
+        return _dataModel;
+      }
+    } catch (e, s) {
+      Logger.log('e = $e, s = $s');
+    }
+    return null;
+  }
+
+  /// 获取缓存的数据
+  Future<dynamic> fetchCacheStyleData(final Map<String, dynamic> data) async {
+    try {
+      var cache = await NetUtil.getRequestCachedData('/api/v1/mod/${data['skip_identifier']}');
+      if (!EmptyUtil.isEmpty(cache)) {
+        var modListData = cache['mod_list'][0]['data'];
+        if (!EmptyUtil.isEmpty(modListData)) {
+          _styleModel = TeamStyleModel.fromJson(jsonDecode(modListData.toString()));
+          return _styleModel;
+        }
+      }
+    } catch (e, s) {
+      Logger.log('e = $e, s = $s');
+    }
+    return null;
+  }
 }

lib/pages/team_page/bloc/team_state.dart

@@ -2,9 +2,24 @@ part of 'team_bloc.dart';
 
 abstract class TeamState extends Equatable {
   const TeamState();
+  @override
+  List<Object> get props => [];
 }
 
 class TeamInitial extends TeamState {
+}
+
+/// 数据加载成功
+class TeamLoadedState extends TeamState{
+  TeamStyleModel styleModel;
+  TeamDataModel dataModel;
+
+
+  TeamLoadedState({this.styleModel, this.dataModel});
+
   @override
-  List<Object> get props => [];
+  List<Object> get props => [this.dataModel, this.styleModel];
 }
+
+/// 数据加载失败
+class TeamErrorState extends TeamState{}

lib/pages/team_page/model/team_data_model.dart

@@ -0,0 +1,41 @@
+class TeamDataModel {
+    String all_fans;
+    String direct_fans_count;
+    String indirect_fans_count;
+    String referrer_invite_code;
+    String referrer_phone;
+    String referrer_username;
+    String referrer_wechat;
+    String today_add;
+    String yesterday_add;
+
+    TeamDataModel({this.all_fans, this.direct_fans_count, this.indirect_fans_count, this.referrer_invite_code, this.referrer_phone, this.referrer_username, this.referrer_wechat, this.today_add, this.yesterday_add});
+
+    factory TeamDataModel.fromJson(Map<String, dynamic> json) {
+        return TeamDataModel(
+            all_fans: json['all_fans'], 
+            direct_fans_count: json['direct_fans_count'], 
+            indirect_fans_count: json['indirect_fans_count'], 
+            referrer_invite_code: json['referrer_invite_code'], 
+            referrer_phone: json['referrer_phone'], 
+            referrer_username: json['referrer_username'], 
+            referrer_wechat: json['referrer_wechat'], 
+            today_add: json['today_add'], 
+            yesterday_add: json['yesterday_add'], 
+        );
+    }
+
+    Map<String, dynamic> toJson() {
+        final Map<String, dynamic> data = new Map<String, dynamic>();
+        data['all_fans'] = this.all_fans;
+        data['direct_fans_count'] = this.direct_fans_count;
+        data['indirect_fans_count'] = this.indirect_fans_count;
+        data['referrer_invite_code'] = this.referrer_invite_code;
+        data['referrer_phone'] = this.referrer_phone;
+        data['referrer_username'] = this.referrer_username;
+        data['referrer_wechat'] = this.referrer_wechat;
+        data['today_add'] = this.today_add;
+        data['yesterday_add'] = this.yesterday_add;
+        return data;
+    }
+}

lib/pages/team_page/model/team_style_model.dart

@@ -0,0 +1,605 @@
+class TeamStyleModel {
+  String appBarName;
+  String appBarNameColor;
+  String appBarBgImg;
+  String appBarBgColor;
+  String bgColor;
+  String headerNoReferrerTipText;
+  String headerNoReferrerTipTextColor;
+  String headerNoReferrerIntputText;
+  String headerNoReferrerIntputTextColor;
+  String headerNoReferrerBtnText;
+  String headerNoReferrerBtnTextColor;
+  String headerNoReferrerBtnBgColor;
+  String headerReferrerTitle;
+  String headerReferrerTitleColor;
+  String headerReferrerTitleBgColor;
+  String headerReferrerTitleBgColorT;
+  String headerReferrerUsernameColor;
+  String headerReferrerInvitecodeColor;
+  String headerReferrerPhoneColor;
+  String headerReferrerWxColor;
+  String headerReferrerCopyBtnText;
+  String headerReferrerCopyBtnTextColor;
+  String headerReferrerCopyBtnIcon;
+  String headerReferrerCopyBtnBgColor;
+  String dashbordLineColor;
+  List<DashbordRowFirst> dashbordRowFirst;
+  List<DashbordRowSecond> dashbordRowSecond;
+  String searchBarLeftIcon;
+  String searchBarRightIcon;
+  String searchBarHideText;
+  String searchBarHideTextColor;
+  String searchBarBgColor;
+  String searchBarBtnText;
+  String searchBarBtnTextColor;
+  String searchBarBtnBgColor;
+  String userLvTabsLineColor;
+  List<UserLvTabs> userLvTabs;
+  String teamViewEmptyImg;
+  List<TeamViewSortList> teamViewSortList;
+  List<TeamViewItemTitleList> teamViewItemTitleList;
+  TeamViewItem teamViewItem;
+
+  String headerNoReferrerInputColor;
+  String headerNoReferrerInputBgColor;
+  String headerReferrerInvitecodeText;
+  String headerReferrerPhoneText;
+  String headerReferrerWxText;
+
+  String userLvTabsNameColor;
+  String userLvTabsNameSelectedColor;
+
+  TeamStyleModel({
+    this.appBarName,
+    this.appBarNameColor,
+    this.appBarBgImg,
+    this.appBarBgColor,
+    this.bgColor,
+    this.headerNoReferrerTipText,
+    this.headerNoReferrerTipTextColor,
+    this.headerNoReferrerIntputText,
+    this.headerNoReferrerIntputTextColor,
+    this.headerNoReferrerBtnText,
+    this.headerNoReferrerBtnTextColor,
+    this.headerNoReferrerBtnBgColor,
+    this.headerReferrerTitle,
+    this.headerReferrerTitleColor,
+    this.headerReferrerTitleBgColor,
+    this.headerReferrerTitleBgColorT,
+    this.headerReferrerUsernameColor,
+    this.headerReferrerInvitecodeColor,
+    this.headerReferrerPhoneColor,
+    this.headerReferrerWxColor,
+    this.headerReferrerCopyBtnText,
+    this.headerReferrerCopyBtnTextColor,
+    this.headerReferrerCopyBtnIcon,
+    this.headerReferrerCopyBtnBgColor,
+    this.dashbordLineColor,
+    this.dashbordRowFirst,
+    this.dashbordRowSecond,
+    this.searchBarLeftIcon,
+    this.searchBarRightIcon,
+    this.searchBarHideText,
+    this.searchBarHideTextColor,
+    this.searchBarBgColor,
+    this.searchBarBtnText,
+    this.searchBarBtnTextColor,
+    this.searchBarBtnBgColor,
+    this.userLvTabsLineColor,
+    this.userLvTabs,
+    this.teamViewEmptyImg,
+    this.teamViewSortList,
+    this.teamViewItemTitleList,
+    this.teamViewItem,
+    this.headerNoReferrerInputColor,
+    this.headerNoReferrerInputBgColor,
+    this.headerReferrerInvitecodeText,
+    this.headerReferrerPhoneText,
+    this.headerReferrerWxText,
+    this.userLvTabsNameColor,
+    this.userLvTabsNameSelectedColor,
+  });
+
+  TeamStyleModel.fromJson(Map<String, dynamic> json) {
+    appBarName = json['app_bar_name'];
+    appBarNameColor = json['app_bar_name_color'];
+    appBarBgImg = json['app_bar_bg_img'];
+    appBarBgColor = json['app_bar_bg_color'];
+    bgColor = json['bg_color'];
+    headerNoReferrerTipText = json['header_no_referrer_tip_text'];
+    headerNoReferrerTipTextColor = json['header_no_referrer_tip_text_color'];
+    headerNoReferrerIntputText = json['header_no_referrer_intput_text'];
+    headerNoReferrerIntputTextColor = json['header_no_referrer_intput_text_color'];
+    headerNoReferrerBtnText = json['header_no_referrer_btn_text'];
+    headerNoReferrerBtnTextColor = json['header_no_referrer_btn_text_color'];
+    headerNoReferrerBtnBgColor = json['header_no_referrer_btn_bg_color'];
+    headerReferrerTitle = json['header_referrer_title'];
+    headerReferrerTitleColor = json['header_referrer_title_color'];
+    headerReferrerTitleBgColor = json['header_referrer_title_bg_color'];
+    headerReferrerTitleBgColorT = json['header_referrer_title_bg_color_t'];
+    headerReferrerUsernameColor = json['header_referrer_username_color'];
+    headerReferrerInvitecodeColor = json['header_referrer_invitecode_color'];
+    headerReferrerPhoneColor = json['header_referrer_phone_color'];
+    headerReferrerWxColor = json['header_referrer_wx_color'];
+    headerReferrerCopyBtnText = json['header_referrer_copy_btn_text'];
+    headerReferrerCopyBtnTextColor = json['header_referrer_copy_btn_text_color'];
+    headerReferrerCopyBtnIcon = json['header_referrer_copy_btn_icon'];
+    headerReferrerCopyBtnBgColor = json['header_referrer_copy_btn_bg_color'];
+    dashbordLineColor = json['dashbord_line_color'];
+    if (json['dashbord_row_first'] != null) {
+      dashbordRowFirst = new List<DashbordRowFirst>();
+      json['dashbord_row_first'].forEach((v) {
+        dashbordRowFirst.add(new DashbordRowFirst.fromJson(v));
+      });
+    }
+    if (json['dashbord_row_second'] != null) {
+      dashbordRowSecond = new List<DashbordRowSecond>();
+      json['dashbord_row_second'].forEach((v) {
+        dashbordRowSecond.add(new DashbordRowSecond.fromJson(v));
+      });
+    }
+    searchBarLeftIcon = json['search_bar_left_icon'];
+    searchBarRightIcon = json['search_bar_right_icon'];
+    searchBarHideText = json['search_bar_hide_text'];
+    searchBarHideTextColor = json['search_bar_hide_text_color'];
+    searchBarBgColor = json['search_bar_bg_color'];
+    searchBarBtnText = json['search_bar_btn_text'];
+    searchBarBtnTextColor = json['search_bar_btn_text_color'];
+    searchBarBtnBgColor = json['search_bar_btn_bg_color'];
+    userLvTabsLineColor = json['user_lv_tabs_line_color'];
+    if (json['user_lv_tabs'] != null) {
+      userLvTabs = new List<UserLvTabs>();
+      json['user_lv_tabs'].forEach((v) {
+        userLvTabs.add(new UserLvTabs.fromJson(v));
+      });
+    }
+    teamViewEmptyImg = json['team_view_empty_img'];
+    if (json['team_view_sort_list'] != null) {
+      teamViewSortList = new List<TeamViewSortList>();
+      json['team_view_sort_list'].forEach((v) {
+        teamViewSortList.add(new TeamViewSortList.fromJson(v));
+      });
+    }
+    if (json['team_view_item_title_list'] != null) {
+      teamViewItemTitleList = new List<TeamViewItemTitleList>();
+      json['team_view_item_title_list'].forEach((v) {
+        teamViewItemTitleList.add(new TeamViewItemTitleList.fromJson(v));
+      });
+    }
+    teamViewItem = json['team_view_item'] != null ? new TeamViewItem.fromJson(json['team_view_item']) : null;
+    headerNoReferrerInputColor = json['header_no_referrer_intput_color'];
+    headerNoReferrerInputBgColor = json['header_no_referrer_intput_bg_color'];
+    headerReferrerInvitecodeText = json['header_referrer_invitecode_text'];
+    headerReferrerPhoneText = json['header_referrer_phone_text'];
+    headerReferrerWxText = json['header_referrer_wx_text'];
+    userLvTabsNameColor = json['user_lv_tabs_name_color'];
+    userLvTabsNameSelectedColor = json['user_lv_tabs_name_selected_color'];
+  }
+
+  Map<String, dynamic> toJson() {
+    final Map<String, dynamic> data = new Map<String, dynamic>();
+    data['app_bar_name'] = this.appBarName;
+    data['app_bar_name_color'] = this.appBarNameColor;
+    data['app_bar_bg_img'] = this.appBarBgImg;
+    data['app_bar_bg_color'] = this.appBarBgColor;
+    data['bg_color'] = this.bgColor;
+    data['header_no_referrer_tip_text'] = this.headerNoReferrerTipText;
+    data['header_no_referrer_tip_text_color'] = this.headerNoReferrerTipTextColor;
+    data['header_no_referrer_intput_text'] = this.headerNoReferrerIntputText;
+    data['header_no_referrer_intput_text_color'] = this.headerNoReferrerIntputTextColor;
+    data['header_no_referrer_btn_text'] = this.headerNoReferrerBtnText;
+    data['header_no_referrer_btn_text_color'] = this.headerNoReferrerBtnTextColor;
+    data['header_no_referrer_btn_bg_color'] = this.headerNoReferrerBtnBgColor;
+    data['header_referrer_title'] = this.headerReferrerTitle;
+    data['header_referrer_title_color'] = this.headerReferrerTitleColor;
+    data['header_referrer_title_bg_color'] = this.headerReferrerTitleBgColor;
+    data['header_referrer_title_bg_color_t'] = this.headerReferrerTitleBgColorT;
+    data['header_referrer_username_color'] = this.headerReferrerUsernameColor;
+    data['header_referrer_invitecode_color'] = this.headerReferrerInvitecodeColor;
+    data['header_referrer_phone_color'] = this.headerReferrerPhoneColor;
+    data['header_referrer_wx_color'] = this.headerReferrerWxColor;
+    data['header_referrer_copy_btn_text'] = this.headerReferrerCopyBtnText;
+    data['header_referrer_copy_btn_text_color'] = this.headerReferrerCopyBtnTextColor;
+    data['header_referrer_copy_btn_icon'] = this.headerReferrerCopyBtnIcon;
+    data['header_referrer_copy_btn_bg_color'] = this.headerReferrerCopyBtnBgColor;
+    data['dashbord_line_color'] = this.dashbordLineColor;
+    if (this.dashbordRowFirst != null) {
+      data['dashbord_row_first'] = this.dashbordRowFirst.map((v) => v.toJson()).toList();
+    }
+    if (this.dashbordRowSecond != null) {
+      data['dashbord_row_second'] = this.dashbordRowSecond.map((v) => v.toJson()).toList();
+    }
+    data['search_bar_left_icon'] = this.searchBarLeftIcon;
+    data['search_bar_right_icon'] = this.searchBarRightIcon;
+    data['search_bar_hide_text'] = this.searchBarHideText;
+    data['search_bar_hide_text_color'] = this.searchBarHideTextColor;
+    data['search_bar_bg_color'] = this.searchBarBgColor;
+    data['search_bar_btn_text'] = this.searchBarBtnText;
+    data['search_bar_btn_text_color'] = this.searchBarBtnTextColor;
+    data['search_bar_btn_bg_color'] = this.searchBarBtnBgColor;
+    data['user_lv_tabs_line_color'] = this.userLvTabsLineColor;
+    if (this.userLvTabs != null) {
+      data['user_lv_tabs'] = this.userLvTabs.map((v) => v.toJson()).toList();
+    }
+    data['team_view_empty_img'] = this.teamViewEmptyImg;
+    if (this.teamViewSortList != null) {
+      data['team_view_sort_list'] = this.teamViewSortList.map((v) => v.toJson()).toList();
+    }
+    if (this.teamViewItemTitleList != null) {
+      data['team_view_item_title_list'] = this.teamViewItemTitleList.map((v) => v.toJson()).toList();
+    }
+    if (this.teamViewItem != null) {
+      data['team_view_item'] = this.teamViewItem.toJson();
+    }
+    data['header_no_referrer_intput_color'] = this.headerNoReferrerInputColor;
+    data['header_no_referrer_intput_bg_color'] = this.headerNoReferrerInputBgColor;
+    data['header_referrer_invitecode_text'] = this.headerReferrerInvitecodeText;
+    data['header_referrer_phone_text'] = this.headerReferrerPhoneText;
+    data['header_referrer_wx_text'] = this.headerReferrerWxText;
+    data['user_lv_tabs_name_color'] = this.userLvTabsNameColor;
+    data['user_lv_tabs_name_selected_color'] = this.userLvTabsNameSelectedColor;
+    return data;
+  }
+}
+
+class DashbordRowFirst {
+  String name;
+  String nameColor;
+  String valueColor;
+  String valueKey;
+  String upIcon;
+  String bgColor;
+
+  DashbordRowFirst({this.name, this.nameColor, this.valueColor, this.valueKey, this.upIcon, this.bgColor});
+
+  DashbordRowFirst.fromJson(Map<String, dynamic> json) {
+    name = json['name'];
+    nameColor = json['name_color'];
+    valueColor = json['value_color'];
+    valueKey = json['value_key'];
+    upIcon = json['up_icon'];
+    bgColor = json['bg_color'];
+  }
+
+  Map<String, dynamic> toJson() {
+    final Map<String, dynamic> data = new Map<String, dynamic>();
+    data['name'] = this.name;
+    data['name_color'] = this.nameColor;
+    data['value_color'] = this.valueColor;
+    data['value_key'] = this.valueKey;
+    data['up_icon'] = this.upIcon;
+    data['bg_color'] = this.bgColor;
+    return data;
+  }
+}
+
+class DashbordRowSecond {
+  String bg_color;
+  String name;
+  String name_color;
+  String up_icon;
+  String value_color;
+  String value_key;
+
+  DashbordRowSecond({this.bg_color, this.name, this.name_color, this.up_icon, this.value_color, this.value_key});
+
+  factory DashbordRowSecond.fromJson(Map<String, dynamic> json) {
+    return DashbordRowSecond(
+      bg_color: json['bg_color'],
+      name: json['name'],
+      name_color: json['name_color'],
+      up_icon: json['up_icon'],
+      value_color: json['value_color'],
+      value_key: json['value_key'],
+    );
+  }
+
+  Map<String, dynamic> toJson() {
+    final Map<String, dynamic> data = new Map<String, dynamic>();
+    data['bg_color'] = this.bg_color;
+    data['name'] = this.name;
+    data['name_color'] = this.name_color;
+    data['up_icon'] = this.up_icon;
+    data['value_color'] = this.value_color;
+    data['value_key'] = this.value_key;
+    return data;
+  }
+}
+
+class UserLvTabs {
+  String name;
+  String nameColor;
+  String nameSelectedColor;
+  String type;
+
+  UserLvTabs({this.name, this.nameColor, this.nameSelectedColor, this.type});
+
+  UserLvTabs.fromJson(Map<String, dynamic> json) {
+    name = json['name'];
+    nameColor = json['name_color'];
+    nameSelectedColor = json['name_selected_color'];
+    type = json['type'];
+  }
+
+  Map<String, dynamic> toJson() {
+    final Map<String, dynamic> data = new Map<String, dynamic>();
+    data['name'] = this.name;
+    data['name_color'] = this.nameColor;
+    data['name_selected_color'] = this.nameSelectedColor;
+    data['type'] = this.type;
+    return data;
+  }
+}
+
+class TeamViewSortList {
+  String name;
+  String type;
+  String nameColor;
+  String nameSelectedColor;
+  String icon1;
+  String icon2;
+  String icon3;
+  List<Args> args;
+  bool isSelect = false;
+  int selectState = 0;
+
+  void updateSelectState() {
+    selectState++;
+    if (selectState > 2) {
+      selectState = 0;
+    }
+  }
+
+  TeamViewSortList({this.name, this.type, this.nameColor, this.icon1, this.icon2, this.icon3, this.args, this.nameSelectedColor});
+
+  TeamViewSortList.fromJson(Map<String, dynamic> json) {
+    name = json['name'];
+    type = json['type'];
+    nameColor = json['name_color'];
+    icon1 = json['icon_1'];
+    icon2 = json['icon_2'];
+    icon3 = json['icon_3'];
+    if (json['args'] != null) {
+      args = new List<Args>();
+      json['args'].forEach((v) {
+        args.add(new Args.fromJson(v));
+      });
+    }
+    nameSelectedColor = json['name_selected_color'];
+  }
+
+  Map<String, dynamic> toJson() {
+    final Map<String, dynamic> data = new Map<String, dynamic>();
+    data['name'] = this.name;
+    data['type'] = this.type;
+    data['name_color'] = this.nameColor;
+    data['icon_1'] = this.icon1;
+    data['icon_2'] = this.icon2;
+    data['icon_3'] = this.icon3;
+    if (this.args != null) {
+      data['args'] = this.args.map((v) => v.toJson()).toList();
+    }
+    data['name_selected_color'] = this.nameSelectedColor;
+    return data;
+  }
+}
+
+class Args {
+  String id;
+  String queryArgs;
+  String name;
+
+  Args({this.id, this.queryArgs, this.name});
+
+  Args.fromJson(Map<String, dynamic> json) {
+    id = json['id'];
+    queryArgs = json['query_args'];
+    name = json['name'];
+  }
+
+  Map<String, dynamic> toJson() {
+    final Map<String, dynamic> data = new Map<String, dynamic>();
+    data['id'] = this.id;
+    data['query_args'] = this.queryArgs;
+    data['name'] = this.name;
+    return data;
+  }
+}
+
+class TeamViewItemTitleList {
+  String text;
+  String unitText;
+  String textColor;
+  String valueColor;
+  String valueKey;
+
+  TeamViewItemTitleList({this.text, this.unitText, this.textColor, this.valueColor, this.valueKey});
+
+  TeamViewItemTitleList.fromJson(Map<String, dynamic> json) {
+    text = json['text'];
+    unitText = json['unit_text'];
+    textColor = json['text_color'];
+    valueColor = json['value_color'];
+    valueKey = json['value_key'];
+  }
+
+  Map<String, dynamic> toJson() {
+    final Map<String, dynamic> data = new Map<String, dynamic>();
+    data['text'] = this.text;
+    data['unit_text'] = this.unitText;
+    data['text_color'] = this.textColor;
+    data['value_color'] = this.valueColor;
+    data['value_key'] = this.valueKey;
+    return data;
+  }
+}
+
+class TeamViewItem {
+  String lvTextColor;
+  String lvBgColor;
+  String lvBgImg;
+  String isLvBgImg;
+  String directText;
+  String directTextColor;
+  String directTextBgColor;
+  String indirectText;
+  String indirectTextColor;
+  String indirectTextBgColor;
+  String usernameColor;
+  String phooneText;
+  String phoneColor;
+  String phoneCopyIcon;
+  String infoBarColor;
+  String infoBarWxText;
+  String infoBarWxTextColor;
+  String infoBarWxValueColor;
+  String infoBarLastLoginText;
+  String infoBarLastLoginTextColor;
+  String infoBarLastLoginValueColor;
+  String totalInviteText;
+  String totalInviteTextColor;
+  String totalInviteValueColor;
+  String totalEarningText;
+  String totalEarningTextColor;
+  String totalEarningValueColor;
+  String todayInviteText;
+  String todayInviteTextColor;
+  String todayInviteValueColor;
+  String monthInviteText;
+  String monthInviteTextColor;
+  String monthInviteValueColor;
+  String weekEarningText;
+  String weekEarningTextColor;
+  String weekEarningValueColor;
+  String monthEarningText;
+  String monthEarningTextColor;
+  String monthEarningValueColor;
+
+  TeamViewItem(
+      {this.lvTextColor,
+      this.lvBgColor,
+      this.lvBgImg,
+      this.isLvBgImg,
+      this.directText,
+      this.directTextColor,
+      this.directTextBgColor,
+      this.indirectText,
+      this.indirectTextColor,
+      this.indirectTextBgColor,
+      this.usernameColor,
+      this.phooneText,
+      this.phoneColor,
+      this.phoneCopyIcon,
+      this.infoBarColor,
+      this.infoBarWxText,
+      this.infoBarWxTextColor,
+      this.infoBarWxValueColor,
+      this.infoBarLastLoginText,
+      this.infoBarLastLoginTextColor,
+      this.infoBarLastLoginValueColor,
+      this.totalInviteText,
+      this.totalInviteTextColor,
+      this.totalInviteValueColor,
+      this.totalEarningText,
+      this.totalEarningTextColor,
+      this.totalEarningValueColor,
+      this.todayInviteText,
+      this.todayInviteTextColor,
+      this.todayInviteValueColor,
+      this.monthInviteText,
+      this.monthInviteTextColor,
+      this.monthInviteValueColor,
+      this.weekEarningText,
+      this.weekEarningTextColor,
+      this.weekEarningValueColor,
+      this.monthEarningText,
+      this.monthEarningTextColor,
+      this.monthEarningValueColor});
+
+  TeamViewItem.fromJson(Map<String, dynamic> json) {
+    lvTextColor = json['lv_text_color'];
+    lvBgColor = json['lv_bg_color'];
+    lvBgImg = json['lv_bg_img'];
+    isLvBgImg = json['is_lv_bg_img'];
+    directText = json['direct_text'];
+    directTextColor = json['direct_text_color'];
+    directTextBgColor = json['direct_text_bg_color'];
+    indirectText = json['indirect_text'];
+    indirectTextColor = json['indirect_text_color'];
+    indirectTextBgColor = json['indirect_text_bg_color'];
+    usernameColor = json['username_color'];
+    phooneText = json['phoone_text'];
+    phoneColor = json['phone_color'];
+    phoneCopyIcon = json['phone_copy_icon'];
+    infoBarColor = json['info_bar_color'];
+    infoBarWxText = json['info_bar_wx_text'];
+    infoBarWxTextColor = json['info_bar_wx_text_color'];
+    infoBarWxValueColor = json['info_bar_wx_value_color'];
+    infoBarLastLoginText = json['info_bar_last_login_text'];
+    infoBarLastLoginTextColor = json['info_bar_last_login_text_color'];
+    infoBarLastLoginValueColor = json['info_bar_last_login_value_color'];
+    totalInviteText = json['total_invite_text'];
+    totalInviteTextColor = json['total_invite_text_color'];
+    totalInviteValueColor = json['total_invite_value_color'];
+    totalEarningText = json['total_earning_text'];
+    totalEarningTextColor = json['total_earning_text_color'];
+    totalEarningValueColor = json['total_earning_value_color'];
+    todayInviteText = json['today_invite_text'];
+    todayInviteTextColor = json['today_invite_text_color'];
+    todayInviteValueColor = json['today_invite_value_color'];
+    monthInviteText = json['month_invite_text'];
+    monthInviteTextColor = json['month_invite_text_color'];
+    monthInviteValueColor = json['month_invite_value_color'];
+    weekEarningText = json['week_earning_text'];
+    weekEarningTextColor = json['week_earning_text_color'];
+    weekEarningValueColor = json['week_earning_value_color'];
+    monthEarningText = json['month_earning_text'];
+    monthEarningTextColor = json['month_earning_text_color'];
+    monthEarningValueColor = json['month_earning_value_color'];
+  }
+
+  Map<String, dynamic> toJson() {
+    final Map<String, dynamic> data = new Map<String, dynamic>();
+    data['lv_text_color'] = this.lvTextColor;
+    data['lv_bg_color'] = this.lvBgColor;
+    data['lv_bg_img'] = this.lvBgImg;
+    data['is_lv_bg_img'] = this.isLvBgImg;
+    data['direct_text'] = this.directText;
+    data['direct_text_color'] = this.directTextColor;
+    data['direct_text_bg_color'] = this.directTextBgColor;
+    data['indirect_text'] = this.indirectText;
+    data['indirect_text_color'] = this.indirectTextColor;
+    data['indirect_text_bg_color'] = this.indirectTextBgColor;
+    data['username_color'] = this.usernameColor;
+    data['phoone_text'] = this.phooneText;
+    data['phone_color'] = this.phoneColor;
+    data['phone_copy_icon'] = this.phoneCopyIcon;
+    data['info_bar_color'] = this.infoBarColor;
+    data['info_bar_wx_text'] = this.infoBarWxText;
+    data['info_bar_wx_text_color'] = this.infoBarWxTextColor;
+    data['info_bar_wx_value_color'] = this.infoBarWxValueColor;
+    data['info_bar_last_login_text'] = this.infoBarLastLoginText;
+    data['info_bar_last_login_text_color'] = this.infoBarLastLoginTextColor;
+    data['info_bar_last_login_value_color'] = this.infoBarLastLoginValueColor;
+    data['total_invite_text'] = this.totalInviteText;
+    data['total_invite_text_color'] = this.totalInviteTextColor;
+    data['total_invite_value_color'] = this.totalInviteValueColor;
+    data['total_earning_text'] = this.totalEarningText;
+    data['total_earning_text_color'] = this.totalEarningTextColor;
+    data['total_earning_value_color'] = this.totalEarningValueColor;
+    data['today_invite_text'] = this.todayInviteText;
+    data['today_invite_text_color'] = this.todayInviteTextColor;
+    data['today_invite_value_color'] = this.todayInviteValueColor;
+    data['month_invite_text'] = this.monthInviteText;
+    data['month_invite_text_color'] = this.monthInviteTextColor;
+    data['month_invite_value_color'] = this.monthInviteValueColor;
+    data['week_earning_text'] = this.weekEarningText;
+    data['week_earning_text_color'] = this.weekEarningTextColor;
+    data['week_earning_value_color'] = this.weekEarningValueColor;
+    data['month_earning_text'] = this.monthEarningText;
+    data['month_earning_text_color'] = this.monthEarningTextColor;
+    data['month_earning_value_color'] = this.monthEarningValueColor;
+    return data;
+  }
+}

lib/pages/team_page/team_page.dart

@@ -1,42 +1,89 @@
 import 'package:flutter/cupertino.dart';
 import 'package:flutter/material.dart';
 import 'package:tab_indicator_styler/tab_indicator_styler.dart';
+import 'package:zhiying_base_widget/pages/team_page/bloc/team_bloc.dart';
+import 'package:zhiying_base_widget/pages/team_page/bloc/team_repository.dart';
+import 'package:zhiying_base_widget/pages/team_page/model/team_data_model.dart';
+import 'package:zhiying_base_widget/pages/team_page/model/team_style_model.dart';
+import 'package:zhiying_base_widget/widgets/team/appbar/team_app_bar_widget.dart';
 import 'package:zhiying_base_widget/widgets/team/data/team_data_widet.dart';
-import 'package:zhiying_base_widget/widgets/team/fans/team_fans_item.dart';
-import 'package:zhiying_base_widget/widgets/team/fans/team_fans_number_item.dart';
+import 'package:zhiying_base_widget/widgets/team/fans_list/team_fans_widget.dart';
+import 'package:zhiying_base_widget/widgets/team/filter/team_filter_widget.dart';
+import 'package:zhiying_base_widget/widgets/team/input/team_input_widget.dart';
 import 'package:zhiying_base_widget/widgets/team/recommend/team_recommend_widget.dart';
 import 'package:zhiying_comm/util/custom_sliver_persistent_header_delegate.dart';
 import 'package:zhiying_comm/zhiying_comm.dart';
 import 'dart:ui';
+import 'package:flutter_bloc/flutter_bloc.dart';
+
+import 'team_page_sk.dart';
 
 ///
 /// 我的团队
 ///
-class TeamPage extends StatefulWidget {
+class TeamPage extends StatelessWidget {
+  final Map<String, dynamic> data;
+
+  const TeamPage(this.data);
+
+  @override
+  Widget build(BuildContext context) {
+    return BlocProvider<TeamBloc>(
+      create: (_) => TeamBloc(repository: TeamRepository())..add(TeamInitEvent(data)),
+      child: _TeamPageContainer(),
+    );
+  }
+}
+
+class _TeamPageContainer extends StatefulWidget {
   @override
-  _TeamPageState createState() => _TeamPageState();
+  _TeamPageContainerState createState() => _TeamPageContainerState();
 }
 
-class _TeamPageState extends State<TeamPage> {
+class _TeamPageContainerState extends State<_TeamPageContainer> {
   @override
   Widget build(BuildContext context) {
-    return _getMainWidget();
+    return BlocConsumer<TeamBloc, TeamState>(
+      listener: (context, state) {},
+      buildWhen: (prov, current) {
+        if (current is TeamErrorState) {
+          return false;
+        }
+        return true;
+      },
+      builder: (context, state) {
+        print('TeamPage state === $state');
+        if (state is TeamLoadedState) {
+          _initTabController(state?.styleModel);
+          return _getMainWidget(state.styleModel, state.dataModel);
+        }
+
+        /// 骨架屏幕
+        return TeamPageSkeleton();
+      },
+    );
   }
 
   var tabTitle = [
-    '全部会员',
-    '青铜会员',
-    '白银会员',
-    '黄金会员',
+    '全部1',
+    '达人1',
+    '超级达人',
+    '运营商1',
   ];
   TabController _controller;
 
   @override
   void initState() {
-    _controller = TabController(length: tabTitle.length, vsync: ScrollableState());
+    // _controller = TabController(length: tabTitle.length, vsync: ScrollableState());
     super.initState();
   }
 
+  void _initTabController(TeamStyleModel styleModel) {
+    if (null == _controller) {
+      _controller = TabController(length: styleModel?.userLvTabs?.length ?? 0, vsync: ScrollableState());
+    }
+  }
+
   @override
   void dispose() {
     _controller?.dispose();
@@ -44,114 +91,33 @@ class _TeamPageState extends State<TeamPage> {
   }
 
   /// 主体视图
-  Widget _getMainWidget() {
+  Widget _getMainWidget(TeamStyleModel styleModel, TeamDataModel dataModel) {
     return Scaffold(
-      backgroundColor: HexColor.fromHex('#F9F9F9'),
+      resizeToAvoidBottomPadding: false,
+      resizeToAvoidBottomInset: false,
+      backgroundColor: HexColor.fromHex(styleModel?.bgColor ?? '#F9F9F9'),
       body: NestedScrollView(
         headerSliverBuilder: (context, bool) {
           return [
             /// 头部Bar
-            SliverAppBar(
-              // expandedHeight: 200.0,
-              leading: IconButton(
-                icon: Icon(
-                  Icons.arrow_back_ios,
-                  size: 22,
-                  color: HexColor.fromHex('#333333'),
-                ),
-                onPressed: () => Navigator.maybePop(context),
-              ),
-              backgroundColor: Colors.white,
-              floating: true,
-              pinned: true,
-              title: Text(
-                '我的团队',
-                style: TextStyle(color: HexColor.fromHex('#333333'), fontWeight: FontWeight.bold, fontSize: 18),
-              ),
-              centerTitle: true,
-              elevation: 0,
-            ),
+            TeamAppBarWidget(styleModel),
 
             /// 我的推荐人
-            SliverToBoxAdapter(
-              child: TeamRecommendWidget(),
-            ),
+            SliverToBoxAdapter(child: TeamRecommendWidget(styleModel, dataModel)),
 
             /// 数据
-            SliverToBoxAdapter(
-              child: TeamDataWidget(),
-            ),
+            SliverToBoxAdapter(child: TeamDataWidget(styleModel, dataModel)),
 
+            /// 间距
             SliverToBoxAdapter(child: SizedBox(height: 8)),
 
             /// 输入框
-            SliverPersistentHeader(
-              delegate: CustomSliverPersistentHeaderDelegate(
-                min: 34,
-                max: 34,
-                child: Container(
-                  width: double.infinity,
-                  height: double.infinity,
-                  padding: const EdgeInsets.only(top: 10, left: 12.5, right: 12.5),
-                  color: Colors.white,
-                  child: Row(
-                    children: <Widget>[
-                      /// 输入框
-                      Expanded(
-                        child: Container(
-                          height: 24,
-                          decoration: BoxDecoration(
-                            borderRadius: BorderRadius.circular(30),
-                            color: HexColor.fromHex('#F7F7F7'),
-                          ),
-                          padding: const EdgeInsets.only(top: 5, bottom: 4.5, left: 7.5, right: 7.5),
-                          width: double.infinity,
-                          child: Row(
-                            children: <Widget>[
-                              Container(width: 11.5, height: 11.5, color: Colors.red,),
-                              Expanded(child: Container(
-                                color: Colors.transparent,
-                                child: TextField(
-                                  style: TextStyle(fontSize: 11 , color: HexColor.fromHex('#000000'), textBaseline: TextBaseline.alphabetic),
-                                  decoration: InputDecoration(
-                                    focusedBorder: InputBorder.none,
-                                    border: InputBorder.none,
-                                    focusedErrorBorder: InputBorder.none,
-                                    errorBorder: InputBorder.none,
-                                    disabledBorder: InputBorder.none,
-                                    enabledBorder: InputBorder.none,
-                                    filled: true,
-                                    isDense: true,
-                                    contentPadding: const EdgeInsets.only(left: 6, bottom: 0, top: 0, right: 0),
-                                    fillColor: Colors.transparent,
-                                    hintStyle: TextStyle(fontSize: 11 , color: HexColor.fromHex('#999999'), textBaseline: TextBaseline.alphabetic),
-                                    hintText: '输入需搜索的手机号/昵称',
-                                  ),
-                                ),
-                              ),),
-                              Container(width: 15, height: 15, color: Colors.red,)
-                            ],
-                          ),
-                        ),
-                      ),
-                      const SizedBox(width: 8),
-                      ///  确定按钮
-                      Container(
-                        decoration: BoxDecoration(borderRadius: BorderRadius.circular(30), color: HexColor.fromHex('#FF4242')),
-                        padding: const EdgeInsets.only(left: 15, right: 15, bottom: 6.5, top: 6.5),
-                        child: Text('搜索', style: TextStyle(color: HexColor.fromHex('#FFFFFF'), fontSize: 11),),
-                      )
-                    ],
-                  ),
-                ),
-              ),
-              pinned: true,
-            ),
+            SliverPersistentHeader(delegate: CustomSliverPersistentHeaderDelegate(min: 34, max: 34, child: TeamInputWidget(styleModel)), pinned: true),
 
             /// 悬停TabBar
             SliverPersistentHeader(
               delegate: new _SliverTabBarDelegate(
-                TabBar(
+                tabBar: TabBar(
                   isScrollable: false,
                   labelStyle: TextStyle(fontWeight: FontWeight.bold, fontSize: 13),
                   unselectedLabelStyle: TextStyle(fontSize: 13),
@@ -161,56 +127,35 @@ class _TeamPageState extends State<TeamPage> {
                     topRightRadius: 8,
                     bottomLeftRadius: 8,
                     bottomRightRadius: 8,
-                    color: HexColor.fromHex('#F94B47'),
+                    color: HexColor.fromHex(styleModel?.userLvTabsLineColor ?? '#F94B47'),
                     horizontalPadding: 30,
                   ),
                   controller: _controller,
-                  tabs: tabTitle.map((f) => Tab(text: f)).toList(),
+                  // tabs: tabTitle.map((f) => Tab(text: f)).toList(),
+                  tabs: styleModel.userLvTabs
+                      .map((item) => Tab(
+                            text: item.name,
+                          ))
+                      .toList(),
                   indicatorColor: Colors.red,
-                  unselectedLabelColor: HexColor.fromHex('#999999'),
-                  labelColor: HexColor.fromHex('#000000'),
+                  unselectedLabelColor: HexColor.fromHex(styleModel?.userLvTabsNameColor ?? '#999999'),
+                  labelColor: HexColor.fromHex(styleModel?.userLvTabsNameSelectedColor ?? '#000000'),
                 ),
               ),
               pinned: true,
             ),
 
             /// 筛选条件
-            SliverPersistentHeader(
-              delegate: CustomSliverPersistentHeaderDelegate(
-                  max: 32.5,
-                  min: 32.5,
-                  child: Container(
-                    height: double.infinity,
-                    width: double.infinity,
-                    color: HexColor.fromHex('#FFFFFF'),
-                    child: Row(
-                      mainAxisAlignment: MainAxisAlignment.spaceAround,
-                      children: <Widget>[
-
-                        Text('邀请人数', style: TextStyle(fontSize: 12, color: HexColor.fromHex('#999999')),),
-                        Text('邀请人数', style: TextStyle(fontSize: 12, color: HexColor.fromHex('#999999')),),
-                        Text('邀请人数', style: TextStyle(fontSize: 12, color: HexColor.fromHex('#999999')),),
-                        Text('邀请人数', style: TextStyle(fontSize: 12, color: HexColor.fromHex('#999999')),),
-
-                      ],
-                    ),
-                  )),
-              pinned: true,
-            ),
+            SliverPersistentHeader(delegate: CustomSliverPersistentHeaderDelegate(max: 32.5, min: 32.5, child: TeamFilterWidget(styleModel)), pinned: true),
           ];
         },
         body: MediaQuery.removePadding(
           removeTop: true,
           context: context,
+          // child: TabBarView(controller: _controller, children: tabTitle.map((s) => TeamFansWidget(styleModel)).toList()),
           child: TabBarView(
             controller: _controller,
-            children: tabTitle
-                .map((s) => ListView.builder(
-
-                      itemBuilder: (context, int) =>  int == 0 ? TeamFansNumberItemWidget() : TeamFansItem(),
-                      itemCount: 10,
-                    ))
-                .toList(),
+            children: styleModel.userLvTabs.map((item) => TeamFansWidget(styleModel, item.type)).toList(),
           ),
         ),
       ),
@@ -219,23 +164,15 @@ class _TeamPageState extends State<TeamPage> {
 }
 
 class _SliverTabBarDelegate extends SliverPersistentHeaderDelegate {
-  final TabBar widget;
+  final TabBar tabBar;
 
-  const _SliverTabBarDelegate(this.widget) : assert(widget != null);
+  const _SliverTabBarDelegate({this.tabBar}) : assert(tabBar != null);
 
   @override
   Widget build(BuildContext context, double shrinkOffset, bool overlapsContent) {
     return Container(
       color: Colors.white,
-      child: Row(
-        children: <Widget>[
-          const SizedBox(width: 30),
-          Expanded(
-            child: this.widget,
-          ),
-          const SizedBox(width: 30),
-        ],
-      ),
+      child: tabBar,
     );
   }
 
@@ -245,8 +182,8 @@ class _SliverTabBarDelegate extends SliverPersistentHeaderDelegate {
   }
 
   @override
-  double get maxExtent => widget.preferredSize.height;
+  double get maxExtent => tabBar.preferredSize.height;
 
   @override
-  double get minExtent => widget.preferredSize.height;
+  double get minExtent => tabBar.preferredSize.height;
 }

lib/pages/team_page/team_page_sk.dart

@@ -0,0 +1,9 @@
+
+import 'package:flutter/material.dart';
+
+class TeamPageSkeleton extends StatelessWidget {
+  @override
+  Widget build(BuildContext context) {
+    return Container();
+  }
+}

lib/register.dart

@@ -145,7 +145,7 @@ class BaseWidgetRegister {
     PageFactory.regist('pub.flutter.fav', (model) => FavoritePage());
 
     /// 我的团队
-    PageFactory.regist('team_page', (model) => TeamPage());
+    PageFactory.regist('pub.flutter.my_team', (model) => TeamPage(model));
   }
 
   // 注册控件

lib/widgets/home/home_slide_banner/home_slide_banner.dart

@@ -53,9 +53,6 @@ class _HomeSlideBannerContainerState extends State<HomeSlideBannerContainer> {
     //   builder: (_) => PageFactory.create('goods_details', null)
     // ));
     // Navigator.push(context, CupertinoPageRoute(builder: (_)=> TeamPage()));
-    Navigator.push(context, MaterialPageRoute(
-      builder: (_)=> TeamDetailsPage()
-    ));
   }
 
   @override

lib/widgets/team/appbar/team_app_bar_widget.dart

@@ -0,0 +1,35 @@
+
+import 'package:flutter/material.dart';
+import 'package:zhiying_base_widget/pages/team_page/model/team_style_model.dart';
+import 'package:zhiying_comm/zhiying_comm.dart';
+
+class TeamAppBarWidget extends StatelessWidget {
+
+  TeamStyleModel model;
+  TeamAppBarWidget(this.model);
+
+  @override
+  Widget build(BuildContext context) {
+
+    return SliverAppBar(
+      // expandedHeight: 200.0,
+      leading: IconButton(
+        icon: Icon(
+          Icons.arrow_back_ios,
+          size: 22,
+          color: HexColor.fromHex('#333333'),
+        ),
+        onPressed: () => Navigator.maybePop(context),
+      ),
+      backgroundColor: HexColor.fromHex(model?.appBarBgColor ?? '#FFFFFF'),
+      floating: true,
+      pinned: true,
+      title: Text(
+        model?.appBarName ?? '我的团队',
+        style: TextStyle(color: HexColor.fromHex(model?.appBarNameColor ?? '#333333'), fontWeight: FontWeight.bold, fontSize: 18),
+      ),
+      centerTitle: true,
+      elevation: 0,
+    );
+  }
+}

lib/widgets/team/data/team_data_widet.dart

@@ -1,10 +1,20 @@
 import 'package:flutter/material.dart';
+import 'package:zhiying_base_widget/pages/team_page/model/team_data_model.dart';
+import 'package:zhiying_base_widget/pages/team_page/model/team_style_model.dart';
+import 'package:zhiying_base_widget/widgets/home/home_quick_entry/cached_network_image_util.dart';
 import 'package:zhiying_comm/zhiying_comm.dart';
+import 'dart:ui' as ui show PlaceholderAlignment;
+import 'package:cached_network_image/cached_network_image.dart';
 
 ///
 /// 我的团队 - 数据widget
 ///
 class TeamDataWidget extends StatelessWidget {
+  TeamStyleModel styleModel;
+  TeamDataModel dataModel;
+
+  TeamDataWidget(this.styleModel, this.dataModel);
+
   @override
   Widget build(BuildContext context) {
     return Material(
@@ -12,7 +22,6 @@ class TeamDataWidget extends StatelessWidget {
     );
   }
 
-
   /// 主视图
   Widget _getMainWidget() {
     return Container(
@@ -30,19 +39,41 @@ class TeamDataWidget extends StatelessWidget {
             crossAxisAlignment: CrossAxisAlignment.end,
             children: <Widget>[
               /// 直推人数
-              _getCustomWidget(text: '直推人数', textColor: '#999999', textSize: 12, number: '2258', numberColor: '#333333', numberSize: 30, icon: 'sss'),
+              _getCustomWidget(
+                text: styleModel?.dashbordRowFirst[0]?.name ?? '直推人数',
+                textColor: styleModel?.dashbordRowFirst[0]?.nameColor ?? '#999999',
+                textSize: 12,
+                number: dataModel?.direct_fans_count ?? '0',
+                numberColor: styleModel?.dashbordRowFirst[0]?.valueColor ?? '#333333',
+                numberSize: 30,
+                icon: styleModel?.dashbordRowFirst[0]?.upIcon ?? '',
+              ),
 
               /// 分割线
               // VerticalDivider(width: 0.5, thickness: 40, color: HexColor.fromHex('#F0F0F0')),
-              SizedBox(height: 40, child: VerticalDivider(thickness: 0.5, color: HexColor.fromHex('#F0F0F0'), width: 0.5, )),
+              SizedBox(
+                  height: 40,
+                  child: VerticalDivider(
+                    thickness: 0.5,
+                    color: HexColor.fromHex(styleModel?.dashbordLineColor ?? '#F0F0F0'),
+                    width: 0.5,
+                  )),
 
               /// 间推人数
-              _getCustomWidget(text: '间推人数', textColor: '#999999', textSize: 12, number: '469', numberColor: '#333333', numberSize: 30, icon: 'sss'),
+              _getCustomWidget(
+                text: styleModel?.dashbordRowFirst[1]?.name ?? '间推人数',
+                textColor: styleModel?.dashbordRowFirst[1]?.nameColor ?? '#999999',
+                textSize: 12,
+                number: dataModel?.indirect_fans_count ?? '0',
+                numberColor: styleModel?.dashbordRowFirst[1]?.valueColor ?? '#333333',
+                numberSize: 30,
+                icon: styleModel?.dashbordRowFirst[1].upIcon,
+              ),
             ],
           ),
 
           /// 分割线
-          Divider(thickness: 0.5, height: 20, color: HexColor.fromHex('#F0F0F0')),
+          Divider(thickness: 0.5, height: 20, color: HexColor.fromHex(styleModel?.dashbordLineColor ?? '#F0F0F0')),
 
           /// 全部粉丝 & 今日新增 & 昨日新增
           Row(
@@ -50,39 +81,51 @@ class TeamDataWidget extends StatelessWidget {
             children: <Widget>[
               /// 全部粉丝
               _getCustomWidget(
-                text: '全部粉丝',
-                textColor: '#999999',
+                text: styleModel?.dashbordRowSecond[0]?.name ?? '全部粉丝',
+                textColor: styleModel?.dashbordRowSecond[0].name_color ?? '#999999',
                 textSize: 11,
-                number: '2258',
-                numberColor: '#333333',
+                number: dataModel?.all_fans ?? '0',
+                numberColor: styleModel?.dashbordRowSecond[0]?.value_color ?? '#333333',
                 numberSize: 15,
               ),
 
               /// 分割线
               // VerticalDivider(thickness: 0.5, width: 1, color: HexColor.fromHex('#F0F0F0')),
-              SizedBox(height: 35, child: VerticalDivider(thickness: 0.5, color: HexColor.fromHex('#F0F0F0'), width: 0.5, )),
+              SizedBox(
+                  height: 35,
+                  child: VerticalDivider(
+                    thickness: 0.5,
+                    color: HexColor.fromHex(styleModel?.dashbordLineColor ?? '#F0F0F0'),
+                    width: 0.5,
+                  )),
 
               /// 今日新增
               _getCustomWidget(
-                text: '今日新增',
-                textColor: '#999999',
+                text: styleModel?.dashbordRowSecond[1]?.name ?? '今日新增',
+                textColor: styleModel?.dashbordRowSecond[1].name_color ?? '#999999',
                 textSize: 11,
-                number: '4',
-                numberColor: '#333333',
+                number: dataModel?.today_add ?? '0',
+                numberColor: styleModel?.dashbordRowSecond[1]?.value_color ?? '#333333',
                 numberSize: 15,
               ),
 
               /// 分割线
               // VerticalDivider(thickness: 0.5, width: 1, color: HexColor.fromHex('#F0F0F0')),
-              SizedBox(height: 35, child: VerticalDivider(thickness: 0.5, color: HexColor.fromHex('#F0F0F0'), width: 0.5, )),
+              SizedBox(
+                  height: 35,
+                  child: VerticalDivider(
+                    thickness: 0.5,
+                    color: HexColor.fromHex(styleModel?.dashbordLineColor ?? '#F0F0F0'),
+                    width: 0.5,
+                  )),
 
               /// 昨日新增
               _getCustomWidget(
-                text: '昨日新增',
-                textColor: '#999999',
+                text: styleModel?.dashbordRowSecond[2]?.name ?? '昨日新增',
+                textColor: styleModel?.dashbordRowSecond[2].name_color ?? '#999999',
                 textSize: 11,
-                number: '12',
-                numberColor: '#333333',
+                number: dataModel?.yesterday_add ?? '0',
+                numberColor: styleModel?.dashbordRowSecond[2]?.value_color ?? '#333333',
                 numberSize: 15,
               ),
             ],
@@ -106,17 +149,35 @@ class TeamDataWidget extends StatelessWidget {
             /// nummber\
             Text(number,
                 style: TextStyle(color: HexColor.fromHex(numberColor), fontSize: numberSize, fontWeight: FontWeight.bold, fontFamily: 'Din', package: 'zhiying_base_widget')),
-            const SizedBox(width: 3),
 
             /// icon
-            Visibility(visible: !EmptyUtil.isEmpty(icon), child: Container(height: 7, width: 5, color: Colors.red))
+            Visibility(
+                visible: !EmptyUtil.isEmpty(icon),
+                child: Align(alignment: Alignment.topLeft, child: Container(width: 5, child: CachedNetworkImage(imageUrl: icon ?? ''), margin: const EdgeInsets.only(left: 3))))
           ],
         ),
 
+        // RichText(
+        //   textAlign: TextAlign.center,
+        //   text: TextSpan(
+        //     children: [
+        //       TextSpan(
+        //         text: number,
+        //           style: TextStyle(color: HexColor.fromHex(numberColor), fontSize: numberSize, fontWeight: FontWeight.bold, fontFamily: 'Din', package: 'zhiying_base_widget'),
+        //       ),
+        //       WidgetSpan(
+        //         alignment: ui.PlaceholderAlignment.top,
+        //         child: Visibility(
+        //           visible: !EmptyUtil.isEmpty(icon), child: Align(alignment: Alignment.topLeft, child: Container(height: 7, width: 5, color: Colors.red, margin: const EdgeInsets.only(left: 3)))
+        //         )
+        //       )
+        //     ]
+        //   ),
+        // ),
+
         /// Text
         Text(text, style: TextStyle(color: HexColor.fromHex(textColor), fontSize: textSize))
       ],
     );
   }
 }
-

lib/widgets/team/details/team_details_month_data_widget.dart

@@ -1,65 +0,0 @@
-import 'package:zhiying_comm/zhiying_comm.dart';
-import 'package:flutter/material.dart';
-
-class TeamDetailsMonthDataWidget extends StatelessWidget {
-  @override
-  Widget build(BuildContext context) {
-    return Container();
-  }
-
-
-
-
-  /// content
-  Widget _getContentWidget() {
-    return Container(
-      decoration: BoxDecoration(
-        color: HexColor.fromHex('#FFFFFF'),
-        borderRadius: BorderRadius.circular(10),
-      ),
-      padding: const EdgeInsets.only(top: 31, bottom: 10),
-      child: Row(
-        children: <Widget>[
-          /// 今日贡献
-          _getLeftValueWidget(),
-
-          /// 分割线
-          VerticalDivider(width: 19, thickness: 0.5, color: HexColor.fromHex('#D8D8D8')),
-
-          /// 贡献收入
-          _getRightValueWidget(),
-        ],
-      ),
-    );
-  }
-
-  /// 左边
-  Widget _getLeftValueWidget() {
-    return _getCustomWidget(text: '自购订单(个)', textColor: '#999999', textSize: 11, number: '158.58', numberColor: '#333333', numberSize: 17, icon: 'sss');
-  }
-
-  /// 右边
-  Widget _getRightValueWidget() {
-    return _getCustomWidget(text: '预估收益(元）', textColor: '#999999', textSize: 11, number: '158.58', numberColor: '#333333', numberSize: 17, icon: 'sss');
-  }
-
-  /// 自定义Widget
-  Widget _getCustomWidget({String text, String textColor, double textSize, String number, String numberColor, double numberSize, String icon}) {
-    return Column(
-      children: <Widget>[
-        /// number
-        Text(number, style: TextStyle(color: HexColor.fromHex(numberColor), fontSize: numberSize, fontWeight: FontWeight.bold)),
-
-        /// text
-        Row(
-          children: <Widget>[
-            Text(text, style: TextStyle(color: HexColor.fromHex(textColor), fontSize: textSize)),
-
-            /// icon
-            Visibility(visible: !EmptyUtil.isEmpty(icon), child: Container(width: 11, height: 11, color: Colors.red))
-          ],
-        )
-      ],
-    );
-  }
-}

lib/widgets/team/fans/team_fans_item.dart

@@ -1,242 +0,0 @@
-import 'package:flutter/material.dart';
-import 'package:zhiying_comm/zhiying_comm.dart';
-
-///
-/// 我的团队 - 粉丝信息
-///
-class TeamFansItem extends StatefulWidget {
-  @override
-  _TeamFansItemState createState() => _TeamFansItemState();
-}
-
-class _TeamFansItemState extends State<TeamFansItem> {
-  @override
-  Widget build(BuildContext context) {
-    return _getMainWidget();
-  }
-
-  /// 主体视图
-  Widget _getMainWidget() {
-    return Container(
-      decoration: BoxDecoration(color: HexColor.fromHex('#FFFFFF'), borderRadius: BorderRadius.circular(10)),
-      margin: const EdgeInsets.only(left: 12.5, right: 12.5, top: 8),
-      padding: const EdgeInsets.only(left: 20, right: 20, top: 17.5, bottom: 15),
-      child: Column(
-        children: <Widget>[
-          // 粉丝头像信息等
-          _getFansInfoWidget(),
-          const SizedBox(height: 10),
-          // 微信号码
-          _getWXNumberInfoWidget(),
-          const SizedBox(height: 10),
-          // 数据信息
-          _getDataWidget(),
-        ],
-      ),
-    );
-  }
-
-  /// 粉丝头像信息等
-  Widget _getFansInfoWidget() {
-    return Row(
-      children: <Widget>[
-        /// 头像
-        Container(width: 50, height: 50, color: Colors.red),
-        const SizedBox(width: 10),
-
-        /// 信息
-        Column(
-          mainAxisAlignment: MainAxisAlignment.center,
-          crossAxisAlignment: CrossAxisAlignment.start,
-          children: <Widget>[
-            /// 会员等级 关系 昵称
-            RichText(
-              text: TextSpan(text: '', children: [
-                /// 等级
-                WidgetSpan(child: Container(width: 37, height: 13, color: Colors.red)),
-
-                /// 会员关系
-                WidgetSpan(child: Container(width: 13, height: 13, color: Colors.red, margin: const EdgeInsets.only(left: 3, right: 3))),
-
-                /// 会员名称
-                TextSpan(text: '温***哥', style: TextStyle(color: HexColor.fromHex('#333333'), fontSize: 12, fontWeight: FontWeight.bold))
-              ]),
-            ),
-
-            /// 手机号码
-            RichText(
-              text: TextSpan(text: '', children: [
-                /// 手机号码
-                TextSpan(text: '手机号：', style: TextStyle(color: HexColor.fromHex('#333333'), fontSize: 11)),
-                TextSpan(text: '124****6124', style: TextStyle(color: HexColor.fromHex('#333333'), fontSize: 11, fontFamily: 'Din', package: 'zhiying_base_widget')),
-
-                /// 复制按钮
-                WidgetSpan(child: Container(width: 11, height: 11, color: Colors.red, margin: const EdgeInsets.only(left: 3)))
-              ]),
-            ),
-          ],
-        )
-      ],
-    );
-  }
-
-  /// 微信号码信息
-  Widget _getWXNumberInfoWidget() {
-    return Container(
-      padding: const EdgeInsets.only(left: 9, right: 10, bottom: 6.5, top: 6.5),
-      decoration: BoxDecoration(
-        color: HexColor.fromHex('#F7F7F7'),
-        borderRadius: BorderRadius.circular(10),
-      ),
-      child: Row(
-        mainAxisAlignment: MainAxisAlignment.spaceBetween,
-        children: <Widget>[
-          /// 微信号码
-          RichText(
-            text: TextSpan(text: '微信号:', style: TextStyle(color: HexColor.fromHex('#999999'), fontSize: 11, fontWeight: FontWeight.bold), children: [
-              TextSpan(
-                  text: '54A78',
-                  style: TextStyle(fontWeight: FontWeight.bold, color: HexColor.fromHex('#333333'), fontSize: 11, fontFamily: 'Din', package: 'zhiying_base_widget')),
-              WidgetSpan(child: Container(margin: const EdgeInsets.only(left: 5.5), color: Colors.red, width: 11, height: 11))
-            ]),
-          ),
-
-          /// 最近登陆时间
-          Text('最近登陆 2019-06-28', style: TextStyle(color: HexColor.fromHex('#909090'), fontSize: 11, fontFamily: 'Din', package: 'zhiying_base_widget'))
-        ],
-      ),
-    );
-  }
-
-  /// 数据信息
-  Widget _getDataWidget() {
-    return Row(
-      mainAxisAlignment: MainAxisAlignment.spaceAround,
-      children: <Widget>[
-        /// 左边数据
-        Flexible(
-          flex: 1,
-          child: Column(
-            mainAxisAlignment: MainAxisAlignment.center,
-            crossAxisAlignment: CrossAxisAlignment.center,
-            children: <Widget>[
-              /// 邀请人数(人)
-              _getCustomWidget(
-                text: '邀请人数(人)',
-                textColor: '#333333',
-                textSize: 10,
-                number: '1578',
-                numberColor: '#FF4242',
-                numberSize: 20,
-              ),
-              const SizedBox(height: 15),
-              /// 今日邀请 & 本月邀请
-              Row(
-                mainAxisAlignment: MainAxisAlignment.spaceAround,
-                children: <Widget>[
-                  /// 今日邀请
-                  _getCustomWidget(
-                    text: '今日邀请',
-                    textColor: '#909090',
-                    textSize: 10,
-                    number: '3258',
-                    numberColor: '#333333',
-                    numberSize: 15,
-                  ),
-
-                  /// 本月邀请
-                  _getCustomWidget(
-                    text: '本月邀请',
-                    textColor: '#909090',
-                    textSize: 10,
-                    number: '3258',
-                    numberColor: '#333333',
-                    numberSize: 15,
-                  ),
-                ],
-              )
-            ],
-          ),
-        ),
-
-        /// 分割线
-        SizedBox( height:65.5, width: 0.5,child: VerticalDivider(width: 0.5, thickness: 0.5, color: HexColor.fromHex('#F7F7F7'))),
-
-        /// 右边数据
-        Flexible(
-          flex: 1,
-          child: Column(
-            mainAxisAlignment: MainAxisAlignment.center,
-            crossAxisAlignment: CrossAxisAlignment.center,
-            children: <Widget>[
-              /// 累计收益(¥)
-              _getCustomWidget(
-                text: '累计收益(¥)',
-                textColor: '#333333',
-                textSize: 10,
-                number: '157.54',
-                numberColor: '#FF4242',
-                numberSize: 20,
-              ),
-
-              const SizedBox(height: 15),
-
-              /// 近7天收益 & 本月收益
-              Row(
-                mainAxisAlignment: MainAxisAlignment.spaceAround,
-                children: <Widget>[
-                  /// 今日邀请
-                  _getCustomWidget(
-                    text: '近7天收益',
-                    textColor: '#909090',
-                    textSize: 10,
-                    number: '4.12',
-                    numberColor: '#333333',
-                    numberSize: 15,
-                  ),
-
-                  /// 本月邀请
-                  _getCustomWidget(
-                    text: '本月收益',
-                    textColor: '#909090',
-                    textSize: 10,
-                    number: '528.14',
-                    numberColor: '#333333',
-                    numberSize: 15,
-                  ),
-                ],
-              )
-            ],
-          ),
-        )
-      ],
-    );
-  }
-
-  /// 自定义Widget(数字加粗)
-  Widget _getCustomWidget({String text, String textColor, double textSize, String number, String numberColor, double numberSize, String icon}) {
-    return Column(
-      mainAxisAlignment: MainAxisAlignment.center,
-      crossAxisAlignment: CrossAxisAlignment.center,
-      children: <Widget>[
-        /// Number
-        Row(
-          mainAxisAlignment: MainAxisAlignment.center,
-          crossAxisAlignment: CrossAxisAlignment.center,
-          children: <Widget>[
-            /// nummber\
-            Text(number,
-                style: TextStyle(color: HexColor.fromHex(numberColor), fontSize: numberSize, fontWeight: FontWeight.bold, fontFamily: 'Din', package: 'zhiying_base_widget')),
-            const SizedBox(width: 3),
-
-            /// icon
-            Visibility(visible: !EmptyUtil.isEmpty(icon), child: Container(height: 7, width: 5, color: Colors.red))
-          ],
-        ),
-
-        /// Text
-        Text(text, style: TextStyle(color: HexColor.fromHex(textColor), fontSize: textSize))
-      ],
-    );
-  }
-}

lib/widgets/team/fans/team_fans_number_item.dart

@@ -1,21 +0,0 @@
-import 'package:flutter/material.dart';
-import 'package:zhiying_comm/zhiying_comm.dart';
-
-class TeamFansNumberItemWidget extends StatelessWidget {
-  @override
-  Widget build(BuildContext context) {
-    return Container(
-      alignment: Alignment.center,
-      margin: const EdgeInsets.only(left: 12.5, right: 12.5, top: 8),
-      child: RichText(
-        text: TextSpan(text: '', children: [
-          TextSpan(text: '粉丝总人数', style: TextStyle(fontSize: 12, color: HexColor.fromHex('#333333'), fontWeight: FontWeight.bold)),
-          TextSpan(text: '79', style: TextStyle(fontSize: 18, color: HexColor.fromHex('#FF4242'), fontFamily: 'Din', package: 'zhiying_base_widget', fontWeight: FontWeight.bold)),
-          TextSpan(text: '人 当前分类人数', style: TextStyle(fontSize: 12, color: HexColor.fromHex('#333333'), fontWeight: FontWeight.bold)),
-          TextSpan(text: '15', style: TextStyle(fontSize: 18, color: HexColor.fromHex('#FF4242'), fontFamily: 'Din', package: 'zhiying_base_widget', fontWeight: FontWeight.bold)),
-          TextSpan(text: '人', style: TextStyle(fontSize: 12, color: HexColor.fromHex('#333333'), fontWeight: FontWeight.bold)),
-        ]),
-      ),
-    );
-  }
-}

lib/widgets/team/fans_list/bloc/team_list_fans_bloc.dart

@@ -0,0 +1,92 @@
+import 'dart:async';
+
+import 'package:bloc/bloc.dart';
+import 'package:equatable/equatable.dart';
+import 'package:flutter/cupertino.dart';
+import 'package:zhiying_base_widget/widgets/team/fans_list/bloc/team_list_fans_repository.dart';
+import 'package:zhiying_base_widget/widgets/team/fans_list/model/team_fans_list_model.dart';
+import 'package:zhiying_comm/util/empty_util.dart';
+
+part 'team_list_fans_event.dart';
+
+part 'team_list_fans_state.dart';
+
+class TeamListFansBloc extends Bloc<TeamListFansEvent, TeamListFansState> {
+  // TeamListFansBloc() : super(TeamListFansInitial());
+
+  TeamListFansRepository repository;
+
+  TeamListFansBloc(this.repository);
+
+  @override
+  TeamListFansState get initialState => TeamListFansInitial();
+
+  @override
+  Stream<TeamListFansState> mapEventToState(
+    TeamListFansEvent event,
+  ) async* {
+    final currentState = state;
+
+    /// 初始化
+    if (event is TeamListFansInitEvent) {
+      yield* _mapInitEventToState(event);
+    }
+
+    /// 下拉刷新
+    if (event is TeamListFansOnRefreshEvent) {
+      yield* _mapRefreshToState(currentState, event);
+    }
+
+    /// 上拉更多
+    if (event is TeamListFansOnLoadEevnt) {
+      yield* _mapOnLoadToState(event);
+    }
+
+    /// 排序
+    if (event is TeamListFansOnSortEvent) {
+      yield* _mapSortEventToState(event);
+    }
+  }
+
+  /// 初始化
+  Stream<TeamListFansState> _mapInitEventToState(TeamListFansInitEvent event) async* {
+    var result = await repository.fetchInitData();
+    if (!EmptyUtil.isEmpty(result)) {
+      yield TeamListFansLoadedState(model: result);
+    } else {
+      yield TeamListFansErrorState();
+    }
+  }
+
+  /// 下拉刷新
+  Stream<TeamListFansState> _mapRefreshToState(TeamListFansState state, TeamListFansOnRefreshEvent event) async* {
+    var result = await repository.fetchOnRefresh();
+    if (!EmptyUtil.isEmpty(result)) {
+      yield TeamListFansOnRefreshErrorState();
+      yield TeamListFansLoadedState(model: result);
+    } else {
+      yield TeamListFansOnRefreshErrorState();
+    }
+  }
+
+  /// 上拉更多
+  Stream<TeamListFansState> _mapOnLoadToState(TeamListFansOnLoadEevnt event) async* {
+    var result = await repository.fetchOnLoad();
+    if (!EmptyUtil.isEmpty(result)) {
+      yield TeamListFansOnLoadSuccessState();
+      yield TeamListFansLoadedState(model: result);
+    } else {
+      yield TeamListFansOnLoadErrorState();
+    }
+  }
+
+  /// 排序
+  Stream<TeamListFansState> _mapSortEventToState(TeamListFansOnSortEvent event) async* {
+    var result = await repository.fetchSort(event.key, event.args);
+    if (!EmptyUtil.isEmpty(result)) {
+      yield TeamListFansLoadedState(model: result);
+    } else {
+      yield TeamListFansErrorState();
+    }
+  }
+}

lib/widgets/team/fans_list/bloc/team_list_fans_event.dart

@@ -0,0 +1,35 @@
+part of 'team_list_fans_bloc.dart';
+
+abstract class TeamListFansEvent extends Equatable {
+  const TeamListFansEvent();
+
+  @override
+  List<Object> get props => [];
+}
+
+/// 初始化
+class TeamListFansInitEvent extends TeamListFansEvent {
+  // final String type;
+  //
+  // TeamListFansInitEvent({@required this.type});
+  //
+  // @override
+  // List<Object> get props => [this.type];
+}
+
+/// 下拉刷新
+class TeamListFansOnRefreshEvent extends TeamListFansEvent {}
+
+/// 上拉更多
+class TeamListFansOnLoadEevnt extends TeamListFansEvent {}
+
+/// 排序
+class TeamListFansOnSortEvent extends TeamListFansEvent {
+  final String key;
+  final String args;
+
+  TeamListFansOnSortEvent({@required this.key, @required this.args});
+
+  @override
+  List<Object> get props => [this.key, this.args];
+}

lib/widgets/team/fans_list/bloc/team_list_fans_repository.dart

@@ -0,0 +1,108 @@
+import 'package:zhiying_base_widget/widgets/team/fans_list/model/team_fans_list_model.dart';
+import 'package:zhiying_comm/zhiying_comm.dart';
+
+class TeamListFansRepository {
+  final int _max = 20;
+  final String _baseUrl = '/api/v1/user/fans/';
+  final String _pageKey = 'page';
+  final String _sizeKey = 'size';
+
+  final String type;
+
+  int _currentPage = 1;
+  bool _hasMoreData = true;
+  List<TeamFansListItemModel> _oldData = [];
+  Map<String, String> _reqArgs = {};
+
+  TeamListFansRepository({this.type = 'all'});
+
+  /// 初始化方法
+  Future<TeamFansListModel> fetchInitData() async {
+    _currentPage = 1;
+    _hasMoreData = true;
+    _oldData.clear();
+    return _fetchBase();
+  }
+
+  /// 上拉更多
+  Future<TeamFansListModel> fetchOnLoad() async {
+    if (_hasMoreData) {
+      return _fetchBase();
+    }
+    return null;
+  }
+
+  /// 下拉刷新
+  Future<TeamFansListModel> fetchOnRefresh() async {
+    return fetchInitData();
+  }
+
+  /// 排序方法
+  Future<TeamFansListModel> fetchSort(String key, String value) async {
+    if (EmptyUtil.isEmpty(key)) return null;
+    if (EmptyUtil.isEmpty(value)) {
+      _reqArgs[key] = '';
+    } else {
+      _reqArgs[key] = value;
+    }
+    return fetchInitData();
+  }
+
+  /// 基础请求
+  Future<TeamFansListModel> _fetchBase() async {
+    try {
+      /// 构建URL
+      String url = _buildReqUrl();
+      var result = await NetUtil.post(url, method: NetMethod.GET);
+      if (!EmptyUtil.isEmpty(result) && !EmptyUtil.isEmpty(result[GlobalConfig.HTTP_RESPONSE_KEY_DATA])) {
+        TeamFansListModel model = TeamFansListModel.fromJson(result[GlobalConfig.HTTP_RESPONSE_KEY_DATA]);
+        if (EmptyUtil.isEmpty(model)) {
+          _hasMoreData = false;
+          return null;
+        }
+        if (!EmptyUtil.isEmpty(model.fans) && model.fans.length >= _max) {
+          ++_currentPage;
+          _hasMoreData = true;
+          model.fans.insertAll(0, _oldData);
+        } else {
+          model.fans.insertAll(0, _oldData);
+          _hasMoreData = false;
+        }
+        _oldData = model.fans;
+        return model;
+      }
+    } catch (e, s) {
+      Logger.error('e = ${e.toString()}, s = ${s.toString()}');
+    }
+    return null;
+  }
+
+  /// 构建url
+  String _buildReqUrl() {
+    StringBuffer sb = StringBuffer();
+    sb.write(_baseUrl);
+    sb.write(type);
+    sb.write('?');
+    _reqArgs[_pageKey] = _currentPage.toString();
+    _reqArgs[_sizeKey] = _max.toString();
+
+    // sb.write('${_pageKey}=${_currentPage.toString()}&');
+    // sb.write('${_sizeKey}=${_MAX.toString()}&');
+
+    if (!EmptyUtil.isEmpty(_reqArgs)) {
+      _reqArgs.forEach((key, value) {
+        sb.write(key);
+        sb.write('=');
+        sb.write(value);
+        sb.write('&');
+      });
+    }
+
+    String tempUrl = sb.toString();
+    if (tempUrl.endsWith('&')) {
+      return tempUrl.substring(0, tempUrl.length - 1);
+    } else {
+      return tempUrl;
+    }
+  }
+}

lib/widgets/team/fans_list/bloc/team_list_fans_state.dart

@@ -0,0 +1,42 @@
+part of 'team_list_fans_bloc.dart';
+
+abstract class TeamListFansState extends Equatable {
+  const TeamListFansState();
+
+  @override
+  List<Object> get props => [];
+}
+
+class TeamListFansInitial extends TeamListFansState {}
+
+/// 数据加载成功
+class TeamListFansLoadedState extends TeamListFansState {
+  TeamFansListModel model;
+
+  TeamListFansLoadedState({this.model});
+
+  @override
+  List<Object> get props => [this.model];
+}
+
+/// 数据加载失败
+class TeamListFansErrorState extends TeamListFansState {
+  TeamListFansErrorState copyWith() {
+    return TeamListFansErrorState();
+  }
+
+  @override
+  List<Object> get props => [];
+}
+
+/// 加载更多失败
+class TeamListFansOnLoadErrorState extends TeamListFansState {}
+
+/// 加载更多数据成功
+class TeamListFansOnLoadSuccessState extends TeamListFansState{}
+
+/// 下拉刷新成功
+class TeamListFansOnRefreshSuccessState extends TeamListFansState{}
+
+/// 下拉刷新数据失败
+class TeamListFansOnRefreshErrorState extends TeamListFansState{}

lib/widgets/team/fans_list/model/team_fans_list_model.dart

@@ -0,0 +1,122 @@
+import 'package:zhiying_comm/util/empty_util.dart';
+
+class TeamFansListModel {
+  String categoryCount;
+  List<TeamFansListItemModel> fans;
+  String total;
+
+  TeamFansListModel({this.categoryCount, this.fans, this.total});
+
+  factory TeamFansListModel.fromJson(Map<String, dynamic> json) {
+    return TeamFansListModel(
+      categoryCount: json['category_count'],
+      fans: json['fans'] != null ? (json['fans'] as List).map((i) => TeamFansListItemModel.fromJson(i)).toList() : null,
+      total: json['total'],
+    );
+  }
+
+  Map<String, dynamic> toJson() {
+    final Map<String, dynamic> data = new Map<String, dynamic>();
+    data['category_count'] = this.categoryCount;
+    data['total'] = this.total;
+    if (this.fans != null) {
+      data['fans'] = this.fans.map((v) => v.toJson()).toList();
+    }
+    return data;
+  }
+}
+
+class TeamFansListItemModel {
+  String avatar;
+  String inviteCount;
+  String lastLogin;
+  String level;
+  String levelType;
+  String monthFin;
+  String monthInviteCount;
+  String phone;
+  String todayInviteCount;
+  String totalFin;
+  String username;
+  String wechat;
+  String weekFin;
+
+  String levelName;
+  String levelIcon;
+  String levelBgColor;
+  String levelBgImage;
+
+  // 获取模糊手机号码
+  get blurMobile => !EmptyUtil.isEmpty(phone) ? phone.length == 11 ? '${phone.substring(0, 3)}****${phone.substring(7, phone.length)}' : phone : phone;
+
+  // 获取模糊昵称
+  get blurUserName =>
+      !EmptyUtil.isEmpty(username) ? username.length > 6 ? '${username.substring(0, 3)}****${username.substring(username.length - 3, phone.length)}' : username : username;
+
+  // 获取模糊微信
+  get blurWeChat => !EmptyUtil.isEmpty(wechat) ? wechat.length > 6 ? '${wechat.substring(0, 3)}****${wechat.substring(wechat.length - 3, wechat.length)}' : wechat : wechat;
+
+  TeamFansListItemModel({
+    this.avatar,
+    this.inviteCount,
+    this.lastLogin,
+    this.level,
+    this.levelType,
+    this.monthFin,
+    this.monthInviteCount,
+    this.phone,
+    this.todayInviteCount,
+    this.totalFin,
+    this.username,
+    this.wechat,
+    this.weekFin,
+    this.levelBgColor,
+    this.levelBgImage,
+    this.levelIcon,
+    this.levelName,
+  });
+
+  factory TeamFansListItemModel.fromJson(Map<String, dynamic> json) {
+    return TeamFansListItemModel(
+      avatar: json['avatar'],
+      inviteCount: json['invite_count'],
+      lastLogin: json['last_login'],
+      level: json['level'],
+      levelType: json['level_type'],
+      monthFin: json['month_fin'],
+      monthInviteCount: json['month_invite_count'],
+      phone: json['phone'],
+      todayInviteCount: json['today_invite_count'],
+      totalFin: json['total_fin'],
+      username: json['username'],
+      wechat: json['wechat'],
+      weekFin: json['week_fin'],
+      levelBgColor: json['level_bg_color'],
+      levelBgImage: json['level_bg_color'],
+      levelIcon: json['level_icon'],
+      levelName: json['level_name'],
+    );
+  }
+
+  Map<String, dynamic> toJson() {
+    final Map<String, dynamic> data = new Map<String, dynamic>();
+    data['avatar'] = this.avatar;
+    data['invite_count'] = this.inviteCount;
+    data['last_login'] = this.lastLogin;
+    data['level'] = this.level;
+    data['level_type'] = this.levelType;
+    data['month_fin'] = this.monthFin;
+    data['month_invite_count'] = this.monthInviteCount;
+    data['phone'] = this.phone;
+    data['today_invite_count'] = this.todayInviteCount;
+    data['total_fin'] = this.totalFin;
+    data['username'] = this.username;
+    data['wechat'] = this.wechat;
+    data['week_fin'] = this.weekFin;
+    data['level_name'] = this.levelName;
+    data['level_icon'] = this.levelIcon;
+    data['level_bg_color'] = this.levelBgColor;
+    data['level_bg_image'] = this.levelBgImage;
+    return data;
+  }
+}

lib/widgets/team/fans_list/team_fans_item.dart

@@ -0,0 +1,367 @@
+import 'package:flutter/cupertino.dart';
+import 'package:flutter/material.dart';
+import 'package:zhiying_base_widget/pages/team_details_page/team_details_page.dart';
+import 'package:zhiying_base_widget/pages/team_page/model/team_style_model.dart';
+import 'package:cached_network_image/cached_network_image.dart';
+import 'package:zhiying_base_widget/widgets/team/fans_list/model/team_fans_list_model.dart';
+import 'package:zhiying_comm/zhiying_comm.dart';
+import 'package:fluttertoast/fluttertoast.dart';
+import 'dart:ui' as ui show PlaceholderAlignment;
+
+///
+/// 我的团队 - 粉丝信息
+///
+class TeamFansItem extends StatefulWidget {
+  TeamStyleModel styleModel;
+  TeamFansListItemModel dataModel;
+
+  TeamFansItem(this.styleModel, this.dataModel);
+
+  @override
+  _TeamFansItemState createState() => _TeamFansItemState();
+}
+
+class _TeamFansItemState extends State<TeamFansItem> {
+  /// 跳去粉丝详情
+  void _openFansItemDetailsPage() {
+    Navigator.push(context, CupertinoPageRoute(builder: (_) => TeamDetailsPage()));
+  }
+
+  void _copyText() {
+    Fluttertoast.showToast(msg: '复制成功~');
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return _getMainWidget();
+  }
+
+  /// 主体视图
+  Widget _getMainWidget() {
+    return Container(
+      decoration: BoxDecoration(color: HexColor.fromHex('#FFFFFF'), borderRadius: BorderRadius.circular(10)),
+      margin: const EdgeInsets.only(left: 12.5, right: 12.5, top: 8),
+      padding: const EdgeInsets.only(left: 20, right: 20, top: 17.5, bottom: 15),
+      child: Column(
+        children: <Widget>[
+          // 粉丝头像信息等
+          _getFansInfoWidget(),
+          const SizedBox(height: 10),
+          // 微信号码
+          _getWXNumberInfoWidget(),
+          const SizedBox(height: 10),
+          // 数据信息
+          _getDataWidget(),
+        ],
+      ),
+    );
+  }
+
+  /// 粉丝头像信息等
+  Widget _getFansInfoWidget() {
+    return Row(
+      children: <Widget>[
+        /// 头像
+        GestureDetector(
+            onTap: () => _openFansItemDetailsPage(),
+            child: Container(
+              width: 50,
+              child: CachedNetworkImage(
+                imageUrl: widget?.dataModel?.avatar ?? '',
+              ),
+            )),
+        const SizedBox(width: 10),
+
+        /// 信息
+        Column(
+          mainAxisAlignment: MainAxisAlignment.center,
+          crossAxisAlignment: CrossAxisAlignment.start,
+          children: <Widget>[
+            /// 会员等级 关系 昵称
+            RichText(
+              textAlign: TextAlign.center,
+              text: TextSpan(text: '', children: [
+                /// 等级
+                WidgetSpan(
+                  alignment: ui.PlaceholderAlignment.middle,
+                  child: Container(
+                    padding: const EdgeInsets.only(left: 3, right: 2, top: 2, bottom: 2),
+                    decoration: BoxDecoration(
+                      color: HexColor.fromHex(widget?.dataModel?.levelBgColor),
+                      borderRadius: BorderRadius.circular(2.5),
+                    ),
+                    alignment: Alignment.center,
+                    child: Row(
+                      children: <Widget>[
+                        CachedNetworkImage(imageUrl: widget?.dataModel?.levelIcon ?? '', width: 11,),
+                        const SizedBox(width: 2.5),
+                        Text(
+                          widget?.dataModel?.levelName ?? '黑钻会员',
+                          style: TextStyle(color: HexColor.fromHex(widget?.styleModel?.teamViewItem?.lvTextColor ?? 'FFFFFF'), fontSize: 8),
+                        ),
+                      ],
+                    ),
+                  ),
+                ),
+
+                /// 会员关系
+                WidgetSpan(
+                  alignment: ui.PlaceholderAlignment.middle,
+                  child: Container(
+                    alignment: Alignment.center,
+                    padding: const EdgeInsets.only(left: 2.5, right: 2.5, top: 2, bottom: 2),
+                    margin: const EdgeInsets.only(left: 3, right: 3),
+                    decoration: BoxDecoration(borderRadius: BorderRadius.circular(2.5), color: HexColor.fromHex(widget?.styleModel?.teamViewItem?.directTextBgColor ?? '#FF4242')),
+                    child: Text(
+                      widget?.dataModel?.levelType ?? '直',
+                      style: TextStyle(color: HexColor.fromHex(widget?.styleModel?.teamViewItem?.directTextColor ?? '#FFFFFF'), fontSize: 8),
+                    ),
+                  ),
+                ),
+
+                /// 会员名称
+                TextSpan(
+                    text: widget?.dataModel?.blurUserName ?? '***',
+                    style: TextStyle(color: HexColor.fromHex(widget?.styleModel?.teamViewItem?.usernameColor ?? '#333333'), fontSize: 12, fontWeight: FontWeight.bold))
+              ]),
+            ),
+            const SizedBox(height: 2.5),
+
+            /// 手机号码
+            RichText(
+              textAlign: TextAlign.center,
+              text: TextSpan(text: '', children: [
+                /// 手机号码
+                TextSpan(
+                    text: widget?.styleModel?.teamViewItem?.phooneText ?? '手机号：',
+                    style: TextStyle(color: HexColor.fromHex(widget?.styleModel?.teamViewItem?.phoneColor ?? '#333333'), fontSize: 11)),
+                TextSpan(
+                    text: widget?.dataModel?.blurMobile ?? '',
+                    style: TextStyle(
+                        color: HexColor.fromHex(widget?.styleModel?.teamViewItem?.phoneColor ?? '#333333'), fontSize: 11, fontFamily: 'Din', package: 'zhiying_base_widget')),
+
+                /// 复制按钮
+                WidgetSpan(
+                    alignment: ui.PlaceholderAlignment.middle,
+                    child: GestureDetector(
+                      behavior: HitTestBehavior.opaque,
+                      onTap: () => _copyText(),
+                      child: Container(
+                        width: 11,
+                        margin: const EdgeInsets.only(left: 3),
+                        child: CachedNetworkImage(
+                          imageUrl: widget?.styleModel?.teamViewItem?.phoneCopyIcon ?? '',
+                        ),
+                      ),
+                    ))
+              ]),
+            ),
+          ],
+        )
+      ],
+    );
+  }
+
+  /// 微信号码信息
+  Widget _getWXNumberInfoWidget() {
+    return Container(
+      padding: const EdgeInsets.only(left: 9, right: 10, bottom: 6.5, top: 6.5),
+      decoration: BoxDecoration(
+        color: HexColor.fromHex(widget?.styleModel?.teamViewItem?.infoBarColor ?? '#F7F7F7'),
+        borderRadius: BorderRadius.circular(5),
+      ),
+      child: Row(
+        mainAxisAlignment: MainAxisAlignment.spaceBetween,
+        children: <Widget>[
+          /// 微信号码
+          RichText(
+            textAlign: TextAlign.center,
+            text: TextSpan(text: '', children: [
+              TextSpan(
+                  text: widget?.styleModel?.teamViewItem?.infoBarWxText ?? '微信号:',
+                  style: TextStyle(
+                    color: HexColor.fromHex(widget?.styleModel?.teamViewItem?.infoBarWxTextColor ?? '#999999'),
+                    fontWeight: FontWeight.bold,
+                    fontSize: 11,
+                  )),
+              TextSpan(
+                  text: widget?.dataModel?.blurWeChat ?? '',
+                  style: TextStyle(
+                      color: HexColor.fromHex(widget?.styleModel?.teamViewItem?.infoBarWxValueColor ?? '#333333'),
+                      fontWeight: FontWeight.bold,
+                      fontSize: 11,
+                      fontFamily: 'Din',
+                      package: 'zhiying_base_widget')),
+
+              /// 复制安妮
+              WidgetSpan(
+                  alignment: ui.PlaceholderAlignment.middle,
+                  child: GestureDetector(
+                    onTap: () => _copyText(),
+                    behavior: HitTestBehavior.opaque,
+                    child: Container(
+                        padding: const EdgeInsets.only(left: 5.5),
+                        width: 11 + 5.5,
+                        child: CachedNetworkImage(
+                          imageUrl: widget?.styleModel?.teamViewItem?.phoneCopyIcon ?? '',
+                        )),
+                  ))
+            ]),
+          ),
+
+          /// 最近登陆时间
+          RichText(
+            textAlign: TextAlign.center,
+            text: TextSpan(children: [
+              TextSpan(
+                  text: widget?.styleModel?.teamViewItem?.infoBarLastLoginText ?? '最近登陆 ',
+                  style: TextStyle(
+                    color: HexColor.fromHex(widget?.styleModel?.teamViewItem?.infoBarLastLoginTextColor ?? '#909090'),
+                    fontSize: 11,
+                  )),
+              TextSpan(
+                  text: widget?.dataModel?.lastLogin ?? '',
+                  style: TextStyle(
+                      color: HexColor.fromHex(widget?.styleModel?.teamViewItem?.infoBarLastLoginValueColor ?? '#909090'),
+                      fontSize: 11,
+                      fontFamily: 'Din',
+                      package: 'zhiying_base_widget')),
+            ]),
+          )
+        ],
+      ),
+    );
+  }
+
+  /// 数据信息
+  Widget _getDataWidget() {
+    return GestureDetector(
+      onTap: () => _openFansItemDetailsPage(),
+      behavior: HitTestBehavior.opaque,
+      child: Row(
+        mainAxisAlignment: MainAxisAlignment.spaceAround,
+        children: <Widget>[
+          /// 左边数据
+          Flexible(
+            flex: 1,
+            child: Column(
+              mainAxisAlignment: MainAxisAlignment.center,
+              crossAxisAlignment: CrossAxisAlignment.center,
+              children: <Widget>[
+                /// 邀请人数(人)
+                _getCustomWidget(
+                  text: widget?.styleModel?.teamViewItem?.totalInviteText ?? '邀请人数(人)',
+                  textColor: widget?.styleModel?.teamViewItem?.totalInviteTextColor ?? '#333333',
+                  textSize: 10,
+                  number: widget?.dataModel?.inviteCount ?? '0',
+                  numberColor: widget?.styleModel?.teamViewItem?.totalInviteValueColor ?? '#FF4242',
+                  numberSize: 20,
+                ),
+                const SizedBox(height: 15),
+
+                /// 今日邀请 & 本月邀请
+                Row(
+                  mainAxisAlignment: MainAxisAlignment.spaceAround,
+                  children: <Widget>[
+                    /// 今日邀请
+                    _getCustomWidget(
+                      text: widget?.styleModel?.teamViewItem?.todayInviteText ?? '今日邀请',
+                      textColor: widget?.styleModel?.teamViewItem?.todayInviteTextColor ?? '#909090',
+                      textSize: 10,
+                      number: widget?.dataModel?.todayInviteCount ?? '0',
+                      numberColor: widget?.styleModel?.teamViewItem?.todayInviteValueColor ?? '#333333',
+                      numberSize: 15,
+                    ),
+
+                    /// 本月邀请
+                    _getCustomWidget(
+                      text: widget?.styleModel?.teamViewItem?.monthInviteText ?? '本月邀请',
+                      textColor: widget?.styleModel?.teamViewItem?.monthInviteTextColor ?? '#909090',
+                      textSize: 10,
+                      number: widget?.dataModel?.monthInviteCount ?? '0',
+                      numberColor: widget?.styleModel?.teamViewItem?.monthInviteValueColor ?? '#333333',
+                      numberSize: 15,
+                    ),
+                  ],
+                )
+              ],
+            ),
+          ),
+
+          /// 分割线
+          SizedBox(
+              height: 65.5,
+              width: 0.5,
+              child: VerticalDivider(
+                width: 0.5,
+                thickness: 0.5,
+                color: HexColor.fromHex(widget?.styleModel?.dashbordLineColor ?? '#F7F7F7'),
+              )),
+
+          /// 右边数据
+          Flexible(
+            flex: 1,
+            child: Column(
+              mainAxisAlignment: MainAxisAlignment.center,
+              crossAxisAlignment: CrossAxisAlignment.center,
+              children: <Widget>[
+                /// 累计收益(¥)
+                _getCustomWidget(
+                  text: widget?.styleModel?.teamViewItem?.totalEarningText ?? '累计收益(¥)',
+                  textColor: widget?.styleModel?.teamViewItem?.totalEarningTextColor ?? '#333333',
+                  textSize: 10,
+                  number: widget?.dataModel?.totalFin ?? '0.00',
+                  numberColor: widget?.styleModel?.teamViewItem?.totalEarningValueColor ?? '#FF4242',
+                  numberSize: 20,
+                ),
+
+                const SizedBox(height: 15),
+
+                /// 本周收益 & 本月收益
+                Row(
+                  mainAxisAlignment: MainAxisAlignment.spaceAround,
+                  children: <Widget>[
+                    /// 本周收益
+                    _getCustomWidget(
+                      text: widget?.styleModel?.teamViewItem?.weekEarningText ?? '本周收益',
+                      textColor: widget?.styleModel?.teamViewItem?.weekEarningTextColor ?? '#909090',
+                      textSize: 10,
+                      number: widget?.dataModel?.weekFin ?? '0.00',
+                      numberColor: widget?.styleModel?.teamViewItem?.weekEarningValueColor ?? '#333333',
+                      numberSize: 15,
+                    ),
+
+                    /// 本月邀请
+                    _getCustomWidget(
+                      text: widget?.styleModel?.teamViewItem?.monthEarningText ?? '本月收益',
+                      textColor: widget?.styleModel?.teamViewItem?.monthEarningTextColor ?? '#909090',
+                      textSize: 10,
+                      number: widget?.dataModel?.monthFin ?? '0.00',
+                      numberColor: widget?.styleModel?.teamViewItem?.monthEarningValueColor ?? '#333333',
+                      numberSize: 15,
+                    ),
+                  ],
+                )
+              ],
+            ),
+          )
+        ],
+      ),
+    );
+  }
+
+  /// 自定义Widget(数字加粗)
+  Widget _getCustomWidget({String text, String textColor, double textSize, String number, String numberColor, double numberSize}) {
+    return Column(
+      mainAxisAlignment: MainAxisAlignment.center,
+      crossAxisAlignment: CrossAxisAlignment.center,
+      children: <Widget>[
+        /// Number
+        Text(number, style: TextStyle(color: HexColor.fromHex(numberColor), fontSize: numberSize, fontWeight: FontWeight.bold, fontFamily: 'Din', package: 'zhiying_base_widget')),
+
+        /// Text
+        Text(text, style: TextStyle(color: HexColor.fromHex(textColor), fontSize: textSize)),
+      ],
+    );
+  }
+}

lib/widgets/team/fans_list/team_fans_number_item.dart

@@ -0,0 +1,55 @@
+import 'package:flutter/material.dart';
+import 'package:zhiying_base_widget/pages/team_page/model/team_style_model.dart';
+import 'package:zhiying_base_widget/widgets/team/fans_list/model/team_fans_list_model.dart';
+import 'package:zhiying_comm/zhiying_comm.dart';
+
+class TeamFansNumberItemWidget extends StatelessWidget {
+  TeamStyleModel styleModel;
+  TeamFansListModel dataModel;
+
+  TeamFansNumberItemWidget(this.styleModel, this.dataModel);
+
+  @override
+  Widget build(BuildContext context) {
+    return Container(
+      alignment: Alignment.center,
+      margin: const EdgeInsets.only(left: 12.5, right: 12.5, top: 8),
+      child: RichText(
+        textAlign: TextAlign.center,
+        text: TextSpan(text: '', children: [
+          TextSpan(
+            text: styleModel?.teamViewItemTitleList[0]?.text ?? '粉丝总人数',
+            style: TextStyle(fontSize: 12, color: HexColor.fromHex(styleModel?.teamViewItemTitleList[0]?.textColor ?? '#333333'), fontWeight: FontWeight.bold),
+          ),
+          TextSpan(
+            text: dataModel?.total ?? '0',
+            style: TextStyle(
+                fontSize: 18,
+                color: HexColor.fromHex(styleModel?.teamViewItemTitleList[0]?.valueColor ?? '#FF4242'),
+                fontFamily: 'Din',
+                package: 'zhiying_base_widget',
+                fontWeight: FontWeight.bold),
+          ),
+          TextSpan(
+            text: styleModel?.teamViewItemTitleList[0]?.unitText ?? '人',
+            style: TextStyle(fontSize: 12, color: HexColor.fromHex(styleModel?.teamViewItemTitleList[0]?.textColor ?? '#333333'), fontWeight: FontWeight.bold),
+          ),
+          TextSpan(
+              text: styleModel?.teamViewItemTitleList[1]?.text ?? '当前分类人数',
+              style: TextStyle(fontSize: 12, color: HexColor.fromHex(styleModel?.teamViewItemTitleList[1]?.textColor ?? '#333333'), fontWeight: FontWeight.bold)),
+          TextSpan(
+              text: dataModel?.categoryCount ?? '0',
+              style: TextStyle(
+                  fontSize: 18,
+                  color: HexColor.fromHex(styleModel?.teamViewItemTitleList[1]?.valueColor ?? '#FF4242'),
+                  fontFamily: 'Din',
+                  package: 'zhiying_base_widget',
+                  fontWeight: FontWeight.bold)),
+          TextSpan(
+              text: styleModel?.teamViewItemTitleList[1]?.unitText ?? '人',
+              style: TextStyle(fontSize: 12, color: HexColor.fromHex(styleModel?.teamViewItemTitleList[1]?.textColor ?? '#333333'), fontWeight: FontWeight.bold)),
+        ]),
+      ),
+    );
+  }
+}

lib/widgets/team/fans_list/team_fans_widget.dart

@@ -0,0 +1,183 @@
+import 'package:flutter/cupertino.dart';
+import 'package:flutter/material.dart';
+import 'package:pull_to_refresh/pull_to_refresh.dart';
+import 'package:zhiying_base_widget/pages/team_page/model/team_style_model.dart';
+import 'package:cached_network_image/cached_network_image.dart';
+import 'package:zhiying_base_widget/widgets/team/fans_list/bloc/team_list_fans_repository.dart';
+import 'package:zhiying_base_widget/widgets/team/fans_list/model/team_fans_list_model.dart';
+import 'package:zhiying_comm/zhiying_comm.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+import 'package:fluttertoast/fluttertoast.dart';
+
+import 'bloc/team_list_fans_bloc.dart';
+import 'team_fans_item.dart';
+import 'team_fans_number_item.dart';
+
+class TeamFansWidget extends StatefulWidget {
+  TeamStyleModel styleModel;
+  final String type;
+
+  TeamFansWidget(this.styleModel, this.type);
+
+  @override
+  _TeamFansWidgetState createState() => _TeamFansWidgetState();
+}
+
+class _TeamFansWidgetState extends State<TeamFansWidget> with AutomaticKeepAliveClientMixin {
+  @override
+  Widget build(BuildContext context) {
+    return BlocProvider<TeamListFansBloc>(
+      create: (_) => TeamListFansBloc(TeamListFansRepository(type: widget?.type)),
+      child: _TeamFansWidgetContainer(widget?.styleModel),
+    );
+  }
+
+  @override
+  bool get wantKeepAlive => true;
+}
+
+class _TeamFansWidgetContainer extends StatefulWidget {
+  TeamStyleModel styleModel;
+
+  _TeamFansWidgetContainer(this.styleModel);
+
+  @override
+  __TeamFansWidgetContainerState createState() => __TeamFansWidgetContainerState();
+}
+
+class __TeamFansWidgetContainerState extends State<_TeamFansWidgetContainer> {
+  RefreshController _refreshController;
+
+  /// 上拉更多
+  void _onLoading() async {
+    // _refreshController.loadComplete();
+    BlocProvider.of<TeamListFansBloc>(context).add(TeamListFansOnLoadEevnt());
+  }
+
+  /// 下拉刷新
+  void _onRefresh() async {
+    // _refreshController.refreshCompleted(resetFooterState: true);
+    BlocProvider.of<TeamListFansBloc>(context).add(TeamListFansOnRefreshEvent());
+  }
+
+  @override
+  void initState() {
+    _refreshController = RefreshController(initialRefresh: true);
+    super.initState();
+  }
+
+  @override
+  void dispose() {
+    _refreshController?.dispose();
+    super.dispose();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    Logger.log('__TeamFansWidgetContainerState build ====== ');
+
+    return BlocConsumer<TeamListFansBloc, TeamListFansState>(
+      listener: (context, current) {
+        Logger.log('listener current current current current current $current');
+        if (current is TeamListFansOnLoadErrorState) {
+          _refreshController?.loadNoData();
+        }
+        if (current is TeamListFansOnLoadSuccessState) {
+          _refreshController?.loadComplete();
+        }
+        if (current is TeamListFansOnRefreshErrorState) {
+          _refreshController?.refreshCompleted();
+        }
+        if (current is TeamListFansOnRefreshSuccessState) {
+          _refreshController?.refreshCompleted();
+          _refreshController?.resetNoData();
+        }
+      },
+      buildWhen: (prov, current) {
+        Logger.log('buildWhen current current current current current $current');
+        if (current is TeamListFansErrorState) {
+          if (prov is TeamListFansLoadedState) {
+            Fluttertoast.showToast(msg: '网络似乎开小差了~');
+          }
+          return false;
+        }
+        // 加载更多成功
+        if (current is TeamListFansOnLoadSuccessState) {
+          return false;
+        }
+
+        // 加载更多失败
+        if (current is TeamListFansOnLoadErrorState) {
+          return false;
+        }
+
+        // 刷新失败
+        if (current is TeamListFansOnRefreshSuccessState) {
+          return false;
+        }
+
+        // 刷新成功
+        if (current is TeamListFansOnRefreshErrorState) {
+          return false;
+        }
+        return true;
+      },
+      builder: (context, state) {
+        return SmartRefresher(
+          onLoading: _onLoading,
+          onRefresh: _onRefresh,
+          enablePullDown: true,
+          enablePullUp: true,
+          // footer: ClassicFooter(),
+          // header: MaterialClassicHeader(),
+          controller: _refreshController,
+          // child: ListView.builder(
+          //   itemBuilder: (context, int) => int == 0 ? TeamFansNumberItemWidget(widget?.styleModel) : TeamFansItem(widget?.styleModel),
+          //   itemCount: 10,
+          // ),
+          child: _getMainWidget(context, state),
+        );
+      },
+    );
+  }
+
+  /// 主视图
+  Widget _getMainWidget(context, state) {
+    if (state is TeamListFansLoadedState) {
+      int lenght = state?.model?.fans?.length ?? 0;
+      if (lenght > 0) {
+        return ListView.builder(
+          itemBuilder: (context, index) {
+            if (index == 0) {
+              return TeamFansNumberItemWidget(widget?.styleModel, state?.model);
+            } else {
+              TeamFansListItemModel itemModel = state.model.fans[index - 1];
+              return TeamFansItem(widget?.styleModel, itemModel);
+            }
+          },
+          itemCount: lenght + 1,
+        );
+      }
+    }
+    return _getEmptyWidget();
+  }
+
+  /// 空数据的视图
+  Widget _getEmptyWidget() {
+    return ListView.builder(
+      itemCount: 1,
+      itemBuilder: (context, int) {
+        return Container(
+          padding: const EdgeInsets.only(top: 40),
+          child: Column(
+            children: <Widget>[
+              CachedNetworkImage(width: 115, imageUrl: widget?.styleModel?.teamViewEmptyImg ?? ''),
+              const SizedBox(height: 26),
+              Text('暂时木有好友呀~', style: TextStyle(color: HexColor.fromHex('#999999'), fontSize: 12)),
+            ],
+          ),
+        );
+      },
+    );
+  }
+}

lib/widgets/team/filter/team_filter_widget.dart

@@ -0,0 +1,90 @@
+import 'package:flutter/material.dart';
+import 'package:zhiying_base_widget/pages/team_page/model/team_style_model.dart';
+import 'package:cached_network_image/cached_network_image.dart';
+import 'package:zhiying_comm/zhiying_comm.dart';
+
+class TeamFilterWidget extends StatefulWidget {
+  TeamStyleModel styleModel;
+
+  TeamFilterWidget(this.styleModel);
+
+  @override
+  _TeamFilterWidgetState createState() => _TeamFilterWidgetState();
+}
+
+class _TeamFilterWidgetState extends State<TeamFilterWidget> {
+  /// 特殊的筛选条件，与其它并存
+  static final String SPECIAL_TYPE = 'relate';
+
+  void _onClick(TeamViewSortList item) {
+    print('item selectState = ${item.selectState}');
+    if (item.type != SPECIAL_TYPE) {
+      widget.styleModel.teamViewSortList.forEach((listItem) {
+        if (listItem.type != SPECIAL_TYPE && listItem.type != item.type) {
+          listItem.selectState = 0;
+        }
+      });
+      item.updateSelectState();
+      setState(() {});
+    } else {
+      item.updateSelectState();
+      setState(() {});
+    }
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Container(
+      height: double.infinity,
+      width: double.infinity,
+      color: HexColor.fromHex('#FFFFFF'),
+      child: Row(
+        mainAxisAlignment: MainAxisAlignment.spaceAround,
+        children: widget.styleModel.teamViewSortList.map((item) {
+          if (item.type != SPECIAL_TYPE) {
+            return _getCustomWidget(
+              item: item,
+              text: item?.name,
+              textColor: item.selectState == 0 ? item?.nameColor : item?.nameSelectedColor,
+              icon: item.selectState == 0 ? item?.icon1 : item.selectState == 1 ? item.icon2 : item.selectState == 2 ? item.icon3 : item.icon1,
+              isSelect: item.selectState != 0
+            );
+          } else {
+            return _getCustomWidget(
+              item: item,
+              text: item.selectState == 0 ? item.args[0].name : item.selectState == 1 ? item.args[1].name : item.selectState == 2 ? item.args[2].name : item.args[0].name,
+              textColor: item?.nameSelectedColor,
+              icon: item?.icon1,
+              isSelect: true
+            );
+          }
+        }).toList(),
+      ),
+    );
+  }
+
+  Widget _getCustomWidget({TeamViewSortList item, String text, String textColor, String icon, bool isSelect = false}) {
+    return GestureDetector(
+      onTap: () => _onClick(item),
+      child: Container(
+        child: Row(
+          children: <Widget>[
+            Text(
+              text ?? '',
+              style: TextStyle(
+                fontSize: 12,
+                color: HexColor.fromHex(textColor),
+                fontWeight: isSelect ? FontWeight.bold : FontWeight.w400
+              ),
+            ),
+            const SizedBox(width: 3),
+            CachedNetworkImage(
+              imageUrl: icon ?? '',
+              height: 10,
+            )
+          ],
+        ),
+      ),
+    );
+  }
+}

lib/widgets/team/input/team_input_widget.dart

@@ -0,0 +1,119 @@
+
+import 'package:flutter/material.dart';
+import 'package:zhiying_base_widget/pages/team_page/model/team_style_model.dart';
+import 'package:cached_network_image/cached_network_image.dart';
+import 'package:zhiying_comm/zhiying_comm.dart';
+
+class TeamInputWidget extends StatefulWidget {
+
+  TeamStyleModel styleModel;
+  TeamInputWidget(this.styleModel);
+
+  @override
+  _TeamInputWidgetState createState() => _TeamInputWidgetState();
+}
+
+class _TeamInputWidgetState extends State<TeamInputWidget> {
+
+  TextEditingController _controller;
+  FocusNode _focusNode;
+
+  /// 搜索方法
+  void _onSearchClick(){}
+
+
+  @override
+  void initState() {
+    _controller = TextEditingController();
+    _focusNode = FocusNode();
+    super.initState();
+  }
+
+  @override
+  void didChangeDependencies() {
+    super.didChangeDependencies();
+  }
+
+  @override
+  void dispose() {
+    _focusNode?.unfocus();
+    _focusNode?.dispose();
+    _controller?.dispose();
+    super.dispose();
+  }
+
+  @override
+  void deactivate() {
+    super.deactivate();
+    _focusNode?.unfocus();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Container(
+      width: double.infinity,
+      height: double.infinity,
+      padding: const EdgeInsets.only(top: 10, left: 12.5, right: 12.5),
+      color: Colors.white,
+      child: Row(
+        children: <Widget>[
+          /// 输入框
+          Expanded(
+            child: Container(
+              height: 24,
+              decoration: BoxDecoration(
+                borderRadius: BorderRadius.circular(30),
+                color: HexColor.fromHex(widget?.styleModel?.headerNoReferrerInputBgColor ?? '#F7F7F7'),
+              ),
+              padding: const EdgeInsets.only(top: 5, bottom: 4.5, left: 7.5, right: 7.5),
+              width: double.infinity,
+              child: Row(
+                children: <Widget>[
+                  // Container(width: 11.5, height: 11.5, color: Colors.red,),
+
+                  CachedNetworkImage(imageUrl: widget?.styleModel?.searchBarLeftIcon, width: 11.5,),
+
+                  Expanded(child: Container(
+                    color: Colors.transparent,
+                    child: TextField(
+                      controller: _controller,
+                      focusNode: _focusNode,
+                      style: TextStyle(fontSize: 11 , color: HexColor.fromHex(widget?.styleModel?.headerNoReferrerInputColor ?? '#000000'), textBaseline: TextBaseline.alphabetic),
+                      decoration: InputDecoration(
+                        focusedBorder: InputBorder.none,
+                        border: InputBorder.none,
+                        focusedErrorBorder: InputBorder.none,
+                        errorBorder: InputBorder.none,
+                        disabledBorder: InputBorder.none,
+                        enabledBorder: InputBorder.none,
+                        filled: true,
+                        isDense: true,
+                        contentPadding: const EdgeInsets.only(left: 6, bottom: 0, top: 0, right: 0),
+                        fillColor: Colors.transparent,
+                        hintStyle: TextStyle(fontSize: 11 , color: HexColor.fromHex(widget?.styleModel?.searchBarHideTextColor ?? '#999999'), textBaseline: TextBaseline.alphabetic),
+                        hintText: widget?.styleModel?.searchBarHideText ?? '输入需搜索的手机号/昵称',
+                      ),
+                    ),
+                  ),),
+                  // Container(width: 15, height: 15, color: Colors.red,)
+                  CachedNetworkImage(imageUrl: widget?.styleModel?.searchBarRightIcon, width: 11.5,),
+                ],
+              ),
+            ),
+          ),
+          const SizedBox(width: 8),
+          ///  确定按钮
+          GestureDetector(
+            behavior: HitTestBehavior.opaque,
+            onTap: ()=> _onSearchClick(),
+            child: Container(
+              decoration: BoxDecoration(borderRadius: BorderRadius.circular(30), color: HexColor.fromHex(widget?.styleModel?.searchBarBtnBgColor ?? '#FF4242')),
+              padding: const EdgeInsets.only(left: 15, right: 15, bottom: 6.5, top: 6.5),
+              child: Text(widget?.styleModel?.searchBarBtnText ?? '搜索', style: TextStyle(color: HexColor.fromHex(widget?.styleModel?.searchBarBtnTextColor ?? '#FFFFFF'), fontSize: 11),),
+            ),
+          )
+        ],
+      ),
+    );
+  }
+}

lib/widgets/team/recommend/bloc/team_recommend_bloc.dart

@@ -0,0 +1,52 @@
+import 'dart:async';
+
+import 'package:bloc/bloc.dart';
+import 'package:equatable/equatable.dart';
+import 'package:zhiying_base_widget/pages/team_page/model/team_data_model.dart';
+import 'package:zhiying_base_widget/widgets/team/recommend/bloc/team_recommend_repository.dart';
+import 'package:zhiying_comm/util/empty_util.dart';
+
+part 'team_recommend_event.dart';
+
+part 'team_recommend_state.dart';
+
+class TeamRecommendBloc extends Bloc<TeamRecommendEvent, TeamRecommendState> {
+  // TeamRecommendBloc() : super(TeamRecommendInitial());
+
+  TeamRecommendRepository repository;
+
+  TeamRecommendBloc(this.repository);
+
+  @override
+  TeamRecommendState get initialState => TeamRecommendInitial();
+
+  @override
+  Stream<TeamRecommendState> mapEventToState(
+    TeamRecommendEvent event,
+  ) async* {
+    /// 初始化数据
+    if (event is TeamRecommendInitEvent) {
+      yield* _mapInitEventToState(event);
+    }
+
+    /// 关联推荐人
+    if (event is TeamRecommendRelateEvent) {
+      yield* _mapRelateEventToState(event);
+    }
+  }
+
+  /// 初始化数据
+  Stream<TeamRecommendState> _mapInitEventToState(TeamRecommendInitEvent event) async* {
+    yield TeamRecommendLoadedState(event?.dataModel);
+  }
+
+  /// 关联推荐人
+  Stream<TeamRecommendState> _mapRelateEventToState(TeamRecommendRelateEvent event) async* {
+    TeamDataModel dataModel = await repository.fetchRelate(event.inviteCode);
+    if (!EmptyUtil.isEmpty(dataModel) && !EmptyUtil.isEmpty(dataModel.referrer_username) && !EmptyUtil.isEmpty(dataModel.referrer_invite_code)) {
+      yield TeamRecommendLoadedState(dataModel);
+    } else {
+      yield TeamRecommendErrorState();
+    }
+  }
+}

lib/widgets/team/recommend/bloc/team_recommend_event.dart

@@ -0,0 +1,26 @@
+part of 'team_recommend_bloc.dart';
+
+abstract class TeamRecommendEvent extends Equatable {
+  const TeamRecommendEvent();
+
+  @override
+  List<Object> get props => [];
+}
+
+class TeamRecommendInitEvent extends TeamRecommendEvent {
+  TeamDataModel dataModel;
+
+  TeamRecommendInitEvent({this.dataModel});
+
+  @override
+  List<Object> get props => [this.dataModel];
+}
+
+class TeamRecommendRelateEvent extends TeamRecommendEvent {
+  final String inviteCode;
+
+  TeamRecommendRelateEvent(this.inviteCode);
+
+  @override
+  List<Object> get props => [this.inviteCode];
+}

lib/widgets/team/recommend/bloc/team_recommend_repository.dart

@@ -0,0 +1,17 @@
+import 'package:zhiying_base_widget/pages/team_page/model/team_data_model.dart';
+import 'package:zhiying_comm/zhiying_comm.dart';
+
+class TeamRecommendRepository {
+  /// 关联我的团队
+  Future<TeamDataModel> fetchRelate(String inviteCode) async {
+    var data = await NetUtil.post('/api/v1/user/myteam/relate', params: {'invite_code': inviteCode}, method: NetMethod.POST);
+    try {
+      if (NetUtil.isSuccess(data) && !EmptyUtil.isEmpty(data[GlobalConfig.HTTP_RESPONSE_KEY_DATA])) {
+        return TeamDataModel.fromJson(data[GlobalConfig.HTTP_RESPONSE_KEY_DATA]);
+      }
+    } catch (e, s) {
+      Logger.log('e = $e, s = $s');
+    }
+    return null;
+  }
+}

lib/widgets/team/recommend/bloc/team_recommend_state.dart

@@ -0,0 +1,24 @@
+part of 'team_recommend_bloc.dart';
+
+abstract class TeamRecommendState extends Equatable {
+  const TeamRecommendState();
+}
+
+class TeamRecommendInitial extends TeamRecommendState {
+  @override
+  List<Object> get props => [];
+}
+
+class TeamRecommendLoadedState extends TeamRecommendState {
+  TeamDataModel model;
+
+  TeamRecommendLoadedState(this.model);
+
+  @override
+  List<Object> get props => [this.model];
+}
+
+class TeamRecommendErrorState extends TeamRecommendState{
+  @override
+  List<Object> get props => [];
+}

lib/widgets/team/recommend/team_recommend_widget.dart

@@ -1,32 +1,100 @@
 import 'package:flutter/material.dart';
+import 'package:zhiying_base_widget/pages/team_page/model/team_data_model.dart';
+import 'package:zhiying_base_widget/pages/team_page/model/team_style_model.dart';
+import 'package:zhiying_base_widget/widgets/team/recommend/bloc/team_recommend_bloc.dart';
+import 'package:zhiying_base_widget/widgets/team/recommend/bloc/team_recommend_repository.dart';
 import 'package:zhiying_comm/zhiying_comm.dart';
+import 'package:cached_network_image/cached_network_image.dart';
+import 'package:fluttertoast/fluttertoast.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
 
 ///
 /// 我的团队 - 我的推荐人
 ///
-class TeamRecommendWidget extends StatefulWidget {
-  // final Map<String, dynamic> data;
-  //
-  // const TeamRecommendWidget(this.data);
+class TeamRecommendWidget extends StatelessWidget {
+  TeamStyleModel styleModel;
+  TeamDataModel dataModel;
+
+  TeamRecommendWidget(this.styleModel, this.dataModel);
+
+  @override
+  Widget build(BuildContext context) {
+    return BlocProvider<TeamRecommendBloc>(
+      create: (_) => TeamRecommendBloc(TeamRecommendRepository())..add(TeamRecommendInitEvent(dataModel: dataModel)),
+      child: _TeamRecommendWidgetContainer(styleModel),
+    );
+  }
+}
+
+class _TeamRecommendWidgetContainer extends StatefulWidget {
+  TeamStyleModel styleModel;
+
+  // TeamDataModel dataModel;
+
+  _TeamRecommendWidgetContainer(this.styleModel);
 
   @override
   _TeamRecommendWidgetState createState() => _TeamRecommendWidgetState();
 }
 
-class _TeamRecommendWidgetState extends State<TeamRecommendWidget> {
+class _TeamRecommendWidgetState extends State<_TeamRecommendWidgetContainer> {
+  TextEditingController _textEditingController;
+  FocusNode _focusNode;
+
+  /// 按钮点击添加事件
+  void _onClickListener() {
+    String text = _textEditingController?.text?.toString()?.trim();
+    if (!EmptyUtil.isEmpty(text)) {
+      BlocProvider.of<TeamRecommendBloc>(context).add(TeamRecommendRelateEvent(text));
+    } else {
+      Fluttertoast.showToast(msg: '邀请码不能为空～');
+    }
+  }
+
+  /// 拷贝
+  void _copyText() {
+    Fluttertoast.showToast(msg: '复制成功~');
+  }
+
+  @override
+  void initState() {
+    _textEditingController = TextEditingController();
+    _focusNode = FocusNode();
+    super.initState();
+  }
+
+  @override
+  void dispose() {
+    _focusNode?.unfocus();
+    _focusNode?.dispose();
+    _textEditingController?.dispose();
+    super.dispose();
+  }
+
   @override
   Widget build(BuildContext context) {
     return Container(
       margin: const EdgeInsets.only(left: 12.5, right: 12.5, top: 10.5),
-      child: _getMainWidget(),
+      child: BlocConsumer<TeamRecommendBloc, TeamRecommendState>(
+        listener: (context, state) {},
+        buildWhen: (prove, current) {
+          if (current is TeamRecommendErrorState) {
+            return false;
+          }
+          return true;
+        },
+        builder: (context, state) {
+          if (state is TeamRecommendLoadedState) {
+            return _getMainWidget(state?.model);
+          }
+          return _getMainWidget(null);
+        },
+      ),
     );
   }
 
-  /// 按钮点击事件
-  void _onClickListener() {}
-
   /// 主体Widget
-  Widget _getMainWidget() {
+  Widget _getMainWidget(TeamDataModel dataModel) {
     return Container(
       padding: const EdgeInsets.only(left: 10, bottom: 12, right: 10),
       decoration: BoxDecoration(borderRadius: BorderRadius.circular(10), color: Colors.white),
@@ -40,9 +108,10 @@ class _TeamRecommendWidgetState extends State<TeamRecommendWidget> {
 
           /// 数据视图
           Visibility(
-            visible: true,
-              replacement: _getInputCombWidget(),
-              child: Padding(padding: const EdgeInsets.only(left: 10), child: _getDataWidget())),
+            visible: !EmptyUtil.isEmpty(dataModel) && !EmptyUtil.isEmpty(dataModel?.referrer_invite_code) && !EmptyUtil.isEmpty(dataModel?.referrer_username),
+            replacement: _getInputCombWidget(),
+            child: Padding(padding: const EdgeInsets.only(left: 10), child: _getDataWidget(dataModel)),
+          ),
         ],
       ),
     );
@@ -50,7 +119,24 @@ class _TeamRecommendWidgetState extends State<TeamRecommendWidget> {
 
   /// 我的推荐人IconWidget(左上角的ICON)
   Widget _getLeftTopWidget() {
-    return Transform.translate(offset: Offset(0, -4.5), child: Container(width: 80, height: 28, color: Colors.red));
+    return Transform.translate(
+        offset: Offset(0, -4.5),
+        child: Container(
+          padding: const EdgeInsets.only(left: 10.5, right: 8, top: 4, bottom: 4.5),
+          decoration: BoxDecoration(
+              borderRadius: BorderRadius.circular(4),
+              gradient: LinearGradient(begin: Alignment.centerLeft, end: Alignment.centerRight, colors: [
+                HexColor.fromHex(widget?.styleModel?.headerReferrerTitleBgColor ?? '#FF5E5E'),
+                HexColor.fromHex(widget?.styleModel?.headerReferrerTitleBgColorT ?? '#FF5252'),
+              ])),
+          child: Text(
+            widget?.styleModel?.headerReferrerTitle ?? '我的推荐人',
+            style: TextStyle(
+              color: HexColor.fromHex(widget?.styleModel?.headerReferrerTitleColor ?? '#FFFFFF'),
+              fontSize: 11,
+            ),
+          ),
+        ));
   }
 
   /// 没邀请人的Widget
@@ -68,7 +154,7 @@ class _TeamRecommendWidgetState extends State<TeamRecommendWidget> {
             width: double.infinity,
             decoration: BoxDecoration(
               borderRadius: BorderRadius.circular(30),
-              color: HexColor.fromHex('#F7F7F7'),
+              color: HexColor.fromHex(widget?.styleModel?.headerNoReferrerInputBgColor ?? '#F7F7F7'),
             ),
             padding: const EdgeInsets.only(top: 3.5, bottom: 3.5, right: 3, left: 13),
             child: Row(
@@ -76,6 +162,7 @@ class _TeamRecommendWidgetState extends State<TeamRecommendWidget> {
                 Expanded(
                   child: _getInputWidget(),
                 ),
+
                 /// 添加的按钮
                 _getAddButtomWidget(),
               ],
@@ -85,18 +172,22 @@ class _TeamRecommendWidgetState extends State<TeamRecommendWidget> {
           const SizedBox(height: 10.5),
 
           /// 文字提示
-          Text('还没有填写邀请人ID，填写后双方都可以获得奖励', style: TextStyle(color: HexColor.fromHex('#909090'), fontSize: 11)),
+          Text(
+            widget?.styleModel?.headerNoReferrerTipText ?? '还没有填写邀请人ID，填写后双方都可以获得奖励',
+            style: TextStyle(color: HexColor.fromHex(widget?.styleModel.headerNoReferrerTipTextColor ?? '#909090'), fontSize: 11),
+          ),
         ],
       ),
     );
   }
 
-
   /// 输入框的
-  Widget _getInputWidget(){
+  Widget _getInputWidget() {
     return TextField(
-      style:TextStyle(color: HexColor.fromHex('#000000'), fontSize: 12, textBaseline: TextBaseline.alphabetic),
-
+      controller: _textEditingController,
+      focusNode: _focusNode,
+      onSubmitted: (value) => _onClickListener(),
+      style: TextStyle(color: HexColor.fromHex(widget?.styleModel?.headerNoReferrerInputColor ?? '#000000'), fontSize: 12, textBaseline: TextBaseline.alphabetic),
       decoration: InputDecoration(
         border: InputBorder.none,
         enabledBorder: InputBorder.none,
@@ -104,54 +195,38 @@ class _TeamRecommendWidgetState extends State<TeamRecommendWidget> {
         errorBorder: InputBorder.none,
         focusedErrorBorder: InputBorder.none,
         focusedBorder: InputBorder.none,
-        hintText: '输入邀请人ID',
+        hintText: widget?.styleModel?.headerNoReferrerIntputText ?? '输入邀请人ID',
         isDense: true,
         filled: true,
         fillColor: Colors.transparent,
         contentPadding: EdgeInsets.zero,
-        hintStyle: TextStyle(color: HexColor.fromHex('#909090'), fontSize: 12, textBaseline: TextBaseline.alphabetic),
+        hintStyle: TextStyle(color: HexColor.fromHex(widget?.styleModel?.headerNoReferrerIntputTextColor ?? '#909090'), fontSize: 12, textBaseline: TextBaseline.alphabetic),
       ),
     );
   }
-  
 
   /// 添加的按钮
   Widget _getAddButtomWidget() {
-    // return Material(
-    //   child: Container(
-    //     height: 24,
-    //     color: Colors.white,
-    //     child: RaisedButton(
-    //       padding: EdgeInsets.zero,
-    //       child: Text('添加', style: TextStyle(fontSize: 13)),
-    //       textColor: HexColor.fromHex('#FFFFFF'),
-    //       color: HexColor.fromHex('#F94B47'),
-    //       disabledColor: HexColor.fromHex('#F94B47'),
-    //       disabledTextColor: HexColor.fromHex('#FFFFFF'),
-    //       elevation: 5,
-    //       shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(24 / 2)),
-    //       onPressed: () => _onClickListener(),
-    //     ),
-    //   ),
-    // );
-
     return Material(
       child: InkWell(
-        onTap: (){},
+        onTap: _onClickListener,
         child: Container(
-          padding: const  EdgeInsets.only(left: 21, right: 21, top: 2.5, bottom: 2.5),
-          decoration: BoxDecoration(
-            borderRadius: BorderRadius.circular(30),
-            color: HexColor.fromHex('#F94B47')
+          padding: const EdgeInsets.only(left: 21, right: 21, top: 2.5, bottom: 2.5),
+          decoration: BoxDecoration(borderRadius: BorderRadius.circular(30), color: HexColor.fromHex(widget?.styleModel?.headerNoReferrerBtnBgColor ?? '#F94B47')),
+          child: Text(
+            widget?.styleModel?.headerNoReferrerBtnText ?? '添加',
+            style: TextStyle(
+              fontSize: 13,
+              color: HexColor.fromHex(widget?.styleModel?.headerNoReferrerBtnTextColor ?? '#FFFFFF'),
+            ),
           ),
-          child: Text('添加', style: TextStyle(fontSize: 13, color:  HexColor.fromHex('#FFFFFF'))),
         ),
       ),
     );
   }
 
   /// 数据视图
-  Widget _getDataWidget() {
+  Widget _getDataWidget(TeamDataModel dataModel) {
     return Row(
       mainAxisAlignment: MainAxisAlignment.start,
       children: <Widget>[
@@ -161,7 +236,7 @@ class _TeamRecommendWidgetState extends State<TeamRecommendWidget> {
         const SizedBox(width: 12),
 
         /// 数据
-        _getDataRightWidget(),
+        _getDataRightWidget(dataModel),
       ],
     );
   }
@@ -176,7 +251,7 @@ class _TeamRecommendWidgetState extends State<TeamRecommendWidget> {
   }
 
   /// 数据右边视图，头像右边的widget
-  Widget _getDataRightWidget() {
+  Widget _getDataRightWidget(TeamDataModel dataModel) {
     return SizedBox(
       height: 55,
       child: Column(
@@ -184,20 +259,20 @@ class _TeamRecommendWidgetState extends State<TeamRecommendWidget> {
         mainAxisAlignment: MainAxisAlignment.spaceBetween,
         children: <Widget>[
           /// 昵称
-          _getNickNameWidget(),
+          _getNickNameWidget(dataModel),
 
           /// 手机号
-          _getPhoneNumberWidget(),
+          _getPhoneNumberWidget(dataModel),
 
           /// 微信号
-          _getWXWidget()
+          _getWXWidget(dataModel)
         ],
       ),
     );
   }
 
   /// 昵称
-  Widget _getNickNameWidget() {
+  Widget _getNickNameWidget(TeamDataModel dataModel) {
     // return  RichText(
     //   text: TextSpan(text: '毛毛虫', style: TextStyle(fontSize: 14, color: HexColor.fromHex('#000000'), fontWeight: FontWeight.bold),
     //     children: [
@@ -212,20 +287,32 @@ class _TeamRecommendWidgetState extends State<TeamRecommendWidget> {
       crossAxisAlignment: CrossAxisAlignment.center,
       children: <Widget>[
         /// 昵称
-        Text('毛毛虫', style: TextStyle(fontSize: 14, color: HexColor.fromHex('#000000'), fontWeight: FontWeight.bold)),
+        Text(dataModel?.referrer_username ?? '',
+            maxLines: 1,
+            overflow: TextOverflow.ellipsis,
+            style: TextStyle(
+              fontSize: 14,
+              color: HexColor.fromHex(widget?.styleModel?.headerReferrerUsernameColor ?? '#000000'),
+              fontWeight: FontWeight.bold,
+            )),
         const SizedBox(width: 6),
-        Text('邀请码：', style: TextStyle(fontSize: 11, color: HexColor.fromHex('#909090'))),
-        Text('123456', style: TextStyle(fontSize: 11, color: HexColor.fromHex('#909090'), fontFamily: 'Din', package: 'zhiying_base_widget')),
+        Text(widget?.styleModel?.headerReferrerInvitecodeText ?? '邀请码：',
+            style: TextStyle(fontSize: 11, color: HexColor.fromHex(widget?.styleModel?.headerReferrerInvitecodeColor ?? '#909090'))),
+        Text(dataModel?.referrer_invite_code ?? '',
+            style: TextStyle(
+                fontSize: 11, color: HexColor.fromHex(widget?.styleModel?.headerReferrerInvitecodeColor ?? '#909090'), fontFamily: 'Din', package: 'zhiying_base_widget')),
       ],
     );
   }
 
   /// 手机号
-  Widget _getPhoneNumberWidget() {
+  Widget _getPhoneNumberWidget(TeamDataModel dataModel) {
     return Row(
       children: <Widget>[
-        Text('手机号：', style: TextStyle(fontSize: 11, color: HexColor.fromHex('#AFAFAF'))),
-        Text('12354678910', style: TextStyle(fontSize: 11, color: HexColor.fromHex('#AFAFAF'), fontFamily: 'Din', package: 'zhiying_base_widget')),
+        Text(widget?.styleModel?.headerReferrerPhoneText ?? '手机号：',
+            style: TextStyle(fontSize: 11, color: HexColor.fromHex(widget?.styleModel?.headerReferrerPhoneColor ?? '#AFAFAF'))),
+        Text(dataModel?.referrer_phone ?? '',
+            style: TextStyle(fontSize: 11, color: HexColor.fromHex(widget?.styleModel?.headerReferrerPhoneColor ?? '#AFAFAF'), fontFamily: 'Din', package: 'zhiying_base_widget')),
         const SizedBox(width: 6),
 
         /// 拷贝按钮
@@ -235,11 +322,12 @@ class _TeamRecommendWidgetState extends State<TeamRecommendWidget> {
   }
 
   /// 微信号
-  Widget _getWXWidget() {
+  Widget _getWXWidget(TeamDataModel dataModel) {
     return Row(
       children: <Widget>[
-        Text('微信号：', style: TextStyle(fontSize: 11, color: HexColor.fromHex('#AFAFAF'))),
-        Text('12354678910', style: TextStyle(fontSize: 11, color: HexColor.fromHex('#AFAFAF'), fontFamily: 'Din', package: 'zhiying_base_widget')),
+        Text(widget?.styleModel?.headerReferrerWxText ?? '微信号：', style: TextStyle(fontSize: 11, color: HexColor.fromHex(widget?.styleModel?.headerReferrerWxColor ?? '#AFAFAF'))),
+        Text(dataModel?.referrer_wechat ?? '',
+            style: TextStyle(fontSize: 11, color: HexColor.fromHex(widget?.styleModel?.headerReferrerWxColor ?? '#AFAFAF'), fontFamily: 'Din', package: 'zhiying_base_widget')),
         const SizedBox(width: 6),
 
         /// 拷贝按钮
@@ -250,19 +338,28 @@ class _TeamRecommendWidgetState extends State<TeamRecommendWidget> {
 
   /// 自定义复制按钮的Widget
   Widget _getCustomCopyWidget() {
-    return Container(
-      padding: const EdgeInsets.only(left: 4, bottom: 2, top: 2, right: 6),
-      decoration: BoxDecoration(
-        color: HexColor.fromHex('#FFF2F2'),
-        borderRadius: BorderRadius.circular(30),
-      ),
-      child: Row(
-        crossAxisAlignment: CrossAxisAlignment.center,
-        children: <Widget>[
-          Container(width: 11, height: 11, color: Colors.red),
-          const SizedBox(width: 4.5),
-          Text('复制', style: TextStyle(fontSize: 8, color: HexColor.fromHex('#F94B47')))
-        ],
+    return GestureDetector(
+      behavior: HitTestBehavior.opaque,
+      onTap: () => _copyText(),
+      child: Container(
+        padding: const EdgeInsets.only(left: 4, bottom: 2, top: 2, right: 6),
+        decoration: BoxDecoration(
+          color: HexColor.fromHex(widget?.styleModel?.headerReferrerCopyBtnBgColor ?? '#FFF2F2'),
+          borderRadius: BorderRadius.circular(30),
+        ),
+        child: Row(
+          crossAxisAlignment: CrossAxisAlignment.center,
+          children: <Widget>[
+            // Container(width: 11, child: CachedNetworkImage(),),
+            CachedNetworkImage(
+              imageUrl: widget?.styleModel?.headerReferrerCopyBtnIcon ?? '',
+              width: 11,
+            ),
+            const SizedBox(width: 4.5),
+            Text(widget?.styleModel?.headerReferrerCopyBtnText ?? '复制',
+                style: TextStyle(fontSize: 8, color: HexColor.fromHex(widget?.styleModel?.headerReferrerCopyBtnTextColor ?? '#F94B47')))
+          ],
+        ),
       ),
     );
   }

lib/widgets/team/tab/team_tab_bar_widget.dart

@@ -0,0 +1,33 @@
+import 'package:flutter/material.dart';
+import 'package:tab_indicator_styler/tab_indicator_styler.dart';
+import 'package:zhiying_comm/zhiying_comm.dart';
+
+class TeamTabBarWidget extends StatelessWidget {
+  TabController controller;
+  var tabTitle;
+
+  TeamTabBarWidget({this.controller, this.tabTitle});
+
+  @override
+  Widget build(BuildContext context) {
+    return TabBar(
+      isScrollable: false,
+      labelStyle: TextStyle(fontWeight: FontWeight.bold, fontSize: 13),
+      unselectedLabelStyle: TextStyle(fontSize: 13),
+      indicator: MaterialIndicator(
+        height: 2,
+        topLeftRadius: 8,
+        topRightRadius: 8,
+        bottomLeftRadius: 8,
+        bottomRightRadius: 8,
+        color: HexColor.fromHex('#F94B47'),
+        horizontalPadding: 30,
+      ),
+      controller: controller,
+      tabs: tabTitle.map((f) => Tab(text: f)).toList(),
+      indicatorColor: Colors.red,
+      unselectedLabelColor: HexColor.fromHex('#999999'),
+      labelColor: HexColor.fromHex('#000000'),
+    );
+  }
+}

lib/widgets/team_details/month_data/team_details_month_data_widget.dart

@@ -0,0 +1,94 @@
+import 'package:zhiying_comm/zhiying_comm.dart';
+import 'package:flutter/material.dart';
+
+class TeamDetailsMonthDataWidget extends StatelessWidget {
+  @override
+  Widget build(BuildContext context) {
+    return _getContentWidget();
+  }
+
+
+  /// content
+  Widget _getContentWidget() {
+    return Container(
+      decoration: BoxDecoration(
+        color: HexColor.fromHex('#FFFFFF'),
+        borderRadius: BorderRadius.circular(10),
+      ),
+      margin: const EdgeInsets.only(left: 12.5, right: 12.5, top: 12.5),
+      padding: const EdgeInsets.only(bottom: 10),
+      child: Column(
+          children: <Widget>[
+            Transform.translate(
+              offset: Offset(0, -5),
+              child: Container(height: 30, width: 82, color: Colors.red),
+            ),
+
+
+            const SizedBox(height: 6),
+            Row(
+              mainAxisAlignment: MainAxisAlignment.spaceEvenly,
+              children: <Widget>[
+
+                /// 今日贡献
+                _getLeftValueWidget(),
+
+                /// 分割线
+                Container(
+                    width: 0.5,
+                    height: 18.5,
+                    child: VerticalDivider(width: 0.5, thickness: 0.5, color: HexColor.fromHex('#F2F2F2'))
+                ),
+
+                /// 贡献收入
+                _getRightValueWidget(),
+              ],
+            ),
+          ]
+      ),
+    );
+  }
+
+  /// 左边
+  Widget _getLeftValueWidget() {
+    return _getCustomWidget(text: '自购订单(个)',
+        textColor: '#999999',
+        textSize: 11,
+        number: '158.58',
+        numberColor: '#333333',
+        numberSize: 17,
+        icon: 'sss');
+  }
+
+  /// 右边
+  Widget _getRightValueWidget() {
+    return _getCustomWidget(text: '预估收益(元）',
+        textColor: '#999999',
+        textSize: 11,
+        number: '158.58',
+        numberColor: '#333333',
+        numberSize: 17,
+        icon: 'sss');
+  }
+
+  /// 自定义Widget
+  Widget _getCustomWidget({String text, String textColor, double textSize, String number, String numberColor, double numberSize, String icon}) {
+    return Column(
+      children: <Widget>[
+
+        /// number
+        Text(number, style: TextStyle(color: HexColor.fromHex(numberColor), fontSize: numberSize, fontWeight: FontWeight.bold)),
+
+        /// text
+        Row(
+          children: <Widget>[
+            Text(text, style: TextStyle(color: HexColor.fromHex(textColor), fontSize: textSize)),
+
+            /// icon
+            Visibility(visible: !EmptyUtil.isEmpty(icon), child: Container(width: 11, height: 11, color: Colors.red))
+          ],
+        )
+      ],
+    );
+  }
+}

lib/widgets/team_details/referrer/team_details_referrer_widget.dart

@@ -0,0 +1,126 @@
+import 'package:flutter/material.dart';
+import 'package:zhiying_comm/zhiying_comm.dart';
+import 'dart:ui' as ui show  PlaceholderAlignment;
+
+class TeamDetailsReferrerWidget extends StatelessWidget {
+  @override
+  Widget build(BuildContext context) {
+    return Container(
+      width: double.infinity,
+      decoration: BoxDecoration(
+        color: HexColor.fromHex('#FFFFFF'),
+        borderRadius: BorderRadius.circular(10),
+      ),
+      margin: const EdgeInsets.only(left: 12.5, right: 12.5, top: 12.5),
+      padding: const EdgeInsets.only(left: 9.5, right: 20, bottom: 10),
+      child: Column(
+        children: <Widget>[
+
+          /// 推荐人图片
+          _getLeftTopWidget(),
+
+          const SizedBox(height: 15),
+
+          /// 头像
+          Padding(padding: const EdgeInsets.only(left: 11.5), child: _getFansInfoWidget()),
+          const SizedBox(height: 10),
+
+          /// 微信号码
+          Padding(padding: const EdgeInsets.only(left: 11.5), child: _getWXNumberInfoWidget()),
+        ],
+      ),
+    );
+  }
+
+  /// 推荐人左上角Icon
+  Widget _getLeftTopWidget(){
+    return Align(
+      alignment: Alignment.topLeft,
+      child: Transform.translate(
+        offset: Offset(0, -5),
+        child: Container(
+          width: 80,
+          height: 23.5,
+          color: Colors.red,
+        ),
+      ),
+    );
+  }
+
+  /// 粉丝头像信息等
+  Widget _getFansInfoWidget() {
+    return Row(
+      children: <Widget>[
+        /// 头像
+        Container(width: 50, height: 50, color: Colors.red),
+        const SizedBox(width: 10),
+
+        /// 信息
+        Column(
+          mainAxisAlignment: MainAxisAlignment.center,
+          crossAxisAlignment: CrossAxisAlignment.start,
+          children: <Widget>[
+            /// 会员等级 关系 昵称
+            RichText(
+              textAlign: TextAlign.center,
+              text: TextSpan(text: '', children: [
+                /// 等级
+                WidgetSpan(alignment: ui.PlaceholderAlignment.middle,child: Container(width: 37, height: 13, color: Colors.red)),
+
+                /// 会员关系
+                WidgetSpan(alignment: ui.PlaceholderAlignment.middle,child: Container(width: 13, height: 13, color: Colors.red, margin: const EdgeInsets.only(left: 3, right: 3))),
+
+                /// 会员名称
+                TextSpan(text: '温***哥', style: TextStyle(color: HexColor.fromHex('#333333'), fontSize: 12, fontWeight: FontWeight.bold))
+              ]),
+            ),
+            const SizedBox(height: 2.5),
+
+            /// 手机号码
+            RichText(
+              textAlign: TextAlign.center,
+              text: TextSpan(text: '', children: [
+                /// 手机号码
+                TextSpan(text: '手机号：', style: TextStyle(color: HexColor.fromHex('#333333'), fontSize: 11)),
+                TextSpan(text: '124****6124', style: TextStyle(color: HexColor.fromHex('#333333'), fontSize: 11, fontFamily: 'Din', package: 'zhiying_base_widget')),
+
+                /// 复制按钮
+                WidgetSpan(alignment: ui.PlaceholderAlignment.middle,child: Container(width: 11, height: 11, color: Colors.red, margin: const EdgeInsets.only(left: 3)))
+              ]),
+            ),
+          ],
+        )
+      ],
+    );
+  }
+
+  /// 微信号码信息
+  Widget _getWXNumberInfoWidget() {
+    return Container(
+      padding: const EdgeInsets.only(left: 9, right: 10, bottom: 6.5, top: 6.5),
+      decoration: BoxDecoration(
+        color: HexColor.fromHex('#F7F7F7'),
+        borderRadius: BorderRadius.circular(5),
+      ),
+      child: Row(
+        mainAxisAlignment: MainAxisAlignment.spaceBetween,
+        children: <Widget>[
+          /// 微信号码
+          RichText(
+            textAlign: TextAlign.center,
+            text: TextSpan(text: '', children: [
+              TextSpan(text: '微信号:', style: TextStyle(color: HexColor.fromHex('#999999'), fontSize: 11, fontWeight: FontWeight.bold)),
+              TextSpan(
+                  text: '54A78',
+                  style: TextStyle(fontWeight: FontWeight.bold, color: HexColor.fromHex('#333333'), fontSize: 11, fontFamily: 'Din', package: 'zhiying_base_widget')),
+              WidgetSpan(alignment: ui.PlaceholderAlignment.middle,child: Container(margin: const EdgeInsets.only(left: 5.5), color: Colors.red, width: 11, height: 11))
+            ]),
+          ),
+
+          /// 最近登陆时间
+          Text('最近登陆 2019-06-28', style: TextStyle(color: HexColor.fromHex('#909090'), fontSize: 11, fontFamily: 'Din', package: 'zhiying_base_widget'))
+        ],
+      ),
+    );
+  }
+}