diff --git a/assets/images/Integrations_icon.svg b/assets/images/Integrations_icon.svg
new file mode 100644
index 00000000..e3ef7e16
--- /dev/null
+++ b/assets/images/Integrations_icon.svg
@@ -0,0 +1,9 @@
+
diff --git a/assets/images/access_icon.svg b/assets/images/access_icon.svg
new file mode 100644
index 00000000..d04fa641
--- /dev/null
+++ b/assets/images/access_icon.svg
@@ -0,0 +1,3 @@
+
diff --git a/assets/images/asset_icon.svg b/assets/images/asset_icon.svg
new file mode 100644
index 00000000..b7649b97
--- /dev/null
+++ b/assets/images/asset_icon.svg
@@ -0,0 +1,32 @@
+
diff --git a/assets/images/construction_Icon.svg b/assets/images/construction_Icon.svg
new file mode 100644
index 00000000..7efad965
--- /dev/null
+++ b/assets/images/construction_Icon.svg
@@ -0,0 +1,31 @@
+
diff --git a/assets/images/devices_icon.svg b/assets/images/devices_icon.svg
new file mode 100644
index 00000000..fbe784d1
--- /dev/null
+++ b/assets/images/devices_icon.svg
@@ -0,0 +1,3 @@
+
diff --git a/assets/images/energy_icon.svg b/assets/images/energy_icon.svg
new file mode 100644
index 00000000..cd4ebbf9
--- /dev/null
+++ b/assets/images/energy_icon.svg
@@ -0,0 +1,11 @@
+
diff --git a/assets/images/movein_icon.svg b/assets/images/movein_icon.svg
new file mode 100644
index 00000000..7cf319bc
--- /dev/null
+++ b/assets/images/movein_icon.svg
@@ -0,0 +1,5 @@
+
diff --git a/assets/images/spase_management_icon.svg b/assets/images/spase_management_icon.svg
new file mode 100644
index 00000000..0a52816c
--- /dev/null
+++ b/assets/images/spase_management_icon.svg
@@ -0,0 +1,6 @@
+
diff --git a/lib/main.dart b/lib/main.dart
index 379442f2..42b2f13b 100644
--- a/lib/main.dart
+++ b/lib/main.dart
@@ -38,7 +38,7 @@ class MyApp extends StatelessWidget {
useMaterial3: true, // Enable Material 3
),
home: isLoggedIn == 'Success'?
- const HomePage()
+ HomePage()
:
const LoginPage(),
);
diff --git a/lib/pages/auth/view/login_mobile_page.dart b/lib/pages/auth/view/login_mobile_page.dart
index 7b52400a..4c38f18e 100644
--- a/lib/pages/auth/view/login_mobile_page.dart
+++ b/lib/pages/auth/view/login_mobile_page.dart
@@ -27,7 +27,7 @@ class LoginMobilePage extends StatelessWidget {
// Navigate to home screen after successful login
Navigator.pushReplacement(
context,
- MaterialPageRoute(builder: (context) => const HomePage()),
+ MaterialPageRoute(builder: (context) => HomePage()),
);
} else if (state is LoginFailure) {
// Show error message
diff --git a/lib/pages/auth/view/login_web_page.dart b/lib/pages/auth/view/login_web_page.dart
index 67f7c7bc..59b26946 100644
--- a/lib/pages/auth/view/login_web_page.dart
+++ b/lib/pages/auth/view/login_web_page.dart
@@ -29,7 +29,7 @@ class LoginWebPage extends StatelessWidget {
// Navigate to home screen after successful login
Navigator.pushReplacement(
context,
- MaterialPageRoute(builder: (context) => const HomePage()),
+ MaterialPageRoute(builder: (context) => HomePage()),
);
} else if (state is LoginFailure) {
// Show error message
diff --git a/lib/pages/home/view/home_card.dart b/lib/pages/home/view/home_card.dart
new file mode 100644
index 00000000..706c2456
--- /dev/null
+++ b/lib/pages/home/view/home_card.dart
@@ -0,0 +1,73 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_svg/flutter_svg.dart';
+
+import '../../../utils/color_manager.dart';
+
+class HomeCard extends StatelessWidget {
+ final bool active;
+ final String img;
+ final int index;
+ final String name;
+ final Function()? onTap;
+ const HomeCard({
+ super.key,
+ required this.name,
+ required this.index,
+ this.active = false,
+ required this.img,
+ required this.onTap,
+ });
+ @override
+ Widget build(BuildContext context) {
+ bool evenNumbers = index % 2 == 0;
+ return InkWell(
+ onTap: active ? onTap : null,
+ child: Container(
+ padding: const EdgeInsets.only(left: 10, bottom: 10),
+ decoration: BoxDecoration(
+ color: evenNumbers&&active?
+ ColorsManager.blueColor.withOpacity(0.8) :
+ (active ?ColorsManager.blueColor
+ : ColorsManager.blueColor.withOpacity(0.2)),
+ borderRadius: BorderRadius.circular(30),
+ ),
+ child: Column(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ Expanded(
+ child: Row(
+ mainAxisAlignment: MainAxisAlignment.start,
+ children: [
+ FittedBox(
+ fit: BoxFit.scaleDown,
+ child: Text(
+ name,
+ style: const TextStyle(
+ fontSize: 20,
+ color: Colors.white,
+ fontWeight: FontWeight.bold,
+ ),
+ ),
+ ),
+ ],
+ ),
+ ),
+ const SizedBox(height: 10),
+ Expanded(
+ child: Row(
+ mainAxisAlignment: MainAxisAlignment.end,
+ children: [
+ SizedBox(
+ child: SvgPicture.asset(
+ img,
+ ),
+ ),
+ ],
+ ),
+ ),
+ ],
+ ),
+ ),
+ );
+ }
+}
diff --git a/lib/pages/home/view/home_page.dart b/lib/pages/home/view/home_page.dart
index de8f0821..2fe11fca 100644
--- a/lib/pages/home/view/home_page.dart
+++ b/lib/pages/home/view/home_page.dart
@@ -1,30 +1,119 @@
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
+import 'package:flutter_svg/svg.dart';
import 'package:syncrow_web/pages/home/bloc/home_bloc.dart';
-import 'package:syncrow_web/pages/home/view/tree_page.dart';
-import 'package:syncrow_web/utils/style.dart';
+import 'package:syncrow_web/pages/home/view/home_card.dart';
+import 'package:syncrow_web/utils/color_manager.dart';
+import 'package:syncrow_web/utils/constants/assets.dart';
import 'package:syncrow_web/web_layout/web_scaffold.dart';
class HomePage extends StatelessWidget {
- const HomePage({super.key});
+ HomePage({super.key});
@override
Widget build(BuildContext context) {
- return WebScaffold(
- appBarTitle: 'Space Management',
- appBarBody:[
- Text(
- 'Community structure',
- style: appBarTextStyle,
- ),
- Text(
- 'Community ',
- style: appBarTextStyle
- ),
- ],
+ Size size = MediaQuery.of(context).size;
+ return WebScaffold(
+ enableMenuSideba:false ,
+ appBarTitle: Row(
+ children: [
+ SvgPicture.asset(
+ Assets.loginLogo,
+ width: 150,
+ ),
+ ],
+ ),
scaffoldBody: BlocProvider(
create: (context) => HomeBloc(),
- child: const TreeWidget(),
+ child: SizedBox(
+ height: size.height,
+ width: size.width,
+ child: Column(
+ mainAxisAlignment: MainAxisAlignment.center,
+ crossAxisAlignment: CrossAxisAlignment.center,
+ children: [
+ SizedBox(height: size.height * 0.1),
+ const Text(
+ 'ACCESS YOUR APPS',
+ style: TextStyle(fontSize: 40, fontWeight: FontWeight.w700),
+ ),
+ const SizedBox(height: 30),
+ Expanded(
+ flex: 4,
+ child: SizedBox(
+ height: size.height * 0.6,
+ width: size.width * 0.68,
+ child: GridView.builder(
+ itemCount: 8,
+ gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
+ crossAxisCount: 4,
+ crossAxisSpacing: 20.0,
+ mainAxisSpacing: 20.0,
+ childAspectRatio: 1.5,
+ ),
+ itemBuilder: (context, index) {
+ return HomeCard(
+ index:index,
+ active:ceilingSensorButtons[index]['active'],
+ name: ceilingSensorButtons[index]['title'],
+ img:ceilingSensorButtons[index]['icon'] ,
+ onTap: () {
+
+ },);
+ },
+ ),
+ ),
+ ),
+ ],
+ ),
+ ),
),
);
}
+
+ dynamic ceilingSensorButtons =
+ [
+ {
+ 'title': 'Access',
+ 'icon': Assets.accessIcon,
+ 'active': true,
+ },
+ {
+ 'title': 'Space Management',
+ 'icon': Assets.spaseManagementIcon,
+ 'color': ColorsManager.primaryColor,
+ 'active': true,
+ },
+ {
+ 'title': 'Devices',
+ 'icon':Assets.devicesIcon,
+ 'active': true,
+ },
+ {
+ 'title': 'Move in',
+ 'icon': Assets.moveinIcon,
+ 'active': false,
+ },
+ {
+ 'title': 'Construction',
+ 'icon': Assets.constructionIcon,
+ 'active': false,
+ },
+ {
+ 'title': 'Energy',
+ 'icon': Assets.energyIcon,
+ 'color': ColorsManager.slidingBlueColor.withOpacity(0.2),
+ 'active': false,
+ },
+ {
+ 'title': 'Integrations',
+ 'icon': Assets.integrationsIcon,
+ 'color': ColorsManager.slidingBlueColor.withOpacity(0.2),
+ 'active': false,
+ }, {
+ 'title': 'Asset',
+ 'icon': Assets.assetIcon,
+ 'color': ColorsManager.slidingBlueColor.withOpacity(0.2),
+ 'active': false,
+ },
+ ];
}
diff --git a/lib/utils/color_manager.dart b/lib/utils/color_manager.dart
index 96e7a43a..46cb4383 100644
--- a/lib/utils/color_manager.dart
+++ b/lib/utils/color_manager.dart
@@ -28,4 +28,5 @@ abstract class ColorsManager {
static const Color graysColor = Color(0xffEBEBEB);
static const Color textGray = Color(0xffD5D5D5);
static const Color btnColor = Color(0xFF00008B);
+ static const Color blueColor = Color(0xFF0036E6);
}
diff --git a/lib/utils/constants/assets.dart b/lib/utils/constants/assets.dart
index 0758fa9a..0d0b3924 100644
--- a/lib/utils/constants/assets.dart
+++ b/lib/utils/constants/assets.dart
@@ -15,4 +15,12 @@ class Assets {
static const String facebook = "assets/images/facebook.svg";
static const String invisiblePassword = "assets/images/Password_invisible.svg";
static const String visiblePassword = "assets/images/Password_visible.svg";
+ static const String accessIcon = "assets/images/access_icon.svg";
+ static const String spaseManagementIcon = "assets/images/spase_management_icon.svg";
+ static const String devicesIcon = "assets/images/devices_icon.svg";
+ static const String moveinIcon = "assets/images/movein_icon.svg";
+ static const String constructionIcon = "assets/images/construction_icon.svg";
+ static const String energyIcon = "assets/images/energy_icon.svg";
+ static const String integrationsIcon = "assets/images/Integrations_icon.svg";
+ static const String assetIcon = "assets/images/asset_icon.svg";
}
diff --git a/lib/web_layout/web_app_bar.dart b/lib/web_layout/web_app_bar.dart
index c7655eef..c69350f2 100644
--- a/lib/web_layout/web_app_bar.dart
+++ b/lib/web_layout/web_app_bar.dart
@@ -2,7 +2,7 @@ import 'package:flutter/material.dart';
import 'package:syncrow_web/utils/color_manager.dart';
class WebAppBar extends StatelessWidget {
- final String? title;
+ final Widget? title;
final List? body;
const WebAppBar({super.key,this.title,this.body});
@@ -16,11 +16,13 @@ class WebAppBar extends StatelessWidget {
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
- Expanded(
- child: Text(
- title!,style: const TextStyle(
- fontSize: 30,
- color: Colors.white),)
+ SizedBox(width: 40,),
+ Expanded(
+ child: title!
+ // Text(
+ // title!,style: const TextStyle(
+ // fontSize: 30,
+ // color: Colors.white),)
),
if (body != null)
Expanded(
@@ -30,26 +32,26 @@ class WebAppBar extends StatelessWidget {
children: body!,
),
),
- Row(
+ const Row(
children: [
- IconButton(onPressed: () {},
- icon: const Icon(Icons.apps_sharp,color: Colors.white,)),
- const SizedBox(width: 10,),
- const SizedBox.square(
- dimension: 40,
- child: CircleAvatar(
- backgroundColor: Colors.white,
- child: SizedBox.square(
- dimension: 35,
- child: CircleAvatar(
- backgroundColor: Colors.grey,
- child: FlutterLogo(),
- ),
- ),
- ),
- ),
+ SizedBox(width: 10,),
+ SizedBox.square(
+ dimension: 40,
+ child: CircleAvatar(
+ backgroundColor: Colors.white,
+ child: SizedBox.square(
+ dimension: 35,
+ child: CircleAvatar(
+ backgroundColor: Colors.grey,
+ child: FlutterLogo(),
+ ),
+ ),
+ ),
+ ),
const SizedBox(width: 10,),
const Text('mohamamd alnemer ',style: TextStyle(fontSize: 16,color: Colors.white),),
+ Icon(Icons.arrow_drop_down,color: ColorsManager.whiteColors,),
+ SizedBox(width: 40,)
],
)
],
diff --git a/lib/web_layout/web_scaffold.dart b/lib/web_layout/web_scaffold.dart
index 1f697739..e190dac1 100644
--- a/lib/web_layout/web_scaffold.dart
+++ b/lib/web_layout/web_scaffold.dart
@@ -6,7 +6,7 @@ import 'menu_sidebar.dart';
class WebScaffold extends StatelessWidget {
final bool enableMenuSideba;
- final String? appBarTitle;
+ final Widget? appBarTitle;
final List? appBarBody;
final Widget? scaffoldBody;
const WebScaffold({super.key,this.appBarTitle,this.appBarBody,this.scaffoldBody,this.enableMenuSideba=true});
@@ -24,6 +24,7 @@ class WebScaffold extends StatelessWidget {
fit: BoxFit.cover,
),
),
+ Container(color: Colors.white.withOpacity(0.7),),
Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [