mirror of
https://github.com/SyncrowIOT/web.git
synced 2025-07-10 07:07:19 +00:00
464 lines
27 KiB
Dart
464 lines
27 KiB
Dart
import 'package:flutter/material.dart';
|
|
import 'package:flutter_bloc/flutter_bloc.dart';
|
|
import 'package:syncrow_web/pages/routiens/bloc/setting_bloc/setting_bloc.dart';
|
|
import 'package:syncrow_web/pages/routiens/bloc/setting_bloc/setting_event.dart';
|
|
import 'package:syncrow_web/pages/routiens/bloc/setting_bloc/setting_state.dart';
|
|
import 'package:syncrow_web/pages/routiens/models/icon_model.dart';
|
|
import 'package:syncrow_web/pages/routiens/view/effective_period_view.dart';
|
|
import 'package:syncrow_web/pages/routiens/widgets/dialog_header.dart';
|
|
import 'package:syncrow_web/utils/color_manager.dart';
|
|
import 'package:flutter/cupertino.dart';
|
|
|
|
class SettingHelper {
|
|
static Future<String?> showSettingDialog(
|
|
{required BuildContext context,
|
|
String? iconId,
|
|
required bool isAutomation}) async {
|
|
return showDialog<String>(
|
|
context: context,
|
|
builder: (BuildContext context) {
|
|
return BlocProvider(
|
|
create: (_) =>
|
|
SettingBloc()..add(InitialEvent(selectedIcon: iconId ?? '')),
|
|
child: AlertDialog(
|
|
contentPadding: EdgeInsets.zero,
|
|
content: BlocBuilder<SettingBloc, SettingState>(
|
|
builder: (context, state) {
|
|
String selectedIcon = '';
|
|
List<IconModel> list = [];
|
|
if (state is TabToRunSettingLoaded) {
|
|
selectedIcon = state.selectedIcon;
|
|
list = state.iconList;
|
|
}
|
|
return Container(
|
|
width: context.read<SettingBloc>().isExpanded ? 800 : 400,
|
|
height: context.read<SettingBloc>().isExpanded && isAutomation
|
|
? 500
|
|
: 300,
|
|
decoration: BoxDecoration(
|
|
color: Colors.white,
|
|
borderRadius: BorderRadius.circular(20),
|
|
),
|
|
padding: const EdgeInsets.only(top: 20),
|
|
child: Column(
|
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
const DialogHeader('Settings'),
|
|
Row(
|
|
mainAxisAlignment: MainAxisAlignment.start,
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
SizedBox(
|
|
width: 400,
|
|
child: isAutomation
|
|
? Column(
|
|
mainAxisSize: MainAxisSize.min,
|
|
children: [
|
|
Container(
|
|
padding: const EdgeInsets.only(
|
|
top: 10,
|
|
left: 10,
|
|
right: 10,
|
|
bottom: 10),
|
|
child: Column(
|
|
children: [
|
|
InkWell(
|
|
onTap: () {},
|
|
child: Row(
|
|
mainAxisAlignment:
|
|
MainAxisAlignment
|
|
.spaceBetween,
|
|
children: [
|
|
Text(
|
|
'Validity',
|
|
style: Theme.of(context)
|
|
.textTheme
|
|
.bodyMedium!
|
|
.copyWith(
|
|
color: ColorsManager
|
|
.textPrimaryColor,
|
|
fontWeight:
|
|
FontWeight
|
|
.w400,
|
|
fontSize: 14),
|
|
),
|
|
const Icon(
|
|
Icons
|
|
.arrow_forward_ios_outlined,
|
|
color: ColorsManager
|
|
.textGray,
|
|
size: 15,
|
|
)
|
|
],
|
|
),
|
|
),
|
|
const SizedBox(
|
|
height: 5,
|
|
),
|
|
const Divider(
|
|
color: ColorsManager.graysColor,
|
|
),
|
|
const SizedBox(
|
|
height: 5,
|
|
),
|
|
InkWell(
|
|
onTap: () {
|
|
BlocProvider.of<SettingBloc>(
|
|
context)
|
|
.add(FetchIcons(
|
|
expanded: !context
|
|
.read<
|
|
SettingBloc>()
|
|
.isExpanded));
|
|
},
|
|
child: Row(
|
|
mainAxisAlignment:
|
|
MainAxisAlignment
|
|
.spaceBetween,
|
|
children: [
|
|
Text(
|
|
'Effective Period',
|
|
style: Theme.of(context)
|
|
.textTheme
|
|
.bodyMedium!
|
|
.copyWith(
|
|
color: ColorsManager
|
|
.textPrimaryColor,
|
|
fontWeight:
|
|
FontWeight
|
|
.w400,
|
|
fontSize: 14),
|
|
),
|
|
const Icon(
|
|
Icons
|
|
.arrow_forward_ios_outlined,
|
|
color: ColorsManager
|
|
.textGray,
|
|
size: 15,
|
|
)
|
|
],
|
|
),
|
|
),
|
|
const SizedBox(
|
|
height: 5,
|
|
),
|
|
const Divider(
|
|
color: ColorsManager.graysColor,
|
|
),
|
|
const SizedBox(
|
|
height: 5,
|
|
),
|
|
Row(
|
|
mainAxisAlignment:
|
|
MainAxisAlignment
|
|
.spaceBetween,
|
|
children: [
|
|
Text(
|
|
'Executed by',
|
|
style: Theme.of(context)
|
|
.textTheme
|
|
.bodyMedium!
|
|
.copyWith(
|
|
color: ColorsManager
|
|
.textPrimaryColor,
|
|
fontWeight:
|
|
FontWeight.w400,
|
|
fontSize: 14),
|
|
),
|
|
Text('Cloud',
|
|
style: Theme.of(context)
|
|
.textTheme
|
|
.bodyMedium!
|
|
.copyWith(
|
|
color:
|
|
ColorsManager
|
|
.textGray,
|
|
fontWeight:
|
|
FontWeight
|
|
.w400,
|
|
fontSize: 14)),
|
|
],
|
|
),
|
|
],
|
|
)),
|
|
],
|
|
)
|
|
: Column(
|
|
mainAxisSize: MainAxisSize.min,
|
|
children: [
|
|
Container(
|
|
padding: const EdgeInsets.only(
|
|
top: 10,
|
|
left: 10,
|
|
right: 10,
|
|
bottom: 10),
|
|
child: Column(
|
|
children: [
|
|
InkWell(
|
|
onTap: () {
|
|
BlocProvider.of<SettingBloc>(
|
|
context)
|
|
.add(FetchIcons(
|
|
expanded: !context
|
|
.read<
|
|
SettingBloc>()
|
|
.isExpanded));
|
|
},
|
|
child: Row(
|
|
mainAxisAlignment:
|
|
MainAxisAlignment
|
|
.spaceBetween,
|
|
children: [
|
|
Text(
|
|
'Icons',
|
|
style: Theme.of(context)
|
|
.textTheme
|
|
.bodyMedium!
|
|
.copyWith(
|
|
color: ColorsManager
|
|
.textPrimaryColor,
|
|
fontWeight:
|
|
FontWeight
|
|
.w400,
|
|
fontSize: 14),
|
|
),
|
|
const Icon(
|
|
Icons
|
|
.arrow_forward_ios_outlined,
|
|
color: ColorsManager
|
|
.textGray,
|
|
size: 15,
|
|
)
|
|
],
|
|
),
|
|
),
|
|
const SizedBox(
|
|
height: 5,
|
|
),
|
|
const Divider(
|
|
color: ColorsManager.graysColor,
|
|
),
|
|
const SizedBox(
|
|
height: 5,
|
|
),
|
|
Row(
|
|
mainAxisAlignment:
|
|
MainAxisAlignment
|
|
.spaceBetween,
|
|
children: [
|
|
Text(
|
|
'Show on devices page',
|
|
style: Theme.of(context)
|
|
.textTheme
|
|
.bodyMedium!
|
|
.copyWith(
|
|
color: ColorsManager
|
|
.textPrimaryColor,
|
|
fontWeight:
|
|
FontWeight.w400,
|
|
fontSize: 14),
|
|
),
|
|
Row(
|
|
mainAxisAlignment:
|
|
MainAxisAlignment.end,
|
|
children: [
|
|
Container(
|
|
height: 30,
|
|
width: 1,
|
|
color: ColorsManager
|
|
.graysColor,
|
|
),
|
|
Transform.scale(
|
|
scale: .8,
|
|
child: CupertinoSwitch(
|
|
value: true,
|
|
onChanged: (value) {},
|
|
applyTheme: true,
|
|
),
|
|
),
|
|
],
|
|
)
|
|
],
|
|
),
|
|
const SizedBox(
|
|
height: 5,
|
|
),
|
|
const Divider(
|
|
color: ColorsManager.graysColor,
|
|
),
|
|
const SizedBox(
|
|
height: 5,
|
|
),
|
|
Row(
|
|
mainAxisAlignment:
|
|
MainAxisAlignment
|
|
.spaceBetween,
|
|
children: [
|
|
Text(
|
|
'Executed by',
|
|
style: Theme.of(context)
|
|
.textTheme
|
|
.bodyMedium!
|
|
.copyWith(
|
|
color: ColorsManager
|
|
.textPrimaryColor,
|
|
fontWeight:
|
|
FontWeight.w400,
|
|
fontSize: 14),
|
|
),
|
|
Text('Cloud',
|
|
style: Theme.of(context)
|
|
.textTheme
|
|
.bodyMedium!
|
|
.copyWith(
|
|
color:
|
|
ColorsManager
|
|
.textGray,
|
|
fontWeight:
|
|
FontWeight
|
|
.w400,
|
|
fontSize: 14)),
|
|
],
|
|
),
|
|
],
|
|
)),
|
|
],
|
|
),
|
|
),
|
|
if (context.read<SettingBloc>().isExpanded &&
|
|
!isAutomation)
|
|
SizedBox(
|
|
width: 400,
|
|
height: 150,
|
|
child: state is LoadingState
|
|
? const Center(
|
|
child: CircularProgressIndicator())
|
|
: GridView.builder(
|
|
gridDelegate:
|
|
const SliverGridDelegateWithFixedCrossAxisCount(
|
|
crossAxisCount: 6,
|
|
crossAxisSpacing: 12,
|
|
mainAxisSpacing: 12,
|
|
),
|
|
shrinkWrap: true,
|
|
itemCount: list.length,
|
|
itemBuilder: (context, index) {
|
|
final iconModel = list[index];
|
|
return SizedBox(
|
|
width: 35,
|
|
height: 35,
|
|
child: InkWell(
|
|
onTap: () {
|
|
BlocProvider.of<SettingBloc>(
|
|
context)
|
|
.add(SelectIcon(
|
|
iconId: iconModel.uuid,
|
|
));
|
|
selectedIcon = iconModel.uuid;
|
|
},
|
|
child: SizedBox(
|
|
child: ClipOval(
|
|
child: Container(
|
|
padding:
|
|
const EdgeInsets.all(1),
|
|
decoration: BoxDecoration(
|
|
border: Border.all(
|
|
color: selectedIcon ==
|
|
iconModel.uuid
|
|
? ColorsManager
|
|
.primaryColorWithOpacity
|
|
: Colors
|
|
.transparent,
|
|
width: 2,
|
|
),
|
|
shape: BoxShape.circle,
|
|
),
|
|
child: Image.memory(
|
|
iconModel.iconBytes,
|
|
),
|
|
),
|
|
),
|
|
),
|
|
),
|
|
);
|
|
},
|
|
)),
|
|
if (context.read<SettingBloc>().isExpanded &&
|
|
isAutomation)
|
|
const SizedBox(
|
|
height: 350,
|
|
width: 400,
|
|
child: EffectivePeriodView())
|
|
],
|
|
),
|
|
Container(
|
|
width: MediaQuery.sizeOf(context).width,
|
|
decoration: const BoxDecoration(
|
|
border: Border(
|
|
top: BorderSide(
|
|
color: ColorsManager.greyColor,
|
|
),
|
|
),
|
|
),
|
|
child: Row(
|
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
children: [
|
|
Expanded(
|
|
child: InkWell(
|
|
onTap: () {
|
|
Navigator.of(context).pop();
|
|
},
|
|
child: Container(
|
|
alignment: AlignmentDirectional.center,
|
|
child: Text(
|
|
'Cancel',
|
|
style: Theme.of(context)
|
|
.textTheme
|
|
.bodyMedium!
|
|
.copyWith(
|
|
color: ColorsManager.textGray,
|
|
),
|
|
),
|
|
),
|
|
),
|
|
),
|
|
Container(
|
|
width: 1,
|
|
height: 50,
|
|
color: ColorsManager.greyColor),
|
|
Expanded(
|
|
child: InkWell(
|
|
onTap: () {
|
|
Navigator.of(context).pop(selectedIcon);
|
|
},
|
|
child: Container(
|
|
alignment: AlignmentDirectional.center,
|
|
child: Text(
|
|
'Confirm',
|
|
style: Theme.of(context)
|
|
.textTheme
|
|
.bodyMedium!
|
|
.copyWith(
|
|
color: ColorsManager
|
|
.primaryColorWithOpacity,
|
|
),
|
|
),
|
|
),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
)
|
|
],
|
|
),
|
|
);
|
|
},
|
|
),
|
|
),
|
|
);
|
|
},
|
|
);
|
|
}
|
|
}
|