mirror of
https://gitlab.com/mbugroup/lti-web-client.git
synced 2026-05-20 13:32:00 +00:00
refactor(FE): Initialize and use current gauge week index
This commit is contained in:
@@ -1,4 +1,4 @@
|
||||
import React, { useMemo, useState } from 'react';
|
||||
import React, { useMemo, useState, useEffect } from 'react';
|
||||
import Card from '@/components/Card';
|
||||
import UniformityBarChart from '@/components/pages/production/uniformity/chart/UniformityBarChart';
|
||||
import UniformityGaugeChart from '@/components/pages/production/uniformity/chart/UniformityGaugeChart';
|
||||
@@ -22,13 +22,27 @@ const UniformityChart = ({
|
||||
return uniformityData.chart_data;
|
||||
}, [uniformityData]);
|
||||
|
||||
useEffect(() => {
|
||||
if (uniformityData?.chart_data?.gauge_chart?.week_info) {
|
||||
const { current_week_index } =
|
||||
uniformityData.chart_data.gauge_chart.week_info;
|
||||
setCurrentWeekIndex(current_week_index);
|
||||
}
|
||||
}, [uniformityData]);
|
||||
|
||||
const barChartData = useMemo(() => {
|
||||
if (!chartData?.bar_chart) {
|
||||
if (!chartData?.bar_chart || !chartData?.gauge_chart) {
|
||||
return [];
|
||||
}
|
||||
|
||||
const { bar_chart } = chartData;
|
||||
const currentWeekStr = String(bar_chart.current_week);
|
||||
const { bar_chart, gauge_chart } = chartData;
|
||||
const currentWeekData = gauge_chart.available_weeks[currentWeekIndex];
|
||||
|
||||
if (!currentWeekData || !currentWeekData.has_data) {
|
||||
return [];
|
||||
}
|
||||
|
||||
const currentWeekStr = String(currentWeekData.week);
|
||||
const weekData = bar_chart.all_weeks[currentWeekStr];
|
||||
|
||||
if (!weekData || !weekData.has_data) {
|
||||
@@ -42,7 +56,7 @@ const UniformityChart = ({
|
||||
idealRange: range.ideal_range,
|
||||
outsideRange: range.outside_range,
|
||||
}));
|
||||
}, [chartData]);
|
||||
}, [chartData, currentWeekIndex]);
|
||||
|
||||
const gaugeChartData = useMemo(() => {
|
||||
if (!chartData?.gauge_chart || !uniformityData) return undefined;
|
||||
@@ -54,28 +68,33 @@ const UniformityChart = ({
|
||||
return undefined;
|
||||
}
|
||||
|
||||
const hasPrevWeek = currentWeekIndex > 0;
|
||||
const hasNextWeek =
|
||||
currentWeekIndex < gauge_chart.available_weeks.length - 1;
|
||||
|
||||
return {
|
||||
value: currentWeekData.uniformity_percentage,
|
||||
label: 'Uniformity',
|
||||
week: `Week ${currentWeekData.week}`,
|
||||
currentValue: currentWeekData.ideal_count,
|
||||
totalValue: currentWeekData.total_count,
|
||||
hasPrevWeek: gauge_chart.week_info.has_prev_week,
|
||||
hasNextWeek: gauge_chart.week_info.has_next_week,
|
||||
hasPrevWeek,
|
||||
hasNextWeek,
|
||||
};
|
||||
}, [chartData, currentWeekIndex, uniformityData]);
|
||||
|
||||
const handleWeekChange = (direction: 'prev' | 'next') => {
|
||||
if (!chartData?.gauge_chart) return;
|
||||
|
||||
const { available_weeks, week_info } = chartData.gauge_chart;
|
||||
const { available_weeks } = chartData.gauge_chart;
|
||||
|
||||
if (direction === 'prev' && week_info.has_prev_week) {
|
||||
setCurrentWeekIndex((prev) => Math.max(0, prev - 1));
|
||||
} else if (direction === 'next' && week_info.has_next_week) {
|
||||
setCurrentWeekIndex((prev) =>
|
||||
Math.min(available_weeks.length - 1, prev + 1)
|
||||
);
|
||||
if (direction === 'prev' && currentWeekIndex > 0) {
|
||||
setCurrentWeekIndex((prev) => prev - 1);
|
||||
} else if (
|
||||
direction === 'next' &&
|
||||
currentWeekIndex < available_weeks.length - 1
|
||||
) {
|
||||
setCurrentWeekIndex((prev) => prev + 1);
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
Reference in New Issue
Block a user