xt / Flutter-ReserveApp · Commits

Go to a project

Commit cc76ea7bee63ebf9a0c69d4c62ffbab96867c042

Authored by wdn127929
1 parent 4a1ac5f9
build: skipped

多时段UI

Inline Side-by-side
Showing 5 changed files with 730 additions and 794 deletions
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:one_key/widgets/MyDivider.dart';
import 'package:one_key/widgets/system_app_bar.dart';
import 'package:one_key/widgets/v_empty_view.dart';
import '../../../models/filter_btn_model.dart';
import '../../../models/settime.dart';
import '../../../res/colors.dart';
import '../../../utils/dialog_util.dart';
import '../../../utils/screen_util.dart';
import '../../../utils/utils.dart';
import '../../../widgets/h_empty_view.dart';
import '../../../widgets/round_button.dart';
import 'package:calendar_date_picker2/calendar_date_picker2.dart';
import 'dart:math';
import '../../../widgets/set_time_widget.dart';
/**
* 多时段编辑页面
... ... @@ -32,24 +31,34 @@ class _BookTimeSettingEditPageState extends State<BookTimeSettingEditPage> {
List<FilterBtnModel> weekData = [];
String weekShow = '点击选择日期（可多选）';
List<DateTime> _multiDatePickerValueWithDefaultValue = [
DateTime(DateTime.now().year, DateTime.now().month, 1),
DateTime(DateTime.now().year, DateTime.now().month, 5),
DateTime(DateTime.now().year, DateTime.now().month, 14),
DateTime(DateTime.now().year, DateTime.now().month, 17),
DateTime(DateTime.now().year, DateTime.now().month, 25),
];
List<DateTime> _selectPickerValues = [];
List<DateTime> _dialogCalendarPickerValue = [
DateTime(DateTime.now().year, DateTime.now().month, 1),
DateTime(DateTime.now().year, DateTime.now().month, 5),
];
List swichState;
SetTime morning = SetTime();
SetTime noon = SetTime();
SetTime night = SetTime();
ScrollController yearC = ScrollController();
TextEditingController _booktime1 = TextEditingController();
TextEditingController _booktime2 = TextEditingController();
TextEditingController _booktime3 = TextEditingController();
TextEditingController _booktime4 = TextEditingController();
TextEditingController _booktime5 = TextEditingController();
@override
void initState() {
super.initState();
_booktime1.text = '早茶';
_booktime2.text = '午餐';
_booktime3.text = '晚餐';
_booktime4.text = '夜宵';
morning.start = '07:00';
morning.end = '10:00';
noon.start = '11:00';
noon.end = '14:30';
night.start = '16:00';
night.end = '21:00';
swichState = [false, true, true, false, false];
_initWeekData();
WidgetsBinding.instance.addPostFrameCallback((_) {});
}
... ... @@ -87,32 +96,34 @@ class _BookTimeSettingEditPageState extends State<BookTimeSettingEditPage> {
}
String _getValueText(
CalendarDatePicker2Type datePickerType,
// CalendarDatePicker2Type datePickerType,
List<DateTime> values,
) {
values =
values.map((e) => e != null ? DateUtils.dateOnly(e) : null).toList();
var valueText = (values.isNotEmpty ? values[0] : null)
.toString()
.replaceAll('00:00:00.000', '');
// values =
// values.map((e) => e != null ? DateUtils.dateOnly(e) : null).toList();
// var valueText = (values.isNotEmpty ? values[0] : null)
// .toString()
// .replaceAll('00:00:00.000', '');
if (datePickerType == CalendarDatePicker2Type.multi) {
valueText = values.isNotEmpty
? values
.map((v) => v.toString().replaceAll('00:00:00.000', ''))
.join(', ')
: 'null';
} else if (datePickerType == CalendarDatePicker2Type.range) {
if (values.isNotEmpty) {
final startDate = values[0].toString().replaceAll('00:00:00.000', '');
final endDate = values.length > 1
? values[1].toString().replaceAll('00:00:00.000', '')
: 'null';
valueText = '$startDate to $endDate';
} else {
return 'null';
}
}
// if (datePickerType == CalendarDatePicker2Type.multi) {
var valueText = values.isNotEmpty
? values
.map((v) =>
v.toString().replaceAll('00:00:00.000', '').substring(2) +
'${Utils.lunarCalendarHolidaysShow(v)}')
.join(' ')
: '点击选择日期（可多选）';
// } else if (datePickerType == CalendarDatePicker2Type.range) {
// if (values.isNotEmpty) {
// final startDate = values[0].toString().replaceAll('00:00:00.000', '');
// final endDate = values.length > 1
// ? values[1].toString().replaceAll('00:00:00.000', '')
// : 'null';
// valueText = '$startDate to $endDate';
// } else {
// return 'null';
// }
// }
return valueText;
}
... ... @@ -131,351 +142,23 @@ class _BookTimeSettingEditPageState extends State<BookTimeSettingEditPage> {
}
}
//显示日历弹框
Future<DateTime> showCalendarDialogMultiple(BuildContext context) {
return showModalBottomSheet<DateTime>(
context: context,
isScrollControlled: true,
builder: (BuildContext context) {
BuildContext dialogContext = context;
Widget widget = StatefulBuilder(builder: (context, _setState) {
return Container(
color: MyColours.color_ffffff,
child: Column(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
_buildMultiDatePickerWithValue(),
VEmptyView(4),
Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
RoundButton(
onPressed: () async {
// _calendarController
// .setSelectedDay(DateTime.now());
_setState(() {});
},
text: '取消',
fontSize: 28,
isBold: false,
height: ScreenUtil().setWidth(70),
width: ScreenUtil().setWidth(220),
gradientStart: MyColours.color_2bb5b7,
gradientEnd: MyColours.color_2bb5b7,
radius: ScreenUtil().setWidth(10),
),
RoundButton(
onPressed: () async {
Navigator.pop(context);
},
text: '确定',
fontSize: 28,
isBold: false,
textColor: MyColours.color_333333,
borderColor: Color.fromRGBO(119, 119, 119, 1),
height: ScreenUtil().setWidth(70),
width: ScreenUtil().setWidth(220),
gradientStart: Colors.transparent,
gradientEnd: Colors.transparent,
radius: ScreenUtil().setWidth(10),
)
],
),
VEmptyView(40)
],
))
// Positioned(
// right: ScreenUtil().setWidth(62),
// bottom: ScreenUtil().setHeight(20),
// child: Container(
// child: GestureDetector(
// onTap: () {
// _calendarController.setSelectedDay(DateTime.now());
// _setState(() {});
// },
// child: Container(
// child: ClipOval(
// child: Container(
// width: ScreenUtil().setWidth(100),
// height: ScreenUtil().setWidth(100),
// alignment: Alignment.center,
// color: MyColours.color_2bb5b7,
// child: Text(
// "回到\n今天",
// style: TextStyle(
// color: MyColours.color_ffffff,
// fontSize: ScreenUtil().setSp(26)),
// ),
// )),
// ),
// ),
// ),
// )
// ],
;
});
return SizedBox(
width: double.infinity,
// height: ScreenUtil().setWidth(975),
child: widget,
);
});
}
String intToWeek(int week) {
String str = '';
switch (week) {
case 0:
str = '周日';
break;
case 1:
str = '周一';
break;
case 2:
str = '周二';
break;
case 3:
str = '周三';
break;
case 4:
str = '周四';
break;
case 5:
str = '周五';
break;
case 6:
str = '周六';
break;
}
return str;
}
Widget _buildMultiDatePickerWithValue() {
final config = CalendarDatePicker2Config(
disableMonthPicker: true,
calendarType: CalendarDatePicker2Type.multi,
currentDate: DateTime.now(),
dynamicCalendarRows: true,
yearViewController: yearC,
centerAlignModePicker: true,
controlsTextStyle: TextStyle(color: MyColours.color_F8F9FD),
lastMonthIcon: Image.asset(
Utils.getImgPath('date_m_l'),
width: w(8),
),
nextMonthIcon: Image.asset(
Utils.getImgPath('date_m_r'),
width: w(8),
),
// firstDayOfWeek: 0,
// controlsHeight: w(100),
// yearBuilder: (({decoration, isCurrentYear, isDisabled, isSelected, textStyle, year}) {
// return Container(
// width: 50,
// height: 50,
// color: Colors.red,
// );
// }),
selectedDayHighlightColor: MyColours.color_438E93,
weekdayLabelBuilder: ({isScrollViewTopHeader, weekday}) {
return Container(
color: MyColours.color_438E93,
alignment: Alignment.center,
margin: EdgeInsets.only(
bottom: ScreenUtil().setWidth(30), right: weekday == 6 ? 0 : 1),
// padding: EdgeInsets.symmetric(vertical: ScreenUtil().setWidth(15)),
child: Text(
intToWeek(weekday),
style: TextStyle(
color: MyColours.color_F8F9FD,
fontSize: ScreenUtil().setSp(28)),
),
);
},
dayMaxWidth: w(51),
dayBorderRadius: BorderRadius.circular(r(5)),
dayBuilder: ((
{date, decoration, isDisabled, isSelected, isToday, textStyle}) {
return Container(
margin: EdgeInsets.all(w(4)),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(r(5)),
color: isSelected
? MyColours.color_438E93
: isToday
? MyColours.color_2bb5b7
: MyColours.color_ffffff),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
// "${_parseDateDay(date)}",
'${Utils.addZeroNumber(date.day)}',
style: TextStyle().copyWith(
fontSize: ScreenUtil().setSp(32),
color: isSelected
? MyColours.color_F8F9FD
: isToday
? MyColours.color_F8F9FD
: MyColours.color_353535,
fontWeight: FontWeight.bold)),
Text(
"${_parseDateDay(date)}",
textAlign: TextAlign.center,
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: TextStyle().copyWith(
fontSize: ScreenUtil().setSp(18),
color: isSelected
? MyColours.color_F8F9FD
: isToday
? MyColours.color_F8F9FD
: MyColours.color_353535),
),
],
),
);
}),
// dayBuilder: (context, date, _) {
//
// },
);
// selectedDayBuilder: (context, date, _) {
// return Container(
// // alignment: Alignment.center,
// // margin: EdgeInsets.fromLTRB(
// // ScreenUtil().setWidth(12),
// // ScreenUtil().setWidth(12),
// // ScreenUtil().setWidth(12),
// // ScreenUtil().setWidth(32)),
// padding: EdgeInsets.only(
// bottom: ScreenUtil().setWidth(10),
// left: ScreenUtil().setWidth(5),
// right: ScreenUtil().setWidth(5),
// top: ScreenUtil().setWidth(10)),
// child: Container(
// decoration: BoxDecoration(
// borderRadius: BorderRadius.circular(
// ScreenUtil().setWidth(10)),
// color: Color.fromRGBO(42, 110, 109, 1)),
// child: Column(
// mainAxisAlignment: MainAxisAlignment.center,
// children: [
// Text(
// // "${_parseDateDay(date)}",
// '${Utils.addZeroNumber(date.day)}',
// style: TextStyle().copyWith(
// color: MyColours.color_ffffff,
// fontSize: ScreenUtil().setSp(32),
// fontWeight: FontWeight.bold),
// ),
// Text(
// "${_parseDateDay(date)}",
// // '${Utils.lunarCalendarHolidaysShow(date)}',
// style: TextStyle().copyWith(
// fontSize: ScreenUtil().setSp(22),
// color: MyColours.color_ffffff),
// )
// ],
// ),
// ),
// );
// },
// todayDayBuilder: (context, date, _) {
// return Container(
// // alignment: Alignment.center,
// // margin: EdgeInsets.fromLTRB(
// // ScreenUtil().setWidth(12),
// // ScreenUtil().setWidth(12),
// // ScreenUtil().setWidth(12),
// // ScreenUtil().setWidth(32)),
// padding: EdgeInsets.only(
// bottom: ScreenUtil().setWidth(10),
// left: ScreenUtil().setWidth(5),
// right: ScreenUtil().setWidth(5),
// top: ScreenUtil().setWidth(10)),
// child: Container(
// decoration: BoxDecoration(
// borderRadius: BorderRadius.circular(
// ScreenUtil().setWidth(10)),
// color: MyColours.color_2bb5b7),
// child: Column(
// mainAxisAlignment: MainAxisAlignment.center,
// children: [
// Text(
// // "${_parseDateDay(date)}",
// '${Utils.addZeroNumber(date.day)}',
// style: TextStyle().copyWith(
// color: MyColours.color_ffffff,
// fontSize: ScreenUtil().setSp(32),
// fontWeight: FontWeight.bold),
// ),
// Text(
// "${_parseDateDay(date)}",
// // '${Utils.lunarCalendarHolidaysShow(date)}',
// style: TextStyle().copyWith(
// fontSize: ScreenUtil().setSp(22),
// color: MyColours.color_ffffff),
// )
// ],
// ),
// ),
// );
// );
return SizedBox(
width: double.infinity,
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
CalendarDatePicker2(
config: config,
value: _multiDatePickerValueWithDefaultValue,
onValueChanged: (dates) =>
setState(() => _multiDatePickerValueWithDefaultValue = dates),
),
const SizedBox(height: 10),
Wrap(
children: [
const Text('Selection(s): '),
const SizedBox(width: 10),
Text(
_getValueText(
config.calendarType,
_multiDatePickerValueWithDefaultValue,
),
overflow: TextOverflow.ellipsis,
maxLines: 10,
softWrap: false,
),
],
),
const SizedBox(height: 25),
],
),
);
}
///时间选择
Widget _select1(String title, GestureTapCallback onTap) {
return InkWell(
onTap: onTap,
child: Container(
padding: EdgeInsets.only(left: w(16)),
padding: EdgeInsets.only(left: w(16), top: w(7), bottom: w(12)),
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.center,
children: [
Container(
Expanded(
child: Container(
// height: ScreenUtil().setWidth(40),
// color: Colors.red,
child: Text(
title,
maxLines: 10,
style: TextStyle(
height: 1.5,
color: title == '点击选择日期（可多选）'
... ... @@ -483,9 +166,9 @@ class _BookTimeSettingEditPageState extends State<BookTimeSettingEditPage> {
: MyColours.color_515151,
fontSize: font(16)),
),
),
)),
// HEmptyView(20),
Spacer(),
// Spacer(),
// Text(hintText,
// style: TextStyle(
// color: hintText == '点击设置开始日期' || hintText == '点击设置结束日期'
... ... @@ -505,6 +188,386 @@ class _BookTimeSettingEditPageState extends State<BookTimeSettingEditPage> {
);
}
Widget _itemMorningNoonAngNight(int tag, TextEditingController booktimes) {
return Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
swichState[tag]
? Expanded(
child: Container(
// height: ScreenUtil().setWidth(50),
// padding: EdgeInsets.symmetric(horizontal: ScreenUtil().setWidth(24)),
decoration: BoxDecoration(
color: MyColours.color_ffffff,
borderRadius: BorderRadius.circular(r(14))),
child: TextField(
controller: booktimes,
maxLines: 1,
// inputFormatters: [
// LengthLimitingTextInputFormatter(
// 15),
// // FilteringTextInputFormatter.digitsOnly
// ],
// //光标颜色
// cursorColor:
// widget.isSelect ? Colors.white : MyColours.color_199095,
//输入文本的样式
style: TextStyle(
fontSize: font(14), color: MyColours.color_515151),
// focusNode: _phoneFocusNode,
decoration: InputDecoration(
border: OutlineInputBorder(borderSide: BorderSide.none),
hintText: '请输入餐段名称',
hintStyle: TextStyle(
color: MyColours.color_BFC4D4,
fontSize: font(14),
),
contentPadding: EdgeInsets.zero,
isCollapsed: true, //重点，相当于高度包裹的意思，必须设置为true，不然有默认奇妙的最小高度
enabledBorder: new UnderlineInputBorder(
borderSide: BorderSide.none,
),
focusedBorder: new UnderlineInputBorder(
borderSide: BorderSide.none,
),
),
onChanged: (value) {
// if (editingController == _nameController) {
// _nameController.text = value;
// }
},
onEditingComplete: () {
FocusScope.of(context)
.requestFocus(FocusNode()); //点击空白处隐藏键盘
},
keyboardType: TextInputType.text,
),
))
: Spacer(),
// Text(title,
// style: TextStyle(
// fontSize: ScreenUtil().setSp(28),
// color: MyColours.color_999999)),
InkWell(
onTap: () {
setState(() {
swichState[tag] = !swichState[tag];
});
},
child: Image.asset(
Utils.getImgPath(
swichState[tag] ? 'store_swich_on' : 'store_swich_off'),
width: w(38))),
],
);
}
///从时间选择器中获取分钟数字符串 00 or 30
String _getMinuteStrFromPickerBookTime(List data, List value) {
// if (data.length == 1) {
// return '30';
// } else {
Map map = data[value[0]];
int minute = map.values.last[value[1]];
if (minute == 0) {
return '00';
}
return '${minute}';
// if (value[1] == 0) {
// return '00';
// } else if (value[1] == 1) {
// return '15';
// } else if (value[1] == 2) {
// return '30';
// } else {
// return '45';
// }
// }
}
Widget _itemBookTime(String start, String end, int tag) {
return Row(
children: [
Expanded(
child: InkWell(
onTap: () {
if (swichState[tag]) {
List data = SetTimeWidget.dateData;
if (tag == 0) {
//早市
data = SetTimeWidget.dateData;
} else if (tag == 1) {
//午市
data = Utils.getPickerData(
morning.end, SetTimeWidget.dateData);
} else if (tag == 2) {
//晚市
data =
Utils.getPickerData(noon.end, SetTimeWidget.dateData);
}
SetTimeWidget().showTimeSelector(context, data, start,
(value) {
if (value != null) {
String tempMinute =
_getMinuteStrFromPickerBookTime(data, value);
print(data[value[0]].keys.first);
String time = Utils.getTimeString(
Utils.getHourFromTitle(data[value[0]].keys.first),
tempMinute);
setState(() {
if (tag == 0) {
//早市
morning.start = time;
setState(() {
Utils.compareDateTime(morning.end, time,
(needChange) {
if (needChange) {
morning.end = time;
}
});
Utils.compareDateTime(noon.start, time,
(needChange) {
if (needChange) {
noon.start = time;
}
});
Utils.compareDateTime(noon.end, time,
(needChange) {
if (needChange) {
noon.end = time;
}
});
Utils.compareDateTime(night.start, time,
(needChange) {
if (needChange) {
night.start = time;
}
});
Utils.compareDateTime(night.end, time,
(needChange) {
if (needChange) {
night.end = time;
}
});
});
} else if (tag == 1) {
//午市
noon.start = time;
setState(() {
Utils.compareDateTime(noon.end, time,
(needChange) {
if (needChange) {
noon.end = time;
}
});
Utils.compareDateTime(night.start, time,
(needChange) {
if (needChange) {
night.start = time;
}
});
Utils.compareDateTime(night.end, time,
(needChange) {
if (needChange) {
night.end = time;
}
});
});
} else if (tag == 2) {
//晚市
night.start = time;
setState(() {
Utils.compareDateTime(night.end, time,
(needChange) {
if (needChange) {
night.end = time;
}
});
});
}
});
print(value);
}
});
}
},
child: Container(
height: w(34),
alignment: Alignment.center,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(r(5)),
border: Border.all(
width: w(1), color: MyColours.color_438E93)),
child: start == '' || start == null || start == 'null'
? RichText(
text: TextSpan(
style: TextStyle(
fontSize: font(12),
),
children: [
// const TextSpan(text: '('),
TextSpan(
text: '选择开始时间',
style: TextStyle(
color: MyColours.color_438E93)),
TextSpan(
text: '*',
style: TextStyle(
color: MyColours.color_E34D59)),
]))
: Text(
start,
style: TextStyle(
color: MyColours.color_438E93,
fontSize: font(12),
),
)))),
HEmptyView(52),
Text('至',
style:
TextStyle(fontSize: font(12), color: MyColours.color_515151)),
HEmptyView(52),
Expanded(
child: InkWell(
onTap: () {
if (swichState[tag]) {
List data = SetTimeWidget.dateData;
if (tag == 0) {
//早市
data = Utils.getPickerData(
morning.start, SetTimeWidget.dateData);
} else if (tag == 1) {
//午市
data =
Utils.getPickerData(noon.start, SetTimeWidget.dateData);
} else if (tag == 2) {
//晚市
data = Utils.getPickerData(
night.start, SetTimeWidget.dateData);
}
SetTimeWidget().showTimeSelector(context, data, end, (value) {
if (value != null) {
String tempMinute =
_getMinuteStrFromPickerBookTime(data, value);
String time = Utils.getTimeString(
Utils.getHourFromTitle(data[value[0]].keys.first),
tempMinute);
setState(() {
if (tag == 0) {
//早市
morning.end = time;
setState(() {
Utils.compareDateTime(time, morning.start,
(needChange) {
if (needChange) {
morning.start = time;
}
});
Utils.compareDateTime(noon.start, time,
(needChange) {
if (needChange) {
noon.start = time;
}
});
Utils.compareDateTime(noon.end, time, (needChange) {
if (needChange) {
noon.end = time;
}
});
Utils.compareDateTime(night.start, time,
(needChange) {
if (needChange) {
night.start = time;
}
});
Utils.compareDateTime(night.end, time,
(needChange) {
if (needChange) {
night.end = time;
}
});
});
} else if (tag == 1) {
//午市
noon.end = time;
setState(() {
Utils.compareDateTime(noon.end, noon.start,
(needChange) {
if (needChange) {
noon.start = noon.end;
}
});
Utils.compareDateTime(night.start, time,
(needChange) {
if (needChange) {
night.start = time;
}
});
Utils.compareDateTime(night.end, time,
(needChange) {
if (needChange) {
night.end = time;
}
});
});
} else if (tag == 2) {
//晚市
night.end = time;
setState(() {
Utils.compareDateTime(night.end, night.start,
(needChange) {
if (needChange) {
night.start = night.end;
}
});
});
}
});
print(value);
}
});
}
},
child: Container(
height: w(34),
alignment: Alignment.center,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(r(5)),
border: Border.all(
width: w(1), color: MyColours.color_438E93)),
child: end == '' || end == null || end == 'null'
? RichText(
text: TextSpan(
style: TextStyle(fontSize: font(12)),
children: [
// const TextSpan(text: '('),
TextSpan(
text: '选择结束时间',
style:
TextStyle(color: MyColours.color_438E93)),
TextSpan(
text: '*',
style:
TextStyle(color: MyColours.color_E34D59)),
]))
: Text(
end,
style: TextStyle(
color: MyColours.color_438E93,
fontSize: font(12)),
))),
),
],
);
}
@override
Widget build(BuildContext context) {
return Scaffold(
... ... @@ -559,15 +622,9 @@ class _BookTimeSettingEditPageState extends State<BookTimeSettingEditPage> {
HEmptyView(30),
],
),
VEmptyView(30),
VEmptyView(16),
_select1(weekShow, () async {
if (isWeek) {
FocusScope.of(context)
.requestFocus(FocusNode()); //点击空白处隐藏键盘
//弹出时间选择器
// showPickerDateTime(context);
// showDateSelWidget = false;
List<FilterBtnModel> data =
await DialogUtil.openWeekSelectModalBottomSheet(
context, weekData);
... ... @@ -593,29 +650,19 @@ class _BookTimeSettingEditPageState extends State<BookTimeSettingEditPage> {
setState(() {});
}
} else {
showCalendarDialogMultiple(context);
// _buildMultiDatePickerWithValue();
// DateTime dateTime = DateTime.now();
// DialogUtil.showCalendarDialogMultiple(context, dateTime)
// .then((day) async {
// if (day != null) {
// // createDateText1(context, day);
// // bool success =
// // await tableManagerModel.getTableListOrReserve(
// // context,
// // currTimeIndex,
// // dateTime,
// // selectNumber,
// // showLoading: true,
// // );
// }
// });
DialogUtil.showCalendarDialogMultiple(
context, _selectPickerValues, (value) {
_selectPickerValues = value;
weekShow = _getValueText(
value,
);
setState(() {});
});
}
}),
],
),
),
VEmptyView(24),
Padding(
padding: EdgeInsets.only(left: w(16)),
child: MyDivider(
... ... @@ -623,7 +670,53 @@ class _BookTimeSettingEditPageState extends State<BookTimeSettingEditPage> {
w(1),
color: MyColours.color_DBDBDB,
),
)
),
VEmptyView(26),
Padding(
padding: EdgeInsets.only(left: w(12)),
child: Text('可预订时段',
style: TextStyle(
fontSize: font(16),
color: MyColours.color_515151))),
VEmptyView(36),
Padding(
padding: EdgeInsets.symmetric(
horizontal: w(24),
),
child: Column(
children: [
_itemMorningNoonAngNight(0, _booktime1),
VEmptyView(34),
swichState[0]
? _itemBookTime(morning.start, morning.end, 0)
: SizedBox(),
VEmptyView(32),
_itemMorningNoonAngNight(1, _booktime2),
VEmptyView(34),
swichState[1]
? _itemBookTime(noon.start, noon.end, 1)
: SizedBox(),
VEmptyView(32),
_itemMorningNoonAngNight(2, _booktime3),
VEmptyView(34),
swichState[2]
? _itemBookTime(night.start, night.end, 2)
: SizedBox(),
VEmptyView(32),
_itemMorningNoonAngNight(3, _booktime4),
VEmptyView(34),
swichState[3]
? _itemBookTime(night.start, night.end, 3)
: SizedBox(),
VEmptyView(32),
_itemMorningNoonAngNight(4, _booktime5),
VEmptyView(34),
swichState[4]
? _itemBookTime(night.start, night.end, 4)
: SizedBox(),
],
)),
VEmptyView(34),
],
),
)),
... ...
... ... @@ -1311,58 +1311,62 @@ class _StoreBaseInfoPageState extends State<StoreBaseInfoPage> {
return Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Expanded(
child: Container(
// height: ScreenUtil().setWidth(50),
// padding: EdgeInsets.symmetric(horizontal: ScreenUtil().setWidth(24)),
decoration: BoxDecoration(
color: MyColours.color_F8F9FD,
borderRadius: BorderRadius.circular(ScreenUtil().setWidth(28))),
child: TextField(
controller: booktimes,
maxLines: 1,
// inputFormatters: [
// LengthLimitingTextInputFormatter(
// 15),
// // FilteringTextInputFormatter.digitsOnly
// ],
// //光标颜色
// cursorColor:
// widget.isSelect ? Colors.white : MyColours.color_199095,
//输入文本的样式
style: TextStyle(
fontSize: ScreenUtil().setSp(28),
color: MyColours.color_515151),
focusNode: _phoneFocusNode,
decoration: InputDecoration(
border: OutlineInputBorder(borderSide: BorderSide.none),
hintText: '请输入餐段名称',
hintStyle: TextStyle(
color: MyColours.color_BFC4D4,
fontSize: ScreenUtil().setSp(28),
),
contentPadding: EdgeInsets.zero,
isCollapsed: true, //重点，相当于高度包裹的意思，必须设置为true，不然有默认奇妙的最小高度
enabledBorder: new UnderlineInputBorder(
borderSide: BorderSide.none,
),
focusedBorder: new UnderlineInputBorder(
borderSide: BorderSide.none,
),
),
onChanged: (value) {
// if (editingController == _nameController) {
// _nameController.text = value;
// }
},
onEditingComplete: () {
FocusScope.of(context).requestFocus(FocusNode()); //点击空白处隐藏键盘
},
keyboardType: TextInputType.text,
),
)),
swichState[tag]
? Expanded(
child: Container(
// height: ScreenUtil().setWidth(50),
// padding: EdgeInsets.symmetric(horizontal: ScreenUtil().setWidth(24)),
decoration: BoxDecoration(
color: MyColours.color_F8F9FD,
borderRadius:
BorderRadius.circular(ScreenUtil().setWidth(28))),
child: TextField(
controller: booktimes,
maxLines: 1,
// inputFormatters: [
// LengthLimitingTextInputFormatter(
// 15),
// // FilteringTextInputFormatter.digitsOnly
// ],
// //光标颜色
// cursorColor:
// widget.isSelect ? Colors.white : MyColours.color_199095,
//输入文本的样式
style: TextStyle(
fontSize: ScreenUtil().setSp(28),
color: MyColours.color_515151),
// focusNode: _phoneFocusNode,
decoration: InputDecoration(
border: OutlineInputBorder(borderSide: BorderSide.none),
hintText: '请输入餐段名称',
hintStyle: TextStyle(
color: MyColours.color_BFC4D4,
fontSize: ScreenUtil().setSp(28),
),
contentPadding: EdgeInsets.zero,
isCollapsed: true, //重点，相当于高度包裹的意思，必须设置为true，不然有默认奇妙的最小高度
enabledBorder: new UnderlineInputBorder(
borderSide: BorderSide.none,
),
focusedBorder: new UnderlineInputBorder(
borderSide: BorderSide.none,
),
),
onChanged: (value) {
// if (editingController == _nameController) {
// _nameController.text = value;
// }
},
onEditingComplete: () {
FocusScope.of(context)
.requestFocus(FocusNode()); //点击空白处隐藏键盘
},
keyboardType: TextInputType.text,
),
))
: Spacer(),
// Text(title,
// style: TextStyle(
// fontSize: ScreenUtil().setSp(28),
... ...
... ... @@ -3,6 +3,7 @@ import 'dart:convert';
import 'dart:ui';
import 'package:cached_network_image/cached_network_image.dart';
import 'package:calendar_date_picker2/calendar_date_picker2.dart';
import 'package:common_utils/common_utils.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
... ... @@ -7255,22 +7256,135 @@ class DialogUtil {
}
}
//显示日历弹框
static String intToWeek(int week) {
String str = '';
switch (week) {
case 0:
str = '周日';
break;
case 1:
str = '周一';
break;
case 2:
str = '周二';
break;
case 3:
str = '周三';
break;
case 4:
str = '周四';
break;
case 5:
str = '周五';
break;
case 6:
str = '周六';
break;
}
return str;
}
static Widget _buildMultiDatePickerWithValue(
List<DateTime> _multiDatePickerValueWithDefaultValue,
ValueChanged valueChanged) {
final config = CalendarDatePicker2Config(
disableMonthPicker: true,
calendarType: CalendarDatePicker2Type.multi,
currentDate: DateTime.now(),
dynamicCalendarRows: true,
centerAlignModePicker: true,
controlsTextStyle: TextStyle(color: MyColours.color_F8F9FD),
lastMonthIcon: Image.asset(
Utils.getImgPath('date_m_l'),
width: w(8),
),
nextMonthIcon: Image.asset(
Utils.getImgPath('date_m_r'),
width: w(8),
),
selectedDayHighlightColor: MyColours.color_438E93,
weekdayLabelBuilder: ({isScrollViewTopHeader, weekday}) {
return Container(
color: MyColours.color_438E93,
alignment: Alignment.center,
margin: EdgeInsets.only(
bottom: ScreenUtil().setWidth(30), right: weekday == 6 ? 0 : 1),
child: Text(
intToWeek(weekday),
style: TextStyle(
color: MyColours.color_F8F9FD,
fontSize: ScreenUtil().setSp(28)),
),
);
},
dayMaxWidth: w(51),
dayBorderRadius: BorderRadius.circular(r(5)),
dayBuilder: ((
{date, decoration, isDisabled, isSelected, isToday, textStyle}) {
return Container(
margin: EdgeInsets.all(w(4)),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(r(5)),
color: isSelected
? MyColours.color_438E93
: isToday
? MyColours.color_2bb5b7
: MyColours.color_ffffff),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text('${Utils.addZeroNumber(date.day)}',
style: TextStyle().copyWith(
fontSize: ScreenUtil().setSp(32),
color: isSelected
? MyColours.color_F8F9FD
: isToday
? MyColours.color_F8F9FD
: MyColours.color_353535,
fontWeight: FontWeight.bold)),
Text(
_parseDateDay(date),
textAlign: TextAlign.center,
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: TextStyle().copyWith(
fontSize: ScreenUtil().setSp(18),
color: isSelected
? MyColours.color_F8F9FD
: isToday
? MyColours.color_F8F9FD
: MyColours.color_353535),
),
],
),
);
}),
);
return SizedBox(
width: double.infinity,
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
CalendarDatePicker2(
config: config,
value: _multiDatePickerValueWithDefaultValue,
onValueChanged: (dates) {
_multiDatePickerValueWithDefaultValue = dates;
valueChanged(_multiDatePickerValueWithDefaultValue);
}),
],
),
);
}
//显示日历弹框 (可多选，可单选)
static Future<DateTime> showCalendarDialogMultiple(
BuildContext context, DateTime selectDateTime) {
CalendarController _calendarController = CalendarController();
final _selectedDay = DateTime.now();
Map<DateTime, List> _events = {
_selectedDay: ['Event A7', 'Event B7', 'Event C7', 'Event D7'],
_selectedDay.add(Duration(days: 1)): [
'Event A8',
'Event B8',
'Event C8',
'Event D8'
],
_selectedDay.add(Duration(days: 2)):
Set.from(['Event A9', 'Event A9', 'Event B9']).toList(),
};
BuildContext context,
List<DateTime> selectDates,
ValueChanged valueChanged,
) {
List<DateTime> _multiDatePickerValueWithDefaultValue = selectDates; //日历使用
return showModalBottomSheet<DateTime>(
context: context,
isScrollControlled: true,
... ... @@ -7278,334 +7392,59 @@ class DialogUtil {
BuildContext dialogContext = context;
Widget widget = StatefulBuilder(builder: (context, _setState) {
return Container(
color: MyColours.color_ffffff,
child: Column(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
TableCalendar(
// rowHeight: ScreenUtil().setWidth(100),
calendarController: _calendarController,
initialSelectedDay: _selectedDay,
onDaySelected: (day, events, holidays) {
Navigator.of(dialogContext).pop(day);
},
// holidays: _holidays,
availableGestures: AvailableGestures.none,
events: _events,
locale: "zh_CN",
initialCalendarFormat: CalendarFormat.month,
headerStyle: HeaderStyle(
decoration:
BoxDecoration(color: MyColours.color_2bb5b7),
headerPadding: EdgeInsets.zero,
formatButtonVisible: false,
centerHeaderTitle: false,
titleTextBuilder: (dateTime, _) {
return dateTime.year.toString() +
"年-" +
Utils.addZeroNumber(dateTime.month) +
"月";
},
titleTextStyle: TextStyle(
color: MyColours.color_ffffff,
fontSize: ScreenUtil().setSp(30)),
leftChevronIcon: const Icon(Icons.chevron_left,
color: Colors.white),
rightChevronIcon: const Icon(Icons.chevron_right,
color: Colors.white),
),
calendarStyle: CalendarStyle(
contentPadding: EdgeInsets.only(
bottom: ScreenUtil().setWidth(8)),
weekdayStyle: TextStyle(
color: MyColours.color_2bb5b7,
fontSize: ScreenUtil().setSp(32)),
weekendStyle: TextStyle(
color: MyColours.color_f49a5e,
fontSize: ScreenUtil().setSp(32)),
selectedColor: MyColours.color_2bb5b7,
outsideDaysVisible: false,
),
builders: CalendarBuilders(
dowWeekdayBuilder: (context, weekday) {
return Container(
color: MyColours.color_2bb5b7,
alignment: Alignment.center,
margin: EdgeInsets.only(
bottom: ScreenUtil().setWidth(30)),
padding: EdgeInsets.symmetric(
vertical: ScreenUtil().setWidth(15)),
child: Text(
weekday,
style: TextStyle(
color: MyColours.color_97e9ea,
fontSize: ScreenUtil().setSp(28)),
),
);
},
dayBuilder: (context, date, _) {
return Container(
// height: ScreenUtil().setWidth(210),
decoration: BoxDecoration(
// shape: BoxShape.circle,
// color: Colors.blue,
),
// alignment: Alignment.center,
// margin: EdgeInsets.fromLTRB(
// ScreenUtil().setWidth(12),
// ScreenUtil().setWidth(12),
// ScreenUtil().setWidth(12),
// ScreenUtil().setWidth(10)),
// padding: EdgeInsets.symmetric(
// // horizontal: ScreenUtil().setWidth(12),
// vertical: ScreenUtil().setWidth(8),
// ),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
// "${_parseDateDay(date)}",
'${Utils.addZeroNumber(date.day)}',
style: TextStyle().copyWith(
fontSize: ScreenUtil().setSp(32),
color: MyColours.color_353535,
fontWeight: FontWeight.bold)),
// Text(
// // "${_parseDateDay(date)}",
// '${Utils.getLunarSpecialDate(date)}',
// style: TextStyle().copyWith(
// fontSize: ScreenUtil().setSp(22),
// color: MyColours.color_353535),
// ),
Text(
"${_parseDateDay(date)}",
style: TextStyle().copyWith(
fontSize: ScreenUtil().setSp(18),
color: MyColours.color_353535),
),
],
),
);
},
selectedDayBuilder: (context, date, _) {
return Container(
// alignment: Alignment.center,
// margin: EdgeInsets.fromLTRB(
// ScreenUtil().setWidth(12),
// ScreenUtil().setWidth(12),
// ScreenUtil().setWidth(12),
// ScreenUtil().setWidth(32)),
padding: EdgeInsets.only(
bottom: ScreenUtil().setWidth(10),
left: ScreenUtil().setWidth(5),
right: ScreenUtil().setWidth(5),
top: ScreenUtil().setWidth(10)),
child: Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(
ScreenUtil().setWidth(10)),
color: Color.fromRGBO(42, 110, 109, 1)),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
// "${_parseDateDay(date)}",
'${Utils.addZeroNumber(date.day)}',
style: TextStyle().copyWith(
color: MyColours.color_ffffff,
fontSize: ScreenUtil().setSp(32),
fontWeight: FontWeight.bold),
),
Text(
"${_parseDateDay(date)}",
// '${Utils.lunarCalendarHolidaysShow(date)}',
style: TextStyle().copyWith(
fontSize: ScreenUtil().setSp(22),
color: MyColours.color_ffffff),
)
],
),
),
);
},
todayDayBuilder: (context, date, _) {
return Container(
// alignment: Alignment.center,
// margin: EdgeInsets.fromLTRB(
// ScreenUtil().setWidth(12),
// ScreenUtil().setWidth(12),
// ScreenUtil().setWidth(12),
// ScreenUtil().setWidth(32)),
padding: EdgeInsets.only(
bottom: ScreenUtil().setWidth(10),
left: ScreenUtil().setWidth(5),
right: ScreenUtil().setWidth(5),
top: ScreenUtil().setWidth(10)),
child: Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(
ScreenUtil().setWidth(10)),
color: MyColours.color_2bb5b7),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
// "${_parseDateDay(date)}",
'${Utils.addZeroNumber(date.day)}',
style: TextStyle().copyWith(
color: MyColours.color_ffffff,
fontSize: ScreenUtil().setSp(32),
fontWeight: FontWeight.bold),
),
Text(
"${_parseDateDay(date)}",
// '${Utils.lunarCalendarHolidaysShow(date)}',
style: TextStyle().copyWith(
fontSize: ScreenUtil().setSp(22),
color: MyColours.color_ffffff),
)
],
),
),
);
// return Container(
// decoration: BoxDecoration(
// shape: BoxShape.circle,
// border: Border.all(
// color: MyColours.color_2bb5b7,
// width: ScreenUtil().setWidth(2))),
// alignment: Alignment.center,
// margin: EdgeInsets.fromLTRB(
// ScreenUtil().setWidth(12),
// ScreenUtil().setWidth(12),
// ScreenUtil().setWidth(12),
// ScreenUtil().setWidth(32)),
// padding: EdgeInsets.only(
// bottom: ScreenUtil().setWidth(8),
// left: ScreenUtil().setWidth(16),
// right: ScreenUtil().setWidth(16),
// top: ScreenUtil().setWidth(8)),
// child: Text(
// // '今',
// '${Utils.addZeroNumber(date.day)}',
// style: TextStyle().copyWith(
// fontSize: ScreenUtil().setSp(32),
// color: MyColours.color_2bb5b7),
// ),
// );
},
markersBuilder: (context, date, events, holidays) {
final children = <Widget>[];
// if (events.isNotEmpty) {
// children.add(
// Positioned(
// right: 1,
// bottom: 1,
// child: _buildEventsMarker(date, events),
// ),
// );
// }
// if (holidays.isNotEmpty) {
// children.add(
// Positioned(
// right: ScreenUtil().setWidth(27),
// bottom: 0,
// top: ScreenUtil().setWidth(30),
// child: buildMarker(date)),
// Align(
// alignment: Alignment.bottomCenter,
// child: buildMarker(date),
// )
// );
// }
return [];
},
// singleMarkerBuilder: (context, dateTime, event) {
// return Container(
// width: ScreenUtil().setWidth(6),
// height: ScreenUtil().setWidth(6),
// margin:
// const EdgeInsets.symmetric(horizontal: 0.3),
// decoration: BoxDecoration(
// shape: BoxShape.circle,
// color: MyColours.color_ff0000,
// ),
// );
// },
),
),
VEmptyView(4),
Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
RoundButton(
onPressed: () async {
_calendarController
.setSelectedDay(DateTime.now());
_setState(() {});
},
text: '回到今天',
fontSize: 28,
isBold: false,
height: ScreenUtil().setWidth(70),
width: ScreenUtil().setWidth(220),
gradientStart: MyColours.color_2bb5b7,
gradientEnd: MyColours.color_2bb5b7,
radius: ScreenUtil().setWidth(10),
),
RoundButton(
onPressed: () async {
Navigator.pop(context);
},
text: '取消',
fontSize: 28,
isBold: false,
textColor: MyColours.color_333333,
borderColor: Color.fromRGBO(119, 119, 119, 1),
height: ScreenUtil().setWidth(70),
width: ScreenUtil().setWidth(220),
gradientStart: Colors.transparent,
gradientEnd: Colors.transparent,
radius: ScreenUtil().setWidth(10),
)
],
color: MyColours.color_ffffff,
child: Column(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
_buildMultiDatePickerWithValue(
_multiDatePickerValueWithDefaultValue, (value) {
_multiDatePickerValueWithDefaultValue = value;
}),
VEmptyView(120),
Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
RoundButton(
onPressed: () async {
// _calendarController
// .setSelectedDay(DateTime.now());
Navigator.pop(context);
// _multiDatePickerValueWithDefaultValue =
// _selectPickerValues;
_setState(() {});
},
text: '取消',
fontSize: 28,
isBold: false,
borderColor: MyColours.color_438E93,
height: ScreenUtil().setWidth(70),
width: w(160),
gradientStart: MyColours.color_ffffff,
gradientEnd: MyColours.color_ffffff,
radius: ScreenUtil().setWidth(10),
textColor: MyColours.color_438E93,
),
VEmptyView(40)
RoundButton(
onPressed: () async {
Navigator.pop(context);
valueChanged(_multiDatePickerValueWithDefaultValue);
},
text: '确定',
fontSize: 28,
isBold: false,
textColor: MyColours.color_F8F9FD,
borderColor: MyColours.color_438E93,
height: ScreenUtil().setWidth(70),
width: w(160),
gradientStart: MyColours.color_438E93,
gradientEnd: MyColours.color_438E93,
radius: ScreenUtil().setWidth(10),
)
],
))
// Positioned(
// right: ScreenUtil().setWidth(62),
// bottom: ScreenUtil().setHeight(20),
// child: Container(
// child: GestureDetector(
// onTap: () {
// _calendarController.setSelectedDay(DateTime.now());
// _setState(() {});
// },
// child: Container(
// child: ClipOval(
// child: Container(
// width: ScreenUtil().setWidth(100),
// height: ScreenUtil().setWidth(100),
// alignment: Alignment.center,
// color: MyColours.color_2bb5b7,
// child: Text(
// "回到\n今天",
// style: TextStyle(
// color: MyColours.color_ffffff,
// fontSize: ScreenUtil().setSp(26)),
// ),
// )),
// ),
// ),
// ),
// )
// ],
;
),
VEmptyView(40)
],
));
});
return SizedBox(
width: double.infinity,
... ...
... ... @@ -386,7 +386,7 @@ class _CalendarViewState extends State<_CalendarView> {
// color: Colors.red,
child: Image.asset(
'assets/date_y_r.png',
width: 12,
width: 10,
height: 45,
))),
],
... ...
... ... @@ -451,10 +451,10 @@ class _CalendarDatePicker2State extends State<CalendarDatePicker2> {
Positioned(
// left: 150,
top: ((widget.config.controlsHeight ?? _subHeaderHeight) -
20) /
23) /
2,
child: Container(
height: 20,
height: 23,
child: Text(_currentDisplayedMonthDate.year.toString() +
'年' +
_currentDisplayedMonthDate.month.toString() +
... ...