TF-2083 Add condition row widget and condition remove button widget

(cherry picked from commit 40ebc31f7a260051b0c0b2373fd40a55fe1ddd9e)
This commit is contained in:
hieubt
2023-09-11 11:12:54 +07:00
committed by Dat Vu
parent fb8a5cb6b8
commit ce330e3239
4 changed files with 166 additions and 129 deletions
@@ -1,4 +1,3 @@
// ignore_for_file: public_member_api_docs, sort_constructors_first
import 'package:equatable/equatable.dart';
import 'package:flutter/material.dart';
@@ -0,0 +1,31 @@
import 'package:core/presentation/extensions/color_extension.dart';
import 'package:core/presentation/resources/image_paths.dart';
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
class RuleFilterConditionRemoveButton extends StatelessWidget {
final Function()? tapRemoveRuleFilterConditionCallback;
final ImagePaths? imagePath;
const RuleFilterConditionRemoveButton({
Key? key,
this.tapRemoveRuleFilterConditionCallback,
this.imagePath,
}) : super(key: key);
@override
Widget build(BuildContext context) {
return InkWell(
onTap: tapRemoveRuleFilterConditionCallback,
child: CircleAvatar(
backgroundColor: AppColor.colorRemoveRuleFilterConditionButton,
radius: 22,
child: SvgPicture.asset(
imagePath!.icMinimize,
fit: BoxFit.fill,
colorFilter: AppColor.colorDeletePermanentlyButton.asFilter(),
),
)
);
}
}
@@ -0,0 +1,123 @@
import 'package:core/presentation/resources/image_paths.dart';
import 'package:core/presentation/utils/keyboard_utils.dart';
import 'package:flutter/material.dart';
import 'package:rule_filter/rule_filter/rule_condition.dart';
import 'package:rule_filter/rule_filter/rule_condition.dart' as rule_condition;
import 'package:tmail_ui_user/features/base/widget/drop_down_button_widget.dart';
import 'package:tmail_ui_user/features/rules_filter_creator/presentation/model/rule_filter_condition_type.dart';
import 'package:tmail_ui_user/features/rules_filter_creator/presentation/widgets/rule_filter_button_field.dart';
import 'package:tmail_ui_user/features/rules_filter_creator/presentation/widgets/rule_filter_condition_remove_button_builder.dart';
import 'package:tmail_ui_user/features/rules_filter_creator/presentation/widgets/rules_filter_input_field_builder.dart';
import 'package:tmail_ui_user/main/localizations/app_localizations.dart';
class RuleFilterConditionRow extends StatelessWidget {
final RuleFilterConditionScreenType? ruleFilterConditionScreenType;
final RuleCondition ruleCondition;
final Function(Field?)? tapRuleConditionFieldCallback;
final Function(Comparator?)? tapRuleConditionComparatorCallback;
final String? conditionValueErrorText;
final TextEditingController? conditionValueEditingController;
final FocusNode? conditionValueFocusNode;
final OnChangeFilterInputAction? conditionValueOnChangeAction;
final Function()? tapRemoveRuleFilterConditionCallback;
final ImagePaths? imagePaths;
const RuleFilterConditionRow({
Key? key,
required this.ruleFilterConditionScreenType,
required this.ruleCondition,
this.tapRuleConditionFieldCallback,
this.tapRuleConditionComparatorCallback,
this.conditionValueErrorText,
this.conditionValueEditingController,
this.conditionValueFocusNode,
this.conditionValueOnChangeAction,
this.tapRemoveRuleFilterConditionCallback,
this.imagePaths,
}) : super(key: key);
@override
Widget build(BuildContext context) {
switch (ruleFilterConditionScreenType) {
case RuleFilterConditionScreenType.mobile:
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
RuleFilterButtonField<rule_condition.Field>(
value: ruleCondition.field,
tapActionCallback: (value) {
KeyboardUtils.hideKeyboard(context);
tapRuleConditionFieldCallback!(ruleCondition.field);
},
),
Padding(
padding: const EdgeInsets.symmetric(vertical: 12),
child: RuleFilterButtonField<rule_condition.Comparator>(
value: ruleCondition.comparator,
tapActionCallback: (value) {
KeyboardUtils.hideKeyboard(context);
tapRuleConditionComparatorCallback!(ruleCondition.comparator);
},
)
),
RulesFilterInputField(
hintText: AppLocalizations.of(context).conditionValueHintTextInput,
errorText: conditionValueErrorText,
focusNode: conditionValueFocusNode,
onChangeAction: conditionValueOnChangeAction,
editingController: conditionValueEditingController,
),
],
);
case RuleFilterConditionScreenType.tablet:
case RuleFilterConditionScreenType.desktop:
return Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Expanded(
child: DropDownButtonWidget<rule_condition.Field>(
items: rule_condition.Field.values,
itemSelected: ruleCondition.field,
dropdownMaxHeight: 250,
onChanged: (newField) => {
tapRuleConditionFieldCallback!(newField)
},
supportSelectionIcon: true,
)
),
Container(
width: 220,
padding: const EdgeInsets.symmetric(horizontal: 12),
child: DropDownButtonWidget<rule_condition.Comparator>(
items: rule_condition.Comparator.values,
itemSelected: ruleCondition.comparator,
onChanged: (newComparator) => {
tapRuleConditionComparatorCallback!(newComparator)
},
supportSelectionIcon: true,
)
),
Expanded(
child: RulesFilterInputField(
hintText: AppLocalizations.of(context).conditionValueHintTextInput,
errorText: conditionValueErrorText,
focusNode: conditionValueFocusNode,
onChangeAction: conditionValueOnChangeAction,
editingController: conditionValueEditingController,
)
),
Container(
padding: const EdgeInsets.only(left: 12),
alignment: Alignment.center,
child: RuleFilterConditionRemoveButton(
tapRemoveRuleFilterConditionCallback: tapRemoveRuleFilterConditionCallback,
imagePath: imagePaths,
)
),
],
);
default:
return const SizedBox.shrink();
}
}
}
@@ -1,15 +1,11 @@
import 'package:core/presentation/extensions/color_extension.dart';
import 'package:core/presentation/utils/keyboard_utils.dart';
import 'package:flutter/material.dart';
import 'package:flutter_slidable/flutter_slidable.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:tmail_ui_user/features/base/widget/drop_down_button_widget.dart';
import 'package:tmail_ui_user/features/rules_filter_creator/presentation/model/rule_filter_condition_type.dart';
import 'package:rule_filter/rule_filter/rule_condition.dart' as rule_condition;
import 'package:rule_filter/rule_filter/rule_condition.dart';
import 'package:tmail_ui_user/features/rules_filter_creator/presentation/widgets/rule_filter_button_field.dart';
import 'package:tmail_ui_user/features/rules_filter_creator/presentation/widgets/rule_filter_condition_row_builder.dart';
import 'package:tmail_ui_user/features/rules_filter_creator/presentation/widgets/rules_filter_input_field_builder.dart';
import 'package:tmail_ui_user/main/localizations/app_localizations.dart';
import 'package:core/presentation/resources/image_paths.dart';
class RuleFilterConditionWidget extends StatelessWidget {
@@ -80,18 +76,17 @@ class RuleFilterConditionWidget extends StatelessWidget {
color: AppColor.colorBackgroundFieldConditionRulesFilter,
borderRadius: borderRadius,
),
child: _buildRuleFilterCondition(
context,
ruleFilterConditionScreenType,
ruleCondition,
tapRuleConditionFieldCallback,
tapRuleConditionComparatorCallback,
conditionValueErrorText,
conditionValueEditingController,
conditionValueFocusNode,
conditionValueOnChangeAction,
tapRemoveRuleFilterConditionCallback,
imagePaths,
child: RuleFilterConditionRow(
ruleFilterConditionScreenType: ruleFilterConditionScreenType,
ruleCondition: ruleCondition,
tapRuleConditionFieldCallback: tapRuleConditionFieldCallback,
tapRuleConditionComparatorCallback: tapRuleConditionComparatorCallback,
conditionValueErrorText: conditionValueErrorText,
conditionValueEditingController: conditionValueEditingController,
conditionValueFocusNode: conditionValueFocusNode,
conditionValueOnChangeAction: conditionValueOnChangeAction,
tapRemoveRuleFilterConditionCallback: tapRemoveRuleFilterConditionCallback,
imagePaths: imagePaths,
)
);
}
@@ -100,115 +95,4 @@ class RuleFilterConditionWidget extends StatelessWidget {
);
}
}
Widget _buildRuleFilterCondition(
BuildContext context,
RuleFilterConditionScreenType? ruleFilterConditionScreenType,
RuleCondition ruleCondition,
Function(Field?)? tapRuleConditionFieldCallback,
Function(Comparator?)? tapRuleConditionComparatorCallback,
String? conditionValueErrorText,
TextEditingController? conditionValueEditingController,
FocusNode? conditionValueFocusNode,
OnChangeFilterInputAction? conditionValueOnChangeAction,
Function()? tapRemoveRuleFilterConditionCallback,
ImagePaths? imagePaths,
) {
switch (ruleFilterConditionScreenType) {
case RuleFilterConditionScreenType.mobile:
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
RuleFilterButtonField<rule_condition.Field>(
value: ruleCondition.field,
tapActionCallback: (value) {
KeyboardUtils.hideKeyboard(context);
tapRuleConditionFieldCallback!(ruleCondition.field);
},
),
Padding(
padding: const EdgeInsets.symmetric(vertical: 12),
child: RuleFilterButtonField<rule_condition.Comparator>(
value: ruleCondition.comparator,
tapActionCallback: (value) {
KeyboardUtils.hideKeyboard(context);
tapRuleConditionComparatorCallback!(ruleCondition.comparator);
},
)
),
RulesFilterInputField(
hintText: AppLocalizations.of(context).conditionValueHintTextInput,
errorText: conditionValueErrorText,
focusNode: conditionValueFocusNode,
onChangeAction: conditionValueOnChangeAction,
editingController: conditionValueEditingController,
),
],
);
case RuleFilterConditionScreenType.tablet:
case RuleFilterConditionScreenType.desktop:
return Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Expanded(
child: DropDownButtonWidget<rule_condition.Field>(
items: rule_condition.Field.values,
itemSelected: ruleCondition.field,
dropdownMaxHeight: 250,
onChanged: (newField) => {
tapRuleConditionFieldCallback!(newField)
},
supportSelectionIcon: true,
)
),
Container(
width: 220,
padding: const EdgeInsets.symmetric(horizontal: 12),
child: DropDownButtonWidget<rule_condition.Comparator>(
items: rule_condition.Comparator.values,
itemSelected: ruleCondition.comparator,
onChanged: (newComparator) => {
tapRuleConditionComparatorCallback!(newComparator)
},
supportSelectionIcon: true,
)
),
Expanded(
child: RulesFilterInputField(
hintText: AppLocalizations.of(context).conditionValueHintTextInput,
errorText: conditionValueErrorText,
focusNode: conditionValueFocusNode,
onChangeAction: conditionValueOnChangeAction,
editingController: conditionValueEditingController,
)
),
Container(
padding: const EdgeInsets.only(left: 12),
alignment: Alignment.center,
child: _buildRemoveRuleFilterConditionButton(tapRemoveRuleFilterConditionCallback, imagePaths)
),
],
);
default:
return Container();
}
}
Widget _buildRemoveRuleFilterConditionButton (
Function()? tapRemoveRuleFilterConditionCallback,
ImagePaths? imagePath,
) {
return InkWell(
onTap: tapRemoveRuleFilterConditionCallback,
child: CircleAvatar(
backgroundColor: AppColor.colorRemoveRuleFilterConditionButton,
radius: 22,
child: SvgPicture.asset(
imagePath!.icMinimize,
fit: BoxFit.fill,
colorFilter: AppColor.colorDeletePermanentlyButton.asFilter(),
),
)
);
}