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

v2-ui #94

Merged
Vishnu merged 38 commits from v2-ui into main 2025-05-26 05:09:47 +00:00
Conversation 0 Commits 38 Files Changed 43 +186 -128
2 changed files with 186 additions and 128 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit ed828d9417 - Show all commits

312
app/src/components/layout/sidebarRight/visualization/IotInputCards/InputSelecterComponent.tsx
View File

@ -12,140 +12,198 @@ import Widget4InputCard3D from './Widget4InputCard3D'
import WarehouseThroughputInputComponent from './WarehouseThroughputInputComponent'
import { useWidgetStore } from '../../../../../store/useWidgetStore'
// const InputSelecterComponent = () => {
// const { selectedChartId } = useWidgetStore();
// if (selectedChartId && selectedChartId.type && selectedChartId.type === 'bar' ) {
// return (
// <>
// <div className="sideBarHeader">2D Widget Input</div>
// <BarChartInput />
// </>
// )
// }
// else if (selectedChartId && selectedChartId.type && selectedChartId.type === 'line' ) {
// return (
// <>
// <div className="sideBarHeader">2D Widget Input</div>
// <LineGrapInput />
// </>
// )
// }
// else if (selectedChartId && selectedChartId.type && selectedChartId.type === 'pie' ) {
// return (
// <>
// <div className="sideBarHeader">2D Widget Input</div>
// <PieChartInput />
// </>
// )
// }
// else if (selectedChartId && selectedChartId.type && selectedChartId.type === 'doughnut' ) {
// return (
// <>
// <div className="sideBarHeader">2D Widget Input</div>
// <PieChartInput />
// </>
// )
// }
// else if (selectedChartId && selectedChartId.type && selectedChartId.type === 'polarArea' ) {
// return (
// <>
// <div className="sideBarHeader">2D Widget Input</div>
// <PieChartInput />
// </>
// )
// }
// else if (selectedChartId && selectedChartId.type && selectedChartId.type === 'progress 1' ) {
// return (
// <>
// <div className="sideBarHeader">2D Widget Input</div>
// <Progress1Input />
// </>
// )
// }
// else if (selectedChartId && selectedChartId.type && selectedChartId.type === 'progress 2' ) {
// return (
// <>
// <div className="sideBarHeader">2D Widget Input</div>
// <Progress2Input />
// </>
// )
// }
// else if (selectedChartId && selectedChartId.className && selectedChartId.className === 'warehouseThroughput floating' ) {
// return (
// <>
// <div className="sideBarHeader">Floting Widget Input</div>
// <WarehouseThroughputInputComponent />
// </>
// )
// }
// else if (selectedChartId && selectedChartId.className && selectedChartId.className === 'fleetEfficiency floating' ) {
// return (
// <>
// <div className="sideBarHeader">Floting Widget Input</div>
// <FleetEfficiencyInputComponent />
// </>
// )
// }
// else if (selectedChartId && selectedChartId.className && selectedChartId.className === 'floating total-card' ) {
// return (
// <>
// <div className="sideBarHeader">Floting Widget Input</div>
// <FleetEfficiencyInputComponent />
// </>
// )
// }
// else if (selectedChartId && selectedChartId.type && selectedChartId.type === 'ui-Widget 1' ) {
// return (
// <>
// <div className="sideBarHeader">3D Widget Input</div>
// <Widget4InputCard3D />
// </>
// )
// }
// else if (selectedChartId && selectedChartId.type && selectedChartId.type === 'ui-Widget 2' ) {
// return (
// <>
// <div className="sideBarHeader">3D Widget Input</div>
// <Widget2InputCard3D />
// </>
// )
// }
// else if (selectedChartId && selectedChartId.type && selectedChartId.type === 'ui-Widget 3' ) {
// return (
// <>
// <div className="sideBarHeader">3D Widget Input</div>
// <Widget3InputCard3D />
// </>
// )
// }
// else if (selectedChartId && selectedChartId.type && selectedChartId.type === 'ui-Widget 4' ) {
// return (
// <>
// <div className="sideBarHeader">3D Widget Input</div>
// <Widget4InputCard3D />
// </>
// )
// }
// else {
// return (
// <div>No chart selected</div>
// )
// }
// }
const chartTypeMap: Record<| 'bar'| 'line'| 'pie' | 'doughnut' | 'polarArea'| 'progress 1' | 'progress 2'
| 'ui-Widget 1'| 'ui-Widget 2'| 'ui-Widget 3'| 'ui-Widget 4',JSX.Element> = {
bar: <BarChartInput />,
line: <LineGrapInput />,
pie: <PieChartInput />,
doughnut: <PieChartInput />,
polarArea: <PieChartInput />,
'progress 1': <Progress1Input />,
'progress 2': <Progress2Input />,
'ui-Widget 1': <Widget4InputCard3D />,
'ui-Widget 2': <Widget2InputCard3D />,
'ui-Widget 3': <Widget3InputCard3D />,
'ui-Widget 4': <Widget4InputCard3D />,
};
const classNameMap: Record<
| 'warehouseThroughput floating'
| 'fleetEfficiency floating'
| 'floating total-card',
JSX.Element
> = {
'warehouseThroughput floating': <WarehouseThroughputInputComponent />,
'fleetEfficiency floating': <FleetEfficiencyInputComponent />,
'floating total-card': <FleetEfficiencyInputComponent />,
};
const InputSelecterComponent = () => {
const { selectedChartId } = useWidgetStore();
const { selectedChartId } = useWidgetStore();
if (selectedChartId && selectedChartId.type && selectedChartId.type === 'bar' ) {
return (
if (selectedChartId) {
const { type, className } = selectedChartId;
if (type && chartTypeMap[type as keyof typeof chartTypeMap]) {
const label = ['ui-Widget 1', 'ui-Widget 2', 'ui-Widget 3', 'ui-Widget 4'].includes(type)
? '3D Widget Input'
: '2D Widget Input';
return (
<>
<div className="sideBarHeader">2D Widget Input</div>
<BarChartInput />
<div className="sideBarHeader">{label}</div>
{chartTypeMap[type as keyof typeof chartTypeMap]}
</>
)
}
);
}
else if (selectedChartId && selectedChartId.type && selectedChartId.type === 'line' ) {
return (
if (className && classNameMap[className as keyof typeof classNameMap]) {
return (
<>
<div className="sideBarHeader">2D Widget Input</div>
<LineGrapInput />
<div className="sideBarHeader">Floting Widget Input</div>
{classNameMap[className as keyof typeof classNameMap]}
</>
)
);
}
}
else if (selectedChartId && selectedChartId.type && selectedChartId.type === 'pie' ) {
return (
<>
<div className="sideBarHeader">2D Widget Input</div>
<PieChartInput />
</>
)
}
return <div>No chart selected</div>;
};
else if (selectedChartId && selectedChartId.type && selectedChartId.type === 'doughnut' ) {
return (
<>
<div className="sideBarHeader">2D Widget Input</div>
<PieChartInput />
</>
)
}
else if (selectedChartId && selectedChartId.type && selectedChartId.type === 'polarArea' ) {
return (
<>
<div className="sideBarHeader">2D Widget Input</div>
<PieChartInput />
</>
)
}
else if (selectedChartId && selectedChartId.type && selectedChartId.type === 'progress 1' ) {
return (
<>
<div className="sideBarHeader">2D Widget Input</div>
<Progress1Input />
</>
)
}
else if (selectedChartId && selectedChartId.type && selectedChartId.type === 'progress 2' ) {
return (
<>
<div className="sideBarHeader">2D Widget Input</div>
<Progress2Input />
</>
)
}
else if (selectedChartId && selectedChartId.className && selectedChartId.className === 'warehouseThroughput floating' ) {
return (
<>
<div className="sideBarHeader">Floting Widget Input</div>
<WarehouseThroughputInputComponent />
</>
)
}
else if (selectedChartId && selectedChartId.className && selectedChartId.className === 'fleetEfficiency floating' ) {
return (
<>
<div className="sideBarHeader">Floting Widget Input</div>
<FleetEfficiencyInputComponent />
</>
)
}
else if (selectedChartId && selectedChartId.className && selectedChartId.className === 'floating total-card' ) {
return (
<>
<div className="sideBarHeader">Floting Widget Input</div>
<FleetEfficiencyInputComponent />
</>
)
}
else if (selectedChartId && selectedChartId.type && selectedChartId.type === 'ui-Widget 1' ) {
return (
<>
<div className="sideBarHeader">3D Widget Input</div>
<Widget4InputCard3D />
</>
)
}
else if (selectedChartId && selectedChartId.type && selectedChartId.type === 'ui-Widget 2' ) {
return (
<>
<div className="sideBarHeader">3D Widget Input</div>
<Widget2InputCard3D />
</>
)
}
else if (selectedChartId && selectedChartId.type && selectedChartId.type === 'ui-Widget 3' ) {
return (
<>
<div className="sideBarHeader">3D Widget Input</div>
<Widget3InputCard3D />
</>
)
}
else if (selectedChartId && selectedChartId.type && selectedChartId.type === 'ui-Widget 4' ) {
return (
<>
<div className="sideBarHeader">3D Widget Input</div>
<Widget4InputCard3D />
</>
)
}
else {
return (
<div>No chart selected</div>
)
}
}
export default InputSelecterComponent
export default InputSelecterComponent;

2
app/src/modules/visualization/widgets/floating/cards/TotalCardComponent.tsx
View File

@ -12,7 +12,7 @@ import {
} from "../../../../../components/icons/3dChartIcons";
const TotalCardComponent = ({ object }: any) => {
console.log('object: ', object);
const [progress, setProgress] = useState<any>(0);
const [measurements, setmeasurements] = useState<any>({});
const [duration, setDuration] = useState("1h");