Dwinzo-Beta/Dwinzo_Demo
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: add asset thumbnail fetching and update worker data display in Hrm component

Browse Source
This commit is contained in:
Gomathi
2025-08-26 09:36:09 +05:30
parent 6026c3b82b
commit 6fa4d5323d
2 changed files with 208 additions and 187 deletions
Download Patch File Download Diff File Expand all files Collapse all files

223
app/src/components/layout/sidebarRight/resourceManagement/hrm/Hrm.tsx
View File

@@ -3,6 +3,7 @@ import { ClockThreeIcon, LocationPinIcon, TargetIcon } from '../../../../icons/E
import { useSceneContext } from '../../../../../modules/scene/sceneContext'; import { useSceneContext } from '../../../../../modules/scene/sceneContext';
import RenameInput from '../../../../ui/inputs/RenameInput'; import RenameInput from '../../../../ui/inputs/RenameInput';
import { useResourceManagementId } from '../../../../../store/builder/store'; import { useResourceManagementId } from '../../../../../store/builder/store';
import { getAssetThumbnail } from '../../../../../services/factoryBuilder/asset/assets/getAssetThumbnail';
// import NavigateCatagory from '../NavigateCatagory' // import NavigateCatagory from '../NavigateCatagory'
const Hrm = () => { const Hrm = () => {
@@ -12,13 +13,26 @@ const Hrm = () => {
const { assetStore } = useSceneContext(); const { assetStore } = useSceneContext();
const { assets: allAssets } = assetStore(); const { assets: allAssets } = assetStore();
async function getAsset(assetId: string) {
let thumbnail = await getAssetThumbnail(assetId)
if (thumbnail.thumbnail) {
let assetImage = thumbnail.thumbnail
return assetImage;
}
}
useEffect(() => { useEffect(() => {
if (allAssets.length > 0) { if (allAssets.length > 0) {
const formattedWorkers = allAssets const fetchWorkers = async () => {
.filter((worker: any) => worker.eventData.type === "Human") const humans = allAssets.filter((worker: any) => worker.eventData.type === "Human");
.map((worker: any, index: number) => ({
const formattedWorkers = await Promise.all(
humans.map(async (worker: any, index: number) => {
const assetImage = await getAsset(worker.assetId);
return {
employee: { employee: {
image: "", image: assetImage,
name: worker.modelName, name: worker.modelName,
modelId: worker.modelUuid, modelId: worker.modelUuid,
employee_id: `HR-${204 + index}`, employee_id: `HR-${204 + index}`,
@@ -29,125 +43,126 @@ const Hrm = () => {
title: worker.taskTitle ?? "No Task Assigned", title: worker.taskTitle ?? "No Task Assigned",
location: { location: {
floor: worker.floor ?? 0, floor: worker.floor ?? 0,
zone: worker.zone ?? "N/A" zone: worker.zone ?? "N/A",
}, },
planned_time_hours: worker.plannedTime ?? 0, planned_time_hours: worker.plannedTime ?? 0,
time_spent_hours: worker.timeSpent ?? 0, time_spent_hours: worker.timeSpent ?? 0,
total_tasks: worker.totalTasks ?? 0, total_tasks: worker.totalTasks ?? 0,
completed_tasks: worker.completedTasks ?? 0 completed_tasks: worker.completedTasks ?? 0,
}, },
actions: [ actions: ["Assign Task", "Reassign Task", "Pause", "Emergency Stop"],
"Assign Task", location: `Floor ${worker.floor || "-"} . Zone ${worker.zone || "-"}`,
"Reassign Task", };
"Pause", })
"Emergency Stop" );
],
location: `Floor ${worker.floor || "-"} . Zone ${worker.zone || "-"}`
}));
setWorkers(formattedWorkers); setWorkers(formattedWorkers);
};
fetchWorkers();
} }
}, [allAssets]); }, [allAssets]);
// const employee_details = [
// {
// "employee": {
// image: "",
// "name": "John Doe",
// "employee_id": "HR-204",
// "status": "Active",
// }, // const employee_details = [
// "task": { // {
// "status": "Ongoing", // "employee": {
// "title": "Inspecting Machine X", // image: "",
// "location": { // "name": "John Doe",
// "floor": 4, // "employee_id": "HR-204",
// "zone": "B" // "status": "Active",
// },
// "planned_time_hours": 6,
// "time_spent_hours": 2,
// "total_tasks": 12,
// "completed_tasks": 3
// },
// "actions": [
// "Assign Task",
// "Reassign Task",
// "Pause",
// "Emergency Stop"
// ],
// "location": "Floor 4 . Zone B"
// },
// {
// "employee": {
// image: "",
// "name": "Alice Smith",
// "employee_id": "HR-205",
// "status": "Active",
// }, // },
// "task": { // "task": {
// "status": "Ongoing", // "status": "Ongoing",
// "title": "Calibrating Sensor Y", // "title": "Inspecting Machine X",
// "location": { // "location": {
// "floor": 2, // "floor": 4,
// "zone": "A" // "zone": "B"
// }, // },
// "planned_time_hours": 4, // "planned_time_hours": 6,
// "time_spent_hours": 1.5, // "time_spent_hours": 2,
// "total_tasks": 10, // "total_tasks": 12,
// "completed_tasks": 2 // "completed_tasks": 3
// }, // },
// "actions": [ // "actions": [
// "Assign Task", // "Assign Task",
// "Reassign Task", // "Reassign Task",
// "Pause", // "Pause",
// "Emergency Stop" // "Emergency Stop"
// ], // ],
// "location": "Floor 4 . Zone B" // "location": "Floor 4 . Zone B"
// }, // },
// { // {
// "employee": { // "employee": {
// image: "", // image: "",
// "name": "Michael Lee", // "name": "Alice Smith",
// "employee_id": "HR-206", // "employee_id": "HR-205",
// "status": "Active", // "status": "Active",
// }, // },
// "task": { // "task": {
// "status": "Ongoing", // "status": "Ongoing",
// "title": "Testing Conveyor Belt Z", // "title": "Calibrating Sensor Y",
// "location": { // "location": {
// "floor": 5, // "floor": 2,
// "zone": "C" // "zone": "A"
// }, // },
// "planned_time_hours": 5, // "planned_time_hours": 4,
// "time_spent_hours": 3, // "time_spent_hours": 1.5,
// "total_tasks": 8, // "total_tasks": 10,
// "completed_tasks": 5 // "completed_tasks": 2
// }, // },
// "actions": [ // "actions": [
// "Assign Task", // "Assign Task",
// "Reassign Task", // "Reassign Task",
// "Pause", // "Pause",
// "Emergency Stop" // "Emergency Stop"
// ], // ],
// "location": "Floor 4 . Zone B" // "location": "Floor 4 . Zone B"
// }, // },
// ] // {
function handleRenameWorker(newName: string) { // "employee": {
// image: "",
// "name": "Michael Lee",
// "employee_id": "HR-206",
// "status": "Active",
// },
// "task": {
// "status": "Ongoing",
// "title": "Testing Conveyor Belt Z",
// "location": {
// "floor": 5,
// "zone": "C"
// },
// "planned_time_hours": 5,
// "time_spent_hours": 3,
// "total_tasks": 8,
// "completed_tasks": 5
// },
// "actions": [
// "Assign Task",
// "Reassign Task",
// "Pause",
// "Emergency Stop"
// ],
// "location": "Floor 4 . Zone B"
// },
// ]
function handleRenameWorker(newName: string) {
} }
function handleHumanClick(employee: any) { function handleHumanClick(employee: any) {
if (employee.modelId) { if (employee.modelId) {
setResourceManagementId(employee.modelId); setResourceManagementId(employee.modelId);
} }
} }
return ( return (
<> <>
{/* <NavigateCatagory {/* <NavigateCatagory
category={["All People", "Technician", "Operator", "Supervisor", "Safety Officer"]} category={["All People", "Technician", "Operator", "Supervisor", "Safety Officer"]}
@@ -260,7 +275,7 @@ const Hrm = () => {
))} ))}
</div> </div>
</> </>
) )
} }
export default Hrm export default Hrm

6
app/src/styles/layout/resourceManagement.scss
View File

@@ -117,6 +117,12 @@
border-radius: 50%; border-radius: 50%;
background-color: #fff; background-color: #fff;
position: relative; position: relative;
overflow: hidden;
.user-image{
height: 300%;
width: 300%;
transform: translate(-26px, -12px);
}
.status { .status {
border-radius: 50%; border-radius: 50%;