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

30:70 interface brand device

Browse Source
This commit is contained in:
Vinix
2025-10-28 12:20:54 +07:00
parent 1d408ef3c1
commit 9a483aa873
2 changed files with 193 additions and 120 deletions
Download Patch File Download Diff File Expand all files Collapse all files

140
src/pages/master/brandDevice/AddBrandDevice.jsx
View File

@@ -49,16 +49,29 @@ const AddBrandDevice = () => {
handleSolutionStatusChange,
resetSolutionFields,
checkFirstSolutionValid,
setSolutionsForExistingRecord
setSolutionsForExistingRecord,
} = useErrorCodeLogic(errorCodeForm, fileList);
useEffect(() => {
setBreadcrumbItems([
{ title: <span style={{ fontSize: '14px', fontWeight: 'bold' }}>• Master</span> },
{
title: <span style={{ fontSize: '14px', fontWeight: 'bold', cursor: 'pointer' }} onClick={() => navigate('/master/brand-device')}>Brand Device</span>
title: (
<span
style={{ fontSize: '14px', fontWeight: 'bold', cursor: 'pointer' }}
onClick={() => navigate('/master/brand-device')}
>
Brand Device
</span>
),
},
{
title: (
<span style={{ fontSize: '14px', fontWeight: 'bold' }}>
Tambah Brand Device
</span>
),
},
{ title: <span style={{ fontSize: '14px', fontWeight: 'bold' }}>Tambah Brand Device</span> }
]);
}, [setBreadcrumbItems, navigate]);
@@ -71,25 +84,29 @@ const AddBrandDevice = () => {
await brandForm.validateFields();
setCurrentStep(1);
} catch (error) {
NotifAlert({ icon: 'warning', title: 'Perhatian', message: 'Harap isi semua kolom wajib untuk brand device!' });
NotifAlert({
icon: 'warning',
title: 'Perhatian',
message: 'Harap isi semua kolom wajib untuk brand device!',
});
}
};
const handleFinish = async () => {
setConfirmLoading(true);
try {
const transformedErrorCodes = errorCodes.map(ec => ({
const transformedErrorCodes = errorCodes.map((ec) => ({
error_code: ec.error_code,
error_code_name: ec.error_code_name || '',
error_code_description: ec.error_code_description || '',
is_active: ec.status !== undefined ? ec.status : true,
solution: (ec.solution || []).map(sol => ({
solution: (ec.solution || []).map((sol) => ({
solution_name: sol.solution_name,
type_solution: sol.type_solution,
text_solution: sol.text_solution || '',
path_solution: sol.path_solution || '',
is_active: sol.is_active !== false
}))
is_active: sol.is_active !== false,
})),
}));
const finalFormData = {
@@ -98,23 +115,26 @@ const AddBrandDevice = () => {
brand_model: formData.brand_model || '',
brand_manufacture: formData.brand_manufacture,
is_active: formData.is_active,
error_code: transformedErrorCodes.length > 0 ? transformedErrorCodes : [
{
error_code: "DEFAULT",
error_code_name: "Default Error Code",
error_code_description: "Default error description",
is_active: true,
solution: [
{
solution_name: "Default Solution",
type_solution: "text",
text_solution: "Default solution text",
path_solution: "",
is_active: true
}
]
}
]
error_code:
transformedErrorCodes.length > 0
? transformedErrorCodes
: [
{
error_code: 'DEFAULT',
error_code_name: 'Default Error Code',
error_code_description: 'Default error description',
is_active: true,
solution: [
{
solution_name: 'Default Solution',
type_solution: 'text',
text_solution: 'Default solution text',
path_solution: '',
is_active: true,
},
],
},
],
};
const response = await createBrand(finalFormData);
@@ -135,9 +155,9 @@ const AddBrandDevice = () => {
}
} catch (error) {
NotifAlert({
icon: "error",
title: "Gagal",
message: error.message || "Gagal menyimpan data. Silakan coba lagi.",
icon: 'error',
title: 'Gagal',
message: error.message || 'Gagal menyimpan data. Silakan coba lagi.',
});
} finally {
setConfirmLoading(false);
@@ -178,12 +198,14 @@ const AddBrandDevice = () => {
const handleAddErrorCode = async (newErrorCode) => {
if (editingErrorCodeKey) {
const updatedCodes = errorCodes.map(item => item.key === editingErrorCodeKey ? newErrorCode : item);
const updatedCodes = errorCodes.map((item) =>
item.key === editingErrorCodeKey ? newErrorCode : item
);
setErrorCodes(updatedCodes);
NotifOk({
icon: 'success',
title: 'Berhasil',
message: 'Error code berhasil diupdate!'
message: 'Error code berhasil diupdate!',
});
} else {
const updatedCodes = [...errorCodes, newErrorCode];
@@ -191,7 +213,7 @@ const AddBrandDevice = () => {
NotifOk({
icon: 'success',
title: 'Berhasil',
message: 'Error code berhasil ditambahkan!'
message: 'Error code berhasil ditambahkan!',
});
}
@@ -203,7 +225,7 @@ const AddBrandDevice = () => {
errorCodeForm.setFieldsValue({
status: true,
solution_status_0: true,
solution_type_0: 'text'
solution_type_0: 'text',
});
setFileList([]);
resetSolutionFields();
@@ -220,16 +242,16 @@ const AddBrandDevice = () => {
NotifAlert({
icon: 'warning',
title: 'Perhatian',
message: 'Setiap brand harus memiliki minimal 1 error code!'
message: 'Setiap brand harus memiliki minimal 1 error code!',
});
return;
}
setErrorCodes(errorCodes.filter(item => item.key !== key));
setErrorCodes(errorCodes.filter((item) => item.key !== key));
NotifOk({
icon: 'success',
title: 'Berhasil',
message: 'Error code berhasil dihapus!'
message: 'Error code berhasil dihapus!',
});
};
@@ -248,12 +270,17 @@ const AddBrandDevice = () => {
const handleSolutionFileUpload = async (file) => {
try {
const isAllowedType = ['application/pdf', 'image/jpeg', 'image/png', 'image/gif'].includes(file.type);
const isAllowedType = [
'application/pdf',
'image/jpeg',
'image/png',
'image/gif',
].includes(file.type);
if (!isAllowedType) {
NotifAlert({
icon: 'error',
title: 'Error',
message: `${file.name} bukan file PDF atau gambar yang diizinkan.`
message: `${file.name} bukan file PDF atau gambar yang diizinkan.`,
});
return;
}
@@ -271,17 +298,17 @@ const AddBrandDevice = () => {
file.solution_name = file.name;
file.solutionId = solutionFields[0];
file.type_solution = fileType;
setFileList(prevList => [...prevList, file]);
setFileList((prevList) => [...prevList, file]);
NotifOk({
icon: 'success',
title: 'Berhasil',
message: `${file.name} berhasil diupload!`
message: `${file.name} berhasil diupload!`,
});
} else {
NotifAlert({
icon: 'error',
title: 'Gagal',
message: `Gagal mengupload ${file.name}`
message: `Gagal mengupload ${file.name}`,
});
}
} catch (error) {
@@ -289,13 +316,13 @@ const AddBrandDevice = () => {
NotifAlert({
icon: 'error',
title: 'Error',
message: `Gagal mengupload ${file.name}. Silakan coba lagi.`
message: `Gagal mengupload ${file.name}. Silakan coba lagi.`,
});
}
};
const handleFileRemove = (file) => {
const newFileList = fileList.filter(item => item.uid !== file.uid);
const newFileList = fileList.filter((item) => item.uid !== file.uid);
setFileList(newFileList);
};
@@ -305,7 +332,9 @@ const AddBrandDevice = () => {
<BrandForm
form={brandForm}
formData={formData}
onValuesChange={(changedValues, allValues) => setFormData(prev => ({...prev, ...allValues}))}
onValuesChange={(changedValues, allValues) =>
setFormData((prev) => ({ ...prev, ...allValues }))
}
isEdit={false}
/>
);
@@ -314,17 +343,22 @@ const AddBrandDevice = () => {
if (currentStep === 1) {
return (
<Row gutter={24}>
<Col span={12}>
<Col span={8}>
<Title level={5} style={{ marginBottom: 16 }}>
{isErrorCodeFormReadOnly
? 'View Error Code'
: (editingErrorCodeKey ? 'Edit Error Code' : 'Tambah Error Code')
}
: editingErrorCodeKey
? 'Edit Error Code'
: 'Tambah Error Code'}
</Title>
<Form
form={errorCodeForm}
layout="vertical"
initialValues={{ status: true, solution_status_0: true, solution_type_0: 'text' }}
initialValues={{
status: true,
solution_status_0: true,
solution_type_0: 'text',
}}
onValuesChange={checkFirstSolutionValid}
>
<ErrorCodeForm
@@ -350,7 +384,7 @@ const AddBrandDevice = () => {
/>
</Form>
</Col>
<Col span={12}>
<Col span={16}>
<ErrorCodeTable
errorCodes={errorCodes}
loading={loading}
@@ -368,14 +402,14 @@ const AddBrandDevice = () => {
return (
<Card>
<Title level={4} style={{ margin: '0 0 24px 0' }}>Tambah Brand Device</Title>
<Title level={4} style={{ margin: '0 0 24px 0' }}>
Tambah Brand Device
</Title>
<Steps current={currentStep} style={{ marginBottom: 24 }}>
<Step title="Brand Device Details" />
<Step title="Error Codes" />
</Steps>
<div style={{ marginTop: 24 }}>
{renderStepContent()}
</div>
<div style={{ marginTop: 24 }}>{renderStepContent()}</div>
<Divider />
<FormActions
currentStep={currentStep}
@@ -390,4 +424,4 @@ const AddBrandDevice = () => {
);
};
export default AddBrandDevice;
export default AddBrandDevice;