mirror of
https://github.com/SyncrowIOT/web.git
synced 2025-07-10 07:07:19 +00:00
432 lines
26 KiB
Dart
432 lines
26 KiB
Dart
import 'package:flutter/material.dart';
|
|
import 'package:flutter_bloc/flutter_bloc.dart';
|
|
import 'package:syncrow_web/pages/routines/bloc/effective_period/effect_period_bloc.dart';
|
|
import 'package:syncrow_web/pages/routines/bloc/effective_period/effect_period_event.dart';
|
|
import 'package:syncrow_web/pages/routines/bloc/effective_period/effect_period_state.dart';
|
|
import 'package:syncrow_web/pages/routines/bloc/routine_bloc/routine_bloc.dart';
|
|
import 'package:syncrow_web/pages/routines/bloc/setting_bloc/setting_bloc.dart';
|
|
import 'package:syncrow_web/pages/routines/bloc/setting_bloc/setting_event.dart';
|
|
import 'package:syncrow_web/pages/routines/bloc/setting_bloc/setting_state.dart';
|
|
import 'package:syncrow_web/pages/routines/models/create_scene_and_autoamtion/create_automation_model.dart';
|
|
import 'package:syncrow_web/pages/routines/models/icon_model.dart';
|
|
import 'package:syncrow_web/pages/routines/view/effective_period_view.dart';
|
|
import 'package:syncrow_web/pages/routines/widgets/delete_scene.dart';
|
|
import 'package:syncrow_web/pages/routines/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,
|
|
}) async {
|
|
return showDialog<String>(
|
|
context: context,
|
|
builder: (BuildContext context) {
|
|
final isAutomation = context.read<RoutineBloc>().state.isAutomation;
|
|
final effectiveTime = context.read<RoutineBloc>().state.effectiveTime;
|
|
|
|
return MultiBlocProvider(
|
|
providers: [
|
|
if (effectiveTime != null)
|
|
BlocProvider(
|
|
create: (_) => EffectPeriodBloc()..add(InitialEffectPeriodEvent(effectiveTime)),
|
|
),
|
|
if (effectiveTime == null)
|
|
BlocProvider(
|
|
create: (_) => EffectPeriodBloc(),
|
|
),
|
|
BlocProvider(
|
|
create: (_) => SettingBloc()..add(InitialEvent(selectedIcon: iconId ?? ''))),
|
|
],
|
|
child: AlertDialog(
|
|
contentPadding: EdgeInsets.zero,
|
|
content: BlocBuilder<EffectPeriodBloc, EffectPeriodState>(
|
|
builder: (context, effectPeriodState) {
|
|
return BlocBuilder<SettingBloc, SettingState>(
|
|
builder: (context, settingState) {
|
|
String selectedIcon = '';
|
|
List<IconModel> list = [];
|
|
if (settingState is TabToRunSettingLoaded) {
|
|
selectedIcon = settingState.selectedIcon;
|
|
list = settingState.iconList;
|
|
}
|
|
return Container(
|
|
width: context.read<SettingBloc>().isExpanded ? 800 : 400,
|
|
height: context.read<SettingBloc>().isExpanded && isAutomation ? 500 : 350,
|
|
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)),
|
|
],
|
|
),
|
|
if (context.read<RoutineBloc>().state.isUpdate ??
|
|
false)
|
|
const DeleteSceneWidget()
|
|
],
|
|
)),
|
|
],
|
|
)
|
|
: 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<RoutineBloc>().state.isUpdate ??
|
|
false)
|
|
const DeleteSceneWidget()
|
|
],
|
|
)),
|
|
],
|
|
),
|
|
),
|
|
if (context.read<SettingBloc>().isExpanded && !isAutomation)
|
|
SizedBox(
|
|
width: 400,
|
|
height: 150,
|
|
child: settingState 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: () {
|
|
if (isAutomation) {
|
|
BlocProvider.of<RoutineBloc>(context).add(
|
|
EffectiveTimePeriodEvent(EffectiveTime(
|
|
start: effectPeriodState.customStartTime!,
|
|
end: effectPeriodState.customEndTime!,
|
|
loops: effectPeriodState.selectedDaysBinary)));
|
|
Navigator.of(context).pop();
|
|
} else {
|
|
Navigator.of(context).pop(selectedIcon);
|
|
}
|
|
},
|
|
child: Container(
|
|
alignment: AlignmentDirectional.center,
|
|
child: Text(
|
|
'Confirm',
|
|
style: Theme.of(context).textTheme.bodyMedium!.copyWith(
|
|
color: ColorsManager.primaryColorWithOpacity,
|
|
),
|
|
),
|
|
),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
)
|
|
],
|
|
),
|
|
);
|
|
},
|
|
);
|
|
}),
|
|
),
|
|
);
|
|
},
|
|
);
|
|
}
|
|
}
|