refactor: streamline camera form handling and update types for better consistency

src/pages/Manager/Device/Camera/components/CameraFormModal.tsx

@@ -17,18 +17,6 @@ const CAMERA_TYPES = [
   { label: 'GENERIC', value: 'GENERIC' },
 ];
 
-interface CameraFormValues {
-  name: string;
-  type: string;
-  account: string;
-  password: string;
-  ipAddress: string;
-  rtspPort: number;
-  httpPort: number;
-  stream: number;
-  channel: number;
-}
-
 interface CameraFormModalProps {
   open: boolean;
   onCancel: () => void;
@@ -44,22 +32,17 @@ const CameraFormModal: React.FC<CameraFormModalProps> = ({
   isOnline = true,
   editingCamera,
 }) => {
-  const [form] = Form.useForm<CameraFormValues>();
+  const [form] = Form.useForm<MasterModel.Camera>();
   const isEditMode = !!editingCamera;
 
   // Populate form when editing
   useEffect(() => {
     if (open && editingCamera) {
       form.setFieldsValue({
-        name: editingCamera.name || '',
-        type: editingCamera.cate_id || 'HIKVISION',
-        account: editingCamera.username || '',
-        password: editingCamera.password || '',
-        ipAddress: editingCamera.ip || '',
-        rtspPort: editingCamera.rtsp_port || 554,
-        httpPort: editingCamera.http_port || 80,
-        stream: editingCamera.stream || 0,
-        channel: editingCamera.channel || 0,
+        ...editingCamera,
+        cate_id: editingCamera.cate_id || 'HIKVISION',
+        rtsp_port: editingCamera.rtsp_port || 554,
+        http_port: editingCamera.http_port || 80,
       });
     } else if (open) {
       form.resetFields();
@@ -69,19 +52,12 @@ const CameraFormModal: React.FC<CameraFormModalProps> = ({
   const handleSubmit = async () => {
     try {
       const values = await form.validateFields();
-      // Convert form values to MasterModel.Camera format
+      // Values already in MasterModel.Camera format
       const camera: MasterModel.Camera = {
-        // Keep existing ID when editing, generate new ID when creating
+        ...editingCamera,
+        ...values,
+        // Ensure ID is set for new cameras
         id: editingCamera?.id || `cam_${Date.now()}`,
-        name: values.name,
-        cate_id: values.type,
-        ip: values.ipAddress,
-        rtsp_port: values.rtspPort,
-        http_port: values.httpPort,
-        stream: values.stream,
-        channel: values.channel,
-        username: values.account,
-        password: values.password,
       };
       onSubmit(camera);
       form.resetFields();
@@ -114,9 +90,10 @@ const CameraFormModal: React.FC<CameraFormModalProps> = ({
         form={form}
         layout="vertical"
         initialValues={{
-          type: 'HIKVISION',
-          rtspPort: 554,
-          httpPort: 80,
+          cate_id: 'HIKVISION',
+          ip: '192.168.1.10',
+          rtsp_port: 554,
+          http_port: 80,
           stream: 0,
           channel: 0,
         }}
@@ -131,7 +108,7 @@ const CameraFormModal: React.FC<CameraFormModalProps> = ({
 
         <Form.Item
           label="Loại"
-          name="type"
+          name="cate_id"
           rules={[{ required: true, message: 'Vui lòng chọn loại' }]}
         >
           <Select options={CAMERA_TYPES} />
@@ -139,7 +116,7 @@ const CameraFormModal: React.FC<CameraFormModalProps> = ({
 
         <Form.Item
           label="Tài khoản"
-          name="account"
+          name="username"
           rules={[{ required: true, message: 'Vui lòng nhập tài khoản' }]}
         >
           <Input placeholder="nhập tài khoản" autoComplete="off" />
@@ -158,7 +135,7 @@ const CameraFormModal: React.FC<CameraFormModalProps> = ({
 
         <Form.Item
           label="Địa chỉ IP"
-          name="ipAddress"
+          name="ip"
           rules={[{ required: true, message: 'Vui lòng nhập địa chỉ IP' }]}
         >
           <Input placeholder="192.168.1.10" />
@@ -168,7 +145,7 @@ const CameraFormModal: React.FC<CameraFormModalProps> = ({
           <Col span={12}>
             <Form.Item
               label="Cổng RTSP"
-              name="rtspPort"
+              name="rtsp_port"
               rules={[{ required: true, message: 'Vui lòng nhập cổng RTSP' }]}
             >
               <InputNumber style={{ width: '100%' }} min={0} max={65535} />
@@ -177,7 +154,7 @@ const CameraFormModal: React.FC<CameraFormModalProps> = ({
           <Col span={12}>
             <Form.Item
               label="Cổng HTTP"
-              name="httpPort"
+              name="http_port"
               rules={[{ required: true, message: 'Vui lòng nhập cổng HTTP' }]}
             >
               <InputNumber style={{ width: '100%' }} min={0} max={65535} />

src/pages/Manager/Device/Camera/components/ConfigCameraV6.tsx

@@ -24,10 +24,7 @@ const RECORDING_MODES = [
 interface CameraV6Props {
   thing: MasterModel.Thing | null;
   cameraConfig?: MasterModel.CameraV6 | null;
-  onSubmit?: (config: {
-    recordingMode: MasterModel.CameraV6['record_type'];
-    selectedAlerts: string[];
-  }) => void;
+  onSubmit?: (config: MasterModel.CameraV6) => void;
   isOnline?: boolean;
 }
 
@@ -41,7 +38,7 @@ const CameraV6: React.FC<CameraV6Props> = ({
   const { initialState } = useModel('@@initialState');
   const [selectedAlerts, setSelectedAlerts] = useState<string[]>([]);
   const [recordingMode, setRecordingMode] =
-    useState<MasterModel.CameraV6['record_type']>('none');
+    useState<MasterModel.CameraRecordType>('none');
   const [alarmConfig, setAlarmConfig] = useState<MasterModel.Alarm[] | null>(
     null,
   );
@@ -115,8 +112,9 @@ const CameraV6: React.FC<CameraV6Props> = ({
 
   const handleSubmitConfig = () => {
     onSubmit?.({
-      recordingMode,
-      selectedAlerts,
+      ...cameraConfig,
+      record_type: recordingMode,
+      record_alarm_list: recordingMode === 'alarm' ? selectedAlerts : [],
     });
   };