Implemented Multiselect for Task Rate

This commit is contained in:
Gianfranco Gasbarri 2019-10-23 21:32:44 +01:00
parent a396e4d8a8
commit 134bb3c8a5
9 changed files with 295 additions and 35 deletions

View File

@ -61,6 +61,7 @@ import 'package:invoiceninja_flutter/ui/settings/tax_rates_vm.dart';
import 'package:invoiceninja_flutter/ui/settings/templates_and_reminders_vm.dart'; import 'package:invoiceninja_flutter/ui/settings/templates_and_reminders_vm.dart';
import 'package:invoiceninja_flutter/ui/settings/user_details_vm.dart'; import 'package:invoiceninja_flutter/ui/settings/user_details_vm.dart';
import 'package:invoiceninja_flutter/ui/task/task_screen_vm.dart'; import 'package:invoiceninja_flutter/ui/task/task_screen_vm.dart';
import 'package:invoiceninja_flutter/ui/tax_rate/tax_rate_screen_vm.dart';
import 'package:invoiceninja_flutter/utils/localization.dart'; import 'package:invoiceninja_flutter/utils/localization.dart';
import 'package:local_auth/local_auth.dart'; import 'package:local_auth/local_auth.dart';
import 'package:redux/redux.dart'; import 'package:redux/redux.dart';
@ -353,7 +354,7 @@ class InvoiceNinjaAppState extends State<InvoiceNinjaApp> {
CompanyGatewayEditScreen(), CompanyGatewayEditScreen(),
OnlinePaymentsScreen.route: (context) => OnlinePaymentsScreen(), OnlinePaymentsScreen.route: (context) => OnlinePaymentsScreen(),
TaxRatesScreen.route: (context) => TaxRatesScreen(), TaxRatesScreen.route: (context) => TaxRatesScreen(),
TaxRateSettingsScreen.route: (context) => TaxRateSettingsScreen(), TaxRateSettingsScreen.route: (context) => TaxRateScreenBuilder(),
TaxRateViewScreen.route: (context) => TaxRateViewScreen(), TaxRateViewScreen.route: (context) => TaxRateViewScreen(),
TaxRateEditScreen.route: (context) => TaxRateEditScreen(), TaxRateEditScreen.route: (context) => TaxRateEditScreen(),
ProductSettingsScreen.route: (context) => ProductSettingsScreen(), ProductSettingsScreen.route: (context) => ProductSettingsScreen(),

View File

@ -237,9 +237,20 @@ class FilterTaxRatesByEntity implements PersistUI {
} }
void handleTaxRateAction( void handleTaxRateAction(
BuildContext context, TaxRateEntity taxRate, EntityAction action) { BuildContext context, List<TaxRateEntity> taxRates, EntityAction action) {
assert(
[
EntityAction.restore,
EntityAction.archive,
EntityAction.delete,
EntityAction.toggleMultiselect
].contains(action) ||
taxRates.length == 1,
'Cannot perform this action on more than one tax rate');
final store = StoreProvider.of<AppState>(context); final store = StoreProvider.of<AppState>(context);
final localization = AppLocalization.of(context); final localization = AppLocalization.of(context);
final taxRate = taxRates.first;
switch (action) { switch (action) {
case EntityAction.edit: case EntityAction.edit:
@ -259,5 +270,50 @@ void handleTaxRateAction(
store.dispatch(DeleteTaxRateRequest( store.dispatch(DeleteTaxRateRequest(
snackBarCompleter(context, localization.deletedTaxRate), taxRate.id)); snackBarCompleter(context, localization.deletedTaxRate), taxRate.id));
break; break;
case EntityAction.toggleMultiselect:
if (!store.state.taxRateListState.isInMultiselect()) {
store.dispatch(StartTaxRateMultiselect(context: context));
}
if (taxRates.isEmpty) {
break;
}
for (final taxRate in taxRates) {
if (!store.state.taxRateListState.isSelected(taxRate)) {
store.dispatch(
AddToTaxRateMultiselect(context: context, entity: taxRate));
} else {
store.dispatch(
RemoveFromTaxRateMultiselect(context: context, entity: taxRate));
}
}
break;
} }
} }
class StartTaxRateMultiselect {
StartTaxRateMultiselect({@required this.context});
final BuildContext context;
}
class AddToTaxRateMultiselect {
AddToTaxRateMultiselect({@required this.context, @required this.entity});
final BuildContext context;
final BaseEntity entity;
}
class RemoveFromTaxRateMultiselect {
RemoveFromTaxRateMultiselect({@required this.context, @required this.entity});
final BuildContext context;
final BaseEntity entity;
}
class ClearTaxRateMultiselect {
ClearTaxRateMultiselect({@required this.context});
final BuildContext context;
}

View File

@ -52,6 +52,11 @@ final taxRateListReducer = combineReducers<ListUIState>([
TypedReducer<ListUIState, FilterTaxRatesByCustom1>(_filterTaxRatesByCustom1), TypedReducer<ListUIState, FilterTaxRatesByCustom1>(_filterTaxRatesByCustom1),
TypedReducer<ListUIState, FilterTaxRatesByCustom2>(_filterTaxRatesByCustom2), TypedReducer<ListUIState, FilterTaxRatesByCustom2>(_filterTaxRatesByCustom2),
TypedReducer<ListUIState, FilterTaxRatesByEntity>(_filterTaxRatesByClient), TypedReducer<ListUIState, FilterTaxRatesByEntity>(_filterTaxRatesByClient),
TypedReducer<ListUIState, StartTaxRateMultiselect>(_startListMultiselect),
TypedReducer<ListUIState, AddToTaxRateMultiselect>(_addToListMultiselect),
TypedReducer<ListUIState, RemoveFromTaxRateMultiselect>(
_removeFromListMultiselect),
TypedReducer<ListUIState, ClearTaxRateMultiselect>(_clearListMultiselect),
]); ]);
ListUIState _filterTaxRatesByClient( ListUIState _filterTaxRatesByClient(
@ -106,6 +111,28 @@ ListUIState _sortTaxRates(ListUIState taxRateListState, SortTaxRates action) {
..sortField = action.field); ..sortField = action.field);
} }
ListUIState _startListMultiselect(
ListUIState taxRateListState, StartTaxRateMultiselect action) {
return taxRateListState.rebuild((b) => b..selectedEntities = <BaseEntity>[]);
}
ListUIState _addToListMultiselect(
ListUIState taxRateListState, AddToTaxRateMultiselect action) {
return taxRateListState
.rebuild((b) => b..selectedEntities.add(action.entity));
}
ListUIState _removeFromListMultiselect(
ListUIState taxRateListState, RemoveFromTaxRateMultiselect action) {
return taxRateListState
.rebuild((b) => b..selectedEntities.remove(action.entity));
}
ListUIState _clearListMultiselect(
ListUIState taxRateListState, ClearTaxRateMultiselect action) {
return taxRateListState.rebuild((b) => b..selectedEntities = null);
}
final taxRatesReducer = combineReducers<TaxRateState>([ final taxRatesReducer = combineReducers<TaxRateState>([
TypedReducer<TaxRateState, SaveTaxRateSuccess>(_updateTaxRate), TypedReducer<TaxRateState, SaveTaxRateSuccess>(_updateTaxRate),
TypedReducer<TaxRateState, AddTaxRateSuccess>(_addTaxRate), TypedReducer<TaxRateState, AddTaxRateSuccess>(_addTaxRate),

View File

@ -1,6 +1,8 @@
import 'package:flutter/foundation.dart'; import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter_redux/flutter_redux.dart';
import 'package:invoiceninja_flutter/data/models/models.dart'; import 'package:invoiceninja_flutter/data/models/models.dart';
import 'package:invoiceninja_flutter/redux/app/app_state.dart';
import 'package:invoiceninja_flutter/ui/app/entities/entity_actions_dialog.dart'; import 'package:invoiceninja_flutter/ui/app/entities/entity_actions_dialog.dart';
import 'package:invoiceninja_flutter/ui/app/lists/list_divider.dart'; import 'package:invoiceninja_flutter/ui/app/lists/list_divider.dart';
import 'package:invoiceninja_flutter/ui/app/loading_indicator.dart'; import 'package:invoiceninja_flutter/ui/app/loading_indicator.dart';
@ -26,6 +28,9 @@ class TaxRateList extends StatelessWidget {
final filteredClient = final filteredClient =
filteredClientId != null ? viewModel.clientMap[filteredClientId] : null; filteredClientId != null ? viewModel.clientMap[filteredClientId] : null;
*/ */
final store = StoreProvider.of<AppState>(context);
final listUIState = store.state.uiState.taxRateUIState.listUIState;
final isInMultiselect = listUIState.isInMultiselect();
return Column( return Column(
children: <Widget>[ children: <Widget>[
@ -63,10 +68,22 @@ class TaxRateList extends StatelessWidget {
showDialog(); showDialog();
} else { } else {
viewModel.onEntityAction( viewModel.onEntityAction(
context, taxRate, action); context, [taxRate], action);
} }
}, },
onLongPress: () => showDialog(), onLongPress: () async {
final longPressIsSelection = store.state.uiState
.longPressSelectionIsDefault ??
true;
if (longPressIsSelection && !isInMultiselect) {
viewModel.onEntityAction(context, [taxRate],
EntityAction.toggleMultiselect);
} else {
showDialog();
}
},
isChecked: isInMultiselect &&
listUIState.isSelected(taxRate),
); );
}, },
), ),

View File

@ -8,7 +8,7 @@ import 'package:flutter/material.dart';
import 'package:invoiceninja_flutter/data/models/models.dart'; import 'package:invoiceninja_flutter/data/models/models.dart';
import 'package:invoiceninja_flutter/ui/app/dismissible_entity.dart'; import 'package:invoiceninja_flutter/ui/app/dismissible_entity.dart';
class TaxRateListItem extends StatelessWidget { class TaxRateListItem extends StatefulWidget {
const TaxRateListItem({ const TaxRateListItem({
@required this.user, @required this.user,
@required this.onEntityAction, @required this.onEntityAction,
@ -17,6 +17,8 @@ class TaxRateListItem extends StatelessWidget {
//@required this.onCheckboxChanged, //@required this.onCheckboxChanged,
@required this.taxRate, @required this.taxRate,
@required this.filter, @required this.filter,
this.onCheckboxChanged,
this.isChecked = false,
}); });
final UserEntity user; final UserEntity user;
@ -26,54 +28,78 @@ class TaxRateListItem extends StatelessWidget {
//final ValueChanged<bool> onCheckboxChanged; //final ValueChanged<bool> onCheckboxChanged;
final TaxRateEntity taxRate; final TaxRateEntity taxRate;
final String filter; final String filter;
final Function(bool) onCheckboxChanged;
final bool isChecked;
static final taxRateItemKey = (int id) => Key('__tax_rate_item_${id}__'); static final taxRateItemKey = (int id) => Key('__tax_rate_item_${id}__');
@override
_TaxRateListItemState createState() => _TaxRateListItemState();
}
class _TaxRateListItemState extends State<TaxRateListItem>
with TickerProviderStateMixin {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
final store = StoreProvider.of<AppState>(context); final store = StoreProvider.of<AppState>(context);
final state = store.state; final state = store.state;
final uiState = state.uiState; final uiState = state.uiState;
final taxRateUIState = uiState.taxRateUIState; final taxRateUIState = uiState.taxRateUIState;
final listUIState = taxRateUIState.listUIState;
final isInMultiselect = listUIState.isInMultiselect();
final showCheckbox = widget.onCheckboxChanged != null || isInMultiselect;
final filterMatch = filter != null && filter.isNotEmpty if (isInMultiselect) {
? taxRate.matchesFilterValue(filter) _multiselectCheckboxAnimController.forward();
} else {
_multiselectCheckboxAnimController.animateBack(0.0);
}
final filterMatch = widget.filter != null && widget.filter.isNotEmpty
? widget.taxRate.matchesFilterValue(widget.filter)
: null; : null;
final subtitle = filterMatch; final subtitle = filterMatch;
return DismissibleEntity( return DismissibleEntity(
userCompany: state.userCompany, userCompany: state.userCompany,
entity: taxRate, entity: widget.taxRate,
isSelected: taxRate.id == isSelected: widget.taxRate.id ==
(uiState.isEditing (uiState.isEditing
? taxRateUIState.editing.id ? taxRateUIState.editing.id
: taxRateUIState.selectedId), : taxRateUIState.selectedId),
onEntityAction: onEntityAction, onEntityAction: widget.onEntityAction,
child: ListTile( child: ListTile(
onTap: onTap, onTap: isInMultiselect
onLongPress: onLongPress, ? () => widget.onEntityAction(EntityAction.toggleMultiselect)
/* : widget.onTap,
leading: Checkbox( onLongPress: widget.onLongPress,
//key: NinjaKeys.taxRateItemCheckbox(taxRate.id), leading: showCheckbox
value: true, ? FadeTransition(
//onChanged: onCheckboxChanged, opacity: _multiselectCheckboxAnim,
onChanged: (value) { child: IgnorePointer(
return true; ignoring: listUIState.isInMultiselect(),
}, child: Checkbox(
//key: NinjaKeys.taxRateItemCheckbox(task.id),
value: widget.isChecked,
materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
onChanged: (value) => widget.onCheckboxChanged(value),
activeColor: Theme.of(context).accentColor,
), ),
*/ ),
)
: null,
title: Container( title: Container(
width: MediaQuery.of(context).size.width, width: MediaQuery.of(context).size.width,
child: Row( child: Row(
children: <Widget>[ children: <Widget>[
Expanded( Expanded(
child: Text( child: Text(
taxRate.name, widget.taxRate.name,
//key: NinjaKeys.clientItemClientKey(client.id), //key: NinjaKeys.clientItemClientKey(client.id),
style: Theme.of(context).textTheme.title, style: Theme.of(context).textTheme.title,
), ),
), ),
Text(formatNumber(taxRate.listDisplayAmount, context), Text(formatNumber(widget.taxRate.listDisplayAmount, context),
style: Theme.of(context).textTheme.title), style: Theme.of(context).textTheme.title),
], ],
), ),
@ -88,10 +114,28 @@ class TaxRateListItem extends StatelessWidget {
overflow: TextOverflow.ellipsis, overflow: TextOverflow.ellipsis,
) )
: Container(), : Container(),
EntityStateLabel(taxRate), EntityStateLabel(widget.taxRate),
], ],
), ),
), ),
); );
} }
Animation _multiselectCheckboxAnim;
AnimationController _multiselectCheckboxAnimController;
@override
void initState() {
super.initState();
_multiselectCheckboxAnimController =
AnimationController(vsync: this, duration: Duration(milliseconds: 500));
_multiselectCheckboxAnim = Tween<double>(begin: 0.0, end: 1.0)
.animate(_multiselectCheckboxAnimController);
}
@override
void dispose() {
_multiselectCheckboxAnimController.dispose();
super.dispose();
}
} }

View File

@ -80,8 +80,8 @@ class TaxRateListVM {
store.dispatch(ViewTaxRate(taxRateId: taxRate.id, context: context)); store.dispatch(ViewTaxRate(taxRateId: taxRate.id, context: context));
}, },
onEntityAction: onEntityAction:
(BuildContext context, BaseEntity taxRate, EntityAction action) => (BuildContext context, List<BaseEntity> taxRates, EntityAction action) =>
handleTaxRateAction(context, taxRate, action), handleTaxRateAction(context, taxRates, action),
onRefreshed: (context) => _handleRefresh(context), onRefreshed: (context) => _handleRefresh(context),
); );
} }
@ -95,7 +95,7 @@ class TaxRateListVM {
final bool isLoaded; final bool isLoaded;
final Function(BuildContext, TaxRateEntity) onTaxRateTap; final Function(BuildContext, TaxRateEntity) onTaxRateTap;
final Function(BuildContext) onRefreshed; final Function(BuildContext) onRefreshed;
final Function(BuildContext, TaxRateEntity, EntityAction) onEntityAction; final Function(BuildContext, List<TaxRateEntity>, EntityAction) onEntityAction;
final Function onClearEntityFilterPressed; final Function onClearEntityFilterPressed;
final Function(BuildContext) onViewEntityFilterPressed; final Function(BuildContext) onViewEntityFilterPressed;
} }

View File

@ -2,8 +2,10 @@ import 'package:flutter/material.dart';
import 'package:flutter_redux/flutter_redux.dart'; import 'package:flutter_redux/flutter_redux.dart';
import 'package:invoiceninja_flutter/constants.dart'; import 'package:invoiceninja_flutter/constants.dart';
import 'package:invoiceninja_flutter/ui/app/app_scaffold.dart'; import 'package:invoiceninja_flutter/ui/app/app_scaffold.dart';
import 'package:invoiceninja_flutter/ui/app/entities/entity_actions_dialog.dart';
import 'package:invoiceninja_flutter/ui/app/list_filter.dart'; import 'package:invoiceninja_flutter/ui/app/list_filter.dart';
import 'package:invoiceninja_flutter/ui/app/list_filter_button.dart'; import 'package:invoiceninja_flutter/ui/app/list_filter_button.dart';
import 'package:invoiceninja_flutter/ui/tax_rate/tax_rate_screen_vm.dart';
import 'package:invoiceninja_flutter/utils/localization.dart'; import 'package:invoiceninja_flutter/utils/localization.dart';
import 'package:invoiceninja_flutter/redux/app/app_state.dart'; import 'package:invoiceninja_flutter/redux/app/app_state.dart';
import 'package:invoiceninja_flutter/data/models/models.dart'; import 'package:invoiceninja_flutter/data/models/models.dart';
@ -12,15 +14,37 @@ import 'package:invoiceninja_flutter/redux/tax_rate/tax_rate_actions.dart';
import 'package:invoiceninja_flutter/ui/app/app_bottom_bar.dart'; import 'package:invoiceninja_flutter/ui/app/app_bottom_bar.dart';
class TaxRateSettingsScreen extends StatelessWidget { class TaxRateSettingsScreen extends StatelessWidget {
const TaxRateSettingsScreen({
Key key,
@required this.viewModel,
}) : super(key: key);
static const String route = '/$kSettings/$kSettingsTaxRates'; static const String route = '/$kSettings/$kSettingsTaxRates';
final TaxRateScreenVM viewModel;
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
final store = StoreProvider.of<AppState>(context); final store = StoreProvider.of<AppState>(context);
final state = store.state; final state = store.state;
final localization = AppLocalization.of(context); final localization = AppLocalization.of(context);
final userCompany = state.userCompany;
final listUIState = state.uiState.taxRateUIState.listUIState;
final isInMultiselect = listUIState.isInMultiselect();
return AppScaffold( return AppScaffold(
isChecked: isInMultiselect &&
listUIState.selectedEntities.length == viewModel.taxRateList.length,
showCheckbox: isInMultiselect,
onCheckboxChanged: (value) {
final taxRates = viewModel.taxRateList
.map<TaxRateEntity>((taxRateId) => viewModel.taxRateMap[taxRateId])
.where((taxRate) => value != listUIState.isSelected(taxRate))
.toList();
viewModel.onEntityAction(
context, taxRates, EntityAction.toggleMultiselect);
},
hideHamburgerButton: true, hideHamburgerButton: true,
appBarTitle: ListFilter( appBarTitle: ListFilter(
key: ValueKey(state.taxRateListState.filterClearedAt), key: ValueKey(state.taxRateListState.filterClearedAt),
@ -30,12 +54,44 @@ class TaxRateSettingsScreen extends StatelessWidget {
}, },
), ),
appBarActions: [ appBarActions: [
if (!viewModel.isInMultiselect)
ListFilterButton( ListFilterButton(
entityType: EntityType.taxRate, entityType: EntityType.taxRate,
onFilterPressed: (String value) { onFilterPressed: (String value) {
store.dispatch(FilterTaxRates(value)); store.dispatch(FilterTaxRates(value));
}, },
), ),
if (viewModel.isInMultiselect)
FlatButton(
key: key,
child: Text(
localization.cancel,
style: TextStyle(color: Colors.white),
),
onPressed: () {
store.dispatch(ClearTaxRateMultiselect(context: context));
},
),
if (viewModel.isInMultiselect)
FlatButton(
key: key,
textColor: Colors.white,
disabledTextColor: Colors.white54,
child: Text(
localization.done,
),
onPressed: state.taxRateListState.selectedEntities.isEmpty
? null
: () async {
await showEntityActionsDialog(
entities: state.taxRateListState.selectedEntities,
userCompany: userCompany,
context: context,
onEntityAction: viewModel.onEntityAction,
multiselect: true);
store.dispatch(ClearTaxRateMultiselect(context: context));
},
),
], ],
body: TaxRateListBuilder(), body: TaxRateListBuilder(),
bottomNavigationBar: AppBottomBar( bottomNavigationBar: AppBottomBar(

View File

@ -0,0 +1,59 @@
import 'package:built_collection/built_collection.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'package:flutter_redux/flutter_redux.dart';
import 'package:invoiceninja_flutter/data/models/models.dart';
import 'package:invoiceninja_flutter/redux/app/app_state.dart';
import 'package:invoiceninja_flutter/redux/tax_rate/tax_rate_actions.dart';
import 'package:invoiceninja_flutter/redux/tax_rate/tax_rate_selectors.dart';
import 'package:invoiceninja_flutter/ui/tax_rate/tax_rate_screen.dart';
import 'package:redux/redux.dart';
class TaxRateScreenBuilder extends StatelessWidget {
const TaxRateScreenBuilder({Key key}) : super(key: key);
@override
Widget build(BuildContext context) {
return StoreConnector<AppState, TaxRateScreenVM>(
//rebuildOnChange: true,
converter: TaxRateScreenVM.fromStore,
builder: (context, vm) {
return TaxRateSettingsScreen(
viewModel: vm,
);
},
);
}
}
class TaxRateScreenVM {
TaxRateScreenVM({
@required this.isInMultiselect,
@required this.taxRateList,
@required this.userCompany,
@required this.onEntityAction,
@required this.taxRateMap,
});
final bool isInMultiselect;
final UserCompanyEntity userCompany;
final List<String> taxRateList;
final Function(BuildContext, List<BaseEntity>, EntityAction) onEntityAction;
final BuiltMap<String, TaxRateEntity> taxRateMap;
static TaxRateScreenVM fromStore(Store<AppState> store) {
final state = store.state;
return TaxRateScreenVM(
taxRateMap: state.taxRateState.map,
taxRateList: memoizedFilteredTaxRateList(state.taxRateState.map,
state.taxRateState.list, state.taxRateListState),
userCompany: state.userCompany,
isInMultiselect: state.taxRateListState.isInMultiselect(),
onEntityAction: (BuildContext context, List<BaseEntity> taxRates,
EntityAction action) =>
handleTaxRateAction(context, taxRates, action),
);
}
}

View File

@ -85,7 +85,7 @@ class TaxRateViewVM {
} }
}, },
onEntityAction: (BuildContext context, EntityAction action) => onEntityAction: (BuildContext context, EntityAction action) =>
handleTaxRateAction(context, taxRate, action), handleTaxRateAction(context, [taxRate], action),
); );
} }