import 'package:diplomaticquarterapp/core/model/ImagesInfo.dart';
import 'package:diplomaticquarterapp/core/viewModels/medical/my_balance_view_model.dart';
import 'package:diplomaticquarterapp/pages/base/base_view.dart';
import 'package:diplomaticquarterapp/uitl/translations_delegate_base.dart';
import 'package:diplomaticquarterapp/widgets/buttons/secondary_button.dart';
import 'package:diplomaticquarterapp/widgets/data_display/text.dart';
import 'package:diplomaticquarterapp/widgets/others/app_scaffold_widget.dart';
import 'package:diplomaticquarterapp/widgets/transitions/fade_page.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:hexcolor/hexcolor.dart';

import 'advance_payment_page.dart';

class MyBalancePage extends StatelessWidget {

  List<ImagesInfo> imagesInfo = List();

  @override
  Widget build(BuildContext context) {
    imagesInfo.add(ImagesInfo(imageEn: 'https://hmgwebservices.com/Images/MobileApp/images-info-home/my-balance/en/0.png',imageAr: 'https://hmgwebservices.com/Images/MobileApp/images-info-home/my-balance/ar/0.png'));
    return BaseView<MyBalanceViewModel>(
      onModelReady: (model) => model.getPatientAdvanceBalanceAmount(),
      builder: (_, model, w) => AppScaffold(
        baseViewModel: model,
        isShowAppBar: true,
        appBarTitle: TranslationBase.of(context).myBalances,
        imagesInfo: imagesInfo,
        description: TranslationBase.of(context).infoMyBalance,
        body: Container(
          margin: EdgeInsets.all(12),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Texts(
                TranslationBase.of(context).balanceAmount,
                color: Colors.black,
                bold: true,
              ),
              SizedBox(
                height: 15,
              ),
              Container(
                padding: EdgeInsets.all(8),
                width: double.infinity,
                height: 65,
                decoration: BoxDecoration(
                  color: Theme.of(context).primaryColor,
                  shape: BoxShape.rectangle,
                  borderRadius: BorderRadius.circular(7),
                ),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [

                    Texts(
                      '${model.totalAdvanceBalanceAmount ?? 0} '+ TranslationBase.of(context).sar,
                      color: Colors.white,
                      bold: true,
                    ),
                    Texts(
                      TranslationBase.of(context).totalBalance,
                      color: Colors.white,
                    ),
                  ],
                ),
              ),
              SizedBox(
                height: 9,
              ),
              ...List.generate(
                model.patientAdvanceBalanceAmountList.length,
                (index) => Container(
                  padding: EdgeInsets.all(8),
                  height: 65,
                  margin: EdgeInsets.only(top: 8),
                  decoration: BoxDecoration(
                    color: Colors.white,
                    shape: BoxShape.rectangle,
                    borderRadius: BorderRadius.circular(7),
                  ),
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: [

                      Texts(
                        '${model.patientAdvanceBalanceAmountList[index].patientAdvanceBalanceAmount} '+TranslationBase.of(context).sar,
                        bold: true,
                      ),
                      Texts(model.patientAdvanceBalanceAmountList[index]
                          .projectDescription),
                    ],
                  ),
                ),
              ),
            ],
          ),
        ),
        bottomSheet: Container(
          height: MediaQuery.of(context).size.height * 0.1,
          width: double.infinity,
          padding: EdgeInsets.all(12),
          child: SecondaryButton(
            // color: Colors.grey[900],
            textColor: Colors.white,
            label: TranslationBase.of(context).createAdvancedPayment,
            onTap: () {
              Navigator.push(context, FadePage(page: AdvancePaymentPage()));
            },
          ),
        ),
      ),
    );
  }
}