Merge pull request #4 from luanngel/DevMarlene

Ajustes UI en formulario de concentradores

src/pages/concentrators/ConcentratorsPage.tsx

@@ -333,90 +333,90 @@ export default function ConcentratorsPage() {
               {editingSerial ? "Edit Concentrator" : "Add Concentrator"}
             </h2>
 
-            <div className="space-y-1">
+            <div className="space-y-3">
-              <label className="block text-sm font-medium text-gray-700">Device Name</label>
   <input
     className="w-full border px-3 py-2 rounded"
-                placeholder="Enter device name"
+    placeholder="Device Name"
     value={form["Device Name"]}
-                onChange={(e) => setForm({ ...form, "Device Name": e.target.value })}
+    onChange={(e) =>
+      setForm({ ...form, "Device Name": e.target.value })
+    }
   />
-            </div>
 
-            <div className="space-y-1">
-              <label className="block text-sm font-medium text-gray-700">Device S/N</label>
   <input
     className="w-full border px-3 py-2 rounded"
-                placeholder="Enter device serial number"
+    placeholder="Device S/N"
     value={form["Device S/N"]}
-                onChange={(e) => setForm({ ...form, "Device S/N": e.target.value })}
+    onChange={(e) =>
+      setForm({ ...form, "Device S/N": e.target.value })
+    }
   />
-            </div>
 
-            <div className="space-y-1">
-              <label className="block text-sm font-medium text-gray-700">Operator</label>
   <input
     className="w-full border px-3 py-2 rounded"
-                placeholder="Enter operator name"
+    placeholder="Operator"
     value={form["Operator"]}
-                onChange={(e) => setForm({ ...form, "Operator": e.target.value })}
+    onChange={(e) =>
+      setForm({ ...form, "Operator": e.target.value })
+    }
   />
-            </div>
 
-            <div className="space-y-1">
-              <label className="block text-sm font-medium text-gray-700">Instruction Manual</label>
   <input
     className="w-full border px-3 py-2 rounded"
-                placeholder="Enter instruction manual"
+    placeholder="Instruction Manual"
     value={form["Instruction Manual"]}
-                onChange={(e) => setForm({ ...form, "Instruction Manual": e.target.value })}
+    onChange={(e) =>
+      setForm({ ...form, "Instruction Manual": e.target.value })
+    }
   />
-            </div>
 
-            <div className="space-y-1">
-              <label className="block text-sm font-medium text-gray-700">Device Status</label>
   <button
     onClick={() =>
       setForm({
         ...form,
-                    "Device Status": form["Device Status"] === "ACTIVE" ? "INACTIVE" : "ACTIVE",
+        "Device Status":
+          form["Device Status"] === "ACTIVE" ? "INACTIVE" : "ACTIVE",
       })
     }
-                className="w-full border rounded px-3 py-2 hover:bg-gray-50"
+    className="w-full border rounded px-3 py-2 hover:bg-gray-50 text-left"
   >
-                Status: {form["Device Status"]}
+    Device Status: {form["Device Status"]}
   </button>
-            </div>
 
-            <div className="space-y-1">
-              <label className="block text-sm font-medium text-gray-700">Installed Time</label>
   <input
     type="date"
     className="w-full border px-3 py-2 rounded"
     value={form["Installed Time"]}
-                onChange={(e) => setForm({ ...form, "Installed Time": e.target.value })}
+    onChange={(e) =>
+      setForm({ ...form, "Installed Time": e.target.value })
+    }
   />
-            </div>
 
-            <div className="space-y-1">
-              <label className="block text-sm font-medium text-gray-700">Device Time</label>
   <input
     type="datetime-local"
     className="w-full border px-3 py-2 rounded"
     value={form["Device Time"].slice(0, 16)}
-                onChange={(e) => setForm({ ...form, "Device Time": new Date(e.target.value).toISOString() })}
+    onChange={(e) =>
+      setForm({
+        ...form,
+        "Device Time": new Date(e.target.value).toISOString(),
+      })
+    }
   />
-            </div>
 
-            <div className="space-y-1">
-              <label className="block text-sm font-medium text-gray-700">Communication Time</label>
   <input
     type="datetime-local"
     className="w-full border px-3 py-2 rounded"
     value={form["Communication Time"].slice(0, 16)}
-                onChange={(e) => setForm({ ...form, "Communication Time": new Date(e.target.value).toISOString() })}
+    onChange={(e) =>
+      setForm({
+        ...form,
+        "Communication Time": new Date(e.target.value).toISOString(),
+      })
+    }
   />
-            </div>
+</div>
+
 
             <div className="flex justify-end gap-2 pt-3">
               <button onClick={() => setShowModal(false)}>Cancel</button>