From 279fe45edf97e99890335f355665d6430a697d76 Mon Sep 17 00:00:00 2001 From: Gregory <117281520+gca-axelor@users.noreply.github.com> Date: Thu, 25 Jan 2024 14:47:53 +0100 Subject: [PATCH 01/30] feat: add ControlEntryDetailsScreen and header --- .../ControlEntryHeader/ControlEntryHeader.tsx | 103 ++++++++++++++++++ .../quality/src/components/molecules/index.js | 1 + 2 files changed, 104 insertions(+) create mode 100644 packages/apps/quality/src/components/molecules/ControlEntryHeader/ControlEntryHeader.tsx diff --git a/packages/apps/quality/src/components/molecules/ControlEntryHeader/ControlEntryHeader.tsx b/packages/apps/quality/src/components/molecules/ControlEntryHeader/ControlEntryHeader.tsx new file mode 100644 index 0000000000..618fd53911 --- /dev/null +++ b/packages/apps/quality/src/components/molecules/ControlEntryHeader/ControlEntryHeader.tsx @@ -0,0 +1,103 @@ +/* + * Axelor Business Solutions + * + * Copyright (C) 2024 Axelor (). + * + * This program is free software: you can redistribute it and/or modify + * it under the terms of the GNU Affero General Public License, version 3, + * as published by the Free Software Foundation. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU Affero General Public License for more details. + * + * You should have received a copy of the GNU Affero General Public License + * along with this program. If not, see . + */ + +import React from 'react'; +import {StyleSheet, View} from 'react-native'; +import {isEmpty, useSelector, useTranslator} from '@axelor/aos-mobile-core'; +import { + Badge, + ProgressBar, + Text, + ToggleButton, + useThemeColor, +} from '@axelor/aos-mobile-ui'; +import {DateDisplay} from '../../atoms'; +import {ControlEntry} from '../../../types'; + +interface ControlEntryHeaderProps {} + +const ControlEntryHeader = ({}: ControlEntryHeaderProps) => { + const I18n = useTranslator(); + const Colors = useThemeColor(); + + const {controlEntry} = useSelector((state: any) => state.controlEntry); + + if (controlEntry == null || isEmpty(controlEntry)) { + return null; + } + + return ( + + + {controlEntry.name} + + + + {`${I18n.t('Quality_Sample')} : ${ + controlEntry.sampleCount + }`} + + + {`${I18n.t('Quality_ControlPlan')} : ${ + controlEntry.controlPlan?.name + }`} + + + + + + ); +}; + +const styles = StyleSheet.create({ + container: { + marginHorizontal: 24, + }, + row: { + justifyContent: 'space-between', + flexDirection: 'row', + marginVertical: 2, + }, + progressHeader: { + justifyContent: 'space-between', + flexDirection: 'row', + marginTop: '3%', + }, + progressBar: { + width: '85%', + }, + toggleButton: { + height: 40, + top: '-20%', + }, +}); + +export default ControlEntryHeader; diff --git a/packages/apps/quality/src/components/molecules/index.js b/packages/apps/quality/src/components/molecules/index.js index bfe6e57bb7..aa99553152 100644 --- a/packages/apps/quality/src/components/molecules/index.js +++ b/packages/apps/quality/src/components/molecules/index.js @@ -18,3 +18,4 @@ export {default as ControlEntryDetailsButtons} from './ControlEntryDetailsButtons/ControlEntryDetailsButtons'; export {default as ControlEntryDetailsHeader} from './ControlEntryDetailsHeader/ControlEntryDetailsHeader'; +export {default as ControlEntryHeader} from './ControlEntryHeader/ControlEntryHeader'; From 5db7014e5bfb9494ca4c9a8b29c941d56703f4bd Mon Sep 17 00:00:00 2001 From: Gregory <117281520+gca-axelor@users.noreply.github.com> Date: Thu, 25 Jan 2024 15:24:43 +0100 Subject: [PATCH 02/30] feat: add slie and scrollist for controlEntrySample --- .../ControlEntryHeader/ControlEntryHeader.tsx | 2 +- .../quality/src/screens/ControlEntryDetailsScreen.js | 10 ++++++++++ 2 files changed, 11 insertions(+), 1 deletion(-) diff --git a/packages/apps/quality/src/components/molecules/ControlEntryHeader/ControlEntryHeader.tsx b/packages/apps/quality/src/components/molecules/ControlEntryHeader/ControlEntryHeader.tsx index 618fd53911..0ce21e17f0 100644 --- a/packages/apps/quality/src/components/molecules/ControlEntryHeader/ControlEntryHeader.tsx +++ b/packages/apps/quality/src/components/molecules/ControlEntryHeader/ControlEntryHeader.tsx @@ -67,7 +67,7 @@ const ControlEntryHeader = ({}: ControlEntryHeaderProps) => { { const {controlEntryId} = route.params; @@ -91,6 +92,15 @@ const ControlEntryDetailsScreen = ({route}) => { /> )} /> + {item?.fullName}} + /> ); }; From f4998c6ad97e418aa4b0066c68f0c037166b82b9 Mon Sep 17 00:00:00 2001 From: Gregory <117281520+gca-axelor@users.noreply.github.com> Date: Thu, 25 Jan 2024 16:55:48 +0100 Subject: [PATCH 03/30] feat: add ControlEntrySampleLine card --- .../quality/src/screens/ControlEntryDetailsScreen.js | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) diff --git a/packages/apps/quality/src/screens/ControlEntryDetailsScreen.js b/packages/apps/quality/src/screens/ControlEntryDetailsScreen.js index 986d8779e0..653ec5b702 100644 --- a/packages/apps/quality/src/screens/ControlEntryDetailsScreen.js +++ b/packages/apps/quality/src/screens/ControlEntryDetailsScreen.js @@ -26,7 +26,6 @@ import { } from '../components'; import {searchControlEntrySample} from '../features/controlEntrySampleSlice'; import {fetchControlEntryById} from '../features/controlEntrySlice'; -import {searchControlEntrySample} from '../features/controlEntrySampleSlice'; const ControlEntryDetailsScreen = ({route}) => { const {controlEntryId} = route.params; @@ -99,7 +98,13 @@ const ControlEntryDetailsScreen = ({route}) => { moreLoading={moreLoading} isListEnd={isListEnd} translator={I18n.t} - renderItem={({item}) => {item?.fullName}} + renderItem={({item}) => ( + + )} /> ); From 966f97bdda6737a7d725c671439c83e2f4233a5f Mon Sep 17 00:00:00 2001 From: Gregory <117281520+gca-axelor@users.noreply.github.com> Date: Thu, 25 Jan 2024 17:07:39 +0100 Subject: [PATCH 04/30] refactor: use dispatch in header --- .../ControlEntryHeader/ControlEntryHeader.tsx | 21 +++++++++++++++---- 1 file changed, 17 insertions(+), 4 deletions(-) diff --git a/packages/apps/quality/src/components/molecules/ControlEntryHeader/ControlEntryHeader.tsx b/packages/apps/quality/src/components/molecules/ControlEntryHeader/ControlEntryHeader.tsx index 0ce21e17f0..0d5e5af81d 100644 --- a/packages/apps/quality/src/components/molecules/ControlEntryHeader/ControlEntryHeader.tsx +++ b/packages/apps/quality/src/components/molecules/ControlEntryHeader/ControlEntryHeader.tsx @@ -16,9 +16,14 @@ * along with this program. If not, see . */ -import React from 'react'; +import React, {useEffect} from 'react'; import {StyleSheet, View} from 'react-native'; -import {isEmpty, useSelector, useTranslator} from '@axelor/aos-mobile-core'; +import { + isEmpty, + useSelector, + useTranslator, + useDispatch, +} from '@axelor/aos-mobile-core'; import { Badge, ProgressBar, @@ -28,15 +33,23 @@ import { } from '@axelor/aos-mobile-ui'; import {DateDisplay} from '../../atoms'; import {ControlEntry} from '../../../types'; +import {fetchControlEntryById} from '../../../features/controlEntrySlice'; -interface ControlEntryHeaderProps {} +interface ControlEntryHeaderProps { + controlEntryId: number; +} -const ControlEntryHeader = ({}: ControlEntryHeaderProps) => { +const ControlEntryHeader = ({controlEntryId}: ControlEntryHeaderProps) => { const I18n = useTranslator(); const Colors = useThemeColor(); + const dispatch = useDispatch(); const {controlEntry} = useSelector((state: any) => state.controlEntry); + useEffect(() => { + dispatch((fetchControlEntryById as any)({controlEntryId: controlEntryId})); + }, [controlEntryId, dispatch]); + if (controlEntry == null || isEmpty(controlEntry)) { return null; } From ac1b493832bdc09a3d71794d52cf6ea35a2f182f Mon Sep 17 00:00:00 2001 From: Gregory <117281520+gca-axelor@users.noreply.github.com> Date: Thu, 25 Jan 2024 17:14:30 +0100 Subject: [PATCH 05/30] feat: add button --- packages/apps/quality/src/screens/ControlEntryDetailsScreen.js | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/apps/quality/src/screens/ControlEntryDetailsScreen.js b/packages/apps/quality/src/screens/ControlEntryDetailsScreen.js index 653ec5b702..6563838c37 100644 --- a/packages/apps/quality/src/screens/ControlEntryDetailsScreen.js +++ b/packages/apps/quality/src/screens/ControlEntryDetailsScreen.js @@ -32,6 +32,7 @@ const ControlEntryDetailsScreen = ({route}) => { const dispatch = useDispatch(); const I18n = useTranslator(); + const Colors = useThemeColor(); const { controlEntrySampleList, From ca7c575cdb39f20d1f4ce24ce1c6eca746d88775 Mon Sep 17 00:00:00 2001 From: lme-axelor <102581501+lme-axelor@users.noreply.github.com> Date: Fri, 26 Jan 2024 11:51:28 +0100 Subject: [PATCH 06/30] fix: use DateDisplay from core and api file name --- .../molecules/ControlEntryHeader/ControlEntryHeader.tsx | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/packages/apps/quality/src/components/molecules/ControlEntryHeader/ControlEntryHeader.tsx b/packages/apps/quality/src/components/molecules/ControlEntryHeader/ControlEntryHeader.tsx index 0d5e5af81d..b6419cd7af 100644 --- a/packages/apps/quality/src/components/molecules/ControlEntryHeader/ControlEntryHeader.tsx +++ b/packages/apps/quality/src/components/molecules/ControlEntryHeader/ControlEntryHeader.tsx @@ -19,7 +19,7 @@ import React, {useEffect} from 'react'; import {StyleSheet, View} from 'react-native'; import { - isEmpty, + DateDisplay, useSelector, useTranslator, useDispatch, @@ -31,7 +31,6 @@ import { ToggleButton, useThemeColor, } from '@axelor/aos-mobile-ui'; -import {DateDisplay} from '../../atoms'; import {ControlEntry} from '../../../types'; import {fetchControlEntryById} from '../../../features/controlEntrySlice'; @@ -50,7 +49,7 @@ const ControlEntryHeader = ({controlEntryId}: ControlEntryHeaderProps) => { dispatch((fetchControlEntryById as any)({controlEntryId: controlEntryId})); }, [controlEntryId, dispatch]); - if (controlEntry == null || isEmpty(controlEntry)) { + if (controlEntry?.id !== controlEntryId) { return null; } From 3052d9a34828c69d81d28f5dae8cc23c5b40716e Mon Sep 17 00:00:00 2001 From: Gregory <117281520+gca-axelor@users.noreply.github.com> Date: Fri, 26 Jan 2024 13:13:22 +0100 Subject: [PATCH 07/30] refactor: add props itemStyle to RadioSelect component --- .../ui/src/components/molecules/RadioSelect/RadioSelect.tsx | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/packages/ui/src/components/molecules/RadioSelect/RadioSelect.tsx b/packages/ui/src/components/molecules/RadioSelect/RadioSelect.tsx index 502d6dad50..0cc1d49a50 100644 --- a/packages/ui/src/components/molecules/RadioSelect/RadioSelect.tsx +++ b/packages/ui/src/components/molecules/RadioSelect/RadioSelect.tsx @@ -28,6 +28,7 @@ interface RadioItem { const RadioSelect = ({ style, + itemStyle, items, question, radioSize, @@ -36,6 +37,7 @@ const RadioSelect = ({ defaultValue, }: { style?: any; + itemStyle?: any; items: RadioItem[]; question?: string; radioSize?: number; @@ -59,7 +61,8 @@ const RadioSelect = ({ {question} )} - + {items.map(item => ( Date: Fri, 26 Jan 2024 14:02:53 +0100 Subject: [PATCH 08/30] refactor: fix ToggleButton to avoid warning --- .../organisms/ToggleButton/ToggleButton.tsx | 17 +++++++++++------ 1 file changed, 11 insertions(+), 6 deletions(-) diff --git a/packages/ui/src/components/organisms/ToggleButton/ToggleButton.tsx b/packages/ui/src/components/organisms/ToggleButton/ToggleButton.tsx index 53a918a271..b755ad6615 100644 --- a/packages/ui/src/components/organisms/ToggleButton/ToggleButton.tsx +++ b/packages/ui/src/components/organisms/ToggleButton/ToggleButton.tsx @@ -40,11 +40,19 @@ const ToggleButton = ({ const Colors = useThemeColor(); const [isSelected, setIsSelected] = useState(isActive); + const [shouldTriggerPress, setShouldTriggerPress] = useState(false); useEffect(() => { setIsSelected(isActive); }, [isActive]); + useEffect(() => { + if (shouldTriggerPress) { + onPress(isSelected); + setShouldTriggerPress(false); + } + }, [shouldTriggerPress, isSelected, onPress]); + const _activeColor = useMemo(() => { return activeColor != null ? activeColor : Colors.primaryColor; }, [Colors, activeColor]); @@ -54,12 +62,9 @@ const ToggleButton = ({ }, [Colors, inactiveColor]); const handlePress = useCallback(() => { - setIsSelected(current => { - const newValue = !current; - onPress(newValue); - return newValue; - }); - }, [onPress]); + setIsSelected(current => !current); + setShouldTriggerPress(true); + }, []); const buttonConfigMemo = useMemo(() => { let _buttonColor: Color = isSelected ? _activeColor : _inactiveColor; From c1e3616f4890a1890f21b29549906d3cb49ba187 Mon Sep 17 00:00:00 2001 From: Gregory <117281520+gca-axelor@users.noreply.github.com> Date: Mon, 29 Jan 2024 10:05:26 +0100 Subject: [PATCH 09/30] feat: add ControlEntryFormScreen --- .../ControlEntryFormButtons.tsx | 87 +++++++++++ .../ControlEntryFormHeader.tsx | 139 ++++++++++++++++++ .../ControlEntryHeader/ControlEntryHeader.tsx | 78 +++++++++- .../quality/src/components/molecules/index.js | 2 + .../src/screens/ControlEntryFormScreen.js | 37 +++++ packages/apps/quality/src/screens/index.js | 9 ++ 6 files changed, 345 insertions(+), 7 deletions(-) create mode 100644 packages/apps/quality/src/components/molecules/ControlEntryFormButtons/ControlEntryFormButtons.tsx create mode 100644 packages/apps/quality/src/components/molecules/ControlEntryFormHeader/ControlEntryFormHeader.tsx create mode 100644 packages/apps/quality/src/screens/ControlEntryFormScreen.js diff --git a/packages/apps/quality/src/components/molecules/ControlEntryFormButtons/ControlEntryFormButtons.tsx b/packages/apps/quality/src/components/molecules/ControlEntryFormButtons/ControlEntryFormButtons.tsx new file mode 100644 index 0000000000..ced0a174da --- /dev/null +++ b/packages/apps/quality/src/components/molecules/ControlEntryFormButtons/ControlEntryFormButtons.tsx @@ -0,0 +1,87 @@ +/* + * Axelor Business Solutions + * + * Copyright (C) 2024 Axelor (). + * + * This program is free software: you can redistribute it and/or modify + * it under the terms of the GNU Affero General Public License, version 3, + * as published by the Free Software Foundation. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU Affero General Public License for more details. + * + * You should have received a copy of the GNU Affero General Public License + * along with this program. If not, see . + */ + +import React from 'react'; +import {StyleSheet, View} from 'react-native'; +import {} from '@axelor/aos-mobile-core'; +import {Button, Icon, useThemeColor} from '@axelor/aos-mobile-ui'; + +interface ControlEntryFormButtonsProps {} + +const ControlEntryFormButtons = ({}: ControlEntryFormButtonsProps) => { + const Colors = useThemeColor(); + + return ( + + + +