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