update use page

lib/pages/shop/cumulative_income_page.dart

@@ -79,7 +79,8 @@ class _CumulativeIncomePageState extends BaseStoreState<CumulativeIncomePage>
                 children: <Widget>[
                   _barWidget(),
                   _selectTimeWidget(),
-                  _infoWidget()
+                  _infoWidgetV2(),
+                  _infoWidget(),
                 ],
               ))
         ],
@@ -298,6 +299,96 @@ class _CumulativeIncomePageState extends BaseStoreState<CumulativeIncomePage>
     );
   }
 
+  _infoWidgetV2() {
+    return Container(
+      constraints: BoxConstraints(minHeight: 200),
+      decoration: BoxDecoration(
+          image: DecorationImage(
+        // centerSlice: Rect.fromLTRB(30, 90, 30, 30),
+        centerSlice: Rect.fromLTWH(30, 100, 30, 1),
+        image: AssetImage(R.ASSETS_SHOP_PAGE_INCOME_PAGE_BG_PNG),
+      )),
+      child: Column(
+        mainAxisSize: MainAxisSize.min,
+        crossAxisAlignment: CrossAxisAlignment.stretch,
+        children: [
+          10.hb,
+          [
+            64.hb,
+            30.wb,
+            '月度收益'.text.size(14).black.bold.make(),
+            Spacer(),
+            '共${3}期收益'.text.size(14).color(Colors.black38).make(),
+            30.wb,
+          ].row(),
+          DashedRect(
+            color: Color(0xFFE6E6E6),
+          ).pSymmetric(h: 15.w),
+          20.hb,
+          ...<Widget>[
+            _buildInfoItem(isFirst: true),
+            _buildInfoItem(),
+            _buildInfoItem(),
+            _buildInfoItem(),
+            _buildInfoItem(),
+          ].sepWidget(separate: 20.hb),
+          30.hb,
+        ],
+      ),
+    );
+  }
+
+  _buildInfoItem({
+    int month,
+    int benefit,
+    bool isFirst = false,
+  }) {
+    return [
+      VxBox(
+        child: Column(
+          children: [
+            Row(),
+          ],
+        ),
+      )
+          //TODO unknown height
+          .height(168.w)
+          .color(Color(0xFFF7F8FA))
+          .padding(EdgeInsets.all(15.w))
+          .margin(EdgeInsets.symmetric(horizontal: 30.w))
+          .withRounded(value: 5.w)
+          .make(),
+      isFirst
+          ? SizedBox()
+          : Positioned(
+              left: 40.w,
+              top: -30.w,
+              child: Container(
+                height: 40.w,
+                width: 3.w,
+                decoration: BoxDecoration(
+                  color: Color(0xFFD5101A),
+                  borderRadius: BorderRadius.circular(3.w),
+                ),
+              ),
+            ),
+      isFirst
+          ? SizedBox()
+          : Positioned(
+              right: 40.w,
+              top: -30.w,
+              child: Container(
+                height: 40.w,
+                width: 3.w,
+                decoration: BoxDecoration(
+                  color: Color(0xFFD5101A),
+                  borderRadius: BorderRadius.circular(3.w),
+                ),
+              ),
+            ),
+    ].stack(clip: Clip.none);
+  }
+
   _infoWidget() {
     double width = ScreenUtil.screenWidthDp;
     double height = 140 * width / 375;

lib/pages/user/invite/my_group_page.dart

@@ -1,4 +1,6 @@
 import 'package:flutter/material.dart';
+import 'package:recook/pages/user/widget/user_group_card.dart';
+import 'package:recook/utils/user_level_tool.dart';
 import 'package:recook/widgets/custom_image_button.dart';
 import 'package:recook/widgets/recook_back_button.dart';
 import 'package:velocity_x/velocity_x.dart';
@@ -91,6 +93,24 @@ class _MyGroupPageState extends State<MyGroupPage> {
     );
   }
 
+  _buildGroupCards() {
+    return ListView.separated(
+      padding: EdgeInsets.symmetric(horizontal: 15.w, vertical: 10.w),
+      separatorBuilder: (_, __) => 10.hb,
+      itemBuilder: (context, index) {
+        //TODO
+        return UserGroupCard(
+          name: 'TESTNAME(TEST)',
+          groupCount: 6,
+          phone: '18291010101',
+          shopRole: UserRoleLevel.Vip,
+          wechatId: 'TEST',
+        );
+      },
+      itemCount: 10,
+    ).expand();
+  }
+
   @override
   Widget build(BuildContext context) {
     return Scaffold(
@@ -105,6 +125,8 @@ class _MyGroupPageState extends State<MyGroupPage> {
         children: [
           _buildSearchButton(),
           _buildTitleBar(),
+          10.hb,
+          _buildGroupCards(),
         ],
       ),
     );

lib/pages/user/widget/user_group_card.dart

@@ -0,0 +1,104 @@
+import 'package:flutter/material.dart';
+import 'package:recook/utils/user_level_tool.dart';
+import 'package:recook/widgets/custom_image_button.dart';
+import 'package:velocity_x/velocity_x.dart';
+import 'package:recook/constants/header.dart';
+
+class UserGroupCard extends StatefulWidget {
+  final String name;
+  final String wechatId;
+  final String phone;
+  final UserRoleLevel shopRole;
+  final int groupCount;
+
+  //options
+  final bool flat;
+  UserGroupCard({
+    Key key,
+    @required this.name,
+    @required this.wechatId,
+    @required this.phone,
+    @required this.shopRole,
+    @required this.groupCount,
+  })  : flat = false,
+        super(key: key);
+
+  UserGroupCard.flat({
+    Key key,
+    @required this.name,
+    @required this.wechatId,
+    @required this.phone,
+    @required this.shopRole,
+    @required this.groupCount,
+  })  : flat = true,
+        super(key: key);
+
+  @override
+  _UserGroupCardState createState() => _UserGroupCardState();
+}
+
+class _UserGroupCardState extends State<UserGroupCard> {
+  Widget _buildTile(String path, String title) {
+    return Row(
+      children: [
+        Image.asset(
+          path,
+          height: 12.w,
+          width: 12.w,
+        ),
+        4.wb,
+        title.text.color(Colors.black38).make().expand(),
+      ],
+    );
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return CustomImageButton(
+      color: Colors.white,
+      onPressed: () {},
+      child: VxBox(
+        child: [
+          CircleAvatar(
+            radius: 20.w,
+          ),
+          10.wb,
+          <Widget>[
+            GestureDetector(
+              child: [
+                widget.name.text.black.make(),
+                6.wb,
+                Image.asset(
+                  R.ASSETS_INVITE_DETAIL_EDIT_PNG,
+                  height: 12.w,
+                  width: 12.w,
+                ),
+                Spacer(),
+              ].row(),
+              onTap: () {},
+            ),
+            4.hb,
+            [
+              _buildTile(R.ASSETS_USER_ICON_WECHAT_PNG, 'WEIXINXXXX').expand(),
+              _buildTile(R.ASSETS_USER_ICON_PHONE_PNG, '18295849102X').expand(),
+            ].row(),
+            4.hb,
+            [
+              _buildTile(
+                UserLevelTool.getRoleLevelIcon(UserRoleLevel.Gold),
+                'WEIXINXXXX',
+              ).expand(),
+              _buildTile(R.ASSETS_USER_ICON_GROUP_PNG, '9').expand(),
+            ].row(),
+          ].column().expand(),
+        ].row(crossAlignment: CrossAxisAlignment.start),
+      )
+          .padding(EdgeInsets.symmetric(horizontal: 15.w, vertical: 10.w))
+          .withDecoration(BoxDecoration(
+            color: Colors.white,
+            borderRadius: BorderRadius.circular(widget.flat ? 0 : 5.w),
+          ))
+          .make(),
+    );
+  }
+}

lib/utils/user_level_tool.dart

@@ -162,7 +162,7 @@ class UserLevelTool {
     }
   }
 
-  static String get userCardBackground{
+  static String get userCardBackground {
     switch (UserLevelTool.currentRoleLevelEnum()) {
       case UserRoleLevel.Diamond:
         return R.ASSETS_USER_DIAMOND_WEBP;
@@ -432,4 +432,25 @@ class UserLevelTool {
     }
     return UserRoleLevel.Vip;
   }
+
+  ///获取用户的名片的角色 icon
+  static String getRoleLevelIcon(UserRoleLevel level) {
+    switch (level) {
+      case UserRoleLevel.Diamond:
+        return R.ASSETS_USER_ICON_DIAMOND_PNG;
+      case UserRoleLevel.Gold:
+        return R.ASSETS_USER_ICON_GOLD_PNG;
+      case UserRoleLevel.Silver:
+        return R.ASSETS_USER_ICON_SLIVER_PNG;
+      case UserRoleLevel.Master:
+        return R.ASSETS_USER_ICON_MASTER_PNG;
+      case UserRoleLevel.Vip:
+        return R.ASSETS_USER_ICON_VIP_PNG;
+      default:
+        return R.ASSETS_PLACEHOLDER_NEW_1X1_A_PNG;
+    }
+  }
+
+  ///当前用户的名片角色
+  static String get roleLevelIcon => getRoleLevelIcon(currentRoleLevelEnum());
 }