feat: use Timesheet requests (#389)

* RM#74837

packages/apps/hr/src/api/index.ts

@@ -57,9 +57,18 @@ export {
   fetchTimerById as fetchTimerByIdApi,
 } from './timer-api';
 export {
+  addTimerTimesheet as addTimerTimesheetApi,
+  createTimesheet as createTimesheetApi,
+  deleteTimesheet as deleteTimesheetApi,
   fetchDraftTimesheet as fetchDraftTimesheetApi,
   fetchTimesheet as fetchTimesheetApi,
   fetchTimesheetById as fetchTimesheetByIdApi,
   fetchTimesheetToValidate as fetchTimesheetToValidateApi,
+  updateTimesheetStatus as updateTimesheetStatusApi,
 } from './timesheet-api';
-export {fetchTimesheetLine as fetchTimesheetLineApi} from './timesheet-line-api';
+export {
+  createTimesheetLine as createTimesheetLineApi,
+  deleteTimesheetLine as deleteTimesheetLineApi,
+  fetchTimesheetLine as fetchTimesheetLineApi,
+  updateTimesheetLine as updateTimesheetLineApi,
+} from './timesheet-line-api';

packages/apps/hr/src/api/timesheet-api.js

@@ -17,6 +17,7 @@
  */
 
 import {
+  axiosApiProvider,
   createStandardFetch,
   createStandardSearch,
   getSearchCriterias,
@@ -187,3 +188,46 @@ export async function fetchDraftTimesheet({
     page: 0,
   });
 }
+
+export async function createTimesheet({fromDate, toDate, timerIdList}) {
+  return axiosApiProvider.post({
+    url: 'ws/aos/timesheet',
+    data: {
+      fromDate,
+      toDate,
+      timerIdList,
+    },
+  });
+}
+
+export async function addTimerTimesheet({timesheetId, version, timerIdList}) {
+  return axiosApiProvider.put({
+    url: `ws/aos/timesheet/add-timer/${timesheetId}`,
+    data: {
+      version,
+      timerIdList,
+    },
+  });
+}
+
+export async function updateTimesheetStatus({
+  timesheetId,
+  version,
+  toStatus,
+  groundForRefusal,
+}) {
+  return axiosApiProvider.put({
+    url: `ws/aos/timesheet/status/${timesheetId}`,
+    data: {
+      version,
+      toStatus,
+      groundForRefusal,
+    },
+  });
+}
+
+export async function deleteTimesheet({timesheetId}) {
+  return axiosApiProvider.delete({
+    url: `ws/rest/com.axelor.apps.hr.db.Timesheet/${timesheetId}`,
+  });
+}

packages/apps/hr/src/api/timesheet-line-api.js

@@ -17,6 +17,7 @@
  */
 
 import {
+  axiosApiProvider,
   createStandardSearch,
   getSearchCriterias,
 } from '@axelor/aos-mobile-core';
@@ -45,3 +46,45 @@ export async function fetchTimesheetLine({
     page,
   });
 }
+
+export async function createTimesheetLine({timesheetLine}) {
+  return axiosApiProvider
+    .post({
+      url: 'ws/aos/business/timesheet-line',
+      data: timesheetLine,
+    })
+    .catch(e => {
+      if (e.response.status === 404) {
+        return axiosApiProvider.post({
+          url: 'ws/aos/timesheet-line',
+          data: timesheetLine,
+        });
+      } else {
+        throw e;
+      }
+    });
+}
+
+export async function updateTimesheetLine({timesheetLineId, timesheetLine}) {
+  return axiosApiProvider
+    .put({
+      url: `ws/aos/business/timesheet-line/update/${timesheetLineId}`,
+      data: timesheetLine,
+    })
+    .catch(e => {
+      if (e.response.status === 404) {
+        return axiosApiProvider.put({
+          url: `ws/aos/timesheet-line/update/${timesheetLineId}`,
+          data: timesheetLine,
+        });
+      } else {
+        throw e;
+      }
+    });
+}
+
+export async function deleteTimesheetLine({timesheetLineId}) {
+  return axiosApiProvider.delete({
+    url: `ws/rest/com.axelor.apps.hr.db.TimesheetLine/${timesheetLineId}`,
+  });
+}

packages/apps/hr/src/components/molecules/ExpenseDetailsValidationButton/ExpenseDetailsValidationButton.js

@@ -17,8 +17,7 @@
  */
 
 import React, {useCallback, useState} from 'react';
-import {View} from 'react-native';
-
+import {View, StyleSheet} from 'react-native';
 import {
   useTranslator,
   useSelector,
@@ -32,19 +31,17 @@ import {
   sendExpense,
   validateExpense,
 } from '../../../features/expenseSlice';
-import ExpenseRefusalPopup from '../ExpenseRefusalPopup/ExpenseRefusalPopup';
-import {StyleSheet} from 'react-native';
+import {ExpenseRefusalPopup} from '../../templates';
 
 const ExpenseDetailsValidationButton = ({expense, mode, isManualCreation}) => {
   const navigation = useNavigation();
+  const Colors = useThemeColor();
   const I18n = useTranslator();
   const dispatch = useDispatch();
-  const Colors = useThemeColor();
 
   const {user} = useSelector(state => state.user);
 
   const [refusalPopupIsOpen, setRefusalPopupIsOpen] = useState(false);
-  const [refusalMessage, setRefusalMessage] = useState('');
 
   const sendExpenseAPI = useCallback(() => {
     dispatch(
@@ -98,36 +95,27 @@ const ExpenseDetailsValidationButton = ({expense, mode, isManualCreation}) => {
     expense.statusSelect === Expense.statusSelect.WaitingValidation
   ) {
     return (
-      <>
-        <View style={styles.buttonContainer}>
-          <Button
-            title={I18n.t('Hr_Refuse')}
-            onPress={() => {
-              setRefusalPopupIsOpen(true);
-            }}
-            color={Colors.errorColor}
-            width="45%"
-            iconName="x-lg"
-          />
-          <Button
-            title={I18n.t('Hr_Validate')}
-            onPress={validateExpenseAPI}
-            width="45%"
-            iconName="check-lg"
-          />
-        </View>
+      <View style={styles.buttonContainer}>
+        <Button
+          title={I18n.t('Hr_Refuse')}
+          onPress={() => setRefusalPopupIsOpen(true)}
+          color={Colors.errorColor}
+          width="45%"
+          iconName="x-lg"
+        />
         <ExpenseRefusalPopup
+          isOpen={refusalPopupIsOpen}
           expense={expense}
-          mode={mode}
-          refusalMessage={refusalMessage}
-          refusalPopupIsOpen={refusalPopupIsOpen}
-          setRefusalMessage={setRefusalMessage}
-          onClose={() => {
-            setRefusalMessage('');
-            setRefusalPopupIsOpen(false);
-          }}
+          expenseMode={mode}
+          onCancel={() => setRefusalPopupIsOpen(false)}
+        />
+        <Button
+          title={I18n.t('Hr_Validate')}
+          onPress={validateExpenseAPI}
+          width="45%"
+          iconName="check-lg"
         />
-      </>
+      </View>
     );
   }
 

packages/apps/hr/src/components/molecules/ExpenseRefusalPopup/ExpenseRefusalPopup.js → packages/apps/hr/src/components/molecules/RefusalPopup/RefusalPopup.tsx

@@ -16,43 +16,29 @@
  * along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
 
-import React, {useCallback, useMemo} from 'react';
-import {Alert, FormInput, checkNullString} from '@axelor/aos-mobile-ui';
-import {useTranslator, useDispatch} from '@axelor/aos-mobile-core';
-import {refuseExpense} from '../../../features/expenseSlice';
+import React, {useState} from 'react';
+import {useTranslator} from '@axelor/aos-mobile-core';
+import {Alert, checkNullString, FormInput} from '@axelor/aos-mobile-ui';
 
-const ExpenseRefusalPopup = ({
-  refusalPopupIsOpen,
-  setRefusalMessage,
-  expense,
-  mode,
-  refusalMessage,
-  onClose,
-}) => {
-  const I18n = useTranslator();
-  const dispatch = useDispatch();
+interface RefusalPopupProps {
+  isOpen: boolean;
+  onCancel: () => void;
+  onValidate: (groundForRefusal: string) => void;
+}
 
-  const refuseExpenseAPI = useCallback(() => {
-    dispatch(
-      refuseExpense({
-        expenseId: expense.id,
-        version: expense.version,
-        groundForRefusal: refusalMessage,
-        mode: mode,
-      }),
-    );
-  }, [dispatch, expense, refusalMessage, mode]);
+const RefusalPopup = ({isOpen, onValidate, onCancel}: RefusalPopupProps) => {
+  const I18n = useTranslator();
 
-  const isDisabled = useMemo(
-    () => checkNullString(refusalMessage),
-    [refusalMessage],
-  );
+  const [refusalMessage, setRefusalMessage] = useState('');
 
   return (
     <Alert
-      visible={refusalPopupIsOpen}
-      cancelButtonConfig={{onPress: onClose}}
-      confirmButtonConfig={{onPress: refuseExpenseAPI, disabled: isDisabled}}
+      visible={isOpen}
+      cancelButtonConfig={{onPress: onCancel}}
+      confirmButtonConfig={{
+        onPress: () => onValidate(refusalMessage),
+        disabled: checkNullString(refusalMessage),
+      }}
       translator={I18n.t}>
       <FormInput
         title={I18n.t('Hr_ReasonRefusal')}
@@ -65,4 +51,4 @@ const ExpenseRefusalPopup = ({
   );
 };
 
-export default ExpenseRefusalPopup;
+export default RefusalPopup;

packages/apps/hr/src/components/molecules/TimesheetDetailCard/TimesheetDetailCard.tsx

@@ -29,6 +29,8 @@ interface TimesheetDetailCardProps {
   isActions?: boolean;
   style?: any;
   onPress: () => void;
+  onSend: () => void;
+  onValidate: () => void;
 }
 
 const TimesheetDetailCard = ({
@@ -37,6 +39,8 @@ const TimesheetDetailCard = ({
   isActions = true,
   style,
   onPress,
+  onSend,
+  onValidate,
 }: TimesheetDetailCardProps) => {
   const Colors = useThemeColor();
 
@@ -78,14 +82,6 @@ const TimesheetDetailCard = ({
     return false;
   }, [isActions, _statusSelect, userCanValidate]);
 
-  const handleSend = () => {
-    console.log('handleSend');
-  };
-
-  const handleValidate = () => {
-    console.log('handleValidate');
-  };
-
   return (
     <View style={[styles.container, style]}>
       <TimesheetCard
@@ -110,8 +106,8 @@ const TimesheetDetailCard = ({
             iconColor={Colors.secondaryColor_dark.background}
             onPress={() => {
               _statusSelect === Timesheet.statusSelect.Draft
-                ? handleSend()
-                : handleValidate();
+                ? onSend()
+                : onValidate();
             }}
             style={styles.flexOneContainer}
           />