import 'package:flutter/material.dart';
import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:mitra_corporate/model/surat_jalan_model.dart';
import 'package:mitra_corporate/provider/auth_provider.dart';
import 'package:loading_animation_widget/loading_animation_widget.dart';

import '../../app/constant.dart';
import '../../provider/menu_provider.dart';
import '../../widgets/custom_snackbar_widget.dart';
import 'dashboard_delivery_provider.dart';

class DashboardTabel extends HookConsumerWidget {
  const DashboardTabel({
    super.key,
  });

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final auth = ref.read(authProvider);
    final dataList = useState<List<SuratJalanModel>>(List.empty());
    final loading = useState(false);

    useEffect(() {
      WidgetsBinding.instance.addPostFrameCallback((timeStamp) async {
        ref.read(DashboardDeliveryProvider.notifier).DashboardDelivery(
            token: auth?.token ?? "", company_id: auth?.mUserMCompanyID ?? "");
      });
      return () {};
    }, []);
    ref.listen(DashboardDeliveryProvider, (prev, next) async {
      if (next is DashboardDeliveryStateLoading) {
        loading.value = true;
      } else if (next is DashboardDeliveryStateError) {
        loading.value = false;

        SanckbarWidget(context, next.message ?? "", snackbarType.error);
        Constant.autoLogout(context: context, msg: next.message ?? "");
      } else if (next is DashboardDeliveryStateDone) {
        dataList.value = next.model;
        loading.value = false;
      }
    });
    return Material(
      elevation: 5,
      shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)),
      color: Colors.white,
      child: SizedBox(
        height: Constant.getActualY(context: context, y: 370),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Padding(
              padding: const EdgeInsets.all(16.0),
              child: Text('Pengiriman Terbaru',
                  style: Constant.h4_600(context: context)
                      .copyWith(color: Constant.textBlack)),
            ),
            Container(
              padding: EdgeInsets.symmetric(
                  horizontal: Constant.getActualX(context: context, x: 8)),
              child: Column(
                children: [
                  Container(
                    decoration: BoxDecoration(
                        color: Constant.grey_200,
                        borderRadius: BorderRadius.circular(8)),
                    height: Constant.getActualY(context: context, y: 56),
                    child: Row(
                      crossAxisAlignment: CrossAxisAlignment.center,
                      children: [
                        Expanded(
                            flex: 2,
                            child: Padding(
                              padding: EdgeInsets.symmetric(
                                  horizontal: Constant.getActualX(
                                      context: context, x: 12)),
                              child: Text(
                                "Tanggal",
                                style: Constant.body3_600(context: context)
                                    .copyWith(color: Constant.textGrey),
                              ),
                            )),
                        Expanded(
                            flex: 2,
                            child: Padding(
                              padding: EdgeInsets.symmetric(
                                  horizontal: Constant.getActualX(
                                      context: context, x: 12)),
                              child: Text(
                                "Nomor Surat Jalan",
                                style: Constant.body3_600(context: context)
                                    .copyWith(color: Constant.textGrey),
                              ),
                            )),
                        Expanded(
                            flex: 2,
                            child: Padding(
                              padding: EdgeInsets.symmetric(
                                  horizontal: Constant.getActualX(
                                      context: context, x: 12)),
                              child: Text(
                                "Staff PIC",
                                style: Constant.body3_600(context: context)
                                    .copyWith(color: Constant.textGrey),
                              ),
                            )),
                        Expanded(
                            flex: 2,
                            child: Padding(
                              padding: EdgeInsets.symmetric(
                                  horizontal: Constant.getActualX(
                                      context: context, x: 12)),
                              child: Text(
                                "Tipe Pengiriman",
                                style: Constant.body3_600(context: context)
                                    .copyWith(color: Constant.textGrey),
                              ),
                            )),
                        Expanded(
                            flex: 2,
                            child: Padding(
                              padding: EdgeInsets.symmetric(
                                  horizontal: Constant.getActualX(
                                      context: context, x: 12)),
                              child: Text(
                                "Tujuan",
                                style: Constant.body3_600(context: context)
                                    .copyWith(color: Constant.textGrey),
                              ),
                            )),
                        Expanded(
                            flex: 2,
                            child: Padding(
                              padding: EdgeInsets.symmetric(
                                  horizontal: Constant.getActualX(
                                      context: context, x: 12)),
                              child: Text(
                                "Status",
                                style: Constant.body3_600(context: context)
                                    .copyWith(color: Constant.textGrey),
                              ),
                            )),
                      ],
                    ),
                  )
                ],
              ),
            ),
            Container(
              height: Constant.getActualY(context: context, y: 160),
              padding: EdgeInsets.symmetric(
                  horizontal: Constant.getActualX(context: context, x: 8)),
              child: loading.value
                  ? Center(
                      child: LoadingAnimationWidget.discreteCircle(
                          color: Constant.primaryBlue, size: 40))
                  : ListView(
                      children: dataList.value
                          .map((e) => Container(
                                margin: EdgeInsets.symmetric(
                                    vertical: Constant.getActualY(
                                        context: context, y: 10)),
                                child: Row(
                                  crossAxisAlignment: CrossAxisAlignment.center,
                                  children: [
                                    Expanded(
                                        flex: 2,
                                        child: Padding(
                                          padding: EdgeInsets.symmetric(
                                              horizontal: Constant.getActualX(
                                                  context: context, x: 12)),
                                          child: SelectableText(e.date ?? "",
                                              style: Constant.body3_600(
                                                  context: context)),
                                        )),
                                    Expanded(
                                        flex: 2,
                                        child: Padding(
                                          padding: EdgeInsets.symmetric(
                                              horizontal: Constant.getActualX(
                                                  context: context, x: 12)),
                                          child: SelectableText(
                                              e.orderNumber ?? "",
                                              style: Constant.body3_600(
                                                  context: context)),
                                        )),
                                    Expanded(
                                        flex: 2,
                                        child: Padding(
                                          padding: EdgeInsets.symmetric(
                                              horizontal: Constant.getActualX(
                                                  context: context, x: 12)),
                                          child: SelectableText(e.pic ?? "",
                                              style: Constant.body3_600(
                                                  context: context)),
                                        )),
                                    Expanded(
                                        flex: 2,
                                        child: Padding(
                                          padding: EdgeInsets.symmetric(
                                              horizontal: Constant.getActualX(
                                                  context: context, x: 12)),
                                          child: SelectableText(e.type ?? "",
                                              style: Constant.body3_600(
                                                  context: context)),
                                        )),
                                    Expanded(
                                        flex: 2,
                                        child: Padding(
                                          padding: EdgeInsets.symmetric(
                                              horizontal: Constant.getActualX(
                                                  context: context, x: 12)),
                                          child: SelectableText(
                                              e.destination ?? "",
                                              style: Constant.body3_600(
                                                  context: context)),
                                        )),
                                    Expanded(
                                        flex: 2,
                                        child: Container(
                                            alignment: Alignment.bottomLeft,
                                            padding: EdgeInsets.symmetric(
                                                horizontal: Constant.getActualX(
                                                    context: context, x: 12)),
                                            child: Chip(
                                              backgroundColor:
                                                  Constant.yellow_016,
                                              label: SelectableText(
                                                "Proses",
                                                style: Constant.caption1_600(
                                                        context: context)
                                                    .copyWith(
                                                        color: Constant
                                                            .textYellow),
                                              ),
                                              shape: RoundedRectangleBorder(
                                                  borderRadius:
                                                      BorderRadius.circular(8)),
                                            )
                                            // Text("Status",
                                            //     style: Constant.body3_600(context: context)),
                                            )),
                                  ],
                                ),
                              ))
                          .toList(),
                    ),
            ),
            Divider(),
            Container(
              padding: EdgeInsets.only(right: 10),
              height: Constant.getActualY(context: context, y: 60),
              child: Row(
                children: [
                  Spacer(),
                  TextButton(
                      onPressed: () {
                        ref.read(currentMenuProvider.notifier).state = 3;
                      },
                      child: Row(
                        children: [
                          Text(
                            "View All",
                            style: Constant.body3_600(context: context)
                                .copyWith(color: Colors.black),
                          ),
                          Icon(
                            Icons.arrow_forward_ios_rounded,
                            color: Colors.black,
                            size: 17,
                          )
                        ],
                      ))
                ],
              ),
            )
          ],
        ),
      ),
    );
  }
}
