import 'package:dio/dio.dart'; import 'package:flutter/material.dart'; import 'package:fluttertoast/fluttertoast.dart'; import 'package:huixiang/generated/l10n.dart'; import 'package:huixiang/retrofit/data/base_data.dart'; import 'package:huixiang/retrofit/data/order_info.dart'; import 'package:huixiang/retrofit/retrofit_api.dart'; import 'package:huixiang/view_widget/border_text.dart'; import 'package:huixiang/view_widget/pay_input_view.dart'; import 'package:huixiang/view_widget/round_button.dart'; import 'package:huixiang/view_widget/separator.dart'; import 'package:shared_preferences/shared_preferences.dart'; import 'package:flutter_screenutil/flutter_screenutil.dart'; class OrderDetailPage extends StatefulWidget { final arguments; OrderDetailPage({this.arguments}); @override State createState() { return _OrderDetailPage(); } } class _OrderDetailPage extends State { ApiService apiService; @override void initState() { super.initState(); SharedPreferences.getInstance().then((value) { apiService = ApiService(Dio(), context: context, token: value.getString("token")); queryDetails(); }); } OrderInfo orderInfo; queryDetails() async { BaseData baseData = await apiService.orderDetail(widget.arguments["id"]); if (baseData != null && baseData.isSuccess) { orderInfo = OrderInfo.fromJson(baseData.data); setState(() {}); } else { Fluttertoast.showToast(msg: baseData.msg); } } @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title: Text( S.of(context).jinxingzhongdedingdan, style: TextStyle(color: Colors.white), ), centerTitle: false, backgroundColor: Color(0xFF3A405A), brightness: Brightness.dark, elevation: 0, leading: GestureDetector( onTap: () { Navigator.of(context).pop(); }, child: Container( alignment: Alignment.centerRight, margin: EdgeInsets.only(left: 10.w), padding: EdgeInsets.all(6), child: Icon( Icons.arrow_back_ios, color: Colors.white, size: 24, ), ), ), titleSpacing: 2, leadingWidth: 56.w, bottom: PreferredSize( preferredSize: Size(double.infinity, 88.h), child: Container( height: 88.h, padding: EdgeInsets.fromLTRB(16.w, 0, 16.w, 14.h), child: Row( mainAxisAlignment: MainAxisAlignment.end, crossAxisAlignment: CrossAxisAlignment.end, children: [ Expanded( child: Column( mainAxisAlignment: MainAxisAlignment.spaceBetween, crossAxisAlignment: CrossAxisAlignment.start, children: [ Container( height: 20.h, width: 82.w, decoration: BoxDecoration( borderRadius: BorderRadius.circular(15), border: Border.all( width: 1.w, color: Color(0xFF32A060), ), ), child: Stack( alignment: Alignment.lerp( Alignment.centerLeft, Alignment.centerRight, 0, ), children: [ Positioned( left: 0, child: GestureDetector( onTap: () { setState(() { type = 0; }); }, child: RoundButton( text: S.of(context).ziqu, width: 42.w, height: 20.h, textColor: Colors.white, padding: EdgeInsets.fromLTRB(8.w, 1.h, 8.w, 1.h), backgroup: type == 0 ? Color(0xFF32A060) : Colors.transparent, radius: 15, ), ), ), Positioned( right: 0, child: GestureDetector( onTap: () { setState(() { type = 1; }); }, child: RoundButton( text: S.of(context).waisong, width: 42.w, height: 20.h, textColor: Colors.white, padding: EdgeInsets.fromLTRB(8.w, 1.h, 8.w, 1.h), backgroup: type == 1 ? Color(0xFF32A060) : Colors.transparent, radius: 15, ), ), ), ], ), ), Text( S.of(context).qingzaiguidingshijianneizhifu, style: TextStyle( color: Colors.white, fontSize: 12.sp, ), ), ], ), ), Container( height: 33.h, child: Row( mainAxisSize: MainAxisSize.min, children: [ AspectRatio( aspectRatio: 1, child: BorderText( text: "02", textColor: Colors.white, fontSize: 21.sp, fontWeight: FontWeight.bold, borderColor: Colors.white, borderWidth: 1, padding: EdgeInsets.all(2), ), ), SizedBox( width: 8.w, ), Text( ":", style: TextStyle( color: Colors.white, fontSize: 21.sp, ), ), SizedBox( width: 8.w, ), AspectRatio( aspectRatio: 1, child: BorderText( text: "02", textColor: Colors.white, fontSize: 21.sp, fontWeight: FontWeight.bold, borderColor: Colors.white, borderWidth: 1, padding: EdgeInsets.all(2), ), ), ], ), ) ], ), ), ), ), body: Container( child: Stack( children: [ Container( height: 36.h, color: Color(0xFF3A405A), ), SingleChildScrollView( physics: BouncingScrollPhysics(), child: Container( child: Column( children: [ buildAddress(), buildCommodity(), buildOrderInfo(), Container( height: 42.h, ), ], ), ), ), ], ), ), ); } var type = 0; Widget buildAddress() { return Container( margin: EdgeInsets.only(left: 16.w, right: 16.w, top: 4.h, bottom: 2.h), padding: EdgeInsets.all(20), decoration: BoxDecoration( color: Colors.white, boxShadow: [ BoxShadow( color: Colors.black.withAlpha(12), offset: Offset(0, 3), blurRadius: 14, spreadRadius: 0, ), ], borderRadius: BorderRadius.all(Radius.circular(8)), ), child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ Row( children: [ Image.asset( "assets/image/icon_location_address.png", width: 28.w, height: 28.h, ), Expanded( child: Text( "前进麦味·天然烘焙(凯德1818店)", overflow: TextOverflow.ellipsis, style: TextStyle( fontSize: 14.sp, color: Color(0xFF4C4C4C), ), ), ), Icon( Icons.keyboard_arrow_right, size: 16, color: Colors.black, ) ], ), Container( margin: EdgeInsets.only(left: 28.w), child: Text( "武昌区中国铁建凯德1818蓝调步行街中北路109附33门牌号05", overflow: TextOverflow.ellipsis, style: TextStyle( fontSize: 10.sp, color: Color(0xFFA29E9E), ), ), ), Container( margin: EdgeInsets.only(top: 20.h, bottom: 16.h), child: MySeparator( width: 5.w, height: 1.h, color: Color(0xFFA29E9E), ), ), Row( mainAxisAlignment: MainAxisAlignment.spaceEvenly, crossAxisAlignment: CrossAxisAlignment.center, children: [ Column( children: [ Image.asset( "assets/image/icon_order_cancel.png", width: 24.w, height: 24.h, fit: BoxFit.contain, ), SizedBox( height: 8.h, ), Text( S.of(context).quxiaodingdan, style: TextStyle( color: Color(0xFF353535), fontSize: 12.sp, ), ) ], ), GestureDetector( onTap: () { showModalBottomSheet( context: context, builder: (context) { return PayInputWidget(); }); }, child: Column( children: [ Image.asset( "assets/image/icon_order_renminbi.png", width: 24.w, height: 24.h, fit: BoxFit.contain, ), SizedBox( height: 8.h, ), Text( S.of(context).jixuzhifu, style: TextStyle( color: Color(0xFF32A060), fontSize: 12.sp, ), ) ], ), ), ], ), ], ), ); } Widget buildCommodity() { return Stack( alignment: Alignment.centerRight, children: [ Container( margin: EdgeInsets.only(left: 16.w, right: 16.w, top: 2.h, bottom: 8.h), padding: EdgeInsets.only(left: 20.w, right: 20.w, top: 12.h, bottom: 12.h), decoration: BoxDecoration( color: Colors.white, boxShadow: [ BoxShadow( color: Colors.black.withAlpha(12), offset: Offset(0, 1), blurRadius: 12, spreadRadius: 0) ], borderRadius: BorderRadius.all(Radius.circular(8)), ), child: Column( mainAxisAlignment: MainAxisAlignment.spaceAround, children: commodityList(), ), ), buildQrCode() ], ); } List commodityList() { return [ commodityItem(), commodityItem(), commodityItem(), commodityItem(), commodityItem(), commodityItem(), commodityItem(), SizedBox(height: 20.h), discountItem(Color(0xFF32A060)), discountItem(Color(0xFFFF7A1A)), Container( margin: EdgeInsets.only( top: 24.h, bottom: 4.h, ), child: MySeparator( height: 1, width: 5.w, color: Colors.grey, ), ), buildTotalPrice(), ]; } Widget buildQrCode() { return Container( margin: EdgeInsets.only(right: 16.w), child: Stack( children: [ Container( width: 94.w, height: 33.h, margin: EdgeInsets.only(left: 12.w), padding: EdgeInsets.only(left: 16.w), decoration: BoxDecoration( color: Colors.white, boxShadow: [ BoxShadow( color: Colors.black.withAlpha(25), offset: Offset(0, 1), blurRadius: 12, spreadRadius: 0, ) ], borderRadius: BorderRadius.only( topLeft: Radius.circular(2), bottomLeft: Radius.circular(2), ), ), child: Row( mainAxisAlignment: MainAxisAlignment.spaceAround, crossAxisAlignment: CrossAxisAlignment.center, children: [ Text( S.of(context).qujianma, style: TextStyle( fontWeight: FontWeight.bold, fontSize: 12.sp, color: Colors.black), ), Icon( Icons.keyboard_arrow_right, color: Colors.black, size: 16, ) ], ), ), Container( margin: EdgeInsets.only(top: 6.h, bottom: 6.h), // padding: EdgeInsets.all(2), decoration: BoxDecoration( color: Colors.white, boxShadow: [ BoxShadow( color: Colors.black.withAlpha(25), offset: Offset(0, 1), blurRadius: 12, spreadRadius: 0, ) ], borderRadius: BorderRadius.all(Radius.circular(2))), child: Icon( Icons.qr_code, size: 20, color: Color(0xFF32A060), )), ], ), ); } Widget buildOrderInfo() { return Container( margin: EdgeInsets.only(left: 16.w, right: 16.w, top: 16.h, bottom: 8.h), padding: EdgeInsets.only(left: 20.w, right: 20.w, top: 12.h, bottom: 12.h), decoration: BoxDecoration( color: Colors.white, boxShadow: [ BoxShadow( color: Colors.black.withAlpha(12), offset: Offset(0, 1), blurRadius: 12, spreadRadius: 0, ) ], borderRadius: BorderRadius.all(Radius.circular(8)), ), child: Column( children: [ orderInfoItem(S.of(context).shoujihao, "13800138000"), orderInfoItem( S.of(context).beizhu, S.of(context).qingshurubeizhuyaoqiu), orderInfoItem(S.of(context).fapiao, S.of(context).buzhichikaipiao), orderInfoItem(S.of(context).zhifufangshi, S.of(context).yue), ], ), ); } Widget orderInfoItem(leftText, rightText) { return Container( margin: EdgeInsets.only(top: 8.h, bottom: 8.h), child: Row( mainAxisAlignment: MainAxisAlignment.center, crossAxisAlignment: CrossAxisAlignment.center, children: [ Text( leftText, style: TextStyle( fontWeight: FontWeight.bold, fontSize: 12.sp, color: Color(0xFF727272), ), ), Expanded( child: Text( rightText, textAlign: TextAlign.end, style: TextStyle( fontSize: 12.sp, color: Color(0xFF353535), ), ), flex: 1, ), SizedBox( width: 16.w, ), Icon( Icons.keyboard_arrow_right, size: 16, color: Colors.black, ) ], ), ); } Widget commodityItem() { return Container( margin: EdgeInsets.only(top: 8.h, bottom: 8.h), child: Row( children: [ Container( child: Image.network( "https://t7.baidu.com/it/u=1297102096,3476971300&fm=193&f=GIF", width: 44.w, fit: BoxFit.cover, height: 44.h, ), ), Expanded( flex: 1, child: Container( margin: EdgeInsets.only(left: 16.w, right: 16.w), height: 44.h, child: Column( mainAxisAlignment: MainAxisAlignment.spaceAround, crossAxisAlignment: CrossAxisAlignment.start, children: [ Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, crossAxisAlignment: CrossAxisAlignment.center, children: [ Text( "海盐牛角", style: TextStyle( fontWeight: FontWeight.bold, fontSize: 14.sp, color: Color(0xFF353535), ), ), Text( "x2", style: TextStyle( fontSize: 12.sp, color: Color(0xFF727272), ), ), ], ), Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, crossAxisAlignment: CrossAxisAlignment.center, children: [ Expanded( flex: 1, child: Text( S.of(context).ge(200), overflow: TextOverflow.ellipsis, style: TextStyle( fontSize: 12.sp, color: Color(0xFFA29E9E), ), )), Text( S.of(context).yuan(8), style: TextStyle( fontWeight: FontWeight.bold, fontSize: 12.sp, color: Color(0xFF4C4C4C), ), ) ], ), ], ), ), ), ], ), ); } Widget discountItem(Color color) { return Container( margin: EdgeInsets.only(top: 9.h, bottom: 9.h), child: Row( children: [ Container( padding: EdgeInsets.fromLTRB(4, 2, 4, 2), decoration: BoxDecoration( borderRadius: BorderRadius.all(Radius.circular(2)), border: Border.all(width: 1, color: color, style: BorderStyle.solid), ), child: Text( S.of(context).peisongfei, style: TextStyle( fontSize: 10.sp, color: color, ), ), ), SizedBox( width: 27.w, ), Expanded( child: Text( S.of(context).huodongjianmianpeisongfei(3), style: TextStyle( fontSize: 10.sp, color: Color(0xFFA29E9E), ), ), flex: 1, ), Text( S.of(context).yuan(-3.0), style: TextStyle( fontSize: 12.sp, color: color, ), ), ], ), ); } Widget buildTotalPrice() { return Container( margin: EdgeInsets.only(top: 7.h, bottom: 11.h), child: Row( mainAxisAlignment: MainAxisAlignment.end, crossAxisAlignment: CrossAxisAlignment.baseline, textBaseline: TextBaseline.alphabetic, children: [ Expanded( child: Text( S.of(context).huodongjianmianpeisongfei(3), style: TextStyle( fontSize: 10.sp, color: Color(0xFFA29E9E), ), ), flex: 1, ), Container( child: Text( S.of(context).jiesuanjine, style: TextStyle( fontSize: 10.sp, color: Color(0xFF353535), ), ), ), Text( "20.4", textAlign: TextAlign.end, style: TextStyle( fontSize: 30.sp, color: Color(0xFF32A060), ), ) ], ), ); } }