import 'package:flutter/material.dart';
import 'package:intl/intl.dart';
import 'package:provider/provider.dart';
import 'package:test_sa/controllers/localization/localization.dart';
import 'package:test_sa/controllers/providers/api/service_requests_provider.dart';
import 'package:test_sa/controllers/providers/api/user_provider.dart';
import 'package:test_sa/controllers/providers/settings/setting_provider.dart';
import 'package:test_sa/extensions/context_extension.dart';
import 'package:test_sa/extensions/int_extensions.dart';
import 'package:test_sa/extensions/string_extensions.dart';
import 'package:test_sa/extensions/text_extensions.dart';
import 'package:test_sa/extensions/widget_extensions.dart';
import 'package:test_sa/models/enums/translation_keys.dart';
import 'package:test_sa/models/enums/user_types.dart';
import 'package:test_sa/models/service_request/service_request.dart';
import 'package:test_sa/models/subtitle.dart';
import 'package:test_sa/models/user.dart';
import 'package:test_sa/views/app_style/colors.dart';
import 'package:test_sa/views/app_style/sizing.dart';
import 'package:test_sa/views/pages/user/requests/report/create_service_report.dart';
import 'package:test_sa/views/widgets/loaders/image_loader.dart';
import 'package:test_sa/views/widgets/requests/request_status.dart';

class ServiceRequestItem extends StatelessWidget {
  final int index;
  final ServiceRequest request;
  final Function(ServiceRequest) onPressed;

  const ServiceRequestItem({Key key, this.request, this.onPressed, this.index}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    User _user = Provider.of<UserProvider>(context, listen: false).user;
    final servicesProvider = Provider.of<ServiceRequestsProvider>(context, listen: false);
    final settingProvider = Provider.of<SettingProvider>(context, listen: false);
    Color itemColor = index % 2 == 0 ? Theme.of(context).colorScheme.primary : Theme.of(context).colorScheme.onPrimary;
    Color onItemColor = index % 2 != 0 ? Theme.of(context).colorScheme.primary : Theme.of(context).colorScheme.onPrimary;

    return Container(
      decoration: ShapeDecoration(
        color: Colors.white,
        shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.circular(20),
        ),
        shadows: const [BoxShadow(color: Color(0x07000000), blurRadius: 14, offset: Offset(0, 0), spreadRadius: 0)],
      ),
      child: Column(
        children: [
          Column(
            mainAxisSize: MainAxisSize.min,
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Row(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  StatusLabel(
                      label: request.priority.name,
                      id: request.priority.id,
                      textColor: AColors.getPriorityStatusTextColor(request.priority.id),
                      backgroundColor: AColors.getPriorityStatusColor(request.priority.id)),
                  8.width,
                  StatusLabel(label: request.statusLabel, textColor: AColors.getRequestStatusTextColor(request.statusValue), backgroundColor: AColors.getRequestStatusColor(request.statusValue)),
                  1.width.expanded,
                  Text(request.date.toServiceRequestCardFormat, textAlign: TextAlign.end, style: AppTextStyles.tinyFont.copyWith(color: const Color(0xFF3B3D4A))),
                ],
              ),
              8.height,
              Text(context.translation.serviceRequest, style: AppTextStyles.heading5.copyWith(color: const Color(0xFF3B3D4A))),
              Text(
                '${context.translation.assetName}: ${request.deviceEnName}',
                style: AppTextStyles.bodyText.copyWith(color: Color(0xFF757575)),
              ),
              Text(
                '${context.translation.assetNumber}:  ${request.device.number}',
                style: AppTextStyles.bodyText.copyWith(color: Color(0xFF757575)),
              ),
              Text(
                'Request Type: ${request.type.name}',
                style: AppTextStyles.bodyText.copyWith(color: Color(0xFF757575)),
              ),
              Text(
                'Request No: ${request.requestCode}',
                style: AppTextStyles.bodyText.copyWith(color: Color(0xFF757575)),
              ),
              8.height,
              Row(
                mainAxisSize: MainAxisSize.min,
                children: [
                  Text(
                    'View Details',
                    style: AppTextStyles.bodyText.copyWith(color: const Color(0xFF4A8DB7)),
                  ),
                  4.width,
                  const Icon(
                    Icons.arrow_forward,
                    color: Color(0xFF4A8DB7),
                    size: 14,
                  )
                ],
              ),
            ],
          ).paddingAll(16).onPress(() {
            onPressed(request);
          }),
        ],
      ),
    );
  }
}