SS-FCSC/fcsc_ipi_frontend
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

changed in resumitted

Browse Source
This commit is contained in:
Malini 2026-01-27 15:33:28 +05:30
parent 601e967c01
commit 8c708f9bd7
4 changed files with 195 additions and 112 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

221
ipi-survey-platform/src/components/survey/EstablishmentInfo/EstablishmentInfo.jsx
View File

@ -1,5 +1,5 @@
import React, { useEffect, useState, useMemo } from 'react'; import React, { useEffect, useState, useMemo } from 'react';
// Get and encode establishment ID for URL // Get and encode establishment ID for URL
const getSafeEstablishmentId = () => { const getSafeEstablishmentId = () => {
const establishmentId = localStorage.getItem('establishment_id') || ''; const establishmentId = localStorage.getItem('establishment_id') || '';
@ -8,7 +8,7 @@ const getSafeEstablishmentId = () => {
import { useNavigate, useLocation } from 'react-router-dom'; import { useNavigate, useLocation } from 'react-router-dom';
import { getEstablishmentProducts } from '../../../services/submissions/submissionService'; import { getEstablishmentProducts } from '../../../services/submissions/submissionService';
import Table from '@/components/common/Table'; import Table from '@/components/common/Table';
const caretDownSrc = '/assets/images/CaretDown.svg'; const caretDownSrc = '/assets/images/CaretDown.svg';
const backVectorSrc = '/assets/images/BackVector.svg'; const backVectorSrc = '/assets/images/BackVector.svg';
const mailIconSrc = '/assets/images/material-symbols_mail-outline.svg'; const mailIconSrc = '/assets/images/material-symbols_mail-outline.svg';
@ -16,7 +16,7 @@ const phoneIconSrc = '/assets/images/line-md_phone.svg';
const calendarIcon = '/assets/images/Duedate.svg'; const calendarIcon = '/assets/images/Duedate.svg';
const clockIcon = '/assets/images/mingcute_time-line.svg'; const clockIcon = '/assets/images/mingcute_time-line.svg';
const nextIcon = '/assets/images/mdi_page-next-outline.svg'; const nextIcon = '/assets/images/mdi_page-next-outline.svg';
const Field = ({ label, placeholder = '', type = 'text', value = '', onChange = () => {}, disabled = true }) => ( const Field = ({ label, placeholder = '', type = 'text', value = '', onChange = () => {}, disabled = true }) => (
<div> <div>
<label className={`block text-sm font-medium ${disabled ? 'text-[#9EA2A9]' : 'text-gray-700'} mb-1`}> <label className={`block text-sm font-medium ${disabled ? 'text-[#9EA2A9]' : 'text-gray-700'} mb-1`}>
@ -32,7 +32,7 @@ const Field = ({ label, placeholder = '', type = 'text', value = '', onChange =
/> />
</div> </div>
); );
const Select = ({ label, options = [], value = '', placeholder = 'Select option', onChange = () => {}, disabled = true }) => ( const Select = ({ label, options = [], value = '', placeholder = 'Select option', onChange = () => {}, disabled = true }) => (
<div> <div>
<label className="block text-sm font-medium text-gray-700 mb-1">{label}</label> <label className="block text-sm font-medium text-gray-700 mb-1">{label}</label>
@ -61,7 +61,7 @@ const Select = ({ label, options = [], value = '', placeholder = 'Select option'
</div> </div>
</div> </div>
); );
const Card = ({ children }) => ( const Card = ({ children }) => (
<div className="bg-white rounded-md shadow-sm ring-1 ring-gray-200"> <div className="bg-white rounded-md shadow-sm ring-1 ring-gray-200">
<div className="p-5"> <div className="p-5">
@ -69,7 +69,7 @@ const Card = ({ children }) => (
</div> </div>
</div> </div>
); );
const defaultEmployeeInfo = { const defaultEmployeeInfo = {
emiratiMale: '', emiratiMale: '',
nonEmiratiMale: '', nonEmiratiMale: '',
@ -78,22 +78,22 @@ const defaultEmployeeInfo = {
totalEmployees: '', totalEmployees: '',
totalEmirati: '', totalEmirati: '',
}; };
const getCurrentQuarterAndYear = () => { const getCurrentQuarterAndYear = () => {
const now = new Date(); const now = new Date();
const currentQuarter = Math.ceil((now.getMonth() + 1) / 3); const currentQuarter = Math.ceil((now.getMonth() + 1) / 3);
const currentYear = now.getFullYear(); const currentYear = now.getFullYear();
// Calculate end of quarter date // Calculate end of quarter date
const endOfQuarter = new Date(currentYear, currentQuarter * 3, 0); // Last day of the last month in quarter const endOfQuarter = new Date(currentYear, currentQuarter * 3, 0); // Last day of the last month in quarter
return { return {
quarter: `Q${currentQuarter}`, quarter: `Q${currentQuarter}`,
year: currentYear, year: currentYear,
endDate: endOfQuarter.toISOString() // Return as ISO string for consistency endDate: endOfQuarter.toISOString() // Return as ISO string for consistency
}; };
}; };
const EstablishmentInfo = ({ const EstablishmentInfo = ({
data = {}, data = {},
onChange = () => {}, onChange = () => {},
@ -111,13 +111,13 @@ const EstablishmentInfo = ({
const location = useLocation(); const location = useLocation();
// Use a ref to persist the survey data across re-renders // Use a ref to persist the survey data across re-renders
const surveyDataRef = React.useRef(null); const surveyDataRef = React.useRef(null);
// Fetch establishment products // Fetch establishment products
React.useEffect(() => { React.useEffect(() => {
const fetchProducts = async () => { const fetchProducts = async () => {
const establishmentId = localStorage.getItem('establishment_id'); const establishmentId = localStorage.getItem('establishment_id');
if (!establishmentId) return; if (!establishmentId) return;
setLoadingProducts(true); setLoadingProducts(true);
try { try {
const response = await getEstablishmentProducts(establishmentId); const response = await getEstablishmentProducts(establishmentId);
@ -133,89 +133,120 @@ const EstablishmentInfo = ({
setLoadingProducts(false); setLoadingProducts(false);
} }
}; };
fetchProducts(); fetchProducts();
}, []); }, []);
const [surveyData, setSurveyData] = React.useState(() => { const [surveyData, setSurveyData] = React.useState(() => {
// Initialize from location state if available, otherwise use defaults // For resubmission, use the quarter/year from the submission data
if (location.state?.fromResubmit && data?.quarter && data?.year) {
const surveyPeriod = {
quarter: data.quarter,
year: data.year,
endDate: data.end_date || ''
};
localStorage.setItem('currentSurveyPeriod', JSON.stringify(surveyPeriod));
return surveyPeriod;
}
// For new survey, use the quarter/year from location state if available
if (location.state?.survey) { if (location.state?.survey) {
const { quarter, year, endDate } = location.state.survey; const { quarter, year, endDate } = location.state.survey;
// Save to localStorage
const surveyPeriod = { quarter, year, endDate }; const surveyPeriod = { quarter, year, endDate };
localStorage.setItem('currentSurveyPeriod', JSON.stringify(surveyPeriod)); localStorage.setItem('currentSurveyPeriod', JSON.stringify(surveyPeriod));
return surveyPeriod;
return {
quarter: quarter || '',
year: year || '',
endDate: endDate || ''
};
} }
// Or use current quarter/year as fallback
// Fallback to current quarter/year
const current = getCurrentQuarterAndYear(); const current = getCurrentQuarterAndYear();
// Save to localStorage
const surveyPeriod = { const surveyPeriod = {
quarter: current.quarter, quarter: current.quarter,
year: current.year, year: current.year,
endDate: current.endDate endDate: current.endDate
}; };
localStorage.setItem('currentSurveyPeriod', JSON.stringify(surveyPeriod)); localStorage.setItem('currentSurveyPeriod', JSON.stringify(surveyPeriod));
return surveyPeriod;
return {
quarter: current.quarter,
year: current.year,
endDate: current.endDate
};
}); });
// Log when surveyData changes // Log when surveyData changes
React.useEffect(() => { React.useEffect(() => {
}, [surveyData]); }, [surveyData]);
// Update the ref whenever surveyData changes // Update the ref whenever surveyData changes
React.useEffect(() => { React.useEffect(() => {
surveyDataRef.current = surveyData; surveyDataRef.current = surveyData;
}, [surveyData]); }, [surveyData]);
// Use a ref to track if we've already set the initial survey data
const hasInitialized = React.useRef(false);
React.useEffect(() => { React.useEffect(() => {
// Only update if we don't already have survey data // Skip if we've already initialized or if we don't have the necessary data yet
if (!surveyDataRef.current?.quarter && location.state?.survey) { if (hasInitialized.current) return;
// For resubmission, ensure we use the submission's quarter/year
if (location.state?.fromResubmit && data?.quarter && data?.year) {
const newSurveyData = {
quarter: data.quarter,
year: data.year,
endDate: data.end_date || ''
};
// Only update if the values have changed
if (JSON.stringify(surveyData) !== JSON.stringify(newSurveyData)) {
setSurveyData(newSurveyData);
// Update the parent component with the survey data
onChange({
...data,
quarter: newSurveyData.quarter,
year: newSurveyData.year,
end_date: newSurveyData.endDate
});
}
hasInitialized.current = true;
}
// For new survey, use the quarter/year from location state if available
else if (location.state?.survey && !surveyData.quarter) {
const { quarter, year, endDate } = location.state.survey; const { quarter, year, endDate } = location.state.survey;
const newSurveyData = { const newSurveyData = {
quarter: quarter || '', quarter: quarter || '',
year: year || '', year: year || '',
endDate: endDate || '' endDate: endDate || ''
}; };
setSurveyData(newSurveyData); // Only update if the values have changed
if (JSON.stringify(surveyData) !== JSON.stringify(newSurveyData)) {
// Update the parent component with the survey data setSurveyData(newSurveyData);
onChange({
...data, // Update the parent component with the survey data
quarter: newSurveyData.quarter, onChange({
year: newSurveyData.year, ...data,
end_date: newSurveyData.endDate quarter: newSurveyData.quarter,
}); year: newSurveyData.year,
end_date: newSurveyData.endDate
});
}
hasInitialized.current = true;
} }
// Only run this effect when the component mounts or location.state changes }, [location.state, data, onChange, surveyData]);
}, [location.state, data, onChange]);
const handleCloseInfo = () => { const handleCloseInfo = () => {
setShowInfoCard(false); setShowInfoCard(false);
}; };
// Store establishment data in localStorage during resubmission // Store establishment data in localStorage during resubmission
React.useEffect(() => { React.useEffect(() => {
// Check if this is a resubmission // Check if this is a resubmission
const isResubmit = location.state?.fromResubmit; const isResubmit = location.state?.fromResubmit;
if (isResubmit && data) { if (isResubmit && data) {
try { try {
// Get existing resubmission data if it exists // Get existing resubmission data if it exists
const existingData = JSON.parse(localStorage.getItem('resubmissionData') || '{}'); const existingData = JSON.parse(localStorage.getItem('resubmissionData') || '{}');
// Update with establishment data // Update with establishment data
const updatedData = { const updatedData = {
...existingData, ...existingData,
@ -234,7 +265,7 @@ const EstablishmentInfo = ({
quarter: data.quarter || surveyData.quarter, quarter: data.quarter || surveyData.quarter,
year: data.year || surveyData.year year: data.year || surveyData.year
}; };
// Save back to localStorage // Save back to localStorage
localStorage.setItem('resubmissionData', JSON.stringify(updatedData)); localStorage.setItem('resubmissionData', JSON.stringify(updatedData));
} catch (error) { } catch (error) {
@ -242,7 +273,7 @@ const EstablishmentInfo = ({
} }
} }
}, [data, location.state?.fromResubmit, surveyData.quarter, surveyData.year]); }, [data, location.state?.fromResubmit, surveyData.quarter, surveyData.year]);
const info = React.useMemo( const info = React.useMemo(
() => ({ () => ({
quarter: surveyData.quarter || '', quarter: surveyData.quarter || '',
@ -262,23 +293,23 @@ const EstablishmentInfo = ({
}), }),
[data, surveyData.quarter, surveyData.year] [data, surveyData.quarter, surveyData.year]
); );
const handleFieldChange = (field) => (event) => { const handleFieldChange = (field) => (event) => {
onChange({ onChange({
...info, ...info,
[field]: event.target.value, [field]: event.target.value,
}); });
}; };
// const handleEditProfile = (e) => { // const handleEditProfile = (e) => {
// e.preventDefault(); // e.preventDefault();
// const establishmentId = sessionStorage.getItem('establishment_id'); // const establishmentId = sessionStorage.getItem('establishment_id');
// if (!establishmentId) { // if (!establishmentId) {
// alert('No establishment ID found in session'); // alert('No establishment ID found in session');
// return; // return;
// } // }
// localStorage.setItem('returnTo', window.location.pathname); // localStorage.setItem('returnTo', window.location.pathname);
// sessionStorage.setItem('edit_profile_from', 'EstablishmentUser'); // sessionStorage.setItem('edit_profile_from', 'EstablishmentUser');
// // navigate(`/profile/edit/${establishmentId}`); // // navigate(`/profile/edit/${establishmentId}`);
@ -306,7 +337,7 @@ const EstablishmentInfo = ({
}, },
}); });
}; };
return ( return (
<div className="space-y-6 relative"> <div className="space-y-6 relative">
{loading && ( {loading && (
@ -317,7 +348,7 @@ const EstablishmentInfo = ({
<h2 className="text-xl font-semibold text-[#232528] mb-2"> <h2 className="text-xl font-semibold text-[#232528] mb-2">
IIP (Index of Industrial Production): {surveyData.quarter} {surveyData.year} IIP (Index of Industrial Production): {surveyData.quarter} {surveyData.year}
</h2> </h2>
{/* Survey Information */} {/* Survey Information */}
{!showInfoCard && ( {!showInfoCard && (
<button <button
@ -332,7 +363,7 @@ const EstablishmentInfo = ({
)} )}
{showInfoCard && ( {showInfoCard && (
<div className="bg-[#F2ECCF] p-5 rounded-md shadow-sm ring-1 ring-gray-200 relative mb-6"> <div className="bg-[#F2ECCF] p-5 rounded-md shadow-sm ring-1 ring-gray-200 relative mb-6">
<button <button
onClick={handleCloseInfo} onClick={handleCloseInfo}
className="absolute right-4 top-4 text-gray-500 hover:text-gray-700 focus:outline-none" className="absolute right-4 top-4 text-gray-500 hover:text-gray-700 focus:outline-none"
aria-label="Close information" aria-label="Close information"
@ -341,12 +372,12 @@ const EstablishmentInfo = ({
<path fillRule="evenodd" d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" clipRule="evenodd" /> <path fillRule="evenodd" d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" clipRule="evenodd" />
</svg> </svg>
</button> </button>
<div className="space-y-4"> <div className="space-y-4">
<p className="text-sm text-[#6C4527] mb-4"> <p className="text-sm text-[#6C4527] mb-4">
You're completing the <b>IIP Quarterly Survey</b> for <b>{surveyData.quarter} {surveyData.year}</b>. This step shows establishment details already registered with us. <b>Step 1 is read-only.</b> To make corrections, update them in <b>Profile → Edit Profile</b>, then return to this survey. You're completing the <b>IIP Quarterly Survey</b> for <b>{surveyData.quarter} {surveyData.year}</b>. This step shows establishment details already registered with us. <b>Step 1 is read-only.</b> To make corrections, update them in <b>Profile → Edit Profile</b>, then return to this survey.
</p> </p>
<div className="grid grid-cols-1 md:grid-cols-2 gap-6"> <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
<div> <div>
<div className="space-y-4"> <div className="space-y-4">
@ -400,13 +431,13 @@ const EstablishmentInfo = ({
</div> </div>
</div> </div>
)} )}
<div className="flex items-center gap-2 mb-2"> <div className="flex items-center gap-2 mb-2">
<h2 className="text-lg font-semibold text-[#232528]">Step 1: Review Establishment Information</h2> <h2 className="text-lg font-semibold text-[#232528]">Step 1: Review Establishment Information</h2>
{isComplete && ( {isComplete && (
<img <img
src="/assets/images/CircleFrame.svg" src="/assets/images/CircleFrame.svg"
alt="Completed" alt="Completed"
className="w-5 h-5" className="w-5 h-5"
/> />
)} )}
@ -431,10 +462,10 @@ const EstablishmentInfo = ({
<option key={quarter} value={quarter}>{quarter}</option> <option key={quarter} value={quarter}>{quarter}</option>
))} ))}
</select> </select>
<img <img
src={caretDownSrc} src={caretDownSrc}
alt="open" alt="open"
className="pointer-events-none absolute right-3 top-1/2 -translate-y-1/2 h-4 w-4" className="pointer-events-none absolute right-3 top-1/2 -translate-y-1/2 h-4 w-4"
/> />
</div> </div>
</div> </div>
@ -445,7 +476,7 @@ const EstablishmentInfo = ({
value={surveyData.year} value={surveyData.year}
onChange={handleFieldChange('year')} onChange={handleFieldChange('year')}
disabled={true} disabled={true}
className="block w-full h-10 rounded-md border-2 border-[#E6D7A2] focus:border-[#92722A] focus:ring-0 px-4 pr-10 text-sm bg-white text-[#9EA2A9] appearance-none cursor-not-allowed" className="block w-full h-10 rounded-md border-2 border-[#E6D7A2] focus:border-[#92722A] focus:ring-0 px-4 pr-10 text-sm bg-white text-[#9EA2A9] appearance-none cursor-not-allowed"
> >
<option value="" disabled>Select year</option> <option value="" disabled>Select year</option>
@ -453,17 +484,17 @@ const EstablishmentInfo = ({
<option key={year} value={year}>{year}</option> <option key={year} value={year}>{year}</option>
))} ))}
</select> </select>
<img <img
src={caretDownSrc} src={caretDownSrc}
alt="open" alt="open"
className="pointer-events-none absolute right-3 top-1/2 -translate-y-1/2 h-4 w-4" className="pointer-events-none absolute right-3 top-1/2 -translate-y-1/2 h-4 w-4"
/> />
</div> </div>
</div> </div>
</div> </div>
</Card> </Card>
</div> </div>
{/* Establishment Information Form */} {/* Establishment Information Form */}
<Card> <Card>
<h3 className="text-sm font-semibold text-gray-900 mb-4">Establishment Information</h3> <h3 className="text-sm font-semibold text-gray-900 mb-4">Establishment Information</h3>
@ -474,7 +505,7 @@ const EstablishmentInfo = ({
value={info.establishmentName} value={info.establishmentName}
onChange={handleFieldChange('establishmentName')} onChange={handleFieldChange('establishmentName')}
disabled={true} disabled={true}
/> />
<Field <Field
label="Permanent Factory Code(PFC)" label="Permanent Factory Code(PFC)"
@ -482,7 +513,7 @@ const EstablishmentInfo = ({
value={info.permanentFactoryCode} value={info.permanentFactoryCode}
onChange={handleFieldChange('permanentFactoryCode')} onChange={handleFieldChange('permanentFactoryCode')}
disabled={true} disabled={true}
/> />
<Field <Field
label="Business Register Industry Code" label="Business Register Industry Code"
@ -490,7 +521,7 @@ const EstablishmentInfo = ({
value={info.industryCode} value={info.industryCode}
onChange={handleFieldChange('industryCode')} onChange={handleFieldChange('industryCode')}
disabled={true} disabled={true}
/> />
<Field <Field
label="License Number" label="License Number"
@ -498,7 +529,7 @@ const EstablishmentInfo = ({
value={info.licenseNumber} value={info.licenseNumber}
onChange={handleFieldChange('licenseNumber')} onChange={handleFieldChange('licenseNumber')}
disabled={true} disabled={true}
/> />
{/* Email field is hidden but data remains in form state */} {/* Email field is hidden but data remains in form state */}
<Field <Field
@ -507,7 +538,7 @@ const EstablishmentInfo = ({
value={info.isicCode} value={info.isicCode}
onChange={handleFieldChange('isicCode')} onChange={handleFieldChange('isicCode')}
disabled={true} disabled={true}
/> />
<Field <Field
label="Emirate" label="Emirate"
@ -515,11 +546,11 @@ const EstablishmentInfo = ({
value={info.emirate} value={info.emirate}
onChange={handleFieldChange('emirate')} onChange={handleFieldChange('emirate')}
disabled={true} disabled={true}
/> />
</div> </div>
</Card> </Card>
<Card className="mt-10"> <Card className="mt-10">
<h3 className="text-sm font-semibold text-gray-900 mb-4">Products</h3> <h3 className="text-sm font-semibold text-gray-900 mb-4">Products</h3>
{loadingProducts ? ( {loadingProducts ? (
@ -544,7 +575,7 @@ const EstablishmentInfo = ({
<div className="text-gray-500 text-sm py-2">No products found for this establishment.</div> <div className="text-gray-500 text-sm py-2">No products found for this establishment.</div>
)} )}
</Card> </Card>
<div className="mt-6"> <div className="mt-6">
{/* Employee Information */} {/* Employee Information */}
<Card> <Card>
@ -600,7 +631,7 @@ const EstablishmentInfo = ({
/> />
</div> </div>
</Card> </Card>
{/* <Card className="mt-10"> {/* <Card className="mt-10">
<h3 className="text-sm font-semibold text-gray-900 mb-4">Products</h3> <h3 className="text-sm font-semibold text-gray-900 mb-4">Products</h3>
{loadingProducts ? ( {loadingProducts ? (
@ -653,8 +684,8 @@ const EstablishmentInfo = ({
)} )}
</Card> */} </Card> */}
{/* Products Table */} {/* Products Table */}
{/* Blue Info Box */} {/* Blue Info Box */}
<div className="bg-[#E8F3FF] border border-[#2F80ED] text-[#0B4DA2] px-4 py-2 rounded-md mt-3 flex items-center gap-2 text-sm"> <div className="bg-[#E8F3FF] border border-[#2F80ED] text-[#0B4DA2] px-4 py-2 rounded-md mt-3 flex items-center gap-2 text-sm">
<svg <svg
@ -684,7 +715,7 @@ const EstablishmentInfo = ({
href={`/admin/configuration/profile/edit=${sessionStorage.getItem('establishment_id') || ''}`} href={`/admin/configuration/profile/edit=${sessionStorage.getItem('establishment_id') || ''}`}
className="underline font-medium text-[#043DFF] hover:text-[#063B82]" className="underline font-medium text-[#043DFF] hover:text-[#063B82]"
onClick={handleEditProfile} onClick={handleEditProfile}
> >
Edit Profile Edit Profile
</a> </a>
@ -699,11 +730,11 @@ const EstablishmentInfo = ({
> >
Edit Profile Edit Profile
</a> </a>
. Changes saved there will appear here. . Changes saved there will appear here.
</p> </p>
</div> </div>
{/* Footer actions */} {/* Footer actions */}
<div className="mt-8 flex flex-col sm:flex-row justify-between gap-3"> <div className="mt-8 flex flex-col sm:flex-row justify-between gap-3">
<button <button
@ -724,7 +755,7 @@ const EstablishmentInfo = ({
</svg> </svg>
</button> </button>
</div> </div>
{(loading || error) && ( {(loading || error) && (
<div className="mt-3"> <div className="mt-3">
{loading && <p className="text-sm text-[#5F646D]">Loading establishment information…</p>} {loading && <p className="text-sm text-[#5F646D]">Loading establishment information…</p>}
@ -735,5 +766,5 @@ const EstablishmentInfo = ({
</div> </div>
); );
}; };
export default EstablishmentInfo; export default EstablishmentInfo;

67
ipi-survey-platform/src/components/survey/ProductData/ProductData.jsx
View File

@ -333,7 +333,15 @@ const SectionBox = ({ title, children, badgeBg = 'bg-white', badgeText = 'text-g
<div className="rounded-md ring-1 ring-gray-200 bg-white"> <div className="rounded-md ring-1 ring-gray-200 bg-white">
<div className="p-5"> <div className="p-5">
<div className="font-medium mb-2"> <div className="font-medium mb-2">
<span className={`inline-flex items-center rounded text-sm font-medium px-2 py-1 ${badgeBg} ${badgeText}`}> <span
className="inline-flex items-center rounded text-sm font-medium px-2 py-1"
style={{
backgroundColor: badgeBg.startsWith('#') ? badgeBg : undefined,
color: badgeText.startsWith('#') ? badgeText : undefined,
...(badgeBg.startsWith('#') ? {} : { backgroundColor: badgeBg }),
...(badgeText.startsWith('#') ? {} : { color: badgeText })
}}
>
{title} {title}
</span> </span>
</div> </div>
@ -400,15 +408,30 @@ const ProductData = ({
useEffect(() => { useEffect(() => {
const fetchQuarterPeriods = async () => { const fetchQuarterPeriods = async () => {
try { try {
// Try to get survey period from localStorage
const savedSurveyPeriod = localStorage.getItem('currentSurveyPeriod');
let periodYear = year; let periodYear = year;
let periodQuarter = quarter; let periodQuarter = quarter;
if (savedSurveyPeriod) { // For resubmission, use the submission's quarter/year
const { quarter: savedQuarter, year: savedYear } = JSON.parse(savedSurveyPeriod); if (location.state?.fromResubmit && quarter && year) {
periodYear = savedYear || year; periodYear = year;
periodQuarter = savedQuarter || quarter; periodQuarter = quarter;
}
// For new survey, use the quarter/year from location state if available
else if (location.state?.survey) {
const { quarter: surveyQuarter, year: surveyYear } = location.state.survey;
if (surveyQuarter && surveyYear) {
periodQuarter = surveyQuarter;
periodYear = surveyYear;
}
}
// Fallback to localStorage or props
else {
const savedSurveyPeriod = localStorage.getItem('currentSurveyPeriod');
if (savedSurveyPeriod) {
const { quarter: savedQuarter, year: savedYear } = JSON.parse(savedSurveyPeriod);
periodYear = savedYear || year;
periodQuarter = savedQuarter || quarter;
}
} }
if (!periodQuarter || !periodYear) { if (!periodQuarter || !periodYear) {
@ -417,7 +440,7 @@ const ProductData = ({
} }
setIsLoadingPeriods(true); setIsLoadingPeriods(true);
const quarterNumber = periodQuarter.replace('Q', ''); // Convert 'Q3' to '3' const quarterNumber = periodQuarter.startsWith('Q') ? periodQuarter.replace('Q', '') : periodQuarter;
const response = await getQuarterPeriods(parseInt(periodYear), `Q${quarterNumber}`); const response = await getQuarterPeriods(parseInt(periodYear), `Q${quarterNumber}`);
setQuarterPeriods(response.data); setQuarterPeriods(response.data);
} catch (error) { } catch (error) {
@ -1108,6 +1131,28 @@ const location = useLocation();
displayYear = savedYear || year; displayYear = savedYear || year;
} }
// For resubmission, use the submission's quarter/year
if (location.state?.fromResubmit && quarter && year) {
return (
<div className="text-sm font-medium text-gray-600">
Quarter: <span className="text-[#92722A]">{quarter}-{year}</span>
</div>
);
}
// For new survey, use the quarter/year from location state if available
if (location.state?.survey) {
const { quarter: surveyQuarter, year: surveyYear } = location.state.survey;
if (surveyQuarter && surveyYear) {
return (
<div className="text-sm font-medium text-gray-600">
Quarter: <span className="text-[#92722A]">{surveyQuarter}-{surveyYear}</span>
</div>
);
}
}
// Fallback to the values from props or local storage
return (displayQuarter || displayYear) ? ( return (displayQuarter || displayYear) ? (
<div className="text-sm font-medium text-gray-600"> <div className="text-sm font-medium text-gray-600">
Quarter: <span className="text-[#92722A]">{displayQuarter}-{displayYear}</span> Quarter: <span className="text-[#92722A]">{displayQuarter}-{displayYear}</span>
@ -1550,8 +1595,8 @@ const location = useLocation();
<SectionBox <SectionBox
title={quarterPeriods ? `CURRENT QUARTER (${quarterPeriods.current_quarter} ${quarterPeriods.current_year})` : `CURRENT QUARTER (${quarter}-${year})`} title={quarterPeriods ? `CURRENT QUARTER (${quarterPeriods.current_quarter} ${quarterPeriods.current_year})` : `CURRENT QUARTER (${quarter}-${year})`}
badgeBg="#F3FAF4" badgeBg="#F0FDF4"
badgeText="#2F663C" badgeText="#166534"
> >
<div className="space-y-4"> <div className="space-y-4">
<div className="flex items-end space-x-4"> <div className="flex items-end space-x-4">

2
ipi-survey-platform/src/pages/Admin/configuration/CompanyProfile.jsx
View File

@ -2025,7 +2025,7 @@ const displayedRows = sortedProfiles.map((item) => {
emirate: establishmentEmirateName, emirate: establishmentEmirateName,
isicCode: item?.isic_code ?? '', isicCode: item?.isic_code ?? '',
industryCodeBusiness: item?.industry_code, industryCodeBusiness: item?.industry_code,
industryCodeProduction: item?.industry_code_production, industryCodeProduction: item?.isic_code,
industryCodeCurrent: item?.industryCodeCurrent, industryCodeCurrent: item?.industryCodeCurrent,
industryCodeMismatchRemarks: item?.industry_code_mismatch_remarks ?? '', industryCodeMismatchRemarks: item?.industry_code_mismatch_remarks ?? '',
industryDescription: item?.description ?? base.industryDescription, industryDescription: item?.description ?? base.industryDescription,

17
ipi-survey-platform/src/pages/Admin/configuration/EditCompanyProfile.jsx
View File

@ -42,9 +42,9 @@ const mapApiEstablishmentToProfile = (apiData) => {
userProfileEmail: data.users?.[0]?.email || '', userProfileEmail: data.users?.[0]?.email || '',
permanentFactoryCode: data.permanent_factory_code || '', permanentFactoryCode: data.permanent_factory_code || '',
uniqueLicenseNumber: data.license_number || '', uniqueLicenseNumber: data.license_number || '',
industryCodeBusiness: data.industry_code_production || '', industryCodeBusiness: data.industry_code || '',
industryCodeCurrent: data.industry_code || '', industryCodeCurrent: data.isic_code || '',
industryCodeMismatchRemarks: data.industry_code_mismatch_remarks || '', industryCodeMismatchRemarks: data.industry_code_mismatch_remarks || '',
contactName: data.factory_name || '', contactName: data.factory_name || '',
contactAddress: data.establishment_address || '', contactAddress: data.establishment_address || '',
contactCityTown: data.establishment_city?.name || '', contactCityTown: data.establishment_city?.name || '',
@ -197,7 +197,13 @@ const EditCompanyProfile = () => {
if (field === 'userProfileConfirmPassword') { if (field === 'userProfileConfirmPassword') {
setConfirmError(""); setConfirmError("");
} }
}, []); if (field === 'industryCodeMismatchRemarks') {
setForm(prev => ({
...prev,
industryCodeMismatchRemarks: value
}));
}
}, [fieldErrors]);
const handleNext = useCallback(() => { const handleNext = useCallback(() => {
if (validateStepFields(activeStep)) { if (validateStepFields(activeStep)) {
@ -581,6 +587,7 @@ const EditCompanyProfile = () => {
industry_code: form.industryCodeBusiness || "", industry_code: form.industryCodeBusiness || "",
license_number: form.uniqueLicenseNumber || "", license_number: form.uniqueLicenseNumber || "",
industry_code_production: form.industryCodeCurrent || "", industry_code_production: form.industryCodeCurrent || "",
industry_code_mismatch_remarks: form.industryCodeMismatchRemarks || null,
description: form.industryDescription || "", description: form.industryDescription || "",
establishment_address: form.contactAddress || "", establishment_address: form.contactAddress || "",
establishment_city_town_id: selectedCity ? Number(selectedCity.value) : null, establishment_city_town_id: selectedCity ? Number(selectedCity.value) : null,
@ -730,7 +737,7 @@ const EditCompanyProfile = () => {
rows={3} rows={3}
/> />
</div> </div>
{form.industryCodeCurrent && form.industryCodeBusiness !== form.industryCodeCurrent && ( {form.industryCodeBusiness && form.industryCodeBusiness !== form.industryCodeCurrent && (
<div className="col-span-full"> <div className="col-span-full">
<TextField <TextField
label="Remarks" label="Remarks"