diff --git a/src/pages/admin/BulkCreateUser.tsx b/src/pages/admin/BulkCreateUser.tsx index a58023a..6f55e48 100644 --- a/src/pages/admin/BulkCreateUser.tsx +++ b/src/pages/admin/BulkCreateUser.tsx @@ -1,109 +1,121 @@ import axios from "axios"; import { useEffect, useState } from "react"; import { useNavigate } from "react-router-dom"; -import { User } from "../../type/UserType"; -import { Tp } from "../../type/TpType"; function BulkUsers() { - const [userData, setUserData] = useState([]); - const [practical, setPractical] = useState("0"); - const navigate = useNavigate(); - const [tps, setTps] = useState([]); + const [userData, setUserData] = useState([]); + const [practical, setPractical] = useState("0"); + const navigate = useNavigate(); + const [tps, setTps] = useState([]); - const handlePracticalChange = (e: React.ChangeEvent) => { - setPractical(e.target.value); - }; - - useEffect(() => { - axios.get("/api/tps").then((res) => { - setTps(res.data); - }); - }, []); - - const handleFileChange = (event: React.ChangeEvent) => { - const selectedFile = event.target.files[0]; - parseCSV(selectedFile); - }; - - const parseCSV = (file: File) => { - const reader = new FileReader(); - reader.onload = (event: ProgressEvent) => { - const text = event.target.result; - const rows = text.split("\n").map((row) => row.split(",")); - const formattedData = rows.map((row) => ({ - name: row[0], - email: row[1], - // Add other fields as necessary - })); - setUserData(formattedData); + const handlePracticalChange = (e: React.ChangeEvent) => { + setPractical(e.target.value); }; - reader.readAsText(file); - }; - const handleSubmit = () => { - // Handle submission logic (e.g., sending data to the backend) - console.log(practical); - axios - .post("/api/users/jdmi", { - users: userData.filter((user) => user.name !== ""), - tpId: practical, - }) - .then(() => navigate(`/admin/users`)); - }; + useEffect(() => { + axios.get("/api/tps").then((res) => { + setTps(res.data); + }); + }, []); - return ( -
-

Bulk User Creation

- - {userData.length > 0 && ( -
- - - - - - - - - {userData.map((user, index) => ( - - - - - ))} - -
NameEmail
{user.name}{user.email}
+ const handleFileChange = (event: React.ChangeEvent) => { + const selectedFile = event.target.files[0]; + parseCSV(selectedFile); + }; + + const parseCSV = (file: File) => { + const reader = new FileReader(); + reader.onload = (event: ProgressEvent) => { + const text = event.target.result; + const rows = text.split("\n").map((row) => row.split(",")); + const formattedData = rows.map((row) => ({ + name: row[0], + email: row[1], + password: row[2], + instance_name: row[3], + instance_ssh: row[4], + instance_port: row[5], + instance_pwd: row[6], + })); + setUserData(formattedData); + }; + reader.readAsText(file); + }; + + const handleSubmit = () => { + // Handle submission logic (e.g., sending data to the backend) + console.log(practical); + axios + .post("/api/users/jdmi", { + users: userData.filter((user) => user.name !== ""), + tpId: practical, + }) + .then(() => navigate(`/admin/users`)); + }; + + return ( +
+

Bulk User Creation

+ + {userData.length > 0 && ( +
+ + + + + + + + + + + + + + {userData.map((user, index) => ( + + + + + + + + + + ))} + +
NameEmailPasswordInstance nameInstance sshInstance portInstance pwd
{user.name}{user.email}{user.password}{user.instance_name}{user.instance_ssh}{user.instance_port}{user.instance_pwd}
+
+ )} + +
+ + +
+
- )} - -
- - -
- -
- ); + ); } export default BulkUsers;