push basic layouts and shared widgets

This commit is contained in:
ashrafzarkanisala
2024-08-22 00:09:42 +03:00
parent f773c9e52c
commit e576fb3b47
14 changed files with 328 additions and 164 deletions

View File

View File

@ -5,8 +5,6 @@ import 'package:syncrow_web/pages/auth/bloc/auth_bloc.dart';
import 'package:syncrow_web/pages/auth/view/login_page.dart'; import 'package:syncrow_web/pages/auth/view/login_page.dart';
import 'package:syncrow_web/pages/home/bloc/home_bloc.dart'; import 'package:syncrow_web/pages/home/bloc/home_bloc.dart';
import 'package:syncrow_web/pages/home/view/home_page.dart'; import 'package:syncrow_web/pages/home/view/home_page.dart';
import 'package:syncrow_web/pages/visitor_password/view/add_device_dialog.dart';
import 'package:syncrow_web/pages/visitor_password/view/visitor_password_dialog.dart';
import 'package:syncrow_web/services/locator.dart'; import 'package:syncrow_web/services/locator.dart';
import 'package:syncrow_web/utils/color_manager.dart'; import 'package:syncrow_web/utils/color_manager.dart';
@ -32,40 +30,38 @@ class MyApp extends StatelessWidget {
BlocProvider(create: (context) => HomeBloc()), BlocProvider(create: (context) => HomeBloc()),
], ],
child: MaterialApp( child: MaterialApp(
debugShowCheckedModeBanner: false, // Hide debug banner debugShowCheckedModeBanner: false, // Hide debug banner
scrollBehavior: const MaterialScrollBehavior().copyWith( scrollBehavior: const MaterialScrollBehavior().copyWith(
dragDevices: { dragDevices: {
PointerDeviceKind.mouse, PointerDeviceKind.mouse,
PointerDeviceKind.touch, PointerDeviceKind.touch,
PointerDeviceKind.stylus, PointerDeviceKind.stylus,
PointerDeviceKind.unknown, PointerDeviceKind.unknown,
}, },
), ),
theme: ThemeData( theme: ThemeData(
textTheme: const TextTheme( textTheme: const TextTheme(
bodySmall: TextStyle( bodySmall: TextStyle(
fontSize: 13, fontSize: 13,
color: ColorsManager.whiteColors, color: ColorsManager.whiteColors,
fontWeight: FontWeight.bold), fontWeight: FontWeight.bold),
bodyMedium: TextStyle(color: Colors.black87, fontSize: 14), bodyMedium: TextStyle(color: Colors.black87, fontSize: 14),
bodyLarge: TextStyle(fontSize: 16, color: Colors.white), bodyLarge: TextStyle(fontSize: 16, color: Colors.white),
headlineSmall: TextStyle(color: Colors.black87, fontSize: 18), headlineSmall: TextStyle(color: Colors.black87, fontSize: 18),
headlineMedium: TextStyle(color: Colors.black87, fontSize: 20), headlineMedium: TextStyle(color: Colors.black87, fontSize: 20),
headlineLarge: TextStyle( headlineLarge: TextStyle(
color: Colors.white, color: Colors.white,
fontSize: 24, fontSize: 24,
fontWeight: FontWeight.bold, fontWeight: FontWeight.bold,
),
), ),
colorScheme: ColorScheme.fromSeed(
seedColor: Colors.deepPurple), // Set up color scheme
useMaterial3: true, // Enable Material 3
), ),
// home: AddDeviceDialog()
// home:isLoggedIn == 'Success' ? colorScheme: ColorScheme.fromSeed(
home: const HomePage() seedColor: Colors.deepPurple), // Set up color scheme
// : const LoginPage(), useMaterial3: true, // Enable Material 3
)); ),
// home: AddDeviceDialog()
home: isLoggedIn == 'Success' ? const HomePage() : const LoginPage(),
));
} }
} }

View File

@ -5,7 +5,7 @@ import 'package:syncrow_web/pages/access_management/bloc/access_event.dart';
import 'package:syncrow_web/pages/access_management/bloc/access_state.dart'; import 'package:syncrow_web/pages/access_management/bloc/access_state.dart';
import 'package:syncrow_web/pages/common/custom_table.dart'; import 'package:syncrow_web/pages/common/custom_table.dart';
import 'package:syncrow_web/pages/common/date_time_widget.dart'; import 'package:syncrow_web/pages/common/date_time_widget.dart';
import 'package:syncrow_web/pages/common/default_button.dart'; import 'package:syncrow_web/pages/common/buttons/default_button.dart';
import 'package:syncrow_web/pages/common/filter/filter_widget.dart'; import 'package:syncrow_web/pages/common/filter/filter_widget.dart';
import 'package:syncrow_web/pages/visitor_password/view/visitor_password_dialog.dart'; import 'package:syncrow_web/pages/visitor_password/view/visitor_password_dialog.dart';
import 'package:syncrow_web/utils/color_manager.dart'; import 'package:syncrow_web/utils/color_manager.dart';

View File

@ -5,7 +5,7 @@ import 'package:syncrow_web/pages/auth/bloc/auth_bloc.dart';
import 'package:syncrow_web/pages/auth/bloc/auth_event.dart'; import 'package:syncrow_web/pages/auth/bloc/auth_event.dart';
import 'package:syncrow_web/pages/auth/bloc/auth_state.dart'; import 'package:syncrow_web/pages/auth/bloc/auth_state.dart';
import 'package:syncrow_web/pages/auth/model/region_model.dart'; import 'package:syncrow_web/pages/auth/model/region_model.dart';
import 'package:syncrow_web/pages/common/default_button.dart'; import 'package:syncrow_web/pages/common/buttons/default_button.dart';
import 'package:syncrow_web/pages/common/first_layer.dart'; import 'package:syncrow_web/pages/common/first_layer.dart';
import 'package:syncrow_web/utils/color_manager.dart'; import 'package:syncrow_web/utils/color_manager.dart';
import 'package:syncrow_web/utils/constants/assets.dart'; import 'package:syncrow_web/utils/constants/assets.dart';

View File

@ -8,7 +8,7 @@ import 'package:syncrow_web/pages/auth/bloc/auth_event.dart';
import 'package:syncrow_web/pages/auth/bloc/auth_state.dart'; import 'package:syncrow_web/pages/auth/bloc/auth_state.dart';
import 'package:syncrow_web/pages/auth/model/region_model.dart'; import 'package:syncrow_web/pages/auth/model/region_model.dart';
import 'package:syncrow_web/pages/auth/view/forget_password_page.dart'; import 'package:syncrow_web/pages/auth/view/forget_password_page.dart';
import 'package:syncrow_web/pages/common/default_button.dart'; import 'package:syncrow_web/pages/common/buttons/default_button.dart';
import 'package:syncrow_web/utils/color_manager.dart'; import 'package:syncrow_web/utils/color_manager.dart';
import 'package:syncrow_web/utils/constants/assets.dart'; import 'package:syncrow_web/utils/constants/assets.dart';
import 'package:syncrow_web/pages/home/view/home_page.dart'; import 'package:syncrow_web/pages/home/view/home_page.dart';

View File

@ -9,7 +9,7 @@ import 'package:syncrow_web/pages/auth/bloc/auth_event.dart';
import 'package:syncrow_web/pages/auth/bloc/auth_state.dart'; import 'package:syncrow_web/pages/auth/bloc/auth_state.dart';
import 'package:syncrow_web/pages/auth/model/region_model.dart'; import 'package:syncrow_web/pages/auth/model/region_model.dart';
import 'package:syncrow_web/pages/auth/view/forget_password_page.dart'; import 'package:syncrow_web/pages/auth/view/forget_password_page.dart';
import 'package:syncrow_web/pages/common/default_button.dart'; import 'package:syncrow_web/pages/common/buttons/default_button.dart';
import 'package:syncrow_web/pages/common/first_layer.dart'; import 'package:syncrow_web/pages/common/first_layer.dart';
import 'package:syncrow_web/utils/color_manager.dart'; import 'package:syncrow_web/utils/color_manager.dart';
import 'package:syncrow_web/utils/constants/assets.dart'; import 'package:syncrow_web/utils/constants/assets.dart';

View File

@ -0,0 +1,71 @@
import 'package:flutter/material.dart';
import 'package:syncrow_web/pages/common/buttons/default_button.dart';
import 'package:syncrow_web/utils/style.dart';
import 'package:syncrow_web/utils/color_manager.dart';
class SearchResetButtons extends StatelessWidget {
const SearchResetButtons({
super.key,
required this.onSearch,
required this.onReset,
});
final VoidCallback onSearch;
final VoidCallback onReset;
@override
Widget build(BuildContext context) {
return Row(
children: [
Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
const SizedBox(height: 25),
Center(
child: Container(
height: 43,
width: 100,
decoration: containerDecoration,
child: Center(
child: DefaultButton(
onPressed: onSearch,
borderRadius: 9,
child: const Text('Search'),
),
),
),
),
],
),
const SizedBox(width: 10),
Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
const SizedBox(height: 25),
Center(
child: Container(
height: 43,
width: 100,
decoration: containerDecoration,
child: Center(
child: DefaultButton(
backgroundColor: ColorsManager.whiteColors,
borderRadius: 9,
child: Text(
'Reset',
style: Theme.of(context)
.textTheme
.bodySmall!
.copyWith(color: Colors.black),
),
onPressed: onReset,
),
),
),
),
],
),
],
);
}
}

View File

@ -0,0 +1,103 @@
import 'package:flutter/material.dart';
import 'package:syncrow_web/core/extension/build_context_x.dart';
class StatefulTextField extends StatefulWidget {
const StatefulTextField({
super.key,
required this.title,
this.hintText = 'Please enter',
required this.width,
this.elevation = 0,
});
final String title;
final String hintText;
final double width;
final double elevation;
@override
State<StatefulTextField> createState() => _StatefulTextFieldState();
}
class _StatefulTextFieldState extends State<StatefulTextField> {
late TextEditingController _controller;
@override
void initState() {
super.initState();
_controller = TextEditingController();
}
@override
void dispose() {
_controller.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
return CustomTextField(
title: widget.title,
controller: _controller,
hintText: widget.hintText,
width: widget.width,
elevation: widget.elevation,
);
}
}
class CustomTextField extends StatelessWidget {
const CustomTextField({
super.key,
required this.title,
required this.controller,
this.hintText = 'Please enter',
required this.width,
this.elevation = 0,
});
final String title;
final TextEditingController controller;
final String hintText;
final double width;
final double elevation;
@override
Widget build(BuildContext context) {
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.start,
children: [
Text(
title,
style: context.textTheme.bodyMedium!.copyWith(
fontWeight: FontWeight.w600,
color: const Color(0xff000000),
),
),
const SizedBox(height: 8),
Material(
elevation: elevation,
borderRadius: BorderRadius.circular(8),
child: Container(
width: width,
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(8),
),
child: TextFormField(
controller: controller,
style: const TextStyle(color: Colors.black),
decoration: InputDecoration(
hintText: hintText,
contentPadding:
const EdgeInsets.symmetric(horizontal: 12, vertical: 10),
border: InputBorder.none,
),
),
),
),
],
);
}
}

View File

@ -1,9 +1,11 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:syncrow_web/core/extension/build_context_x.dart'; import 'package:syncrow_web/core/extension/build_context_x.dart';
import 'package:syncrow_web/pages/common/buttons/search_reset_buttons.dart';
import 'package:syncrow_web/pages/common/filter/filter_widget.dart'; import 'package:syncrow_web/pages/common/filter/filter_widget.dart';
import 'package:syncrow_web/utils/style.dart'; import 'package:syncrow_web/pages/common/text_field/custom_text_field.dart';
import 'package:syncrow_web/utils/helpers/responsice_layout_helper/responsive_layout_helper.dart';
class DeviceManagementBody extends StatelessWidget { class DeviceManagementBody extends StatelessWidget with HelperResponsiveLayout {
const DeviceManagementBody({super.key}); const DeviceManagementBody({super.key});
@override @override
@ -24,32 +26,60 @@ class DeviceManagementBody extends StatelessWidget {
const SizedBox( const SizedBox(
height: 20, height: 20,
), ),
Wrap( if (isLargeScreenSize(context)) ...[
children: [ Row(
Column( children: [
crossAxisAlignment: CrossAxisAlignment.start, const StatefulTextField(
mainAxisAlignment: MainAxisAlignment.start, title: "Community",
children: [ width: 200,
Text( elevation: 2,
'Community', ),
style: context.textTheme.bodyMedium!.copyWith( const SizedBox(width: 20),
fontWeight: FontWeight.w400, const StatefulTextField(
color: const Color(0xff000000)), title: "Unit Name",
), width: 200,
Container( elevation: 2,
width: context.screenWidth * 0.15, ),
margin: const EdgeInsets.only(top: 8), const SizedBox(width: 20),
decoration: containerDecoration, const StatefulTextField(
child: TextFormField( title: "Device Name / Product Name",
//: accessBloc.passwordName, width: 300,
style: const TextStyle(color: Colors.black), elevation: 2,
decoration: textBoxDecoration()! ),
.copyWith(hintText: 'Please enter'), const SizedBox(width: 20),
)), SearchResetButtons(
], onSearch: () {},
), onReset: () {},
], ),
) ],
),
] else ...[
Wrap(
spacing: 20,
runSpacing: 10,
children: [
const StatefulTextField(
title: "Community",
width: 200,
elevation: 2,
),
const StatefulTextField(
title: "Unit Name",
width: 200,
elevation: 2,
),
const StatefulTextField(
title: "Device Name / Product Name",
width: 300,
elevation: 2,
),
SearchResetButtons(
onSearch: () {},
onReset: () {},
),
],
),
],
], ],
), ),
); );

View File

@ -1,9 +1,10 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart'; import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:flutter_svg/flutter_svg.dart'; import 'package:flutter_svg/flutter_svg.dart';
import 'package:syncrow_web/pages/common/buttons/search_reset_buttons.dart';
import 'package:syncrow_web/pages/common/custom_table.dart'; import 'package:syncrow_web/pages/common/custom_table.dart';
import 'package:syncrow_web/pages/common/custom_web_textfield.dart'; import 'package:syncrow_web/pages/common/text_field/custom_web_textfield.dart';
import 'package:syncrow_web/pages/common/default_button.dart'; import 'package:syncrow_web/pages/common/buttons/default_button.dart';
import 'package:syncrow_web/pages/visitor_password/bloc/visitor_password_bloc.dart'; import 'package:syncrow_web/pages/visitor_password/bloc/visitor_password_bloc.dart';
import 'package:syncrow_web/pages/visitor_password/bloc/visitor_password_event.dart'; import 'package:syncrow_web/pages/visitor_password/bloc/visitor_password_event.dart';
import 'package:syncrow_web/pages/visitor_password/bloc/visitor_password_state.dart'; import 'package:syncrow_web/pages/visitor_password/bloc/visitor_password_state.dart';
@ -12,7 +13,6 @@ import 'package:syncrow_web/utils/constants/assets.dart';
import 'package:syncrow_web/utils/constants/const.dart'; import 'package:syncrow_web/utils/constants/const.dart';
import 'package:syncrow_web/utils/style.dart'; import 'package:syncrow_web/utils/style.dart';
class AddDeviceDialog extends StatelessWidget { class AddDeviceDialog extends StatelessWidget {
const AddDeviceDialog({super.key}); const AddDeviceDialog({super.key});
@override @override
@ -27,8 +27,8 @@ class AddDeviceDialog extends StatelessWidget {
backgroundColor: Colors.white, backgroundColor: Colors.white,
title: const Text('Add Accessible Device'), title: const Text('Add Accessible Device'),
content: Container( content: Container(
height: MediaQuery.of(context).size.height/1.7, height: MediaQuery.of(context).size.height / 1.7,
width: MediaQuery.of(context).size.width/2, width: MediaQuery.of(context).size.width / 2,
child: Padding( child: Padding(
padding: const EdgeInsets.all(10.0), padding: const EdgeInsets.all(10.0),
child: Column( child: Column(
@ -36,11 +36,10 @@ class AddDeviceDialog extends StatelessWidget {
Container( Container(
width: size.width, width: size.width,
padding: EdgeInsets.all(15), padding: EdgeInsets.all(15),
decoration:containerDecoration.copyWith( decoration: containerDecoration.copyWith(
color: ColorsManager.worningColor, color: ColorsManager.worningColor,
border: Border.all(color: Color(0xffFFD22F)), border: Border.all(color: Color(0xffFFD22F)),
boxShadow: [] boxShadow: []),
),
child: Row( child: Row(
children: [ children: [
SizedBox( SizedBox(
@ -50,12 +49,15 @@ class AddDeviceDialog extends StatelessWidget {
width: 15, width: 15,
), ),
), ),
SizedBox(width: 10,), SizedBox(
width: 10,
),
Text('Only online accessible devices can be added'), Text('Only online accessible devices can be added'),
], ],
) )),
SizedBox(
height: 20,
), ),
SizedBox(height: 20,),
Row( Row(
mainAxisAlignment: MainAxisAlignment.center, mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center, crossAxisAlignment: CrossAxisAlignment.center,
@ -89,93 +91,55 @@ class AddDeviceDialog extends StatelessWidget {
description: '', description: '',
), ),
), ),
const SizedBox(width: 10), const SizedBox(width: 10),
Column( SearchResetButtons(
crossAxisAlignment: CrossAxisAlignment.center, onSearch: () {
children: [ visitorBloc.filterDevices();
const SizedBox(height: 25), },
Center( onReset: () {
child: Container( visitorBloc.deviceNameController.clear();
height: 43, visitorBloc.deviceIdController.clear();
width: 100, visitorBloc.unitNameController.clear();
decoration: containerDecoration, visitorBloc.add(FetchDevice());
child: Center( },
child: DefaultButton(
onPressed: () {
visitorBloc.filterDevices(); // Call filter function
},
borderRadius: 9,
child: const Text('Search'),
),
),
),
),
],
), ),
const SizedBox(width: 10),
Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
const SizedBox(height: 25),
Center(
child: Container(
height: 43,
width: 100,
decoration: containerDecoration,
child: Center(
child: DefaultButton(
backgroundColor: ColorsManager.whiteColors,
borderRadius: 9,
child: Text(
'Reset',
style: Theme.of(context).textTheme.bodySmall!.copyWith(color: Colors.black),
),
onPressed: () {
visitorBloc.deviceNameController.clear();
visitorBloc.deviceIdController.clear();
visitorBloc.unitNameController.clear();
visitorBloc.add(FetchDevice()); // Reset to original list
},
),
),
),
),
],
),
], ],
), ),
const SizedBox(height: 20), const SizedBox(height: 20),
Expanded( Expanded(
child: state is TableLoaded child: state is TableLoaded
? DynamicTable( ? DynamicTable(
cellDecoration: containerDecoration, cellDecoration: containerDecoration,
selectAll: (p0) { selectAll: (p0) {
visitorBloc.selectedDeviceIds.clear(); visitorBloc.selectedDeviceIds.clear();
for (var item in state.data) { for (var item in state.data) {
visitorBloc.add(SelectDeviceEvent(item.uuid)); visitorBloc
} .add(SelectDeviceEvent(item.uuid));
}, }
onRowCheckboxChanged: (index, isSelected) { },
final deviceId = state.data[index].uuid; onRowCheckboxChanged: (index, isSelected) {
visitorBloc.add(SelectDeviceEvent(deviceId)); final deviceId = state.data[index].uuid;
}, visitorBloc.add(SelectDeviceEvent(deviceId));
withCheckBox: true, },
size: size*0.5, withCheckBox: true,
headers: const [ 'Device Name', 'Device ID', 'Access Type', 'Unit Name', 'Status'], size: size * 0.5,
data: state.data.map((item) { headers: const [
return [ 'Device Name',
item.name.toString(), 'Device ID',
item.uuid.toString(), 'Access Type',
item.productType.toString(), 'Unit Name',
'', 'Status'
item.online.value.toString(), ],
]; data: state.data.map((item) {
}).toList(), return [
) item.name.toString(),
item.uuid.toString(),
item.productType.toString(),
'',
item.online.value.toString(),
];
}).toList(),
)
: const Center(child: CircularProgressIndicator())) : const Center(child: CircularProgressIndicator()))
], ],
), ),
@ -201,7 +165,7 @@ class AddDeviceDialog extends StatelessWidget {
Container( Container(
decoration: containerDecoration, decoration: containerDecoration,
width: size.width * 0.2, width: size.width * 0.2,
child: DefaultButton( child: DefaultButton(
onPressed: () { onPressed: () {
Navigator.of(context).pop(); // Close the dialog Navigator.of(context).pop(); // Close the dialog
}, },

View File

@ -1,9 +1,9 @@
import 'package:flutter/cupertino.dart'; import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart'; import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:syncrow_web/pages/common/custom_web_textfield.dart'; import 'package:syncrow_web/pages/common/text_field/custom_web_textfield.dart';
import 'package:syncrow_web/pages/common/date_time_widget.dart'; import 'package:syncrow_web/pages/common/date_time_widget.dart';
import 'package:syncrow_web/pages/common/default_button.dart'; import 'package:syncrow_web/pages/common/buttons/default_button.dart';
import 'package:syncrow_web/pages/common/info_dialog.dart'; import 'package:syncrow_web/pages/common/info_dialog.dart';
import 'package:syncrow_web/pages/visitor_password/bloc/visitor_password_bloc.dart'; import 'package:syncrow_web/pages/visitor_password/bloc/visitor_password_bloc.dart';
import 'package:syncrow_web/pages/visitor_password/bloc/visitor_password_event.dart'; import 'package:syncrow_web/pages/visitor_password/bloc/visitor_password_event.dart';

View File

@ -7,10 +7,10 @@ mixin HelperResponsiveLayout {
bool isMediumScreenSize(BuildContext context) { bool isMediumScreenSize(BuildContext context) {
return MediaQuery.of(context).size.width >= 700 && return MediaQuery.of(context).size.width >= 700 &&
MediaQuery.of(context).size.width < 1200; MediaQuery.of(context).size.width < 1300;
} }
bool isLargeScreenSize(BuildContext context) { bool isLargeScreenSize(BuildContext context) {
return MediaQuery.of(context).size.width >= 1200; return MediaQuery.of(context).size.width >= 1300;
} }
} }