ammar/syncrow-web
1
0
Fork 0
mirror of https://github.com/SyncrowIOT/web.git synced 2025-08-24 17:32:27 +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

4
assets/icons/search_icon.svg Normal file
View File

@ -0,0 +1,4 @@
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1.89852 11.08C-0.632759 8.54864 -0.632708 4.42983 1.89852 1.8985C4.42985 -0.632833 8.54861 -0.632833 11.0799 1.8985C13.2274 4.04599 13.5526 7.23986 12.0565 9.73392C12.0565 9.73392 11.949 9.91422 12.0942 10.0593C12.9222 10.8872 15.4065 13.3716 15.4065 13.3716C16.0658 14.0308 16.2227 14.9527 15.638 15.5374L15.5374 15.638C14.9527 16.2227 14.0308 16.0658 13.3716 15.4065C13.3716 15.4065 10.8926 12.9275 10.0662 12.1012C9.91414 11.9491 9.73389 12.0566 9.73389 12.0566C7.23988 13.5526 4.04601 13.2275 1.89852 11.08ZM9.88131 9.88133C11.7517 8.01094 11.7516 4.96763 9.88125 3.09724C8.01086 1.22689 4.96755 1.22684 3.09721 3.09724C1.22681 4.96758 1.22681 8.01094 3.09721 9.88133C4.9676 11.7516 8.01086 11.7516 9.88131 9.88133Z" fill="#999999" fill-opacity="0.7"/>
<path d="M9.46701 6.10386C9.55406 6.10386 9.64256 6.08674 9.72786 6.05072C10.0686 5.9065 10.228 5.51333 10.0838 5.17253C9.17738 3.03045 6.69729 2.0252 4.55526 2.93164C4.21451 3.07586 4.05509 3.46903 4.1993 3.80983C4.34357 4.15063 4.73664 4.30995 5.07755 4.16579C6.539 3.54737 8.23126 4.23326 8.84962 5.69471C8.95781 5.95031 9.20594 6.10386 9.46701 6.10386Z" fill="#999999" fill-opacity="0.7"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.2 KiB

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);
}