diff --git a/app/src/components/ui/analysis/ProductionCapacity.tsx b/app/src/components/ui/analysis/ProductionCapacity.tsx
index 0bc8b91..47ad0ca 100644
--- a/app/src/components/ui/analysis/ProductionCapacity.tsx
+++ b/app/src/components/ui/analysis/ProductionCapacity.tsx
@@ -9,7 +9,7 @@ import {
} from "chart.js";
import { PowerIcon, ProductionCapacityIcon } from "../../icons/analysis";
import SkeletonUI from "../../templates/SkeletonUI";
-import { useInputValues, useMachineUptime, useProductionCapacityData } from "../../../store/builder/store";
+import { useInputValues, useMachineUptime, useProductionCapacityData, useThroughPutData } from "../../../store/builder/store";
ChartJS.register(LineElement, CategoryScale, LinearScale, PointElement);
@@ -34,6 +34,7 @@ const ThroughputSummary: React.FC = () => {
];
const { productionCapacityData } = useProductionCapacityData()
+ const { throughputData: data } = useThroughPutData()
const chartOptions = {
@@ -91,14 +92,16 @@ const ThroughputSummary: React.FC = () => {
const [isLoading, setIsLoading] = useState(true);
useEffect(() => {
- if (productionCapacityData >= 0) {
- setIsLoading(false);
- console.log("productionCapacityData: ", productionCapacityData);
+ if (productionCapacityData > 0 && data > 0) {
+ setTimeout(() => {
+ setIsLoading(false);
+ }, 5000);
} else {
setIsLoading(true);
}
}, [productionCapacityData]);
+
return (
diff --git a/app/src/components/ui/analysis/ROISummary.tsx b/app/src/components/ui/analysis/ROISummary.tsx
index dc33663..0f643b1 100644
--- a/app/src/components/ui/analysis/ROISummary.tsx
+++ b/app/src/components/ui/analysis/ROISummary.tsx
@@ -84,8 +84,12 @@ const ROISummary = ({
const { roiSummary } = useROISummaryData();
useEffect(() => {
- if (roiSummary && typeof roiSummary === "object") {
- setIsLoading(false); // Data loaded
+ console.log('roiSummary: ', roiSummary);
+ if (roiSummary && typeof roiSummary === "object" && roiSummary.productName !== "") {
+ // setIsLoading(false); // Data loaded
+ setTimeout(() => {
+ setIsLoading(false);
+ }, 5000);
} else {
setIsLoading(true); // Show skeleton while loading
}
diff --git a/app/src/components/ui/analysis/ThroughputSummary.tsx b/app/src/components/ui/analysis/ThroughputSummary.tsx
index bf570f9..9970e27 100644
--- a/app/src/components/ui/analysis/ThroughputSummary.tsx
+++ b/app/src/components/ui/analysis/ThroughputSummary.tsx
@@ -17,7 +17,6 @@ const ProductionCapacity = ({
const { machineActiveTime } = useMachineUptime();
const { materialCycleTime } = useMaterialCycle();
const { throughputData } = useThroughPutData()
- const { productionCapacityData } = useProductionCapacityData()
const progressPercent = machineActiveTime;
@@ -30,12 +29,15 @@ const ProductionCapacity = ({
const [isLoading, setIsLoading] = useState(false);
useEffect(() => {
- if (throughputData >= 0) {
+ if (throughputData > 0) {
// console.log('machineActiveTime: ', machineActiveTime);
// console.log('materialCycleTime: ', materialCycleTime);
// console.log('throughputData: ', throughputData);
// console.log('productionCapacityData: ', productionCapacityData);
- setIsLoading(true);
+ // setIsLoading(true);
+ setTimeout(() => {
+ setIsLoading(false);
+ }, 5000);
}
}, [throughputData])
diff --git a/app/src/styles/components/simulation/simulation.scss b/app/src/styles/components/simulation/simulation.scss
index db7b580..403d7ee 100644
--- a/app/src/styles/components/simulation/simulation.scss
+++ b/app/src/styles/components/simulation/simulation.scss
@@ -373,7 +373,7 @@
left: 50%;
transform: translate(-50%, 0);
color: var(--accent-color);
- z-index: 100;
+ z-index: 2;
isolation: isolate;
font-weight: 700;
padding: 8px;
diff --git a/app/src/styles/layout/compareLayout.scss b/app/src/styles/layout/compareLayout.scss
index c338f7c..cd0d1e3 100644
--- a/app/src/styles/layout/compareLayout.scss
+++ b/app/src/styles/layout/compareLayout.scss
@@ -36,6 +36,7 @@
align-items: center;
animation: slideInFromRight 0.4s ease-out forwards;
user-select: none;
+ border-left: 2px solid var(--border-color);
.resizer {
width: 32px;
diff --git a/app/src/styles/layout/sidebar.scss b/app/src/styles/layout/sidebar.scss
index 80125e3..dd7336f 100644
--- a/app/src/styles/layout/sidebar.scss
+++ b/app/src/styles/layout/sidebar.scss
@@ -73,6 +73,7 @@
.logo-container {
@include flex-center;
+ cursor: pointer;
}
.header-title {
@@ -221,7 +222,7 @@
padding: 13px 5px;
background: var(--background-color-secondary);
border-radius: #{$border-radius-medium};
- box-shadow:var(--box-shadow-light);
+ box-shadow: var(--box-shadow-light);
display: flex;
justify-content: space-between;
@@ -1360,9 +1361,11 @@
.aisle-properties-container {
max-height: 65vh;
overflow: auto;
+
.aisle-texture-container {
max-height: 40vh;
overflow: auto;
+
.aisle-list {
width: calc(100% - 8px);
text-align: start;
@@ -1372,6 +1375,7 @@
gap: 6px;
border-radius: #{$border-radius-large};
margin: 2px 6px;
+
.texture-display {
height: 34px;
width: 34px;
@@ -1380,63 +1384,78 @@
margin-right: 4px;
overflow: hidden;
}
+
.aisle-color {
text-transform: capitalize;
}
+
.aisle-brief {
font-size: var(--font-size-small);
color: var(--input-text-color);
}
+
&.selected {
background: var(--background-color-accent);
color: var(--text-button-color);
+
&:hover {
background: var(--background-color-accent);
}
}
+
&:hover {
background: var(--background-color-secondary);
}
}
}
+
.value-field-container {
margin: 0;
}
+
.presets-list-container {
display: flex;
flex-wrap: wrap;
gap: 6px;
padding: 6px;
padding-left: 7px;
+
.preset-list {
background: #444;
height: 90px;
width: 90px;
border-radius: #{$border-radius-large};
overflow: hidden;
+
.thumbnail {
height: 100%;
width: 100%;
border-radius: #{$border-radius-large};
outline-offset: -1px;
+
img {
height: 100%;
width: 100%;
object-fit: cover;
transition: all 0.2s;
}
+
&.selected {
outline: 2px solid var(--border-color-accent);
outline-offset: -2px;
+
&:hover {
outline: 2px solid var(--border-color-accent);
+
img {
transform: scale(1);
}
}
}
+
&:hover {
outline: 1px solid var(--border-color);
+
img {
transform: scale(1.1);
}
@@ -1456,6 +1475,7 @@
padding: 10px 12px;
color: var(--text-color);
width: 100%;
+
.input-value {
color: inherit;
}
@@ -1837,11 +1857,9 @@
width: 100%;
height: 100%;
font-size: var(--font-size-regular);
- background: linear-gradient(
- 0deg,
- rgba(37, 24, 51, 0) 0%,
- rgba(52, 41, 61, 0.5) 100%
- );
+ background: linear-gradient(0deg,
+ rgba(37, 24, 51, 0) 0%,
+ rgba(52, 41, 61, 0.5) 100%);
pointer-events: none;
backdrop-filter: blur(8px);
opacity: 0;
@@ -2099,4 +2117,4 @@
text-transform: capitalize;
}
}
-}
+}
\ No newline at end of file