yogiedigital/cod-fe
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: integrate sparepart management into AddBrandDevice and EditBrandDevice components

Browse Source
This commit is contained in:
vinix
2025-11-24 21:25:24 +07:00
parent b05e3fe5d9
commit 3e384f89b1
5 changed files with 440 additions and 322 deletions
Download Patch File Download Diff File Expand all files Collapse all files

80
src/pages/master/brandDevice/EditBrandDevice.jsx
View File

@@ -23,10 +23,12 @@ import { getFileUrl } from '../../../api/file-uploads';
import BrandForm from './component/BrandForm';
import ErrorCodeSimpleForm from './component/ErrorCodeSimpleForm';
import SolutionForm from './component/SolutionForm';
import SparepartForm from './component/SparepartForm';
import ErrorCodeListModal from './component/ErrorCodeListModal';
import FormActions from './component/FormActions';
import { useErrorCodeLogic } from './hooks/errorCode';
import { useSolutionLogic } from './hooks/solution';
import { useSparepartLogic } from './hooks/sparepart';
import { EditOutlined, DeleteOutlined, EyeOutlined } from '@ant-design/icons';
const { Title } = Typography;
@@ -58,6 +60,7 @@ const EditBrandDevice = () => {
const [errorCodes, setErrorCodes] = useState([]);
const [errorCodeIcon, setErrorCodeIcon] = useState(null);
const [solutionForm] = Form.useForm();
const [sparepartForm] = Form.useForm();
const { errorCodeFields, addErrorCode, removeErrorCode, editErrorCode } = useErrorCodeLogic(
errorCodeForm,
@@ -77,6 +80,20 @@ const EditBrandDevice = () => {
setSolutionsForExistingRecord,
} = useSolutionLogic(solutionForm);
const {
sparepartFields,
sparepartTypes,
sparepartStatuses,
sparepartsToDelete,
handleAddSparepartField,
handleRemoveSparepartField,
handleSparepartTypeChange,
handleSparepartStatusChange,
resetSparepartFields,
getSparepartData,
setSparepartsForExistingRecord,
} = useSparepartLogic(sparepartForm);
useEffect(() => {
const fetchBrandData = async () => {
const token = localStorage.getItem('token');
@@ -139,6 +156,7 @@ const EditBrandDevice = () => {
path_icon: ec.path_icon || '',
status: ec.is_active,
solution: ec.solution || [],
sparepart: ec.sparepart || [],
errorCodeIcon: ec.path_icon
? {
name: 'icon',
@@ -226,6 +244,12 @@ const EditBrandDevice = () => {
path_solution: sol.path_solution || '',
is_active: sol.is_active !== false,
})),
sparepart: (ec.sparepart || []).map((sp) => ({
sparepart_name: sp.sparepart_name || sp.name || sp.label || '',
brand_sparepart_description: sp.brand_sparepart_description || sp.description || sp.brand_sparepart_description || '',
is_active: sp.is_active !== false,
path_foto: sp.path_foto || '',
})),
};
}
@@ -244,6 +268,14 @@ const EditBrandDevice = () => {
path_solution: sol.path_solution || '',
is_active: sol.is_active !== false,
})),
...(ec.sparepart && ec.sparepart.length > 0 && {
sparepart: ec.sparepart.map((sp) => ({
sparepart_name: sp.sparepart_name || sp.name || sp.label || '',
brand_sparepart_description: sp.brand_sparepart_description || sp.description || sp.brand_sparepart_description || '',
is_active: sp.is_active !== false,
path_foto: sp.path_foto || '',
})),
}),
};
}),
};
@@ -294,6 +326,13 @@ const EditBrandDevice = () => {
} else {
resetSolutionFields();
}
// Load spareparts to sparepart form
if (record.sparepart && record.sparepart.length > 0) {
setSparepartsForExistingRecord(record.sparepart, sparepartForm);
} else {
resetSparepartFields();
}
};
const handleEditErrorCode = (record) => {
@@ -313,6 +352,11 @@ const EditBrandDevice = () => {
setSolutionsForExistingRecord(record.solution, solutionForm);
}
// Load spareparts to sparepart form
if (record.sparepart && record.sparepart.length > 0) {
setSparepartsForExistingRecord(record.sparepart, sparepartForm);
}
const formElement = document.querySelector('.ant-form');
if (formElement) {
formElement.scrollIntoView({ behavior: 'smooth', block: 'start' });
@@ -336,6 +380,9 @@ const EditBrandDevice = () => {
return;
}
// Get sparepart data from sparepart form
const sparepartData = getSparepartData();
// Create complete error code object
const newErrorCode = {
error_code: errorCodeValues.error_code,
@@ -345,6 +392,7 @@ const EditBrandDevice = () => {
path_icon: errorCodeIcon?.uploadPath || '',
status: errorCodeValues.status === undefined ? true : errorCodeValues.status,
solution: solutionData,
...(sparepartData && sparepartData.length > 0 && { sparepart: sparepartData }),
errorCodeIcon: errorCodeIcon,
key: editingErrorCodeKey || `temp-${Date.now()}`,
};
@@ -402,6 +450,7 @@ const EditBrandDevice = () => {
setFileList([]);
setErrorCodeIcon(null);
resetSolutionFields();
resetSparepartFields();
setIsErrorCodeFormReadOnly(false);
setEditingErrorCodeKey(null);
};
@@ -428,6 +477,7 @@ const EditBrandDevice = () => {
const handleCreateNewErrorCode = () => {
resetErrorCodeForm();
resetSolutionFields();
resetSparepartFields();
setErrorCodeIcon(null);
setIsErrorCodeFormReadOnly(false);
setEditingErrorCodeKey(null);
@@ -496,7 +546,7 @@ const EditBrandDevice = () => {
return (
<>
<Row gutter={24}>
<Col span={6}>
<Col span={8}>
<Card
title={
<Title level={5} style={{ margin: 0 }}>
@@ -562,7 +612,33 @@ const EditBrandDevice = () => {
</Form>
</Card>
</Col>
<Col span={10}>
<Col span={8}>
<Card
title={
<Title level={5} style={{ margin: 0 }}>
Spareparts
</Title>
}
size="small"
>
<Form
form={sparepartForm}
layout="vertical"
initialValues={{
sparepart_status_0: true,
}}
>
<SparepartForm
sparepartForm={sparepartForm}
sparepartFields={sparepartFields}
onAddSparepartField={handleAddSparepartField}
onRemoveSparepartField={handleRemoveSparepartField}
isReadOnly={isErrorCodeFormReadOnly}
/>
</Form>
</Card>
</Col>
<Col span={24} style={{ marginTop: 16 }}>
<Card size="small" title={`Error Codes (${errorCodes.length})`}>
<Table
dataSource={errorCodes}