53 lines
2.6 KiB
Markdown
53 lines
2.6 KiB
Markdown
|
# Walkthrough - Attendance Delegation Timeline Update
|
||
|
|
|
||
|
|
I have updated the status mapping and timeline logic in the Attendance Delegation History page to align with the provided status definitions.
|
||
|
|
|
||
|
|
## Changes Made
|
||
|
|
|
||
|
|
### Attendance & Overtime Delegation History Pages
|
||
|
|
- **Standardized `_buildStatusBadge`**:
|
||
|
|
- Both pages now use the same status mapping and labels:
|
||
|
|
- `1`: "Pending Delegate Approval"
|
||
|
|
- `2`: "Approved by Delegate / Pending Execute"
|
||
|
|
- `3`: "Pending HR Staff"
|
||
|
|
- `5`, `6`: "Cancel"
|
||
|
|
- Default: "Approved HR Staff (Done)"
|
||
|
|
- **Standardized `_buildTimeline`**:
|
||
|
|
- Both pages now share the same 5-step timeline:
|
||
|
|
1. Delegation
|
||
|
|
2. Pending Delegate Approval
|
||
|
|
3. Approved by Delegate / Pending Execute
|
||
|
|
4. Pending HR Staff
|
||
|
|
5. Approved HR Staff (Done)
|
||
|
|
- The logic for determining which step is active or completed is now consistent across both modules.
|
||
|
|
- **Refined Detail View**:
|
||
|
|
- Synced the layout of coordinates, maps, and addresses.
|
||
|
|
- Updated signature previews to support both Delegator and Delegate signatures side-by-side (when available).
|
||
|
|
- Preserved overtime-specific fields like "Duration" while ensuring consistent styling.
|
||
|
|
- **Backend Fix (Overtime History)**:
|
||
|
|
- Updated `getOvertimeDelegationHistory` and `getOvertimeDelegationHistoryEmployee` in `delegation-overtime-services.js` to join with `trx_multi_ovt_footer`.
|
||
|
|
- History results now include an array of actual time segments (`segments`) for each delegation record.
|
||
|
|
- **Frontend Updates (Time Segments)**:
|
||
|
|
- **React Native**: Added a new section in the `ListOvertimeDelegation.js` cards to display the "Actual Work Segments" (Start - End times) with their respective Clock In/Out timestamps.
|
||
|
|
- **Flutter**: Updated `overtime_delegation_history_page.dart` to show a styled list of actual work segments with detailed timestamps for each interval.
|
||
|
|
|
||
|
|
## Verification Results
|
||
|
|
|
||
|
|
### Logic Check
|
||
|
|
- **Status 1**: "Pending Delegate Approval" is In Progress.
|
||
|
|
- **Status 2**: "Approved by Delegate / Pending Execute" is In Progress.
|
||
|
|
- **Status 3**: "Pending HR Staff" is In Progress.
|
||
|
|
- **Status 4/others**: All steps are marked as Done.
|
||
|
|
- **Status 5**: All steps are marked as Cancelled (Red X).
|
||
|
|
|
||
|
|
The code now strictly follows the mapping provided:
|
||
|
|
```javascript
|
||
|
|
const getStatusText = (status) => {
|
||
|
|
if (status == 1) return "Pending Delegate Approval";
|
||
|
|
if (status == 2) return "Approved by Delegate / Pending Execute";
|
||
|
|
if (status == 3) return "Pending HR Staff";
|
||
|
|
if (status == 5) return "Cancel";
|
||
|
|
return "Approved HR Staff (Done)";
|
||
|
|
};
|
||
|
|
```
|