449 lines
14 KiB
Dart
449 lines
14 KiB
Dart
import 'package:flutter/material.dart';
|
|
|
|
class ControlScreen extends StatefulWidget {
|
|
const ControlScreen({super.key});
|
|
|
|
@override
|
|
State<ControlScreen> createState() => _ControlScreenState();
|
|
}
|
|
|
|
class _ControlScreenState extends State<ControlScreen> {
|
|
final Color _mainBlueColor = const Color(0xFF002FA7);
|
|
final Color _mainTextColor = const Color(0xFF1C1C1E);
|
|
final Color _subTextColor = const Color(0xFF6A717B);
|
|
final Color _pageBackgroundColor = const Color(0xFFF5F7F9);
|
|
final Color _cardBackgroundColor = Colors.white;
|
|
final Color _accentContainerColor = const Color(0xFFF0F2F5);
|
|
final Color _warningColor = Colors.redAccent;
|
|
|
|
static const BoxShadow _cleanShadow = BoxShadow(
|
|
color: Color.fromRGBO(0, 0, 0, 0.07),
|
|
blurRadius: 8,
|
|
offset: Offset(0, 4),
|
|
spreadRadius: 0,
|
|
);
|
|
|
|
bool _isSecurityLocked = true;
|
|
int _selectedDoorIndex = 0;
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return Scaffold(
|
|
backgroundColor: _pageBackgroundColor,
|
|
appBar: AppBar(
|
|
title: Text(
|
|
'제어 센터',
|
|
style: TextStyle(
|
|
fontWeight: FontWeight.w700,
|
|
fontSize: 18,
|
|
letterSpacing: 0.5,
|
|
color: _mainTextColor,
|
|
),
|
|
),
|
|
backgroundColor: _pageBackgroundColor,
|
|
scrolledUnderElevation: 0,
|
|
elevation: 0,
|
|
centerTitle: false,
|
|
),
|
|
body: SingleChildScrollView(
|
|
padding: const EdgeInsets.symmetric(horizontal: 16.0, vertical: 16.0),
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
_buildSystemStatusCard(),
|
|
const SizedBox(height: 16),
|
|
_buildDoorControlCard(),
|
|
const SizedBox(height: 16),
|
|
_buildControlResultsCard(),
|
|
const SizedBox(height: 16),
|
|
_buildAlertLogsCard(),
|
|
const SizedBox(height: 16),
|
|
_buildSecuritySwitchCard(),
|
|
const SizedBox(height: 24),
|
|
],
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildSystemStatusCard() {
|
|
const double cardContentHeight = 150.0;
|
|
|
|
return Container(
|
|
padding: const EdgeInsets.all(16),
|
|
decoration: BoxDecoration(
|
|
color: _cardBackgroundColor,
|
|
borderRadius: BorderRadius.circular(8),
|
|
boxShadow: [_cleanShadow],
|
|
),
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
Text(
|
|
'보관함 상태',
|
|
style: TextStyle(
|
|
color: _mainTextColor,
|
|
fontSize: 14,
|
|
fontWeight: FontWeight.w600,
|
|
),
|
|
),
|
|
const SizedBox(height: 16),
|
|
SizedBox(
|
|
height: cardContentHeight,
|
|
child: Row(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
Container(
|
|
width: 130,
|
|
height: double.infinity,
|
|
padding: const EdgeInsets.all(20.0),
|
|
decoration: BoxDecoration(
|
|
color: _accentContainerColor,
|
|
borderRadius: BorderRadius.circular(8),
|
|
),
|
|
child: Image.asset(
|
|
'assets/images/top.png',
|
|
fit: BoxFit.contain,
|
|
),
|
|
),
|
|
const SizedBox(width: 16),
|
|
Expanded(
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
Text(
|
|
'NOW',
|
|
style: TextStyle(
|
|
color: _subTextColor,
|
|
fontSize: 11,
|
|
fontWeight: FontWeight.bold,
|
|
),
|
|
),
|
|
const SizedBox(height: 8),
|
|
Expanded(
|
|
child: _buildStatusButton(
|
|
text: '사용 중',
|
|
textColor: _mainBlueColor,
|
|
bgColor: _accentContainerColor,
|
|
),
|
|
),
|
|
const SizedBox(height: 10),
|
|
Expanded(
|
|
child: _buildStatusButton(
|
|
text: '센서 경고 : 문 열림',
|
|
textColor: _warningColor,
|
|
bgColor: _accentContainerColor,
|
|
isError: true,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildStatusButton({
|
|
required String text,
|
|
required Color textColor,
|
|
required Color bgColor,
|
|
bool isError = false,
|
|
}) {
|
|
return Container(
|
|
width: double.infinity,
|
|
alignment: Alignment.center,
|
|
decoration: BoxDecoration(
|
|
color: bgColor,
|
|
borderRadius: BorderRadius.circular(8),
|
|
),
|
|
child: Text(
|
|
text,
|
|
textAlign: TextAlign.center,
|
|
style: TextStyle(
|
|
color: textColor,
|
|
fontWeight: FontWeight.bold,
|
|
fontSize: isError ? 12 : 14,
|
|
height: 1.2,
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildDoorControlCard() {
|
|
return Container(
|
|
padding: const EdgeInsets.all(16),
|
|
decoration: BoxDecoration(
|
|
color: _cardBackgroundColor,
|
|
borderRadius: BorderRadius.circular(8),
|
|
boxShadow: [_cleanShadow],
|
|
),
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
Text(
|
|
'보관함 문 제어',
|
|
style: TextStyle(
|
|
color: _mainTextColor,
|
|
fontSize: 14,
|
|
fontWeight: FontWeight.w600,
|
|
),
|
|
),
|
|
const SizedBox(height: 16),
|
|
Row(
|
|
children: [
|
|
_buildDoorButton(0, 'OPEN'),
|
|
const SizedBox(width: 12),
|
|
_buildDoorButton(1, 'CLOSE'),
|
|
const SizedBox(width: 12),
|
|
_buildDoorButton(2, 'LOCK'),
|
|
],
|
|
),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildDoorButton(int index, String text) {
|
|
final bool isSelected = _selectedDoorIndex == index;
|
|
|
|
return Expanded(
|
|
child: GestureDetector(
|
|
onTap: () {
|
|
setState(() {
|
|
_selectedDoorIndex = index;
|
|
});
|
|
},
|
|
child: Container(
|
|
height: 80,
|
|
decoration: BoxDecoration(
|
|
color: isSelected ? _mainBlueColor : _accentContainerColor,
|
|
borderRadius: BorderRadius.circular(8),
|
|
),
|
|
child: Center(
|
|
child: Text(
|
|
text,
|
|
style: TextStyle(
|
|
color: isSelected ? Colors.white : _mainTextColor,
|
|
fontWeight: FontWeight.bold,
|
|
fontSize: 18,
|
|
),
|
|
),
|
|
),
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildControlResultsCard() {
|
|
return Container(
|
|
padding: const EdgeInsets.all(16),
|
|
decoration: BoxDecoration(
|
|
color: _cardBackgroundColor,
|
|
borderRadius: BorderRadius.circular(8),
|
|
boxShadow: [_cleanShadow],
|
|
),
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
Text(
|
|
'실시간 상태',
|
|
style: TextStyle(
|
|
color: _mainTextColor,
|
|
fontSize: 14,
|
|
fontWeight: FontWeight.w600,
|
|
),
|
|
),
|
|
const SizedBox(height: 16),
|
|
Container(
|
|
padding: const EdgeInsets.all(12),
|
|
decoration: BoxDecoration(
|
|
color: _accentContainerColor,
|
|
borderRadius: BorderRadius.circular(6),
|
|
),
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
Row(
|
|
children: [
|
|
Icon(Icons.warning_amber_rounded,
|
|
color: _warningColor, size: 16),
|
|
const SizedBox(width: 8),
|
|
Expanded(
|
|
child: RichText(
|
|
text: TextSpan(
|
|
children: [
|
|
TextSpan(
|
|
text: '센서 경고 : ',
|
|
style: TextStyle(
|
|
color: _warningColor,
|
|
fontWeight: FontWeight.bold,
|
|
fontSize: 12,
|
|
),
|
|
),
|
|
TextSpan(
|
|
text: '문 열림',
|
|
style: TextStyle(
|
|
color: _warningColor,
|
|
fontSize: 12,
|
|
fontWeight: FontWeight.bold,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
const SizedBox(height: 12),
|
|
ClipRRect(
|
|
borderRadius: BorderRadius.circular(4),
|
|
child: LinearProgressIndicator(
|
|
value: 0.6,
|
|
backgroundColor: _pageBackgroundColor,
|
|
valueColor: AlwaysStoppedAnimation<Color>(_warningColor),
|
|
minHeight: 6,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildAlertLogsCard() {
|
|
return Container(
|
|
padding: const EdgeInsets.all(16),
|
|
decoration: BoxDecoration(
|
|
color: _cardBackgroundColor,
|
|
borderRadius: BorderRadius.circular(8),
|
|
boxShadow: [_cleanShadow],
|
|
),
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
Text(
|
|
'시스템 기록',
|
|
style: TextStyle(
|
|
color: _mainTextColor,
|
|
fontSize: 14,
|
|
fontWeight: FontWeight.w600,
|
|
),
|
|
),
|
|
const SizedBox(height: 16),
|
|
Container(
|
|
padding: const EdgeInsets.all(12),
|
|
decoration: BoxDecoration(
|
|
color: _accentContainerColor,
|
|
borderRadius: BorderRadius.circular(6),
|
|
),
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
Row(
|
|
children: [
|
|
Icon(Icons.warning_amber_rounded,
|
|
color: _warningColor, size: 14),
|
|
const SizedBox(width: 8),
|
|
Text(
|
|
'1:50 PM - 센서 경고 : 문 열림',
|
|
style: TextStyle(
|
|
color: _mainTextColor,
|
|
fontSize: 12,
|
|
fontWeight: FontWeight.bold,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
const SizedBox(height: 8),
|
|
Row(
|
|
children: [
|
|
Icon(Icons.bookmark, color: _subTextColor, size: 14),
|
|
const SizedBox(width: 8),
|
|
Text(
|
|
'2:02 PM - UV LED 작동',
|
|
style: TextStyle(
|
|
color: _mainTextColor,
|
|
fontSize: 12,
|
|
fontWeight: FontWeight.bold,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
],
|
|
),
|
|
),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildSecuritySwitchCard() {
|
|
return Container(
|
|
padding: const EdgeInsets.all(16),
|
|
decoration: BoxDecoration(
|
|
color: _cardBackgroundColor,
|
|
borderRadius: BorderRadius.circular(8),
|
|
boxShadow: [_cleanShadow],
|
|
),
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
Text(
|
|
'도난 방지 잠금',
|
|
style: TextStyle(
|
|
color: _mainTextColor,
|
|
fontSize: 14,
|
|
fontWeight: FontWeight.w600,
|
|
),
|
|
),
|
|
const SizedBox(height: 16),
|
|
Container(
|
|
padding:
|
|
const EdgeInsets.symmetric(horizontal: 22, vertical: 16),
|
|
decoration: BoxDecoration(
|
|
color: _accentContainerColor,
|
|
borderRadius: BorderRadius.circular(6),
|
|
),
|
|
child: Row(
|
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
children: [
|
|
Text(
|
|
_isSecurityLocked
|
|
? 'ON'
|
|
: 'OFF',
|
|
style: TextStyle(
|
|
color: _mainTextColor,
|
|
fontSize: 16,
|
|
fontWeight: FontWeight.bold,
|
|
),
|
|
),
|
|
Transform.scale(
|
|
scale: 1.1,
|
|
child: Switch(
|
|
value: _isSecurityLocked,
|
|
onChanged: (val) {
|
|
setState(() {
|
|
_isSecurityLocked = val;
|
|
});
|
|
},
|
|
activeThumbColor: _mainBlueColor,
|
|
activeTrackColor: _mainBlueColor.withOpacity(0.5),
|
|
inactiveThumbColor: Colors.white,
|
|
inactiveTrackColor: _accentContainerColor,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
}
|