business add
This commit is contained in:
pawan-dot
parent
33cc57953b
commit
a59cc491b5
@ -40,6 +40,7 @@
|
||||
"@coreui/react-chartjs": "^2.0.0",
|
||||
"@coreui/utils": "^1.3.1",
|
||||
"@material-ui/core": "^4.12.4",
|
||||
"@mui/material": "^5.11.12",
|
||||
"@reduxjs/toolkit": "^1.9.2",
|
||||
"@wojtekmaj/enzyme-adapter-react-17": "^0.6.5",
|
||||
"axios": "^0.25.0",
|
||||
@ -47,7 +48,7 @@
|
||||
"chart.js": "^3.6.0",
|
||||
"classnames": "^2.3.1",
|
||||
"core-js": "^3.19.1",
|
||||
"country-state-city": "^3.0.1",
|
||||
"country-state-city": "^3.1.2",
|
||||
"enzyme": "^3.11.0",
|
||||
"file-saver": "^2.0.5",
|
||||
"prop-types": "^15.7.2",
|
||||
@ -58,6 +59,7 @@
|
||||
"react-datepicker": "^4.8.0",
|
||||
"react-dom": "^18.0.0",
|
||||
"react-hot-toast": "^2.4.0",
|
||||
"react-multistep": "^5.5.8",
|
||||
"react-paginate": "^8.1.3",
|
||||
"react-qr-code": "^2.0.11",
|
||||
"react-redux": "^7.2.9",
|
||||
|
||||
@ -155,7 +155,7 @@ const _nav = [
|
||||
component: CNavItem,
|
||||
name: 'Business Type',
|
||||
icon: <CIcon icon={cilBrush} customClassName="nav-icon" />,
|
||||
to: '/business',
|
||||
to: '/business_type',
|
||||
},
|
||||
|
||||
// {
|
||||
|
||||
@ -61,14 +61,16 @@ import Testimonials from './views/Testimonials/Testimonials'
|
||||
import AddTestimonial from './views/Testimonials/AddTestimonial'
|
||||
import ViewTestimonial from './views/Testimonials/ViewTestimonial'
|
||||
import Policies from './views/configuration/Policies/Policies'
|
||||
////purpose
|
||||
import Purpose from './views/configuration/Purpose/Purpose'
|
||||
import AddPurpose from './views/configuration/Purpose/AddPurpose'
|
||||
//language
|
||||
import Languages from './views/configuration/Language/Languages'
|
||||
import AddLanguage from './views/configuration/Language/AddLanguage'
|
||||
import EditLanguage from './views/configuration/Language/EditLanguage'
|
||||
//
|
||||
//BusinessType
|
||||
import BusinessType from './views/configuration/Business/Business'
|
||||
import AddBusinessType from './views/configuration/Language/AddLanguage'
|
||||
import AddBusinessType from './views/configuration/Business/AddBusiness'
|
||||
import EditBusinessType from './views/configuration/Business/EditLanguage'
|
||||
import EditPurpose from './views/configuration/Purpose/EditPurpose.js'
|
||||
const routes = [
|
||||
@ -140,16 +142,16 @@ const routes = [
|
||||
{ path: '/languages', name: 'languages', element: Languages },
|
||||
{ path: '/language/add', name: 'Add languages', element: AddLanguage },
|
||||
{ path: '/language/edit/:id', name: 'Edit languages', element: EditLanguage },
|
||||
//business
|
||||
//business Type
|
||||
|
||||
{ path: '/business', name: 'business', element: BusinessType },
|
||||
{ path: '/business/add', name: 'Add business', element: AddBusinessType },
|
||||
{ path: '/business/edit/:id', name: 'Edit business', element: EditBusinessType },
|
||||
{ path: '/business_type', name: 'business', element: BusinessType },
|
||||
{ path: '/business_type/add', name: 'Add business', element: AddBusinessType },
|
||||
{ path: '/business_type/edit/:id', name: 'Edit business', element: EditBusinessType },
|
||||
|
||||
//purpose
|
||||
|
||||
{ path: '/purpose', name: 'purpose', element: Languages },
|
||||
{ path: '/purpose/add', name: 'Add purpose', element: AddLanguage },
|
||||
{ path: '/purpose', name: 'purpose', element: Purpose },
|
||||
{ path: '/purpose/add', name: 'Add purpose', element: AddPurpose },
|
||||
{ path: '/purpose/edit/:id', name: 'Edit purpose', element: EditPurpose },
|
||||
|
||||
//languge
|
||||
|
||||
@ -1,190 +1,61 @@
|
||||
|
||||
|
||||
|
||||
import React, { useEffect, useState } from 'react'
|
||||
import Button from '@material-ui/core/Button'
|
||||
import { Link, useNavigate } from 'react-router-dom'
|
||||
import swal from 'sweetalert'
|
||||
import React, { useState, useEffect } from 'react'
|
||||
// import { Button } from '@mui/material'
|
||||
import axios from 'axios'
|
||||
|
||||
import { Link, useNavigate } from 'react-router-dom'
|
||||
import { CCard, CCardBody, CCardGroup, CCol, CContainer, CRow } from '@coreui/react'
|
||||
import SelectPurpose from './multiform/SelectPurpose.js'
|
||||
import SelectBusiness from './multiform/SelectBusiness.js'
|
||||
import SelectLanguage from './multiform/selectLanguage.js'
|
||||
import BAddress from './multiform/BAddress.js'
|
||||
import Button from '@material-ui/core/Button'
|
||||
|
||||
|
||||
import { isAutheticated } from 'src/auth'
|
||||
// import { WebsiteURL } from '../WebsiteURL'
|
||||
|
||||
|
||||
const AddBusiness = () => {
|
||||
const [WebsiteURL, setWebsiteURL] = useState('https://reinventuniforms.in/')
|
||||
const token = isAutheticated()
|
||||
const [productId, setProductId] = useState('')
|
||||
const [viewState, setViewState] = useState(1)
|
||||
|
||||
|
||||
const navigate = useNavigate()
|
||||
const [data, setData] = useState({
|
||||
image: '',
|
||||
imageURL: '',
|
||||
name: '',
|
||||
email: '',
|
||||
address_line_1: '',
|
||||
address_line_2: '',
|
||||
city: '',
|
||||
state_name: '',
|
||||
short_url: '',
|
||||
contact_Number: '',
|
||||
contact_Person_Name: '',
|
||||
price_Lable: '',
|
||||
pin_Code: ''
|
||||
})
|
||||
|
||||
const [cities, setCities] = useState([])
|
||||
|
||||
const [loading, setLoading] = useState(false)
|
||||
const [validForm, setValidForm] = useState(false)
|
||||
|
||||
const [data, setData] = useState({
|
||||
business: '',
|
||||
purpose: '',
|
||||
|
||||
const [limiter, setLimiter] = useState({
|
||||
name: 100,
|
||||
nameHas: 100,
|
||||
language: [],
|
||||
country: '',
|
||||
state: '',
|
||||
city: '',
|
||||
address_Line_1: '',
|
||||
address_Line_2: '',
|
||||
pincode: ''
|
||||
})
|
||||
|
||||
const getRequired = () => {
|
||||
axios
|
||||
.get(`/api/city`, {
|
||||
headers: {
|
||||
'Access-Control-Allow-Origin': '*',
|
||||
Authorization: `Bearer ${token}`,
|
||||
},
|
||||
})
|
||||
.then((res) => {
|
||||
setCities([...res.data.data])
|
||||
})
|
||||
.catch((err) => { })
|
||||
|
||||
|
||||
console.log(data)
|
||||
|
||||
const handleView = (n) => {
|
||||
if (viewState === n) return
|
||||
setViewState(n)
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
getRequired()
|
||||
}, [])
|
||||
const [errors, setErrors] = useState({
|
||||
emailError: '',
|
||||
|
||||
|
||||
})
|
||||
const validEmailRegex = RegExp(
|
||||
/^(([^<>()\[\]\.,;:\s@\"]+(\.[^<>()\[\]\.,;:\s@\"]+)*)|(\".+\"))@(([^<>()[\]\.,;:\s@\"]+\.)+[^<>()[\]\.,;:\s@\"]{2,})$/i,
|
||||
)
|
||||
const validateForm = () => {
|
||||
let valid = true
|
||||
Object.values(errors).forEach((val) => {
|
||||
if (val.length > 0) {
|
||||
valid = false
|
||||
return false
|
||||
}
|
||||
})
|
||||
Object.values(data.email).forEach((val) => {
|
||||
if (val.length <= 0) {
|
||||
valid = false
|
||||
return false
|
||||
}
|
||||
})
|
||||
return valid
|
||||
}
|
||||
|
||||
//cheking email and password
|
||||
useEffect(() => {
|
||||
if (validateForm()) {
|
||||
setValidForm(true)
|
||||
} else {
|
||||
setValidForm(false)
|
||||
}
|
||||
}, [errors])
|
||||
// const handleChange = (e) => {
|
||||
// const { name, value } = e.target
|
||||
|
||||
// switch (name) {
|
||||
// case 'email':
|
||||
// setErrors({
|
||||
// ...errors,
|
||||
// emailError: validEmailRegex.test(value) ? '' : 'Email is not valid!',
|
||||
// })
|
||||
|
||||
// break
|
||||
// case 'password':
|
||||
// setErrors((errors) => ({
|
||||
// ...errors,
|
||||
// passwordError: validPasswordRegex.test(value)
|
||||
// ? ''
|
||||
// : 'Password Shoud Be 8 Characters Long, Atleast One Uppercase, Atleast One Lowercase,Atleast One Digit, Atleast One Special Character',
|
||||
// }))
|
||||
// break
|
||||
// default:
|
||||
// break
|
||||
// }
|
||||
|
||||
// setAuth({ ...auth, [name]: value })
|
||||
// }
|
||||
|
||||
|
||||
const handleChange = (e) => {
|
||||
if (e.target.id === 'name') {
|
||||
if (e.target.value.length === limiter[e.target.id] + 1) return
|
||||
setLimiter((prev) => ({
|
||||
...prev,
|
||||
[e.target.id + 'Has']: prev[e.target.id] - e.target.value.length,
|
||||
}))
|
||||
setData((prev) => ({ ...prev, short_url: e.target.value.toLowerCase().replace(/\s+/g, '-') }))
|
||||
}
|
||||
if (e.target.id === 'email') {
|
||||
setErrors({
|
||||
...errors,
|
||||
emailError: validEmailRegex.test(e.target.value) ? '' : 'Email is not valid!',
|
||||
})
|
||||
|
||||
|
||||
}
|
||||
if (e.target.id === 'city') {
|
||||
const city = cities.filter((m) => e.target.value === m?._id)
|
||||
setData((prev) => ({ ...prev, state_name: city[0]?.state?.state_name || '' }))
|
||||
}
|
||||
if (e.target.id === 'image') {
|
||||
if (
|
||||
e.target.files[0]?.type === 'image/jpeg' ||
|
||||
e.target.files[0]?.type === 'image/png' ||
|
||||
e.target.files[0]?.type === 'image/jpg'
|
||||
) {
|
||||
setData((prev) => ({
|
||||
...prev,
|
||||
imageURL: URL.createObjectURL(e.target.files[0]),
|
||||
image: e.target.files[0],
|
||||
}))
|
||||
return
|
||||
} else {
|
||||
swal({
|
||||
title: 'Warning',
|
||||
text: 'Upload jpg, jpeg, png only.',
|
||||
icon: 'error',
|
||||
button: 'Close',
|
||||
dangerMode: true,
|
||||
})
|
||||
setData((prev) => ({
|
||||
...prev,
|
||||
imageURL: '',
|
||||
image: '',
|
||||
}))
|
||||
e.target.value = null
|
||||
return
|
||||
}
|
||||
}
|
||||
setData((prev) => ({ ...prev, [e.target.id]: e.target.value }))
|
||||
}
|
||||
|
||||
const handleSubmit = () => {
|
||||
if (
|
||||
data.name.trim() === '' ||
|
||||
data.email.trim() === '' ||
|
||||
data.contact_Number === '' ||
|
||||
data.address_Line_1.trim() === '' ||
|
||||
data.address_Line_2.trim() === '' ||
|
||||
|
||||
data.contact_Person_Name === '' ||
|
||||
data.address_line_1.trim() === '' ||
|
||||
data.address_line_2.trim() === '' ||
|
||||
data.price_Lable.trim() === '' ||
|
||||
data.business === '' ||
|
||||
data.purpose.trim() === '' ||
|
||||
data.language === '' ||
|
||||
data.country === '' ||
|
||||
data.state === '' ||
|
||||
data.city === '' ||
|
||||
data.pin_Code.trim() === '' ||
|
||||
data.short_url === '' ||
|
||||
data.state_name === ''
|
||||
// data.imageURL.trim() === ''
|
||||
data.pincode.trim() === ''
|
||||
) {
|
||||
swal({
|
||||
title: 'Warning',
|
||||
@ -197,24 +68,22 @@ const AddBusiness = () => {
|
||||
}
|
||||
setLoading(true)
|
||||
const formData = new FormData()
|
||||
formData.set('name', data.name)
|
||||
formData.set('email', data.email)
|
||||
formData.set('address_Line_1', data.address_Line_1)
|
||||
formData.set('address_Line_2', data.address_Line_2)
|
||||
|
||||
formData.set('address_line_1', data.address_line_1)
|
||||
formData.set('address_line_2', data.address_line_2)
|
||||
formData.set('purpose', data.purpose)
|
||||
formData.set('business', data.business)
|
||||
formData.set('language', data.language)
|
||||
|
||||
formData.set('country', data.country)
|
||||
formData.set('city', data.city)
|
||||
formData.set('state_name', data.state_name)
|
||||
formData.set('contact_Number', data.contact_Number)
|
||||
formData.set('contact_Person_Name', data.contact_Person_Name)
|
||||
formData.set('state', data.state)
|
||||
|
||||
formData.set('price_Lable', data.price_Lable)
|
||||
formData.set('pin_Code', data.pin_Code)
|
||||
formData.set('url', WebsiteURL + data.short_url + '/login')
|
||||
formData.set('short_url', data.short_url)
|
||||
|
||||
formData.append('image', data.image)
|
||||
formData.set('pincode', data.pincode)
|
||||
|
||||
axios
|
||||
.post(`/api/franchisee/`, formData, {
|
||||
.post(`/api/businesses/add`, formData, {
|
||||
headers: {
|
||||
Authorization: `Bearer ${token}`,
|
||||
'Content-Type': 'multipart/formdata',
|
||||
@ -224,12 +93,12 @@ const AddBusiness = () => {
|
||||
.then((res) => {
|
||||
swal({
|
||||
title: 'Added',
|
||||
text: res?.data?.message ? res?.data?.message : 'Franchisee added successfully!',
|
||||
text: res?.data?.message ? res?.data?.message : 'Business added successfully!',
|
||||
icon: 'success',
|
||||
button: 'Return',
|
||||
})
|
||||
setLoading(false)
|
||||
navigate('/franchisees', { replace: true })
|
||||
navigate('/businesses', { replace: true })
|
||||
})
|
||||
.catch((err) => {
|
||||
setLoading(false)
|
||||
@ -245,9 +114,9 @@ const AddBusiness = () => {
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-12">
|
||||
<CContainer>
|
||||
<CRow className="mt-3">
|
||||
<CCol md={12}>
|
||||
<div
|
||||
className="
|
||||
page-title-box
|
||||
@ -257,255 +126,132 @@ const AddBusiness = () => {
|
||||
"
|
||||
>
|
||||
<div style={{ fontSize: '22px' }} className="fw-bold">
|
||||
Add Franchisee
|
||||
Add Business
|
||||
</div>
|
||||
<div style={{ display: 'flex', gap: '1rem' }}>
|
||||
<h4 className="mb-0"></h4>
|
||||
</div>
|
||||
|
||||
<div className="page-title-right">
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
style={{
|
||||
fontWeight: 'bold',
|
||||
marginBottom: '1rem',
|
||||
textTransform: 'capitalize',
|
||||
marginRight: '5px',
|
||||
}}
|
||||
onClick={() => handleSubmit()}
|
||||
disabled={loading}
|
||||
>
|
||||
{loading ? 'Loading' : 'Save'}
|
||||
</Button>
|
||||
<Link to="/franchisees">
|
||||
<div className="page-title-right">
|
||||
<Button
|
||||
variant="contained"
|
||||
color="secondary"
|
||||
color="primary"
|
||||
style={{
|
||||
fontWeight: 'bold',
|
||||
marginBottom: '1rem',
|
||||
textTransform: 'capitalize',
|
||||
}}
|
||||
onClick={() => {
|
||||
handleSubmit()
|
||||
|
||||
}}
|
||||
disabled={data.address_Line_1.trim() === '' ||
|
||||
data.address_Line_2.trim() === '' ||
|
||||
|
||||
data.business === '' ||
|
||||
data.purpose.trim() === '' ||
|
||||
data.language === '' ||
|
||||
data.country === '' ||
|
||||
data.state === '' ||
|
||||
data.city === '' ||
|
||||
data.pincode.trim() === ''}
|
||||
>
|
||||
Back
|
||||
{loading ? 'Loading' : 'Add Now'}
|
||||
</Button>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="row">
|
||||
<div className="col-sm-12 col-md-12 col-lg-6 my-1">
|
||||
<div className="card h-100">
|
||||
<div className="card-body px-5">
|
||||
<div className="mb-3">
|
||||
<label htmlFor="title" className="form-label">
|
||||
Franchisee Name*
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
id="name"
|
||||
value={data.name}
|
||||
maxLength={limiter.name}
|
||||
onChange={(e) => handleChange(e)}
|
||||
/>
|
||||
<p className="pt-1 pl-2 text-secondary">Remaining characters : {limiter.nameHas}</p>
|
||||
</div>
|
||||
|
||||
<div className="mb-3">
|
||||
<label htmlFor="title" className="form-label">
|
||||
Email *
|
||||
</label>
|
||||
<input
|
||||
type="email"
|
||||
className="form-control"
|
||||
id="email"
|
||||
value={data.email}
|
||||
maxLength="50"
|
||||
onChange={(e) => handleChange(e)}
|
||||
/>
|
||||
{errors.emailError && (
|
||||
<p className="text-center py-2 text-danger">{errors.emailError}</p>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div className="mb-3">
|
||||
<label htmlFor="title" className="form-label">
|
||||
Address Line 1*
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
id="address_line_1"
|
||||
value={data.address_line_1}
|
||||
maxLength="50"
|
||||
onChange={(e) => handleChange(e)}
|
||||
/>
|
||||
</div>
|
||||
<div className="mb-3">
|
||||
<label htmlFor="title" className="form-label">
|
||||
Address Line 2*
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
id="address_line_2"
|
||||
value={data.address_line_2}
|
||||
maxLength="50"
|
||||
onChange={(e) => handleChange(e)}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="mb-3">
|
||||
<label htmlFor="pageToLink" className="form-label">
|
||||
City*
|
||||
</label>
|
||||
<select
|
||||
onChange={(e) => handleChange(e)}
|
||||
value={data.city}
|
||||
className="form-control"
|
||||
id="city"
|
||||
>
|
||||
<option value="">---select---</option>
|
||||
{cities[0] ? (
|
||||
cities.map((c, i) => (
|
||||
<option key={i} value={c._id}>
|
||||
{c.city_name + ', ' + c.state?.state_name}
|
||||
</option>
|
||||
))
|
||||
) : (
|
||||
<option value="" disabled>
|
||||
Please add a City
|
||||
</option>
|
||||
)}
|
||||
</select>
|
||||
</div>
|
||||
<div className="mb-3">
|
||||
<label htmlFor="title" className="form-label">
|
||||
State*
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
id="state_name"
|
||||
value={data.state_name}
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
<div className="mb-3">
|
||||
<label htmlFor="title" className="form-label">
|
||||
Pin Code *
|
||||
</label>
|
||||
<input
|
||||
type="Number"
|
||||
className="form-control"
|
||||
id="pin_Code"
|
||||
value={data.pin_Code}
|
||||
maxLength={8}
|
||||
onChange={(e) => handleChange(e)}
|
||||
/>
|
||||
{/* {data.pin_Code ? <><small className="charLeft mt-4 fst-italic">
|
||||
{8 - data.pin_Code.length} characters left
|
||||
</small></> : <></>
|
||||
} */}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-sm-12 col-md-12 col-lg-6 my-1">
|
||||
<div className="card h-100">
|
||||
<div className="card-body px-5">
|
||||
|
||||
<div className="mb-3">
|
||||
<label htmlFor="title" className="form-label">
|
||||
Contact Number*
|
||||
</label>
|
||||
<input
|
||||
type="number"
|
||||
className="form-control"
|
||||
id="contact_Number"
|
||||
value={data.contact_Number}
|
||||
onChange={(e) => handleChange(e)}
|
||||
/>
|
||||
</div>
|
||||
<div className="mb-3">
|
||||
<label htmlFor="title" className="form-label">
|
||||
Contact Person Name*
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
id="contact_Person_Name"
|
||||
value={data.contact_Person_Name}
|
||||
onChange={(e) => handleChange(e)}
|
||||
/>
|
||||
</div>
|
||||
<div className="mb-3">
|
||||
<label htmlFor="title" className="form-label">
|
||||
URL*
|
||||
</label>
|
||||
<div className="input-group mb-3">
|
||||
<span className="input-group-text" id="basic-addon3">
|
||||
{WebsiteURL}
|
||||
</span>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
id="short_url"
|
||||
aria-describedby="basic-addon3"
|
||||
value={data.short_url}
|
||||
onChange={(e) => handleChange(e)}
|
||||
</CCol>
|
||||
</CRow>
|
||||
<CRow>
|
||||
<CCol md={9} className="mt-1">
|
||||
<CCardGroup>
|
||||
<CCard className="p-4 mb-3">
|
||||
<CCardBody>
|
||||
{viewState === 1 && (
|
||||
<SelectBusiness
|
||||
data={{ data, setData }}
|
||||
// categories={categories}
|
||||
handleView={handleView}
|
||||
// ProductId={{ productId, setProductId }}
|
||||
loading={{ loading, setLoading }}
|
||||
/>
|
||||
)}
|
||||
{viewState === 2 && (
|
||||
<SelectPurpose
|
||||
data={{ data, setData }}
|
||||
handleView={handleView}
|
||||
|
||||
// productId={productId}
|
||||
// data={{ varients, setVarients }}
|
||||
// taxes={taxes}
|
||||
// sizes={sizes}
|
||||
loading={{ loading, setLoading }}
|
||||
/>
|
||||
)}
|
||||
{viewState === 3 && (
|
||||
<SelectLanguage
|
||||
data={{ data, setData }}
|
||||
handleView={handleView}
|
||||
|
||||
// productId={productId}
|
||||
// data={{ images, setImages }}
|
||||
loading={{ loading, setLoading }}
|
||||
/>
|
||||
)}
|
||||
{viewState === 4 && (
|
||||
<BAddress
|
||||
data={{ data, setData }}
|
||||
handleView={handleView}
|
||||
|
||||
// productId={productId}
|
||||
// data={{ images, setImages }}
|
||||
loading={{ loading, setLoading }}
|
||||
/>
|
||||
)}
|
||||
</CCardBody>
|
||||
</CCard>
|
||||
</CCardGroup>
|
||||
</CCol>
|
||||
<CCol md={3} className="mt-1">
|
||||
<CCardGroup>
|
||||
<CCard>
|
||||
<CCardBody>
|
||||
<div className="d-grid gap-2">
|
||||
<button
|
||||
className={viewState === 1 ? 'btn btn-light' : 'btn btn-info text-white'}
|
||||
type="button"
|
||||
onClick={() => handleView(1)}
|
||||
>
|
||||
Select Business Type
|
||||
|
||||
</button>
|
||||
<button
|
||||
className={viewState === 2 ? 'btn btn-light' : 'btn btn-info text-white'}
|
||||
type="button"
|
||||
onClick={() => handleView(2)}
|
||||
>
|
||||
Select Purpose
|
||||
|
||||
</button>
|
||||
<button
|
||||
className={viewState === 3 ? 'btn btn-light' : 'btn btn-info text-white'}
|
||||
type="button"
|
||||
onClick={() => handleView(3)}
|
||||
>
|
||||
Select Languages
|
||||
</button>
|
||||
<button
|
||||
className={viewState === 4 ? 'btn btn-light' : 'btn btn-info text-white'}
|
||||
type="button"
|
||||
onClick={() => handleView(4)}
|
||||
>
|
||||
Address
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className=" mb-3">
|
||||
<label htmlFor="title" className="form-label">
|
||||
Price Lable*
|
||||
</label> <select className="form-control" name="price_Lable" id="price_Lable"
|
||||
onChange={(e) => handleChange(e)}
|
||||
value={data.price_Lable}
|
||||
>
|
||||
|
||||
|
||||
|
||||
<option value="" disabled>---</option>
|
||||
|
||||
<option value="base_Price">Base Price</option>
|
||||
<option value="price_Level_2"> price Level 2</option>
|
||||
<option value="price_Level_3">price Level 3</option>
|
||||
|
||||
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div className="mb-3">
|
||||
<label htmlFor="image" className="form-label">
|
||||
Franchisee Banner (optional)
|
||||
</label>
|
||||
<input
|
||||
type="file"
|
||||
className="form-control"
|
||||
id="image"
|
||||
accept="image/*"
|
||||
onChange={(e) => handleChange(e)}
|
||||
/>
|
||||
<p className="pt-1 pl-2 text-secondary">Upload jpg, jpeg and png only*</p>
|
||||
</div>
|
||||
<div className="mb-3" style={{ height: '200px', maxWdth: '100%' }}>
|
||||
<img
|
||||
src={data.imageURL}
|
||||
alt="Uploaded Image will be shown here"
|
||||
style={{ maxHeight: '200px', maxWidth: '100%' }}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</CCardBody>
|
||||
</CCard>
|
||||
</CCardGroup>
|
||||
</CCol>
|
||||
</CRow>
|
||||
</CContainer>
|
||||
)
|
||||
}
|
||||
|
||||
|
||||
@ -23,14 +23,14 @@ const Businesses = () => {
|
||||
setItemPerPage(e.target.value)
|
||||
}
|
||||
|
||||
const getCategories = () => {
|
||||
const getbusinesses = () => {
|
||||
axios
|
||||
.get(`/api/franchisee`, {
|
||||
.get(`/api/businesses/getall`, {
|
||||
headers: { 'Access-Control-Allow-Origin': '*', Authorization: `Bearer ${token}` },
|
||||
})
|
||||
.then((res) => {
|
||||
// console.log(res.data.data)
|
||||
setBusinessesData(res.data.data)
|
||||
console.log(res.data)
|
||||
setBusinessesData(res.data?.businesses)
|
||||
setLoading(false)
|
||||
})
|
||||
.catch((err) => {
|
||||
@ -40,7 +40,7 @@ const Businesses = () => {
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
getCategories()
|
||||
getbusinesses()
|
||||
}, [success])
|
||||
|
||||
useEffect(() => {
|
||||
@ -53,42 +53,42 @@ const Businesses = () => {
|
||||
}, [currentPage, itemPerPage, BusinessesData])
|
||||
|
||||
|
||||
const handleVarification = (id) => {
|
||||
swal({
|
||||
title: 'Are you sure?',
|
||||
icon: 'warning',
|
||||
buttons: { Yes: { text: 'Yes', value: true }, Cancel: { text: 'Cancel', value: 'cancel' } },
|
||||
}).then((value) => {
|
||||
if (value === true) {
|
||||
axios
|
||||
.get(`/api/franchisee/admin/verify/${id}`, {
|
||||
headers: {
|
||||
'Access-Control-Allow-Origin': '*',
|
||||
Authorization: `Bearer ${token}`,
|
||||
},
|
||||
})
|
||||
.then((res) => {
|
||||
swal({
|
||||
title: 'success',
|
||||
text: res.data.message ? res.data.message : 'Verified Successfully!',
|
||||
icon: 'success',
|
||||
button: 'ok',
|
||||
dangerMode: true,
|
||||
})
|
||||
setSuccess((prev) => !prev)
|
||||
})
|
||||
.catch((err) => {
|
||||
swal({
|
||||
title: 'Failled',
|
||||
text: 'Something went wrong!',
|
||||
icon: 'error',
|
||||
button: 'Retry',
|
||||
dangerMode: true,
|
||||
})
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
// const handleVarification = (id) => {
|
||||
// swal({
|
||||
// title: 'Are you sure?',
|
||||
// icon: 'warning',
|
||||
// buttons: { Yes: { text: 'Yes', value: true }, Cancel: { text: 'Cancel', value: 'cancel' } },
|
||||
// }).then((value) => {
|
||||
// if (value === true) {
|
||||
// axios
|
||||
// .get(`/api/i/admin/verify/${id}`, {
|
||||
// headers: {
|
||||
// 'Access-Control-Allow-Origin': '*',
|
||||
// Authorization: `Bearer ${token}`,
|
||||
// },
|
||||
// })
|
||||
// .then((res) => {
|
||||
// swal({
|
||||
// title: 'success',
|
||||
// text: res.data.message ? res.data.message : 'Verified Successfully!',
|
||||
// icon: 'success',
|
||||
// button: 'ok',
|
||||
// dangerMode: true,
|
||||
// })
|
||||
// setSuccess((prev) => !prev)
|
||||
// })
|
||||
// .catch((err) => {
|
||||
// swal({
|
||||
// title: 'Failled',
|
||||
// text: 'Something went wrong!',
|
||||
// icon: 'error',
|
||||
// button: 'Retry',
|
||||
// dangerMode: true,
|
||||
// })
|
||||
// })
|
||||
// }
|
||||
// })
|
||||
// }
|
||||
const handleDelete = (id) => {
|
||||
swal({
|
||||
title: 'Are you sure?',
|
||||
@ -97,7 +97,7 @@ const Businesses = () => {
|
||||
}).then((value) => {
|
||||
if (value === true) {
|
||||
axios
|
||||
.delete(`/api/franchisee/${id}`, {
|
||||
.delete(`/api/businesses/delete/${id}`, {
|
||||
headers: {
|
||||
'Access-Control-Allow-Origin': '*',
|
||||
Authorization: `Bearer ${token}`,
|
||||
@ -192,11 +192,11 @@ const Businesses = () => {
|
||||
>
|
||||
<thead className="thead-info" style={{ background: 'rgb(140, 213, 213)' }}>
|
||||
<tr>
|
||||
<th className="text-start">Business Name</th>
|
||||
<th className="text-start">Logo</th>
|
||||
<th className="text-start">City </th>
|
||||
<th className="text-start">Business </th>
|
||||
{/* <th className="text-start">Logo</th> */}
|
||||
<th className="text-start">Purpose </th>
|
||||
<th className="text-start">Created On</th>
|
||||
<th className="text-start">Status</th>
|
||||
{/* <th className="text-start">Status</th> */}
|
||||
<th className="text-center">Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
@ -215,20 +215,20 @@ const Businesses = () => {
|
||||
</td>
|
||||
</tr>
|
||||
) : (
|
||||
showData.map((franchisee, i) => {
|
||||
showData.map((i, idx) => {
|
||||
return (
|
||||
<tr key={i}>
|
||||
<td className="text-start">{franchisee.name}</td>
|
||||
{franchisee.banner && franchisee.banner ?
|
||||
<tr key={idx}>
|
||||
<td className="text-start">{i.business}</td>
|
||||
{/* {i.banner && i.banner ?
|
||||
<td className="text-start">
|
||||
<img src={franchisee.banner.url} alt="No Image" height="50" />
|
||||
<img src={i.banner.url} alt="No Image" height="50" />
|
||||
</td> :
|
||||
<p>No image!</p>
|
||||
}
|
||||
<td className="text-start">{franchisee?.city?.city_name}</td>
|
||||
} */}
|
||||
<td className="text-start">{i?.purpose}</td>
|
||||
|
||||
<td className="text-start">
|
||||
{new Date(franchisee.createdAt).toLocaleString('en-IN', {
|
||||
{new Date(i.createdAt).toLocaleString('en-IN', {
|
||||
month: '2-digit',
|
||||
day: 'numeric',
|
||||
year: 'numeric',
|
||||
@ -237,29 +237,29 @@ const Businesses = () => {
|
||||
// hour12: true,
|
||||
})}
|
||||
</td>
|
||||
<td className="text-start">
|
||||
{/* <td className="text-start">
|
||||
<button
|
||||
style={{ color: 'white' }}
|
||||
type="button"
|
||||
className={`
|
||||
|
||||
btn ${franchisee?.verify === true ? 'btn-success' : 'btn-danger'} btn-sm
|
||||
btn ${i?.verify === true ? 'btn-success' : 'btn-danger'} btn-sm
|
||||
waves-effect waves-light
|
||||
ms-2
|
||||
|
||||
`}
|
||||
disabled={franchisee?.verify === true}
|
||||
disabled={i?.verify === true}
|
||||
onClick={() => {
|
||||
handleVarification(franchisee._id)
|
||||
handleVarification(i._id)
|
||||
}}
|
||||
>
|
||||
{franchisee?.verify ? 'verified' : 'Not Verify'}
|
||||
{i?.verify ? 'verified' : 'Not Verify'}
|
||||
</button>
|
||||
</td>
|
||||
</td> */}
|
||||
<td className=" text-center">
|
||||
<OverLayButton data={{ url: franchisee?.url }} />
|
||||
{/* <OverLayButton data={{ url: i?.url }} />
|
||||
|
||||
<Link to={`/business/products/${franchisee._id}`}>
|
||||
<Link to={`/business/products/${i._id}`}>
|
||||
<button
|
||||
style={{ color: 'white' }}
|
||||
type="button"
|
||||
@ -271,9 +271,9 @@ const Businesses = () => {
|
||||
>
|
||||
Products
|
||||
</button>
|
||||
</Link>
|
||||
</Link> */}
|
||||
|
||||
<Link to={`/business/edit/${franchisee._id}`}>
|
||||
<Link to={`/business/edit/${i._id}`}>
|
||||
<button
|
||||
style={{ color: 'white' }}
|
||||
type="button"
|
||||
@ -296,7 +296,7 @@ const Businesses = () => {
|
||||
|
||||
"
|
||||
onClick={() => {
|
||||
handleDelete(franchisee._id)
|
||||
handleDelete(i._id)
|
||||
}}
|
||||
>
|
||||
Delete
|
||||
|
||||
@ -1,189 +1,92 @@
|
||||
|
||||
|
||||
import React, { useEffect, useState } from 'react'
|
||||
import Button from '@material-ui/core/Button'
|
||||
import { Link, useNavigate, useParams } from 'react-router-dom'
|
||||
import swal from 'sweetalert'
|
||||
import React, { useState, useEffect } from 'react'
|
||||
// import { Button } from '@mui/material'
|
||||
import axios from 'axios'
|
||||
|
||||
import { Link, useNavigate, useParams } from 'react-router-dom'
|
||||
import { CCard, CCardBody, CCardGroup, CCol, CContainer, CRow } from '@coreui/react'
|
||||
|
||||
import SelectPurpose from './multiform/SelectPurpose.js'
|
||||
import SelectBusiness from './multiform/SelectBusiness.js'
|
||||
import SelectLanguage from './multiform/selectLanguage.js'
|
||||
import BAddress from './multiform/BAddress.js'
|
||||
import Button from '@material-ui/core/Button'
|
||||
|
||||
|
||||
import { isAutheticated } from 'src/auth'
|
||||
|
||||
|
||||
const EditBusiness = () => {
|
||||
|
||||
|
||||
const [WebsiteURL, setWebsiteURL] = useState('https://reinventuniforms.in/')
|
||||
const id = useParams()?.id
|
||||
const token = isAutheticated()
|
||||
const id = useParams()?.id
|
||||
const [productId, setProductId] = useState('')
|
||||
const [viewState, setViewState] = useState(1)
|
||||
|
||||
|
||||
const navigate = useNavigate()
|
||||
const [data, setData] = useState({
|
||||
image: '',
|
||||
imageURL: '',
|
||||
name: '',
|
||||
email: '',
|
||||
address_line_1: '',
|
||||
address_line_2: '',
|
||||
city: '',
|
||||
state_name: '',
|
||||
short_url: '',
|
||||
contact_Number: '',
|
||||
contact_Person_Name: '',
|
||||
price_Lable: '',
|
||||
pin_Code: ''
|
||||
})
|
||||
const [cities, setCities] = useState([])
|
||||
const [loading, setLoading] = useState(false)
|
||||
const [validForm, setValidForm] = useState(false)
|
||||
const [limiter, setLimiter] = useState({
|
||||
name: 100,
|
||||
nameHas: 100,
|
||||
|
||||
const [data, setData] = useState({
|
||||
business: '',
|
||||
purpose: '',
|
||||
|
||||
language: [],
|
||||
country: '',
|
||||
state: '',
|
||||
city: '',
|
||||
address_Line_1: '',
|
||||
address_Line_2: '',
|
||||
pincode: ''
|
||||
})
|
||||
|
||||
const getRequired = async () => {
|
||||
await axios
|
||||
.get(`/api/city`, {
|
||||
headers: {
|
||||
'Access-Control-Allow-Origin': '*',
|
||||
Authorization: `Bearer ${token}`,
|
||||
},
|
||||
})
|
||||
.then((res) => {
|
||||
setCities([...res.data.data])
|
||||
})
|
||||
.catch((err) => { })
|
||||
|
||||
|
||||
console.log(data)
|
||||
|
||||
const handleView = (n) => {
|
||||
if (viewState === n) return
|
||||
setViewState(n)
|
||||
}
|
||||
|
||||
//get business
|
||||
console.log(id)
|
||||
const getbusinesses = () => {
|
||||
axios
|
||||
.get(`/api/franchisee/withoutpopulate/${id}`, {
|
||||
headers: {
|
||||
'Access-Control-Allow-Origin': '*',
|
||||
Authorization: `Bearer ${token}`,
|
||||
},
|
||||
.get(`/api/businesses/get/${id}`, {
|
||||
headers: { 'Access-Control-Allow-Origin': '*', Authorization: `Bearer ${token}` },
|
||||
})
|
||||
.then((res) => {
|
||||
// console.log(res.data.businesses)
|
||||
// setBusinessesData(res.data?.businesses)
|
||||
setData((prev) => ({
|
||||
...prev,
|
||||
...res.data?.data,
|
||||
city: res.data?.data?.city,
|
||||
imageURL: res.data?.data?.banner?.url,
|
||||
...res.data?.businesses,
|
||||
}))
|
||||
setLimiter((prev) => ({ ...prev, nameHas: prev.name - res.data?.data?.name?.length || 0 }))
|
||||
setLoading(false)
|
||||
})
|
||||
|
||||
|
||||
.catch((err) => {
|
||||
console.log(err)
|
||||
setLoading(false)
|
||||
})
|
||||
.catch((err) => { })
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
getRequired()
|
||||
getbusinesses()
|
||||
}, [])
|
||||
|
||||
useEffect(() => {
|
||||
const setStateName = () => {
|
||||
const city = cities.filter((m) => data.city === m?._id)
|
||||
setData((prev) => ({ ...prev, state_name: city[0]?.state?.state_name || '' }))
|
||||
}
|
||||
setStateName()
|
||||
}, [data.city])
|
||||
|
||||
//validate
|
||||
const [errors, setErrors] = useState({
|
||||
emailError: '',
|
||||
|
||||
|
||||
})
|
||||
const validEmailRegex = RegExp(
|
||||
/^(([^<>()\[\]\.,;:\s@\"]+(\.[^<>()\[\]\.,;:\s@\"]+)*)|(\".+\"))@(([^<>()[\]\.,;:\s@\"]+\.)+[^<>()[\]\.,;:\s@\"]{2,})$/i,
|
||||
)
|
||||
const validateForm = () => {
|
||||
let valid = true
|
||||
Object.values(errors).forEach((val) => {
|
||||
if (val.length > 0) {
|
||||
valid = false
|
||||
return false
|
||||
}
|
||||
})
|
||||
Object.values(data.email).forEach((val) => {
|
||||
if (val.length <= 0) {
|
||||
valid = false
|
||||
return false
|
||||
}
|
||||
})
|
||||
return valid
|
||||
}
|
||||
|
||||
//cheking email
|
||||
useEffect(() => {
|
||||
if (validateForm()) {
|
||||
setValidForm(true)
|
||||
} else {
|
||||
setValidForm(false)
|
||||
}
|
||||
}, [errors])
|
||||
|
||||
|
||||
const handleChange = (e) => {
|
||||
if (e.target.id === 'name') {
|
||||
if (e.target.value.length === limiter[e.target.id] + 1) return
|
||||
setLimiter((prev) => ({
|
||||
...prev,
|
||||
[e.target.id + 'Has']: prev[e.target.id] - e.target.value.length,
|
||||
}))
|
||||
setData((prev) => ({ ...prev, short_url: e.target.value.toLowerCase().replace(/\s+/g, '-') }))
|
||||
}
|
||||
if (e.target.id === 'email') {
|
||||
setErrors({
|
||||
...errors,
|
||||
emailError: validEmailRegex.test(e.target.value) ? '' : 'Email is not valid!',
|
||||
})
|
||||
|
||||
|
||||
}
|
||||
if (e.target.id === 'city') {
|
||||
const city = cities.filter((m) => e.target.value === m?._id)
|
||||
setData((prev) => ({ ...prev, state_name: city[0]?.state?.state_name || '' }))
|
||||
}
|
||||
if (e.target.id === 'image') {
|
||||
if (
|
||||
e.target.files[0]?.type === 'image/jpeg' ||
|
||||
e.target.files[0]?.type === 'image/png' ||
|
||||
e.target.files[0]?.type === 'image/jpg'
|
||||
) {
|
||||
setData((prev) => ({
|
||||
...prev,
|
||||
imageURL: URL.createObjectURL(e.target.files[0]),
|
||||
image: e.target.files[0],
|
||||
}))
|
||||
return
|
||||
} else {
|
||||
swal({
|
||||
title: 'Warning',
|
||||
text: 'Upload jpg, jpeg, png only.',
|
||||
icon: 'error',
|
||||
button: 'Close',
|
||||
dangerMode: true,
|
||||
})
|
||||
setData((prev) => ({
|
||||
...prev,
|
||||
imageURL: '',
|
||||
image: '',
|
||||
}))
|
||||
e.target.value = null
|
||||
return
|
||||
}
|
||||
}
|
||||
setData((prev) => ({ ...prev, [e.target.id]: e.target.value }))
|
||||
}
|
||||
|
||||
console.log(data)
|
||||
const handleSubmit = () => {
|
||||
if (
|
||||
data.name.trim() === '' ||
|
||||
data.email.trim() === '' ||
|
||||
data.contact_Number === '' ||
|
||||
data.address_Line_1.trim() === '' ||
|
||||
data.address_Line_2.trim() === '' ||
|
||||
|
||||
data.contact_Person_Name === '' ||
|
||||
data.address_line_1.trim() === '' ||
|
||||
data.address_line_2.trim() === '' ||
|
||||
data.price_Lable.trim() === '' ||
|
||||
data.business === '' ||
|
||||
data.purpose.trim() === '' ||
|
||||
data.language === '' ||
|
||||
data.country === '' ||
|
||||
data.state === '' ||
|
||||
data.city === '' ||
|
||||
data.pin_Code === '' ||
|
||||
data.short_url === '' ||
|
||||
data.state_name === ''
|
||||
// data.imageURL.trim() === ''
|
||||
data.pincode === ''
|
||||
) {
|
||||
swal({
|
||||
title: 'Warning',
|
||||
@ -196,24 +99,22 @@ const EditBusiness = () => {
|
||||
}
|
||||
setLoading(true)
|
||||
const formData = new FormData()
|
||||
formData.set('name', data.name)
|
||||
formData.set('email', data.email)
|
||||
formData.set('address_Line_1', data.address_Line_1)
|
||||
formData.set('address_Line_2', data.address_Line_2)
|
||||
|
||||
formData.set('address_line_1', data.address_line_1)
|
||||
formData.set('address_line_2', data.address_line_2)
|
||||
formData.set('purpose', data.purpose)
|
||||
formData.set('business', data.business)
|
||||
formData.set('language', data.language)
|
||||
|
||||
formData.set('country', data.country)
|
||||
formData.set('city', data.city)
|
||||
formData.set('price_Lable', data.price_Lable)
|
||||
formData.set('state', data.state)
|
||||
|
||||
|
||||
formData.set('state_name', data.state_name)
|
||||
formData.set('pin_Code', data.pin_Code)
|
||||
formData.set('contact_Number', data.contact_Number)
|
||||
formData.set('contact_Person_Name', data.contact_Person_Name)
|
||||
formData.set('url', WebsiteURL + data.short_url + '/login')
|
||||
formData.set('short_url', data.short_url)
|
||||
formData.append('image', data.image)
|
||||
formData.set('pincode', data.pincode)
|
||||
|
||||
axios
|
||||
.patch(`/api/franchisee/${id}`, formData, {
|
||||
.patch(`/api/businesses/update/${id}`, formData, {
|
||||
headers: {
|
||||
Authorization: `Bearer ${token}`,
|
||||
'Content-Type': 'multipart/formdata',
|
||||
@ -223,12 +124,12 @@ const EditBusiness = () => {
|
||||
.then((res) => {
|
||||
swal({
|
||||
title: 'Updated',
|
||||
text: res?.data?.message ? res?.data?.message : 'franchisee updated successfully!',
|
||||
text: res?.data?.message ? res?.data?.message : 'Business added successfully!',
|
||||
icon: 'success',
|
||||
button: 'Return',
|
||||
})
|
||||
setLoading(false)
|
||||
navigate('/franchisees', { replace: true })
|
||||
navigate('/businesses', { replace: true })
|
||||
})
|
||||
.catch((err) => {
|
||||
setLoading(false)
|
||||
@ -244,9 +145,9 @@ const EditBusiness = () => {
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-12">
|
||||
<CContainer>
|
||||
<CRow className="mt-3">
|
||||
<CCol md={12}>
|
||||
<div
|
||||
className="
|
||||
page-title-box
|
||||
@ -256,278 +157,132 @@ const EditBusiness = () => {
|
||||
"
|
||||
>
|
||||
<div style={{ fontSize: '22px' }} className="fw-bold">
|
||||
Edit Franchisee
|
||||
Edit Business
|
||||
</div>
|
||||
<div style={{ display: 'flex', gap: '1rem' }}>
|
||||
<h4 className="mb-0"></h4>
|
||||
</div>
|
||||
|
||||
<div className="page-title-right">
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
style={{
|
||||
fontWeight: 'bold',
|
||||
marginBottom: '1rem',
|
||||
textTransform: 'capitalize',
|
||||
marginRight: '5px',
|
||||
}}
|
||||
onClick={() => handleSubmit()}
|
||||
disabled={loading}
|
||||
>
|
||||
{loading ? 'Loading' : 'Update'}
|
||||
</Button>
|
||||
<Link to="/franchisees">
|
||||
<div className="page-title-right">
|
||||
<Button
|
||||
variant="contained"
|
||||
color="secondary"
|
||||
color="primary"
|
||||
style={{
|
||||
fontWeight: 'bold',
|
||||
marginBottom: '1rem',
|
||||
textTransform: 'capitalize',
|
||||
}}
|
||||
onClick={() => {
|
||||
handleSubmit()
|
||||
|
||||
}}
|
||||
disabled={data.address_Line_1.trim() === '' ||
|
||||
data.address_Line_2.trim() === '' ||
|
||||
|
||||
data.business === '' ||
|
||||
data.purpose.trim() === '' ||
|
||||
data.language === '' ||
|
||||
data.country === '' ||
|
||||
data.state === '' ||
|
||||
data.city === '' ||
|
||||
data.pincode === ''}
|
||||
>
|
||||
Back
|
||||
{loading ? 'Loading' : 'Update Now'}
|
||||
</Button>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="row">
|
||||
<div className="col-6 my-1">
|
||||
<div className="card h-100">
|
||||
<div className="card-body px-5">
|
||||
<div className="mb-3">
|
||||
<label htmlFor="title" className="form-label">
|
||||
Franchisee Name*
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
id="name"
|
||||
value={data.name}
|
||||
maxLength={limiter.name}
|
||||
onChange={(e) => handleChange(e)}
|
||||
/>
|
||||
<p className="pt-1 pl-2 text-secondary">Remaining characters : {limiter.nameHas}</p>
|
||||
</div>
|
||||
<div className="mb-3">
|
||||
<label htmlFor="title" className="form-label">
|
||||
Email *
|
||||
</label>
|
||||
<input
|
||||
type="email"
|
||||
className="form-control"
|
||||
id="email"
|
||||
value={data.email}
|
||||
|
||||
onChange={(e) => handleChange(e)}
|
||||
/>
|
||||
{errors.emailError && (
|
||||
<p className="text-center py-2 text-danger">{errors.emailError}</p>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div className="mb-3">
|
||||
<label htmlFor="title" className="form-label">
|
||||
Address Line 1*
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
id="address_line_1"
|
||||
value={data.address_line_1}
|
||||
maxLength="50"
|
||||
onChange={(e) => handleChange(e)}
|
||||
/>
|
||||
</div>
|
||||
<div className="mb-3">
|
||||
<label htmlFor="title" className="form-label">
|
||||
Address Line 2*
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
id="address_line_2"
|
||||
value={data.address_line_2}
|
||||
maxLength="50"
|
||||
onChange={(e) => handleChange(e)}
|
||||
/>
|
||||
</div>
|
||||
{/* <div className="mb-3">
|
||||
<label htmlFor="title" className="form-label">
|
||||
Business Name*
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
id="business_name"
|
||||
value={data.business_name}
|
||||
maxLength="50"
|
||||
onChange={(e) => handleChange(e)}
|
||||
/>
|
||||
</div>
|
||||
<div className="mb-3">
|
||||
<label htmlFor="title" className="form-label">
|
||||
GSTIN*
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
id="gstin"
|
||||
value={data.gstin}
|
||||
maxLength="50"
|
||||
onChange={(e) => handleChange(e)}
|
||||
/>
|
||||
</div> */}
|
||||
<div className="mb-3">
|
||||
<label htmlFor="pageToLink" className="form-label">
|
||||
City*
|
||||
</label>
|
||||
<select
|
||||
onChange={(e) => handleChange(e)}
|
||||
value={data.city}
|
||||
className="form-control"
|
||||
id="city"
|
||||
>
|
||||
<option value="">---select---</option>
|
||||
{cities[0] ? (
|
||||
cities.map((c, i) => (
|
||||
<option key={i} value={c._id}>
|
||||
{c.city_name + ', ' + c.state?.state_name}
|
||||
</option>
|
||||
))
|
||||
) : (
|
||||
<option value="" disabled>
|
||||
Please add a City
|
||||
</option>
|
||||
)}
|
||||
</select>
|
||||
</div>
|
||||
<div className="mb-3">
|
||||
<label htmlFor="title" className="form-label">
|
||||
State*
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
id="state_name"
|
||||
value={data.state_name}
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
<div className="mb-3">
|
||||
<label htmlFor="title" className="form-label">
|
||||
Pin Code *
|
||||
</label>
|
||||
<input
|
||||
type="Number"
|
||||
className="form-control"
|
||||
id="pin_Code"
|
||||
value={data.pin_Code}
|
||||
maxLength='8'
|
||||
onChange={(e) => handleChange(e)}
|
||||
/>
|
||||
{/* {data.pin_Code ? <><small className="charLeft mt-4 fst-italic">
|
||||
{8 - data.pin_Code.length} characters left
|
||||
</small></> : <></>
|
||||
} */}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-6 my-1">
|
||||
<div className="card h-100">
|
||||
<div className="card-body px-5">
|
||||
|
||||
<div className="mb-3">
|
||||
<label htmlFor="title" className="form-label">
|
||||
Contact Number*
|
||||
</label>
|
||||
<input
|
||||
type="number"
|
||||
className="form-control"
|
||||
id="contact_Number"
|
||||
value={data.contact_Number}
|
||||
onChange={(e) => handleChange(e)}
|
||||
/>
|
||||
</div>
|
||||
<div className="mb-3">
|
||||
<label htmlFor="title" className="form-label">
|
||||
Contact Person Name*
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
id="contact_Person_Name"
|
||||
value={data.contact_Person_Name}
|
||||
onChange={(e) => handleChange(e)}
|
||||
/>
|
||||
</div>
|
||||
<div className="mb-3">
|
||||
<label htmlFor="title" className="form-label">
|
||||
URL*
|
||||
</label>
|
||||
<div className="input-group mb-3">
|
||||
<span className="input-group-text" id="basic-addon3">
|
||||
{WebsiteURL}
|
||||
</span>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
id="short_url"
|
||||
aria-describedby="basic-addon3"
|
||||
value={data.short_url}
|
||||
onChange={(e) => handleChange(e)}
|
||||
</CCol>
|
||||
</CRow>
|
||||
<CRow>
|
||||
<CCol md={9} className="mt-1">
|
||||
<CCardGroup>
|
||||
<CCard className="p-4 mb-3">
|
||||
<CCardBody>
|
||||
{viewState === 1 && (
|
||||
<SelectBusiness
|
||||
data={{ data, setData }}
|
||||
// categories={categories}
|
||||
handleView={handleView}
|
||||
// ProductId={{ productId, setProductId }}
|
||||
loading={{ loading, setLoading }}
|
||||
/>
|
||||
)}
|
||||
{viewState === 2 && (
|
||||
<SelectPurpose
|
||||
data={{ data, setData }}
|
||||
handleView={handleView}
|
||||
|
||||
// productId={productId}
|
||||
// data={{ varients, setVarients }}
|
||||
// taxes={taxes}
|
||||
// sizes={sizes}
|
||||
loading={{ loading, setLoading }}
|
||||
/>
|
||||
)}
|
||||
{viewState === 3 && (
|
||||
<SelectLanguage
|
||||
data={{ data, setData }}
|
||||
handleView={handleView}
|
||||
|
||||
// productId={productId}
|
||||
// data={{ images, setImages }}
|
||||
loading={{ loading, setLoading }}
|
||||
/>
|
||||
)}
|
||||
{viewState === 4 && (
|
||||
<BAddress
|
||||
data={{ data, setData }}
|
||||
handleView={handleView}
|
||||
|
||||
// productId={productId}
|
||||
// data={{ images, setImages }}
|
||||
loading={{ loading, setLoading }}
|
||||
/>
|
||||
)}
|
||||
</CCardBody>
|
||||
</CCard>
|
||||
</CCardGroup>
|
||||
</CCol>
|
||||
<CCol md={3} className="mt-1">
|
||||
<CCardGroup>
|
||||
<CCard>
|
||||
<CCardBody>
|
||||
<div className="d-grid gap-2">
|
||||
<button
|
||||
className={viewState === 1 ? 'btn btn-light' : 'btn btn-info text-white'}
|
||||
type="button"
|
||||
onClick={() => handleView(1)}
|
||||
>
|
||||
Select Business Type
|
||||
|
||||
</button>
|
||||
<button
|
||||
className={viewState === 2 ? 'btn btn-light' : 'btn btn-info text-white'}
|
||||
type="button"
|
||||
onClick={() => handleView(2)}
|
||||
>
|
||||
Select Purpose
|
||||
|
||||
</button>
|
||||
<button
|
||||
className={viewState === 3 ? 'btn btn-light' : 'btn btn-info text-white'}
|
||||
type="button"
|
||||
onClick={() => handleView(3)}
|
||||
>
|
||||
Select Languages
|
||||
</button>
|
||||
<button
|
||||
className={viewState === 4 ? 'btn btn-light' : 'btn btn-info text-white'}
|
||||
type="button"
|
||||
onClick={() => handleView(4)}
|
||||
>
|
||||
Address
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div className=" mb-3">
|
||||
<label htmlFor="title" className="form-label">
|
||||
Price Lable*
|
||||
</label> <select className="form-control" name="price_Lable" id="price_Lable"
|
||||
onChange={(e) => handleChange(e)}
|
||||
value={data.price_Lable}
|
||||
>
|
||||
|
||||
|
||||
|
||||
<option value="" disabled>---</option>
|
||||
|
||||
<option value="base_Price">Base Price</option>
|
||||
<option value="price_Level_2"> price Level 2</option>
|
||||
<option value="price_Level_3">price Level 3</option>
|
||||
|
||||
|
||||
</select>
|
||||
</div>
|
||||
<div className="mb-3">
|
||||
<label htmlFor="image" className="form-label">
|
||||
Franchisee Banner (optional)
|
||||
</label>
|
||||
<input
|
||||
type="file"
|
||||
className="form-control"
|
||||
id="image"
|
||||
accept="image/*"
|
||||
onChange={(e) => handleChange(e)}
|
||||
/>
|
||||
<p className="pt-1 pl-2 text-secondary">Upload jpg, jpeg and png only*</p>
|
||||
</div>
|
||||
<div className="mb-3" style={{ height: '200px', maxWdth: '100%' }}>
|
||||
<img
|
||||
src={data.imageURL}
|
||||
alt="Uploaded Image will be shown here"
|
||||
style={{ maxHeight: '200px', maxWidth: '100%' }}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</CCardBody>
|
||||
</CCard>
|
||||
</CCardGroup>
|
||||
</CCol>
|
||||
</CRow>
|
||||
</CContainer>
|
||||
)
|
||||
}
|
||||
|
||||
|
||||
431
src/views/Business/multiform/BAddress.js
Normal file
431
src/views/Business/multiform/BAddress.js
Normal file
@ -0,0 +1,431 @@
|
||||
|
||||
import React, { useEffect, useState } from 'react'
|
||||
import Button from '@material-ui/core/Button'
|
||||
import { Link, useNavigate } from 'react-router-dom'
|
||||
import swal from 'sweetalert'
|
||||
import axios from 'axios'
|
||||
import { isAutheticated } from 'src/auth'
|
||||
// import { WebsiteURL } from '../WebsiteURL'
|
||||
import { Country, State, City } from 'country-state-city';
|
||||
|
||||
|
||||
const BAddress = (props) => {
|
||||
const token = isAutheticated()
|
||||
const navigate = useNavigate()
|
||||
|
||||
const { data, setData } = props.data
|
||||
|
||||
const { loading, setLoading } = props.loading
|
||||
// const categories = props?.categories || []
|
||||
|
||||
const handleChange = (e) => {
|
||||
// if (e.target.id === 'master_price' && /^\D+$/.test(e.target.value)) return
|
||||
// if (e.target.id === 'discontinue_on') {
|
||||
// if (new Date(e.target.value) < new Date()) {
|
||||
// return setData((prev) => ({
|
||||
// ...prev,
|
||||
// [e.target.id]: new Date().toISOString().slice(0, 10),
|
||||
// }))
|
||||
// }
|
||||
// }
|
||||
setData((prev) => ({ ...prev, [e.target.id]: e.target.value }))
|
||||
}
|
||||
|
||||
// const [data, setData] = useState({
|
||||
// image: '',
|
||||
// imageURL: '',
|
||||
// address_Line_1: '',
|
||||
// address_Line_2: '',
|
||||
// address_line_1: '',
|
||||
// address_line_2: '',
|
||||
// city: '',
|
||||
// state_name: '',
|
||||
// short_url: '',
|
||||
// contact_Number: '',
|
||||
// contact_Person_Name: '',
|
||||
// price_Lable: '',
|
||||
// pin_Code: ''
|
||||
// })
|
||||
|
||||
// const [cities, setCities] = useState([])
|
||||
|
||||
// const [loading, setLoading] = useState(false)
|
||||
const [validForm, setValidForm] = useState(false)
|
||||
|
||||
|
||||
const [limiter, setLimiter] = useState({
|
||||
address_Line_1: 100,
|
||||
nameHas: 100,
|
||||
})
|
||||
|
||||
|
||||
|
||||
//country, city and state
|
||||
const [countryCode, setCountryCode] = useState();
|
||||
|
||||
const [stateCode, setStateCode] = useState();
|
||||
const country = Country.getAllCountries()
|
||||
|
||||
useEffect(() => {
|
||||
|
||||
country.map(item => {
|
||||
|
||||
|
||||
if (item.name === data.country) {
|
||||
setCountryCode(item.isoCode)
|
||||
// console.log(data.state)
|
||||
}
|
||||
})
|
||||
|
||||
}, [data.country])
|
||||
const state = State.getStatesOfCountry(countryCode)
|
||||
useEffect(() => {
|
||||
|
||||
state.map(item => {
|
||||
|
||||
|
||||
if (item.name === data.state) {
|
||||
setStateCode(item.isoCode)
|
||||
// console.log(data.state)
|
||||
}
|
||||
})
|
||||
|
||||
}, [data.state])
|
||||
|
||||
|
||||
const handleSubmit = () => {
|
||||
if (
|
||||
data.address_Line_1.trim() === '' ||
|
||||
data.address_Line_2.trim() === '' ||
|
||||
data.contact_Number === '' ||
|
||||
|
||||
data.contact_Person_Name === '' ||
|
||||
data.address_line_1.trim() === '' ||
|
||||
data.address_line_2.trim() === '' ||
|
||||
data.price_Lable.trim() === '' ||
|
||||
data.city === '' ||
|
||||
data.pin_Code.trim() === '' ||
|
||||
data.short_url === '' ||
|
||||
data.state_name === ''
|
||||
// data.imageURL.trim() === ''
|
||||
) {
|
||||
swal({
|
||||
title: 'Warning',
|
||||
text: 'Fill all mandatory fields',
|
||||
icon: 'error',
|
||||
button: 'Close',
|
||||
dangerMode: true,
|
||||
})
|
||||
return
|
||||
}
|
||||
setLoading(true)
|
||||
const formData = new FormData()
|
||||
formData.set('address_Line_1', data.address_Line_1)
|
||||
formData.set('address_Line_2', data.address_Line_2)
|
||||
|
||||
formData.set('address_line_1', data.address_line_1)
|
||||
formData.set('address_line_2', data.address_line_2)
|
||||
formData.set('city', data.city)
|
||||
formData.set('state_name', data.state_name)
|
||||
formData.set('contact_Number', data.contact_Number)
|
||||
formData.set('contact_Person_Name', data.contact_Person_Name)
|
||||
|
||||
formData.set('price_Lable', data.price_Lable)
|
||||
formData.set('pin_Code', data.pin_Code)
|
||||
formData.set('url', WebsiteURL + data.short_url + '/login')
|
||||
formData.set('short_url', data.short_url)
|
||||
|
||||
formData.append('image', data.image)
|
||||
axios
|
||||
.post(`/api/franchisee/`, formData, {
|
||||
headers: {
|
||||
Authorization: `Bearer ${token}`,
|
||||
'Content-Type': 'multipart/formdata',
|
||||
'Access-Control-Allow-Origin': '*',
|
||||
},
|
||||
})
|
||||
.then((res) => {
|
||||
swal({
|
||||
title: 'Added',
|
||||
text: res?.data?.message ? res?.data?.message : 'Franchisee added successfully!',
|
||||
icon: 'success',
|
||||
button: 'Return',
|
||||
})
|
||||
setLoading(false)
|
||||
navigate('/franchisees', { replace: true })
|
||||
})
|
||||
.catch((err) => {
|
||||
setLoading(false)
|
||||
const message = err.response?.data?.message || 'Something went wrong!'
|
||||
swal({
|
||||
title: 'Warning',
|
||||
text: message,
|
||||
icon: 'error',
|
||||
button: 'Retry',
|
||||
dangerMode: true,
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-12">
|
||||
<div
|
||||
className="
|
||||
page-title-box
|
||||
d-flex
|
||||
align-items-center
|
||||
justify-content-between
|
||||
"
|
||||
>
|
||||
<div style={{ fontSize: '22px' }} className="fw-bold">
|
||||
Address
|
||||
</div>
|
||||
<div style={{ display: 'flex', gap: '1rem' }}>
|
||||
<h4 className="mb-0"></h4>
|
||||
</div>
|
||||
|
||||
<div className="page-title-right">
|
||||
{/* <Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
style={{
|
||||
fontWeight: 'bold',
|
||||
marginBottom: '1rem',
|
||||
textTransform: 'capitalize',
|
||||
marginRight: '5px',
|
||||
}}
|
||||
onClick={() => handleSubmit()}
|
||||
disabled={loading}
|
||||
>
|
||||
{loading ? 'Loading' : 'Save'}
|
||||
</Button> */}
|
||||
<Button
|
||||
variant="contained"
|
||||
color="secondary"
|
||||
style={{
|
||||
fontWeight: 'bold',
|
||||
marginBottom: '1rem',
|
||||
textTransform: 'capitalize',
|
||||
}}
|
||||
onClick={() => props.handleView(3)}
|
||||
|
||||
>
|
||||
Prev
|
||||
</Button>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div className="row">
|
||||
<div className="col-sm-12 col-md-12 col-lg-12 my-1">
|
||||
<div className="card h-100">
|
||||
<div className="card-body px-5">
|
||||
|
||||
|
||||
|
||||
|
||||
<div className="mb-3">
|
||||
<label htmlFor="title" className="form-label">
|
||||
Address Line 1*
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
id="address_Line_1"
|
||||
value={data.address_Line_1}
|
||||
maxLength="50"
|
||||
onChange={(e) => handleChange(e)}
|
||||
/>
|
||||
</div>
|
||||
<div className="mb-3">
|
||||
<label htmlFor="title" className="form-label">
|
||||
Address Line 2*
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
id="address_Line_2"
|
||||
value={data.address_Line_2}
|
||||
maxLength="50"
|
||||
onChange={(e) => handleChange(e)}
|
||||
/>
|
||||
</div>
|
||||
<div className="mb-3">
|
||||
<label htmlFor="title" className="form-label">
|
||||
Country *
|
||||
</label>
|
||||
<select
|
||||
onChange={(e) => handleChange(e)}
|
||||
value={data.country}
|
||||
className="form-control"
|
||||
id="country"
|
||||
>
|
||||
<option value="1">---select---</option>
|
||||
{Country.getAllCountries().map((item, index) =>
|
||||
/* {City.getCountryByCode('IN') && City.getCountryByCode('IN').map((item, index) => */
|
||||
<option key={index} value={item?.name} >{item?.name}</option>
|
||||
|
||||
)}
|
||||
</select>
|
||||
|
||||
</div>
|
||||
<div className="mb-3">
|
||||
<label htmlFor="title" className="form-label">
|
||||
State *
|
||||
</label>
|
||||
<select
|
||||
onChange={(e) => handleChange(e)}
|
||||
value={data.state}
|
||||
className="form-control"
|
||||
id="state"
|
||||
disabled={!data.country}
|
||||
>
|
||||
<option value="1">---select---</option>
|
||||
|
||||
{State.getStatesOfCountry(countryCode).map((item, index) =>
|
||||
/* {City.getCountryByCode('IN') && City.getCountryByCode('IN').map((item, index) => */
|
||||
<option key={index} value={item?.name} >{item?.name}</option>
|
||||
|
||||
)}
|
||||
</select>
|
||||
</div>
|
||||
<div className="mb-3">
|
||||
<label htmlFor="pageToLink" className="form-label">
|
||||
City*
|
||||
</label>
|
||||
<select
|
||||
onChange={(e) => handleChange(e)}
|
||||
value={data.city}
|
||||
className="form-control"
|
||||
id="city"
|
||||
name='city'
|
||||
disabled={!data.state}
|
||||
>
|
||||
<option value="1">---select---</option>
|
||||
{City.getCitiesOfState(`${countryCode}`, `${stateCode}`) && City.getCitiesOfState(`${countryCode}`, `${stateCode}`).map((item, index) =>
|
||||
<option key={index} value={item?.name} >{item?.name}</option>
|
||||
|
||||
)}
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div className="mb-3">
|
||||
<label htmlFor="title" className="form-label">
|
||||
Pin Code *
|
||||
</label>
|
||||
<input
|
||||
type="Number"
|
||||
className="form-control"
|
||||
id="pincode"
|
||||
value={data.pincode}
|
||||
maxLength={8}
|
||||
onChange={(e) => handleChange(e)}
|
||||
/>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/* <div className="col-sm-12 col-md-12 col-lg-6 my-1">
|
||||
<div className="card h-100">
|
||||
<div className="card-body px-5">
|
||||
|
||||
<div className="mb-3">
|
||||
<label htmlFor="title" className="form-label">
|
||||
Contact Number*
|
||||
</label>
|
||||
<input
|
||||
type="number"
|
||||
className="form-control"
|
||||
id="contact_Number"
|
||||
value={data.contact_Number}
|
||||
onChange={(e) => handleChange(e)}
|
||||
/>
|
||||
</div>
|
||||
<div className="mb-3">
|
||||
<label htmlFor="title" className="form-label">
|
||||
Contact Person Name*
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
id="contact_Person_Name"
|
||||
value={data.contact_Person_Name}
|
||||
onChange={(e) => handleChange(e)}
|
||||
/>
|
||||
</div>
|
||||
<div className="mb-3">
|
||||
<label htmlFor="title" className="form-label">
|
||||
URL*
|
||||
</label>
|
||||
<div className="input-group mb-3">
|
||||
<span className="input-group-text" id="basic-addon3">
|
||||
{WebsiteURL}
|
||||
</span>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
id="short_url"
|
||||
aria-describedby="basic-addon3"
|
||||
value={data.short_url}
|
||||
onChange={(e) => handleChange(e)}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className=" mb-3">
|
||||
<label htmlFor="title" className="form-label">
|
||||
Price Lable*
|
||||
</label> <select className="form-control" address_Line_1="price_Lable" id="price_Lable"
|
||||
onChange={(e) => handleChange(e)}
|
||||
value={data.price_Lable}
|
||||
>
|
||||
|
||||
|
||||
|
||||
<option value="" disabled>---</option>
|
||||
|
||||
<option value="base_Price">Base Price</option>
|
||||
<option value="price_Level_2"> price Level 2</option>
|
||||
<option value="price_Level_3">price Level 3</option>
|
||||
|
||||
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div className="mb-3">
|
||||
<label htmlFor="image" className="form-label">
|
||||
Franchisee Banner (optional)
|
||||
</label>
|
||||
<input
|
||||
type="file"
|
||||
className="form-control"
|
||||
id="image"
|
||||
accept="image/*"
|
||||
onChange={(e) => handleChange(e)}
|
||||
/>
|
||||
<p className="pt-1 pl-2 text-secondary">Upload jpg, jpeg and png only*</p>
|
||||
</div>
|
||||
<div className="mb-3" style={{ height: '200px', maxWdth: '100%' }}>
|
||||
<img
|
||||
src={data.imageURL}
|
||||
alt="Uploaded Image will be shown here"
|
||||
style={{ maxHeight: '200px', maxWidth: '100%' }}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default BAddress
|
||||
163
src/views/Business/multiform/SelectBusiness.js
Normal file
163
src/views/Business/multiform/SelectBusiness.js
Normal file
@ -0,0 +1,163 @@
|
||||
|
||||
|
||||
|
||||
|
||||
import React, { useEffect, useState } from 'react'
|
||||
import Button from '@material-ui/core/Button'
|
||||
import { Link, useNavigate } from 'react-router-dom'
|
||||
import swal from 'sweetalert'
|
||||
import axios from 'axios'
|
||||
import { isAutheticated } from 'src/auth'
|
||||
|
||||
|
||||
|
||||
const SelectBusiness = (props) => {
|
||||
const token = isAutheticated()
|
||||
const navigate = useNavigate()
|
||||
console.log(props.handleView)
|
||||
|
||||
const { data, setData } = props.data
|
||||
const { loading, setLoading } = props.loading
|
||||
// const categories = props?.categories || []
|
||||
|
||||
const handleChange = (e) => {
|
||||
|
||||
setData((prev) => ({ ...prev, [e.target.id]: e.target.value }))
|
||||
}
|
||||
|
||||
|
||||
// const [loading, setLoading] = useState(false)
|
||||
|
||||
|
||||
|
||||
|
||||
const [BusinessData, setBusinessData] = useState([])
|
||||
const getCategories = () => {
|
||||
axios
|
||||
.get(`/api/business`, {
|
||||
headers: { 'Access-Control-Allow-Origin': '*', Authorization: `Bearer ${token}` },
|
||||
})
|
||||
.then((res) => {
|
||||
setBusinessData(res.data.data)
|
||||
setLoading(false)
|
||||
})
|
||||
.catch((err) => {
|
||||
console.log(err)
|
||||
setLoading(false)
|
||||
})
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
getCategories()
|
||||
}, [])
|
||||
|
||||
|
||||
|
||||
|
||||
const handleSubmit = () => {
|
||||
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-12">
|
||||
<div
|
||||
className="
|
||||
page-title-box
|
||||
d-flex
|
||||
align-items-center
|
||||
justify-content-between
|
||||
"
|
||||
>
|
||||
<div style={{ fontSize: '22px' }} className="fw-bold">
|
||||
Select Business
|
||||
</div>
|
||||
<div style={{ display: 'flex', gap: '1rem' }}>
|
||||
<h4 className="mb-0"></h4>
|
||||
</div>
|
||||
|
||||
<div className="page-title-right">
|
||||
|
||||
<Link to="/Businesses">
|
||||
<Button
|
||||
variant="contained"
|
||||
color="secondary"
|
||||
style={{
|
||||
fontWeight: 'bold',
|
||||
marginBottom: '1rem',
|
||||
textTransform: 'capitalize',
|
||||
marginRight: '5px',
|
||||
}}
|
||||
>
|
||||
Back
|
||||
</Button>
|
||||
</Link>
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
style={{
|
||||
fontWeight: 'bold',
|
||||
marginBottom: '1rem',
|
||||
textTransform: 'capitalize',
|
||||
// marginRight: '5px',
|
||||
}}
|
||||
onClick={() => props.handleView(2)}
|
||||
// disabled={loading}
|
||||
// disabled={data.business === ''}
|
||||
|
||||
>
|
||||
Next
|
||||
{/* {loading ? 'Loading' : 'Next'} */}
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div className="row">
|
||||
<div className="col-sm-12 col-md-12 col-lg-12 my-1">
|
||||
<div className="card h-100">
|
||||
<div className="card-body px-5">
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<div className="mb-3">
|
||||
<label htmlFor="title" className="form-label">
|
||||
Business *
|
||||
</label>
|
||||
<select
|
||||
onChange={(e) => handleChange(e)}
|
||||
value={data.business}
|
||||
className="form-control"
|
||||
id="business"
|
||||
disabled={BusinessData.length < 1}
|
||||
>
|
||||
<option value="1">---select---</option>
|
||||
{BusinessData.length > 0 && BusinessData.map((item, index) =>
|
||||
<option key={index} value={item?.business} >{item?.business}</option>
|
||||
|
||||
)}
|
||||
</select>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default SelectBusiness
|
||||
|
||||
|
||||
173
src/views/Business/multiform/SelectPurpose.js
Normal file
173
src/views/Business/multiform/SelectPurpose.js
Normal file
@ -0,0 +1,173 @@
|
||||
|
||||
import React, { useEffect, useState } from 'react'
|
||||
import Button from '@material-ui/core/Button'
|
||||
import { Link, useNavigate } from 'react-router-dom'
|
||||
import swal from 'sweetalert'
|
||||
import axios from 'axios'
|
||||
import { isAutheticated } from 'src/auth'
|
||||
|
||||
|
||||
|
||||
const SelectPurpose = (props) => {
|
||||
const token = isAutheticated()
|
||||
const navigate = useNavigate()
|
||||
|
||||
const { data, setData } = props.data
|
||||
|
||||
const { loading, setLoading } = props.loading
|
||||
// const categories = props?.categories || []
|
||||
|
||||
const handleChange = (e) => {
|
||||
|
||||
setData((prev) => ({ ...prev, [e.target.id]: e.target.value }))
|
||||
}
|
||||
|
||||
|
||||
// const [loading, setLoading] = useState(false)
|
||||
|
||||
|
||||
const [purposeData, setPurposeData] = useState([])
|
||||
|
||||
|
||||
const getCategories = () => {
|
||||
axios
|
||||
.get(`/api/purpose`, {
|
||||
headers: { 'Access-Control-Allow-Origin': '*', Authorization: `Bearer ${token}` },
|
||||
})
|
||||
.then((res) => {
|
||||
// console.log(res.data)
|
||||
setPurposeData(res.data?.data)
|
||||
setLoading(false)
|
||||
})
|
||||
.catch((err) => {
|
||||
console.log(err)
|
||||
setLoading(false)
|
||||
})
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
getCategories()
|
||||
}, [])
|
||||
|
||||
|
||||
|
||||
|
||||
const handleSubmit = () => {
|
||||
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-12">
|
||||
<div
|
||||
className="
|
||||
page-title-box
|
||||
d-flex
|
||||
align-items-center
|
||||
justify-content-between
|
||||
"
|
||||
>
|
||||
<div style={{ fontSize: '22px' }} className="fw-bold">
|
||||
Select Purpose
|
||||
</div>
|
||||
<div style={{ display: 'flex', gap: '1rem' }}>
|
||||
<h4 className="mb-0"></h4>
|
||||
</div>
|
||||
|
||||
<div className="page-title-right">
|
||||
{/* <Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
style={{
|
||||
fontWeight: 'bold',
|
||||
marginBottom: '1rem',
|
||||
textTransform: 'capitalize',
|
||||
marginRight: '5px',
|
||||
}}
|
||||
onClick={() => handleSubmit()}
|
||||
disabled={loading}
|
||||
>
|
||||
{loading ? 'Loading' : 'Save'}
|
||||
</Button> */}
|
||||
|
||||
<Button
|
||||
variant="contained"
|
||||
color="secondary"
|
||||
style={{
|
||||
fontWeight: 'bold',
|
||||
marginBottom: '1rem',
|
||||
textTransform: 'capitalize',
|
||||
marginRight: '5px',
|
||||
|
||||
}}
|
||||
onClick={() => props.handleView(1)}
|
||||
|
||||
>
|
||||
Prev
|
||||
</Button>
|
||||
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
disabled={data.purpose === ''}
|
||||
style={{
|
||||
fontWeight: 'bold',
|
||||
marginBottom: '1rem',
|
||||
textTransform: 'capitalize',
|
||||
}}
|
||||
onClick={() => props.handleView(3)}
|
||||
// disabled={loading}
|
||||
>
|
||||
Next
|
||||
{/* {loading ? 'Loading' : 'Next'} */}
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div className="row">
|
||||
<div className="col-sm-12 col-md-12 col-lg-12 my-1">
|
||||
<div className="card h-100">
|
||||
<div className="card-body px-5">
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<div className="mb-3">
|
||||
<label htmlFor="title" className="form-label">
|
||||
Purpose *
|
||||
</label>
|
||||
<select
|
||||
onChange={(e) => handleChange(e)}
|
||||
value={data.purpose}
|
||||
className="form-control"
|
||||
id="purpose"
|
||||
disabled={purposeData.length < 1}
|
||||
>
|
||||
<option value="1">---select---</option>
|
||||
{purposeData.length > 0 && purposeData.map((item, index) =>
|
||||
<option key={index} value={item?.purpose} >{item?.purpose}</option>
|
||||
|
||||
)}
|
||||
</select>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default SelectPurpose
|
||||
187
src/views/Business/multiform/selectLanguage.js
Normal file
187
src/views/Business/multiform/selectLanguage.js
Normal file
@ -0,0 +1,187 @@
|
||||
|
||||
|
||||
|
||||
import React, { useEffect, useState } from 'react'
|
||||
import Button from '@material-ui/core/Button'
|
||||
import { Link, useNavigate } from 'react-router-dom'
|
||||
import swal from 'sweetalert'
|
||||
import axios from 'axios'
|
||||
import { isAutheticated } from 'src/auth'
|
||||
|
||||
|
||||
|
||||
const selectLanguage = (props) => {
|
||||
const token = isAutheticated()
|
||||
const navigate = useNavigate()
|
||||
|
||||
const { data, setData } = props.data
|
||||
|
||||
const { loading, setLoading } = props.loading
|
||||
// const categories = props?.categories || []
|
||||
|
||||
const handleChange = (e) => {
|
||||
if (data.language.length < 3) {
|
||||
setData((prev) => ({
|
||||
...prev,
|
||||
language: [...data.language, e.target.value]
|
||||
}))
|
||||
}
|
||||
else {
|
||||
swal({
|
||||
title: 'Warning',
|
||||
text: 'please select Up to 3 languages!',
|
||||
icon: 'warning',
|
||||
button: 'ok',
|
||||
dangerMode: true
|
||||
})
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// const [loading, setLoading] = useState(false)
|
||||
|
||||
|
||||
|
||||
|
||||
const [LanguagesData, setLanguagesData] = useState([])
|
||||
|
||||
|
||||
const getCategories = () => {
|
||||
axios
|
||||
.get(`/api/language`, {
|
||||
headers: { 'Access-Control-Allow-Origin': '*', Authorization: `Bearer ${token}` },
|
||||
})
|
||||
.then((res) => {
|
||||
|
||||
setLanguagesData(res.data.data)
|
||||
setLoading(false)
|
||||
})
|
||||
.catch((err) => {
|
||||
console.log(err)
|
||||
setLoading(false)
|
||||
})
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
getCategories()
|
||||
}, [])
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
return (
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-12">
|
||||
<div
|
||||
className="
|
||||
page-title-box
|
||||
d-flex
|
||||
align-items-center
|
||||
justify-content-between
|
||||
"
|
||||
>
|
||||
<div style={{ fontSize: '22px' }} className="fw-bold">
|
||||
Select Language
|
||||
</div>
|
||||
<div style={{ display: 'flex', gap: '1rem' }}>
|
||||
<h4 className="mb-0"></h4>
|
||||
</div>
|
||||
|
||||
<div className="page-title-right">
|
||||
<Button
|
||||
variant="contained"
|
||||
color="secondary"
|
||||
style={{
|
||||
fontWeight: 'bold',
|
||||
marginBottom: '1rem',
|
||||
textTransform: 'capitalize',
|
||||
marginRight: '5px',
|
||||
|
||||
}}
|
||||
onClick={() => props.handleView(2)}
|
||||
|
||||
>
|
||||
Prev
|
||||
</Button>
|
||||
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
disabled={data.purpose === ''}
|
||||
style={{
|
||||
fontWeight: 'bold',
|
||||
marginBottom: '1rem',
|
||||
textTransform: 'capitalize',
|
||||
// marginRight: '5px',
|
||||
}}
|
||||
onClick={() => props.handleView(4)}
|
||||
// disabled={loading}
|
||||
// disabled={data.language.length < 0 && data.language.length > 3}
|
||||
|
||||
>
|
||||
Next
|
||||
{/* {loading ? 'Loading' : 'Next'} */}
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div className="row">
|
||||
<div className="col-sm-12 col-md-12 col-lg-12 my-1">
|
||||
<div className="card h-100">
|
||||
<div className="card-body px-5">
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<div className="mb-3">
|
||||
<label htmlFor="title" className="form-label">
|
||||
please select Up to 3 languages
|
||||
</label>
|
||||
{LanguagesData.length > 0 && LanguagesData.map((item, index) =>
|
||||
// <option key={index} value={item?.language} >{item?.language}</option>
|
||||
<div className="d-flex">
|
||||
<input className='me-2' type="checkbox" name={item?.language} id={data.language} value={item?.language} onChange={(e) => handleChange(e)}
|
||||
/>
|
||||
{/* {checked = { data.language.map(item => item === item?.language) }} */}
|
||||
<label htmlFor="title" className="form-label">
|
||||
{item?.language}
|
||||
</label>
|
||||
</div>
|
||||
)}
|
||||
{/* <select
|
||||
onChange={(e) => handleChange(e)}
|
||||
value={data.language}
|
||||
className="form-control"
|
||||
id="language"
|
||||
disabled={LanguagesData.length < 1}
|
||||
>
|
||||
<option value="1">---select---</option>
|
||||
{LanguagesData.length > 0 && LanguagesData.map((item, index) =>
|
||||
<option key={index} value={item?.language} >{item?.language}</option>
|
||||
|
||||
)}
|
||||
</select> */}
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default selectLanguage
|
||||
@ -54,7 +54,7 @@ const AddBusiness = () => {
|
||||
button: 'Return',
|
||||
})
|
||||
setLoading(false)
|
||||
navigate('/business', { replace: true })
|
||||
navigate('/business_type', { replace: true })
|
||||
})
|
||||
.catch((err) => {
|
||||
setLoading(false)
|
||||
@ -82,8 +82,9 @@ const AddBusiness = () => {
|
||||
"
|
||||
>
|
||||
<div style={{ fontSize: '22px' }} className="fw-bold">
|
||||
Add Business
|
||||
Add Business Type
|
||||
</div>
|
||||
|
||||
<div style={{ display: 'flex', gap: '1rem' }}>
|
||||
<h4 className="mb-0"></h4>
|
||||
</div>
|
||||
@ -103,7 +104,7 @@ const AddBusiness = () => {
|
||||
>
|
||||
{loading ? 'Loading' : 'Save'}
|
||||
</Button>
|
||||
<Link to="/cities">
|
||||
<Link to="/business_type">
|
||||
<Button
|
||||
variant="contained"
|
||||
color="secondary"
|
||||
|
||||
@ -100,11 +100,11 @@ const Business = () => {
|
||||
"
|
||||
>
|
||||
<div style={{ fontSize: '22px' }} className="fw-bold">
|
||||
Business
|
||||
Business Type
|
||||
</div>
|
||||
|
||||
<div className="page-title-right">
|
||||
<Link to="/business/add">
|
||||
<Link to="/business_type/add">
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
@ -114,7 +114,7 @@ const Business = () => {
|
||||
textTransform: 'capitalize',
|
||||
}}
|
||||
>
|
||||
Add Business
|
||||
Add Business Type
|
||||
</Button>
|
||||
</Link>
|
||||
</div>
|
||||
@ -196,7 +196,7 @@ const Business = () => {
|
||||
</td>
|
||||
|
||||
<td className="text-start">
|
||||
<Link to={`/business/edit/${business._id}`}>
|
||||
<Link to={`/business_type/edit/${business._id}`}>
|
||||
<button
|
||||
style={{ color: 'white', margin: '0 1rem' }}
|
||||
type="button"
|
||||
|
||||
@ -73,7 +73,7 @@ const EditBusiness = () => {
|
||||
button: 'Close',
|
||||
})
|
||||
setLoading(false)
|
||||
navigate('/business', { replace: true })
|
||||
navigate('/business_type', { replace: true })
|
||||
})
|
||||
.catch((err) => {
|
||||
setLoading(false)
|
||||
@ -121,7 +121,7 @@ const EditBusiness = () => {
|
||||
>
|
||||
{loading ? 'Loading' : 'Update'}
|
||||
</Button>
|
||||
<Link to="/cities">
|
||||
<Link to="/business_type">
|
||||
<Button
|
||||
variant="contained"
|
||||
color="secondary"
|
||||
|
||||
@ -9,11 +9,11 @@ import axios from 'axios'
|
||||
import { isAutheticated } from 'src/auth'
|
||||
|
||||
|
||||
const AddBusiness = () => {
|
||||
const AddLanguage = () => {
|
||||
const token = isAutheticated();
|
||||
const navigate = useNavigate()
|
||||
const [data, setData] = useState({
|
||||
business: '',
|
||||
language: '',
|
||||
|
||||
|
||||
})
|
||||
@ -43,7 +43,7 @@ const AddBusiness = () => {
|
||||
}
|
||||
|
||||
const handleSubmit = () => {
|
||||
if (data.business.trim() === '') {
|
||||
if (data.language.trim() === '') {
|
||||
swal({
|
||||
title: 'Warning',
|
||||
text: 'Fill all mandatory fields',
|
||||
@ -55,7 +55,7 @@ const AddBusiness = () => {
|
||||
}
|
||||
setLoading(true)
|
||||
axios
|
||||
.post(`/api/business`, data, {
|
||||
.post(`/api/language`, data, {
|
||||
headers: {
|
||||
'Access-Control-Allow-Origin': '*',
|
||||
Authorization: `Bearer ${token}`,
|
||||
@ -64,12 +64,12 @@ const AddBusiness = () => {
|
||||
.then((res) => {
|
||||
swal({
|
||||
title: 'Added',
|
||||
text: 'Business added successfully!',
|
||||
text: 'Language added successfully!',
|
||||
icon: 'success',
|
||||
button: 'Return',
|
||||
})
|
||||
setLoading(false)
|
||||
navigate('/businesss', { replace: true })
|
||||
navigate('/languages', { replace: true })
|
||||
})
|
||||
.catch((err) => {
|
||||
setLoading(false)
|
||||
@ -97,7 +97,7 @@ const AddBusiness = () => {
|
||||
"
|
||||
>
|
||||
<div style={{ fontSize: '22px' }} className="fw-bold">
|
||||
Add Business
|
||||
Add Language
|
||||
</div>
|
||||
<div style={{ display: 'flex', gap: '1rem' }}>
|
||||
<h4 className="mb-0"></h4>
|
||||
@ -118,7 +118,7 @@ const AddBusiness = () => {
|
||||
>
|
||||
{loading ? 'Loading' : 'Save'}
|
||||
</Button>
|
||||
<Link to="/businesss">
|
||||
<Link to="/languages">
|
||||
<Button
|
||||
variant="contained"
|
||||
color="secondary"
|
||||
@ -140,19 +140,19 @@ const AddBusiness = () => {
|
||||
<div className="card h-100">
|
||||
<div className="card-body px-5">
|
||||
<div className="mb-3">
|
||||
<label htmlFor="business" className="form-label">
|
||||
Business *
|
||||
<label htmlFor="language" className="form-label">
|
||||
Language *
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
id="business"
|
||||
value={data.business}
|
||||
id="language"
|
||||
value={data.language}
|
||||
maxLength="50"
|
||||
onChange={(e) => handleChange(e)}
|
||||
/>
|
||||
{data.business && <p className="pt-1 pl-2 text-secondary">
|
||||
Remaining characters : {50 - data.business.length}
|
||||
{data.language && <p className="pt-1 pl-2 text-secondary">
|
||||
Remaining characters : {50 - data.language.length}
|
||||
</p>}
|
||||
</div>
|
||||
|
||||
@ -165,4 +165,4 @@ const AddBusiness = () => {
|
||||
)
|
||||
}
|
||||
|
||||
export default AddBusiness
|
||||
export default AddLanguage
|
||||
|
||||
@ -7,16 +7,16 @@ import axios from 'axios'
|
||||
import swal from 'sweetalert'
|
||||
import { isAutheticated } from 'src/auth'
|
||||
|
||||
const Cities = () => {
|
||||
const Purpose = () => {
|
||||
const token = isAutheticated();
|
||||
|
||||
const [loading, setLoading] = useState(true)
|
||||
const [success, setSuccess] = useState(true)
|
||||
const [citiesData, setCitiesData] = useState([])
|
||||
const [purposeData, setPurposeData] = useState([])
|
||||
|
||||
const [currentPage, setCurrentPage] = useState(1)
|
||||
const [itemPerPage, setItemPerPage] = useState(10)
|
||||
const [showData, setShowData] = useState(citiesData)
|
||||
const [showData, setShowData] = useState(purposeData)
|
||||
|
||||
const handleShowEntries = (e) => {
|
||||
setCurrentPage(1)
|
||||
@ -29,7 +29,7 @@ const Cities = () => {
|
||||
headers: { 'Access-Control-Allow-Origin': '*', Authorization: `Bearer ${token}` },
|
||||
})
|
||||
.then((res) => {
|
||||
setCitiesData(res.data.data)
|
||||
setPurposeData(res.data.data)
|
||||
setLoading(false)
|
||||
})
|
||||
.catch((err) => {
|
||||
@ -46,10 +46,10 @@ const Cities = () => {
|
||||
const loadData = () => {
|
||||
const indexOfLastPost = currentPage * itemPerPage
|
||||
const indexOfFirstPost = indexOfLastPost - itemPerPage
|
||||
setShowData(citiesData.slice(indexOfFirstPost, indexOfLastPost))
|
||||
setShowData(purposeData.slice(indexOfFirstPost, indexOfLastPost))
|
||||
}
|
||||
loadData()
|
||||
}, [currentPage, itemPerPage, citiesData])
|
||||
}, [currentPage, itemPerPage, purposeData])
|
||||
|
||||
const handleDelete = (id) => {
|
||||
swal({
|
||||
@ -248,8 +248,8 @@ const Cities = () => {
|
||||
aria-live="polite"
|
||||
>
|
||||
Showing {currentPage * itemPerPage - itemPerPage + 1} to{' '}
|
||||
{Math.min(currentPage * itemPerPage, citiesData.length)} of{' '}
|
||||
{citiesData.length} entries
|
||||
{Math.min(currentPage * itemPerPage, purposeData.length)} of{' '}
|
||||
{purposeData.length} entries
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -292,7 +292,7 @@ const Cities = () => {
|
||||
|
||||
{!(
|
||||
(currentPage + 1) * itemPerPage - itemPerPage >
|
||||
citiesData.length - 1
|
||||
purposeData.length - 1
|
||||
) && (
|
||||
<li className="paginate_button page-item ">
|
||||
<span
|
||||
@ -311,7 +311,7 @@ const Cities = () => {
|
||||
className={
|
||||
!(
|
||||
(currentPage + 1) * itemPerPage - itemPerPage >
|
||||
citiesData.length - 1
|
||||
purposeData.length - 1
|
||||
)
|
||||
? 'paginate_button page-item next'
|
||||
: 'paginate_button page-item next disabled'
|
||||
@ -339,4 +339,4 @@ const Cities = () => {
|
||||
)
|
||||
}
|
||||
|
||||
export default Cities
|
||||
export default Purpose
|
||||
|
||||
Loading…
Reference in New Issue
Block a user