add user is done
This commit is contained in:
parent
90aadb6143
commit
9582d04d87
@ -131,6 +131,7 @@ import CityRevenueCharts from "./views/Charts/CityRevenue";
|
||||
import { element } from "prop-types";
|
||||
import OrderdayChart from "./views/Charts/OrderDaywise";
|
||||
import RevenueCharts from "./views/Charts/RevenueCharts";
|
||||
import AddCustomer from "./views/customerDetails/addCustomer";
|
||||
const routes = [
|
||||
{ path: "/", exact: true, name: "Home" },
|
||||
{
|
||||
@ -180,6 +181,11 @@ const routes = [
|
||||
name: "User Table",
|
||||
element: SingleUserAllDetails,
|
||||
},
|
||||
{
|
||||
path: "/add-customer",
|
||||
name: "User Table",
|
||||
element: AddCustomer,
|
||||
},
|
||||
// {
|
||||
// path: "/users-address/add",
|
||||
// name: "User Address",
|
||||
|
395
src/views/customerDetails/addCustomer.js
Normal file
395
src/views/customerDetails/addCustomer.js
Normal file
@ -0,0 +1,395 @@
|
||||
import React, { useState } from "react";
|
||||
import {
|
||||
TextField,
|
||||
Button,
|
||||
Card,
|
||||
FormControl,
|
||||
Grid,
|
||||
FormHelperText,
|
||||
OutlinedInput,
|
||||
Box,
|
||||
} from "@mui/material";
|
||||
import { useNavigate } from "react-router-dom";
|
||||
import toast from "react-hot-toast";
|
||||
import axios from "axios"; // Import axios for making HTTP requests
|
||||
import { isAutheticated } from "src/auth";
|
||||
const styles = {
|
||||
formStyle: {
|
||||
fontWeight: "700",
|
||||
fontSize: "12px",
|
||||
fontFamily: "inter",
|
||||
marginBottom: "3px",
|
||||
marginLeft: "0",
|
||||
},
|
||||
};
|
||||
const AddCustomer = () => {
|
||||
const navigate = useNavigate();
|
||||
const [user, setUser] = useState({
|
||||
name: "",
|
||||
email: "",
|
||||
password: "", // No need to initialize password here
|
||||
});
|
||||
const [id, setUserId] = useState("");
|
||||
const token = isAutheticated();
|
||||
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [data, setData] = useState({
|
||||
first_Name: "",
|
||||
last_Name: "",
|
||||
phone_Number: Number,
|
||||
street: "",
|
||||
city: "",
|
||||
state: "",
|
||||
postalCode: "",
|
||||
country: "",
|
||||
});
|
||||
|
||||
// console.log(data);
|
||||
const handleChange = (e) => {
|
||||
setData((prev) => ({ ...prev, [e.target.name]: e.target.value }));
|
||||
};
|
||||
|
||||
const handerInputChanges = (e) => {
|
||||
setUser({ ...user, [e.target.name]: e.target.value });
|
||||
};
|
||||
function handleAddressSubmit(e) {
|
||||
e.preventDefault();
|
||||
if (
|
||||
data.first_Name === "" ||
|
||||
data.last_Name === "" ||
|
||||
data.phone_Number === null ||
|
||||
data.street === "" ||
|
||||
data.city === "" ||
|
||||
data.state === "" ||
|
||||
data.postalCode === "" ||
|
||||
data.country === ""
|
||||
) {
|
||||
swal({
|
||||
title: "Warning",
|
||||
text: "Please fill All mendetory fields ",
|
||||
icon: "warning",
|
||||
button: "ok",
|
||||
dangerMode: true,
|
||||
});
|
||||
return;
|
||||
}
|
||||
setLoading(true);
|
||||
axios
|
||||
.post(
|
||||
`/api/shipping/address/admin/new/${id}`,
|
||||
{
|
||||
...data,
|
||||
},
|
||||
|
||||
{
|
||||
headers: {
|
||||
"Access-Control-Allow-Origin": "*",
|
||||
Authorization: `Bearer ${token}`,
|
||||
},
|
||||
}
|
||||
)
|
||||
.then((res) => {
|
||||
setLoading(false);
|
||||
// setSuccess((prev) => !prev);
|
||||
navigate("/customers-details");
|
||||
toast.success(res.data.message ? res.data.message : "Address Added!");
|
||||
})
|
||||
.catch((error) => {
|
||||
setLoading(false);
|
||||
toast.error(
|
||||
error.response.data.message
|
||||
? error.response.data.message
|
||||
: "Something went wrong!"
|
||||
);
|
||||
});
|
||||
}
|
||||
|
||||
// Generate password function
|
||||
const generatePassword = (name, email) => {
|
||||
const combinedStr = (name + email).toLowerCase(); // Convert to lowercase for consistency
|
||||
const specialChars = "@#*"; // Define the set of special characters
|
||||
const alphaChars = combinedStr.match(/[a-zA-Z]/g); // Filter out alphabetic characters
|
||||
const filteredChars = combinedStr.match(/[^\W_]/g); // Filter out non-alphanumeric characters
|
||||
let passwordChars = alphaChars.concat(filteredChars); // Combine alphabetic and filtered characters
|
||||
|
||||
// Insert a random special character at a random position in the password characters array
|
||||
const specialChar = specialChars.charAt(
|
||||
Math.floor(Math.random() * specialChars.length)
|
||||
); // Pick a random special character
|
||||
const randomIndex = Math.floor(Math.random() * (passwordChars.length + 1)); // Pick a random position to insert the special character
|
||||
passwordChars.splice(randomIndex, 0, specialChar); // Insert the special character at the random position
|
||||
|
||||
passwordChars = passwordChars.sort(() => Math.random() - 0.5); // Shuffle the characters
|
||||
const password = passwordChars.join("").slice(0, 8); // Take the first 8 characters
|
||||
return password;
|
||||
};
|
||||
const handleFormSubmit = async (e) => {
|
||||
e.preventDefault();
|
||||
try {
|
||||
if (!user.name || !user.email) {
|
||||
throw new Error("Fill all fields!");
|
||||
}
|
||||
|
||||
// Generate password based on name and email
|
||||
const generatedPassword = generatePassword(user.name, user.email);
|
||||
console.log(generatedPassword); // Use generatedPassword instead of generatePassword
|
||||
setUser({ ...user, password: generatedPassword }); // Set generated password to user state
|
||||
|
||||
const response = await axios.post("/api/v1/user/register", {
|
||||
...user, // Send user details
|
||||
password: generatedPassword, // Send generated password to the backend
|
||||
});
|
||||
if (response.status === 201) {
|
||||
toast.success("User Added Successful");
|
||||
setUserId(response.data.userId);
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error.response.data.message);
|
||||
toast.error(error.response.data.message);
|
||||
}
|
||||
};
|
||||
|
||||
console.log(user);
|
||||
console.log("this is the id ", id);
|
||||
|
||||
return (
|
||||
<div>
|
||||
<Card sx={{ padding: "1rem", marginBottom: "1rem" }}>
|
||||
<form style={{ marginBottom: "2rem" }} onSubmit={handleFormSubmit}>
|
||||
<TextField
|
||||
id="name"
|
||||
required
|
||||
type="text"
|
||||
sx={{ marginBottom: "2rem", width: "50%" }}
|
||||
name="name"
|
||||
value={user.name}
|
||||
label="Name"
|
||||
variant="outlined"
|
||||
onChange={handerInputChanges}
|
||||
/>
|
||||
<br />
|
||||
<TextField
|
||||
id="email"
|
||||
type="email"
|
||||
sx={{ mb: "2rem", width: "50%" }}
|
||||
required
|
||||
name="email"
|
||||
value={user.email}
|
||||
label="Email"
|
||||
variant="outlined"
|
||||
onChange={handerInputChanges}
|
||||
/>
|
||||
<br />
|
||||
|
||||
<Button variant="contained" disabled={id?.length > 0} type="submit">
|
||||
Add user
|
||||
</Button>
|
||||
<br />
|
||||
</form>
|
||||
|
||||
<form onSubmit={handleAddressSubmit}>
|
||||
<Grid container spacing={2}>
|
||||
<Grid item xs={12}>
|
||||
<Grid container spacing={2}>
|
||||
<Grid item xs={6}>
|
||||
<FormControl variant="outlined" fullWidth>
|
||||
<FormHelperText
|
||||
id="outlined-weight-helper-text"
|
||||
sx={styles.formStyle}
|
||||
>
|
||||
FIRST NAME*
|
||||
</FormHelperText>
|
||||
<OutlinedInput
|
||||
size="small"
|
||||
id="outlined-adornment-weight"
|
||||
placeholder="First name"
|
||||
aria-describedby="outlined-weight-helper-text"
|
||||
name="first_Name"
|
||||
required
|
||||
type="text"
|
||||
onChange={(e) => handleChange(e)}
|
||||
|
||||
// value={accountDetails.firstname}
|
||||
// onChange={handerInputChanges}
|
||||
/>
|
||||
</FormControl>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<FormControl variant="outlined" fullWidth>
|
||||
<FormHelperText
|
||||
id="outlined-weight-helper-text"
|
||||
sx={styles.formStyle}
|
||||
>
|
||||
LAST NAME*
|
||||
</FormHelperText>
|
||||
<OutlinedInput
|
||||
size="small"
|
||||
id="outlined-adornment-weight"
|
||||
placeholder="Last name"
|
||||
aria-describedby="outlined-weight-helper-text"
|
||||
name="last_Name"
|
||||
required
|
||||
type="text"
|
||||
onChange={(e) => handleChange(e)}
|
||||
// value={accountDetails.firstname}
|
||||
// onChange={handerInputChanges}
|
||||
/>
|
||||
</FormControl>
|
||||
</Grid>
|
||||
<Grid item xs={12}>
|
||||
<FormControl fullWidth variant="outlined">
|
||||
<FormHelperText
|
||||
id="outlined-weight-helper-text"
|
||||
sx={styles.formStyle}
|
||||
>
|
||||
PHONE NUMBER*
|
||||
</FormHelperText>
|
||||
<OutlinedInput
|
||||
size="small"
|
||||
id="outlined-adornment-weight"
|
||||
placeholder="Phone name"
|
||||
aria-describedby="outlined-weight-helper-text"
|
||||
name="phone_Number"
|
||||
required
|
||||
type="number"
|
||||
onChange={(e) => handleChange(e)}
|
||||
// value={accountDetails.firstname}
|
||||
// onChange={handerInputChanges}
|
||||
/>
|
||||
</FormControl>
|
||||
</Grid>
|
||||
<Grid item xs={12}>
|
||||
<FormControl variant="outlined" fullWidth>
|
||||
<FormHelperText
|
||||
id="outlined-weight-helper-text"
|
||||
sx={styles.formStyle}
|
||||
>
|
||||
STREET ADDRESS*
|
||||
</FormHelperText>
|
||||
<OutlinedInput
|
||||
size="small"
|
||||
id="outlined-adornment-weight"
|
||||
placeholder="Street Address"
|
||||
aria-describedby="outlined-weight-helper-text"
|
||||
name="street"
|
||||
required
|
||||
type="text"
|
||||
onChange={(e) => handleChange(e)}
|
||||
// value={accountDetails.firstname}
|
||||
// onChange={handerInputChanges}
|
||||
/>
|
||||
</FormControl>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Grid>
|
||||
<Grid item xs={12}>
|
||||
<FormControl variant="outlined" fullWidth>
|
||||
<FormHelperText
|
||||
id="outlined-weight-helper-text"
|
||||
sx={styles.formStyle}
|
||||
>
|
||||
COUNTRY*
|
||||
</FormHelperText>
|
||||
<OutlinedInput
|
||||
size="small"
|
||||
id="outlined-adornment-weight"
|
||||
placeholder="Country"
|
||||
aria-describedby="outlined-weight-helper-text"
|
||||
name="country"
|
||||
required
|
||||
type="text"
|
||||
onChange={(e) => handleChange(e)}
|
||||
// value={accountDetails.firstname}
|
||||
// onChange={handerInputChanges}
|
||||
/>
|
||||
</FormControl>
|
||||
</Grid>
|
||||
<Grid item xs={12}>
|
||||
<FormControl fullWidth variant="outlined">
|
||||
<FormHelperText
|
||||
id="outlined-weight-helper-text"
|
||||
sx={styles.formStyle}
|
||||
>
|
||||
TOWN CITY*
|
||||
</FormHelperText>
|
||||
<OutlinedInput
|
||||
size="small"
|
||||
id="outlined-adornment-weight"
|
||||
placeholder="Town City"
|
||||
aria-describedby="outlined-weight-helper-text"
|
||||
name="city"
|
||||
required
|
||||
type="text"
|
||||
onChange={(e) => handleChange(e)}
|
||||
// value={accountDetails.firstname}
|
||||
// onChange={handerInputChanges}
|
||||
/>
|
||||
</FormControl>
|
||||
</Grid>
|
||||
<Grid item xs={12}>
|
||||
<Grid container spacing={2}>
|
||||
<Grid item xs={6}>
|
||||
<FormControl variant="outlined" fullWidth>
|
||||
<FormHelperText
|
||||
id="outlined-weight-helper-text"
|
||||
sx={styles.formStyle}
|
||||
>
|
||||
STATE*
|
||||
</FormHelperText>
|
||||
<OutlinedInput
|
||||
size="small"
|
||||
id="outlined-adornment-weight"
|
||||
placeholder="State"
|
||||
aria-describedby="outlined-weight-helper-text"
|
||||
name="state"
|
||||
required
|
||||
type="text"
|
||||
onChange={(e) => handleChange(e)}
|
||||
// value={accountDetails.firstname}
|
||||
// onChange={handerInputChanges}
|
||||
/>
|
||||
</FormControl>
|
||||
</Grid>
|
||||
|
||||
<Grid item xs={6}>
|
||||
<FormControl variant="outlined" fullWidth>
|
||||
<FormHelperText
|
||||
id="outlined-weight-helper-text"
|
||||
sx={styles.formStyle}
|
||||
>
|
||||
ZIP CODE*
|
||||
</FormHelperText>
|
||||
<OutlinedInput
|
||||
size="small"
|
||||
id="outlined-adornment-weight"
|
||||
placeholder="Zip Code"
|
||||
aria-describedby="outlined-weight-helper-text"
|
||||
name="postalCode"
|
||||
required
|
||||
type="number"
|
||||
onChange={(e) => handleChange(e)}
|
||||
// value={accountDetails.firstname}
|
||||
// onChange={handerInputChanges}
|
||||
/>
|
||||
</FormControl>
|
||||
</Grid>
|
||||
<Grid item xs={12}>
|
||||
<Button
|
||||
variant="contained"
|
||||
disabled={id?.length == 0}
|
||||
type="submit"
|
||||
onClick={handleAddressSubmit}
|
||||
>
|
||||
Add address
|
||||
</Button>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</form>
|
||||
</Card>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default AddCustomer;
|
@ -131,7 +131,7 @@ const CustomerTable = () => {
|
||||
All Customers
|
||||
</div>
|
||||
|
||||
{/* <div className="page-title-right">
|
||||
<div className="page-title-right">
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
@ -141,12 +141,12 @@ const CustomerTable = () => {
|
||||
textTransform: "capitalize",
|
||||
}}
|
||||
onClick={() => {
|
||||
navigate("/users-address/add", { replace: true });
|
||||
navigate("/add-customer");
|
||||
}}
|
||||
>
|
||||
Add User
|
||||
</Button>
|
||||
</div> */}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
Loading…
Reference in New Issue
Block a user