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

update: add description field

Browse Source
This commit is contained in:
Rafiafrzl
2025-10-23 15:15:01 +07:00
parent 9ac2942ace
commit 1c3f80bc26
2 changed files with 68 additions and 128 deletions
Download Patch File Download Diff File Expand all files Collapse all files

195
src/pages/master/tag/component/DetailTag.jsx
View File

@@ -1,5 +1,5 @@
import React, { useEffect, useState } from 'react';
import { Modal, Input, Typography, Switch, Button, ConfigProvider, Divider, Select } from 'antd';
import { Modal, Input, Typography, Switch, Button, ConfigProvider, Select, Checkbox } from 'antd';
import { NotifAlert, NotifOk } from '../../../../components/Global/ToastNotif';
import { createTag, updateTag, getAllTag } from '../../../../api/master-tag';
import { getAllDevice } from '../../../../api/master-device';
@@ -34,6 +34,7 @@ const DetailTag = (props) => {
lim_high: '',
lim_high_crash: '',
device_id: null,
description: '',
sub_section_id: null,
};
@@ -147,10 +148,8 @@ const DetailTag = (props) => {
payload.unit = formData.unit.trim();
}
// Add device_id only if it's selected
if (formData.device_id) {
payload.device_id = parseInt(formData.device_id);
}
// Add device_id - backend requires this field even if null
payload.device_id = formData.device_id ? parseInt(formData.device_id) : null;
// Add limit fields only if they have values
if (formData.lim_low_crash !== '' && formData.lim_low_crash !== null) {
@@ -166,10 +165,8 @@ const DetailTag = (props) => {
payload.lim_high_crash = parseFloat(formData.lim_high_crash);
}
// Add sub_section_id only if it's selected
if (formData.sub_section_id) {
payload.sub_section_id = parseInt(formData.sub_section_id);
}
// Add sub_section_id - backend requires this field even if null
payload.sub_section_id = formData.sub_section_id ? parseInt(formData.sub_section_id) : null;
try {
const response =
@@ -234,24 +231,24 @@ const DetailTag = (props) => {
});
};
const handleAlarmToggle = (checked) => {
const handleAlarmToggle = (e) => {
setformData({
...formData,
is_alarm: checked,
is_alarm: e.target.checked,
});
};
const handleReportToggle = (checked) => {
const handleReportToggle = (e) => {
setformData({
...formData,
is_report: checked,
is_report: e.target.checked,
});
};
const handleHistoryToggle = (checked) => {
const handleHistoryToggle = (e) => {
setformData({
...formData,
is_history: checked,
is_history: e.target.checked,
});
};
@@ -336,7 +333,7 @@ const DetailTag = (props) => {
} Tag`}
open={props.showModal}
onCancel={handleCancel}
width={800}
width={1000}
footer={[
<React.Fragment key="modal-footer">
<ConfigProvider
@@ -403,114 +400,17 @@ const DetailTag = (props) => {
</div>
</div>
</div>
{/* Alarm, Report, dan History dalam satu baris */}
{/* Tag Code dan Alarm, Report dan History */}
<div style={{ marginBottom: 12 }}>
<div
style={{
display: 'flex',
justifyContent: 'space-between',
gap: '16px',
gap: '20px',
}}
>
{/* Alarm Toggle */}
<div style={{ flex: 1 }}>
<div>
<Text strong>Alarm</Text>
<Text style={{ color: 'red' }}> *</Text>
</div>
<div
style={{
display: 'flex',
alignItems: 'center',
marginTop: '8px',
}}
>
<div style={{ marginRight: '8px' }}>
<Switch
disabled={props.readOnly}
style={{
backgroundColor:
formData.is_alarm === true
? '#23A55A'
: '#bfbfbf',
}}
checked={formData.is_alarm === true}
onChange={handleAlarmToggle}
/>
</div>
<div>
<Text>{formData.is_alarm === true ? 'Yes' : 'No'}</Text>
</div>
</div>
</div>
{/* Report Toggle */}
<div style={{ flex: 1 }}>
<div>
<Text strong>Report</Text>
<Text style={{ color: 'red' }}> *</Text>
</div>
<div
style={{
display: 'flex',
alignItems: 'center',
marginTop: '8px',
}}
>
<div style={{ marginRight: '8px' }}>
<Switch
disabled={props.readOnly}
style={{
backgroundColor:
formData.is_report === true
? '#23A55A'
: '#bfbfbf',
}}
checked={formData.is_report === true}
onChange={handleReportToggle}
/>
</div>
<div>
<Text>{formData.is_report === true ? 'Yes' : 'No'}</Text>
</div>
</div>
</div>
{/* History Toggle */}
<div style={{ flex: 1 }}>
<div>
<Text strong>History</Text>
<Text style={{ color: 'red' }}> *</Text>
</div>
<div
style={{
display: 'flex',
alignItems: 'center',
marginTop: '8px',
}}
>
<div style={{ marginRight: '8px' }}>
<Switch
disabled={props.readOnly}
style={{
backgroundColor:
formData.is_history === true
? '#23A55A'
: '#bfbfbf',
}}
checked={formData.is_history === true}
onChange={handleHistoryToggle}
/>
</div>
<div>
<Text>{formData.is_history === true ? 'Yes' : 'No'}</Text>
</div>
</div>
</div>
</div>
</div>
<Divider style={{ margin: '12px 0' }} />
{/* Tag Code - Auto Increment & Read Only */}
<div style={{ marginBottom: 12 }}>
<div style={{ flex: 1 }}>
<Text strong>Tag Code</Text>
<Input
name="tag_code"
@@ -524,6 +424,42 @@ const DetailTag = (props) => {
}}
/>
</div>
{/* Alarm Checkbox */}
<div style={{ flex: 1 }}>
<Text strong>Alarm</Text>
<div style={{ marginTop: '8px' }}>
<Checkbox
disabled={props.readOnly}
checked={formData.is_alarm === true}
onChange={handleAlarmToggle}
/>
</div>
</div>
{/* Report Checkbox */}
<div style={{ flex: 1 }}>
<Text strong>Report</Text>
<div style={{ marginTop: '8px' }}>
<Checkbox
disabled={props.readOnly}
checked={formData.is_report === true}
onChange={handleReportToggle}
/>
</div>
</div>
{/* History Checkbox */}
<div style={{ flex: 1 }}>
<Text strong>History</Text>
<div>
<Checkbox
disabled={props.readOnly}
checked={formData.is_history === true}
onChange={handleHistoryToggle}
/>
</div>
</div>
</div>
</div>
{/* Tag Number dan Tag Name dalam satu baris */}
<div style={{ marginBottom: 12 }}>
<div
@@ -685,13 +621,13 @@ const DetailTag = (props) => {
</div>
</div>
</div>
{/* Limit Low Crash dan Limit Low dalam satu baris */}
{/* Semua Limit dalam satu baris */}
<div style={{ marginBottom: 12 }}>
<div
style={{
display: 'flex',
justifyContent: 'space-between',
gap: '16px',
gap: '12px',
}}
>
{/* Limit Low Crash */}
@@ -720,17 +656,6 @@ const DetailTag = (props) => {
step="any"
/>
</div>
</div>
</div>
{/* Limit High dan Limit High Crash dalam satu baris */}
<div style={{ marginBottom: 12 }}>
<div
style={{
display: 'flex',
justifyContent: 'space-between',
gap: '16px',
}}
>
{/* Limit High */}
<div style={{ flex: 1 }}>
<Text strong>Limit High</Text>
@@ -759,6 +684,18 @@ const DetailTag = (props) => {
</div>
</div>
</div>
{/* Description */}
<div style={{ marginBottom: 12 }}>
<Text strong>Description</Text>
<Input.TextArea
name="description"
value={formData.description}
onChange={handleInputChange}
placeholder="Enter Description (Optional)"
readOnly={props.readOnly}
rows={4}
/>
</div>
</div>
)}
</Modal>

3
src/pages/master/tag/component/ListTag.jsx
View File

@@ -44,12 +44,14 @@ const columns = (showPreviewModal, showEditModal, showDeleteDialog) => [
dataIndex: 'data_type',
key: 'data_type',
width: '10%',
render: (text) => text || '-',
},
{
title: 'Unit',
dataIndex: 'unit',
key: 'unit',
width: '8%',
render: (text) => text || '-',
},
{
title: 'Sub Section',
@@ -63,6 +65,7 @@ const columns = (showPreviewModal, showEditModal, showDeleteDialog) => [
dataIndex: 'device_name',
key: 'device_name',
width: '12%',
render: (text) => text || '-',
},
{
title: 'Status',