src/pages/master/device/component/DetailDevice.jsx

@@ -1,5 +1,15 @@
 import React, { useEffect, useState } from 'react';
-import { Modal, Input, Divider, Typography, Switch, Button, ConfigProvider, Radio, Select } from 'antd';
+import {
+    Modal,
+    Input,
+    Divider,
+    Typography,
+    Switch,
+    Button,
+    ConfigProvider,
+    Radio,
+    Select,
+} from 'antd';
 import { NotifAlert, NotifOk } from '../../../../components/Global/ToastNotif';
 import { createApd, getJenisPermit, updateApd } from '../../../../api/master-apd';
 import { createDevice, updateDevice } from '../../../../api/master-device';
@@ -55,7 +65,8 @@ const DetailDevice = (props) => {
     };
 
     const validateIPAddress = (ip) => {
-        const ipRegex = /^(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$/;
+        const ipRegex =
+            /^(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$/;
         return ipRegex.test(ip);
     };
 
@@ -63,15 +74,15 @@ const DetailDevice = (props) => {
         setConfirmLoading(true);
 
         // Validasi required fields
-        if (!FormData.device_code) {
+        // if (!FormData.device_code) {
-            NotifOk({
+        //     NotifOk({
-                icon: 'warning',
+        //         icon: 'warning',
-                title: 'Peringatan',
+        //         title: 'Peringatan',
-                message: 'Kolom Device Code Tidak Boleh Kosong',
+        //         message: 'Kolom Device Code Tidak Boleh Kosong',
-            });
+        //     });
-            setConfirmLoading(false);
+        //     setConfirmLoading(false);
-            return;
+        //     return;
-        }
+        // }
 
         if (!FormData.device_name) {
             NotifOk({
@@ -125,15 +136,26 @@ const DetailDevice = (props) => {
             return;
         }
 
+        // Backend validation schema doesn't include device_code
         const payload = {
-            device_code: FormData.device_code,
             device_name: FormData.device_name,
             device_status: FormData.device_status,
             device_location: FormData.device_location,
-            device_description: FormData.device_description,
             ip_address: FormData.ip_address,
         };
 
+        // For CREATE: device_description is required (cannot be empty)
+        // For UPDATE: device_description is optional
+        if (!FormData.device_id) {
+            // Creating - ensure description is not empty
+            payload.device_description = FormData.device_description || '-';
+        } else {
+            // Updating - include description as-is
+            payload.device_description = FormData.device_description;
+        }
+
+        console.log('Payload to send:', payload);
+
         try {
             let response;
             if (!FormData.device_id) {
@@ -146,10 +168,13 @@ const DetailDevice = (props) => {
 
             // Check if response is successful
             if (response && (response.statusCode === 200 || response.statusCode === 201)) {
+                // Response.data is now a single object (already extracted from array)
+                const deviceName = response.data?.device_name || FormData.device_name;
+
                 NotifOk({
                     icon: 'success',
                     title: 'Berhasil',
-                    message: `Data Device "${response.data?.device_name || FormData.device_name}" berhasil ${
+                    message: `Data Device "${deviceName}" berhasil ${
                         FormData.device_id ? 'diubah' : 'ditambahkan'
                     }.`,
                 });
@@ -316,7 +341,7 @@ const DetailDevice = (props) => {
                             disabled
                         />
                     </div>
-                    <div style={{ marginBottom: 12 }}>
+                    {/* <div style={{ marginBottom: 12 }}>
                         <Text strong>Device Code</Text>
                         <Text style={{ color: 'red' }}> *</Text>
                         <Input
@@ -326,7 +351,7 @@ const DetailDevice = (props) => {
                             placeholder="Enter Device Code"
                             readOnly={props.readOnly}
                         />
-                    </div>
+                    </div> */}
                     <div style={{ marginBottom: 12 }}>
                         <Text strong>Device Name</Text>
                         <Text style={{ color: 'red' }}> *</Text>
@@ -394,4 +419,4 @@ const DetailDevice = (props) => {
     );
 };
 
-export default DetailDevice;
+export default DetailDevice;

src/pages/master/device/component/ListDevice.jsx

@@ -186,18 +186,19 @@ const ListDevice = memo(function ListDevice(props) {
     const handleDelete = async (device_id) => {
         const response = await deleteDevice(device_id);
 
-        if (response.statusCode == 200) {
+        // Backend returns: { statusCode: 200, message: "Device deleted successfully", rows: null, data: true }
+        if (response.statusCode == 200 && response.data === true) {
             NotifAlert({
                 icon: 'success',
                 title: 'Berhasil',
-                message: 'Data Device "' + response.data.device_name + '" berhasil dihapus.',
+                message: response.message || 'Data Device berhasil dihapus.',
             });
             doFilter();
         } else {
             NotifOk({
                 icon: 'error',
                 title: 'Gagal',
-                message: 'Gagal Menghapus Data Device',
+                message: response?.message || 'Gagal Menghapus Data Device',
             });
         }
     };