created pages,integrated apis

This commit is contained in:
sanaya 2022-02-21 17:58:28 +05:30
parent 36916f8d05
commit ebaa25028a
11 changed files with 418 additions and 35 deletions

View File

@ -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"

View File

@ -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',
// icon: <CIcon icon={cilPencil} customClassName="nav-icon" />,
// to: '/register',
// 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: 'Profile',
icon: <CIcon icon={cilPencil} customClassName="nav-icon" />,
to: '/profile',
},
// {
// component: CNavGroup,
// name: 'Pages',
// icon: <CIcon icon={cilStar} customClassName="nav-icon" />,
// name: 'Profile',
// icon: <CIcon icon={cilUser} customClassName="nav-icon" />,
// items: [
// {
// component: CNavItem,
// name: 'Error 404',
// to: '/404',
// name: 'Display',
// to: '/profile',
// },
// {
// component: CNavItem,
// name: 'Error 500',
// to: '/500',
// name: 'Edit',
// to: '/edit',
// },
// ],
// },

View File

@ -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',

View File

@ -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 },

View File

@ -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">

View File

@ -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

View File

@ -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

View File

@ -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))

View File

@ -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>

View File

@ -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

View File

@ -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>