ammar/syncrow-web
1
0
Fork 0
mirror of https://github.com/SyncrowIOT/web.git synced 2025-08-25 04:22:28 +00:00
Code Issues Packages Projects Releases Wiki Activity

design fixes

Browse Source
This commit is contained in:
Rafeek-Khoudare
2025-07-22 09:56:32 +03:00
parent b1b72fa8aa
commit c0b74162e9
14 changed files with 198 additions and 71 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
lib/pages/access_management/manage_bookable_spaces/presentation/widgets/bookable_space_switch_activation_widget.dart
View File

@ -47,7 +47,7 @@ class BookableSpaceSwitchActivationWidget extends StatelessWidget {
return ColorsManager.whiteColors;
}),
value: space.spaceConfig!.availability,
activeTrackColor: ColorsManager.blueColor,
activeTrackColor: ColorsManager.dialogBlueTitle,
inactiveTrackColor: ColorsManager.grayBorder,
thumbColor: WidgetStateProperty.resolveWith<Color>(
(Set<WidgetState> states) {

29
lib/pages/access_management/manage_bookable_spaces/presentation/widgets/booking_period_widget.dart
View File

@ -32,12 +32,22 @@ class BookingPeriodWidget extends StatelessWidget {
const Text('Booking Period'),
],
),
const SizedBox(
height: 5,
),
Container(
width: 300,
width: 230,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(12),
color: ColorsManager.graysColor,
),
borderRadius: BorderRadius.circular(8),
color: ColorsManager.circleRolesBackground,
boxShadow: [
BoxShadow(
offset: Offset.zero,
blurRadius: 4,
spreadRadius: 0,
color: ColorsManager.timePickerColor.withValues(alpha: 0.15),
)
]),
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
@ -83,9 +93,13 @@ class BookingPeriodWidget extends StatelessWidget {
}
},
),
const SizedBox(
width: 10,
),
const Icon(
Icons.arrow_right_alt,
color: ColorsManager.grayColor,
size: 13,
),
TimePickerWidget(
title: editingBookableSpace == null
@ -128,8 +142,11 @@ class BookingPeriodWidget extends StatelessWidget {
}
},
),
const SizedBox(
width: 15,
),
Container(
width: 50,
width: 30,
height: 32,
decoration: const BoxDecoration(
borderRadius: BorderRadius.only(
@ -140,7 +157,7 @@ class BookingPeriodWidget extends StatelessWidget {
alignment: Alignment.center,
child: SvgPicture.asset(
Assets.clockIcon,
height: 15,
height: 18,
color: ColorsManager.blackColor.withValues(alpha: 0.4),
),
)

15
lib/pages/access_management/manage_bookable_spaces/presentation/widgets/check_box_space_widget.dart
View File

@ -2,6 +2,7 @@ import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:syncrow_web/pages/access_management/manage_bookable_spaces/domain/models/bookable_space_model.dart';
import 'package:syncrow_web/pages/access_management/manage_bookable_spaces/presentation/blocs/setup_bookable_spaces_bloc/setup_bookable_spaces_bloc.dart';
import 'package:syncrow_web/pages/access_management/manage_bookable_spaces/presentation/widgets/custom_checkbox_widget.dart';
import 'package:syncrow_web/utils/color_manager.dart';
class CheckBoxSpaceWidget extends StatelessWidget {
@ -32,7 +33,7 @@ class CheckBoxSpaceWidget extends StatelessWidget {
_ => false,
};
return Checkbox(
return CustomCheckboxWidget(
value: isChecked,
onChanged: (value) {
final bloc = context.read<SetupBookableSpacesBloc>();
@ -47,7 +48,7 @@ class CheckBoxSpaceWidget extends StatelessWidget {
);
},
),
const SizedBox(width: 5),
const SizedBox(width: 15),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
@ -55,15 +56,17 @@ class CheckBoxSpaceWidget extends StatelessWidget {
Text(
nonBookableSpace.spaceName,
style: const TextStyle(
fontWeight: FontWeight.bold,
color: ColorsManager.textGray,
fontWeight: FontWeight.w700,
fontSize: 12,
color: ColorsManager.titleGray,
),
),
Text(
nonBookableSpace.spaceVirtualAddress,
style: const TextStyle(
fontSize: 12,
color: ColorsManager.textGray,
fontWeight: FontWeight.w400,
fontSize: 10,
color: ColorsManager.titleGray,
),
),
],

53
lib/pages/access_management/manage_bookable_spaces/presentation/widgets/custom_checkbox_widget.dart Normal file
View File

@ -0,0 +1,53 @@
import 'package:flutter/material.dart';
import 'package:syncrow_web/utils/color_manager.dart';
class CustomCheckboxWidget extends StatelessWidget {
final bool value;
final ValueChanged<bool?> onChanged;
final double? outHeight;
final double? outWidth;
final double? iconSize;
const CustomCheckboxWidget({
super.key,
required this.value,
required this.onChanged,
this.outWidth,
this.outHeight,
this.iconSize,
});
@override
Widget build(BuildContext context) {
return GestureDetector(
onTap: () => onChanged(!value),
child: Container(
width: outWidth ?? 17,
height: outHeight ?? 17,
decoration: BoxDecoration(
color: value ? Colors.white : ColorsManager.checkBoxFillColor,
border: value
? Border.all(color: ColorsManager.secondaryColor, width: 1)
: Border.all(color: ColorsManager.checkBoxBorderGray, width: 1),
borderRadius: BorderRadius.circular(4),
),
child: value
? Center(
child: Container(
width: outWidth != null ? outWidth! - 4 : 13,
height: outHeight != null ? outHeight! - 4 : 13,
decoration: BoxDecoration(
color: ColorsManager.secondaryColor,
borderRadius: BorderRadius.circular(2),
),
child: const Icon(
Icons.check,
size: 12,
color: Colors.white,
),
),
)
: null,
),
);
}
}

4
lib/pages/access_management/manage_bookable_spaces/presentation/widgets/edit_bookable_space_button_widget.dart
View File

@ -45,12 +45,12 @@ class EditBookableSpaceButtonWidget extends StatelessWidget {
},
style: ElevatedButton.styleFrom(
padding: EdgeInsets.zero,
fixedSize: const Size(50, 30),
minimumSize: const Size(40, 30),
elevation: 1,
),
child: SvgPicture.asset(
Assets.settings,
height: 15,
height: 13,
color: ColorsManager.blue1,
),
),

1
lib/pages/access_management/manage_bookable_spaces/presentation/widgets/main_manage_bookable_widgets/top_part_widget.dart
View File

@ -27,6 +27,7 @@ class RowOfButtonsTitleWidget extends StatelessWidget {
ElevatedButton(
style: ElevatedButton.styleFrom(
padding: EdgeInsets.zero,
minimumSize: const Size(50, 40),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(12),
),

7
lib/pages/access_management/manage_bookable_spaces/presentation/widgets/points_part_widget.dart
View File

@ -65,7 +65,7 @@ class _PointsPartWidgetState extends State<PointsPartWidget> {
(Set<WidgetState> states) {
return ColorsManager.whiteColors;
}),
activeTrackColor: ColorsManager.blueColor,
activeTrackColor: ColorsManager.dialogBlueTitle,
inactiveTrackColor: ColorsManager.grayBorder,
thumbColor: WidgetStateProperty.resolveWith<Color>(
(Set<WidgetState> states) {
@ -109,7 +109,10 @@ class _PointsPartWidgetState extends State<PointsPartWidget> {
if (state is ActivatePointsSwitch)
SearchUnbookableSpacesWidget(
title: 'Ex: 0',
height: 40,
topPadding: 0,
blur: 1,
raduis: 10,
height: 34,
onChanged: (p0) {
final updatedCost =
int.tryParse(widget.pointsController.text) ?? 0;

39
lib/pages/access_management/manage_bookable_spaces/presentation/widgets/search_unbookable_spaces_widget.dart
View File

@ -1,22 +1,30 @@
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_svg/svg.dart';
import 'package:syncrow_web/utils/color_manager.dart';
import 'package:syncrow_web/utils/constants/assets.dart';
class SearchUnbookableSpacesWidget extends StatelessWidget {
final String title;
final Widget? suffix;
final double? height;
final double? width;
final double? blur;
final double? raduis;
final double? topPadding;
final TextEditingController? controller;
final List<TextInputFormatter>? inputFormatters;
final void Function(String)? onChanged;
const SearchUnbookableSpacesWidget({
required this.title,
this.controller,
this.blur,
this.onChanged,
this.suffix,
this.height,
this.width,
this.topPadding,
this.raduis,
this.inputFormatters,
super.key,
});
@ -25,16 +33,18 @@ class SearchUnbookableSpacesWidget extends StatelessWidget {
Widget build(BuildContext context) {
return Container(
width: width ?? 480,
height: height ?? 30,
height: height ?? 40,
padding: const EdgeInsets.only(top: 4),
decoration: BoxDecoration(
color: ColorsManager.whiteColors,
borderRadius: BorderRadius.circular(12),
boxShadow: const [
borderRadius: BorderRadius.circular(raduis ?? 15),
boxShadow: [
BoxShadow(
color: ColorsManager.shadowOfSearchTextfield,
offset: Offset(0, 4),
blurRadius: 5,
color:
ColorsManager.shadowOfSearchTextfield.withValues(alpha: 0.15),
offset: Offset.zero,
blurRadius: blur ?? 5,
spreadRadius: 0,
),
],
),
@ -43,14 +53,21 @@ class SearchUnbookableSpacesWidget extends StatelessWidget {
inputFormatters: inputFormatters,
onChanged: onChanged,
decoration: InputDecoration(
contentPadding:
const EdgeInsets.symmetric(vertical: 5, horizontal: 15),
contentPadding: EdgeInsets.symmetric(
vertical: topPadding ?? 5,
horizontal: 15,
),
hintText: title,
hintStyle: const TextStyle(color: ColorsManager.hintTextGrey),
border: InputBorder.none,
suffixIcon: suffix ??
const Icon(Icons.search,
size: 20, color: ColorsManager.hintTextGrey),
suffixIcon: Padding(
padding: const EdgeInsets.all(10),
child: suffix ??
SvgPicture.asset(
Assets.searchIcon,
height: 12,
),
),
),
style: const TextStyle(
fontSize: 14,

2
lib/pages/access_management/manage_bookable_spaces/presentation/widgets/step_two_details_widget.dart
View File

@ -26,7 +26,7 @@ class StepTwoDetailsWidget extends StatelessWidget {
editingBookableSpace: editingBookableSpace,
),
const SizedBox(
height: 20,
height: 30,
),
BookingPeriodWidget(
editingBookableSpace: editingBookableSpace,

4
lib/pages/access_management/manage_bookable_spaces/presentation/widgets/stepper_part_widget.dart
View File

@ -26,7 +26,7 @@ class StepperPartWidget extends StatelessWidget {
Container(
padding: const EdgeInsets.only(left: 3),
alignment: Alignment.centerLeft,
height: 50,
height: 40,
child: const VerticalDivider(
width: 8,
)),
@ -59,7 +59,7 @@ class StepperPartWidget extends StatelessWidget {
Container(
padding: const EdgeInsets.only(left: 3),
alignment: Alignment.centerLeft,
height: 50,
height: 40,
child: const VerticalDivider(
width: 8,
)),

1
lib/pages/access_management/manage_bookable_spaces/presentation/widgets/time_picker_widget.dart
View File

@ -53,7 +53,6 @@ class _TimePickerWidgetState extends State<TimePickerWidget> {
setState(() {});
},
child: Container(
width: 100,
height: 32,
decoration: const BoxDecoration(
borderRadius: BorderRadius.only(

105
lib/pages/access_management/manage_bookable_spaces/presentation/widgets/week_checkbox_title_widget.dart
View File

@ -2,6 +2,7 @@ import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:syncrow_web/pages/access_management/manage_bookable_spaces/domain/models/bookable_space_model.dart';
import 'package:syncrow_web/pages/access_management/manage_bookable_spaces/presentation/blocs/setup_bookable_spaces_bloc/setup_bookable_spaces_bloc.dart';
import 'package:syncrow_web/pages/access_management/manage_bookable_spaces/presentation/widgets/custom_checkbox_widget.dart';
class WeekDaysCheckboxRow extends StatefulWidget {
final BookableSpacemodel? editingBookableSpace;
@ -40,52 +41,78 @@ class _WeekDaysCheckboxRowState extends State<WeekDaysCheckboxRow> {
@override
Widget build(BuildContext context) {
return Row(
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: _daysChecked.entries.map((entry) {
return Expanded(
child: Row(
children: [
Expanded(
child: Checkbox(
value: entry.value,
onChanged: (newValue) {
setState(() {
_daysChecked[entry.key] = newValue ?? false;
});
children: [
Row(
children: [
Text(
'* ',
style: Theme.of(context)
.textTheme
.bodyMedium!
.copyWith(color: Colors.red),
),
const Text('Days'),
],
),
const SizedBox(
height: 20,
),
Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: _daysChecked.entries.map((entry) {
return Expanded(
child: Row(
children: [
CustomCheckboxWidget(
outHeight: 16,
outWidth: 16,
value: entry.value,
onChanged: (newValue) {
setState(() {
_daysChecked[entry.key] = newValue ?? false;
});
final selectedDays = _daysChecked.entries
.where((e) => e.value)
.map((e) => e.key)
.toList();
final selectedDays = _daysChecked.entries
.where((e) => e.value)
.map((e) => e.key)
.toList();
final bloc = context.read<SetupBookableSpacesBloc>();
final bloc = context.read<SetupBookableSpacesBloc>();
for (int i = 0;
i < bloc.selectedBookableSpaces.length;
i++) {
final space = bloc.selectedBookableSpaces[i];
final updatedConfig = space.spaceConfig
?.copyWith(bookableDays: selectedDays);
final updatedSpace =
space.copyWith(spaceConfig: updatedConfig);
for (int i = 0;
i < bloc.selectedBookableSpaces.length;
i++) {
final space = bloc.selectedBookableSpaces[i];
final updatedConfig = space.spaceConfig
?.copyWith(bookableDays: selectedDays);
final updatedSpace =
space.copyWith(spaceConfig: updatedConfig);
bloc.selectedBookableSpaces[i] = updatedSpace;
}
bloc.selectedBookableSpaces[i] = updatedSpace;
}
bloc.add(CheckConfigurValidityEvent());
},
),
bloc.add(CheckConfigurValidityEvent());
},
),
const SizedBox(
width: 8,
),
Expanded(
child: Text(
entry.key,
style: const TextStyle(
fontSize: 13,
fontWeight: FontWeight.w400,
),
)),
],
),
Expanded(
child: Text(
entry.key,
style: const TextStyle(fontSize: 10),
)),
],
),
);
}).toList(),
);
}).toList(),
),
],
);
}
}

3
lib/utils/color_manager.dart
View File

@ -38,6 +38,7 @@ abstract class ColorsManager {
static const Color lightGrayColor = Color(0xB2999999);
static const Color grayBorder = Color(0xFFCFCFCF);
static const Color textGray = Color(0xffD5D5D5);
static const Color titleGray = Color(0xB2999999);
static const Color btnColor = Color(0xFF00008B);
static const Color blueColor = Color(0xFF0036E6);
static const Color boxColor = Color(0xFFF5F6F7);
@ -90,4 +91,6 @@ abstract class ColorsManager {
static const Color shadowOfSearchTextfield = Color(0x26000000);
static const Color hintTextGrey = Colors.grey;
static const Color shadowOfDetailsContainer = Color(0x40000000);
static const Color checkBoxBorderGray = Color(0xffD0D0D0);
static const Color timePickerColor = Color(0xff000000);
}