feat(patient): make antecedentes patologicos dropdowns editable with custom notes and options menu

This commit is contained in:
=
2026-10-02 11:09:02 -04:00
parent 02e6a52bff
commit 581adc85da
2 changed files with 249 additions and 25 deletions
@@ -122,7 +122,7 @@ class _PatientClinicalTabsState extends State<PatientClinicalTabs>
);
}
InputDecoration _cleanDropdownDecoration(String label) {
static InputDecoration _cleanDropdownDecoration(String label) {
return InputDecoration(
labelText: label,
floatingLabelBehavior: FloatingLabelBehavior.always,
@@ -275,31 +275,12 @@ class _PatientClinicalTabsState extends State<PatientClinicalTabs>
required List<String> items,
required ValueChanged<String> onChanged,
}) {
final list = items.contains(initialValue)
? items
: (initialValue.isNotEmpty ? [initialValue, ...items] : items);
return FormBuilderDropdown<String>(
return _EditableDropdownField(
name: name,
initialValue: initialValue.isNotEmpty ? initialValue : null,
decoration: _cleanDropdownDecoration(label),
hint: const Text(
'Seleccionar...',
style: TextStyle(fontSize: 13.5, color: Color(0xFF94A3B8)),
),
style: const TextStyle(fontSize: 13.5, color: AppColors.textPrimary, fontWeight: FontWeight.w500),
onChanged: (v) {
if (v != null) onChanged(v);
},
items: list.map((item) {
return DropdownMenuItem<String>(
value: item,
child: Text(
item,
style: const TextStyle(fontSize: 13.5),
overflow: TextOverflow.ellipsis,
),
);
}).toList(),
label: label,
initialValue: initialValue,
items: items,
onChanged: onChanged,
);
}
@@ -937,3 +918,181 @@ class _PatientClinicalTabsState extends State<PatientClinicalTabs>
);
}
}
class _EditableDropdownField extends StatefulWidget {
final String name;
final String label;
final String initialValue;
final List<String> items;
final ValueChanged<String> onChanged;
const _EditableDropdownField({
required this.name,
required this.label,
required this.initialValue,
required this.items,
required this.onChanged,
});
@override
State<_EditableDropdownField> createState() => _EditableDropdownFieldState();
}
class _EditableDropdownFieldState extends State<_EditableDropdownField> {
late final TextEditingController _controller;
late final FocusNode _focusNode;
final GlobalKey _fieldKey = GlobalKey();
@override
void initState() {
super.initState();
_controller = TextEditingController(text: widget.initialValue);
_focusNode = FocusNode();
}
@override
void didUpdateWidget(covariant _EditableDropdownField oldWidget) {
super.didUpdateWidget(oldWidget);
if (oldWidget.initialValue != widget.initialValue && _controller.text != widget.initialValue) {
_controller.value = TextEditingValue(
text: widget.initialValue,
selection: TextSelection.collapsed(offset: widget.initialValue.length),
);
}
}
@override
void dispose() {
_controller.dispose();
_focusNode.dispose();
super.dispose();
}
Future<void> _showDropdownMenu(FormFieldState<String> field) async {
final renderBox = _fieldKey.currentContext?.findRenderObject() as RenderBox?;
if (renderBox == null || !renderBox.hasSize) return;
final overlay = Overlay.of(context).context.findRenderObject() as RenderBox?;
if (overlay == null) return;
final targetRect = Rect.fromPoints(
renderBox.localToGlobal(renderBox.size.bottomLeft(Offset.zero), ancestor: overlay).translate(0, 4),
renderBox.localToGlobal(renderBox.size.bottomRight(Offset.zero), ancestor: overlay).translate(0, 4),
);
final position = RelativeRect.fromRect(
targetRect,
Offset.zero & overlay.size,
);
final selected = await showMenu<String>(
context: context,
position: position,
constraints: BoxConstraints(
minWidth: renderBox.size.width,
maxWidth: renderBox.size.width < 220 ? 220 : renderBox.size.width,
maxHeight: 280,
),
elevation: 4,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(10),
side: const BorderSide(color: Color(0xFFE2E8F0)),
),
color: Colors.white,
items: widget.items.map((item) {
final isSelected = _controller.text.trim().toLowerCase() == item.trim().toLowerCase();
return PopupMenuItem<String>(
value: item,
height: 38,
child: Row(
children: [
Expanded(
child: Text(
item,
style: TextStyle(
fontSize: 13.5,
fontWeight: isSelected ? FontWeight.w600 : FontWeight.w400,
color: isSelected ? AppColors.primary : AppColors.textPrimary,
),
overflow: TextOverflow.ellipsis,
),
),
if (isSelected)
const Icon(Icons.check_rounded, size: 16, color: AppColors.primary),
],
),
);
}).toList(),
);
if (selected != null) {
_controller.text = selected;
_controller.selection = TextSelection.collapsed(offset: selected.length);
field.didChange(selected);
widget.onChanged(selected);
setState(() {});
_focusNode.requestFocus();
}
}
@override
Widget build(BuildContext context) {
return FormBuilderField<String>(
name: widget.name,
initialValue: widget.initialValue,
builder: (FormFieldState<String> field) {
return TextField(
key: _fieldKey,
controller: _controller,
focusNode: _focusNode,
style: const TextStyle(
fontSize: 13.5,
color: AppColors.textPrimary,
fontWeight: FontWeight.w500,
),
decoration: _PatientClinicalTabsState._cleanDropdownDecoration(widget.label).copyWith(
hintText: 'Seleccionar...',
suffixIconConstraints: const BoxConstraints(minWidth: 40, minHeight: 40),
suffixIcon: Row(
mainAxisSize: MainAxisSize.min,
children: [
if (_controller.text.isNotEmpty)
IconButton(
icon: const Icon(Icons.clear_rounded, size: 16, color: Color(0xFF94A3B8)),
splashRadius: 16,
tooltip: 'Limpiar',
padding: EdgeInsets.zero,
constraints: const BoxConstraints(minWidth: 24, minHeight: 24),
onPressed: () {
_controller.clear();
field.didChange('');
widget.onChanged('');
setState(() {});
},
),
InkWell(
borderRadius: BorderRadius.circular(20),
onTap: () => _showDropdownMenu(field),
child: const Padding(
padding: EdgeInsets.only(left: 4, right: 8, top: 8, bottom: 8),
child: Icon(
Icons.arrow_drop_down_rounded,
size: 24,
color: Color(0xFF64748B),
),
),
),
],
),
),
onChanged: (val) {
field.didChange(val);
widget.onChanged(val);
setState(() {});
},
);
},
);
}
}