created pages,integrated apis

src/App.js

@@ -2,6 +2,7 @@ import React, { Component } from 'react'
 import { HashRouter, Route, Switch } from 'react-router-dom'
 import './scss/style.scss'
 import ForgotPassword from './views/pages/register/ForgotPassword'
+import NewRegister from './views/pages/register/NewRegister'
 
 const loading = (
   <div className="pt-3 text-center">
@@ -26,6 +27,7 @@ class App extends Component {
           <Switch>
             <Route exact path="/" name="Login Page" render={(props) => <Login {...props} />} />
             <Route exact path="/forgot" name="Forgot Page" render={(props) => <ForgotPassword {...props} />} />
+            <Route exact path="/newRegister" name="Register Page" render={(props) => <NewRegister {...props} />} />
             {/* <Route
               exact
               path="/register"

src/_nav.js

@@ -13,6 +13,7 @@ import {
   cilPuzzle,
   cilSpeedometer,
   cilStar,
+  cilUser,
 } from '@coreui/icons'
 import { CNavGroup, CNavItem, CNavTitle } from '@coreui/react'
 
@@ -274,46 +275,46 @@ const _nav = [
   //   name: 'Login',
   //   to: '/',
   // },
-  {
-    component: CNavItem,
-    name: 'Vendors',
-    to: '/vendors',
-    icon: <CIcon icon={cilNotes} customClassName="nav-icon" />,
-  },
-  {
-    component: CNavItem,
-    name: 'Courier',
-    to: '/courier',
-    icon: <CIcon icon={cilBell} customClassName="nav-icon" />,
-  },
-  {
-    component: CNavItem,
-    name: 'Airway Bills',
-    to: '/airwaysbill',
-    icon: <CIcon icon={cilMoney} customClassName="nav-icon" />,
-  },
-
   // {
   //   component: CNavItem,
-  //   name: 'Change Password',
+  //   name: 'Vendors',
-  //   icon: <CIcon icon={cilPencil} customClassName="nav-icon" />,
+  //   to: '/vendors',
-  //   to: '/register',
+  //   icon: <CIcon icon={cilNotes} customClassName="nav-icon" />,
   // },
+  // {
+  //   component: CNavItem,
+  //   name: 'Courier',
+  //   to: '/courier',
+  //   icon: <CIcon icon={cilBell} customClassName="nav-icon" />,
+  // },
+  // {
+  //   component: CNavItem,
+  //   name: 'Airway Bills',
+  //   to: '/airwaysbill',
+  //   icon: <CIcon icon={cilMoney} customClassName="nav-icon" />,
+  // },
+
+  {
+    component: CNavItem,
+    name: 'Profile',
+    icon: <CIcon icon={cilPencil} customClassName="nav-icon" />,
+    to: '/profile',
+  },
 
   // {
   //   component: CNavGroup,
-  //   name: 'Pages',
+  //   name: 'Profile',
-  //   icon: <CIcon icon={cilStar} customClassName="nav-icon" />,
+  //   icon: <CIcon icon={cilUser} customClassName="nav-icon" />,
   //   items: [
   //     {
   //       component: CNavItem,
-  //       name: 'Error 404',
+  //       name: 'Display',
-  //       to: '/404',
+  //       to: '/profile',
   //     },
   //     {
   //       component: CNavItem,
-  //       name: 'Error 500',
+  //       name: 'Edit',
-  //       to: '/500',
+  //       to: '/edit',
   //     },
   //   ],
   // },

src/index.js

@@ -9,7 +9,7 @@ import store from './store'
 import axios from 'axios'
 
 const setupAxios = () => {
-  axios.defaults.baseURL = "https://api-courier-vendor.herokuapp.com/"
+  axios.defaults.baseURL = 'https://dating-api-server.herokuapp.com';
   axios.defaults.headers = {
     'Cache-Control': 'no-cache,no-store',
     'Pragma': 'no-cache',

src/routes.js

@@ -8,6 +8,8 @@ const Courier = React.lazy(() => import('./views/Courier/Courier'))
 const EditCourier = React.lazy(() => import('./views/Courier/EditCourier'))
 const AddCourier = React.lazy(() => import('./views/Courier/AddCourier'))
 const Register = React.lazy(() => import('./views/pages/register/Register'))
+const Profile = React.lazy(() => import('./views/Profile/Profile'))
+const EditProfile = React.lazy(() => import('./views/Profile/EditProfile'))
 const Vendor = React.lazy(() => import('./views/Vendor/Vendor'))
 const VendorDetail = React.lazy(() => import('./views/Vendor/VendorDetail'))
 const EditVendor = React.lazy(() => import('./views/Vendor/EditVendor'))
@@ -66,6 +68,8 @@ const Widgets = React.lazy(() => import('./views/widgets/Widgets'))
 const routes = [
   { path: '/', exact: true, name: 'Home' },
   { path: '/register', name: 'Change Password', component: Register },
+  { path: '/edit', name: 'Change Password', component: EditProfile },
+  { path: '/profile', name: 'Change Password', component: Profile },
   { path: '/courier', name: 'Courier', component: Courier },
   { path: '/editcourier/:id', name: ' Edit Courier', component: EditCourier },
   { path: '/addcourier', name: 'Courier / Add Courier', component: AddCourier },

src/views/Courier/Courier.js

@@ -92,6 +92,7 @@ const Courier = () => {
                     <tr>
                         <td scope="row">{item.name}</td>
                         <td>{item._id}</td>
+                        {/* <td>{item.code}</td> */}
                         <td>{formatDate(item.createdAt)}</td>
                         <td>
                             <CButtonGroup role="group" aria-label="Basic mixed styles example">

src/views/Profile/EditProfile.js

@@ -0,0 +1,127 @@
+import React from 'react'
+import { CForm, CCol, CFormLabel, CContainer, CRow, CCardGroup, CCard, CCardBody, CFormInput, CFormSelect, CFormCheck, CButton } from '@coreui/react'
+import { Country, City } from 'country-state-city'
+import { useState, useEffect } from 'react'
+import axios from 'axios'
+import { useHistory } from 'react-router-dom'
+import { isAutheticated } from 'src/auth'
+const EditProfile = () => {
+    const [cities, setCities] = useState([])
+    const { token } = isAutheticated()
+    const [ownerDetails, setOwnerDetails] = useState({
+        cafeName: '',
+        email: '',
+        location: '',
+        country: 'India',
+        city: ''
+    })
+    const history = useHistory()
+    const [processing, setProcessing] = useState(false)
+    const countries = Country.getAllCountries()
+    useEffect(() => {
+        const countryCode = countries.find(item => item.name === ownerDetails.country)
+        setCities(() => City.getCitiesOfCountry(countryCode?.isoCode))
+        getData()
+
+    }, [ownerDetails.country])
+
+    const getData = async () => {
+        let res = await axios.get('/owner', {
+            headers: {
+                'Authorization': `Bearer ${token}`
+            }
+        })
+        if (res) {
+            setOwnerDetails({ ...res.data.user })
+        }
+    }
+    console.log(ownerDetails);
+    const handleChange = (event) => {
+        const { name, value } = event.target;
+        setOwnerDetails({ ...ownerDetails, [name]: value });
+    };
+
+
+    async function handleSubmit() {
+
+        let res = await axios.put(`/owner`, ownerDetails, {
+            headers: {
+                'Content-Type': 'application/json',
+                'Authorization': `Bearer ${token}`,
+            }
+        })
+        setProcessing(true)
+        console.log(res.data);
+
+        if (res) {
+            // localStorage.setItem("auth", JSON.stringify({
+
+            //     token: res.data.token,
+            // }));
+            history.push('/profile')
+        }
+    }
+
+    return (
+        <div >
+            <CContainer >
+                <CRow className="justify-content-center mt-3">
+
+                    <CCol md={8} className='mt-5'>
+                        <CCardGroup>
+                            <CCard className="p-4">
+
+                                <CCardBody>
+                                    <h1 >Edit Profile</h1>
+                                    <CForm className="row g-3">
+                                        <CCol xs={12}>
+                                            <CFormLabel htmlFor="inputAddress">Cafe Name</CFormLabel>
+                                            <CFormInput id="inputAddress" placeholder="" name='cafeName' value={ownerDetails.cafeName} onChange={handleChange} />
+                                        </CCol>
+
+                                        <CCol md={6}>
+                                            <CFormLabel htmlFor="inputEmail4">Email</CFormLabel>
+                                            <CFormInput type="email" id="inputEmail4" name='email' value={ownerDetails.email} onChange={handleChange} />
+                                        </CCol>
+                                        {/* <CCol md={6}>
+                                            <CFormLabel htmlFor="inputPassword4">Password</CFormLabel>
+                                            <CFormInput type="password" id="inputPassword4" name='password' value={ownerDetails.password} onChange={handleChange} />
+                                        </CCol> */}
+
+
+                                        <CCol md={12}>
+                                            <CFormLabel htmlFor="inputCity">Location</CFormLabel>
+                                            <CFormInput id="inputCity" name='location' value={ownerDetails.location} onChange={handleChange} />
+                                        </CCol>
+                                        <CCol md={6}>
+                                            <CFormLabel htmlFor="inputState">Country</CFormLabel>
+                                            <CFormSelect id="inputState" name='country' onChange={handleChange}>
+                                                <option>Select a country</option>
+                                                {countries.map(item => <option value={item.name}>{item.name}</option>)}
+
+                                            </CFormSelect>
+                                        </CCol>
+                                        <CCol md={6}>
+                                            <CFormLabel htmlFor="inputState">City</CFormLabel>
+                                            <CFormSelect id="inputState" name='city' onChange={handleChange}>
+                                                <option>Select a city</option>
+                                                {cities.map(item => <option value={item.name}>{item.name}</option>)}
+
+                                            </CFormSelect>
+                                        </CCol>
+
+                                        <CCol xs={12}>
+                                            <CButton onClick={handleSubmit} color='dark'>Submit</CButton>
+                                        </CCol>
+                                    </CForm>
+                                </CCardBody>
+                            </CCard>
+                        </CCardGroup>
+                    </CCol>
+                </CRow>
+            </CContainer>
+        </div>
+    )
+}
+
+export default EditProfile

src/views/Profile/Profile.js

@@ -0,0 +1,77 @@
+import React, { useEffect } from 'react'
+import {
+    CButton,
+    CCol,
+    CRow,
+    CTable,
+    CTableBody,
+    CTableDataCell,
+    CTableHead,
+    CTableHeaderCell,
+    CTableRow,
+} from '@coreui/react'
+import { useState } from 'react'
+import axios from 'axios';
+import { isAutheticated } from 'src/auth';
+import { useHistory } from 'react-router-dom';
+
+const Profile = () => {
+    // const user = JSON.parse(localStorage.getItem('auth')).user
+    const [user, setUser] = useState({});
+    const { token } = isAutheticated();
+    const history = useHistory()
+    console.log(token);
+    useEffect(async () => {
+        let res = await axios.get('/owner', {
+            headers: {
+                'Authorization': `Bearer ${token}`
+            }
+        })
+        if (res) {
+            setUser(res.data.user)
+        }
+        console.log(res);
+    }, [])
+
+
+    console.log(user);
+    return (
+        <div>
+            <CRow>
+                <CCol>
+                    <h1>Profile</h1>
+                </CCol>
+                <CCol>
+                    <CButton color='dark' onClick={() => history.push('/edit')}>Edit Profile</CButton>
+                </CCol>
+            </CRow>
+            <CTable color="dark" striped>
+                <CTableHead>
+                    <CTableRow>
+                        <CTableHeaderCell scope="col">Cafe Name</CTableHeaderCell>
+                        <CTableDataCell scope="col">{user.cafeName}</CTableDataCell>
+                    </CTableRow>
+                </CTableHead>
+                <CTableBody>
+                    <CTableRow>
+                        <CTableHeaderCell scope="col">Email</CTableHeaderCell>
+                        <CTableDataCell scope="col">{user.email}</CTableDataCell>
+                    </CTableRow>
+
+                    <CTableRow>
+                        <CTableHeaderCell scope="row">Address</CTableHeaderCell>
+                        <CTableDataCell>{user.location},{user.city},{user.country}</CTableDataCell>
+                    </CTableRow>
+
+                    <CTableRow>
+                        <CTableHeaderCell scope="row">Item_Name</CTableHeaderCell>
+                        <CTableDataCell><img src={user.qr_code} alt="" /></CTableDataCell>
+                    </CTableRow>
+
+                </CTableBody>
+            </CTable>
+        </div>
+    )
+}
+
+export default Profile

src/views/Vendor/AddVendor.js

@@ -61,7 +61,7 @@ const AddVendor = () => {
         const scode = allStates.find(item => item.name === vendor.state)
         console.log(ccode.isoCode + ":" + scode.isoCode);
         console.log(vendor.country, vendor.state);
-        setCountryCode(ccode.isoCode)
+        setCountryCode(ccode?.isoCode)
         setStateCode(scode.isoCode)
         setStates(prev => State.getStatesOfCountry(countryCode))
         setCities(prev => City.getCitiesOfState(countryCode, stateCode))

src/views/pages/login/Login.js

@@ -31,11 +31,12 @@ const Login = () => {
   };
 
   const Login = async () => {
-    const res = await axios.post("/admin-signin", auth);
+    const res = await axios.post("/owner/signin", auth);
     if (res.data.status == "ok") {
       localStorage.setItem("auth", JSON.stringify({
-        // user: res.data.user,
+        user: res.data.user,
         token: res.data.token,
+
       }));
       history.push('/dashboard')
 
@@ -98,6 +99,11 @@ const Login = () => {
 
                   </CForm>
                 </CCardBody>
+                <CButton color="" className="px-0">
+                  <Link to="/newRegister">
+                    dont have an account? Sign Up
+                  </Link>
+                </CButton>
               </CCard>
 
             </CCardGroup>

src/views/pages/register/NewRegister.js

@@ -0,0 +1,123 @@
+import React from 'react'
+import { CForm, CCol, CFormLabel, CContainer, CRow, CCardGroup, CCard, CCardBody, CFormInput, CFormSelect, CFormCheck, CButton } from '@coreui/react'
+import { Country, City } from 'country-state-city'
+import { useState, useEffect } from 'react'
+import axios from 'axios'
+import { useHistory } from 'react-router-dom'
+const NewRegister = () => {
+    const [cities, setCities] = useState([])
+    const [ownerDetails, setOwnerDetails] = useState({
+        cafeName: '',
+        email: '',
+        password: '',
+        location: '',
+        country: 'India',
+        city: ''
+    })
+    const history = useHistory()
+    const [processing, setProcessing] = useState(false)
+    const countries = Country.getAllCountries()
+    useEffect(() => {
+        // console.log(countries);
+        const countryCode = countries.find(item => item.name === ownerDetails.country)
+        // console.log(countryCode);
+        setCities(() => City.getCitiesOfCountry(countryCode?.isoCode))
+        // console.log(cities);
+    }, [ownerDetails.country])
+
+
+    const handleChange = (event) => {
+        const { name, value } = event.target;
+        setOwnerDetails({ ...ownerDetails, [name]: value });
+    };
+
+
+    async function handleSubmit() {
+
+        let res = await axios.post(`/owner/signup`, ownerDetails, {
+            headers: {
+                'Content-Type': 'application/json',
+                // 'Authorization': `Bearer ${token}`,
+            }
+        })
+        setProcessing(true)
+        console.log(res.data);
+
+        if (res) {
+            // localStorage.setItem("auth", JSON.stringify({
+
+            //     token: res.data.token,
+            // }));
+            history.push('/')
+        }
+    }
+
+    return (
+        <div >
+            <CContainer >
+                <CRow className="justify-content-center mt-3">
+
+                    <CCol md={8} className='mt-5'>
+                        <CCardGroup>
+                            <CCard className="p-4">
+
+                                <CCardBody>
+                                    <h1 >Sign Up!!!</h1>
+                                    <CForm className="row g-3">
+                                        <CCol xs={12}>
+                                            <CFormLabel htmlFor="inputAddress">Cafe Name</CFormLabel>
+                                            <CFormInput id="inputAddress" placeholder="" name='cafeName' value={ownerDetails.cafeName} onChange={handleChange} />
+                                        </CCol>
+
+                                        <CCol md={6}>
+                                            <CFormLabel htmlFor="inputEmail4">Email</CFormLabel>
+                                            <CFormInput type="email" id="inputEmail4" name='email' value={ownerDetails.email} onChange={handleChange} />
+                                        </CCol>
+                                        <CCol md={6}>
+                                            <CFormLabel htmlFor="inputPassword4">Password</CFormLabel>
+                                            <CFormInput type="password" id="inputPassword4" name='password' value={ownerDetails.password} onChange={handleChange} />
+                                        </CCol>
+
+
+                                        <CCol md={12}>
+                                            <CFormLabel htmlFor="inputCity">Location</CFormLabel>
+                                            <CFormInput id="inputCity" name='location' value={ownerDetails.location} onChange={handleChange} />
+                                        </CCol>
+                                        <CCol md={6}>
+                                            <CFormLabel htmlFor="inputState">Country</CFormLabel>
+                                            <CFormSelect id="inputState" name='country' onChange={handleChange}>
+                                                <option>Select a country</option>
+                                                {countries.map(item => <option value={item.name}>{item.name}</option>)}
+
+                                            </CFormSelect>
+                                        </CCol>
+                                        <CCol md={6}>
+                                            <CFormLabel htmlFor="inputState">City</CFormLabel>
+                                            <CFormSelect id="inputState" name='city' onChange={handleChange}>
+                                                <option>Select a city</option>
+                                                {cities.map(item => <option value={item.name}>{item.name}</option>)}
+
+                                            </CFormSelect>
+                                        </CCol>
+                                        {/* <CCol md={2}>
+                                            <CFormLabel htmlFor="inputZip">Zip</CFormLabel>
+                                            <CFormInput id="inputZip" />
+                                        </CCol> */}
+                                        {/* <CCol xs={12}>
+                                            <CFormCheck type="checkbox" id="gridCheck" label="Check me out" />
+                                        </CCol> */}
+                                        <CCol xs={12}>
+                                            <CButton onClick={handleSubmit} color='dark'>Sign Up</CButton>
+                                        </CCol>
+                                    </CForm>
+                                </CCardBody>
+                            </CCard>
+                        </CCardGroup>
+                    </CCol>
+                </CRow>
+            </CContainer>
+        </div>
+    )
+}
+
+export default NewRegister

src/views/pages/register/Register.js

@@ -1,4 +1,4 @@
-import React from 'react'
+import React, { useState } from 'react'
 import {
   CButton,
   CCard,
@@ -13,8 +13,48 @@ import {
 } from '@coreui/react'
 import CIcon from '@coreui/icons-react'
 import { cilLockLocked, cilUser } from '@coreui/icons'
+import axios from 'axios'
+import { isAutheticated } from 'src/auth'
+import Swal from 'sweetalert2'
+import { useHistory } from 'react-router-dom'
 
 const Register = () => {
+  const { token } = isAutheticated()
+  const [password, setPassword] = useState({
+    oldPassword: "",
+    newPassword: "",
+    cpassword: ''
+  });
+  const history = useHistory();
+  const handleChange = (e) => (event) => {
+    setPassword({ ...password, [e]: event.target.value });
+  };
+  const handleSubmit = async () => {
+    if (password.cpassword !== password.newPassword) {
+      let res = await axios.put('/owner/changePassword', password, {
+        headers: {
+          Authorization: `Bearer ${token}`
+        }
+      })
+      if (res.statusText === 'OK') {
+        Swal.fire({
+          title: 'Done',
+          text: 'Password Changed',
+          icon: 'success',
+          confirmButtonText: 'ok',
+          confirmButtonColor: '#303c54',
+          iconColor: '#303c54'
+        }).then(() => {
+          history.push('/profile')
+        });
+      }
+
+    } else {
+      alert('new password and confirm password are not matched')
+    }
+
+  }
+
   return (
     <div className="bg-light min-vh-50 d-flex flex-row align-items-flex-start">
       <CContainer>
@@ -35,7 +75,7 @@ const Register = () => {
                     <CInputGroupText>
                       <CIcon icon={cilLockLocked} />
                     </CInputGroupText>
-                    <CFormInput placeholder="Old Password" autoComplete="email" />
+                    <CFormInput placeholder="Old Password" autoComplete="email" onChange={handleChange('oldPassword')} />
                   </CInputGroup>
                   <CInputGroup className="mb-3">
                     <CInputGroupText>
@@ -45,6 +85,7 @@ const Register = () => {
                       type="password"
                       placeholder="Password"
                       autoComplete="new-password"
+                      onChange={handleChange('newPassword')}
                     />
                   </CInputGroup>
                   <CInputGroup className="mb-4">
@@ -55,10 +96,11 @@ const Register = () => {
                       type="password"
                       placeholder="Confirm password"
                       autoComplete="new-password"
+                      onChange={handleChange('cPassword')}
                     />
                   </CInputGroup>
                   <div className="d-grid">
-                    <CButton color="success">Submit</CButton>
+                    <CButton color="success" onClick={() => handleSubmit()}>Submit</CButton>
                   </div>
                 </CForm>
               </CCardBody>