// import 'package:app_package/app_package.dart';
import 'package:flutter/material.dart';
import 'package:intelligent_package/src/assets.gen.dart';
import 'package:intelligent_package/src/components/showCofirmMeterDialog.dart';
import 'package:wisdom_cli/wisdom_cli.dart';
import '../../view_models/private_intelligent_index_model.dart';

class IndexPage extends StatelessWidget {
  const IndexPage({Key? key}) : super(key: key);
  @override
  Widget build(BuildContext context) {
    return ChangeNotifierProvider(
      create: (providerContext) =>
          PrivateIntelligentIndexStore(context, providerContext),
      child: _PageView(),
      lazy: false,
    );
  }
}

class _PageView extends StatefulWidget {
  _PageView({Key? key}) : super(key: key);
  @override
  _PageViewState createState() => _PageViewState();
}

class _PageViewState extends State<_PageView> {
  @override
  Widget build(BuildContext context) {
    final store = Provider.of<PrivateIntelligentIndexStore>(context);
    final list = store.intelligentList;
    final colorScheme = WTheme.of(context).colorScheme;

    return Theme(
        data: Theme.of(
          context,
        ).copyWith(
          primaryColorLight: Color(0xff505050),
        ),
        child: GestureDetector(
          onTap: () {
            FocusScope.of(context).requestFocus(FocusNode());
          },
          child: Scaffold(
            appBar: WAppBar(
              brightness: Brightness.light,
              iconTheme: IconThemeData(
                color: colorScheme.mainTitle,
                size: 19.pt,
              ),
              backgroundColor: Colors.white,
              title: WisText('${store.routingArgs['appBarTitle']}',
                  size: 19.pt,
                  weight: FontWeight.w600,
                  color: colorScheme.mainTitle),
              actions: <Widget>[
                Wisdom.row(
                  margin: EdgeInsets.only(
                    right: 15.pt,
                  ),
                  onTap: () => store.handleShowChoose(),
                  children: <Widget>[
                    Image(
                        image: AssetList.$iconShx_png_image,
                        width: 20.pt,
                        color: colorScheme.mainTitle)
                  ],
                )
              ],
            ),
            body: Column(
              crossAxisAlignment: CrossAxisAlignment.stretch,
              mainAxisSize: MainAxisSize.min,
              children: [
                Wisdom.row(
                    color: Color(0xFFFFFFFF),
                    mainAxisAlignment: MainAxisAlignment.center,
                    crossAxisAlignment: CrossAxisAlignment.center,
                    margin: EdgeInsets.only(bottom: 5.pt),
                    children: <Widget>[
                      Expanded(
                        child: WSearch(
                          hintText: '输入仪表名称搜索',
                          onSubmitted: (value) => store.onNameInput(value),
                          onCancel: () => store.onNameInput(''),
                          moonlight: false,
                          padding: EdgeInsets.symmetric(vertical: 10.pt),
                          isDark: true,
                        ),
                      )
                    ]),
                // _topCommunity(),
                WisScrollView(
                  key: store.scorllViewListKey,
                  onInit: () => store.onInit(),
                  onLoad: () => store.getIntelligentList(isLoad: true),
                  slivers: <Widget>[
                    WisSliverList.childBuilder(
                      childCount: list.length,
                      builder: (context, index) {
                        final item = list[index];
                        return Column(
                          crossAxisAlignment: CrossAxisAlignment.stretch,
                          children: <Widget>[
                            _MeterItem(item: item),
                          ],
                        );
                      },
                    ),
                  ],
                ).asExpanded(),
              ],
            ),
          ),
        ));
  }
}

/// 智能表
class _MeterItem extends StatelessWidget {
  const _MeterItem({Key? key, this.item}) : super(key: key);
  final item;
  @override
  Widget build(BuildContext context) {
    final style = WTheme.of(context);
    final colorScheme = style.colorScheme;
    final store = Provider.of<PrivateIntelligentIndexStore>(context);

    return Wisdom(
      onTap: () => store.routeToDetail(item),
      child: WisCard(
        margin:
            EdgeInsets.only(top: 5.pt, left: 15.pt, right: 15.pt, bottom: 5.pt),
        color: Colors.white,
        child: Wisdom.column(
          padding: EdgeInsets.all(15.pt),
          children: [
            Wisdom.column(
              mainAxisSize: MainAxisSize.min,
              children: [
                Wisdom.row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  crossAxisAlignment: CrossAxisAlignment.center,
                  mainAxisSize: MainAxisSize.min,
                  margin: EdgeInsets.only(bottom: 5.pt),
                  children: [
                    Wisdom.row(
                      crossAxisAlignment: CrossAxisAlignment.center,
                      children: [
                        if (item.meterType == 'electricMeter')
                          Image.asset(
                            'lib/assets/icon_dian.png',
                            width: 22.pt,
                            height: 22.pt,
                            package: 'intelligent_package',
                          ),
                        if (item.meterType == 'waterMeter')
                          Image.asset(
                            'lib/assets/icon_shui.png',
                            width: 22.pt,
                            height: 22.pt,
                            package: 'intelligent_package',
                          ),
                        Wisdom(
                          margin: EdgeInsets.only(left: 5.pt),
                          child: Text(
                            '${item?.meterName ?? '--'}',
                            style: TextStyle(
                              color: colorScheme.mainTitle,
                              fontSize: 15.pt,
                              fontWeight: FontWeight.bold,
                            ),
                          ),
                        ),
                      ],
                    ).asExpanded(),
                    if (item?.meterType == 'electricMeter')
                      Wisdom(
                        onTap: () => {
                          ShowConfirmMeterDialog(context, item, store, false),
                        },
                        padding: EdgeInsets.symmetric(
                          horizontal: 17.5.pt,
                          vertical: 7.pt,
                        ),
                        color: colorScheme.primary,
                        borderRadius: BorderRadius.circular(17.pt),
                        child: Text(
                          '合闸',
                          style: TextStyle(
                            color: Color(0xffffffff),
                            fontSize: 14.pt,
                          ),
                        ),
                      ),
                  ],
                ),
                Wisdom.row(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  padding: EdgeInsets.only(top: 7.5.pt, bottom: 10.pt),
                  children: [
                    if (item?.powerOn != null &&
                        item.powerOn == 1 &&
                        item?.meterType == 'electricMeter')
                      WTag(
                        child: WisText(
                          '已通电',
                          size: 13.pt,
                        ),
                        color: Color(0xff25B41C),
                        margin: EdgeInsets.only(right: 5.pt),
                      ),
                    if (item?.powerOn != null &&
                        item.powerOn == 0 &&
                        item?.meterType == 'electricMeter')
                      WTag(
                        child: WisText(
                          '已断电',
                          size: 13.pt,
                        ),
                        color: Color(0xffF95759),
                        margin: EdgeInsets.only(right: 5.pt),
                      ),
                    if (item?.multiple != null && item.multiple == 1)
                      WTag(
                        child: WisText(
                          '1倍',
                          size: 13.pt,
                        ),
                        color: Color(0xff00C4B6),
                        margin: EdgeInsets.only(right: 5.pt),
                      ),
                    if (item?.multiple != null && item.multiple > 1)
                      WTag(
                        child: WisText(
                          '${item.multiple}倍',
                          size: 13.pt,
                        ),
                        color: Color(0xff2E8CF0),
                        margin: EdgeInsets.only(right: 5.pt),
                      ),
                  ],
                ),
                Wisdom.column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Wisdom.row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      margin: EdgeInsets.only(bottom: 8.pt),
                      children: [
                        Wisdom(
                          child: Text(
                            '安装位置',
                            style: TextStyle(
                              color: colorScheme.minor,
                              fontSize: 14.pt,
                              fontWeight: FontWeight.w300,
                            ),
                          ),
                        ),
                        Wisdom(
                          child: Text(
                            '${item?.roomNo ?? '--'}',
                            style: TextStyle(
                              color: colorScheme.grey,
                              fontSize: 14.pt,
                              fontWeight: FontWeight.w300,
                            ),
                          ),
                        ),
                      ],
                    ),
                    Wisdom.row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      margin: EdgeInsets.only(bottom: 8.pt),
                      children: [
                        Wisdom(
                          child: Text(
                            '表号',
                            style: TextStyle(
                              color: colorScheme.minor,
                              fontSize: 14.pt,
                              fontWeight: FontWeight.w300,
                            ),
                          ),
                        ),
                        Wisdom(
                          child: Text(
                            '${item?.meterCode ?? '--'}',
                            style: TextStyle(
                              color: colorScheme.grey,
                              fontSize: 14.pt,
                              fontWeight: FontWeight.w300,
                            ),
                          ),
                        ),
                      ],
                    ),
                  ],
                ),
              ],
            ),
            Divider(
              color: Color(0xffE6E6E6),
            ),
            Wisdom.row(
              padding: EdgeInsets.only(top: 15.pt),
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Wisdom.row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Wisdom(
                      margin: EdgeInsets.only(right: 15.pt),
                      child: Text(
                        '表读数',
                        style: TextStyle(
                          color: colorScheme.minor,
                          fontSize: 14.pt,
                          fontWeight: FontWeight.w600,
                        ),
                      ),
                    ),
                    Wisdom(
                      child: Text(
                        '${item?.currentAmount ?? '--'}',
                        style: TextStyle(
                          color: colorScheme.mainTitle,
                          fontSize: 16.pt,
                          fontWeight: FontWeight.w600,
                        ),
                      ),
                    ),
                  ],
                ),
                Wisdom.row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Wisdom(
                      margin: EdgeInsets.only(right: 15.pt),
                      child: Text(
                        '${store.chargeMode == 'transcribeCharging' ? '欠费金额' : '表余量'}',
                        style: TextStyle(
                          color: colorScheme.minor,
                          fontSize: 14.pt,
                          fontWeight: FontWeight.w600,
                        ),
                      ),
                    ),
                    Wisdom(
                      child: Text(
                        '${store.chargeMode == 'transcribeCharging' ? '${item?.arrearsFee ?? '--'}' : '${item?.currentMargin ?? '--'}'}',
                        style: TextStyle(
                          color: colorScheme.red,
                          fontSize: 16.pt,
                          fontWeight: FontWeight.w600,
                        ),
                      ),
                    ),
                  ],
                ),
              ],
            ),
          ],
        ),
      ),
    );
  }
}
