Nearle_express/dailygrubs_console
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

createorder

Browse Source
This commit is contained in:
joshikannan
2024-04-10 19:50:40 +05:30
parent 77f5295720
commit dc8680d977
6 changed files with 419 additions and 116 deletions
Download Patch File Download Diff File Expand all files Collapse all files

49
package-lock.json generated
View File

@@ -34,6 +34,7 @@
"geolib": "^3.3.4", "geolib": "^3.3.4",
"jsonwebtoken": "^9.0.0", "jsonwebtoken": "^9.0.0",
"jwt-decode": "^3.1.2", "jwt-decode": "^3.1.2",
"leaflet": "^1.9.4",
"lodash": "^4.17.21", "lodash": "^4.17.21",
"mui-daterange-picker": "^1.0.5", "mui-daterange-picker": "^1.0.5",
"notistack": "^3.0.1", "notistack": "^3.0.1",
@@ -50,6 +51,7 @@
"react-google-autocomplete": "^2.7.3", "react-google-autocomplete": "^2.7.3",
"react-icons": "^4.12.0", "react-icons": "^4.12.0",
"react-intl": "^6.4.1", "react-intl": "^6.4.1",
"react-leaflet": "^4.2.1",
"react-loading-icons": "^1.1.0", "react-loading-icons": "^1.1.0",
"react-phone-number-input": "^3.3.10", "react-phone-number-input": "^3.3.10",
"react-redux": "^8.0.5", "react-redux": "^8.0.5",
@@ -4109,6 +4111,16 @@
"resolved": "https://registry.npmjs.org/@react-dnd/shallowequal/-/shallowequal-4.0.2.tgz", "resolved": "https://registry.npmjs.org/@react-dnd/shallowequal/-/shallowequal-4.0.2.tgz",
"integrity": "sha512-/RVXdLvJxLg4QKvMoM5WlwNR9ViO9z8B/qPcc+C0Sa/teJY7QG7kJ441DwzOjMYEY7GmU4dj5EcGHIkKZiQZCA==" "integrity": "sha512-/RVXdLvJxLg4QKvMoM5WlwNR9ViO9z8B/qPcc+C0Sa/teJY7QG7kJ441DwzOjMYEY7GmU4dj5EcGHIkKZiQZCA=="
}, },
"node_modules/@react-leaflet/core": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/@react-leaflet/core/-/core-2.1.0.tgz",
"integrity": "sha512-Qk7Pfu8BSarKGqILj4x7bCSZ1pjuAPZ+qmRwH5S7mDS91VSbVVsJSrW4qA+GPrro8t69gFYVMWb1Zc4yFmPiVg==",
"peerDependencies": {
"leaflet": "^1.9.0",
"react": "^18.0.0",
"react-dom": "^18.0.0"
}
},
"node_modules/@reduxjs/toolkit": { "node_modules/@reduxjs/toolkit": {
"version": "1.9.5", "version": "1.9.5",
"resolved": "https://registry.npmjs.org/@reduxjs/toolkit/-/toolkit-1.9.5.tgz", "resolved": "https://registry.npmjs.org/@reduxjs/toolkit/-/toolkit-1.9.5.tgz",
@@ -13458,6 +13470,11 @@
"language-subtag-registry": "~0.3.2" "language-subtag-registry": "~0.3.2"
} }
}, },
"node_modules/leaflet": {
"version": "1.9.4",
"resolved": "https://registry.npmjs.org/leaflet/-/leaflet-1.9.4.tgz",
"integrity": "sha512-nxS1ynzJOmOlHp+iL3FyWqK89GtNL8U8rvlMOsQdTTssxZwCXh8N2NB3GDQOL+YR3XnWyZAxwQixURb+FA74PA=="
},
"node_modules/leven": { "node_modules/leven": {
"version": "3.1.0", "version": "3.1.0",
"resolved": "https://registry.npmjs.org/leven/-/leven-3.1.0.tgz", "resolved": "https://registry.npmjs.org/leven/-/leven-3.1.0.tgz",
@@ -16944,6 +16961,19 @@
"resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz", "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz",
"integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==" "integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w=="
}, },
"node_modules/react-leaflet": {
"version": "4.2.1",
"resolved": "https://registry.npmjs.org/react-leaflet/-/react-leaflet-4.2.1.tgz",
"integrity": "sha512-p9chkvhcKrWn/H/1FFeVSqLdReGwn2qmiobOQGO3BifX+/vV/39qhY8dGqbdcPh1e6jxh/QHriLXr7a4eLFK4Q==",
"dependencies": {
"@react-leaflet/core": "^2.1.0"
},
"peerDependencies": {
"leaflet": "^1.9.0",
"react": "^18.0.0",
"react-dom": "^18.0.0"
}
},
"node_modules/react-loading-icons": { "node_modules/react-loading-icons": {
"version": "1.1.0", "version": "1.1.0",
"resolved": "https://registry.npmjs.org/react-loading-icons/-/react-loading-icons-1.1.0.tgz", "resolved": "https://registry.npmjs.org/react-loading-icons/-/react-loading-icons-1.1.0.tgz",
@@ -23201,6 +23231,12 @@
"resolved": "https://registry.npmjs.org/@react-dnd/shallowequal/-/shallowequal-4.0.2.tgz", "resolved": "https://registry.npmjs.org/@react-dnd/shallowequal/-/shallowequal-4.0.2.tgz",
"integrity": "sha512-/RVXdLvJxLg4QKvMoM5WlwNR9ViO9z8B/qPcc+C0Sa/teJY7QG7kJ441DwzOjMYEY7GmU4dj5EcGHIkKZiQZCA==" "integrity": "sha512-/RVXdLvJxLg4QKvMoM5WlwNR9ViO9z8B/qPcc+C0Sa/teJY7QG7kJ441DwzOjMYEY7GmU4dj5EcGHIkKZiQZCA=="
}, },
"@react-leaflet/core": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/@react-leaflet/core/-/core-2.1.0.tgz",
"integrity": "sha512-Qk7Pfu8BSarKGqILj4x7bCSZ1pjuAPZ+qmRwH5S7mDS91VSbVVsJSrW4qA+GPrro8t69gFYVMWb1Zc4yFmPiVg==",
"requires": {}
},
"@reduxjs/toolkit": { "@reduxjs/toolkit": {
"version": "1.9.5", "version": "1.9.5",
"resolved": "https://registry.npmjs.org/@reduxjs/toolkit/-/toolkit-1.9.5.tgz", "resolved": "https://registry.npmjs.org/@reduxjs/toolkit/-/toolkit-1.9.5.tgz",
@@ -30032,6 +30068,11 @@
"language-subtag-registry": "~0.3.2" "language-subtag-registry": "~0.3.2"
} }
}, },
"leaflet": {
"version": "1.9.4",
"resolved": "https://registry.npmjs.org/leaflet/-/leaflet-1.9.4.tgz",
"integrity": "sha512-nxS1ynzJOmOlHp+iL3FyWqK89GtNL8U8rvlMOsQdTTssxZwCXh8N2NB3GDQOL+YR3XnWyZAxwQixURb+FA74PA=="
},
"leven": { "leven": {
"version": "3.1.0", "version": "3.1.0",
"resolved": "https://registry.npmjs.org/leven/-/leven-3.1.0.tgz", "resolved": "https://registry.npmjs.org/leven/-/leven-3.1.0.tgz",
@@ -32350,6 +32391,14 @@
"resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz", "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz",
"integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==" "integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w=="
}, },
"react-leaflet": {
"version": "4.2.1",
"resolved": "https://registry.npmjs.org/react-leaflet/-/react-leaflet-4.2.1.tgz",
"integrity": "sha512-p9chkvhcKrWn/H/1FFeVSqLdReGwn2qmiobOQGO3BifX+/vV/39qhY8dGqbdcPh1e6jxh/QHriLXr7a4eLFK4Q==",
"requires": {
"@react-leaflet/core": "^2.1.0"
}
},
"react-loading-icons": { "react-loading-icons": {
"version": "1.1.0", "version": "1.1.0",
"resolved": "https://registry.npmjs.org/react-loading-icons/-/react-loading-icons-1.1.0.tgz", "resolved": "https://registry.npmjs.org/react-loading-icons/-/react-loading-icons-1.1.0.tgz",

2
package.json
View File

@@ -29,6 +29,7 @@
"geolib": "^3.3.4", "geolib": "^3.3.4",
"jsonwebtoken": "^9.0.0", "jsonwebtoken": "^9.0.0",
"jwt-decode": "^3.1.2", "jwt-decode": "^3.1.2",
"leaflet": "^1.9.4",
"lodash": "^4.17.21", "lodash": "^4.17.21",
"mui-daterange-picker": "^1.0.5", "mui-daterange-picker": "^1.0.5",
"notistack": "^3.0.1", "notistack": "^3.0.1",
@@ -45,6 +46,7 @@
"react-google-autocomplete": "^2.7.3", "react-google-autocomplete": "^2.7.3",
"react-icons": "^4.12.0", "react-icons": "^4.12.0",
"react-intl": "^6.4.1", "react-intl": "^6.4.1",
"react-leaflet": "^4.2.1",
"react-loading-icons": "^1.1.0", "react-loading-icons": "^1.1.0",
"react-phone-number-input": "^3.3.10", "react-phone-number-input": "^3.3.10",
"react-redux": "^8.0.5", "react-redux": "^8.0.5",

298
src/pages/nearle/orders/createorder1.js
View File

@@ -29,7 +29,9 @@ import {
Switch, Switch,
CardHeader, CardHeader,
Card, Card,
OutlinedInput OutlinedInput,
FormGroup,
FormControlLabel
} from '@mui/material'; } from '@mui/material';
import CloseIcon from '@mui/icons-material/Close'; import CloseIcon from '@mui/icons-material/Close';
import { Empty } from 'antd'; import { Empty } from 'antd';
@@ -387,6 +389,7 @@ const Createorder1 = () => {
const [stafflist, setStafflist] = useState([]); const [stafflist, setStafflist] = useState([]);
const [loading2, setLoading2] = useState(false); const [loading2, setLoading2] = useState(false);
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
const [btnLoading, setBtnLoading] = useState(false);
const [shiftarr, setShiftarr] = useState([]); const [shiftarr, setShiftarr] = useState([]);
const [shiftarr1, setShiftarr1] = useState([]); const [shiftarr1, setShiftarr1] = useState([]);
const [orderarr, setOrderarr] = useState([]); const [orderarr, setOrderarr] = useState([]);
@@ -433,6 +436,14 @@ const Createorder1 = () => {
const [appLocaLat, setAppLocaLat] = useState(); const [appLocaLat, setAppLocaLat] = useState();
const [appLocaLng, setAppLocaLng] = useState(); const [appLocaLng, setAppLocaLng] = useState();
const [appLocaRadius, setAppLocaRadius] = useState(); const [appLocaRadius, setAppLocaRadius] = useState();
const [isNumChange1, setIsNumChange1] = useState(0);
const [isNumChange2, setIsNumChange2] = useState(0);
const [showCheck1, setShowCheck1] = useState(0);
const [showCheck2, setShowCheck2] = useState(0);
const [pickNum, setPickNum] = useState();
const [dropNum, setdropNum] = useState();
const [numErr1, setNumErr1] = useState(false);
const [numErr2, setNumErr2] = useState(false);
const [isSms, setIsSms] = useState(0); const [isSms, setIsSms] = useState(0);
useEffect(() => { useEffect(() => {
@@ -801,13 +812,13 @@ const Createorder1 = () => {
cancellled: '', cancellled: '',
categoryid: +tenant.categoryid, categoryid: +tenant.categoryid,
configid: +localStorage.getItem('configid'), configid: +localStorage.getItem('configid'),
customerid: +pickCust.customerid || 0, customerid: isNumChange1 == 0 ? +pickCust.customerid || 0 : 0,
deliveryaddress: dropCust.address || '', deliveryaddress: dropCust.address || '',
deliverycharge: +totalCharge.toFixed(2) || 0, deliverycharge: +totalCharge.toFixed(2) || 0,
deliverycity: dropCust.city || '', deliverycity: dropCust.city || '',
deliverycontactno: dropCust.contactno || '', deliverycontactno: dropCust.contactno || '',
deliverycustomer: dropCust.firstname || '', deliverycustomer: dropCust.firstname || '',
deliveryid: dropCust.customerid || 0, deliveryid: isNumChange2 == 0 ? +dropCust.customerid || 0 : 0,
deliverylandmark: dropCust.landmark || '', deliverylandmark: dropCust.landmark || '',
deliverylat: dropCust.latitude.toString(), deliverylat: dropCust.latitude.toString(),
deliverylocation: dropCust.suburb || '', deliverylocation: dropCust.suburb || '',
@@ -859,7 +870,7 @@ const Createorder1 = () => {
configid: parseInt(localStorage.getItem('configid')), configid: parseInt(localStorage.getItem('configid')),
contactno: pickCust.contactno || '', contactno: pickCust.contactno || '',
customertoken: '', customertoken: '',
customerid: pickCust.customerid || 0, customerid: isNumChange1 == 0 ? pickCust.customerid || 0 : 0,
devicetype: '', devicetype: '',
deviceid: '', deviceid: '',
dialcode: '+91', dialcode: '+91',
@@ -885,7 +896,7 @@ const Createorder1 = () => {
configid: parseInt(localStorage.getItem('configid')), configid: parseInt(localStorage.getItem('configid')),
contactno: dropCust.contactno || '', contactno: dropCust.contactno || '',
customertoken: '', customertoken: '',
customerid: dropCust.customerid || 0, customerid: isNumChange2 == 0 ? dropCust.customerid || 0 : 0,
devicetype: '', devicetype: '',
deviceid: '', deviceid: '',
dialcode: '+91', dialcode: '+91',
@@ -906,33 +917,37 @@ const Createorder1 = () => {
}; };
console.log('createsubmitobj2', arr); console.log('createsubmitobj2', arr);
if (!pickCust.firstname) { if (!pickCust.firstname) {
opentoast('Enter Pickup Contact Name ', 'warning'); opentoast('Enter Pickup Contact Name ', 'warning', 2000);
} else if (!pickCust.contactno) { } else if (!pickCust.contactno) {
opentoast('Enter Pickup Contact Number ', 'warning'); opentoast('Enter Pickup Contact Number ', 'warning', 2000);
} else if (pickCust.contactno.length != 10) {
opentoast('Check Pickup Contact Number ', 'error', 2000);
} else if (!pickCust.suburb) { } else if (!pickCust.suburb) {
opentoast('Enter Pickup Location ', 'warning'); opentoast('Enter Pickup Location ', 'warning', 2000);
} else if (!pickCust.city) { } else if (!pickCust.city) {
opentoast('Enter Pickup City ', 'warning'); opentoast('Enter Pickup City ', 'warning', 2000);
} else if (!pickCust.postcode) { } else if (!pickCust.postcode) {
opentoast('Enter Pickup Postcode ', 'warning'); opentoast('Enter Pickup Postcode ', 'warning', 2000);
} else if (!pickCust.landmark) { } else if (!pickCust.landmark) {
opentoast('Enter Pickup Landmark ', 'warning'); opentoast('Enter Pickup Landmark ', 'warning', 2000);
} else if (!dropCust.firstname) { } else if (!dropCust.firstname) {
opentoast('Enter Drop Contact Name ', 'warning'); opentoast('Enter Drop Contact Name ', 'warning', 2000);
} else if (!dropCust.contactno) { } else if (!dropCust.contactno) {
opentoast('Enter Drop Contact Number', 'warning'); opentoast('Enter Drop Contact Number', 'warning', 2000);
} else if (dropCust.contactno.length !== 10) {
opentoast('Check Drop Contact Number ', 'error', 2000);
} else if (!dropCust.suburb) { } else if (!dropCust.suburb) {
opentoast('Enter Drop Suburb ', 'warning'); opentoast('Enter Drop Suburb ', 'warning', 2000);
} else if (!dropCust.city) { } else if (!dropCust.city) {
opentoast('Enter Drop City ', 'warning'); opentoast('Enter Drop City ', 'warning', 2000);
} else if (!dropCust.postcode) { } else if (!dropCust.postcode) {
opentoast('Enter Drop postcode ', 'warning'); opentoast('Enter Drop postcode ', 'warning', 2000);
} else if (!dropCust.landmark) { } else if (!dropCust.landmark) {
opentoast('Enter Drop Landmark ', 'warning'); opentoast('Enter Drop Landmark ', 'warning', 2000);
} else if (!selectedtime) { } else if (!selectedtime) {
opentoast('Choose deliverytime ', 'warning'); opentoast('Choose deliverytime ', 'warning', 2000);
} else if (!setSubCatId) { } else if (!setSubCatId) {
opentoast('Choose SubCategory ', 'warning'); opentoast('Choose SubCategory ', 'warning', 2000);
} else { } else {
try { try {
const createRes = await axios.post(`${process.env.REACT_APP_URL2}/orders/createorder`, arr); const createRes = await axios.post(`${process.env.REACT_APP_URL2}/orders/createorder`, arr);
@@ -1392,7 +1407,7 @@ const Createorder1 = () => {
setIsCustomerOpen(true); setIsCustomerOpen(true);
setpickordrop(1); setpickordrop(1);
setPickCust({}); setPickCust({});
setAddId1(1);
setInputValue2(''); setInputValue2('');
setSearchCustList(''); setSearchCustList('');
} }
@@ -1464,32 +1479,6 @@ const Createorder1 = () => {
<Grid item xs={12} sx={{}}> <Grid item xs={12} sx={{}}>
<Grid container spacing={4}> <Grid container spacing={4}>
{/* ====================================== ||Contact Number(pick) || ====================================== */}
<Grid item xs={6}>
<TextField
disabled={!isLocation}
fullWidth
type="number"
InputProps={{
inputProps: {
maxLength: 10
},
startAdornment: (
<IconButton>
<FaPhoneAlt />
</IconButton>
)
}}
variant="outlined"
label="Contact Number"
value={pickCust.contactno}
onChange={(e) => {
if (e.target.value.length <= 10) {
setPickCust({ ...pickCust, contactno: e.target.value });
}
}}
/>
</Grid>
{/* ====================================== ||Contact Name (pick) || ====================================== */} {/* ====================================== ||Contact Name (pick) || ====================================== */}
<Grid item xs={6}> <Grid item xs={6}>
<TextField <TextField
@@ -1511,9 +1500,44 @@ const Createorder1 = () => {
}} }}
/> />
</Grid> </Grid>
{/* ====================================== ||Contact Number(pick) || ====================================== */}
<Grid item xs={6}>
<TextField
error={numErr1}
disabled={!isLocation}
fullWidth
type="number"
InputProps={{
inputProps: {
maxLength: 10
},
startAdornment: (
<IconButton>
<FaPhoneAlt color={numErr1 && 'red'} />
</IconButton>
)
}}
variant="outlined"
label="Contact Number"
value={pickCust.contactno}
onChange={(e) => {
if (e.target.value.length <= 10) {
setPickCust({ ...pickCust, contactno: e.target.value });
}
if (pickNum == e.target.value) {
setShowCheck1(0);
} else {
setShowCheck1(1);
}
if (e.target.value.length < 10) {
setNumErr1(true);
} else {
setNumErr1(false);
}
}}
/>
</Grid>
{/* ====================================== || Address (pick) || ====================================== */} {/* ====================================== || Address (pick) || ====================================== */}
<Grid item xs={12}> <Grid item xs={12}>
<Stack spacing={1.25} sx={{ mt: 0 }}> <Stack spacing={1.25} sx={{ mt: 0 }}>
{addId1 == 0 ? ( {addId1 == 0 ? (
@@ -1691,6 +1715,24 @@ const Createorder1 = () => {
}} }}
/> />
</Grid> </Grid>
{/* ====================================== ||Checkbox save for later (pick) || ====================================== */}
{showCheck1 == 1 && (
<Grid item xs={12} sx={{ display: 'flex', justifyContent: 'end' }}>
<FormGroup>
<FormControlLabel
control={
<Checkbox
checked={isNumChange1 === 1}
onChange={(e) => {
setIsNumChange1(e.target.checked ? 1 : 0);
}}
/>
}
label="Save For Later"
/>
</FormGroup>
</Grid>
)}
</Grid> </Grid>
</Grid> </Grid>
{/* <Stack {/* <Stack
@@ -1755,7 +1797,7 @@ const Createorder1 = () => {
} else { } else {
setIsCustomerOpen(true); setIsCustomerOpen(true);
setpickordrop(2); setpickordrop(2);
setAddId2(1);
setInputValue3(''); setInputValue3('');
setSearchCustList(''); setSearchCustList('');
} }
@@ -1831,29 +1873,6 @@ const Createorder1 = () => {
<Grid item xs={12}> <Grid item xs={12}>
<Grid container spacing={4}> <Grid container spacing={4}>
{/* ====================================== ||Contact Number (drop) || ====================================== */}
<Grid item xs={6}>
<TextField
disabled={!isLocation}
fullWidth
type="number"
variant="outlined"
label="Contact Number"
InputProps={{
startAdornment: (
<IconButton>
<FaPhoneAlt />
</IconButton>
)
}}
value={dropCust.contactno}
onChange={(e) => {
if (e.target.value.length <= 10) {
setDropCust({ ...dropCust, contactno: e.target.value });
}
}}
/>
</Grid>
{/* ====================================== ||Contact Name (drop) || ====================================== */} {/* ====================================== ||Contact Name (drop) || ====================================== */}
<Grid item xs={6}> <Grid item xs={6}>
<TextField <TextField
@@ -1875,7 +1894,40 @@ const Createorder1 = () => {
}} }}
/> />
</Grid> </Grid>
{/* ====================================== ||Contact Number (drop) || ====================================== */}
<Grid item xs={6}>
<TextField
disabled={!isLocation}
error={numErr2}
fullWidth
type="number"
variant="outlined"
label="Contact Number"
InputProps={{
startAdornment: (
<IconButton>
<FaPhoneAlt color={numErr2 && 'red'} />
</IconButton>
)
}}
value={dropCust.contactno}
onChange={(e) => {
if (e.target.value.length <= 10) {
setDropCust({ ...dropCust, contactno: e.target.value });
}
if (dropNum == e.target.value) {
setShowCheck2(0);
} else {
setShowCheck2(1);
}
if (e.target.value.length < 10) {
setNumErr2(true);
} else {
setNumErr2(false);
}
}}
/>
</Grid>
<Grid item xs={12}> <Grid item xs={12}>
<Stack spacing={1.25} sx={{ mt: 0 }}> <Stack spacing={1.25} sx={{ mt: 0 }}>
{addId2 == 0 ? ( {addId2 == 0 ? (
@@ -2054,6 +2106,24 @@ const Createorder1 = () => {
}} }}
/> />
</Grid> </Grid>
{/* ====================================== ||Checkbox save for later (drop) || ====================================== */}
{showCheck2 == 1 && (
<Grid item xs={12} sx={{ display: 'flex', justifyContent: 'end' }}>
<FormGroup>
<FormControlLabel
control={
<Checkbox
checked={isNumChange2 === 1}
onChange={(e) => {
setIsNumChange2(e.target.checked ? 1 : 0);
}}
/>
}
label="Save For Later"
/>
</FormGroup>
</Grid>
)}
</Grid> </Grid>
</Grid> </Grid>
{/* <Stack {/* <Stack
@@ -2077,7 +2147,7 @@ const Createorder1 = () => {
</Grid> </Grid>
{/* ================================================= || Time || ================================================= */} {/* ================================================= || Time || ================================================= */}
<Grid item xs={12} sm={6}> <Grid item xs={12} sm={6}>
<MainCard sx={{ mt: 2 }}> <MainCard sx={{ mt: 2, height: '390px' }}>
<Grid container> <Grid container>
<Grid item xs={12}> <Grid item xs={12}>
<Typography variant="h5">Date</Typography> <Typography variant="h5">Date</Typography>
@@ -2185,46 +2255,36 @@ const Createorder1 = () => {
</MainCard> </MainCard>
</Grid> </Grid>
<Grid item xs={12} sm={6} sx={{}}> <Grid item xs={12} sm={6} sx={{}}>
<MainCard sx={{ mt: 2, height: 330 }}> <MainCard sx={{ mt: 2, height: '390px' }}>
{showDistance && ( {showDistance && (
<Stack sx={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between', mb: 3 }}> <Stack sx={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between', mb: 3 }}>
<Stack spacing={1.5}> <Stack spacing={1.5}>
<Typography variant="h5">Distance</Typography>
<Chip label={`Distance: ${distance} km`} size="medium" variant="contained" color="primary" /> <Chip label={`Distance: ${distance} km`} size="medium" variant="contained" color="primary" />
</Stack> </Stack>
<Stack spacing={1.5}> <Stack spacing={1.5}>
<Typography variant="h5">Charges</Typography>
<Chip label={`Charge: ₹${totalCharge.toFixed(2)}`} size="medium" variant="contained" color="primary" /> <Chip label={`Charge: ₹${totalCharge.toFixed(2)}`} size="medium" variant="contained" color="primary" />
</Stack> </Stack>
</Stack> </Stack>
)} )}
<Stack direction={'row'} justifyContent={'space-between'}> <Stack direction={'column'} justifyContent={'space-between'} sx={{ mb: 2 }}>
<Typography variant="h5">SMS Delivery</Typography> <Typography variant="h5">Category</Typography>
<Switch <Autocomplete
checked={isSms === 1} disablePortal
onChange={(e) => { id="combo-box-demo"
setIsSms(e.target.checked ? 1 : 0); options={subCat}
getOptionLabel={(option) => `${option.subcategoryname}` || ''}
sx={{ my: 2, zIndex: '100' }}
fullWidth
renderInput={(params) => <TextField {...params} label={subCatName == '' ? tenant.subcategoryname : subCatName} />}
onChange={(event, value, reason) => {
if (value) {
console.log(value);
setSubCatName(value.subcategoryname);
setSubCatId(value.subcategoryid);
}
}} }}
/> />
</Stack> </Stack>
<Typography variant="h5">Category</Typography>
<Autocomplete
disablePortal
id="combo-box-demo"
options={subCat}
getOptionLabel={(option) => `${option.subcategoryname}` || ''}
sx={{ my: 2, zIndex: '100' }}
fullWidth
renderInput={(params) => <TextField {...params} label={subCatName == '' ? tenant.subcategoryname : subCatName} />}
onChange={(event, value, reason) => {
if (value) {
console.log(value);
setSubCatName(value.subcategoryname);
setSubCatId(value.subcategoryid);
}
}}
/>
<Typography variant="h5">Weight</Typography> <Typography variant="h5">Weight</Typography>
<Stack direction={'row'} justifyContent={'space-evenly'} sx={{ border: '1px solid #eee', my: 2, py: 2 }}> <Stack direction={'row'} justifyContent={'space-evenly'} sx={{ border: '1px solid #eee', my: 2, py: 2 }}>
<Chip <Chip
@@ -2258,6 +2318,15 @@ const Createorder1 = () => {
}} }}
/> />
</Stack> </Stack>
<Stack direction={'row'} justifyContent={'space-between'} sx={{ mt: 4 }}>
<Typography variant="h5">SMS Delivery</Typography>
<Switch
checked={isSms === 1}
onChange={(e) => {
setIsSms(e.target.checked ? 1 : 0);
}}
/>
</Stack>
</MainCard> </MainCard>
</Grid> </Grid>
</Grid> </Grid>
@@ -2284,24 +2353,26 @@ const Createorder1 = () => {
</Grid> </Grid>
<Stack direction="row" justifyContent={'end'} sx={{ mt: 2, width: '100%' }}> <Stack direction="row" justifyContent={'end'} sx={{ mt: 2, width: '100%' }}>
<Button <Button
size="medium"
disabled={!showDistance} disabled={!showDistance}
variant="contained" variant="outlined"
sx={{
'&:hover': {
bgcolor: 'white',
color: theme.palette.primary.main,
border: `1px solid ${theme.palette.primary.main}`
}
}}
onClick={() => { onClick={() => {
setLoading(true); setLoading(true);
setBtnLoading(true);
createsubmitobj2(); createsubmitobj2();
setTimeout(() => { setTimeout(() => {
setLoading(false); setLoading(false);
setBtnLoading(false);
}, 1000); }, 1000);
}} }}
sx={{
'&:hover': {
transform: 'scale(1.05)',
transition: 'transform 0.3s ease'
}
}}
> >
Create {btnLoading ? <CircularProgress color="primary" size={20} thickness={10} /> : 'Create'}
</Button> </Button>
</Stack> </Stack>
</Grid> </Grid>
@@ -2429,13 +2500,16 @@ const Createorder1 = () => {
setIsCustomerOpen(false); setIsCustomerOpen(false);
if (pickordrop === 1) { if (pickordrop === 1) {
console.log('PickupClient', address); console.log('PickupClient', address);
setAddId1(1);
setStartPoint({ latitude: address.latitude, longitude: address.longitude }); setStartPoint({ latitude: address.latitude, longitude: address.longitude });
setPickCust(address); setPickCust(address);
setPickNum(address.contactno);
} else { } else {
console.log('DropClient', address); console.log('DropClient', address);
setDropCust(address); setAddId2(1);
setEndPoint({ latitude: address.latitude, longitude: address.longitude }); setEndPoint({ latitude: address.latitude, longitude: address.longitude });
setDropCust(address);
setdropNum(address.contactno);
} }
}} }}
disabled={pickCust.customerid === address.customerid} disabled={pickCust.customerid === address.customerid}

75
src/pages/nearle/reports/mapWithRoute.js Normal file
View File

@@ -0,0 +1,75 @@
import React, { useEffect, useRef } from 'react';
import { MapContainer, TileLayer, Marker, Popup, Polyline, Tooltip } from 'react-leaflet';
import dayjs from 'dayjs';
var utc = require('dayjs/plugin/utc');
dayjs.extend(utc);
const MapWithRoute = ({ coordinates, additionalProps }) => {
console.log(additionalProps.riderStart);
console.log(additionalProps.riderEnd);
const mapRef = useRef(null);
useEffect(() => {
if (mapRef.current && coordinates.length > 0) {
const bounds = calculateBounds(coordinates);
mapRef.current.fitBounds(bounds);
}
}, [coordinates]);
const calculateBounds = (coords) => {
const latitudes = coords.map((coord) => coord.lat);
const longitudes = coords.map((coord) => coord.lng);
const minLat = Math.min(...latitudes);
const maxLat = Math.max(...latitudes);
const minLng = Math.min(...longitudes);
const maxLng = Math.max(...longitudes);
return [
[minLat, minLng],
[maxLat, maxLng]
];
};
const limeOptions = { color: 'blue', weight: 10 };
const length = coordinates.length;
const midlenght = Math.round(coordinates.length / 2);
const start = coordinates[0];
const end = coordinates[length - 1];
const center = coordinates[midlenght];
return (
coordinates &&
coordinates.length > 0 && (
<div id="map" style={{ width: '80vw', height: '80vh', margin: '0 auto' }}>
<MapContainer center={center} zoom={15} scrollWheelZoom={false} style={{ height: '100%' }} ref={mapRef}>
<TileLayer url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png" />
<Marker position={start}>
<Tooltip hover direction="bottom">
<span>{`Pickup Point: ${dayjs(additionalProps.riderStart).utc().format('DD-MM-YYYY')} (${dayjs(additionalProps.riderStart)
.utc()
.format('hh:mm A')})`}</span>
</Tooltip>
{/* <Popup>{`Pickup Point ${dayjs(additionalProps.riderStart).utc().format('DD-MM-YYYY')} (${dayjs(additionalProps.riderStart)
.utc()
.format('hh:mm A')}) `}</Popup> */}
</Marker>
<Marker position={end}>
<Tooltip hover direction="bottom">
<span>{`Drop Point: ${dayjs(additionalProps.riderEnd).utc().format('DD-MM-YYYY')} (${dayjs(additionalProps.riderEnd)
.utc()
.format('hh:mm A')})`}</span>
</Tooltip>
{/* <Popup>{`Drop Point ${dayjs(additionalProps.riderEnd).utc().format('DD-MM-YYYY')} (${dayjs(additionalProps.riderEnd)
.utc()
.format('hh:mm A')}) `}</Popup> */}
</Marker>
{/* <Marker position={center}>
<Popup>Center Point</Popup>
</Marker> */}
<Polyline pathOptions={limeOptions} positions={coordinates} />
</MapContainer>
</div>
)
);
};
export default MapWithRoute;

94
src/pages/nearle/reports/ordersDetails.js
View File

@@ -7,6 +7,9 @@ import { Empty } from 'antd';
import ClearIcon from '@mui/icons-material/Clear'; import ClearIcon from '@mui/icons-material/Clear';
import { TableVirtuoso } from 'react-virtuoso'; import { TableVirtuoso } from 'react-virtuoso';
import { useTheme } from '@mui/material/styles'; import { useTheme } from '@mui/material/styles';
import { SlLocationPin } from 'react-icons/sl';
import MapWithRoute from './mapWithRoute';
import { enqueueSnackbar } from 'notistack';
// material-ui // material-ui
import { import {
@@ -107,6 +110,12 @@ const headCells = [
disablePadding: false, disablePadding: false,
label: '#' label: '#'
}, },
// {
// id: 'map',
// disablePadding: false,
// label: '^'
// },
{ {
id: 'tenantname', id: 'tenantname',
disablePadding: false, disablePadding: false,
@@ -196,6 +205,8 @@ export default function ordersDetails() {
const [startdate, setStartdate] = useState(dayjs().format('YYYY-MM-DD')); const [startdate, setStartdate] = useState(dayjs().format('YYYY-MM-DD'));
const [enddate, setEnddate] = useState(dayjs().format('YYYY-MM-DD')); const [enddate, setEnddate] = useState(dayjs().format('YYYY-MM-DD'));
const [open, setOpen] = useState(false); const [open, setOpen] = useState(false);
const [open1, setOpen1] = useState(false);
const [dateselect, setDateselect] = useState('select'); const [dateselect, setDateselect] = useState('select');
const [tabstatus1, setTabstatus1] = useState('Today'); const [tabstatus1, setTabstatus1] = useState('Today');
const [datestatus, setDatestatus] = useState('Today'); const [datestatus, setDatestatus] = useState('Today');
@@ -211,6 +222,38 @@ export default function ordersDetails() {
const [searchword, setSearchword] = useState(''); const [searchword, setSearchword] = useState('');
const [count, setCount] = useState(0); const [count, setCount] = useState(0);
const theme = useTheme(); const theme = useTheme();
const [riderCoordinates, setRiderCoordinates] = useState([]);
const [riderStart, setRiderStart] = useState();
const [riderEnd, setRiderEnd] = useState();
const getdeliverylogs = async (id) => {
console.log('deliveryid', id);
try {
const res = await axios.get(`${process.env.REACT_APP_URL}/deliveries/getdeliverylogs/?deliveryid=${id}`);
console.log('getdeliverylogs', res.data.details);
const datas = res.data.details;
if (datas.length != 0) {
setRiderStart(datas[0].logdate);
setRiderEnd(datas[datas.length - 1].logdate);
const coData = datas.map((data) => ({ lat: data.latitude, lng: data.longitude }));
console.log('coData', coData);
setRiderCoordinates(coData);
setOpen1(true);
} else {
opentoast('No Logs Found ', 'error', 2000);
}
} catch (error) {
console.log('getdeliverylogs', error);
}
};
const opentoast = (message, variant, time) => {
enqueueSnackbar(message, {
variant: variant,
anchorOrigin: { vertical: 'top', horizontal: 'right' },
autoHideDuration: time ? time : 1500
});
};
// ==============================|| textFieldRef (cmd+k)||============================== // // ==============================|| textFieldRef (cmd+k)||============================== //
useEffect(() => { useEffect(() => {
@@ -424,7 +467,6 @@ export default function ordersDetails() {
return ( return (
<> <>
<TitleCard title="Orders Details" /> <TitleCard title="Orders Details" />
<Paper content={false} sx={{ border: '1px solid #eeeeee', borderBottom: 'none' }}> <Paper content={false} sx={{ border: '1px solid #eeeeee', borderBottom: 'none' }}>
<Grid container sx={{ display: 'flex', alignItems: 'center', m: 2 }}> <Grid container sx={{ display: 'flex', alignItems: 'center', m: 2 }}>
<Grid item xs={4}> <Grid item xs={4}>
@@ -664,7 +706,8 @@ export default function ordersDetails() {
if (typeof row === 'number') return null; if (typeof row === 'number') return null;
const isItemSelected = isSelected(row.name); const isItemSelected = isSelected(row.name);
const labelId = `enhanced-table-checkbox-${index}`; const labelId = `enhanced-table-checkbox-${index}`;
console.log('rows.length', rows.length); // console.log('rows.length', rows.length);
console.log('filteredOrders', filteredOrders);
return ( return (
filteredOrders.length !== 0 && ( filteredOrders.length !== 0 && (
<TableRow <TableRow
@@ -688,7 +731,15 @@ export default function ordersDetails() {
/> />
</TableCell> */} </TableCell> */}
<TableCell sx={{ width: '10px' }}>{index + 1}</TableCell> <TableCell sx={{ width: '10px' }}>{index + 1}</TableCell>
{/* <TableCell
sx={{ width: '10px', cursor: 'pointer' }}
onClick={() => {
console.log('row', row);
getdeliverylogs(row.deliveryid);
}}
>
{<SlLocationPin />}
</TableCell> */}
<TableCell <TableCell
sx={{ sx={{
textAlign: 'start' textAlign: 'start'
@@ -867,7 +918,7 @@ export default function ordersDetails() {
row.actualkms == '' || row.actualkms == '' ||
row.actualkms == null row.actualkms == null
? parseInt(0).toFixed(1) ? parseInt(0).toFixed(1)
: parseInt(row.actualkms).toFixed(1) : row.actualkms
} }
size="small" size="small"
color="success" color="success"
@@ -1038,6 +1089,41 @@ export default function ordersDetails() {
</Button> </Button>
</Stack> </Stack>
</Dialog> </Dialog>
{/* ========================================= || MapWithRoute || ========================================= */}
{/* <Dialog
open={open1}
onClose={() => {
setOpen1(false);
}}
maxWidth={'lg'}
fullWidth
>
<DialogTitle
sx={{
// bgcolor: theme.palette.primary.main,
// color: 'white',
display: 'flex',
flexDirection: 'row',
justifyContent: 'space-between',
alignItems: 'center'
}}
>
<Typography variant="h4">Rider Route</Typography>
<Button
variant="outlined"
onClick={() => {
setOpen1(false);
}}
>
Close
</Button>
</DialogTitle>
{riderCoordinates && (
<div>
<MapWithRoute coordinates={riderCoordinates} additionalProps={{ riderStart, riderEnd }} />
</div>
)}
</Dialog> */}
</> </>
); );
} }

17
yarn.lock
View File

@@ -2069,6 +2069,11 @@
resolved "https://registry.npmjs.org/@react-dnd/shallowequal/-/shallowequal-4.0.2.tgz" resolved "https://registry.npmjs.org/@react-dnd/shallowequal/-/shallowequal-4.0.2.tgz"
integrity sha512-/RVXdLvJxLg4QKvMoM5WlwNR9ViO9z8B/qPcc+C0Sa/teJY7QG7kJ441DwzOjMYEY7GmU4dj5EcGHIkKZiQZCA== integrity sha512-/RVXdLvJxLg4QKvMoM5WlwNR9ViO9z8B/qPcc+C0Sa/teJY7QG7kJ441DwzOjMYEY7GmU4dj5EcGHIkKZiQZCA==
"@react-leaflet/core@^2.1.0":
version "2.1.0"
resolved "https://registry.npmjs.org/@react-leaflet/core/-/core-2.1.0.tgz"
integrity sha512-Qk7Pfu8BSarKGqILj4x7bCSZ1pjuAPZ+qmRwH5S7mDS91VSbVVsJSrW4qA+GPrro8t69gFYVMWb1Zc4yFmPiVg==
"@reduxjs/toolkit@^1.9.5": "@reduxjs/toolkit@^1.9.5":
version "1.9.5" version "1.9.5"
resolved "https://registry.npmjs.org/@reduxjs/toolkit/-/toolkit-1.9.5.tgz" resolved "https://registry.npmjs.org/@reduxjs/toolkit/-/toolkit-1.9.5.tgz"
@@ -7221,6 +7226,11 @@ language-tags@=1.0.5:
dependencies: dependencies:
language-subtag-registry "~0.3.2" language-subtag-registry "~0.3.2"
leaflet@^1.9.0, leaflet@^1.9.4:
version "1.9.4"
resolved "https://registry.npmjs.org/leaflet/-/leaflet-1.9.4.tgz"
integrity sha512-nxS1ynzJOmOlHp+iL3FyWqK89GtNL8U8rvlMOsQdTTssxZwCXh8N2NB3GDQOL+YR3XnWyZAxwQixURb+FA74PA==
leven@^3.1.0: leven@^3.1.0:
version "3.1.0" version "3.1.0"
resolved "https://registry.npmjs.org/leven/-/leven-3.1.0.tgz" resolved "https://registry.npmjs.org/leven/-/leven-3.1.0.tgz"
@@ -9255,6 +9265,13 @@ react-is@^18.2.0:
resolved "https://registry.npmjs.org/react-is/-/react-is-18.2.0.tgz" resolved "https://registry.npmjs.org/react-is/-/react-is-18.2.0.tgz"
integrity sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w== integrity sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w==
react-leaflet@^4.2.1:
version "4.2.1"
resolved "https://registry.npmjs.org/react-leaflet/-/react-leaflet-4.2.1.tgz"
integrity sha512-p9chkvhcKrWn/H/1FFeVSqLdReGwn2qmiobOQGO3BifX+/vV/39qhY8dGqbdcPh1e6jxh/QHriLXr7a4eLFK4Q==
dependencies:
"@react-leaflet/core" "^2.1.0"
react-loading-icons@^1.1.0: react-loading-icons@^1.1.0:
version "1.1.0" version "1.1.0"
resolved "https://registry.npmjs.org/react-loading-icons/-/react-loading-icons-1.1.0.tgz" resolved "https://registry.npmjs.org/react-loading-icons/-/react-loading-icons-1.1.0.tgz"