integrated apis
This commit is contained in:
parent
e63e4e3d0a
commit
07b44075fa
@ -38,9 +38,11 @@
|
||||
"@coreui/react-chartjs": "^2.0.0",
|
||||
"@coreui/utils": "^1.3.1",
|
||||
"@wojtekmaj/enzyme-adapter-react-17": "^0.6.5",
|
||||
"axios": "^0.25.0",
|
||||
"chart.js": "^3.6.0",
|
||||
"classnames": "^2.3.1",
|
||||
"core-js": "^3.19.1",
|
||||
"country-state-city": "^3.0.1",
|
||||
"enzyme": "^3.11.0",
|
||||
"prop-types": "^15.7.2",
|
||||
"react": "^17.0.2",
|
||||
|
17
src/auth.js
Normal file
17
src/auth.js
Normal file
@ -0,0 +1,17 @@
|
||||
export const isAutheticated = () => {
|
||||
if (typeof window == "undefined") {
|
||||
return true;
|
||||
}
|
||||
if (localStorage.getItem("auth")) {
|
||||
|
||||
return JSON.parse(localStorage.getItem("auth"));
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
};
|
||||
|
||||
export const signout = () => {
|
||||
localStorage.removeItem("auth");
|
||||
|
||||
return true;
|
||||
};
|
12
src/index.js
12
src/index.js
@ -6,6 +6,18 @@ import App from './App'
|
||||
import * as serviceWorker from './serviceWorker'
|
||||
import { Provider } from 'react-redux'
|
||||
import store from './store'
|
||||
import axios from 'axios'
|
||||
|
||||
const setupAxios = () => {
|
||||
axios.defaults.baseURL = "https://api-courier-vendor.herokuapp.com/"
|
||||
axios.defaults.headers = {
|
||||
'Cache-Control': 'no-cache,no-store',
|
||||
'Pragma': 'no-cache',
|
||||
'Expires': '0',
|
||||
};
|
||||
};
|
||||
|
||||
setupAxios();
|
||||
|
||||
ReactDOM.render(
|
||||
<Provider store={store}>
|
||||
|
@ -1,4 +1,4 @@
|
||||
import React from 'react';
|
||||
import React, { useEffect, useState } from 'react';
|
||||
import {
|
||||
CAvatar,
|
||||
CButton,
|
||||
@ -19,8 +19,28 @@ import {
|
||||
CTableRow,
|
||||
} from '@coreui/react'
|
||||
import { Link } from 'react-router-dom';
|
||||
import { isAutheticated } from 'src/auth';
|
||||
import axios from 'axios';
|
||||
|
||||
const AirwaysBill = () => {
|
||||
const { token } = isAutheticated();
|
||||
console.log(token);
|
||||
|
||||
useEffect(() => {
|
||||
const getData = async () => {
|
||||
const res = await axios.get('/api/vendor/view', {
|
||||
headers: {
|
||||
"Access-Control-Allow-Origin": "*",
|
||||
"Content-type": "Application/json",
|
||||
"Authorization": `Bearer ${token}`
|
||||
}
|
||||
});
|
||||
console.log(res.data);
|
||||
}
|
||||
getData();
|
||||
|
||||
}, []);
|
||||
|
||||
return <div>
|
||||
|
||||
<CButton color="dark">+ Upload Spreadsheet</CButton>
|
||||
|
@ -1,4 +1,4 @@
|
||||
import React from 'react';
|
||||
import React, { useEffect } from 'react';
|
||||
import {
|
||||
CButton,
|
||||
CCard,
|
||||
@ -14,8 +14,50 @@ import {
|
||||
} from '@coreui/react'
|
||||
import CIcon from '@coreui/icons-react'
|
||||
import { cil3d } from '@coreui/icons'
|
||||
import { useState } from 'react';
|
||||
import axios from 'axios';
|
||||
import { isAutheticated } from 'src/auth';
|
||||
|
||||
const AddCourier = () => {
|
||||
const [id, setId] = useState(0);
|
||||
const [date, setDate] = useState('')
|
||||
const [courier, setCourier] = useState('')
|
||||
const { token } = isAutheticated();
|
||||
|
||||
useEffect(() => {
|
||||
const getDate = () => {
|
||||
let today = new Date();
|
||||
let dd = String(today.getDate()).padStart(2, '0');
|
||||
let mm = String(today.getMonth() + 1).padStart(2, '0'); //January is 0!
|
||||
let yyyy = today.getFullYear();
|
||||
|
||||
today = mm + '/' + dd + '/' + yyyy;
|
||||
return today
|
||||
}
|
||||
|
||||
|
||||
const generateCode = () => {
|
||||
setId(Math.round(Math.random() * 1000000000))
|
||||
}
|
||||
generateCode()
|
||||
setDate(getDate())
|
||||
}, [])
|
||||
const handleChange = (e) => {
|
||||
const { name, value } = e.target;
|
||||
setCourier(value)
|
||||
}
|
||||
const handleClick = async () => {
|
||||
let res = await axios.post('/api/courier/add', { name: courier, addedOn: date, UID: id }, {
|
||||
headers: {
|
||||
"Authorization": `Bearer ${token}`
|
||||
}
|
||||
})
|
||||
if (res) {
|
||||
console.log(res.data);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
return <div className="bg-light min-vh-100 d-flex flex-row align-items-start">
|
||||
<CContainer>
|
||||
<CRow className="justify-content-start">
|
||||
@ -25,12 +67,12 @@ const AddCourier = () => {
|
||||
<p className="text-medium-emphasis">Fill the fields and submit to add a new vendor</p>
|
||||
<CRow className=' flex-row align-items-center'>
|
||||
<CCol md={2} ><h5>Unique ID:</h5></CCol>
|
||||
<CCol><h6>5324756898</h6></CCol>
|
||||
<CCol><h6>{id}</h6></CCol>
|
||||
<p className="text-medium-emphasis">(auto-generated)</p>
|
||||
</CRow>
|
||||
<CRow className=' flex-row align-items-center'>
|
||||
<CCol md={2} ><h5>Added On:</h5></CCol>
|
||||
<CCol><h6>5324756898</h6></CCol>
|
||||
<CCol><h6>{date}</h6></CCol>
|
||||
<p className="text-medium-emphasis">(auto-generated)</p>
|
||||
</CRow>
|
||||
|
||||
@ -41,10 +83,11 @@ const AddCourier = () => {
|
||||
<CFormInput
|
||||
type="text"
|
||||
placeholder="Courier Name"
|
||||
autoComplete="courier"
|
||||
name="courier"
|
||||
onChange={handleChange}
|
||||
/>
|
||||
</CInputGroup>
|
||||
<CButton color="dark" className="px-4">
|
||||
<CButton color="dark" className="px-4" onClick={handleClick}>
|
||||
Submit
|
||||
</CButton>
|
||||
|
||||
|
@ -1,4 +1,4 @@
|
||||
import React from 'react';
|
||||
import React, { useEffect } from 'react';
|
||||
import {
|
||||
CAvatar,
|
||||
CButton,
|
||||
@ -19,8 +19,27 @@ import {
|
||||
CTableRow,
|
||||
} from '@coreui/react'
|
||||
import { Link } from 'react-router-dom';
|
||||
import { isAutheticated } from 'src/auth';
|
||||
import axios from 'axios';
|
||||
|
||||
const Courier = () => {
|
||||
const { token } = isAutheticated();
|
||||
console.log(token);
|
||||
|
||||
useEffect(() => {
|
||||
const getData = async () => {
|
||||
const res = await axios.get('/api/vendor/view', {
|
||||
headers: {
|
||||
"Access-Control-Allow-Origin": "*",
|
||||
"Content-type": "Application/json",
|
||||
"Authorization": `Bearer ${token}`
|
||||
}
|
||||
});
|
||||
console.log(res);
|
||||
}
|
||||
getData();
|
||||
|
||||
}, []);
|
||||
return <div>
|
||||
<Link to='/addcourier'>
|
||||
<CButton color="dark">+Add New</CButton>
|
||||
|
113
src/views/Vendor/AddVendor.js
vendored
113
src/views/Vendor/AddVendor.js
vendored
@ -8,14 +8,72 @@ import {
|
||||
CContainer,
|
||||
CForm,
|
||||
CFormInput,
|
||||
CFormSelect,
|
||||
CInputGroup,
|
||||
CInputGroupText,
|
||||
CRow,
|
||||
} from '@coreui/react'
|
||||
import CIcon from '@coreui/icons-react'
|
||||
import { Country, State, City } from 'country-state-city';
|
||||
import { cilGlobeAlt, cilLocationPin, cilLockLocked, cilUser } from '@coreui/icons'
|
||||
import { Link } from 'react-router-dom';
|
||||
import { useState } from 'react';
|
||||
import { useEffect } from 'react';
|
||||
import axios from 'axios';
|
||||
import { getAllStates, getStatesOfCountry, getCitiesOfCountry } from 'country-state-city/dist/lib/state';
|
||||
import { isAutheticated } from 'src/auth';
|
||||
|
||||
|
||||
const AddVendor = () => {
|
||||
const [vendor, setVendor] = useState({
|
||||
vendor_name: '',
|
||||
city: '',
|
||||
state: 'Andhra Pradesh',
|
||||
country: 'India',
|
||||
address_1: '',
|
||||
address_2: '',
|
||||
})
|
||||
const { token } = isAutheticated();
|
||||
const [states, setStates] = useState([]);
|
||||
const [cities, setCities] = useState([]);
|
||||
const [code, setCode] = useState(0);
|
||||
const [countryCode, setCountryCode] = useState('IN')
|
||||
const [stateCode, setStateCode] = useState('AP')
|
||||
const countries = Country.getAllCountries();
|
||||
const allStates = State.getAllStates();
|
||||
// const Code = Math.round(Math.random() * 1000000000);
|
||||
const handleChange = (e) => (event) => {
|
||||
setVendor({ ...vendor, [e]: event.target.value });
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
const generateCode = () => {
|
||||
setCode(Math.round(Math.random() * 1000000000))
|
||||
}
|
||||
generateCode()
|
||||
}, [])
|
||||
useEffect(() => {
|
||||
const ccode = countries.find(item => item.name === vendor.country)
|
||||
const scode = allStates.find(item => item.name === vendor.state)
|
||||
console.log(ccode.isoCode + ":" + scode.isoCode);
|
||||
console.log(vendor.country, vendor.state);
|
||||
setCountryCode(ccode.isoCode)
|
||||
setStateCode(scode.isoCode)
|
||||
setStates(prev => State.getStatesOfCountry(countryCode))
|
||||
setCities(prev => City.getCitiesOfState(countryCode, stateCode))
|
||||
}, [vendor.country, vendor.state, countryCode, stateCode]);
|
||||
|
||||
const handleClick = async () => {
|
||||
let res = await axios.post('/api/vendor/add', vendor, {
|
||||
headers: {
|
||||
"Authorization": `Bearer ${token}`
|
||||
}
|
||||
})
|
||||
if (res) {
|
||||
console.log(res.data);
|
||||
}
|
||||
}
|
||||
|
||||
return <div className="bg-light min-vh-100 d-flex flex-row align-items-start">
|
||||
<CContainer>
|
||||
<CRow className="justify-content-start">
|
||||
@ -25,14 +83,14 @@ const AddVendor = () => {
|
||||
<p className="text-medium-emphasis">Fill the fields and submit to add a new vendor</p>
|
||||
<CRow className=' flex-row align-items-center'>
|
||||
<CCol md={2} ><h4>Code:</h4></CCol>
|
||||
<CCol><h6>5324756898</h6></CCol>
|
||||
<CCol><h6>{code}</h6></CCol>
|
||||
<p className="text-medium-emphasis">(auto-generated)</p>
|
||||
</CRow>
|
||||
<CInputGroup className="mb-3">
|
||||
<CInputGroupText>
|
||||
<CIcon icon={cilUser} />
|
||||
</CInputGroupText>
|
||||
<CFormInput placeholder="Vendor Name" autoComplete="vendorname" />
|
||||
<CFormInput placeholder="Vendor Name" autoComplete="vendorname" onChange={handleChange("vendor_name")} />
|
||||
</CInputGroup>
|
||||
<CInputGroup className="mb-3">
|
||||
<CInputGroupText>
|
||||
@ -41,35 +99,52 @@ const AddVendor = () => {
|
||||
<CFormInput
|
||||
type="text"
|
||||
placeholder="Address Line 1"
|
||||
// autoComplete="address"
|
||||
onChange={handleChange("address_1")}
|
||||
/>
|
||||
<CFormInput
|
||||
type="text"
|
||||
placeholder="Address Line 2(area)"
|
||||
autoComplete="address2"
|
||||
onChange={handleChange("address_2")}
|
||||
/>
|
||||
</CInputGroup>
|
||||
<CInputGroup className="mb-3">
|
||||
<CInputGroupText>
|
||||
<CIcon icon={cilGlobeAlt} />
|
||||
</CInputGroupText>
|
||||
<CFormInput
|
||||
type="text"
|
||||
placeholder="Country"
|
||||
autoComplete="country"
|
||||
/>
|
||||
<CFormInput
|
||||
type="text"
|
||||
placeholder="State"
|
||||
autoComplete="state"
|
||||
/>
|
||||
<CFormInput
|
||||
type="text"
|
||||
placeholder="City"
|
||||
autoComplete="city"
|
||||
/>
|
||||
<CFormSelect
|
||||
aria-label="Default select example"
|
||||
onChange={handleChange("country")}
|
||||
>
|
||||
<option value='India'>Select Country</option>{
|
||||
countries.map((item) =>
|
||||
<option value={item.name}>{item.name}</option>
|
||||
)
|
||||
}
|
||||
</CFormSelect>
|
||||
<CFormSelect
|
||||
aria-label="Default select example"
|
||||
onChange={handleChange("state")}
|
||||
>
|
||||
<option value='Chandigarh'>Select State</option>{
|
||||
states.map((item) =>
|
||||
<option value={item.name}>{item.name}</option>
|
||||
)
|
||||
}
|
||||
</CFormSelect>
|
||||
<CFormSelect
|
||||
aria-label="Default select example"
|
||||
onChange={handleChange("city")}
|
||||
placeholder='Select City'
|
||||
>
|
||||
<option value='Mumbai'>Select City</option>{
|
||||
cities.map((item) =>
|
||||
<option value={item.name}>{item.name}</option>
|
||||
)
|
||||
}
|
||||
</CFormSelect>
|
||||
</CInputGroup>
|
||||
<CButton color="dark" className="px-4">
|
||||
<CButton color="dark" className="px-4" onClick={handleClick}>
|
||||
Submit
|
||||
</CButton>
|
||||
|
||||
|
24
src/views/Vendor/Vendor.js
vendored
24
src/views/Vendor/Vendor.js
vendored
@ -1,4 +1,4 @@
|
||||
import React from 'react';
|
||||
import React, { useEffect } from 'react';
|
||||
import {
|
||||
CAvatar,
|
||||
CButton,
|
||||
@ -19,8 +19,30 @@ import {
|
||||
CTableRow,
|
||||
} from '@coreui/react'
|
||||
import { Link } from 'react-router-dom';
|
||||
import axios from 'axios';
|
||||
import { isAutheticated } from '../../auth';
|
||||
|
||||
const Vendor = () => {
|
||||
const { token } = isAutheticated();
|
||||
console.log(token);
|
||||
|
||||
useEffect(() => {
|
||||
const getData = async () => {
|
||||
const res = await axios.get('/api/vendor/view', {
|
||||
headers: {
|
||||
"Access-Control-Allow-Origin": "*",
|
||||
"Content-type": "Application/json",
|
||||
"Authorization": `Bearer ${token}`
|
||||
}
|
||||
});
|
||||
console.log(res);
|
||||
}
|
||||
getData();
|
||||
|
||||
}, []);
|
||||
|
||||
|
||||
|
||||
return <div>
|
||||
<Link to='/addvendor'>
|
||||
<CButton color="dark">+Add New Vendor</CButton>
|
||||
|
@ -15,8 +15,38 @@ import {
|
||||
} from '@coreui/react'
|
||||
import CIcon from '@coreui/icons-react'
|
||||
import { cilLockLocked, cilUser } from '@coreui/icons'
|
||||
import { useState } from 'react'
|
||||
import axios from 'axios'
|
||||
import { useHistory } from 'react-router-dom'
|
||||
|
||||
const Login = () => {
|
||||
const [auth, setAuth] = useState({
|
||||
email: "",
|
||||
password: ""
|
||||
});
|
||||
const history = useHistory();
|
||||
|
||||
const handleChange = (e) => (event) => {
|
||||
setAuth({ ...auth, [e]: event.target.value });
|
||||
};
|
||||
|
||||
const Login = async () => {
|
||||
const res = await axios.post("/admin-signin", auth);
|
||||
if (res.data.status == "ok") {
|
||||
localStorage.setItem("auth", JSON.stringify({
|
||||
// user: res.data.user,
|
||||
token: res.data.token,
|
||||
}));
|
||||
history.push('/dashboard')
|
||||
|
||||
}
|
||||
else {
|
||||
if (res.data.status === "blocked")
|
||||
alert(res.data.message)
|
||||
else
|
||||
alert("Invalid Credentials");
|
||||
}
|
||||
}
|
||||
return (
|
||||
<div className="bg-light min-vh-100 d-flex flex-row align-items-center">
|
||||
<CContainer>
|
||||
@ -32,7 +62,7 @@ const Login = () => {
|
||||
<CInputGroupText>
|
||||
<CIcon icon={cilUser} />
|
||||
</CInputGroupText>
|
||||
<CFormInput placeholder="Email" autoComplete="email" />
|
||||
<CFormInput placeholder="Email" onChange={handleChange("email")} autoComplete="email" />
|
||||
</CInputGroup>
|
||||
<CInputGroup className="mb-4">
|
||||
<CInputGroupText>
|
||||
@ -40,16 +70,17 @@ const Login = () => {
|
||||
</CInputGroupText>
|
||||
<CFormInput
|
||||
type="password"
|
||||
onChange={handleChange("password")}
|
||||
placeholder="Password"
|
||||
autoComplete="current-password"
|
||||
/>
|
||||
</CInputGroup>
|
||||
|
||||
<Link to="/dashboard">
|
||||
<CButton color="primary" className="px-4">
|
||||
Login
|
||||
</CButton>
|
||||
</Link>
|
||||
|
||||
<CButton color="primary" className="px-4" onClick={Login}>
|
||||
Login
|
||||
</CButton>
|
||||
|
||||
|
||||
<Link to="/">
|
||||
<CButton color="dark" className="px-4 ms-2">
|
||||
|
Loading…
Reference in New Issue
Block a user