// ignore_for_file: unnecessary_brace_in_string_interps, sized_box_for_whitespace
import 'package:byod/bloc/order_bloc.dart';
import 'package:byod/helper/widget/style.dart';
import 'package:byod/ui/screen_responsive.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:flutter_easyloading/flutter_easyloading.dart';

import '../../helper/helper.dart';
import '../../main.dart';
import '../../models/order_variants.dart';
import '../../models/orders.dart';
import 'fuction.dart';

class CheckOut extends StatefulWidget {
  const CheckOut({Key? key}) : super(key: key);

  @override
  State<CheckOut> createState() => _CheckOutState();
}

class _CheckOutState extends State<CheckOut> {
  final ScrollController _scrollController = ScrollController();
  final nameController = TextEditingController();

  // void checkOut(List<Orders> listOrders, String name) async {
  //   String namaPelanggan = prefs.getString("userName") ?? '';
  //   String namaPelangganFix = '';
  //   if (namaPelanggan == '') {
  //     await prefs.setString("userName", name);
  //     namaPelangganFix = name;
  //   } else {
  //     namaPelangganFix = namaPelanggan;
  //   }
  //   await EasyLoading.show(
  //     status: 'Memproses pesanan...',
  //     maskType: EasyLoadingMaskType.none,
  //   );
  //   String branchCode = prefs.getString('outlet') ?? '';
  //   String brand = prefs.getString('brand') ?? '';

  //   String tableNumber = prefs.getString('table_number') ?? '';
  //   // String baseUrl = prefs.getString('baseUrl') ?? '';
  //   // String urlCheckout = "${baseUrl}checkout";

  //   List<dynamic> variantData = [];

  //   for (int d = 0; d < listOrders.length; d++) {
  //     if (listOrders[d].orderDetail.isEmpty) {
  //       variantData.add({
  //         "id": listOrders[d].id,
  //         "qty": listOrders[d].totalItem.toString(),
  //         "notes": listOrders[d].note,
  //         "variants": []
  //       });
  //     } else {
  //       for (int kd = 0; kd < listOrders[d].orderDetail.length; kd++) {
  //         List<String> varaints = [];
  //         for (int dk = 0;
  //             dk < listOrders[d].orderDetail[kd].orderVariant.length;
  //             dk++) {
  //           varaints.add(listOrders[d].orderDetail[kd].orderVariant[dk].id);
  //         }
  //         variantData.add({
  //           "id": listOrders[d].id,
  //           "qty": listOrders[d].orderDetail[kd].totalItem.toString(),
  //           "notes": listOrders[d].orderDetail[kd].note,
  //           "variants": varaints
  //         });
  //       }
  //     }
  //   }
  //   // ignore: use_build_context_synchronously
  //   await Api.checkOut(
  //       context, variantData, branchCode, brand, tableNumber, namaPelangganFix);
  // }

  @override
  Widget build(BuildContext context) {
    double widthScreen = responsiveWidthScreen(context);
    double currentScreen = MediaQuery.of(context).size.width;
    double maxWidthScreen = getMaxWidthScreen(context, useResponsive);
    int tableMode = prefs.getInt('table_mode') ?? defaultTable;
    return SafeArea(
        child: Scaffold(
      backgroundColor: backgroundColor,
      body: SingleChildScrollView(
        controller: _scrollController,
        child: BlocBuilder<OrdersBloc, List<Orders>>(
          builder: (context, listOrders) {
            // int totalHarga = 0;
            // int totalDiscount = 0;
            // if (list.isNotEmpty) {
            //   for (var i = 0; i < list.length; i++) {
            //     totalHarga += (list[i].totalItem * list[i].satuanHarga);
            //   }
            // }
            // int totalItem = 0;
            // int totalDiscount = 0;
            int totalHarga = 0;
            List indexTidakAdaVariant = [];
            List<String> indexAdaVariant = [];
            if (listOrders.isNotEmpty) {
              int fixTotalHarga = 0;
              int totalHargaOrderDetail = 0;
              int totalHargaBukanOrderDetail = 0;

              // int fixTotalItem = 0;
              // int totalItemOrderDetail = 0;
              // int totalItemBukanOrderDetail = 0;
              for (var i = 0; i < listOrders.length; i++) {
                // totalItem += listOrders[i].totalItem;
                // check apakah ada order detail. kalau ada rekalkulasi total harga sesuai order detail
                if (listOrders[i].orderDetail.isEmpty) {
                  indexTidakAdaVariant.add(i);
                  totalHargaBukanOrderDetail +=
                      (listOrders[i].totalItem * listOrders[i].totalHarga);
                  // totalItemBukanOrderDetail += listOrders[i].totalItem;
                } else {
                  for (int kk = 0;
                      kk < listOrders[i].orderDetail.length;
                      kk++) {
                    String indexWithVariant = '${i}|${kk}';
                    indexAdaVariant.add(indexWithVariant);
                    totalHargaOrderDetail +=
                        listOrders[i].orderDetail[kk].totalHarga;
                    // totalItemOrderDetail +=
                    //     listOrders[i].orderDetail[kk].totalItem;
                  }
                  fixTotalHarga = totalHargaOrderDetail;
                  // fixTotalItem = totalItemOrderDetail;
                }
              }
              totalHarga = fixTotalHarga + totalHargaBukanOrderDetail;
              // totalItem = fixTotalItem + totalItemBukanOrderDetail;
            }
            // return coreCheckout(context, indexTidakAdaVariant, listOrders, indexAdaVariant, tableMode, totalHarga);
            return ScreenResponsive(
              widget: coreCheckout(
                  context,
                  indexTidakAdaVariant,
                  listOrders,
                  indexAdaVariant,
                  tableMode,
                  totalHarga,
                  widthScreen,
                  maxWidthScreen),
              widthScreen: currentScreen,
              isCoreLayout: true,
            );
          },
        ),
      ),
    ));
  }

  Column coreCheckout(
    BuildContext context,
    List<dynamic> indexTidakAdaVariant,
    List<Orders> listOrders,
    List<String> indexAdaVariant,
    int tableMode,
    int totalHarga,
    double widthScreen,
    double maxWidthScreen,
  ) {
    return Column(
      children: [
        customAppbar(context, widthScreen, maxWidthScreen),
        Container(
          padding: EdgeInsets.only(
              left: widthScreen * 0.05,
              right: widthScreen * 0.05,
              top: MediaQuery.of(context).size.height * 0.005),
          height: MediaQuery.of(context).size.height * 0.92,
          width: (widthScreen > maxWidthScreen) ? maxWidthScreen : widthScreen,
          // color: Colors.red,
          child: Stack(
            children: [
              Container(
                // color: Colors.green,
                padding: EdgeInsets.only(
                    bottom: MediaQuery.of(context).size.height * 0.08),
                child: ListView(
                  children: [
                    for (int i in indexTidakAdaVariant)
                      Container(
                          margin: const EdgeInsets.only(bottom: 10),
                          height: MediaQuery.of(context).size.height * 0.17,
                          // color: Colors.red,
                          child: listViewOrderList(
                              context, listOrders, i, widthScreen)),
                    for (var k in indexAdaVariant)
                      Container(
                        margin: const EdgeInsets.only(bottom: 10),
                        height: (listOrders[int.parse(k.split('|')[0])]
                                    .orderDetail[int.parse(k.split('|')[1])]
                                    .orderVariant
                                    .length <=
                                3)
                            ? MediaQuery.of(context).size.height * 0.22
                            : (listOrders[int.parse(k.split('|')[0])]
                                        .orderDetail[int.parse(k.split('|')[1])]
                                        .orderVariant
                                        .length <=
                                    5)
                                ? MediaQuery.of(context).size.height * 0.26
                                : MediaQuery.of(context).size.height * 0.3,
                        child: listViewOrderListVariant(
                            context, listOrders, k, widthScreen),
                      ),
                    // Divider(
                    //   thickness:
                    //       MediaQuery.of(context).size.height * 0.005,
                    //   color: buttonColor.withOpacity(0.6),
                    // ),
                    // Container(
                    //   margin: const EdgeInsets.only(top: 10),
                    //   padding: EdgeInsets.all(
                    //       MediaQuery.of(context).size.height * 0.02),
                    //   // height:
                    //   //     MediaQuery.of(context).size.height * 0.3,
                    //   height:
                    //       MediaQuery.of(context).size.height * 0.1,
                    //   decoration: BoxDecoration(
                    //       borderRadius: BorderRadius.circular(20),
                    //       color: Colors.grey[200]),
                    //   child: Column(
                    //     children: [
                    //       // Container(
                    //       //   height:
                    //       //       MediaQuery.of(context).size.height *
                    //       //           0.06,
                    //       //   margin: const EdgeInsets.only(top: 10),
                    //       //   width: double.infinity,
                    //       //   // color: Colors.red,
                    //       //   child: const Text(
                    //       //     "Payment Summary",
                    //       //     style: TextStyle(
                    //       //         fontWeight: FontWeight.w600,
                    //       //         fontSize: 20),
                    //       //   ),
                    //       // ),
                    //       // SizedBox(
                    //       //   height:
                    //       //       MediaQuery.of(context).size.height *
                    //       //           0.04,
                    //       //   child: Row(
                    //       //     mainAxisAlignment:
                    //       //         MainAxisAlignment.spaceBetween,
                    //       //     children: [
                    //       //       Container(
                    //       //         child: const Text(
                    //       //           "Price",
                    //       //           style: TextStyle(
                    //       //               fontWeight: FontWeight.w500,
                    //       //               fontSize: 18),
                    //       //         ),
                    //       //       ),
                    //       //       Text(
                    //       //         formatNumber().format(totalHarga),
                    //       //         style: const TextStyle(
                    //       //             fontWeight: FontWeight.w500,
                    //       //             fontSize: 18),
                    //       //       ),
                    //       //     ],
                    //       //   ),
                    //       // ),
                    //       // SizedBox(
                    //       //   height:
                    //       //       MediaQuery.of(context).size.height *
                    //       //           0.04,
                    //       //   child: Row(
                    //       //     mainAxisAlignment:
                    //       //         MainAxisAlignment.spaceBetween,
                    //       //     children: [
                    //       //       Container(
                    //       //         child: const Text(
                    //       //           "Discount",
                    //       //           style: TextStyle(
                    //       //               fontWeight: FontWeight.w500,
                    //       //               fontSize: 18),
                    //       //         ),
                    //       //       ),
                    //       //       Container(
                    //       //         child: Text(
                    //       //           formatNumber().format(0),
                    //       //           style: const TextStyle(
                    //       //               fontWeight: FontWeight.w500,
                    //       //               fontSize: 18),
                    //       //         ),
                    //       //       ),
                    //       //     ],
                    //       //   ),
                    //       // ),
                    //       // const SizedBox(height: 5),
                    //       // Divider(
                    //       //   height:
                    //       //       MediaQuery.of(context).size.height *
                    //       //           0.01,
                    //       //   color: Colors.grey,
                    //       // ),
                    //       const SizedBox(height: 5),
                    //       Container(
                    //         height:
                    //             MediaQuery.of(context).size.height *
                    //                 0.04,
                    //         child: Row(
                    //           mainAxisAlignment:
                    //               MainAxisAlignment.spaceBetween,
                    //           children: [
                    //             Container(
                    //               child: const Text(
                    //                 "Total",
                    //                 style: TextStyle(
                    //                     fontWeight: FontWeight.w600,
                    //                     fontSize: 18),
                    //               ),
                    //             ),
                    //             Container(
                    //               child: Text(
                    //                 "Rp ${formatNumber().format(totalHarga - totalDiscount)}",
                    //                 style: const TextStyle(
                    //                     fontWeight: FontWeight.w600,
                    //                     fontSize: 18),
                    //               ),
                    //             ),
                    //           ],
                    //         ),
                    //       ),
                    //     ],
                    //   ),
                    // )
                  ],
                ),
              ),
              Positioned(
                bottom: MediaQuery.of(context).size.height * positionedBottom,
                child: GestureDetector(
                  onTap: () {
                    String namaPelanggan = prefs.getString("userName") ?? '';

                    if (tableMode == singleTable && namaPelanggan != '') {
                      checkOut(context, listOrders, namaPelanggan);
                    } else {
                      String namaPelanggan = prefs.getString("userName") ?? '';
                      buttonDialog(context, namaPelanggan, listOrders,
                          tableMode, widthScreen);
                    }

                    // Navigator.push(
                    //     context,
                    //     MaterialPageRoute(
                    //         builder: (context) => FinishOrder()));
                  },
                  child: Container(
                    height: MediaQuery.of(context).size.height * 0.08,
                    width: widthScreen * 0.9,
                    decoration: BoxDecoration(
                        borderRadius: BorderRadius.circular(roundedButton),
                        color: buttonColor),
                    child: Container(
                      margin: const EdgeInsets.all(5),
                      // color: Colors.red,
                      child: Center(
                        // child: Text(
                        //   "Pesan - Rp ${formatNumber().format(totalHarga)}",
                        //   textAlign: TextAlign.center,
                        //   // style: const TextStyle(
                        //   //   fontWeight: FontWeight.w600,
                        //   //   fontSize: 18,
                        //   //   color: textInButton,
                        //   // ),
                        //   style: textStyleNormalFont(
                        //     context,
                        //     color: textInButton,
                        //   ),
                        // ),
                        child: defaultText(
                          context,
                          "Pesan - Rp ${formatNumber().format(totalHarga)}",
                          textAlign: TextAlign.center,
                          style: textStyleNormalFont(
                            context,
                            color: textInButton,
                          ),
                        ),
                      ),
                    ),
                  ),
                ),
              )
            ],
          ),
        ),
      ],
    );
  }

  Row listViewOrderListVariant(
    BuildContext context,
    List<Orders> listOrders,
    String k,
    double widthScreen,
  ) {
    return Row(
      children: [
        Container(
          width: widthScreen * 0.65,
          // padding: const EdgeInsets.all(15),
          // color: Colors.amber,
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              // Text(
              //   // nama menu
              //   listOrders[int.parse(k.split('|')[0])].namaMenu,
              //   maxLines: 2,
              //   overflow: TextOverflow.ellipsis,
              //   // style: const TextStyle(
              //   //   fontWeight: FontWeight.w500,
              //   //   fontSize: 20,
              //   // ),
              //   style: textStyleMenuList(context),
              // ),
              defaultText(
                  context, listOrders[int.parse(k.split('|')[0])].namaMenu,
                  maxLines: 2,
                  overFlow: TextOverflow.ellipsis,
                  style: textStyleMenuList(context)),
              SizedBox(height: MediaQuery.of(context).size.height * 0.006),
              // Text(
              //   // jumlah pesanan x harga
              //   "${listOrders[int.parse(k.split('|')[0])].orderDetail[int.parse(k.split('|')[1])].totalItem} x ${formatNumber().format((listOrders[int.parse(k.split('|')[0])].orderDetail[int.parse(k.split('|')[1])].totalHarga / listOrders[int.parse(k.split('|')[0])].orderDetail[int.parse(k.split('|')[1])].totalItem))}",
              //   overflow: TextOverflow.clip,
              //   // style: const TextStyle(
              //   //   fontWeight: FontWeight.w500,
              //   //   fontSize: 15,
              //   // ),
              //   style: textStyleNormalFont(
              //     context,
              //   ),
              // ),
              defaultText(context,
                  "${listOrders[int.parse(k.split('|')[0])].orderDetail[int.parse(k.split('|')[1])].totalItem} x ${formatNumber().format((listOrders[int.parse(k.split('|')[0])].orderDetail[int.parse(k.split('|')[1])].totalHarga / listOrders[int.parse(k.split('|')[0])].orderDetail[int.parse(k.split('|')[1])].totalItem))}",
                  overFlow: TextOverflow.clip,
                  style: textStyleNormalFont(
                    context,
                  )),
              SizedBox(height: MediaQuery.of(context).size.height * 0.003),
              // start list variant //
              for (OrderVariant variant
                  in listOrders[int.parse(k.split('|')[0])]
                      .orderDetail[int.parse(k.split('|')[1])]
                      .orderVariant)
                // Text(
                //   variant.name,
                //   maxLines: 2,
                //   overflow: TextOverflow.ellipsis,
                //   // style: const TextStyle(
                //   //   fontWeight: FontWeight.w500,
                //   //   fontSize: 15,
                //   //   color: Colors.black54,
                //   // )
                //   style: textStyleNormalFont(
                //     context,
                //     font: variantModalFont,
                //     color: Colors.grey,
                //   ),
                // ),
                defaultText(context, variant.name,
                    maxLines: 2,
                    overFlow: TextOverflow.ellipsis,
                    style: textStyleNormalFont(context)),
              // end list variant //

              SizedBox(height: MediaQuery.of(context).size.height * 0.003),
              // start note for variant //
              (listOrders[int.parse(k.split('|')[0])]
                          .orderDetail[int.parse(k.split('|')[1])]
                          .note !=
                      '')
                  ? Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Divider(
                          height: MediaQuery.of(context).size.height * 0.01,
                        ),
                        // Text(
                        //   "Catatan: ${listOrders[int.parse(k.split('|')[0])].orderDetail[int.parse(k.split('|')[1])].note}",
                        //   // maxLines: 1,
                        //   // overflow: TextOverflow
                        //   //     .ellipsis,
                        //   // style: const TextStyle(
                        //   //   fontWeight:
                        //   //       FontWeight.w500,
                        //   //   fontSize: 15,
                        //   //   color: Colors.black54,
                        //   // ),
                        //   style: textStyleNormalFont(
                        //     context,
                        //     font: variantModalFont,
                        //     color: Colors.grey,
                        //   ),
                        // ),
                        defaultText(context,
                            "Catatan: ${listOrders[int.parse(k.split('|')[0])].orderDetail[int.parse(k.split('|')[1])].note}",
                            style: textStyleNormalFont(
                              context,
                              font: variantModalFont,
                              color: Colors.grey,
                            ))
                      ],
                    )
                  : const SizedBox()
              // end note for variant //
            ],
          ),
        ),
        SizedBox(
          width: widthScreen * 0.25,
          // color: Colors.green,
          child: ClipRRect(
            borderRadius: BorderRadius.circular(roundedImage),
            child: (listOrders[int.parse(k.split('|')[0])].imageUrl != '')
                ? Image(
                    fit: BoxFit.fill,
                    image: NetworkImage(
                        listOrders[int.parse(k.split('|')[0])].imageUrl),
                  )
                : const Image(image: AssetImage('assets/noimage.png')),
          ),
        )
      ],
    );
  }

  Future<dynamic> buttonDialog(BuildContext context, String namaPelanggan,
      List<Orders> listOrders, int tableMode, double widthScreen) {
    return showDialog(
        context: context,
        builder: (BuildContext context) {
          return AnimatedContainer(
            duration: const Duration(milliseconds: 300),
            child: AlertDialog(
              scrollable: true,
              title: (namaPelanggan == '')
                  ? defaultText(context, "Masukkan Nama")
                  : defaultText(context, "Konfirmasi Order"),
              content: SizedBox(
                height: MediaQuery.of(context).size.height * 0.27,
                width: widthScreen * widhtDialog,
                child: Column(
                  children: [
                    Container(
                        height: MediaQuery.of(context).size.height * 0.12,
                        child: (namaPelanggan == '')
                            ? Column(
                                children: [
                                  TextField(
                                    // autofocus: true,
                                    keyboardType: TextInputType.text,
                                    controller: nameController,
                                    // style: const TextStyle(
                                    //   color: Colors.black,
                                    //   fontSize: 18,
                                    //   fontWeight: FontWeight.w400,
                                    // ),
                                    style: textStyleNormalFont(context),
                                    decoration: InputDecoration(
                                      // border: OutlineInputBorder(
                                      //     borderRadius: BorderRadius.all(
                                      //         Radius.circular(15))),
                                      // border: InputBorder.none,
                                      hintText: "Nama panggilan",
                                      hintStyle: TextStyle(
                                        color: Colors.grey,
                                        fontSize:
                                            MediaQuery.of(context).size.height *
                                                normalFont,
                                      ),
                                    ),
                                  ),
                                  SizedBox(
                                      height:
                                          MediaQuery.of(context).size.height *
                                              0.005),
                                  (tableMode == multiTable)
                                      ?
                                      // Text(
                                      //     "Pesanan yang di input tidak dapat di batalkan, Yakin ingin melanjutkan ?",
                                      //     // style: TextStyle(
                                      //     //   fontSize: 12,
                                      //     // ),
                                      //     style: textStyleNormalFont(
                                      //       context,
                                      //       font: variantModalFont,
                                      //     ),
                                      //   )
                                      defaultText(context,
                                          "Pesanan yang diinput tidak dapat dibatalkan, Yakin ingin melanjutkan ?",
                                          style: textStyleNormalFont(
                                            context,
                                            font: variantModalFont,
                                          ))
                                      : const Text('')
                                ],
                              )
                            :
                            // Text(
                            //     "Pesanan yang di input tidak dapat di batalkan, Yakin ingin melanjutkan ?",
                            //     // style: TextStyle(fontWeight: FontWeight.w400),
                            //     style: textStyleNormalFont(
                            //       context,
                            //       font: variantModalFont,
                            //     ),
                            //   ),
                            defaultText(
                                context,
                                "Pesanan yang diinput tidak dapat dibatalkan, Yakin ingin melanjutkan ?",
                                style: textStyleNormalFont(
                                  context,
                                  font: variantModalFont,
                                ),
                              )),
                    SizedBox(height: MediaQuery.of(context).size.height * 0.01),
                    GestureDetector(
                      onTap: () {
                        if (nameController.text != '' || namaPelanggan != '') {
                          checkOut(context, listOrders, nameController.text);
                        } else {
                          EasyLoading.showToast("Nama wajib diisi");
                        }
                      },
                      child: Container(
                        height:
                            MediaQuery.of(context).size.height * heightTombol,
                        decoration: BoxDecoration(
                            borderRadius: BorderRadius.circular(roundedButton),
                            color: buttonColor),
                        child: Align(
                            // child: Text(
                            //   "OK",
                            //   // style: TextStyle(
                            //   //   fontWeight: FontWeight.w500,
                            //   //   fontSize: 15,
                            //   //   color: textInButton,
                            //   // ),
                            //   style: textStyleNormalFont(
                            //     context,
                            //     color: textInButton,
                            //   ),
                            // ),
                            child: defaultText(context, "OK",
                                style: textStyleNormalFont(
                                  context,
                                  color: textInButton,
                                ))),
                      ),
                    ),
                    SizedBox(
                      height: MediaQuery.of(context).size.height * 0.02,
                    ),
                    GestureDetector(
                      onTap: () {
                        Navigator.pop(context);
                      },
                      child: Container(
                        height:
                            MediaQuery.of(context).size.height * heightTombol,
                        decoration: BoxDecoration(
                          borderRadius: BorderRadius.circular(roundedButton),
                          color: Colors.transparent,
                        ),
                        child: Align(
                            // child: Text(
                            //   "Batal",
                            //   // style: TextStyle(
                            //   //   fontWeight: FontWeight.w500,
                            //   //   fontSize: 15,
                            //   //   color: textInButton,
                            //   // ),
                            //   style: textStyleNormalFont(
                            //     context,
                            //     color: textInButton,
                            //   ),
                            // ),
                            child: defaultText(context, "Batal",
                                style: textStyleNormalFont(
                                  context,
                                  color: textCancelColor,
                                ))),
                      ),
                    )
                  ],
                ),
              ),
            ),
          );
        });
  }

  Row listViewOrderList(
    BuildContext context,
    List<Orders> listOrders,
    int i,
    double widthScreen,
  ) {
    return Row(
      children: [
        Container(
          width: widthScreen * 0.65,
          // padding: const EdgeInsets.all(15),
          // color: Colors.amber,
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              // Text(
              //   listOrders[i].namaMenu,
              //   maxLines: 2,
              //   overflow: TextOverflow.ellipsis,
              //   // style: const TextStyle(
              //   //   fontWeight: FontWeight.w500,
              //   //   fontSize: 20,
              //   // ),
              //   style: textStyleMenuList(context),
              // ),
              defaultText(context, listOrders[i].namaMenu,
                  maxLines: 2,
                  overFlow: TextOverflow.ellipsis,
                  style: textStyleMenuList(context)),
              SizedBox(height: MediaQuery.of(context).size.height * 0.006),
              // Text(
              //   "${listOrders[i].totalItem} x ${formatNumber().format(listOrders[i].satuanHarga)}",
              //   overflow: TextOverflow.clip,
              //   // style: const TextStyle(
              //   //   fontWeight: FontWeight.w500,
              //   //   fontSize: 15,
              //   // ),
              //   style: textStyleNormalFont(
              //     context,
              //   ),
              // ),
              defaultText(context,
                  "${listOrders[i].totalItem} x ${formatNumber().format(listOrders[i].satuanHarga)}",
                  overFlow: TextOverflow.clip,
                  style: textStyleNormalFont(context)),
              SizedBox(height: MediaQuery.of(context).size.height * 0.003),
              (listOrders[i].note != '')
                  ? Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Divider(
                          height: MediaQuery.of(context).size.height * 0.01,
                        ),
                        // Text(
                        //   "Catatan: ${listOrders[i].note}",
                        //   // maxLines: 1,
                        //   // overflow: TextOverflow.ellipsis,
                        //   // style: const TextStyle(
                        //   //   fontWeight: FontWeight.w500,
                        //   //   fontSize: 15,
                        //   //   color: Colors.black54,
                        //   // ),
                        //   style: textStyleNormalFont(
                        //     context,
                        //     font: variantModalFont,
                        //     color: Colors.grey,
                        //   ),
                        // ),
                        defaultText(context, "Catatan: ${listOrders[i].note}",
                            style: textStyleNormalFont(
                              context,
                              font: variantModalFont,
                              color: Colors.grey,
                            ))
                      ],
                    )
                  : const SizedBox()
            ],
          ),
        ),
        Container(
          width: widthScreen * 0.25,
          // color: Colors.green,
          child: ClipRRect(
            borderRadius: BorderRadius.circular(roundedImage),
            child: (listOrders[i].imageUrl != '')
                ? Image(
                    fit: BoxFit.fill,
                    image: NetworkImage(listOrders[i].imageUrl),
                  )
                : const Image(image: AssetImage('assets/noimage.png')),
          ),
        )
      ],
    );
  }

  Container customAppbar(
    BuildContext context,
    double widthScreen,
    double maxWidthScreen,
  ) {
    return Container(
      height: MediaQuery.of(context).size.height * 0.08,
      width: (widthScreen > maxWidthScreen) ? maxWidthScreen : widthScreen,
      // color: Colors.amber,
      child: Row(
        // mainAxisAlignment: MainAxisAlignment.spaceEvenly,
        children: [
          GestureDetector(
            onTap: () {
              Navigator.pop(context);
            },
            child: Container(
              // color: Colors.white,
              height: double.infinity,
              width: widthScreen * 0.2,
              child: Align(
                alignment: Alignment.center,
                // child: Icon(Icons.arrow_back_ios_new_rounded),
                child: fontAwesome(
                  context,
                  backIcon,
                  backIconSize,
                ),
              ),
            ),
          ),
          Container(
            // color: Colors.red,
            height: double.infinity,
            width: widthScreen * 0.58,
            child: Align(
                alignment: Alignment.centerLeft,
                // child: Text(
                //   'Konfirmasi Pesanan',
                //   overflow: TextOverflow.ellipsis,
                //   // style: TextStyle(fontSize: 20, fontWeight: FontWeight.w600),
                //   style: textStyleMenuList(context),
                // )
                child: defaultText(
                  context,
                  'Konfirmasi Pesanan',
                  overFlow: TextOverflow.ellipsis,
                  style: textStyleMenuList(context),
                )),
          ),
        ],
      ),
    );
  }
}
