hartmann-foto_documentation/hartmann-foto-documentation-frontend/lib/pages/customer/customer_widget.dart

import 'dart:convert' show base64Decode;

import 'package:flutter/material.dart';

import 'package:go_router/go_router.dart';

import 'package:intl/intl.dart';

import 'package:fotodocumentation/controller/base_controller.dart';
import 'package:fotodocumentation/l10n/app_localizations.dart';
import 'package:fotodocumentation/controller/customer_controller.dart';
import 'package:fotodocumentation/dto/customer_dto.dart';
import 'package:fotodocumentation/pages/ui_utils/component/general_error_widget.dart';
import 'package:fotodocumentation/pages/ui_utils/component/page_header_widget.dart';
import 'package:fotodocumentation/pages/ui_utils/component/waiting_widget.dart';
import 'package:fotodocumentation/pages/ui_utils/general_style.dart';
import 'package:fotodocumentation/utils/di_container.dart';
import 'package:fotodocumentation/utils/global_router.dart';

class CustomerWidget extends StatefulWidget {
  final int customerId;
  const CustomerWidget({super.key, required this.customerId});

  @override
  State<CustomerWidget> createState() => _CustomerWidgetState();
}

class _CustomerWidgetState extends State<CustomerWidget> {
  CustomerController get _customerController => DiContainer.get();
  GeneralStyle get _generalStyle => DiContainer.get();

  late Future<CustomerDto?> _dto;
  late DateFormat _dateFormat;

  @override
  void initState() {
    super.initState();
    _dateFormat = DateFormat('dd MMMM yyyy');
    _dto = _customerController.get(id: widget.customerId);
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        color: _generalStyle.pageBackgroundColor,
        child: Padding(
          padding: const EdgeInsets.only(top: 8.0, left: 50.0, right: 50.0, bottom: 8.0),
          child: _body(context),
        ),
      ),
    );
  }

  Widget _body(BuildContext context) {
    return FutureBuilder<CustomerDto?>(
      future: _dto,
      builder: (BuildContext context, AsyncSnapshot<CustomerDto?> snapshot) {
        if (snapshot.connectionState != ConnectionState.done) {
          return const WaitingWidget();
        }
        if (snapshot.hasData) {
          CustomerDto? dto = snapshot.data;

          return _mainWidget(dto);
        } else if (snapshot.hasError) {
          var error = snapshot.error;
          return (error is ServerError) ? GeneralErrorWidget.fromServerError(error) : GeneralErrorWidget(error: snapshot.error.toString());
        }
        return const WaitingWidget();
      },
    );
  }

  Widget _mainWidget(CustomerDto? dto) {
    if (dto == null) {
      return Text(
        AppLocalizations.of(context)!.customerWidgetNotFound,
        style: TextStyle(
          fontFamily: _generalStyle.fontFamily,
          fontWeight: FontWeight.bold,
          fontSize: 20,
          color: _generalStyle.secondaryWidgetBackgroundColor,
        ),
      );
    }

    var subText = AppLocalizations.of(context)!.customerWidgetCustomerNumberPrefix(dto.customerNumber);
    return Padding(
      padding: const EdgeInsets.all(8.0),
      child: Column(
        mainAxisAlignment: MainAxisAlignment.start,
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          PageHeaderWidget(text: dto.name, subText: subText),
          _backButton(context),
          const SizedBox(height: 24),
          Expanded(
            child: _customerWidget(dto),
          ),
        ],
      ),
    );
  }

  Widget _customerWidget(CustomerDto dto) {
    var dtos = dto.pictures;

    return Card(
      margin: EdgeInsets.zero,
      shape: RoundedRectangleBorder(
        borderRadius: BorderRadius.circular(12),
      ),
      child: Column(
        children: [
          _tableHeaderRow(context),
          Divider(thickness: 2, height: 1, color: _generalStyle.secondaryWidgetBackgroundColor),
          Expanded(
            child: ListView.separated(
              padding: const EdgeInsets.only(top: 8.0),
              itemCount: dtos.length,
              itemBuilder: (BuildContext context, int index) {
                return _tableDataRow(context, dtos[index]);
              },
              separatorBuilder: (BuildContext context, int index) => Divider(color: _generalStyle.secondaryWidgetBackgroundColor),
            ),
          ),
        ],
      ),
    );
  }

  Widget _tableHeaderRow(BuildContext context) {
    final headerStyle = TextStyle(
      fontFamily: _generalStyle.fontFamily,
      fontWeight: FontWeight.bold,
      fontSize: 20,
      color: _generalStyle.secondaryWidgetBackgroundColor,
    );

    return Padding(
      padding: const EdgeInsets.all(16.0),
      child: Row(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Expanded(
            flex: 1,
            child: Align(
              alignment: Alignment.centerLeft,
              child: Text(
                AppLocalizations.of(context)!.customerWidgetHeaderFoto,
                style: headerStyle,
              ),
            ),
          ),
          Expanded(
            flex: 3,
            child: Align(
              alignment: Alignment.centerLeft,
              child: Text(
                AppLocalizations.of(context)!.customerWidgetHeaderComment,
                style: headerStyle,
              ),
            ),
          ),
          Expanded(
            flex: 2,
            child: Align(
              alignment: Alignment.centerLeft,
              child: Text(
                AppLocalizations.of(context)!.customerWidgetHeaderUploadDate,
                style: headerStyle,
              ),
            ),
          ),
        ],
      ),
    );
  }

  Widget _tableDataRow(BuildContext context, PictureDto dto) {
    final dataStyle = TextStyle(
      fontFamily: _generalStyle.fontFamily,
      fontSize: 16.0,
      color: _generalStyle.secondaryTextLabelColor,
    );

    final dateStr = _dateFormat.format(dto.pictureDate);
    return InkWell(
      onTap: () => _actionSelect(context, dto),
      child: Padding(
        padding: const EdgeInsets.symmetric(horizontal: 16.0, vertical: 8.0),
        child: Row(
          mainAxisAlignment: MainAxisAlignment.start,
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Expanded(
              flex: 1,
              child: Align(
                alignment: Alignment.centerLeft,
                child: ConstrainedBox(
                  constraints: const BoxConstraints(maxWidth: 70, maxHeight: 70),
                  child: Image.memory(
                    base64Decode(dto.image),
                    fit: BoxFit.contain,
                  ),
                ),
              ),
            ),
            Expanded(
              flex: 3,
              child: Align(
                alignment: Alignment.centerLeft,
                child: Text(dto.comment ?? "", style: dataStyle),
              ),
            ),
            Expanded(
              flex: 2,
              child: Align(
                alignment: Alignment.centerLeft,
                child: Text(dateStr, style: dataStyle),
              ),
            ),
          ],
        ),
      ),
    );
  }

  Future<void> _actionSelect(BuildContext context, PictureDto dto) async {
    context.go("${GlobalRouter.pathPicture}/${dto.id}");
  }

  Widget _backButton(BuildContext context) {
    return ElevatedButton.icon(
      onPressed: () => context.go(GlobalRouter.pathHome),
      icon: Icon(
        Icons.chevron_left,
        color: _generalStyle.secondaryTextLabelColor,
        size: 24,
      ),
      label: Text(
        AppLocalizations.of(context)!.backButtonLabel,
        style: TextStyle(
          fontFamily: _generalStyle.fontFamily,
          fontWeight: FontWeight.normal,
          fontSize: 16,
          color: _generalStyle.secondaryTextLabelColor,
        ),
      ),
      style: ElevatedButton.styleFrom(
        backgroundColor: Colors.white,
        elevation: 0,
        shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.circular(8),
        ),
      ),
    );
  }
}