Haroon6138
/
cloudsolutions-atoms
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 25 Wiki Activity

improvements

Browse Source
ui_ux_rollout_merge
Sikander Saleem 2 weeks ago
parent 8d45b02614
commit a8667f31c9
1 changed files with 180 additions and 144 deletions
Show Stats Download Patch File Download Diff File

324
lib/views/widgets/equipment/asset_detail_page.dart
Unescape Escape View File

@ -39,6 +39,7 @@ class _AssetDetailPageState extends State<AssetDetailPage> with SingleTickerProv
late AnimationController _animationController; late AnimationController _animationController;
int? assetId; int? assetId;
AssetProvider? _assetProvider; AssetProvider? _assetProvider;
AssetByIdModel? assetModel;
@override @override
void initState() { void initState() {
@ -55,10 +56,6 @@ class _AssetDetailPageState extends State<AssetDetailPage> with SingleTickerProv
super.dispose(); super.dispose();
} }
int? assetId;
AssetProvider? _assetProvider;
AssetByIdModel? assetModel;
List<GenericAttachmentModel> attachments = []; List<GenericAttachmentModel> attachments = [];
@override @override
@ -85,12 +82,12 @@ class _AssetDetailPageState extends State<AssetDetailPage> with SingleTickerProv
if (snapshot.hasData) { if (snapshot.hasData) {
AssetByIdModel assetModel = snapshot.data!; AssetByIdModel assetModel = snapshot.data!;
attachments = assetModel?.assetAttachments attachments = assetModel?.assetAttachments
?.map((attachment) => GenericAttachmentModel( ?.map((attachment) => GenericAttachmentModel(
id: attachment.id, id: attachment.id,
name: attachment.attachmentName, name: attachment.attachmentName,
originalName: attachment.originalName, originalName: attachment.originalName,
)) ))
.toList() ?? .toList() ??
[]; [];
// Start animation when data is loaded // Start animation when data is loaded
_animationController.forward(from: 0.0); _animationController.forward(from: 0.0);
@ -200,160 +197,199 @@ class _AssetDetailPageState extends State<AssetDetailPage> with SingleTickerProv
), ),
); );
return SingleChildScrollView( final attachmentAnimation = Tween<double>(begin: 0.0, end: 1.0).animate(
padding: const EdgeInsets.all(16), CurvedAnimation(
child: Column( parent: _animationController,
crossAxisAlignment: CrossAxisAlignment.start, curve: const Interval(0.80, 1.0, curve: Curves.easeOut),
children: [ ),
// Animated image );
FadeTransition(
opacity: imageAnimation, final attachmentSlideAnimation = Tween<Offset>(
child: ScaleTransition( begin: const Offset(0.0, 0.1),
scale: imageScaleAnimation, end: Offset.zero,
child: AspectRatio( ).animate(
aspectRatio: 159 / 94, CurvedAnimation(
child: Container( parent: _animationController,
width: 95, curve: const Interval(0.80, 1.0, curve: Curves.easeOutCubic),
height: 95, ),
decoration: ShapeDecoration( );
color: AppColor.neutral30,
shape: RoundedRectangleBorder( return Column(
borderRadius: BorderRadius.circular(16), children: [
), SingleChildScrollView(
image: DecorationImage( padding: const EdgeInsets.all(16),
fit: BoxFit.cover, child: Column(
image: NetworkImage(assetModel.assetPhoto != null ? URLs.getFileUrl(assetModel.assetPhoto!)! : "https://www.lasteelcraft.com/images/no-image-available.png"),
)),
),
),
),
),
6.height,
// Animated content column
Column(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
// Status label with animation // Animated image
if (assetModel.commissioningStatus != null) FadeTransition(
FadeTransition( opacity: imageAnimation,
opacity: statusAnimation, child: ScaleTransition(
child: SlideTransition( scale: imageScaleAnimation,
position: statusSlideAnimation, child: AspectRatio(
child: StatusLabel( aspectRatio: 159 / 94,
label: assetModel.commissioningStatus!.name, child: Container(
textColor: AppColor.getRequestStatusTextColorByName(context, assetModel.commissioningStatus!.name!), width: 95,
backgroundColor: AppColor.getRequestStatusColorByName(context, assetModel.commissioningStatus!.name!), height: 95,
decoration: ShapeDecoration(
color: AppColor.neutral30,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(16),
),
image: DecorationImage(
fit: BoxFit.cover,
image: NetworkImage(assetModel.assetPhoto != null ? URLs.getFileUrl(assetModel.assetPhoto!)! : "https://www.lasteelcraft.com/images/no-image-available.png"),
)),
), ),
), ),
), ),
if (assetModel.commissioningStatus != null) 8.height,
// Header with animation
FadeTransition(
opacity: headerAnimation,
child: SlideTransition(
position: headerSlideAnimation,
child: InfoHeader16Widget(assetModel.modelDefinition?.assetName?.cleanupWhitespace.capitalizeFirstOfEach ?? "-"),
),
), ),
8.height, 6.height,
// Animated content column
if (context.userProvider.isEngineer && !(assetModel!.hasTrainingImageData ?? true)) ...[ Column(
Text( mainAxisAlignment: MainAxisAlignment.spaceBetween,
'*Upload Images for this asset', crossAxisAlignment: CrossAxisAlignment.start,
style: AppTextStyles.bodyText2.copyWith(color: AppColor.red30), children: [
), // Status label with animation
4.height, if (assetModel.commissioningStatus != null)
], FadeTransition(
opacity: statusAnimation,
child: SlideTransition(
position: statusSlideAnimation,
child: StatusLabel(
label: assetModel.commissioningStatus!.name,
textColor: AppColor.getRequestStatusTextColorByName(context, assetModel.commissioningStatus!.name!),
backgroundColor: AppColor.getRequestStatusColorByName(context, assetModel.commissioningStatus!.name!),
),
),
),
if (assetModel.commissioningStatus != null) 8.height,
// Details row with animation // Header with animation
FadeTransition( FadeTransition(
opacity: detailsAnimation, opacity: headerAnimation,
child: SlideTransition( child: SlideTransition(
position: detailsSlideAnimation, position: headerSlideAnimation,
child: Row( child: Column(
crossAxisAlignment: CrossAxisAlignment.start, mainAxisSize: MainAxisSize.min,
children: [
Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
spacing: 2,
children: [ children: [
InfoTextWidget(label: context.translation.assetNo, value: assetModel.multiAssets!.first.assetNumber, showEmptyValue: true), InfoHeader16Widget(assetModel.modelDefinition?.assetName?.cleanupWhitespace.capitalizeFirstOfEach ?? "-"),
InfoTextWidget(label: context.translation.modelName, value: assetModel.modelDefinition!.modelName, showEmptyValue: true), if (context.userProvider.isEngineer && !(assetModel.hasTrainingImageData ?? true))
InfoTextWidget(label: context.translation.supplier, value: assetModel.supplier?.suppliername, showEmptyValue: true), Text(
InfoTextWidget(label: context.translation.manufacture, value: assetModel.modelDefinition!.manufacturerName, showEmptyValue: true), '*Upload Images for this asset',
style: AppTextStyles.bodyText2.copyWith(color: AppColor.red30),
),
], ],
).expanded, ),
8.width, ),
Column( ),
8.height,
// Details row with animation
FadeTransition(
opacity: detailsAnimation,
child: SlideTransition(
position: detailsSlideAnimation,
child: Row(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
InfoTextWidget(label: context.translation.snNo, value: assetModel.multiAssets!.first.assetSerialNo, showEmptyValue: true), Column(
InfoTextWidget(label: context.translation.site, value: assetModel.site?.custName?.cleanupWhitespace.capitalizeFirstOfEach, showEmptyValue: true), crossAxisAlignment: CrossAxisAlignment.start,
InfoTextWidget(label: context.translation.building, value: assetModel.building?.name?.cleanupWhitespace.capitalizeFirstOfEach, showEmptyValue: true), children: [
InfoTextWidget(label: context.translation.floor, value: assetModel.floor?.name?.cleanupWhitespace.capitalizeFirstOfEach, showEmptyValue: true), InfoTextWidget(label: context.translation.assetNo, value: assetModel.multiAssets!.first.assetNumber, showEmptyValue: true),
InfoTextWidget(label: context.translation.md, value: assetModel.department?.departmentName?.cleanupWhitespace.capitalizeFirstOfEach, showEmptyValue: true), InfoTextWidget(label: context.translation.modelName, value: assetModel.modelDefinition!.modelName, showEmptyValue: true),
InfoTextWidget(label: context.translation.room, value: assetModel.room?.name?.cleanupWhitespace.capitalizeFirstOfEach, showEmptyValue: true), InfoTextWidget(label: context.translation.supplier, value: assetModel.supplier?.suppliername, showEmptyValue: true),
InfoTextWidget(label: context.translation.manufacture, value: assetModel.modelDefinition!.manufacturerName, showEmptyValue: true),
],
).expanded,
8.width,
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
InfoTextWidget(label: context.translation.snNo, value: assetModel.multiAssets!.first.assetSerialNo, showEmptyValue: true),
InfoTextWidget(label: context.translation.site, value: assetModel.site?.custName?.cleanupWhitespace.capitalizeFirstOfEach, showEmptyValue: true),
InfoTextWidget(label: context.translation.building, value: assetModel.building?.name?.cleanupWhitespace.capitalizeFirstOfEach, showEmptyValue: true),
InfoTextWidget(label: context.translation.floor, value: assetModel.floor?.name?.cleanupWhitespace.capitalizeFirstOfEach, showEmptyValue: true),
InfoTextWidget(label: context.translation.md, value: assetModel.department?.departmentName?.cleanupWhitespace.capitalizeFirstOfEach, showEmptyValue: true),
InfoTextWidget(label: context.translation.room, value: assetModel.room?.name?.cleanupWhitespace.capitalizeFirstOfEach, showEmptyValue: true),
],
).expanded,
], ],
).expanded, ),
], ),
), ),
), 8.height,
),
8.height,
// Divider with animation // Divider with animation
FadeTransition( FadeTransition(
opacity: datesAnimation, opacity: datesAnimation,
child: const Divider(color: AppColor.neutral30, height: 1, thickness: 1), child: const Divider(color: AppColor.neutral30, height: 1, thickness: 1),
),
8.height,
// Dates section with animation
FadeTransition(
opacity: datesAnimation,
child: SlideTransition(
position: datesSlideAnimation,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
InfoTextWidget(label: context.translation.installationDate, value: assetModel.installationDate?.toAssetDetailsFormat, showEmptyValue: true),
InfoTextWidget(label: context.translation.nextPmDate, value: assetModel.nextPMDate?.toAssetDetailsFormat, showEmptyValue: true),
InfoTextWidget(label: context.translation.lastPmDate, value: assetModel.lastPMDate?.toAssetDetailsFormat, showEmptyValue: true),
],
), ),
), 8.height,
),
// Description with animation (if exists) // Dates section with animation
if ((assetModel.modelDefinition?.assetDescription ?? "").isNotEmpty) ...[ FadeTransition(
8.height, opacity: datesAnimation,
FadeTransition( child: SlideTransition(
opacity: descAnimation, position: datesSlideAnimation,
child: const Divider().defaultStyle(context), child: Column(
), crossAxisAlignment: CrossAxisAlignment.start,
FadeTransition( children: [
opacity: descAnimation, InfoTextWidget(label: context.translation.installationDate, value: assetModel.installationDate?.toAssetDetailsFormat, showEmptyValue: true),
child: SlideTransition( InfoTextWidget(label: context.translation.nextPmDate, value: assetModel.nextPMDate?.toAssetDetailsFormat, showEmptyValue: true),
position: descSlideAnimation, InfoTextWidget(label: context.translation.lastPmDate, value: assetModel.lastPMDate?.toAssetDetailsFormat, showEmptyValue: true),
child: InfoTextWidget(label: assetModel.modelDefinition!.assetDescription!, showEmptyValue: true, isMsg: true), ],
),
),
), ),
),
] // Description with animation (if exists)
if ((assetModel.modelDefinition?.assetDescription ?? "").isNotEmpty) ...[
8.height,
FadeTransition(
opacity: descAnimation,
child: const Divider().defaultStyle(context),
),
FadeTransition(
opacity: descAnimation,
child: SlideTransition(
position: descSlideAnimation,
child: InfoTextWidget(label: assetModel.modelDefinition!.assetDescription!, showEmptyValue: true, isMsg: true),
),
),
],
if (attachments.isNotEmpty) ...[
8.height,
FadeTransition(
opacity: attachmentAnimation,
child: const Divider().defaultStyle(context),
),
FadeTransition(
opacity: attachmentAnimation,
child: SlideTransition(
position: attachmentSlideAnimation,
child: FilesList(images: attachments.map((toElement) => URLs.getFileUrl(toElement.name!) ?? '').toList()),
),
),
]
],
),
], ],
).toShadowContainer(context),
).expanded,
if (context.userProvider.isEngineer && !(assetModel.hasTrainingImageData ?? true))
FooterActionButton.footerContainer(
context: context,
child: AppFilledButton(
buttonColor: AppColor.primary10,
label: "Upload Images",
onPressed: _upload,
),
), ),
FilesList(images: attachments.map((toElement) => URLs.getFileUrl(toElement.name!) ?? '').toList()), ],
],
).toShadowContainer(context),
if (context.userProvider.isEngineer && !(assetModel!.hasTrainingImageData ?? true))
FooterActionButton.footerContainer(
context: context,
child: AppFilledButton(
buttonColor: AppColor.primary10,
label: "Upload Images",
onPressed: _upload,
),
),
); );
} }
return const Center(child: ALoading()); return const Center(child: ALoading());

Write Preview
Loading…
Cancel
Save