calender cont.

main_design2.0
Sikander Saleem 12 months ago
parent 63cbbe48d1
commit 49377d2418

@ -0,0 +1,11 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M8.47808 13.2405C8.47808 12.9399 8.23422 12.6963 7.93333 12.6963H6.03237C5.73182 12.6963 5.48792 12.9399 5.48792 13.2405V15.1412C5.48792 15.4422 5.73182 15.6859 6.03237 15.6859H7.93333C8.23422 15.6859 8.47808 15.4422 8.47808 15.1412V13.2405Z" fill="#163A51"/>
<path d="M13.2289 13.2405C13.2289 12.9399 12.985 12.6963 12.6847 12.6963H10.7835C10.483 12.6963 10.2391 12.9399 10.2391 13.2405V15.1412C10.2391 15.4422 10.483 15.6859 10.7835 15.6859H12.6847C12.985 15.6859 13.2289 15.4422 13.2289 15.1412V13.2405Z" fill="#163A51"/>
<path d="M17.9798 13.2405C17.9798 12.9399 17.7359 12.6963 17.4353 12.6963H15.5344C15.2335 12.6963 14.9896 12.9399 14.9896 13.2405V15.1412C14.9896 15.4422 15.2335 15.6859 15.5344 15.6859H17.4353C17.7359 15.6859 17.9798 15.4422 17.9798 15.1412V13.2405Z" fill="#163A51"/>
<path d="M8.47808 17.9918C8.47808 17.6906 8.23422 17.4473 7.93333 17.4473H6.03237C5.73182 17.4473 5.48792 17.6906 5.48792 17.9918V19.8921C5.48792 20.193 5.73182 20.4366 6.03237 20.4366H7.93333C8.23422 20.4366 8.47808 20.1929 8.47808 19.8921V17.9918Z" fill="#163A51"/>
<path d="M13.2289 17.9918C13.2289 17.6906 12.985 17.4473 12.6847 17.4473H10.7835C10.483 17.4473 10.2391 17.6906 10.2391 17.9918V19.8921C10.2391 20.193 10.483 20.4366 10.7835 20.4366H12.6847C12.985 20.4366 13.2289 20.1929 13.2289 19.8921V17.9918Z" fill="#163A51"/>
<path d="M17.9798 17.9918C17.9798 17.6906 17.7359 17.4473 17.4356 17.4473H15.5344C15.2335 17.4473 14.9896 17.6906 14.9896 17.9918V19.8921C14.9896 20.193 15.2335 20.4366 15.5344 20.4366H17.4356C17.7359 20.4366 17.9798 20.1929 17.9798 19.8921V17.9918Z" fill="#163A51"/>
<path d="M21.379 2.67253V5.57572C21.379 6.88793 20.3145 7.94537 19.0025 7.94537H17.5033C16.1912 7.94537 15.1126 6.88793 15.1126 5.57572V2.66211H8.35533V5.57572C8.35533 6.88793 7.27675 7.94537 5.96483 7.94537H4.46535C3.15339 7.94537 2.08892 6.88793 2.08892 5.57572V2.67253C0.942245 2.7071 0 3.65593 0 4.82217V21.8362C0 23.0244 0.963042 24.0002 2.15121 24.0002H21.3167C22.5031 24.0002 23.4679 23.0224 23.4679 21.8362V4.82217C23.4679 3.65593 22.5257 2.7071 21.379 2.67253ZM20.6827 20.7767C20.6827 21.2902 20.2664 21.7068 19.7527 21.7068H3.67424C3.16057 21.7068 2.74424 21.2902 2.74424 20.7767V11.9883C2.74424 11.4747 3.16052 11.0581 3.67424 11.0581H19.7526C20.2663 11.0581 20.6826 11.4747 20.6826 11.9883L20.6827 20.7767Z" fill="#163A51"/>
<path d="M4.4602 6.38874H5.94311C6.39321 6.38874 6.75817 6.02432 6.75817 5.57422V0.81481C6.75817 0.364656 6.39321 0 5.94311 0H4.4602C4.01004 0 3.64514 0.364656 3.64514 0.81481V5.57422C3.64514 6.02432 4.01004 6.38874 4.4602 6.38874Z" fill="#163A51"/>
<path d="M17.4841 6.38874H18.967C19.4169 6.38874 19.7818 6.02432 19.7818 5.57422V0.81481C19.7819 0.364656 19.4169 0 18.967 0H17.4841C17.0341 0 16.6691 0.364656 16.6691 0.81481V5.57422C16.6691 6.02432 17.0341 6.38874 17.4841 6.38874Z" fill="#163A51"/>
</svg>

After

Width:  |  Height:  |  Size: 2.9 KiB

@ -19,6 +19,24 @@ extension WidgetExtensions on Widget {
Padding(padding: EdgeInsetsDirectional.only(start: start.toScreenWidth, end: end.toScreenWidth, top: top.toScreenHeight, bottom: bottom.toScreenHeight), child: this);
Widget toExpanded({int flex = 1}) => Expanded(flex: flex, child: this);
Widget get toShadowContainer => Container(
padding: const EdgeInsets.all(16),
decoration: ShapeDecoration(
color: Colors.white,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(20),
),
shadows: const [
BoxShadow(
color: Color(0x07000000),
blurRadius: 14,
offset: Offset(0, 0),
spreadRadius: 0,
)
],
),
child: this);
}
extension DividerExtension on Divider {

@ -310,5 +310,6 @@
"requesterName" : "Requester Name",
"updateWorkOrder" : "Update Work Order",
"createPreventiveMaintenanceRequest" : "Create Preventive Maintenance Request",
"createNewRequest" : "Create New Request"
"createNewRequest" : "Create New Request",
"calender" : "Calender"
}

@ -1,8 +1,11 @@
import 'package:flutter/material.dart';
import 'package:flutter_svg/svg.dart';
import 'package:provider/provider.dart';
import 'package:test_sa/controllers/providers/api/user_provider.dart';
import 'package:test_sa/extensions/context_extension.dart';
import 'package:test_sa/extensions/int_extensions.dart';
import 'package:test_sa/extensions/text_extensions.dart';
import 'package:test_sa/models/enums/user_types.dart';
import 'package:test_sa/new_views/app_style/app_color.dart';
import '../../models/enums/translation_keys.dart';
@ -19,6 +22,7 @@ class AppBottomNavigationBar extends StatelessWidget {
@override
Widget build(BuildContext context) {
bool isEngineer = (Provider.of<UserProvider>(context).user.type) == UsersTypes.engineer;
return ClipRRect(
borderRadius: const BorderRadius.only(topLeft: Radius.circular(20.0), topRight: Radius.circular(20.0)),
child: Container(
@ -39,7 +43,8 @@ class AppBottomNavigationBar extends StatelessWidget {
navBarItem(context, index: 0, iconName: "overview", label: context.translation.overview),
navBarItem(context, index: 1, iconName: "requests", label: context.translation.myRequests),
navBarItem(context, index: 2, iconName: "assets", label: context.translation.myAssets),
navBarItem(context, index: 3, iconName: "message", label: context.translation.contactUs),
if (isEngineer) navBarItem(context, index: 3, iconName: "calender_bottom", label: context.translation.calender),
navBarItem(context, index: isEngineer ? 4 : 3, iconName: "message", label: context.translation.contactUs),
],
currentIndex: selectedIndex,
onTap: onPressed,

@ -0,0 +1,30 @@
import 'package:flutter/material.dart';
class DailyFragment extends StatefulWidget {
DailyFragment({Key key}) : super(key: key);
@override
_DailyFragmentState createState() {
return _DailyFragmentState();
}
}
class _DailyFragmentState extends State<DailyFragment> {
DateTime currentDateTime = DateTime.now();
@override
void initState() {
super.initState();
}
@override
void dispose() {
super.dispose();
}
@override
Widget build(BuildContext context) {
// TODO: implement build
return null;
}
}

@ -0,0 +1,63 @@
import 'package:flutter/material.dart';
import 'package:table_calendar/table_calendar.dart';
import 'package:test_sa/extensions/int_extensions.dart';
import 'package:test_sa/extensions/text_extensions.dart';
import 'package:test_sa/extensions/widget_extensions.dart';
import 'package:test_sa/new_views/app_style/app_color.dart';
class MonthlyFragment extends StatefulWidget {
MonthlyFragment({Key key}) : super(key: key);
@override
_MonthlyFragmentState createState() {
return _MonthlyFragmentState();
}
}
class _MonthlyFragmentState extends State<MonthlyFragment> {
DateTime currentDateTime = DateTime.now();
@override
void initState() {
super.initState();
}
@override
void dispose() {
super.dispose();
}
@override
Widget build(BuildContext context) {
return Column(
children: [
1.divider.paddingOnly(top: 16, bottom: 16),
TableCalendar(
headerVisible: false,
firstDay: DateTime.utc(2010, 10, 16),
lastDay: DateTime.utc(2030, 3, 14),
focusedDay: currentDateTime,
currentDay: currentDateTime,
rowHeight: 37,
calendarStyle: CalendarStyle(
todayDecoration: cellDecoration(),
todayTextStyle: AppTextStyles.bodyText.copyWith(color: Color(0xFF2B353E)),
selectedTextStyle: AppTextStyles.bodyText.copyWith(color: Color(0xFF2B353E)),
rangeStartTextStyle: AppTextStyles.bodyText.copyWith(color: Color(0xFF2B353E)),
rangeEndTextStyle: AppTextStyles.bodyText.copyWith(color: Color(0xFF2B353E)),
),
daysOfWeekStyle: DaysOfWeekStyle(
weekdayStyle: AppTextStyles.bodyText.copyWith(color: AppColor.neutral50),
weekendStyle: AppTextStyles.bodyText.copyWith(color: AppColor.neutral50),
),
availableGestures: AvailableGestures.none,
),
],
).toShadowContainer;
}
BoxDecoration cellDecoration({Color color}) => BoxDecoration(
color: color ?? Colors.transparent,
shape: BoxShape.circle,
);
}

@ -0,0 +1,65 @@
import 'package:flutter/material.dart';
import 'package:table_calendar/table_calendar.dart';
import 'package:test_sa/extensions/int_extensions.dart';
import 'package:test_sa/extensions/text_extensions.dart';
import 'package:test_sa/extensions/widget_extensions.dart';
import 'package:test_sa/new_views/app_style/app_color.dart';
class WeeklyFragment extends StatefulWidget {
WeeklyFragment({Key key}) : super(key: key);
@override
_WeeklyFragmentState createState() {
return _WeeklyFragmentState();
}
}
class _WeeklyFragmentState extends State<WeeklyFragment> {
DateTime currentDateTime = DateTime.now();
@override
void initState() {
super.initState();
}
@override
void dispose() {
super.dispose();
}
@override
Widget build(BuildContext context) {
return Column(
children: [
1.divider.paddingOnly(top: 16, bottom: 16),
TableCalendar(
headerVisible: false,
calendarFormat: CalendarFormat.week,
firstDay: DateTime.utc(2010, 10, 16),
lastDay: DateTime.utc(2030, 3, 14),
focusedDay: currentDateTime,
currentDay: currentDateTime,
rowHeight: 37,
calendarStyle: CalendarStyle(
todayDecoration: cellDecoration(),
todayTextStyle: AppTextStyles.bodyText.copyWith(color: Color(0xFF2B353E)),
selectedTextStyle: AppTextStyles.bodyText.copyWith(color: Color(0xFF2B353E)),
rangeStartTextStyle: AppTextStyles.bodyText.copyWith(color: Color(0xFF2B353E)),
rangeEndTextStyle: AppTextStyles.bodyText.copyWith(color: Color(0xFF2B353E)),
),
daysOfWeekStyle: DaysOfWeekStyle(
weekdayStyle: AppTextStyles.bodyText.copyWith(color: AppColor.neutral50),
weekendStyle: AppTextStyles.bodyText.copyWith(color: AppColor.neutral50),
),
availableGestures: AvailableGestures.none,
),
],
).toShadowContainer;
}
BoxDecoration cellDecoration({Color color}) => BoxDecoration(
color: color ?? Colors.transparent,
shape: BoxShape.circle,
);
}

@ -0,0 +1,145 @@
import 'package:flutter/material.dart';
import 'package:table_calendar/table_calendar.dart';
import 'package:test_sa/extensions/int_extensions.dart';
import 'package:test_sa/extensions/text_extensions.dart';
import 'package:test_sa/extensions/widget_extensions.dart';
import 'package:test_sa/new_views/app_style/app_color.dart';
import 'package:test_sa/new_views/pages/land_page/calender_fragments/monthly_fragment.dart';
import 'package:test_sa/new_views/pages/land_page/calender_fragments/weekly_fragment.dart';
class CalenderPage extends StatefulWidget {
CalenderPage({Key key}) : super(key: key);
@override
_CalenderPageState createState() {
return _CalenderPageState();
}
}
class _CalenderPageState extends State<CalenderPage> {
int selectedIndex = 0;
DateTime currentDateTime = DateTime.now();
PageController _pageController;
@override
void initState() {
_pageController = PageController();
super.initState();
}
@override
void dispose() {
_pageController.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: Column(
children: [
// todo @sikander, hiding My shift view, later when they add data, then will us it.
Container(
width: double.infinity,
padding: const EdgeInsets.all(16),
decoration: ShapeDecoration(
color: Colors.white,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(20),
),
shadows: const [
BoxShadow(
color: Color(0x07000000),
blurRadius: 14,
offset: Offset(0, 0),
spreadRadius: 0,
)
],
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisSize: MainAxisSize.min,
children: [
Text(
'My Shift',
style: AppTextStyles.heading5.copyWith(color: AppColor.neutral50),
),
8.height,
Text(
'Sunday to Thursday',
style: AppTextStyles.bodyText.copyWith(color: const Color(0xFF757575)),
),
Text(
'09:00 to 18:00',
style: AppTextStyles.bodyText.copyWith(color: AppColor.neutral50),
),
],
),
),
Container(
width: double.infinity,
padding: const EdgeInsets.all(4),
decoration: ShapeDecoration(
color: const Color(0xFFEAF1F4),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(16),
),
shadows: const [
BoxShadow(
color: Color(0x07000000),
blurRadius: 14,
offset: Offset(0, 0),
spreadRadius: 0,
)
],
),
child: Row(
children: [
tabItem("Monthly", 0, selectedIndex, () => onTabPress(0)),
tabItem("Weekly", 1, selectedIndex, () => onTabPress(1)),
tabItem("Daily", 2, selectedIndex, () => onTabPress(2)),
],
),
),
8.height,
PageView(
controller: _pageController,
onPageChanged: (index) => onTabPress(index),
children: [
MonthlyFragment(),
WeeklyFragment(),
Container(),
],
).expanded,
],
),
);
}
void onTabPress(index) {
if (selectedIndex != index) {
setState(() {
selectedIndex = index;
});
_pageController.jumpToPage(index);
}
}
Widget tabItem(String title, int index, int selectedIndex, VoidCallback onPress) {
return Container(
alignment: Alignment.center,
padding: const EdgeInsets.only(top: 14, bottom: 14),
decoration: ShapeDecoration(
color: index == selectedIndex ? Colors.white : Colors.transparent,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(13),
),
),
child: Text(
title,
style: AppTextStyles.bodyText.copyWith(color: index == selectedIndex ? AppColor.neutral60 : const Color(0xFF757575)),
)).onPress(onPress).expanded;
}
}

@ -2,7 +2,11 @@ import 'dart:io';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:provider/provider.dart';
import 'package:test_sa/controllers/providers/api/user_provider.dart';
import 'package:test_sa/extensions/int_extensions.dart';
import 'package:test_sa/models/enums/user_types.dart';
import 'package:test_sa/new_views/pages/land_page/calender_page.dart';
import 'package:test_sa/new_views/pages/land_page/home_app_bar.dart';
import 'package:test_sa/new_views/pages/land_page/my_assets_page.dart';
import 'package:test_sa/new_views/pages/land_page/my_request/my_requests_page.dart';
@ -30,22 +34,29 @@ class _LandPageState extends State<LandPage> {
int currentPageIndex = 0;
bool showAppbar = true;
List<Widget> _pages;
UserProvider _userProvider;
@override
void initState() {
_pages = <Widget>[];
super.initState();
}
@override
Widget build(BuildContext context) {
if (_userProvider == null) {
_userProvider = Provider.of<UserProvider>(context);
_pages = <Widget>[
DashboardPage(onDrawerPress: (() {
_scaffoldKey.currentState.isDrawerOpen ? _scaffoldKey.currentState.closeDrawer() : _scaffoldKey.currentState.openDrawer();
})),
old_page.LandPage(),
SingleDevicePicker(),
if (_userProvider.user.type == UsersTypes.engineer) CalenderPage(),
MyRequestsPage(),
];
super.initState();
}
@override
Widget build(BuildContext context) {
return WillPopScope(
onWillPop: () async {
/// TODO [zaid] : show dialog before exit
@ -72,7 +83,9 @@ class _LandPageState extends State<LandPage> {
bottomNavigationBar: AppBottomNavigationBar(
selectedIndex: currentPageIndex,
onPressed: (index) {
if (index == 3) {
bool isEngineer = _userProvider.user.type == UsersTypes.engineer;
if (index == (isEngineer ? 4 : 3)) {
showModalBottomSheet(
context: context,
useSafeArea: true,
@ -83,7 +96,6 @@ class _LandPageState extends State<LandPage> {
setState(() {
currentPageIndex = index;
});
if (index == 1) {
setState(() {
showAppbar = false;

@ -1045,6 +1045,14 @@ packages:
url: "https://pub.dev"
source: hosted
version: "5.3.0"
simple_gesture_detector:
dependency: transitive
description:
name: simple_gesture_detector
sha256: "86d08f85f1f58583b7b4b941d989f48ea6ce08c1724a1d10954a277c2ec36592"
url: "https://pub.dev"
source: hosted
version: "0.2.0"
sky_engine:
dependency: transitive
description: flutter
@ -1130,6 +1138,14 @@ packages:
url: "https://pub.dev"
source: hosted
version: "3.1.0"
table_calendar:
dependency: "direct main"
description:
name: table_calendar
sha256: "7f1270313c0cdb245b583ed8518982c01d4a7e95869b3c30abcbae3b642c45d0"
url: "https://pub.dev"
source: hosted
version: "3.0.8"
term_glyph:
dependency: transitive
description:

@ -72,6 +72,7 @@ dependencies:
lottie: ^2.3.0
shimmer: ^2.0.0
flutter_advanced_switch: ^3.0.1
table_calendar: ^3.0.8
dev_dependencies:
flutter_test:

Loading…
Cancel
Save