huixiang_app/lib/order/order_history_page.dart

import 'package:flutter/material.dart';
import 'package:huixiang/generated/l10n.dart';
import 'package:huixiang/view_widget/my_tab.dart';
import 'package:huixiang/view_widget/round_button.dart';
import 'package:bubble_tab_indicator/bubble_tab_indicator.dart';

class OrderHistoryPage extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return _OrderHistoryPage();
  }
}

class _OrderHistoryPage extends State<OrderHistoryPage>
    with SingleTickerProviderStateMixin {
  List<Widget> tabs;
  List<Widget> _pages;
  TabController tabcontroller;

  @override
  void initState() {
    super.initState();
  }

  @override
  void didChangeDependencies() {
    super.didChangeDependencies();
    if (tabcontroller == null)
      tabcontroller = TabController(length: 4, vsync: this);
    tabs = [
      MyTab(
        text: S.of(context).quanbu,
      ),
      MyTab(
        text: S.of(context).daifukuan,
      ),
      MyTab(
        text: S.of(context).weiwancheng,
      ),
      MyTab(
        text: S.of(context).yiwancheng,
      )
    ];
    _pages = [
      OrderHistoryList(0),
      OrderHistoryList(1),
      OrderHistoryList(2),
      OrderHistoryList(3)
    ];
  }

  @override
  Widget build(BuildContext context) {
    return DefaultTabController(
      length: 3,
      child: Scaffold(
        appBar: AppBar(
          title: Text(
            S.of(context).dingdan,
            style: TextStyle(
              color: Colors.black,
              fontWeight: FontWeight.bold,
              fontSize: 18,
            ),
          ),
          centerTitle: false,
          backgroundColor: Color(0xFFFFFFFF),
          elevation: 0,
          leading: GestureDetector(
            onTap: () {
              Navigator.of(context).pop();
            },
            child: Container(
              alignment: Alignment.centerRight,
              margin: EdgeInsets.only(left: 10),
              padding: EdgeInsets.all(6),
              child: Icon(
                Icons.arrow_back_ios,
                color: Colors.black,
                size: 24,
              ),
            ),
          ),
          titleSpacing: 2,
          leadingWidth: 56,
          bottom: PreferredSize(
            preferredSize: Size(double.infinity, 38),
            child: TabBar(
              controller: tabcontroller,
              indicatorWeight: 2,
              indicatorSize: TabBarIndicatorSize.label,
              indicatorColor: Color(0xFF39B54A),
              indicatorPadding: EdgeInsets.only(top: 3),
              unselectedLabelStyle:
                  TextStyle(fontSize: 16, fontWeight: FontWeight.normal),
              labelStyle: TextStyle(
                color: Colors.black,
                fontSize: 16,
                fontWeight: FontWeight.bold,
              ),
              labelColor: Colors.black,
              tabs: tabs,
            ),
          ),
        ),
        body: TabBarView(
          children: _pages,
          controller: tabcontroller,
        ),
      ),
    );
  }
}

class OrderHistoryList extends StatefulWidget {
  final int orderStatus;

  OrderHistoryList(this.orderStatus);

  @override
  State<StatefulWidget> createState() {
    return _OrderHistoryList();
  }
}

class _OrderHistoryList extends State<OrderHistoryList> {
  @override
  Widget build(BuildContext context) {
    return ListView.builder(
        itemCount: 8,
        itemBuilder: (context, position) {
          return GestureDetector(
            onTap: () {
              Navigator.of(context).pushNamed('/router/order_details');
            },
            child: orderItem(),
          );
        });
  }

  bool isRemake = true;

  var statusStr = "";

  @override
  void initState() {
    super.initState();
    switch (widget.orderStatus) {
      case 0:
        statusStr = "待支付";
        break;
      case 1:
        statusStr = "待支付";
        break;
      case 2:
        statusStr = "已发货";break;
      default:
        statusStr = "已完成";
        break;
    }
  }

  Widget orderItem() {
    return Container(
      margin: EdgeInsets.fromLTRB(16, 8, 16, 8),
      decoration: BoxDecoration(
          color: Colors.white,
          borderRadius: BorderRadius.circular(4),
          boxShadow: [
            BoxShadow(
                color: Colors.black.withAlpha(12),
                offset: Offset(0, 3),
                blurRadius: 14,
                spreadRadius: 0)
          ]),
      child: Column(
        mainAxisAlignment: MainAxisAlignment.spaceAround,
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Container(
                width: 19,
                height: 19,
                margin: EdgeInsets.only(left: 12, top: 12),
                alignment: Alignment.center,
                decoration: new BoxDecoration(
                  color: Color(0xff32A060),
                  borderRadius: BorderRadius.circular(2),
                ),
                child: Text("自",
                    style: TextStyle(
                        fontSize: 12,
                        fontWeight: FontWeight.bold,
                        color: Colors.white)),
              ),
              Expanded(
                child: Container(
                  width: double.infinity,
                  margin: EdgeInsets.only(left: 6, top: 12),
                  alignment: Alignment.centerLeft,
                  child: Text(
                    "前进麦味·天然烘焙(凯德1818店)",
                    style: TextStyle(
                      fontWeight: FontWeight.bold,
                      fontSize: 14,
                      color: Color(0xFF353535),
                    ),
                  ),
                ),
                flex: 1,
              ),
              Padding(
                padding: EdgeInsets.only(top: 12, right: 12),
                child: Text(statusStr,
                    style: TextStyle(
                        fontSize: 14,
                        fontWeight: FontWeight.bold,
                        color: Color(0xffFE951E))),
              ),
            ],
          ),
          Container(
            margin: EdgeInsets.only(left: 37),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              crossAxisAlignment: CrossAxisAlignment.center,
              children: [
                Column(
                  mainAxisAlignment: MainAxisAlignment.spaceAround,
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Text(
                      S.of(context).xiadanshijian_("2020.01.20~2020.1.21"),
                      style: TextStyle(
                        fontSize: 10,
                        color: Color(0xFF727272),
                      ),
                    ),
                    SizedBox(
                      height: 8,
                    ),
                    Column(
                      mainAxisAlignment: MainAxisAlignment.spaceAround,
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Image.network(
                          "https://t7.baidu.com/it/u=1348120667,563487140&fm=193&f=GIF",
                          width: 75,
                          height: 75,
                          fit: BoxFit.contain,
                        ),
                        SizedBox(
                          height: 4,
                        ),
                        if (isRemake)
                          Text(
                            "桑葚椰汁水果茶",
                            style: TextStyle(
                              fontSize: 10,
                              color: Color(0xFF353535),
                            ),
                          ),
                      ],
                    ),
                  ],
                ),
                Padding(
                  padding: EdgeInsets.only(right: 22),
                  child: Image.asset(
                    "assets/image/icon_more.png",
                    fit: BoxFit.fill,
                    alignment: Alignment.centerRight,
                    width: 24,
                    height: 24,
                  ),
                )
              ],
            ),
          ),
          SizedBox(
            height: 12,
          ),
          Container(
            margin: EdgeInsets.only(right: 12, bottom: 12),
            child: Directionality(
                textDirection: TextDirection.rtl,
                child: Column(
                  children: [
                    Row(
                      mainAxisAlignment: MainAxisAlignment.start,
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Text.rich(TextSpan(children: [
                          TextSpan(
                            text: "合计:",
                            style: TextStyle(
                              fontSize: 12,
                              color: Color(0xFF868686),
                            ),
                          ),
                          TextSpan(
                            text: S.of(context).yuan("58.2"),
                            style: TextStyle(
                              fontSize: 12,
                              fontWeight: FontWeight.bold,
                              color: Colors.black,
                            ),
                          ),
                        ])),
                        SizedBox(
                          width: 4,
                        ),
                        Text.rich(TextSpan(children: [
                          TextSpan(
                            text: "共",
                            style: TextStyle(
                              fontSize: 12,
                              color: Color(0xFF868686),
                            ),
                          ),
                          TextSpan(
                            text: "5",
                            style: TextStyle(
                              fontSize: 12,
                              fontWeight: FontWeight.bold,
                              color: Colors.black,
                            ),
                          ),
                          TextSpan(
                            text: "件",
                            style: TextStyle(
                              fontSize: 12,
                              color: Color(0xFF868686),
                            ),
                          ),
                        ])),
                      ],
                    ),
                    SizedBox(
                      height: 8,
                    ),
                    Row(
                      children: [
                        if (widget.orderStatus == 2)
                          RoundButton(
                            text: "确认收货",
                            textColor: Colors.white,
                            fontSize: 12,
                            backgroup: Color(0xFF32A060),
                            radius: 2,
                            padding: EdgeInsets.fromLTRB(17, 4, 17, 4),
                          ),
                        if (widget.orderStatus == 2)
                          Container(
                            width: 72,
                            height: 24,
                            margin: EdgeInsets.only(right: 10),
                            child: TextButton(
                              onPressed: () {
                                Navigator.of(context).pushNamed('/router/logistics_information_page');
                              },
                              style: ButtonStyle(
                                padding:
                                MaterialStateProperty.all(EdgeInsets.zero),
                                side: MaterialStateProperty.all(
                                  BorderSide(
                                      color: Color(0xff32A060), width: 0.5),
                                ),
                              ),
                              child: Text(
                                "查看物流",
                                style: TextStyle(
                                    color: Color(0xff32A060), fontSize: 12),
                              ),
                            ),
                          ),
                        if (widget.orderStatus == 3)
                          RoundButton(
                            text: "再来一单",
                            textColor: Colors.white,
                            fontSize: 12,
                            backgroup: Color(0xFF32A060),
                            radius: 2,
                            padding: EdgeInsets.fromLTRB(17, 4, 17, 4),
                          ),
                        if (widget.orderStatus == 3)
                          Container(
                            width: 72,
                            height: 24,
                            margin: EdgeInsets.only(right: 10),
                            child: TextButton(
                              onPressed: () {},
                              style: ButtonStyle(
                                padding:
                                    MaterialStateProperty.all(EdgeInsets.zero),
                                side: MaterialStateProperty.all(
                                  BorderSide(
                                      color: Color(0xff32A060), width: 0.5),
                                ),
                              ),
                              child: Text(
                                "删除一单",
                                style: TextStyle(
                                    color: Color(0xff32A060), fontSize: 12),
                              ),
                            ),
                          ),
                        if (widget.orderStatus == 0 || widget.orderStatus == 1)
                          RoundButton(
                            text: S.of(context).quzhifu,
                            textColor: Colors.white,
                            fontSize: 12,
                            backgroup: Color(0xFF32A060),
                            radius: 2,
                            padding: EdgeInsets.fromLTRB(17, 4, 17, 4),
                          ),
                        SizedBox(
                          width: 10,
                        ),
                        if (widget.orderStatus == 0 || widget.orderStatus == 1)
                          Container(
                            width: 72,
                            height: 24,
                            child: TextButton(
                              onPressed: () {},
                              style: ButtonStyle(
                                padding:
                                    MaterialStateProperty.all(EdgeInsets.zero),
                                side: MaterialStateProperty.all(
                                  BorderSide(
                                      color: Color(0xff32A060), width: 0.5),
                                ),
                              ),
                              child: Text(
                                S.of(context).quxiaozhifu,
                                style: TextStyle(
                                    color: Color(0xff32A060), fontSize: 12),
                              ),
                            ),
                          ),
                        if (widget.orderStatus == 3)
                          Expanded(
                            flex: 1,
                            child: Container(
                              margin: EdgeInsets.only(left: 37),
                              alignment: Alignment.centerLeft,
                              child: Text(
                                "取单号 201",
                                style: TextStyle(
                                    fontSize: 16,
                                    fontWeight: FontWeight.bold,
                                    color: Colors.black),
                              ),
                            ),
                          ),
                      ],
                    ),
                  ],
                )),
          ),
        ],
      ),
    );
  }
}