twong-flutter/lib/widgets/product_item.dart

import 'package:flutter/material.dart';
import 'package:cached_network_image/cached_network_image.dart';

import 'package:twong/utils/index.dart';
import 'package:twong/router/index.dart';
import 'package:twong/models/index.dart';

class ProductItem extends StatelessWidget {
  final Product data;
  final bool _isVip =
      Cache.user?.vip_level != null && Cache.user.vip_level > 0;

  ProductItem(this.data);

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: () {
        Navigator.pushNamed(context,
            RouteNames.productDetails, arguments: data.id);
      },
      child: Container(
        height: 118.px,
        padding: EdgeInsets.all(6.px),
        margin: EdgeInsets.only(top: 6.px, left: 8.px, right: 8.px),
        decoration: BoxDecoration(
            color: Colors.white,
            borderRadius: BorderRadius.circular(6.px)
        ),
        child: Row(
          children: <Widget>[
            CachedNetworkImage(
              width: 118.px,
              height: 118.px,
              fit: BoxFit.scaleDown,
              imageUrl: data.image,
              imageBuilder: (BuildContext context,
                  ImageProvider<dynamic> provider) {
                return Container(
                  decoration: BoxDecoration(
                    image: DecorationImage(
                        image: provider,
                        fit: BoxFit.cover
                    ),
                  ),
                );
              },
              placeholder: (BuildContext context, String str) {
                return Center(child: Utils.loadingWidget);
              },
            ),
            Expanded(child: Container(
                margin: EdgeInsets.only(left: 10.px, right: 10.px),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Container(
                      height: 32.px,
                      child: Text(data.store_name,
                          style: TextStyle(
                              fontWeight: FontWeight.bold, fontSize: 12.px)),
                    ),
                    Container(child: Row(
                      children: [
                        Icon(IconFonts.done_outline, color: Colors.grey, size: 12.px),
                        Text(" 官方直营 信誉保障",
                            style: TextStyle(color: Colors.grey, fontSize: 10.px)),
                      ],
                    )),
                    Spacer(),
                    Row(
                      crossAxisAlignment: CrossAxisAlignment.end,
                      children: [
                        Expanded(child: _genPrice(data)),
                        Text("最近销量: ${data.sales}", style:
                        TextStyle(color: Colors.grey, fontSize: 10.px))
                      ],)
                  ],
                )),
            ),
          ],
        ),
      ),
    );
  }

  Widget _getVipPrice(dynamic price, { Color color, Widget leading }) {
    return Row(
      crossAxisAlignment: CrossAxisAlignment.center,
      children: [
        Container(
          child: leading,
          margin: EdgeInsets.only(right: 4.px),
        ),
        RichText(
            text: TextSpan(
                text: I18n.$, style: TextStyle(color: color, fontSize: 10.px),
                children: [
                  TextSpan(text: Utils.formatRMB(price),
                    style: TextStyle(color: color, fontSize: 12.px),
                  )
                ])
        ),
      ]);
  }

  Widget _genPrice(Product data) {
    if (_isVip) {
      return Container(
        margin: EdgeInsets.only(left: 6.px),
        child: Column(
          children: [
            _getVipPrice(data.vip_price, color: Colors.red, leading: Text("会:",
                style: TextStyle(fontSize: 12.px))),
            _getVipPrice(data.price, color: Colors.black87, leading: Text("购:",
                style: TextStyle(fontSize: 12.px))),
            _getVipPrice(num.parse(data.price) -
                (data.vip_price == null ? 0 : num.parse(data.vip_price)),
                color: Colors.green, leading: Text("赚:",
                    style: TextStyle(fontSize: 12.px))),
          ],
        ),
      );
    }
    return Container(
        child: RichText(
            text: TextSpan(
                text: I18n.$,
                style: TextStyle(color: Colors.red, fontSize: 12.px),
                children: [
                  TextSpan(text: data.price,
                      style: TextStyle(color: Colors.red, fontSize: 16.px),
                      children: [
                        TextSpan(text: "  ${I18n.$}",
                            style: TextStyle(
                                color: Colors.grey, fontSize: 12.px)
                        ),
                        TextSpan(text: Utils.formatRMB(data.price),
                            style: TextStyle(
                                color: Colors.grey, fontSize: 14.px,
                                decoration: TextDecoration.lineThrough)
                        )
                      ])
                ])
        ));
  }
}