使用单独的页面编辑服务器信息
This commit is contained in:
LollipopKit
149
lib/view/page/server/server_edit.dart
Normal file
149
lib/view/page/server/server_edit.dart
Normal file
@@ -0,0 +1,149 @@
|
||||
import 'package:after_layout/after_layout.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:toolbox/data/model/server_private_info.dart';
|
||||
import 'package:toolbox/data/provider/server.dart';
|
||||
import 'package:toolbox/locator.dart';
|
||||
|
||||
class ServerEditPage extends StatefulWidget {
|
||||
const ServerEditPage({Key? key, this.spi}) : super(key: key);
|
||||
|
||||
final ServerPrivateInfo? spi;
|
||||
|
||||
@override
|
||||
_ServerEditPageState createState() => _ServerEditPageState();
|
||||
}
|
||||
|
||||
class _ServerEditPageState extends State<ServerEditPage> with AfterLayoutMixin {
|
||||
final nameController = TextEditingController();
|
||||
final ipController = TextEditingController();
|
||||
final portController = TextEditingController();
|
||||
final usernameController = TextEditingController();
|
||||
final passwordController = TextEditingController();
|
||||
final keyController = TextEditingController();
|
||||
|
||||
late ServerProvider _serverProvider;
|
||||
|
||||
bool usePublicKey = false;
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
_serverProvider = locator<ServerProvider>();
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Scaffold(
|
||||
appBar: AppBar(title: const Text('Edit')),
|
||||
body: SingleChildScrollView(
|
||||
padding: const EdgeInsets.all(17),
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
TextField(
|
||||
controller: nameController,
|
||||
keyboardType: TextInputType.text,
|
||||
decoration: _buildDecoration('Name', icon: Icons.info),
|
||||
),
|
||||
TextField(
|
||||
controller: ipController,
|
||||
keyboardType: TextInputType.text,
|
||||
decoration: _buildDecoration('Host', icon: Icons.storage),
|
||||
),
|
||||
TextField(
|
||||
controller: portController,
|
||||
keyboardType: TextInputType.number,
|
||||
decoration:
|
||||
_buildDecoration('Port', icon: Icons.format_list_numbered),
|
||||
),
|
||||
TextField(
|
||||
controller: usernameController,
|
||||
keyboardType: TextInputType.text,
|
||||
decoration: _buildDecoration('User', icon: Icons.account_box),
|
||||
),
|
||||
const SizedBox(height: 7),
|
||||
Row(
|
||||
children: [
|
||||
const Text('Public Key Auth'),
|
||||
Switch(
|
||||
value: usePublicKey,
|
||||
onChanged: (val) => setState(() => usePublicKey = val)),
|
||||
],
|
||||
),
|
||||
usePublicKey
|
||||
? TextField(
|
||||
controller: keyController,
|
||||
keyboardType: TextInputType.text,
|
||||
autocorrect: false,
|
||||
maxLines: 10,
|
||||
minLines: 5,
|
||||
decoration:
|
||||
_buildDecoration('Private Key', icon: Icons.vpn_key),
|
||||
onSubmitted: (_) => {},
|
||||
)
|
||||
: const SizedBox(),
|
||||
TextField(
|
||||
controller: passwordController,
|
||||
obscureText: true,
|
||||
keyboardType: TextInputType.text,
|
||||
decoration: _buildDecoration('Pwd', icon: Icons.password),
|
||||
onSubmitted: (_) => {},
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
floatingActionButton: FloatingActionButton(
|
||||
child: const Icon(Icons.send),
|
||||
onPressed: () {
|
||||
final authorization = keyController.text.isEmpty
|
||||
? passwordController.text
|
||||
: {
|
||||
"privateKey": keyController.text,
|
||||
"passphrase": passwordController.text
|
||||
};
|
||||
final spi = ServerPrivateInfo(
|
||||
name: nameController.text,
|
||||
ip: ipController.text,
|
||||
port: int.parse(portController.text),
|
||||
user: usernameController.text,
|
||||
authorization: authorization);
|
||||
|
||||
if (widget.spi == null) {
|
||||
_serverProvider.addServer(spi);
|
||||
} else {
|
||||
_serverProvider.updateServer(widget.spi!, spi);
|
||||
}
|
||||
|
||||
Navigator.of(context).pop();
|
||||
},
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
InputDecoration _buildDecoration(String label,
|
||||
{TextStyle? textStyle, IconData? icon}) {
|
||||
return InputDecoration(
|
||||
labelText: label, labelStyle: textStyle, icon: Icon(icon));
|
||||
}
|
||||
|
||||
@override
|
||||
void afterFirstLayout(BuildContext context) {
|
||||
if (widget.spi != null) {
|
||||
nameController.text = widget.spi?.name ?? '';
|
||||
ipController.text = widget.spi?.ip ?? '';
|
||||
portController.text = (widget.spi?.port ?? 22).toString();
|
||||
usernameController.text = widget.spi?.user ?? '';
|
||||
if (widget.spi?.authorization is String) {
|
||||
passwordController.text = widget.spi?.authorization as String? ?? '';
|
||||
} else {
|
||||
final auth = widget.spi?.authorization as Map;
|
||||
passwordController.text = auth['passphrase'];
|
||||
keyController.text = auth['privateKey'];
|
||||
setState(() {
|
||||
usePublicKey = true;
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
243
lib/view/page/server/server_tab.dart
Normal file
243
lib/view/page/server/server_tab.dart
Normal file
@@ -0,0 +1,243 @@
|
||||
import 'package:after_layout/after_layout.dart';
|
||||
import 'package:charts_flutter/flutter.dart' as chart;
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter/widgets.dart';
|
||||
import 'package:flutter_staggered_animations/flutter_staggered_animations.dart';
|
||||
import 'package:get_it/get_it.dart';
|
||||
import 'package:provider/provider.dart';
|
||||
import 'package:toolbox/core/route.dart';
|
||||
import 'package:toolbox/data/model/server_private_info.dart';
|
||||
import 'package:toolbox/data/model/server_status.dart';
|
||||
import 'package:toolbox/data/provider/server.dart';
|
||||
import 'package:toolbox/locator.dart';
|
||||
import 'package:toolbox/view/page/server/server_edit.dart';
|
||||
import 'package:toolbox/view/widget/circle_pie.dart';
|
||||
|
||||
class ServerPage extends StatefulWidget {
|
||||
const ServerPage({Key? key}) : super(key: key);
|
||||
|
||||
@override
|
||||
_ServerPageState createState() => _ServerPageState();
|
||||
}
|
||||
|
||||
class _ServerPageState extends State<ServerPage>
|
||||
with AutomaticKeepAliveClientMixin, AfterLayoutMixin {
|
||||
late MediaQueryData _media;
|
||||
late ThemeData _theme;
|
||||
|
||||
late ServerProvider _serverProvider;
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
_serverProvider = locator<ServerProvider>();
|
||||
}
|
||||
|
||||
@override
|
||||
void didChangeDependencies() {
|
||||
super.didChangeDependencies();
|
||||
_media = MediaQuery.of(context);
|
||||
_theme = Theme.of(context);
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
super.build(context);
|
||||
return Scaffold(
|
||||
body: SingleChildScrollView(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 7),
|
||||
child: AnimationLimiter(
|
||||
child: Consumer<ServerProvider>(builder: (_, pro, __) {
|
||||
return Column(
|
||||
children: AnimationConfiguration.toStaggeredList(
|
||||
duration: const Duration(milliseconds: 377),
|
||||
childAnimationBuilder: (widget) => SlideAnimation(
|
||||
verticalOffset: 50.0,
|
||||
child: FadeInAnimation(
|
||||
child: widget,
|
||||
),
|
||||
),
|
||||
children: [
|
||||
const SizedBox(height: 13),
|
||||
...pro.servers.map((e) => _buildEachServerCard(
|
||||
pro.servers[pro.servers.indexOf(e)].status, e.info))
|
||||
],
|
||||
));
|
||||
})),
|
||||
),
|
||||
floatingActionButton: FloatingActionButton(
|
||||
onPressed: () =>
|
||||
AppRoute(const ServerEditPage(), 'Add server info page')
|
||||
.go(context),
|
||||
tooltip: 'add a server',
|
||||
heroTag: 'server page fab',
|
||||
child: const Icon(Icons.add),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildEachServerCard(ServerStatus ss, ServerPrivateInfo spi) {
|
||||
return GestureDetector(
|
||||
child: _buildEachCardContent(ss, spi),
|
||||
onLongPress: () {
|
||||
AppRoute(
|
||||
ServerEditPage(
|
||||
spi: spi,
|
||||
),
|
||||
'Edit server info page')
|
||||
.go(context);
|
||||
});
|
||||
}
|
||||
|
||||
Widget _buildEachCardContent(ServerStatus ss, ServerPrivateInfo spi) {
|
||||
return Card(
|
||||
child: InkWell(
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(13),
|
||||
child: _buildRealServerCard(ss, spi.name ?? ''),
|
||||
),
|
||||
onTap: () {},
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildRealServerCard(ServerStatus ss, String serverName) {
|
||||
final cpuData = [
|
||||
IndexPercent(0, ss.cpuPercent!.toInt()),
|
||||
IndexPercent(1, 100 - ss.cpuPercent!.toInt()),
|
||||
];
|
||||
final memData = <IndexPercent>[];
|
||||
for (var e in ss.memList!) {
|
||||
memData.add(IndexPercent(ss.memList!.indexOf(e), e!.toInt()));
|
||||
}
|
||||
|
||||
final mem1 = memData[1];
|
||||
memData[1] = memData.last;
|
||||
memData.last = mem1;
|
||||
|
||||
final rootDisk =
|
||||
ss.disk!.firstWhere((element) => element!.mountLocation == '/');
|
||||
|
||||
return Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
Text(
|
||||
serverName,
|
||||
style: const TextStyle(fontWeight: FontWeight.bold),
|
||||
),
|
||||
Text(ss.uptime!,
|
||||
style: TextStyle(
|
||||
color: _theme.textTheme.bodyText1!.color!.withAlpha(100)))
|
||||
],
|
||||
),
|
||||
const SizedBox(
|
||||
height: 13,
|
||||
),
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
_buildPercentCircle(ss.cpuPercent!, 'CPU', [
|
||||
chart.Series<IndexPercent, int>(
|
||||
id: 'CPU',
|
||||
domainFn: (IndexPercent cpu, _) => cpu.id,
|
||||
measureFn: (IndexPercent cpu, _) => cpu.percent,
|
||||
data: cpuData,
|
||||
)
|
||||
]),
|
||||
_buildPercentCircle(
|
||||
ss.memList![1]! / ss.memList![0]! * 100, 'Mem', [
|
||||
chart.Series<IndexPercent, int>(
|
||||
id: 'Mem',
|
||||
domainFn: (IndexPercent mem, _) => mem.id,
|
||||
measureFn: (IndexPercent mem, _) => mem.percent,
|
||||
data: memData,
|
||||
)
|
||||
]),
|
||||
_buildIOData('Net', 'Conn:\n' + ss.tcp!.maxConn!.toString(),
|
||||
'Fail:\n' + ss.tcp!.fail.toString()),
|
||||
_buildIOData('Disk', 'Total:\n' + rootDisk!.size!,
|
||||
'Used:\n' + rootDisk.usedPercent.toString() + '%')
|
||||
],
|
||||
),
|
||||
],
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildIOData(String title, String up, String down) {
|
||||
final statusTextStyle = TextStyle(
|
||||
fontSize: 11, color: _theme.textTheme.bodyText1!.color!.withAlpha(177));
|
||||
return SizedBox(
|
||||
width: _media.size.width * 0.2,
|
||||
height: _media.size.height * 0.1,
|
||||
child: Stack(
|
||||
children: [
|
||||
Positioned.fill(
|
||||
child: Center(
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
Text(
|
||||
up,
|
||||
style: statusTextStyle,
|
||||
textAlign: TextAlign.center,
|
||||
),
|
||||
const SizedBox(height: 3),
|
||||
Text(
|
||||
down + '\n',
|
||||
style: statusTextStyle,
|
||||
textAlign: TextAlign.center,
|
||||
)
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
Positioned(
|
||||
child: Text(title, textAlign: TextAlign.center),
|
||||
bottom: 0,
|
||||
left: 0,
|
||||
right: 0)
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildPercentCircle(double percent, String title,
|
||||
List<chart.Series<IndexPercent, int>> series) {
|
||||
return SizedBox(
|
||||
width: _media.size.width * 0.2,
|
||||
height: _media.size.height * 0.1,
|
||||
child: Stack(
|
||||
children: [
|
||||
DonutPieChart(series),
|
||||
Positioned.fill(
|
||||
child: Center(
|
||||
child: Text(
|
||||
'${percent.toStringAsFixed(1)}%\n',
|
||||
textAlign: TextAlign.center,
|
||||
),
|
||||
),
|
||||
),
|
||||
Positioned(
|
||||
child: Text(title, textAlign: TextAlign.center),
|
||||
bottom: 0,
|
||||
left: 0,
|
||||
right: 0)
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
@override
|
||||
bool get wantKeepAlive => true;
|
||||
|
||||
@override
|
||||
Future<void> afterFirstLayout(BuildContext context) async {
|
||||
await GetIt.I.allReady();
|
||||
await _serverProvider.loadLocalData();
|
||||
await _serverProvider.refreshData();
|
||||
await _serverProvider.startAutoRefresh();
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user