detail_item.dart

Go to the documentation of this file.

import 'package:fluentui_system_icons/fluentui_system_icons.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
 
import '../../../../../../../core/ui/theme/color_palette.dart';
 
class DetailItem extends StatelessWidget {
  final String title;
  final String? subtitle;
  final String value;
  final bool isReference;
  final IconData? icon;
  final bool isEditable;
  final Function(String)? onValueChanged;
 
  const DetailItem({
    super.key,
    required this.title,
    this.subtitle,
    required this.value,
    this.isReference = false,
    this.icon,
    this.isEditable = false,
    this.onValueChanged,
  });
 
  @override
  Widget build(BuildContext context) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Row(
          children: [
            if (icon != null) ...[
              Icon(icon, size: 20.sp, color: Colors.grey[600]),
              SizedBox(width: 4.sp),
            ],
            Text(
              title,
              style: Theme.of(context).textTheme.titleSmall!.copyWith(
                color: ColorPalette.grey,
                // fontSize: 12.sp,
              ),
            ),
          ],
        ),
        if (subtitle != null)
          Padding(
            padding: EdgeInsets.only(top: 4.sp),
            child: Text(
              subtitle!,
              style: Theme.of(context).textTheme.bodySmall!.copyWith(
                color: Colors.grey[600],
                fontSize: 12.sp,
              ),
            ),
          ),
        const SizedBox(height: 8),
        Container(
          width: double.infinity,
          padding: EdgeInsets.symmetric(horizontal: 16.sp, vertical: 12.sp),
          decoration: BoxDecoration(
            color: isEditable ? ColorPalette.white : ColorPalette.lightGrey,
            borderRadius: BorderRadius.circular(12),
            border: Border.all(color: Colors.grey[200]!),
          ),
          child: isEditable
              ? TextFormField(
                  initialValue: value.replaceAll(' L', ''),
                  keyboardType: TextInputType.number,
                  style: Theme.of(context).textTheme.bodySmall!.copyWith(
                    color: ColorPalette.black,
                    fontWeight: FontWeight.w500,
                  ),
                  decoration: InputDecoration(
                    border: InputBorder.none,
                    contentPadding: EdgeInsets.zero,
                    isDense: true,
                    suffix: Icon(
                      FluentIcons.edit_12_regular,
                      size: 13.sp,
                      color: Colors.grey,
                    ),
                  ),
                  onChanged: (newValue) {
                    if (onValueChanged != null) {
                      onValueChanged!(newValue);
                    }
                  },
                )
              : Text(
                  value,
                  style: Theme.of(context).textTheme.bodySmall!.copyWith(
                    color: isReference
                        ? ColorPalette.blue.withValues(alpha:0.9)
                        : ColorPalette.darkGrey,
                    fontWeight:
                        isReference ? FontWeight.w600 : FontWeight.w500,
                  ),
                ),
        ),
      ],
    );
  }
}