feat: implement shift management with CRUD operations and local storage integration

This commit is contained in:
2025-10-13 20:26:29 +07:00
parent bfe38d5955
commit 5ed5ee26bf
3 changed files with 177 additions and 70 deletions

View File

@@ -45,22 +45,23 @@ const DetailShift = (props) => {
};
try {
const response = FormData.id
? await updateShift(FormData.id, payload)
: await createShift(payload);
if (response && (response.statusCode === 200 || response.statusCode === 201)) {
NotifOk({
icon: 'success',
title: 'Berhasil',
message: `Data Shift "${FormData.nama_shift}" berhasil ${FormData.id ? 'diubah' : 'ditambahkan'}.`,
});
props.setActionMode('list');
if (FormData.id) {
props.onUpdate(payload);
} else {
NotifAlert({ icon: 'error', title: 'Gagal', message: response?.message || 'Terjadi kesalahan saat menyimpan data.' });
props.onAdd(payload);
}
NotifOk({
icon: 'success',
title: 'Berhasil',
message: `Data Shift "${payload.nama_shift}" berhasil ${FormData.id ? 'diubah' : 'ditambahkan'}.`,
});
} catch (error) {
NotifAlert({ icon: 'error', title: 'Error', message: error.message || 'Terjadi kesalahan pada server.' });
console.error('Save Shift Error:', error);
NotifAlert({
icon: 'error',
title: 'Error',
message: error.message || 'Terjadi kesalahan pada server. Coba lagi nanti.',
});
}
setConfirmLoading(false);
@@ -89,28 +90,78 @@ const DetailShift = (props) => {
open={props.actionMode !== 'list'}
onCancel={handleCancel}
footer={[
<Button key="back" onClick={handleCancel}>Batal</Button>,
!readOnly && (
<Button key="submit" type="primary" loading={confirmLoading} onClick={handleSave}>
Simpan
</Button>
),
<>
<ConfigProvider
theme={{
token: { colorBgContainer: '#E9F6EF' },
components: {
Button: {
defaultBg: 'white',
defaultColor: '#23A55A',
defaultBorderColor: '#23A55A',
defaultHoverColor: '#23A55A',
defaultHoverBorderColor: '#23A55A',
},
},
}}
>
<Button onClick={handleCancel}>Batal</Button>
</ConfigProvider>
<ConfigProvider
theme={{
token: {
colorBgContainer: '#209652',
},
components: {
Button: {
defaultBg: '#23a55a',
defaultColor: '#FFFFFF',
defaultBorderColor: '#23a55a',
defaultHoverColor: '#FFFFFF',
defaultHoverBorderColor: '#23a55a',
},
},
}}
>
{!readOnly && (
<Button loading={confirmLoading} onClick={handleSave}>
Simpan
</Button>
)}
</ConfigProvider>
</>,
]}
>
{FormData && (
<div>
<div>
<Text strong>Status</Text>
<div style={{ display: 'flex', alignItems: 'center', marginTop: '8px' }}>
<Switch
disabled={readOnly}
checked={FormData.status}
onChange={handleStatusToggle}
/>
<Text style={{ marginLeft: '8px' }}>{FormData.status ? 'Active' : 'Inactive'}</Text>
<div>
<Text strong>Status</Text>
</div>
<div
style={{
display: 'flex',
alignItems: 'center',
marginTop: '8px',
}}
>
<div style={{ marginRight: '8px' }}>
<Switch
disabled={readOnly}
style={{
backgroundColor:
FormData.status === true ? '#23A55A' : '#bfbfbf',
}}
checked={FormData.status === true}
onChange={handleStatusToggle}
/>
</div>
<div>
<Text>{FormData.status === true ? 'Active' : 'Inactive'}</Text>
</div>
</div>
</div>
<Divider />
<Divider style={{ margin: '12px 0' }} />
<div style={{ marginBottom: 12 }}>
<Text strong>Nama Shift</Text>
<Text style={{ color: 'red' }}> *</Text>