guyongliang/ln-ios
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

预约列表样式

Browse Source
This commit is contained in:
userGyl
2026-02-10 11:51:47 +08:00
parent 26c5f9d67a
commit a5e2a89e4f
1 changed files with 73 additions and 70 deletions
Download Patch File Download Diff File Expand all files Collapse all files

87
ln_jq_app/lib/pages/c_page/reservation/reservation_list_bottomsheet.dart
View File

@@ -36,19 +36,19 @@ class _ReservationListBottomSheetState extends State<ReservationListBottomSheet>
@override
Widget build(BuildContext context) {
return Container(
height: Get.height * 0.55,
height: Get.height * 0.6,
decoration: const BoxDecoration(
color: Colors.white,
color: Color.fromRGBO(247, 249, 251, 1),
borderRadius: BorderRadius.only(
topLeft: Radius.circular(16),
topRight: Radius.circular(16),
),
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
// 构建标题和下拉框
_buildHeader(),
const Divider(height: 1),
// 下拉筛选框
_buildChoice(),
// 构建列表（使用 Obx 监听数据变化）
@@ -72,10 +72,7 @@ class _ReservationListBottomSheetState extends State<ReservationListBottomSheet>
value: _selectedStatus,
underline: const SizedBox.shrink(), // 隐藏下划线
items: _statusOptions.entries.map((entry) {
return DropdownMenuItem<String>(
value: entry.key,
child: Text(entry.value),
);
return DropdownMenuItem<String>(value: entry.key, child: Text(entry.value));
}).toList(),
onChanged: (newValue) {
if (newValue != null) {
@@ -94,24 +91,10 @@ class _ReservationListBottomSheetState extends State<ReservationListBottomSheet>
/// 构建标题、关闭按钮和下拉筛选框
Widget _buildHeader() {
return Container(
padding: const EdgeInsets.fromLTRB(20, 8, 8, 8),
child: Stack(
alignment: Alignment.center,
children: [
Center(child: const Text('我的预约', style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold)),),
Align(
alignment: Alignment.centerRight,
child: ElevatedButton(
onPressed: () => Get.back(),
style: ElevatedButton.styleFrom(
elevation: 0,
backgroundColor: Colors.grey[200],
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(5)),
),
child: const Text('关闭', style: TextStyle(color: Colors.black54)),
),
),
],
margin: const EdgeInsets.fromLTRB(20, 20, 8, 8),
child: const Text(
'我的预约',
style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold),
),
);
}
@@ -134,8 +117,8 @@ class _ReservationListBottomSheetState extends State<ReservationListBottomSheet>
return Card(
color: Colors.white,
margin: const EdgeInsets.only(bottom: 12.0),
elevation: 1,
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
elevation: 0,
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(16)),
child: Padding(
padding: const EdgeInsets.all(16),
child: Column(
@@ -151,17 +134,20 @@ class _ReservationListBottomSheetState extends State<ReservationListBottomSheet>
vertical: 5,
),
decoration: BoxDecoration(
color: Colors.blue.shade50, // 淡蓝色背景
color: reservation.state == "-1"
? Color.fromRGBO(241, 67, 56, 0.1)
: Color.fromRGBO(230, 249, 243, 1),
borderRadius: BorderRadius.circular(4), // 小圆角
// 可以选择去掉边框，或者用极淡的边框
border: Border.all(color: Colors.blue.shade100),
),
child: Text(
"${reservation.stateName}-${reservation.addStatusName}",
style: TextStyle(
color: Colors.blue.shade700,
fontSize: 12,
fontWeight: FontWeight.w500,
color: reservation.state == "-1"
? Color.fromRGBO(241, 67, 56, 0.8)
: Color.fromRGBO(49, 186, 133, 1),
fontSize: 12.sp,
fontWeight: FontWeight.w600,
),
),
),
@@ -174,9 +160,7 @@ class _ReservationListBottomSheetState extends State<ReservationListBottomSheet>
onPressed: () async {
var responseData = await HttpService.to.post(
'appointment/orderAddHyd/vehicle-cancel',
data: {
'id': reservation.id,
},
data: {'id': reservation.id},
);
if (responseData == null || responseData.data == null) {
@@ -203,11 +187,14 @@ class _ReservationListBottomSheetState extends State<ReservationListBottomSheet>
),
child: Text(
'取消预约',
style: TextStyle(color: Colors.grey.shade600, fontSize: 12),
style: TextStyle(
color: Colors.grey.shade600,
fontSize: 12,
),
),
),
SizedBox(width: 10.w,),
),
SizedBox(width: 10.w),
// 修改按钮 (仅在 hasEdit 为 true 时显示)
if (reservation.hasEdit)
SizedBox(
@@ -241,13 +228,14 @@ class _ReservationListBottomSheetState extends State<ReservationListBottomSheet>
'修改',
style: TextStyle(color: Colors.blue, fontSize: 12),
),
),),
),
),
],
),
const SizedBox(height: 12),
_buildDetailRow('车牌号:', reservation.plateNumber),
_buildDetailRow('预约日期:', reservation.date),
_buildDetailRow('预约氢量:', reservation.hydAmount),
_buildDetailRow('预约氢量:', "${reservation.hydAmount} KG"),
_buildDetailRow('加氢站:', reservation.stationName),
_buildDetailRow('开始时间:', reservation.startTime),
_buildDetailRow('结束时间:', reservation.endTime),
@@ -271,11 +259,26 @@ class _ReservationListBottomSheetState extends State<ReservationListBottomSheet>
return Padding(
padding: const EdgeInsets.only(top: 8.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(label, style: const TextStyle(color: Colors.grey)),
Text(
label,
style: TextStyle(
color: Color.fromRGBO(51, 51, 51, 0.6),
fontSize: 14.sp,
fontWeight: FontWeight.w400,
),
),
const SizedBox(width: 8),
Expanded(
child: Text(value, style: const TextStyle(fontWeight: FontWeight.w500)),
Text(
value,
style: TextStyle(
color: label.contains("预约氢量:")
? Color.fromRGBO(27, 168, 85, 1)
: Color.fromRGBO(51, 51, 51, 1),
fontSize: 14.sp,
fontWeight: FontWeight.w500,
),
),
],
),