Vendor UserADD

harsh-2O · Feb 8, 2022 · 394e0c7 · 394e0c7
1 parent d8d8fa1
commit 394e0c7
Show file tree

Hide file tree

Showing 7 changed files with 178 additions and 0 deletions.
diff --git a/client/src/App.js b/client/src/App.js
@@ -2,6 +2,8 @@ import React, { useRef, useEffect, useState } from "react";
 import mapboxgl from "!mapbox-gl"; // eslint-disable-line import/no-webpack-loader-syntax
 import AllCustomers from "./components/AllCustomers";
 import CreateCustomer from "./components/CreateCustomer";
+import AllVendors from "./components/AllVendors";
+import CreateVendor from "./components/CreateVendor";
 import {
   BrowserRouter as Router,
   Routes,
@@ -61,10 +63,18 @@ function App() {
           <li>
             <Link to="/createCustomer">Create a Customer</Link>
           </li>
+          <li>
+            <Link to="/getVendors">All Vendors</Link>
+          </li>
+          <li>
+            <Link to="/createVendor">Create a Vendor</Link>
+          </li>
         </ul>
       <Routes>
         <Route path="getCustomers" element={<AllCustomers/>}></Route>
         <Route path="createCustomer" element={<CreateCustomer/>}></Route>
+        <Route path="getVendors" element={<AllVendors/>}></Route>
+        <Route path="createVendor" element={<CreateVendor/>}></Route>
       </Routes>
       </Router>
     </div>

diff --git a/client/src/components/AllVendors.js b/client/src/components/AllVendors.js
@@ -0,0 +1,34 @@
+import React, { useState, useEffect } from "react";
+import axios from "axios";
+
+
+const AllCustomers = () => {
+const [vendor, setVendor] = useState([]);
+
+
+useEffect(() => {
+    axios.get("http://localhost:4000/vendors")
+    .then((res) => {
+        setVendor(res.data);
+    })
+}, []);
+
+
+  return <div>
+<h1>Here is list of vendors</h1>
+{vendor.map((ven) => {
+    return(
+        <>
+        <h5>Name: {ven.name}</h5>
+        {/* <h5>Email: {ven.email}</h5> */}
+        <h5>Mobile No. : {ven.mobileNumber}</h5>
+        {/* <h5>lat : {ven.latitude}</h5>
+        <h5>long : {ven.longitude}</h5> */}
+        </>
+    )
+})}
+  </div>;
+};
+
+export default AllCustomers;
+
diff --git a/client/src/components/CreateVendor.js b/client/src/components/CreateVendor.js
@@ -0,0 +1,67 @@
+import React, { useState } from "react";
+import axios from "axios";
+
+const initialState = {
+  name: "",
+  mobileNumber: "",
+//   latitude: 0,
+//   longitude: 0
+};
+
+const CreateVendor = () => {
+  const [vendor, setVendor] = useState(initialState);
+//   const [lat, setLat] = useState(0);
+//   const [lng, setLng] = useState(0);
+
+  const handleChange = (event) =>setVendor((data) => ({
+    ...data,
+    [event.target.name]: event.target.value,
+  }));
+
+//   const handleLocation = () => {
+//     navigator.geolocation.getCurrentPosition((pos) => {
+//       setLat(pos.coords.latitude);
+//       setLng(pos.coords.longitude);
+//       vendor.latitude = pos.coords.latitude;
+//       vendor.longitude = pos.coords.longitude;
+//     })
+//   }
+
+  const handleSubmit = (e) => {
+    e.preventDefault();
+    console.log(vendor);
+    axios
+      .post("http://localhost:4000/vendors/new", vendor)
+      .then((res) => {});
+  };
+
+  return (
+    <div>
+      <form>
+        <label htmlFor="name">Name</label>
+        <input type="text" name="name" id="name" value={vendor.name} onChange={handleChange} />
+        {/* <label htmlFor="email">Email</label>
+        <input type="email" name="email" value={vendor.email} onChange={handleChange} /> */}
+        <label htmlFor="mobileNumber">Mobile No.</label>
+        <input
+          type="tel"
+          name="mobileNumber"
+          id="mobileNumber"
+          value={vendor.mobileNumber}
+          onChange={handleChange}
+
+        />
+
+        {/* <h4>Please provide ur location</h4> */}
+        {/* <input type="number" name="latitude" value={vendor.latitude} onChange={handleChange} id="latitude" />
+        <input type="number" name="longitude" value={vendor.longitude} onChange={handleChange} id="longitude" /> */}
+        {/* <button type="button" onClick={handleLocation}>Current Location</button> */}
+        <button type="submit" onClick={handleSubmit}>
+          Submit
+        </button>
+      </form>
+    </div>
+  );
+};
+
+export default CreateVendor;
diff --git a/server/controllers/vendors.js b/server/controllers/vendors.js
@@ -0,0 +1,27 @@
+import Vendor from "../models/vendors.js";
+
+
+export const getVendor = async (req, res) => {
+    const vendor = await Vendor.find({});
+    res.status(200).send(vendor);
+}
+
+
+export const createVendor = async (req, res) => {
+
+    try {
+        console.log(req.body);
+
+        const newVendor = new Vendor(req.body);
+
+        await newVendor.save();
+        res.json(req.body);
+    } catch (e) {
+        console.log(e);
+        res.status(500).json({
+            message: "Error Occurred"
+        });
+    }
+
+
+};
diff --git a/server/index.js b/server/index.js
@@ -2,6 +2,7 @@ import express from "express";
 import dotenv from "dotenv";
 import cors from "cors";
 import customerRoutes from "./routes/customer.js";
+import vendorRoutes from "./routes/vendor.js";
 import mongoose from "mongoose";
 dotenv.config();
 
@@ -25,6 +26,7 @@ app.get("/", (req, res) => {
 });
 
 app.use("/customers", customerRoutes);
+app.use("/vendors", vendorRoutes);
 
 app.listen(4000, () => {
   console.log("Listening to port 4000");

diff --git a/server/models/vendors.js b/server/models/vendors.js
@@ -0,0 +1,29 @@
+import mongoose from "mongoose";
+const Schema = mongoose.Schema;
+
+const vendorSchema = new Schema({
+
+    name: {
+        type: String,
+        required: [true, "Name cannot be empty!"]
+    },
+    // email: {
+    //     type: String,
+    //     required: [true, "Email cannot be empty!"]
+    // },
+    mobileNumber: {
+        type: Number,
+        required: [true, 'Mobile Number cannot be empty!']
+    },
+    // latitude: {
+    //     type: Number,
+    //     required: [true, 'latitude is required']
+    // },
+    // longitude: {
+    //     type: Number,
+    //     required: [true, 'longitude is required']
+    // }
+});
+
+const Vendor = mongoose.model("Vendor", vendorSchema);
+export default Vendor;
diff --git a/server/routes/vendor.js b/server/routes/vendor.js
@@ -0,0 +1,9 @@
+import express from "express";
+const router = express.Router();
+import { getVendor, createVendor } from "../controllers/vendors.js";
+
+router.get("/", getVendor);
+
+router.post("/new", createVendor);
+
+export default router;