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

加氢站ui

Browse Source
This commit is contained in:
userGyl
2025-11-04 16:21:04 +08:00
parent fec7b70fa9
commit 6faf03a331
7 changed files with 559 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files

52
ln_jq_app/lib/pages/b_page/reservation/controller.dart
View File

@@ -1,18 +1,60 @@
import 'package:get/get.dart';
import 'package:getx_scaffold/getx_scaffold.dart';
import 'package:ln_jq_app/pages/login/view.dart';
class ReservationController extends GetxController with BaseControllerMixin {
@override
String get builderId => 'b_reservation';
String get builderId => 'b_reservation'; // 确保ID与View中一致
ReservationController();
// --- 运营状态下拉菜单所需的状态 ---
// 下拉菜单的选项列表
final List<String> operationStatusOptions = ['营运中', '维修中', '暂停营业', '站点关闭'];
// 当前选中的值，默认为'运营中'
late String selectedOperationStatus;
ReservationController() {
selectedOperationStatus = operationStatusOptions[0]; // 初始化选中值
}
@override
void onInit() {
super.onInit();
// 可以在这里从服务器加载站点的初始信息
renderData();
}
@override
void onClose() {
super.onClose();
Future<void> renderData() async {
showLoading("加载中");
// 模拟网络请求延迟
await Future.delayed(const Duration(seconds: 1));
dismissLoading();
updateUi();
}
/// 更新运营状态的方法
void onOperationStatusChanged(String? newValue) {
if (newValue != null) {
selectedOperationStatus = newValue;
updateUi();
}
}
void saveInfo() {
// TODO: 在这里执行保存信息的逻辑
// 1. 获取所有输入框和下拉框的最新值
// 2. 调用API接口，将数据提交到服务器
// 3. 根据接口返回结果给出提示（成功或失败）
Get.snackbar('提示', '保存成功！'); // 示例：显示一个成功的提示
}
void logout() {
// TODO: 在这里执行退出登录的逻辑
// 1. 清理本地缓存的用户信息
// 2. 调用退出登录接口
// 3. 导航到登录页面
Get.offAll(() => LoginPage());
}
}

229
ln_jq_app/lib/pages/b_page/reservation/view.dart
View File

@@ -1,27 +1,234 @@
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:getx_scaffold/getx_scaffold.dart';
import 'controller.dart';
import 'package:ln_jq_app/pages/b_page/reservation/controller.dart';
class ReservationPage extends GetView<ReservationController> {
const ReservationPage({super.key});
// 主视图
Widget _buildView() {
return <Widget>[
TextX.titleLarge('预约'),
].toColumn(mainAxisSize: MainAxisSize.min).center();
}
@override
Widget build(BuildContext context) {
return GetBuilder<ReservationController>(
init: ReservationController(),
id: 'b_reservation',
builder: (_) {
return _buildView();
return Scaffold(
body: SingleChildScrollView(
child: Padding(
padding: const EdgeInsets.all(12.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
_buildHeaderCard(),
const SizedBox(height: 12),
_buildInfoFormCard(context),
const SizedBox(height: 12),
_buildTipsCard(),
const SizedBox(height: 12),
_buildLogoutButton(),
],
),
),
),
);
},
);
}
/// 构建顶部的站点信息头卡片
Widget _buildHeaderCard() {
return Card(
elevation: 2,
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)),
child: Column(
children: [
ListTile(
leading: const Icon(Icons.local_gas_station, color: Colors.blue, size: 40),
title: const Text('H2加氢站', style: TextStyle(fontWeight: FontWeight.bold, fontSize: 18)),
subtitle: const Text('上海市浦东新区张江高科技园区'),
trailing: Container(
padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 4),
decoration: BoxDecoration(
color: Colors.blue[100],
borderRadius: BorderRadius.circular(12),
),
child: const Text('运营中', style: TextStyle(color: Colors.blue, fontWeight: FontWeight.bold, fontSize: 12)),
),
),
const Divider(height: 1, indent: 16, endIndent: 16),
Padding(
padding: const EdgeInsets.symmetric(vertical: 16.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: [
_buildHeaderStat('¥45', '氢气价格'),
_buildHeaderStat('24h', '营业时间'),
_buildHeaderStat('98%', '设备状态'),
],
),
),
],
),
);
}
/// 构建头部卡片中的单个统计项
Widget _buildHeaderStat(String value, String label) {
return Column(
children: [
Text(value, style: const TextStyle(color: Colors.blue, fontSize: 20, fontWeight: FontWeight.bold)),
const SizedBox(height: 4),
Text(label, style: const TextStyle(color: Colors.grey, fontSize: 12)),
],
);
}
/// 构建包含所有信息表单的卡片
Widget _buildInfoFormCard(BuildContext context) {
return Card(
elevation: 2,
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)),
child: Padding(
padding: const EdgeInsets.all(16.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
// --- 基本信息 ---
_buildSectionTitle('基本信息'),
_buildDisplayField(label: '站点名称', value: 'H2加氢站'),
_buildDisplayField(label: '运营企业', value: '上海氢能科技有限公司'),
_buildDisplayField(label: '站点地址', value: '上海市浦东新区张江高科技园区'),
const SizedBox(height: 16),
// --- 价格信息 ---
_buildSectionTitle('价格信息'),
_buildDisplayField(label: '氢气价格 (元/kg)', value: '45'),
_buildDisplayField(label: '官方价格 (元/kg)', value: '50'),
const SizedBox(height: 16),
// --- 运营信息 ---
_buildSectionTitle('运营信息'),
Text('运营状态', style: TextStyle(color: Colors.grey[600], fontSize: 14)),
const SizedBox(height: 8),
//下拉选择框
DropdownButtonFormField<String>(
value: controller.selectedOperationStatus,
items: controller.operationStatusOptions.map((String value) {
return DropdownMenuItem<String>(
value: value,
child: Text(value),
);
}).toList(),
onChanged: controller.onOperationStatusChanged,
decoration: InputDecoration(
border: OutlineInputBorder(borderRadius: BorderRadius.circular(8.0)),
contentPadding: const EdgeInsets.symmetric(horizontal: 12.0),
),
),
const SizedBox(height: 12),
_buildDisplayField(label: '营业时间', value: '24小时营业'),
_buildDisplayField(label: '联系电话', value: '021-12345678'),
const SizedBox(height: 24),
//保存按钮
ElevatedButton(
onPressed: controller.saveInfo,
style: ElevatedButton.styleFrom(
minimumSize: const Size(double.infinity, 48),
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)),
),
child: const Text('保存信息', style: TextStyle(fontSize: 16)),
),
],
),
),
);
}
/// 构建静态提示信息卡片
Widget _buildTipsCard() {
return Card(
elevation: 2,
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)),
child: Padding(
padding: const EdgeInsets.all(16.0),
child: Column(
children: [
_buildInfoItem(Icons.info_outline, '请确保信息准确无误'),
const SizedBox(height: 10),
_buildInfoItem(Icons.help_outline, '价格信息将实时更新到用户端'),
const SizedBox(height: 10),
_buildInfoItem(Icons.headset_mic_outlined, '如有疑问请联系技术支持: 400-123-4567'),
],
),
),
);
}
/// 构建退出登录按钮
Widget _buildLogoutButton() {
return ElevatedButton(
onPressed: controller.logout,
style: ElevatedButton.styleFrom(
backgroundColor: Colors.red,
foregroundColor: Colors.white,
minimumSize: const Size(double.infinity, 48),
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(24)),
elevation: 2,
),
child: const Text('退出登录', style: TextStyle(fontSize: 16, fontWeight: FontWeight.bold)),
);
}
/// 构建带标题的表单区域
Widget _buildSectionTitle(String title) {
return Padding(
padding: const EdgeInsets.only(bottom: 12.0),
child: Row(
children: [
Container(width: 4, height: 16, color: Colors.blue),
const SizedBox(width: 8),
Text(title, style: const TextStyle(fontSize: 16, fontWeight: FontWeight.bold)),
],
),
);
}
/// 构建一个“标签+纯文本”的显示行
Widget _buildDisplayField({required String label, required String value}) {
return Padding(
padding: const EdgeInsets.only(bottom: 12.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(label, style: TextStyle(color: Colors.grey[600], fontSize: 14)),
const SizedBox(height: 8),
Container(
width: double.infinity,
padding: const EdgeInsets.symmetric(horizontal: 12.0, vertical: 12.0),
decoration: BoxDecoration(
color: Colors.grey[200], // 使用灰色背景以区分
borderRadius: BorderRadius.circular(8.0),
border: Border.all(color: Colors.grey[300]!),
),
child: Text(
value,
style: const TextStyle(fontSize: 14, color: Colors.black87),
),
),
],
),
);
}
/// 构建带图标的提示信息行
Widget _buildInfoItem(IconData icon, String text) {
return Row(
children: [
Icon(icon, color: Colors.blue, size: 20),
const SizedBox(width: 10),
Expanded(child: Text(text, style: const TextStyle(fontSize: 14, color: Colors.black54))),
],
);
}
}