186 lines
7.5 KiB
Dart
186 lines
7.5 KiB
Dart
import 'package:flutter/material.dart';
|
|
import 'package:flutter/services.dart';
|
|
import 'package:superport/utils/validators.dart';
|
|
|
|
class CompanyNameAutocomplete extends StatelessWidget {
|
|
final TextEditingController nameController;
|
|
final FocusNode nameFocusNode;
|
|
final List<String> companyNames;
|
|
final List<String> filteredCompanyNames;
|
|
final bool showCompanyNameDropdown;
|
|
final Function(String) onCompanyNameSelected;
|
|
final ValueChanged<String?> onNameSaved;
|
|
final String label;
|
|
final String hint;
|
|
|
|
const CompanyNameAutocomplete({
|
|
Key? key,
|
|
required this.nameController,
|
|
required this.nameFocusNode,
|
|
required this.companyNames,
|
|
required this.filteredCompanyNames,
|
|
required this.showCompanyNameDropdown,
|
|
required this.onCompanyNameSelected,
|
|
required this.onNameSaved,
|
|
required this.label,
|
|
required this.hint,
|
|
}) : super(key: key);
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
TextFormField(
|
|
controller: nameController,
|
|
focusNode: nameFocusNode,
|
|
textInputAction: TextInputAction.next,
|
|
decoration: InputDecoration(
|
|
labelText: label,
|
|
hintText: hint,
|
|
suffixIcon:
|
|
nameController.text.isNotEmpty
|
|
? IconButton(
|
|
icon: const Icon(Icons.clear),
|
|
onPressed: () {
|
|
nameController.clear();
|
|
},
|
|
)
|
|
: IconButton(
|
|
icon: const Icon(Icons.arrow_drop_down),
|
|
onPressed: () {},
|
|
),
|
|
),
|
|
validator: (value) => validateRequired(value, label),
|
|
onFieldSubmitted: (_) {
|
|
if (filteredCompanyNames.length == 1 && showCompanyNameDropdown) {
|
|
onCompanyNameSelected(filteredCompanyNames[0]);
|
|
}
|
|
},
|
|
onTap: () {},
|
|
onSaved: onNameSaved,
|
|
),
|
|
AnimatedContainer(
|
|
duration: const Duration(milliseconds: 200),
|
|
height:
|
|
showCompanyNameDropdown
|
|
? (filteredCompanyNames.length > 4
|
|
? 200
|
|
: filteredCompanyNames.length * 50.0)
|
|
: 0,
|
|
margin: EdgeInsets.only(top: showCompanyNameDropdown ? 4 : 0),
|
|
child: SingleChildScrollView(
|
|
physics: const ClampingScrollPhysics(),
|
|
child: GestureDetector(
|
|
onTap: () {},
|
|
child: Container(
|
|
width: double.infinity,
|
|
decoration: BoxDecoration(
|
|
color: Colors.white,
|
|
borderRadius: BorderRadius.circular(4),
|
|
border: Border.all(color: Colors.grey.shade300),
|
|
boxShadow: [
|
|
BoxShadow(
|
|
color: Colors.grey.withAlpha(77),
|
|
spreadRadius: 1,
|
|
blurRadius: 3,
|
|
offset: const Offset(0, 1),
|
|
),
|
|
],
|
|
),
|
|
child:
|
|
filteredCompanyNames.isEmpty
|
|
? const Padding(
|
|
padding: EdgeInsets.all(12.0),
|
|
child: Text('검색 결과가 없습니다'),
|
|
)
|
|
: ListView.separated(
|
|
shrinkWrap: true,
|
|
physics: const NeverScrollableScrollPhysics(),
|
|
itemCount: filteredCompanyNames.length,
|
|
separatorBuilder:
|
|
(context, index) => Divider(
|
|
height: 1,
|
|
color: Colors.grey.shade200,
|
|
),
|
|
itemBuilder: (context, index) {
|
|
final companyName = filteredCompanyNames[index];
|
|
final text = nameController.text.toLowerCase();
|
|
|
|
if (text.isEmpty) {
|
|
return ListTile(
|
|
dense: true,
|
|
title: Text(companyName),
|
|
onTap: () => onCompanyNameSelected(companyName),
|
|
);
|
|
}
|
|
|
|
// 일치하는 부분 찾기
|
|
final matchIndex = companyName
|
|
.toLowerCase()
|
|
.indexOf(text.toLowerCase());
|
|
if (matchIndex < 0) {
|
|
return ListTile(
|
|
dense: true,
|
|
title: Text(companyName),
|
|
onTap: () => onCompanyNameSelected(companyName),
|
|
);
|
|
}
|
|
|
|
return ListTile(
|
|
dense: true,
|
|
title: RichText(
|
|
text: TextSpan(
|
|
children: [
|
|
// 일치 이전 부분
|
|
if (matchIndex > 0)
|
|
TextSpan(
|
|
text: companyName.substring(
|
|
0,
|
|
matchIndex,
|
|
),
|
|
style: const TextStyle(
|
|
color: Colors.black,
|
|
),
|
|
),
|
|
// 일치하는 부분
|
|
TextSpan(
|
|
text: companyName.substring(
|
|
matchIndex,
|
|
matchIndex + text.length,
|
|
),
|
|
style: TextStyle(
|
|
fontWeight: FontWeight.bold,
|
|
color: Theme.of(context).primaryColor,
|
|
),
|
|
),
|
|
// 일치 이후 부분
|
|
if (matchIndex + text.length <
|
|
companyName.length)
|
|
TextSpan(
|
|
text: companyName.substring(
|
|
matchIndex + text.length,
|
|
),
|
|
style: TextStyle(
|
|
color:
|
|
matchIndex == 0
|
|
? Colors.grey[600]
|
|
: Colors.black,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
onTap: () => onCompanyNameSelected(companyName),
|
|
);
|
|
},
|
|
),
|
|
),
|
|
),
|
|
),
|
|
),
|
|
],
|
|
);
|
|
}
|
|
}
|