fsad 1.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/1
ADDED
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
const express = require('express');
|
|
2
|
+
const app = express();
|
|
3
|
+
const port = 3000;
|
|
4
|
+
app.use(express.json());
|
|
5
|
+
let books = [
|
|
6
|
+
{ id: 1, title: 'The Lord of the Rings', author: 'J.R.R.
|
|
7
|
+
Tolkien', price: 25.00, quantity: 10 },
|
|
8
|
+
{ id: 2, title: 'Pride and Prejudice', author: 'Jane
|
|
9
|
+
Austen', price: 15.50, quantity: 5 },
|
|
10
|
+
{ id: 3, title: 'To Kill a Mockingbird', author: 'Harper
|
|
11
|
+
Lee', price: 10.00, quantity: 7 }
|
|
12
|
+
];
|
|
13
|
+
app.get('/books', (req, res) => {
|
|
14
|
+
res.status(200).json(books);
|
|
15
|
+
});
|
|
16
|
+
app.get('/books/:id', (req, res) => {
|
|
17
|
+
const book = books.find((b) => b.id === parseInt(req.params.id));
|
|
18
|
+
console.log(typeof(req.params.id)," ",book);
|
|
19
|
+
if(book){
|
|
20
|
+
res.status(200).json(book);
|
|
21
|
+
}else{
|
|
22
|
+
res.status(201).send(" book not found");
|
|
23
|
+
}
|
|
24
|
+
});
|
|
25
|
+
app.post('/books', (req, res) => {
|
|
26
|
+
const newBook = {
|
|
27
|
+
id : books.length + 1,
|
|
28
|
+
title:req.body.title,
|
|
29
|
+
author:req.body.author,
|
|
30
|
+
price:req.body.price,
|
|
31
|
+
quantity:req.body.quantity
|
|
32
|
+
};
|
|
33
|
+
books.push(newBook);
|
|
34
|
+
res.status(201).json(newBook);
|
|
35
|
+
});
|
|
36
|
+
app.patch('/books',(req,res,err)=>{
|
|
37
|
+
res.send("in the patch method");
|
|
38
|
+
});
|
|
39
|
+
app.put('/books',(req,res,err)=>{
|
|
40
|
+
res.send("in the put method");
|
|
41
|
+
});
|
|
42
|
+
app.delete('/books/:id', (req, res) => {
|
|
43
|
+
const initialLength = books.length;
|
|
44
|
+
books = books.filter(book => book.id !== parseInt(req.params.id));
|
|
45
|
+
if (books.length === initialLength) {
|
|
46
|
+
return res.status(404).json({ message: 'Book not found' });
|
|
47
|
+
}
|
|
48
|
+
res.status(200).json({ message: 'Book deleted successfully' });
|
|
49
|
+
});
|
|
50
|
+
app.listen(port, () => {
|
|
51
|
+
console.log(`Server is running on http://localhost:${port}`);
|
|
52
|
+
});
|
package/10
ADDED
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { BrowserRouter as Router, Routes, Route } from "react-router-dom";
|
|
3
|
+
import Navbar from "./components/Navbar";
|
|
4
|
+
import Home from "./pages/Home";
|
|
5
|
+
import About from "./pages/About";
|
|
6
|
+
import Contact from "./pages/Contact";
|
|
7
|
+
|
|
8
|
+
function App() {
|
|
9
|
+
return (
|
|
10
|
+
<Router>
|
|
11
|
+
<div>
|
|
12
|
+
<Navbar />
|
|
13
|
+
<div style={{ padding: "20px" }}>
|
|
14
|
+
<Routes>
|
|
15
|
+
<Route path="/" element={<Home />} />
|
|
16
|
+
<Route path="/about" element={<About />} />
|
|
17
|
+
<Route path="/contact" element={<Contact />} />
|
|
18
|
+
</Routes>
|
|
19
|
+
</div>
|
|
20
|
+
</div>
|
|
21
|
+
</Router>
|
|
22
|
+
);
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
export default App;
|
package/2
ADDED
|
@@ -0,0 +1,81 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="en">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8">
|
|
5
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
6
|
+
<title>Student Information</title>
|
|
7
|
+
<style>
|
|
8
|
+
body { font-family: Arial, sans-serif; padding: 20px; }
|
|
9
|
+
.container { max-width: 500px; margin: auto; }
|
|
10
|
+
h2 { text-align: center; }
|
|
11
|
+
form { margin-bottom: 20px; border: 1px solid #ccc; padding: 20px;
|
|
12
|
+
border-radius: 8px; }
|
|
13
|
+
label { display: block; margin-bottom: 5px; }
|
|
14
|
+
input[type="text"] { width: 100%; padding: 8px; margin-bottom: 10px;
|
|
15
|
+
box-sizing: border-box; }
|
|
16
|
+
button { padding: 10px 15px; cursor: pointer; }
|
|
17
|
+
.output { margin-top: 20px; padding: 15px; border: 1px solid #007BFF;
|
|
18
|
+
background-color: #e6f2ff; border-radius: 8px; }
|
|
19
|
+
</style>
|
|
20
|
+
</head>
|
|
21
|
+
<body>
|
|
22
|
+
<div class="container">
|
|
23
|
+
<h2>Student Information Form</h2>
|
|
24
|
+
<form action="/submit-get" method="get">
|
|
25
|
+
<h3>Using GET Method</h3>
|
|
26
|
+
<label for="name-get">Name:</label>
|
|
27
|
+
<input type="text" id="name-get" name="name" required>
|
|
28
|
+
<label for="branch-get">Branch:</label>
|
|
29
|
+
<input type="text" id="branch-get" name="branch" required>
|
|
30
|
+
<label for="semester-get">Semester:</label>
|
|
31
|
+
<input type="text" id="semester-get" name="semester" required>
|
|
32
|
+
<button type="submit">Submit (GET)</button>
|
|
33
|
+
</form>
|
|
34
|
+
<form action="/submit-post" method="post">
|
|
35
|
+
<h3>Using POST Method</h3>
|
|
36
|
+
<label for="name-post">Name:</label>
|
|
37
|
+
<input type="text" id="name-post" name="name" required>
|
|
38
|
+
<label for="branch-post">Branch:</label>
|
|
39
|
+
<input type="text" id="branch-post" name="branch" required>
|
|
40
|
+
<label for="semester-post">Semester:</label>
|
|
41
|
+
<input type="text" id="semester-post" name="semester" required>
|
|
42
|
+
<button type="submit">Submit (POST)</button>
|
|
43
|
+
</form>
|
|
44
|
+
</div>
|
|
45
|
+
</body>
|
|
46
|
+
</html>
|
|
47
|
+
|
|
48
|
+
const express = require('express');
|
|
49
|
+
const path = require('path');
|
|
50
|
+
const app = express();
|
|
51
|
+
const port = 3000;
|
|
52
|
+
app.use(express.static(path.join(__dirname)));
|
|
53
|
+
app.use(express.urlencoded({ extended: true }));
|
|
54
|
+
app.get('/submit-get', (req, res) => {
|
|
55
|
+
const name = req.query.name;
|
|
56
|
+
const branch = req.query.branch;
|
|
57
|
+
const semester = req.query.semester;
|
|
58
|
+
const htmlResponse = ` <h2>Student Information (GET)</h2>
|
|
59
|
+
<p>Name: <b>${name}</b></p>
|
|
60
|
+
<p>Branch: <u>${branch}</u></p>
|
|
61
|
+
<p>Semester: ${semester}</p>
|
|
62
|
+
<br> <a href="/">Go Back</a>`;
|
|
63
|
+
res.send(htmlResponse);
|
|
64
|
+
});
|
|
65
|
+
app.post('/submit-post', (req, res) => {
|
|
66
|
+
const name = req.body.name;
|
|
67
|
+
const branch = req.body.branch;
|
|
68
|
+
const semester = req.body.semester;
|
|
69
|
+
const htmlResponse = `
|
|
70
|
+
<h2>Student Information (POST)</h2>
|
|
71
|
+
<p>Name: <b>${name}</b></p>
|
|
72
|
+
<p>Branch: <u>${branch}</u></p>
|
|
73
|
+
<p>Semester: ${semester}</p>
|
|
74
|
+
<br>
|
|
75
|
+
<a href="/">Go Back</a>
|
|
76
|
+
`;
|
|
77
|
+
res.send(htmlResponse);
|
|
78
|
+
});
|
|
79
|
+
app.listen(port, () => {
|
|
80
|
+
console.log(`Server is listening at http://localhost:${port}`);
|
|
81
|
+
});
|
package/3
ADDED
|
@@ -0,0 +1,122 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
|
|
3
|
+
class EdTable extends React.Component {
|
|
4
|
+
render() {
|
|
5
|
+
const education = [
|
|
6
|
+
{
|
|
7
|
+
id: 1,
|
|
8
|
+
name: "National Public School",
|
|
9
|
+
place: "Bengaluru",
|
|
10
|
+
stddeg: "10th",
|
|
11
|
+
grade: "A+",
|
|
12
|
+
},
|
|
13
|
+
{
|
|
14
|
+
id: 2,
|
|
15
|
+
name: "Indian Institute of Science",
|
|
16
|
+
place: "Bengaluru",
|
|
17
|
+
stddeg: "Under Graduate",
|
|
18
|
+
grade: "9.8",
|
|
19
|
+
},
|
|
20
|
+
];
|
|
21
|
+
|
|
22
|
+
const edudetails = education.map((educ) => (
|
|
23
|
+
<EdRow
|
|
24
|
+
key={educ.id}
|
|
25
|
+
id={educ.id}
|
|
26
|
+
name={educ.name}
|
|
27
|
+
place={educ.place}
|
|
28
|
+
stddeg={educ.stddeg}
|
|
29
|
+
grade={educ.grade}
|
|
30
|
+
/>
|
|
31
|
+
));
|
|
32
|
+
|
|
33
|
+
return (
|
|
34
|
+
<table border="1">
|
|
35
|
+
<thead>
|
|
36
|
+
<tr>
|
|
37
|
+
<th>ID</th>
|
|
38
|
+
<th>Name</th>
|
|
39
|
+
<th>Place</th>
|
|
40
|
+
<th>Education</th>
|
|
41
|
+
<th>Grade</th>
|
|
42
|
+
</tr>
|
|
43
|
+
</thead>
|
|
44
|
+
<tbody>{edudetails}</tbody>
|
|
45
|
+
</table>
|
|
46
|
+
);
|
|
47
|
+
}
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
class EdRow extends React.Component {
|
|
51
|
+
render() {
|
|
52
|
+
return (
|
|
53
|
+
<tr>
|
|
54
|
+
<td>{this.props.id}</td>
|
|
55
|
+
<td>{this.props.name}</td>
|
|
56
|
+
<td>{this.props.place}</td>
|
|
57
|
+
<td>{this.props.stddeg}</td>
|
|
58
|
+
<td>{this.props.grade}</td>
|
|
59
|
+
</tr>
|
|
60
|
+
);
|
|
61
|
+
}
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
class Education extends React.Component {
|
|
65
|
+
render() {
|
|
66
|
+
return (
|
|
67
|
+
<section>
|
|
68
|
+
<h2>Educational Details</h2>
|
|
69
|
+
<EdTable />
|
|
70
|
+
</section>
|
|
71
|
+
);
|
|
72
|
+
}
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
export default Education;
|
|
76
|
+
|
|
77
|
+
|
|
78
|
+
import React from "react";
|
|
79
|
+
|
|
80
|
+
class Resume_Header extends React.Component {
|
|
81
|
+
render() {
|
|
82
|
+
return <h1>Resume Details</h1>;
|
|
83
|
+
}
|
|
84
|
+
}
|
|
85
|
+
|
|
86
|
+
export default Resume_Header;
|
|
87
|
+
|
|
88
|
+
|
|
89
|
+
import React from "react";
|
|
90
|
+
|
|
91
|
+
class Resume_Person_Info extends React.Component {
|
|
92
|
+
render() {
|
|
93
|
+
return (
|
|
94
|
+
<div>
|
|
95
|
+
<p>Name : Prashanth K</p>
|
|
96
|
+
<p>Address : Kengeri</p>
|
|
97
|
+
<p>Phone No : 1234567890</p>
|
|
98
|
+
<p>Email : prashanthk@rvce.edu.in</p>
|
|
99
|
+
</div>
|
|
100
|
+
);
|
|
101
|
+
}
|
|
102
|
+
}
|
|
103
|
+
|
|
104
|
+
export default Resume_Person_Info;
|
|
105
|
+
|
|
106
|
+
|
|
107
|
+
import React from "react";
|
|
108
|
+
import ReactDOM from "react-dom/client";
|
|
109
|
+
import "./index.css";
|
|
110
|
+
import Resume_Header from "./ResumeCreate/Resume_Header";
|
|
111
|
+
import Resume_Person_Info from "./ResumeCreate/Resume_Person_Info";
|
|
112
|
+
import Education from "./ResumeCreate/Educational";
|
|
113
|
+
|
|
114
|
+
const root = ReactDOM.createRoot(document.getElementById("root"));
|
|
115
|
+
|
|
116
|
+
root.render(
|
|
117
|
+
<React.StrictMode>
|
|
118
|
+
<Resume_Header />
|
|
119
|
+
<Resume_Person_Info />
|
|
120
|
+
<Education />
|
|
121
|
+
</React.StrictMode>
|
|
122
|
+
);
|
package/4
ADDED
|
@@ -0,0 +1,75 @@
|
|
|
1
|
+
import React, { useState } from "react";
|
|
2
|
+
|
|
3
|
+
// Student Component
|
|
4
|
+
function Student({ name, email }) {
|
|
5
|
+
return (
|
|
6
|
+
<div>
|
|
7
|
+
<h3>{name}</h3>
|
|
8
|
+
<p>{email}</p>
|
|
9
|
+
</div>
|
|
10
|
+
);
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
// Student List Component
|
|
14
|
+
function StudentList({ students }) {
|
|
15
|
+
return (
|
|
16
|
+
<div>
|
|
17
|
+
<h2>Registered Students</h2>
|
|
18
|
+
{students.map((student, index) => (
|
|
19
|
+
<Student key={index} name={student.name} email={student.email} />
|
|
20
|
+
))}
|
|
21
|
+
</div>
|
|
22
|
+
);
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
// Registration Form Component
|
|
26
|
+
function RegistrationForm({ addStudent }) {
|
|
27
|
+
const [name, setName] = useState("");
|
|
28
|
+
const [email, setEmail] = useState("");
|
|
29
|
+
|
|
30
|
+
const handleSubmit = (e) => {
|
|
31
|
+
e.preventDefault();
|
|
32
|
+
addStudent({ name, email });
|
|
33
|
+
setName("");
|
|
34
|
+
setEmail("");
|
|
35
|
+
};
|
|
36
|
+
|
|
37
|
+
return (
|
|
38
|
+
<form onSubmit={handleSubmit}>
|
|
39
|
+
<input
|
|
40
|
+
type="text"
|
|
41
|
+
placeholder="Name"
|
|
42
|
+
value={name}
|
|
43
|
+
onChange={(e) => setName(e.target.value)}
|
|
44
|
+
required
|
|
45
|
+
/>
|
|
46
|
+
<input
|
|
47
|
+
type="email"
|
|
48
|
+
placeholder="Email"
|
|
49
|
+
value={email}
|
|
50
|
+
onChange={(e) => setEmail(e.target.value)}
|
|
51
|
+
required
|
|
52
|
+
/>
|
|
53
|
+
<button type="submit">Register</button>
|
|
54
|
+
</form>
|
|
55
|
+
);
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
// Main App Component
|
|
59
|
+
function App() {
|
|
60
|
+
const [students, setStudents] = useState([]);
|
|
61
|
+
|
|
62
|
+
const addStudent = (student) => {
|
|
63
|
+
setStudents([...students, student]);
|
|
64
|
+
};
|
|
65
|
+
|
|
66
|
+
return (
|
|
67
|
+
<div>
|
|
68
|
+
<h1>Student Registration Portal</h1>
|
|
69
|
+
<RegistrationForm addStudent={addStudent} />
|
|
70
|
+
<StudentList students={students} />
|
|
71
|
+
</div>
|
|
72
|
+
);
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
export default App;
|
package/5
ADDED
|
@@ -0,0 +1,109 @@
|
|
|
1
|
+
import React, { useState } from "react";
|
|
2
|
+
|
|
3
|
+
function RegistrationForm() {
|
|
4
|
+
const [formData, setFormData] = useState({
|
|
5
|
+
name: "",
|
|
6
|
+
email: "",
|
|
7
|
+
password: "",
|
|
8
|
+
});
|
|
9
|
+
|
|
10
|
+
const [errors, setErrors] = useState({});
|
|
11
|
+
|
|
12
|
+
// Regular Expressions
|
|
13
|
+
const nameRegex = /^[A-Za-z ]{2,}$/;
|
|
14
|
+
const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
|
|
15
|
+
const passwordRegex = /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[@$!%*?&]).{8,}$/;
|
|
16
|
+
|
|
17
|
+
const handleChange = (e) => {
|
|
18
|
+
const { name, value } = e.target;
|
|
19
|
+
setFormData({ ...formData, [name]: value });
|
|
20
|
+
};
|
|
21
|
+
|
|
22
|
+
const validate = () => {
|
|
23
|
+
const newErrors = {};
|
|
24
|
+
|
|
25
|
+
if (!nameRegex.test(formData.name)) {
|
|
26
|
+
newErrors.name = "Name should contain only letters and spaces (min 2 characters).";
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
if (!emailRegex.test(formData.email)) {
|
|
30
|
+
newErrors.email = "Invalid email address.";
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
if (!passwordRegex.test(formData.password)) {
|
|
34
|
+
newErrors.password =
|
|
35
|
+
"Password must be at least 8 characters, include uppercase, lowercase, number, and special character.";
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
setErrors(newErrors);
|
|
39
|
+
|
|
40
|
+
return Object.keys(newErrors).length === 0;
|
|
41
|
+
};
|
|
42
|
+
|
|
43
|
+
const handleSubmit = (e) => {
|
|
44
|
+
e.preventDefault();
|
|
45
|
+
if (validate()) {
|
|
46
|
+
alert("Form submitted successfully!");
|
|
47
|
+
console.log("User Data:", formData);
|
|
48
|
+
// Clear form
|
|
49
|
+
setFormData({ name: "", email: "", password: "" });
|
|
50
|
+
setErrors({});
|
|
51
|
+
}
|
|
52
|
+
};
|
|
53
|
+
|
|
54
|
+
return (
|
|
55
|
+
<div style={{ maxWidth: "400px", margin: "auto" }}>
|
|
56
|
+
<h2>User Registration</h2>
|
|
57
|
+
<form onSubmit={handleSubmit} noValidate>
|
|
58
|
+
{/* Name */}
|
|
59
|
+
<div>
|
|
60
|
+
<label>Name:</label>
|
|
61
|
+
<input
|
|
62
|
+
type="text"
|
|
63
|
+
name="name"
|
|
64
|
+
value={formData.name}
|
|
65
|
+
onChange={handleChange}
|
|
66
|
+
/>
|
|
67
|
+
{errors.name && <p style={{ color: "red" }}>{errors.name}</p>}
|
|
68
|
+
</div>
|
|
69
|
+
|
|
70
|
+
{/* Email */}
|
|
71
|
+
<div>
|
|
72
|
+
<label>Email:</label>
|
|
73
|
+
<input
|
|
74
|
+
type="email"
|
|
75
|
+
name="email"
|
|
76
|
+
value={formData.email}
|
|
77
|
+
onChange={handleChange}
|
|
78
|
+
/>
|
|
79
|
+
{errors.email && <p style={{ color: "red" }}>{errors.email}</p>}
|
|
80
|
+
</div>
|
|
81
|
+
|
|
82
|
+
{/* Password */}
|
|
83
|
+
<div>
|
|
84
|
+
<label>Password:</label>
|
|
85
|
+
<input
|
|
86
|
+
type="password"
|
|
87
|
+
name="password"
|
|
88
|
+
value={formData.password}
|
|
89
|
+
onChange={handleChange}
|
|
90
|
+
/>
|
|
91
|
+
{errors.password && <p style={{ color: "red" }}>{errors.password}</p>}
|
|
92
|
+
</div>
|
|
93
|
+
|
|
94
|
+
<button type="submit">Register</button>
|
|
95
|
+
</form>
|
|
96
|
+
</div>
|
|
97
|
+
);
|
|
98
|
+
}
|
|
99
|
+
|
|
100
|
+
function App() {
|
|
101
|
+
return (
|
|
102
|
+
<div>
|
|
103
|
+
<RegistrationForm />
|
|
104
|
+
</div>
|
|
105
|
+
);
|
|
106
|
+
}
|
|
107
|
+
|
|
108
|
+
export default App;
|
|
109
|
+
|
package/6
ADDED
|
@@ -0,0 +1,134 @@
|
|
|
1
|
+
import React, { useEffect, useState } from "react";
|
|
2
|
+
import axios from "axios";
|
|
3
|
+
|
|
4
|
+
function InventoryList({ inventory }) {
|
|
5
|
+
return (
|
|
6
|
+
<div>
|
|
7
|
+
<h2>Inventory</h2>
|
|
8
|
+
<table border="1" cellPadding="5" cellSpacing="0">
|
|
9
|
+
<thead>
|
|
10
|
+
<tr>
|
|
11
|
+
<th>ID</th>
|
|
12
|
+
<th>Product Name</th>
|
|
13
|
+
<th>Quantity</th>
|
|
14
|
+
<th>Price</th>
|
|
15
|
+
</tr>
|
|
16
|
+
</thead>
|
|
17
|
+
<tbody>
|
|
18
|
+
{inventory.map((item) => (
|
|
19
|
+
<tr key={item.id}>
|
|
20
|
+
<td>{item.id}</td>
|
|
21
|
+
<td>{item.prodname}</td>
|
|
22
|
+
<td>{item.qty}</td>
|
|
23
|
+
<td>{item.price}</td>
|
|
24
|
+
</tr>
|
|
25
|
+
))}
|
|
26
|
+
</tbody>
|
|
27
|
+
</table>
|
|
28
|
+
</div>
|
|
29
|
+
);
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
function AddProductForm({ addProduct }) {
|
|
33
|
+
const [formData, setFormData] = useState({
|
|
34
|
+
id: "",
|
|
35
|
+
prodname: "",
|
|
36
|
+
qty: "",
|
|
37
|
+
price: "",
|
|
38
|
+
});
|
|
39
|
+
|
|
40
|
+
const handleChange = (e) => {
|
|
41
|
+
const { name, value } = e.target;
|
|
42
|
+
setFormData({ ...formData, [name]: value });
|
|
43
|
+
};
|
|
44
|
+
|
|
45
|
+
const handleSubmit = async (e) => {
|
|
46
|
+
e.preventDefault();
|
|
47
|
+
// Convert numeric fields
|
|
48
|
+
const dataToSend = {
|
|
49
|
+
id: Number(formData.id),
|
|
50
|
+
prodname: formData.prodname,
|
|
51
|
+
qty: Number(formData.qty),
|
|
52
|
+
price: Number(formData.price),
|
|
53
|
+
};
|
|
54
|
+
await addProduct(dataToSend);
|
|
55
|
+
setFormData({ id: "", prodname: "", qty: "", price: "" });
|
|
56
|
+
};
|
|
57
|
+
|
|
58
|
+
return (
|
|
59
|
+
<form onSubmit={handleSubmit} style={{ marginTop: "20px" }}>
|
|
60
|
+
<h2>Add New Product</h2>
|
|
61
|
+
<input
|
|
62
|
+
type="number"
|
|
63
|
+
name="id"
|
|
64
|
+
placeholder="ID"
|
|
65
|
+
value={formData.id}
|
|
66
|
+
onChange={handleChange}
|
|
67
|
+
required
|
|
68
|
+
/>
|
|
69
|
+
<input
|
|
70
|
+
type="text"
|
|
71
|
+
name="prodname"
|
|
72
|
+
placeholder="Product Name"
|
|
73
|
+
value={formData.prodname}
|
|
74
|
+
onChange={handleChange}
|
|
75
|
+
required
|
|
76
|
+
/>
|
|
77
|
+
<input
|
|
78
|
+
type="number"
|
|
79
|
+
name="qty"
|
|
80
|
+
placeholder="Quantity"
|
|
81
|
+
value={formData.qty}
|
|
82
|
+
onChange={handleChange}
|
|
83
|
+
required
|
|
84
|
+
/>
|
|
85
|
+
<input
|
|
86
|
+
type="number"
|
|
87
|
+
name="price"
|
|
88
|
+
placeholder="Price"
|
|
89
|
+
value={formData.price}
|
|
90
|
+
onChange={handleChange}
|
|
91
|
+
required
|
|
92
|
+
/>
|
|
93
|
+
<button type="submit">Add Product</button>
|
|
94
|
+
</form>
|
|
95
|
+
);
|
|
96
|
+
}
|
|
97
|
+
|
|
98
|
+
function App() {
|
|
99
|
+
const [inventory, setInventory] = useState([]);
|
|
100
|
+
|
|
101
|
+
// Fetch inventory from backend
|
|
102
|
+
const fetchInventory = async () => {
|
|
103
|
+
try {
|
|
104
|
+
const res = await axios.get("http://localhost:8000/");
|
|
105
|
+
setInventory(res.data);
|
|
106
|
+
} catch (err) {
|
|
107
|
+
console.error(err);
|
|
108
|
+
}
|
|
109
|
+
};
|
|
110
|
+
|
|
111
|
+
// Add product
|
|
112
|
+
const addProduct = async (product) => {
|
|
113
|
+
try {
|
|
114
|
+
const res = await axios.post("http://localhost:8000/add", product);
|
|
115
|
+
setInventory(res.data);
|
|
116
|
+
} catch (err) {
|
|
117
|
+
console.error(err);
|
|
118
|
+
}
|
|
119
|
+
};
|
|
120
|
+
|
|
121
|
+
useEffect(() => {
|
|
122
|
+
fetchInventory();
|
|
123
|
+
}, []);
|
|
124
|
+
|
|
125
|
+
return (
|
|
126
|
+
<div style={{ padding: "20px" }}>
|
|
127
|
+
<h1>Inventory Management</h1>
|
|
128
|
+
<InventoryList inventory={inventory} />
|
|
129
|
+
<AddProductForm addProduct={addProduct} />
|
|
130
|
+
</div>
|
|
131
|
+
);
|
|
132
|
+
}
|
|
133
|
+
|
|
134
|
+
export default App;
|
package/7
ADDED
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
db.employees.insertMany([
|
|
2
|
+
{
|
|
3
|
+
employee_id: 101,
|
|
4
|
+
name: "Sonia Rao",
|
|
5
|
+
department: "Engineering",
|
|
6
|
+
salary: 95000,
|
|
7
|
+
hire_date: new Date("2023-01-15"),
|
|
8
|
+
performance_score: 4.5,
|
|
9
|
+
status: "Active"
|
|
10
|
+
},
|
|
11
|
+
|
|
12
|
+
db.employees.find({
|
|
13
|
+
salary: { $gt: 90000, $lte: 120000 }
|
|
14
|
+
})
|
|
15
|
+
|
|
16
|
+
db.employees.find({
|
|
17
|
+
department: { $in: ["HR", "Sales"] }
|
|
18
|
+
})
|
|
19
|
+
|
|
20
|
+
db.employees.find({
|
|
21
|
+
department: "Engineering",
|
|
22
|
+
performance_score: { $gte: 4.5 }
|
|
23
|
+
})
|
|
24
|
+
|
|
25
|
+
db.employees.find({
|
|
26
|
+
$or: [
|
|
27
|
+
{ department: "HR" },
|
|
28
|
+
{ salary: { $gt: 100000 } }
|
|
29
|
+
]
|
|
30
|
+
})
|
|
31
|
+
|
|
32
|
+
db.employees.find({
|
|
33
|
+
status: "Active",
|
|
34
|
+
department: { $in: ["Engineering", "Sales"] },
|
|
35
|
+
hire_date: { $lt: new Date("2024-01-01") }
|
|
36
|
+
})
|
package/8
ADDED
|
@@ -0,0 +1,56 @@
|
|
|
1
|
+
db.catalog.insertMany([
|
|
2
|
+
{
|
|
3
|
+
item_id: "A001",
|
|
4
|
+
name: "Classic Leather Backpack",
|
|
5
|
+
description: "Durable leather backpack with multiple compartments,
|
|
6
|
+
perfect for daily commute or light travel.",
|
|
7
|
+
tags: ["leather", "backpack", "travel", "work"],
|
|
8
|
+
price: 120.00,
|
|
9
|
+
in_stock: true
|
|
10
|
+
},
|
|
11
|
+
{
|
|
12
|
+
item_id: "A002",
|
|
13
|
+
name: "Ergonomic Office Chair",
|
|
14
|
+
description: "Adjustable office chair with lumbar support and breathable
|
|
15
|
+
mesh, ideal for long working hours.",
|
|
16
|
+
tags: ["office", "chair", "ergonomic", "comfort"],
|
|
17
|
+
price: 280.00,
|
|
18
|
+
in_stock: false
|
|
19
|
+
},
|
|
20
|
+
{
|
|
21
|
+
item_id: "A003",
|
|
22
|
+
name: "Durable Cotton T-Shirt",
|
|
23
|
+
description: "A soft and durable t-shirt made from 100% organic cotton.
|
|
24
|
+
Eco-friendly and comfortable.",
|
|
25
|
+
tags: ["cotton", "tshirt", "organic", "eco-friendly"],
|
|
26
|
+
price: 25.00,
|
|
27
|
+
in_stock: true
|
|
28
|
+
}
|
|
29
|
+
]);
|
|
30
|
+
|
|
31
|
+
|
|
32
|
+
|
|
33
|
+
|
|
34
|
+
db.catalog.createIndex({
|
|
35
|
+
name: "text", description: "text", tags: "text"
|
|
36
|
+
})
|
|
37
|
+
|
|
38
|
+
db.catalog.aggregate([
|
|
39
|
+
// Stage 1: Filter documents using the text index
|
|
40
|
+
{
|
|
41
|
+
$match: {
|
|
42
|
+
$text: {
|
|
43
|
+
$search: "durable backpack"
|
|
44
|
+
}
|
|
45
|
+
}
|
|
46
|
+
},
|
|
47
|
+
// Stage 2: Reshape output and include the relevance score
|
|
48
|
+
{
|
|
49
|
+
$project: {
|
|
50
|
+
_id: 0,
|
|
51
|
+
name: 1,
|
|
52
|
+
price: 1,
|
|
53
|
+
score: { $meta: "textScore" }
|
|
54
|
+
}
|
|
55
|
+
}
|
|
56
|
+
])
|
package/9
ADDED
|
@@ -0,0 +1,153 @@
|
|
|
1
|
+
db.json
|
|
2
|
+
"employees": [
|
|
3
|
+
{ "id": 1, "firstName": "John", "lastName": "Doe", "email":
|
|
4
|
+
"john.doe@example.com" },
|
|
5
|
+
{ "id": 2, "firstName": "Jane", "lastName": "Smith", "email":
|
|
6
|
+
"jane.smith@example.com" }
|
|
7
|
+
]
|
|
8
|
+
}
|
|
9
|
+
$npx json-server --watch db.json --port 5000
|
|
10
|
+
|
|
11
|
+
import React, { useEffect, useState } from "react";
|
|
12
|
+
import axios from "axios";
|
|
13
|
+
|
|
14
|
+
const API_URL = "http://localhost:5000/employees";
|
|
15
|
+
|
|
16
|
+
function EmployeeList({ employees, onEdit, onDelete }) {
|
|
17
|
+
return (
|
|
18
|
+
<div>
|
|
19
|
+
<h2>Employee List</h2>
|
|
20
|
+
<table border="1" cellPadding="5" style={{ borderCollapse: "collapse" }}>
|
|
21
|
+
<thead>
|
|
22
|
+
<tr>
|
|
23
|
+
<th>ID</th>
|
|
24
|
+
<th>First Name</th>
|
|
25
|
+
<th>Last Name</th>
|
|
26
|
+
<th>Email</th>
|
|
27
|
+
<th>Actions</th>
|
|
28
|
+
</tr>
|
|
29
|
+
</thead>
|
|
30
|
+
<tbody>
|
|
31
|
+
{employees.map(emp => (
|
|
32
|
+
<tr key={emp.id}>
|
|
33
|
+
<td>{emp.id}</td>
|
|
34
|
+
<td>{emp.firstName}</td>
|
|
35
|
+
<td>{emp.lastName}</td>
|
|
36
|
+
<td>{emp.email}</td>
|
|
37
|
+
<td>
|
|
38
|
+
<button onClick={() => onEdit(emp)}>Edit</button>
|
|
39
|
+
<button onClick={() => onDelete(emp.id)}>Delete</button>
|
|
40
|
+
</td>
|
|
41
|
+
</tr>
|
|
42
|
+
))}
|
|
43
|
+
</tbody>
|
|
44
|
+
</table>
|
|
45
|
+
</div>
|
|
46
|
+
);
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
function EmployeeForm({ addEmployee, updateEmployee, employeeToEdit, clearEdit }) {
|
|
50
|
+
const [formData, setFormData] = useState({
|
|
51
|
+
firstName: "",
|
|
52
|
+
lastName: "",
|
|
53
|
+
email: ""
|
|
54
|
+
});
|
|
55
|
+
|
|
56
|
+
useEffect(() => {
|
|
57
|
+
if (employeeToEdit) setFormData(employeeToEdit);
|
|
58
|
+
}, [employeeToEdit]);
|
|
59
|
+
|
|
60
|
+
const handleChange = e => {
|
|
61
|
+
const { name, value } = e.target;
|
|
62
|
+
setFormData(prev => ({ ...prev, [name]: value }));
|
|
63
|
+
};
|
|
64
|
+
|
|
65
|
+
const handleSubmit = e => {
|
|
66
|
+
e.preventDefault();
|
|
67
|
+
if (employeeToEdit) {
|
|
68
|
+
updateEmployee(employeeToEdit.id, formData);
|
|
69
|
+
clearEdit();
|
|
70
|
+
} else {
|
|
71
|
+
addEmployee(formData);
|
|
72
|
+
}
|
|
73
|
+
setFormData({ firstName: "", lastName: "", email: "" });
|
|
74
|
+
};
|
|
75
|
+
|
|
76
|
+
return (
|
|
77
|
+
<form onSubmit={handleSubmit} style={{ marginTop: "20px" }}>
|
|
78
|
+
<h2>{employeeToEdit ? "Edit Employee" : "Add Employee"}</h2>
|
|
79
|
+
<input
|
|
80
|
+
name="firstName"
|
|
81
|
+
placeholder="First Name"
|
|
82
|
+
value={formData.firstName}
|
|
83
|
+
onChange={handleChange}
|
|
84
|
+
required
|
|
85
|
+
/>
|
|
86
|
+
<input
|
|
87
|
+
name="lastName"
|
|
88
|
+
placeholder="Last Name"
|
|
89
|
+
value={formData.lastName}
|
|
90
|
+
onChange={handleChange}
|
|
91
|
+
required
|
|
92
|
+
/>
|
|
93
|
+
<input
|
|
94
|
+
name="email"
|
|
95
|
+
type="email"
|
|
96
|
+
placeholder="Email"
|
|
97
|
+
value={formData.email}
|
|
98
|
+
onChange={handleChange}
|
|
99
|
+
required
|
|
100
|
+
/>
|
|
101
|
+
<button type="submit">{employeeToEdit ? "Update" : "Add"}</button>
|
|
102
|
+
{employeeToEdit && <button onClick={clearEdit}>Cancel</button>}
|
|
103
|
+
</form>
|
|
104
|
+
);
|
|
105
|
+
}
|
|
106
|
+
|
|
107
|
+
function App() {
|
|
108
|
+
const [employees, setEmployees] = useState([]);
|
|
109
|
+
const [employeeToEdit, setEmployeeToEdit] = useState(null);
|
|
110
|
+
|
|
111
|
+
// Fetch employees
|
|
112
|
+
const fetchEmployees = async () => {
|
|
113
|
+
const res = await axios.get(API_URL);
|
|
114
|
+
setEmployees(res.data);
|
|
115
|
+
};
|
|
116
|
+
|
|
117
|
+
// Add employee
|
|
118
|
+
const addEmployee = async (emp) => {
|
|
119
|
+
const res = await axios.post(API_URL, emp);
|
|
120
|
+
setEmployees([...employees, res.data]);
|
|
121
|
+
};
|
|
122
|
+
|
|
123
|
+
// Update employee
|
|
124
|
+
const updateEmployee = async (id, updatedEmp) => {
|
|
125
|
+
const res = await axios.put(`${API_URL}/${id}`, updatedEmp);
|
|
126
|
+
setEmployees(employees.map(emp => (emp.id === id ? res.data : emp)));
|
|
127
|
+
};
|
|
128
|
+
|
|
129
|
+
// Delete employee
|
|
130
|
+
const handleDelete = async (id) => {
|
|
131
|
+
await axios.delete(`${API_URL}/${id}`);
|
|
132
|
+
setEmployees(employees.filter(emp => emp.id !== id));
|
|
133
|
+
};
|
|
134
|
+
|
|
135
|
+
useEffect(() => {
|
|
136
|
+
fetchEmployees();
|
|
137
|
+
}, []);
|
|
138
|
+
|
|
139
|
+
return (
|
|
140
|
+
<div style={{ padding: "20px" }}>
|
|
141
|
+
<h1>Employee Management System</h1>
|
|
142
|
+
<EmployeeList employees={employees} onEdit={setEmployeeToEdit} onDelete={handleDelete} />
|
|
143
|
+
<EmployeeForm
|
|
144
|
+
addEmployee={addEmployee}
|
|
145
|
+
updateEmployee={updateEmployee}
|
|
146
|
+
employeeToEdit={employeeToEdit}
|
|
147
|
+
clearEdit={() => setEmployeeToEdit(null)}
|
|
148
|
+
/>
|
|
149
|
+
</div>
|
|
150
|
+
);
|
|
151
|
+
}
|
|
152
|
+
|
|
153
|
+
export default App;
|