invoice/lib/ui/task/edit/task_edit_desktop.dart

398 lines
16 KiB
Dart

import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:invoiceninja_flutter/constants.dart';
import 'package:invoiceninja_flutter/data/models/models.dart';
import 'package:invoiceninja_flutter/redux/task/task_selectors.dart';
import 'package:invoiceninja_flutter/ui/app/entity_dropdown.dart';
import 'package:invoiceninja_flutter/ui/app/form_card.dart';
import 'package:invoiceninja_flutter/ui/app/forms/custom_field.dart';
import 'package:invoiceninja_flutter/ui/app/forms/date_picker.dart';
import 'package:invoiceninja_flutter/ui/app/forms/decorated_form_field.dart';
import 'package:invoiceninja_flutter/ui/app/forms/duration_picker.dart';
import 'package:invoiceninja_flutter/ui/app/forms/dynamic_selector.dart';
import 'package:invoiceninja_flutter/ui/app/forms/project_picker.dart';
import 'package:invoiceninja_flutter/ui/app/forms/time_picker.dart';
import 'package:invoiceninja_flutter/ui/app/forms/user_picker.dart';
import 'package:invoiceninja_flutter/ui/app/scrollable_listview.dart';
import 'package:invoiceninja_flutter/ui/invoice/edit/invoice_edit_items_desktop.dart';
import 'package:invoiceninja_flutter/ui/task/edit/task_edit_details_vm.dart';
import 'package:invoiceninja_flutter/utils/completers.dart';
import 'package:invoiceninja_flutter/utils/formatting.dart';
import 'package:invoiceninja_flutter/utils/localization.dart';
import 'package:invoiceninja_flutter/redux/client/client_selectors.dart';
class TaskEditDesktop extends StatefulWidget {
const TaskEditDesktop({
Key key,
@required this.viewModel,
}) : super(key: key);
final TaskEditDetailsVM viewModel;
@override
_TaskEditDesktopState createState() => _TaskEditDesktopState();
}
class _TaskEditDesktopState extends State<TaskEditDesktop> {
final _numberController = TextEditingController();
final _rateController = TextEditingController();
final _descriptionController = TextEditingController();
final _custom1Controller = TextEditingController();
final _custom2Controller = TextEditingController();
final _custom3Controller = TextEditingController();
final _custom4Controller = TextEditingController();
final _debouncer = Debouncer();
List<TextEditingController> _controllers = [];
int _updatedAt = 0;
int _dateUpdatedAt = 0;
int _startUpdatedAt = 0;
int _endUpdatedAt = 0;
int _durationUpdateAt = 0;
@override
void didChangeDependencies() {
_controllers = [
_numberController,
_rateController,
_descriptionController,
_custom1Controller,
_custom2Controller,
_custom3Controller,
_custom4Controller,
];
_controllers.forEach((controller) => controller.removeListener(_onChanged));
final task = widget.viewModel.task;
_numberController.text = task.number;
_rateController.text = formatNumber(task.rate, context,
formatNumberType: FormatNumberType.inputMoney);
_descriptionController.text = task.description;
_custom1Controller.text = task.customValue1;
_custom2Controller.text = task.customValue2;
_custom3Controller.text = task.customValue3;
_custom4Controller.text = task.customValue4;
_controllers.forEach((controller) => controller.addListener(_onChanged));
super.didChangeDependencies();
}
@override
void dispose() {
_controllers.forEach((controller) {
controller.removeListener(_onChanged);
controller.dispose();
});
super.dispose();
}
void _onChanged() {
final task = widget.viewModel.task.rebuild((b) => b
..number = _numberController.text.trim()
..rate = parseDouble(_rateController.text.trim())
..description = _descriptionController.text.trim()
..customValue1 = _custom1Controller.text.trim()
..customValue2 = _custom2Controller.text.trim()
..customValue3 = _custom3Controller.text.trim()
..customValue4 = _custom4Controller.text.trim());
if (task != widget.viewModel.task) {
_debouncer.run(() {
widget.viewModel.onChanged(task);
});
}
}
@override
Widget build(BuildContext context) {
final viewModel = widget.viewModel;
final localization = AppLocalization.of(context);
final task = viewModel.task;
final state = viewModel.state;
final company = state.company;
final client = state.clientState.get(task.clientId);
final taskTimes = task.getTaskTimes(sort: false);
if (!taskTimes.any((taskTime) => taskTime.isEmpty)) {
taskTimes.add(TaskTime().rebuild((b) => b..startDate = null));
}
final rateLabel = localization.rate +
'' +
formatNumber(
taskRateSelector(
company: company,
task: TaskEntity(),
client: client,
group: state.groupState.get(client.groupId),
project: state.projectState.get(task.projectId),
),
context,
currencyId: (client.currencyId ?? '').isNotEmpty
? client.currencyId
: company.currencyId);
return ScrollableListView(
children: [
Row(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisSize: MainAxisSize.max,
children: [
Expanded(
child: FormCard(
crossAxisAlignment: CrossAxisAlignment.start,
padding: const EdgeInsets.only(
top: kMobileDialogPadding,
right: kMobileDialogPadding / 2,
bottom: kMobileDialogPadding,
left: kMobileDialogPadding),
children: [
if (!task.isInvoiced) ...[
EntityDropdown(
key: ValueKey('__client_${task.clientId}__'),
entityType: EntityType.client,
labelText: localization.client,
entityId: task.clientId,
entityList: memoizedDropdownClientList(
state.clientState.map,
state.clientState.list,
state.userState.map,
state.staticState),
onSelected: (client) {
viewModel.onChanged(task.rebuild((b) => b
..clientId = client?.id ?? ''
..projectId = ''));
},
onAddPressed: (completer) {
viewModel.onAddClientPressed(context, completer);
},
),
ProjectPicker(
key: Key('__project_${task.clientId}__'),
projectId: task.projectId,
clientId: task.clientId,
onChanged: (selectedId) {
final project = state.projectState.get(selectedId);
viewModel.onChanged(task.rebuild((b) => b
..projectId = project?.id
..clientId = (project?.clientId ?? '').isNotEmpty
? project.clientId
: task.clientId));
},
onAddPressed: (completer) {
viewModel.onAddProjectPressed(context, completer);
},
),
],
UserPicker(
userId: task.assignedUserId,
onChanged: (userId) => viewModel.onChanged(
task.rebuild((b) => b..assignedUserId = userId)),
),
CustomField(
controller: _custom1Controller,
field: CustomFieldType.task1,
value: task.customValue1,
),
CustomField(
controller: _custom3Controller,
field: CustomFieldType.task3,
value: task.customValue3,
),
],
),
),
Expanded(
child: FormCard(
crossAxisAlignment: CrossAxisAlignment.start,
padding: const EdgeInsets.only(
top: kMobileDialogPadding,
right: kMobileDialogPadding / 2,
bottom: kMobileDialogPadding,
left: kMobileDialogPadding / 2),
children: [
DecoratedFormField(
controller: _numberController,
label: localization.taskNumber,
isMoney: false,
),
DecoratedFormField(
key: ValueKey('__rate__'),
controller: _rateController,
label: rateLabel,
keyboardType: TextInputType.numberWithOptions(
decimal: true, signed: true),
autocorrect: false,
),
DynamicSelector(
key: ValueKey('__task_status_${task.statusId}__'),
allowClearing: false,
entityType: EntityType.taskStatus,
labelText: localization.status,
entityId: task.statusId,
entityIds: state.taskStatusState.list.toList(),
onChanged: (selectedId) {
final taskStatus = state.taskStatusState.map[selectedId];
viewModel.onChanged(task.rebuild((b) => b
..statusId = taskStatus?.id ?? ''
..statusOrder = null));
},
),
CustomField(
controller: _custom2Controller,
field: CustomFieldType.task2,
value: task.customValue2,
),
CustomField(
controller: _custom4Controller,
field: CustomFieldType.task4,
value: task.customValue4,
),
],
),
),
Expanded(
child: FormCard(
crossAxisAlignment: CrossAxisAlignment.start,
padding: const EdgeInsets.only(
top: kMobileDialogPadding,
right: kMobileDialogPadding,
bottom: kMobileDialogPadding,
left: kMobileDialogPadding / 2),
children: [
DecoratedFormField(
maxLines: 6,
controller: _descriptionController,
keyboardType: TextInputType.multiline,
label: localization.description,
),
SizedBox(height: 4),
],
),
),
],
),
FormCard(
padding: const EdgeInsets.symmetric(horizontal: kMobileDialogPadding),
child: FocusTraversalGroup(
policy: ReadingOrderTraversalPolicy(),
child: Table(
key: ValueKey('__table_${_updatedAt}__'),
columnWidths: {
4: FixedColumnWidth(kMinInteractiveDimension),
},
children: [
TableRow(
children: [
TableHeader(localization.date),
TableHeader(localization.startTime),
TableHeader(localization.endTime),
TableHeader(localization.duration),
TableHeader(''),
],
),
for (var index = 0; index < taskTimes.length; index++)
TableRow(children: [
Padding(
padding: const EdgeInsets.only(right: kTableColumnGap),
child: DatePicker(
key: ValueKey(
'__${_startUpdatedAt}_${_durationUpdateAt}_${index}__'),
selectedDate: taskTimes[index].startDate == null
? null
: convertDateTimeToSqlDate(
taskTimes[index].startDate.toLocal()),
onSelected: (date) {
final taskTime = taskTimes[index].copyWithDate(date);
viewModel.onUpdatedTaskTime(taskTime, index);
setState(() {
_dateUpdatedAt =
DateTime.now().millisecondsSinceEpoch;
});
},
),
),
Padding(
padding: const EdgeInsets.only(right: kTableColumnGap),
child: TimePicker(
key: ValueKey('__${_durationUpdateAt}_${index}__'),
selectedDate: taskTimes[index].startDate,
selectedDateTime: taskTimes[index].startDate,
onSelected: (timeOfDay) {
final taskTime =
taskTimes[index].copyWithStartDateTime(timeOfDay);
viewModel.onUpdatedTaskTime(taskTime, index);
setState(() {
_startUpdatedAt =
DateTime.now().millisecondsSinceEpoch;
});
},
),
),
Padding(
padding: const EdgeInsets.only(right: kTableColumnGap),
child: TimePicker(
key: ValueKey('__${_durationUpdateAt}_${index}__'),
selectedDate: taskTimes[index].startDate,
selectedDateTime: taskTimes[index].endDate,
isEndTime: true,
onSelected: (timeOfDay) {
final taskTime =
taskTimes[index].copyWithEndDateTime(timeOfDay);
viewModel.onUpdatedTaskTime(taskTime, index);
setState(() {
_endUpdatedAt =
DateTime.now().millisecondsSinceEpoch;
});
},
),
),
Padding(
padding: const EdgeInsets.only(right: kTableColumnGap),
child: DurationPicker(
key: ValueKey(
'__${_startUpdatedAt}_${_endUpdatedAt}_${_dateUpdatedAt}_${index}__'),
onSelected: (Duration duration) {
final taskTime =
taskTimes[index].copyWithDuration(duration);
viewModel.onUpdatedTaskTime(taskTime, index);
setState(() {
_durationUpdateAt =
DateTime.now().millisecondsSinceEpoch;
});
},
selectedDuration: (taskTimes[index].startDate == null ||
taskTimes[index].endDate == null)
? null
: taskTimes[index].duration,
),
),
Padding(
padding: const EdgeInsets.only(top: 4),
child: IconButton(
icon: Icon(Icons.clear),
tooltip: localization.remove,
onPressed: taskTimes[index].isEmpty
? null
: () {
viewModel.onRemoveTaskTime(index);
setState(() {
_updatedAt =
DateTime.now().millisecondsSinceEpoch;
});
},
),
),
]),
],
),
),
)
],
);
}
}