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
2025-11-07 18:08:41 +08:00
parent aaf5c12735
commit 079bec91f8
9 changed files with 1093 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files

319
ln_jq_app/lib/pages/c_page/mine/view.dart
View File

@@ -1,26 +1,325 @@
import 'package:flutter/material.dart';
import 'package:getx_scaffold/getx_scaffold.dart';
import 'package:get/get.dart';
import 'controller.dart';
// 假设您的 Controller 在这里，如果还没有，可以先创建一个空类
// import 'controller.dart';
// 为了演示，我们先创建一个空的 Controller
// class MineController extends GetxController {}
class MinePage extends GetView<MineController> {
const MinePage({super.key});
// 主视图
Widget _buildView() {
return <Widget>[
TextX.titleLarge('我的'),
].toColumn(mainAxisSize: MainAxisSize.min).center();
}
@override
Widget build(BuildContext context) {
return GetBuilder<MineController>(
init: MineController(),
id: 'mine',
builder: (_) {
return _buildView();
// 将所有 UI 构建逻辑放在这里
return Scaffold(
backgroundColor: Colors.grey[100],
body: SingleChildScrollView(
child: Padding(
padding: const EdgeInsets.all(12.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
_buildUserInfoCard(),
const SizedBox(height: 12),
_buildDriverScoreCard(),
const SizedBox(height: 12),
_buildMonthlyRecordCard(),
const SizedBox(height: 12),
_buildTipsCard(),
const SizedBox(height: 20),
_buildLogoutButton(),
],
),
),
),
);
},
);
}
/// 1. 构建顶部用户信息卡片
Widget _buildUserInfoCard() {
return Card(
elevation: 2,
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
child: Column(
children: [
Padding(
padding: const EdgeInsets.all(16.0),
child: Row(
children: [
const CircleAvatar(
radius: 30,
backgroundColor: Colors.blue,
child: Icon(Icons.person, color: Colors.white, size: 40),
),
const SizedBox(width: 16),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text(
'王小龙',
style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold),
),
const SizedBox(height: 4),
const Text(
'15888332828',
style: TextStyle(color: Colors.grey, fontSize: 14),
),
const SizedBox(height: 4),
const Text(
'未绑定车辆',
style: TextStyle(color: Colors.orange, fontSize: 12),
),
],
),
),
Container(
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 4),
decoration: BoxDecoration(
color: Colors.blue[50],
borderRadius: BorderRadius.circular(12),
border: Border.all(color: Colors.blue, width: 0.5),
),
child: const Row(
children: [
Icon(Icons.shield_outlined, color: Colors.blue, size: 14),
SizedBox(width: 4),
Text('已认证', style: TextStyle(color: Colors.blue, fontSize: 10, fontWeight: FontWeight.bold)),
],
),
)
],
),
),
const Divider(height: 1),
Padding(
padding: const EdgeInsets.symmetric(vertical: 16.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: [
_buildStatItem('0', '违章总数'),
_buildStatItem('0', '扣分总数'),
_buildStatItem('0', '已处理'),
],
),
),
],
),
);
}
// 用户信息卡片中的小统计项
Widget _buildStatItem(String value, String label) {
return Column(
children: [
Text(value, style: const TextStyle(fontSize: 18, fontWeight: FontWeight.bold)),
const SizedBox(height: 4),
Text(label, style: const TextStyle(color: Colors.grey, fontSize: 12)),
],
);
}
/// 2. 构建驾驶得分卡片
Widget _buildDriverScoreCard() {
return Card(
elevation: 2,
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
child: Padding(
padding: const EdgeInsets.all(16.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text('驾驶得分', style: TextStyle(fontSize: 16, fontWeight: FontWeight.bold)),
const Text('本月表现', style: TextStyle(fontSize: 12, color: Colors.grey)),
const SizedBox(height: 20),
Center(
child: SizedBox(
width: 100,
height: 100,
child: Stack(
fit: StackFit.expand,
children: [
CircularProgressIndicator(
value: 0.8, // 假设得分80%
strokeWidth: 8,
backgroundColor: Colors.grey[200],
valueColor: AlwaysStoppedAnimation<Color>(Colors.blue),
),
Center(
child: Text(
'10',
style: TextStyle(
fontSize: 32,
fontWeight: FontWeight.bold,
color: Colors.blue,
),
),
),
],
),
),
),
const SizedBox(height: 20),
_buildScoreDetailRow(Icons.directions_car, '安全驾驶', '无违章记录', true),
const Divider(),
_buildScoreDetailRow(Icons.timer, '准时率', '100%准时到达', true),
const Divider(),
_buildScoreDetailRow(Icons.thumb_up, '服务质量', '用户满意度高', true),
const Divider(),
Padding(
padding: const EdgeInsets.only(top: 12.0),
child: Row(
children: [
const Text('优秀驾驶员', style: TextStyle(fontSize: 14, fontWeight: FontWeight.w500)),
const Spacer(),
Container(
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 6),
decoration: BoxDecoration(
color: Colors.blue,
borderRadius: BorderRadius.circular(16),
),
child: const Text('A+', style: TextStyle(color: Colors.white, fontWeight: FontWeight.bold)),
)
],
),
)
],
),
),
);
}
// 驾驶得分卡片中的评分项
Widget _buildScoreDetailRow(IconData icon, String title, String subtitle, bool isCompleted) {
return Padding(
padding: const EdgeInsets.symmetric(vertical: 8.0),
child: Row(
children: [
CircleAvatar(
radius: 20,
backgroundColor: Colors.blue.withOpacity(0.1),
child: Icon(icon, color: Colors.blue, size: 24),
),
const SizedBox(width: 12),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(title, style: const TextStyle(fontSize: 14, fontWeight: FontWeight.bold)),
Text(subtitle, style: const TextStyle(fontSize: 12, color: Colors.grey)),
],
),
),
if (isCompleted)
const Icon(Icons.check_circle, color: Colors.blue),
],
),
);
}
/// 3. 构建本月记录卡片
Widget _buildMonthlyRecordCard() {
return Card(
elevation: 2,
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
child: Padding(
padding: const EdgeInsets.all(16.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text('本月记录', style: TextStyle(fontSize: 16, fontWeight: FontWeight.bold)),
const SizedBox(height: 8),
_buildRecordRow(Icons.autorenew, '加氢预约践行率', '100%'),
const Divider(),
_buildRecordRow(Icons.report_problem_outlined, '违章', '0起'),
const Divider(),
_buildRecordRow(Icons.warning_amber_rounded, '危险驾驶', '0起'),
const Divider(),
_buildRecordRow(Icons.car_crash_outlined, '交通事故', '0起'),
],
),
),
);
}
// 本月记录中的列表项
Widget _buildRecordRow(IconData icon, String title, String value) {
return ListTile(
contentPadding: EdgeInsets.zero,
leading: CircleAvatar(
radius: 20,
backgroundColor: Colors.blue.withOpacity(0.1),
child: Icon(icon, color: Colors.blue, size: 24),
),
title: Text(title, style: const TextStyle(fontSize: 14)),
trailing: Row(
mainAxisSize: MainAxisSize.min,
children: [
Text(value, style: const TextStyle(color: Colors.grey, fontSize: 14)),
const SizedBox(width: 8),
const Icon(Icons.arrow_forward_ios, size: 14, color: Colors.grey),
],
),
onTap: () {
// TODO: 处理点击事件
},
);
}
/// 4. 构建提示信息卡片
Widget _buildTipsCard() {
return Card(
elevation: 2,
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
child: Padding(
padding: const EdgeInsets.all(16.0),
child: Column(
children: [
_buildInfoItem(Icons.info_outline, '保持良好的驾驶习惯，提高安全评分'),
const SizedBox(height: 10),
_buildInfoItem(Icons.rule, '遵守交通规则，避免违章扣分'),
const SizedBox(height: 10),
_buildInfoItem(Icons.headset_mic_outlined, '如有疑问请联系客服: 400-123-4567'),
],
),
),
);
}
// 提示信息卡片中的列表项
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: 12, color: Colors.black54))),
],
);
}
/// 5. 构建退出登录按钮
Widget _buildLogoutButton() {
return ElevatedButton(
onPressed: () {
controller.logout();
},
style: ElevatedButton.styleFrom(
backgroundColor: Colors.red[400],
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)),
);
}
}