added dropdown field for industry field
This commit is contained in:
parent
6236ebdf2d
commit
8725f6d622
@ -3,7 +3,7 @@ import { useNavigate } from 'react-router-dom';
|
|||||||
import Table from '@/components/common/Table';
|
import Table from '@/components/common/Table';
|
||||||
import Loader from '@/components/common/Loader';
|
import Loader from '@/components/common/Loader';
|
||||||
import { TextField, SelectField, PhoneField } from '@/components/common/FormControls';
|
import { TextField, SelectField, PhoneField } from '@/components/common/FormControls';
|
||||||
import { fetchEmirates, fetchCityTowns } from '@/services/masters/masterService';
|
import { fetchEmirates, fetchCityTowns, fetchIsicMaster } from '@/services/masters/masterService';
|
||||||
import {
|
import {
|
||||||
createEstablishment,
|
createEstablishment,
|
||||||
fetchEstablishments,
|
fetchEstablishments,
|
||||||
@ -494,6 +494,7 @@ const CompanyProfile = () => {
|
|||||||
const [emirateLookup, setEmirateLookup] = React.useState({});
|
const [emirateLookup, setEmirateLookup] = React.useState({});
|
||||||
const [contactCityOptions, setContactCityOptions] = React.useState([]);
|
const [contactCityOptions, setContactCityOptions] = React.useState([]);
|
||||||
const [corporateCityOptions, setCorporateCityOptions] = React.useState([]);
|
const [corporateCityOptions, setCorporateCityOptions] = React.useState([]);
|
||||||
|
const [isicOptions, setIsicOptions] = React.useState([]);
|
||||||
const [fieldErrors, setFieldErrors] = React.useState({});
|
const [fieldErrors, setFieldErrors] = React.useState({});
|
||||||
const [isDirty, setIsDirty] = React.useState(false);
|
const [isDirty, setIsDirty] = React.useState(false);
|
||||||
const initialSnapshotRef = React.useRef(createEmptyProfile());
|
const initialSnapshotRef = React.useRef(createEmptyProfile());
|
||||||
@ -1026,15 +1027,17 @@ const CompanyProfile = () => {
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div>
|
<div>
|
||||||
<TextField
|
<SelectField
|
||||||
label="Industry Code(Current Production)"
|
label="Industry Code(Current Production)"
|
||||||
value={form.industryCodeProduction}
|
value={form.industryCodeProduction}
|
||||||
onChange={handleFormChange('industryCodeProduction')}
|
onChange={handleFormChange('industryCodeProduction')}
|
||||||
placeholder="Enter Code"
|
placeholder="Select ISIC Code"
|
||||||
className="w-full"
|
className="w-full"
|
||||||
required
|
required
|
||||||
error={fieldErrors.industryCodeProduction}
|
error={fieldErrors.industryCodeProduction}
|
||||||
readOnly={modalMode === 'view'}
|
readOnly={modalMode === 'view'}
|
||||||
|
options={isicOptions}
|
||||||
|
searchable
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -1885,6 +1888,28 @@ const displayedRows = sortedProfiles.map((item) => {
|
|||||||
cancelled = true;
|
cancelled = true;
|
||||||
controller.abort();
|
controller.abort();
|
||||||
};
|
};
|
||||||
|
}, []);
|
||||||
|
|
||||||
|
React.useEffect(() => {
|
||||||
|
let cancelled = false;
|
||||||
|
const controller = new AbortController();
|
||||||
|
const loadIsicOptions = async () => {
|
||||||
|
try {
|
||||||
|
const options = await fetchIsicMaster({ signal: controller.signal });
|
||||||
|
if (cancelled) return;
|
||||||
|
setIsicOptions(options);
|
||||||
|
} catch (error) {
|
||||||
|
if (cancelled) return;
|
||||||
|
console.error('Failed to load ISIC master data.', error);
|
||||||
|
const message = error?.response?.data?.message || error?.message || 'Unable to load ISIC codes.';
|
||||||
|
showToast('error', message);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
loadIsicOptions();
|
||||||
|
return () => {
|
||||||
|
cancelled = true;
|
||||||
|
controller.abort();
|
||||||
|
};
|
||||||
}, [showToast]);
|
}, [showToast]);
|
||||||
|
|
||||||
const loadContactCityOptions = React.useCallback(
|
const loadContactCityOptions = React.useCallback(
|
||||||
|
|||||||
@ -6,7 +6,7 @@ import { IoMdCheckbox, IoMdCheckboxOutline } from "react-icons/io";
|
|||||||
import { TextField, SelectField, PhoneField } from "@/components/common/FormControls";
|
import { TextField, SelectField, PhoneField } from "@/components/common/FormControls";
|
||||||
import Loader from "@/components/common/Loader";
|
import Loader from "@/components/common/Loader";
|
||||||
import { fetchEstablishmentDetail, updateEstablishment } from '@/services/establishments/establishmentService';
|
import { fetchEstablishmentDetail, updateEstablishment } from '@/services/establishments/establishmentService';
|
||||||
import { fetchEmirates, fetchCityTowns, fetchProducts } from '@/services/masters/masterService';
|
import { fetchEmirates, fetchCityTowns, fetchProducts, fetchIsicMaster } from '@/services/masters/masterService';
|
||||||
import HeaderBar from "@/components/layout/HeaderBar";
|
import HeaderBar from "@/components/layout/HeaderBar";
|
||||||
|
|
||||||
// Helper functions
|
// Helper functions
|
||||||
@ -95,6 +95,7 @@ const EditCompanyProfile = () => {
|
|||||||
const [emirateOptions, setEmirateOptions] = useState([]);
|
const [emirateOptions, setEmirateOptions] = useState([]);
|
||||||
const [emirateLookup, setEmirateLookup] = useState({});
|
const [emirateLookup, setEmirateLookup] = useState({});
|
||||||
const [contactCityOptions, setContactCityOptions] = useState([]);
|
const [contactCityOptions, setContactCityOptions] = useState([]);
|
||||||
|
const [isicOptions, setIsicOptions] = useState([]);
|
||||||
const [availableProducts, setAvailableProducts] = useState([]);
|
const [availableProducts, setAvailableProducts] = useState([]);
|
||||||
const [selectedProducts, setSelectedProducts] = useState([]);
|
const [selectedProducts, setSelectedProducts] = useState([]);
|
||||||
const [newlyAddedProductIds, setNewlyAddedProductIds] = useState(new Set());
|
const [newlyAddedProductIds, setNewlyAddedProductIds] = useState(new Set());
|
||||||
@ -545,6 +546,30 @@ const EditCompanyProfile = () => {
|
|||||||
};
|
};
|
||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
|
// Load ISIC codes on component mount using your service function
|
||||||
|
useEffect(() => {
|
||||||
|
let cancelled = false;
|
||||||
|
const controller = new AbortController();
|
||||||
|
|
||||||
|
const loadIsicCodes = async () => {
|
||||||
|
try {
|
||||||
|
const isicCodes = await fetchIsicMaster({ signal: controller.signal });
|
||||||
|
if (cancelled) return;
|
||||||
|
setIsicOptions(isicCodes);
|
||||||
|
} catch (error) {
|
||||||
|
if (cancelled) return;
|
||||||
|
console.error('Failed to load ISIC codes:', error);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
loadIsicCodes();
|
||||||
|
|
||||||
|
return () => {
|
||||||
|
cancelled = true;
|
||||||
|
controller.abort();
|
||||||
|
};
|
||||||
|
}, []);
|
||||||
|
|
||||||
// Load establishment data and set form with API data
|
// Load establishment data and set form with API data
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
// Create an async function inside the effect
|
// Create an async function inside the effect
|
||||||
@ -840,11 +865,13 @@ const EditCompanyProfile = () => {
|
|||||||
error={fieldErrors.industryCodeBusiness}
|
error={fieldErrors.industryCodeBusiness}
|
||||||
/> */}
|
/> */}
|
||||||
<div className="whitespace-nowrap">
|
<div className="whitespace-nowrap">
|
||||||
<TextField
|
<SelectField
|
||||||
label="Industry Code (Current Production)"
|
label="Industry Code (Current Production)"
|
||||||
value={form.industryCodeCurrent || ""}
|
name="industryCodeCurrent"
|
||||||
|
value={form.industryCodeCurrent || ''}
|
||||||
onChange={(e) => handleFormChange("industryCodeCurrent", e.target.value)}
|
onChange={(e) => handleFormChange("industryCodeCurrent", e.target.value)}
|
||||||
placeholder="Enter Code"
|
options={isicOptions}
|
||||||
|
placeholder="Select Industry Code"
|
||||||
width="100%"
|
width="100%"
|
||||||
required
|
required
|
||||||
error={fieldErrors.industryCodeCurrent}
|
error={fieldErrors.industryCodeCurrent}
|
||||||
|
|||||||
@ -7,6 +7,7 @@ const endpoints = {
|
|||||||
units: '/unit_master',
|
units: '/unit_master',
|
||||||
emirates: '/emirates',
|
emirates: '/emirates',
|
||||||
cityTowns: '/city-towns',
|
cityTowns: '/city-towns',
|
||||||
|
isicMaster: '/searchIsicMaster',
|
||||||
};
|
};
|
||||||
|
|
||||||
const extractReasons = (payload) => {
|
const extractReasons = (payload) => {
|
||||||
@ -106,6 +107,24 @@ const toCityOption = (item) => {
|
|||||||
return null;
|
return null;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const toIsicOption = (item) => {
|
||||||
|
if (item === undefined || item === null) return null;
|
||||||
|
if (typeof item === 'string' || typeof item === 'number') {
|
||||||
|
const value = toStringOrNull(item);
|
||||||
|
return value ? { label: value, value } : null;
|
||||||
|
}
|
||||||
|
if (typeof item === 'object') {
|
||||||
|
const id = toStringOrNull(item.id ?? item.value ?? item.code);
|
||||||
|
const code = toStringOrNull(item.code);
|
||||||
|
const description = toStringOrNull(item.description ?? item.name ?? item.label);
|
||||||
|
const label = code && description ? `${code} - ${description}` : description ?? code ?? item.label;
|
||||||
|
const finalLabel = label ?? id;
|
||||||
|
if (!finalLabel) return null;
|
||||||
|
return { label: finalLabel, value: id ?? finalLabel, raw: item };
|
||||||
|
}
|
||||||
|
return null;
|
||||||
|
};
|
||||||
|
|
||||||
export const getVariationReasons = async (config = {}) => {
|
export const getVariationReasons = async (config = {}) => {
|
||||||
const response = await getRequest(endpoints.variationReasons, config);
|
const response = await getRequest(endpoints.variationReasons, config);
|
||||||
return response.data;
|
return response.data;
|
||||||
@ -174,6 +193,17 @@ export const fetchCityTowns = async ({ emirateId, signal } = {}) => {
|
|||||||
return list.map(toCityOption).filter(Boolean);
|
return list.map(toCityOption).filter(Boolean);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
export const getIsicMaster = async (config = {}) => {
|
||||||
|
const response = await getRequest(endpoints.isicMaster, config);
|
||||||
|
return response.data;
|
||||||
|
};
|
||||||
|
|
||||||
|
export const fetchIsicMaster = async ({ signal } = {}) => {
|
||||||
|
const data = await getIsicMaster({ signal });
|
||||||
|
const list = extractReasons(data);
|
||||||
|
return list.map(toIsicOption).filter(Boolean);
|
||||||
|
};
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
getVariationReasons,
|
getVariationReasons,
|
||||||
fetchVariationReasons,
|
fetchVariationReasons,
|
||||||
@ -187,4 +217,6 @@ export default {
|
|||||||
fetchEmirates,
|
fetchEmirates,
|
||||||
getCityTowns,
|
getCityTowns,
|
||||||
fetchCityTowns,
|
fetchCityTowns,
|
||||||
|
getIsicMaster,
|
||||||
|
fetchIsicMaster,
|
||||||
};
|
};
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user