优化搜索框样式,优化任务列表,环境变量等相关页面使用体验

This commit is contained in:
jyuesong
2022-06-07 18:28:38 +08:00
parent c7824c920b
commit 9759caf9b8
64 changed files with 1030 additions and 520 deletions

View File

@@ -37,76 +37,99 @@ class _LoginLogPageState extends ConsumerState<LoginLogPage>
),
body: list.isEmpty
? const Center(
child: CupertinoActivityIndicator(),
)
: ListView.builder(
itemBuilder: (context, index) {
LoginLogBean item = list[index];
child: CupertinoActivityIndicator(),
)
: ListView.separated(
itemBuilder: (context, index) {
LoginLogBean item = list[index];
return ColoredBox(
color: ref.watch(themeProvider).themeColor.settingBgColor(),
child: ListTile(
isThreeLine: true,
title: Text(
Utils.formatMessageTime(item.timestamp ?? 0),
style: TextStyle(
fontSize: 16,
color: ref.watch(themeProvider).themeColor.titleColor(),
),
),
subtitle: Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const SizedBox(
height: 5,
),
SelectableText(
"${item.address}",
selectionWidthStyle: BoxWidthStyle.max,
selectionHeightStyle: BoxHeightStyle.max,
style: TextStyle(
color:
ref.watch(themeProvider).themeColor.descColor(),
fontSize: 14,
),
),
const SizedBox(
height: 5,
),
SelectableText(
"${item.ip}",
selectionWidthStyle: BoxWidthStyle.max,
selectionHeightStyle: BoxHeightStyle.max,
style: TextStyle(
color:
ref.watch(themeProvider).themeColor.descColor(),
fontSize: 14,
),
),
],
),
trailing: item.status == 0
? Icon(
CupertinoIcons.checkmark_circle,
color: ref.watch(themeProvider).primaryColor,
size: 16,
)
: const Icon(
CupertinoIcons.clear_circled,
color: Colors.red,
size: 16,
),
return Row(
children: [
const SizedBox(
width: 15,
),
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const SizedBox(
height: 10,
),
);
},
itemCount: list.length,
),
Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
"${item.address}",
style: TextStyle(
color: ref
.watch(themeProvider)
.themeColor
.titleColor(),
fontSize: 14,
),
),
const SizedBox(
width: 5,
),
Padding(
padding: const EdgeInsets.only(
top: 2,
),
child: Image.asset(
item.status == 0
? "assets/images/icon_success.png"
: "assets/images/icon_fail.png",
width: 30,
fit: BoxFit.cover,
),
),
],
),
const SizedBox(
height: 10,
),
SelectableText(
"${item.ip}",
selectionWidthStyle: BoxWidthStyle.max,
selectionHeightStyle: BoxHeightStyle.max,
style: TextStyle(
color:
ref.watch(themeProvider).themeColor.descColor(),
fontSize: 14,
),
),
const SizedBox(
height: 10,
),
],
),
const Spacer(),
Text(
Utils.formatMessageTime(item.timestamp ?? 0),
style: TextStyle(
fontSize: 12,
color: ref.watch(themeProvider).themeColor.descColor(),
),
),
const SizedBox(
width: 15,
),
],
);
},
itemCount: list.length,
separatorBuilder: (BuildContext context, int index) {
return const Divider(
indent: 15,
height: 1,
);
},
),
);
}
Future<void> loadData() async {
HttpResponse<List<LoginLogBean>> response = await Api.loginLog();
HttpResponse<List<LoginLogBean>> response =
await Api.loginLog();
if (response.success) {
if (response.bean == null || response.bean!.isEmpty) {

View File

@@ -26,15 +26,8 @@ class _OtherPageState extends ConsumerState<OtherPage> {
children: [
Container(
margin: const EdgeInsets.symmetric(
horizontal: 15,
vertical: 15,
),
decoration: BoxDecoration(
color: ref.watch(themeProvider).themeColor.settingBordorColor(),
borderRadius: const BorderRadius.all(
Radius.circular(15),
),
),
child: Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
@@ -225,15 +218,8 @@ class _OtherPageState extends ConsumerState<OtherPage> {
),
Container(
margin: const EdgeInsets.symmetric(
horizontal: 15,
vertical: 15,
),
decoration: BoxDecoration(
color: ref.watch(themeProvider).themeColor.settingBordorColor(),
borderRadius: const BorderRadius.all(
Radius.circular(15),
),
),
child: Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
@@ -304,6 +290,41 @@ class _OtherPageState extends ConsumerState<OtherPage> {
const Divider(
indent: 15,
),
GestureDetector(
behavior: HitTestBehavior.opaque,
onTap: () {
Navigator.of(context).pushNamed(Routes.routeChangeAccount);
},
child: Padding(
padding: const EdgeInsets.only(
left: 15,
right: 15,
top: 5,
bottom: 5,
),
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
"切换账号",
style: TextStyle(
color: ref.watch(themeProvider).themeColor.titleColor(),
fontSize: 16,
),
),
const Spacer(),
const Icon(
CupertinoIcons.right_chevron,
size: 16,
),
],
),
),
),
const Divider(
indent: 15,
),
GestureDetector(
behavior: HitTestBehavior.opaque,
onTap: () {

View File

@@ -7,6 +7,7 @@ import 'package:qinglong_app/base/ql_app_bar.dart';
import 'package:qinglong_app/base/routes.dart';
import 'package:qinglong_app/base/theme.dart';
import 'package:qinglong_app/base/ui/lazy_load_state.dart';
import 'package:qinglong_app/base/ui/search_cell.dart';
import 'package:qinglong_app/module/others/scripts/script_bean.dart';
import 'package:qinglong_app/utils/extension.dart';
@@ -170,39 +171,7 @@ class _ScriptPageState extends ConsumerState<ScriptPage> with LazyLoadState<Scri
horizontal: 15,
vertical: 10,
),
child: CupertinoSearchTextField(
onSubmitted: (value) {
setState(() {});
},
onSuffixTap: () {
_searchController.text = "";
setState(() {});
},
controller: _searchController,
borderRadius: BorderRadius.circular(
30,
),
padding: const EdgeInsets.symmetric(
horizontal: 5,
vertical: 5,
),
suffixInsets: const EdgeInsets.only(
right: 15,
),
prefixInsets: const EdgeInsets.only(
top: 6,
bottom: 6,
left: 15,
),
placeholderStyle: TextStyle(
fontSize: 16,
color: context.watch(themeProvider).themeColor.descColor(),
),
style: const TextStyle(
fontSize: 16,
),
placeholder: "搜索",
),
child:SearchCell(controller: _searchController,),
);
}

View File

@@ -7,6 +7,7 @@ import 'package:qinglong_app/base/ql_app_bar.dart';
import 'package:qinglong_app/base/routes.dart';
import 'package:qinglong_app/base/theme.dart';
import 'package:qinglong_app/base/ui/lazy_load_state.dart';
import 'package:qinglong_app/base/ui/search_cell.dart';
import 'package:qinglong_app/module/others/task_log/task_log_bean.dart';
import 'package:qinglong_app/utils/extension.dart';
@@ -20,6 +21,27 @@ class TaskLogPage extends ConsumerStatefulWidget {
class _TaskLogPageState extends ConsumerState<TaskLogPage> with LazyLoadState<TaskLogPage> {
List<TaskLogBean> list = [];
final TextEditingController _searchController = TextEditingController();
Widget searchCell(WidgetRef context) {
return Container(
padding: const EdgeInsets.symmetric(
horizontal: 15,
vertical: 10,
),
child: SearchCell(
controller: _searchController,
),
);
}
@override
void initState() {
super.initState();
_searchController.addListener(() {
setState(() {});
});
}
@override
Widget build(BuildContext context) {
@@ -37,72 +59,79 @@ class _TaskLogPageState extends ConsumerState<TaskLogPage> with LazyLoadState<Ta
)
: ListView.builder(
itemBuilder: (context, index) {
TaskLogBean item = list[index];
if (index == 0) {
return searchCell(ref);
}
TaskLogBean item = list[index - 1];
if (_searchController.text.isNotEmpty && !(item.name?.contains(_searchController.text) ?? false)) {
return const SizedBox.shrink();
}
return ColoredBox(
color: ref.watch(themeProvider).themeColor.settingBgColor(),
child: (item.isDir ?? false)
? ExpansionTile(
title: Text(
item.name ?? "",
style: TextStyle(
color: ref.watch(themeProvider).themeColor.titleColor(),
fontSize: 16,
),
),
children: (item.files?.isNotEmpty ?? false)
? item.files!
.map((e) => ListTile(
onTap: () {
Navigator.of(context).pushNamed(Routes.routeTaskLogDetail, arguments: {
"path": item.name,
"title": e,
});
},
title: Text(
e,
style: TextStyle(
color: ref.watch(themeProvider).themeColor.titleColor(),
fontSize: 14,
),
),
))
.toList()
: (item.children ?? [])
.map((e) => ListTile(
onTap: () {
Navigator.of(context).pushNamed(Routes.routeTaskLogDetail, arguments: {
"path": item.name,
"title": e.title,
});
},
title: Text(
e.title ?? "",
style: TextStyle(
color: ref.watch(themeProvider).themeColor.titleColor(),
fontSize: 14,
),
),
))
.toList(),
)
title: Text(
item.name ?? "",
style: TextStyle(
color: ref.watch(themeProvider).themeColor.titleColor(),
fontSize: 16,
),
),
children: (item.files?.isNotEmpty ?? false)
? item.files!
.map((e) => ListTile(
onTap: () {
Navigator.of(context).pushNamed(Routes.routeTaskLogDetail, arguments: {
"path": item.name,
"title": e,
});
},
title: Text(
e,
style: TextStyle(
color: ref.watch(themeProvider).themeColor.titleColor(),
fontSize: 14,
),
),
))
.toList()
: (item.children ?? [])
.map((e) => ListTile(
onTap: () {
Navigator.of(context).pushNamed(Routes.routeTaskLogDetail, arguments: {
"path": item.name,
"title": e.title,
});
},
title: Text(
e.title ?? "",
style: TextStyle(
color: ref.watch(themeProvider).themeColor.titleColor(),
fontSize: 14,
),
),
))
.toList(),
)
: ListTile(
onTap: () {
if (item.isDir ?? false) {
"该文件夹为空".toast();
return;
}
Navigator.of(context).pushNamed(Routes.routeTaskLogDetail, arguments: item.name);
},
title: Text(
item.name ?? "",
style: TextStyle(
color: ref.watch(themeProvider).themeColor.titleColor(),
fontSize: 16,
),
),
),
onTap: () {
if (item.isDir ?? false) {
"该文件夹为空".toast();
return;
}
Navigator.of(context).pushNamed(Routes.routeTaskLogDetail, arguments: {
"path": "",
"title": item.name,
});
},
title: Text(
item.name ?? "",
style: TextStyle(
color: ref.watch(themeProvider).themeColor.titleColor(),
fontSize: 16,
),
),
),
);
},
itemCount: list.length,