diff --git a/src/pages/nearle/orders/miltiUploadBackup.js b/src/pages/nearle/orders/miltiUploadBackup.js
new file mode 100644
index 0000000..6a8c6b8
--- /dev/null
+++ b/src/pages/nearle/orders/miltiUploadBackup.js
@@ -0,0 +1,1657 @@
+import React from 'react';
+import Loader from 'components/Loader';
+import { useEffect, useState, Fragment, useRef } from 'react';
+import { useTheme } from '@mui/material/styles';
+import MainCard from 'components/MainCard';
+import axios from 'axios';
+import ClearIcon from '@mui/icons-material/Clear';
+import { SearchOutlined, CloseOutlined, ExclamationCircleOutlined, FileAddOutlined } from '@ant-design/icons';
+import { Empty } from 'antd';
+import MyLocationIcon from '@mui/icons-material/MyLocation';
+import { DatePicker } from '@mui/x-date-pickers/DatePicker';
+import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider';
+import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs';
+import dayjs from 'dayjs';
+var utc = require('dayjs/plugin/utc');
+dayjs.extend(utc);
+import { enqueueSnackbar } from 'notistack';
+import { useNavigate } from 'react-router';
+import Papa from 'papaparse';
+import * as XLSX from 'xlsx';
+
+import {
+  FormControl,
+  InputAdornment,
+  Grid,
+  Typography,
+  Stack,
+  Box,
+  Button,
+  TextField,
+  Autocomplete,
+  Chip,
+  Divider,
+  Dialog,
+  DialogTitle,
+  DialogContent,
+  Checkbox,
+  DialogActions,
+  CircularProgress,
+  IconButton,
+  OutlinedInput,
+  FormGroup,
+  FormControlLabel,
+  Table,
+  TableContainer,
+  TableCell,
+  TableBody,
+  TableRow,
+  Paper,
+  TableHead,
+  FormLabel,
+  RadioGroup,
+  Radio,
+  Backdrop,
+  List,
+  ListItem,
+  ListItemText
+} from '@mui/material';
+import CircularLoader from 'components/nearle_components/CircularLoader';
+
+const MultipleOrders = () => {
+  const navigate = useNavigate();
+  const theme = useTheme();
+  const locationRef = useRef(null);
+  const tenantRef = useRef(null);
+  const userid = localStorage.getItem('userid');
+  const [locations, setLocations] = useState([]);
+  const [tenantlist, setTenantlist] = useState([]);
+  const [loading, setLoading] = useState(false);
+  const [btnLoading, setBtnLoading] = useState(false);
+  const [appId, setAppId] = useState(0);
+  const [tenantLocations, setTenantlocations] = useState([]);
+  //   const [tenantid, setTenantid] = useState(0);
+  const tenantid = localStorage.getItem('tenantid') || 0;
+  const [locationid, setLocationid] = useState(0);
+  const [basePrice, setBasePrice] = useState(0);
+  const [pricePerKm, setPricePerKm] = useState(0);
+  const [minKm, setMinKm] = useState(0);
+  const [pickCust, setPickCust] = useState(null);
+  const [dropCust, setDropCust] = useState([]);
+  const [isCustomerOpen, setIsCustomerOpen] = useState(false);
+  const [searchCustList, setSearchCustList] = useState('');
+  const [customerlist, setCustomerlist] = useState([]);
+  const [startdate, setStartdate] = useState(dayjs().format('MM-DD-YYYY'));
+  const [timeslotarr, setTimeslotarr] = useState([]);
+  const [starttime, setStatrttime] = useState();
+  const [endtime, setEndtime] = useState();
+  const [selectedtime, setSelectedtime] = useState('');
+  const [alertmessage, setAlertmessage] = useState('');
+  const [otherinstructions, setOtherinstructions] = useState('');
+  const [admintoken, setAdmintoken] = useState();
+  const [totaldist, settotaldist] = useState(0);
+  const [totalAmt, settotalAmt] = useState(0);
+  const [totalQty, settotalQty] = useState(0);
+  const [totalCash, settotalCash] = useState(0);
+  const [users, setUsers] = useState([]);
+  const [uploadType, setUploadType] = useState(null);
+  const [tenantValue, setTenantValue] = useState(null);
+  const [locationValue, setLocationValue] = useState(null);
+  const [pickupSlotsList, setPickupSlotsList] = useState(null);
+  const [pickupSlot, setPickupSlot] = useState(null);
+
+  useEffect(() => {
+    if (timeslotarr[0]) {
+      let arr = [];
+      timeslotarr.map((val) => {
+        if (dayjs().diff(dayjs(`${dayjs(startdate).format('MM-DD-YYYY')} ${dayjs(val).format('HH:mm:ss')}`), 'm') <= 0) {
+          arr.push(val);
+        }
+      });
+    }
+  }, [timeslotarr]);
+
+  // =============================================== || opentoast || ===============================================
+  const opentoast = (message, variant, time) => {
+    enqueueSnackbar(message, {
+      variant: variant,
+      anchorOrigin: { vertical: 'top', horizontal: 'right' },
+      autoHideDuration: time ? time : 1500
+    });
+    console.log(alertmessage);
+  };
+
+  // 🔹 Smart toast wrapper — prevents duplicate toasts for same message within 3 seconds
+  let toastCache = {};
+  const OpenToast = (message, type = 'info', timeout = 10000) => {
+    const key = `${type}-${message}`;
+    if (toastCache[key]) return; // skip duplicates
+    opentoast(message, type, timeout); // your existing toast/snackbar
+    toastCache[key] = true;
+    setTimeout(() => delete toastCache[key], 3000); // reset after delay
+  };
+
+  // ==============================|| fetchAppLocations ||============================== //
+
+  const fetchAppLocations = async () => {
+    setLoading(true);
+
+    try {
+      const locationRes = await axios.get(`${process.env.REACT_APP_URL}/partners/getlocations/?userid=${userid}`);
+      console.log('fetchAppLocations', locationRes.data.details);
+      setLocations(locationRes.data.details);
+    } catch (err) {
+      console.log('locationRes', err);
+      OpenToast(err.message, 'error', 5000);
+    } finally {
+      setLoading(false);
+    }
+  };
+  useEffect(() => {
+    fetchAppLocations();
+  }, []);
+
+  // ===================================================== || fetchtenantinfolist || =====================================================
+
+  const fetchtenantinfolist = async () => {
+    setLoading(true);
+    await axios
+      .get(`${process.env.REACT_APP_URL}/tenants/gettenants/?applocationid=${appId}&status=active`)
+
+      .then((res) => {
+        console.log(res);
+        if (res.data.status) {
+          let arr = [];
+          res.data.details.map((val) => {
+            arr.push({
+              ...val,
+              label: `${val.tenantname}`
+            });
+          });
+          setTenantlist(arr);
+        }
+        setLoading(false);
+      })
+      .catch((err) => {
+        console.log(err);
+        setLoading(false);
+      });
+  };
+  useEffect(() => {
+    appId && fetchtenantinfolist();
+  }, [appId]);
+  // ============================================= || fetchTenantPricing  || =============================================
+
+  const fetchTenantPricing = async (id) => {
+    try {
+      const pricingResponse = await axios.get(`${process.env.REACT_APP_URL}/tenants/gettenantpricing/?tenantid=${id}`);
+      console.log('pricingResponse', pricingResponse.data.details);
+      setBasePrice(pricingResponse.data.details.baseprice);
+      setPricePerKm(pricingResponse.data.details.priceperkm);
+      setMinKm(pricingResponse.data.details.minkm);
+    } catch (error) {
+      console.log('fetchTenantPricing error', error);
+    }
+  };
+  // ============================================= || gettenantlocations (branches) || =============================================
+  const gettenantlocations = async (id) => {
+    try {
+      const res = await axios.get(`${process.env.REACT_APP_URL}/tenants/gettenantlocations/?tenantid=${id}`);
+      console.log('gettenantlocations', res.data.details);
+      if (res.data.details.length == 1) {
+        setTenantlocations(res.data.details);
+        setPickCust(res.data.details[0]);
+        setLocationid(res.data.details[0].locationid);
+        setLocationValue(res.data.details[0].locationid);
+        setPickupSlotsList(res.data.details[0].slots);
+      } else {
+        setTenantlocations(res.data.details);
+      }
+    } catch (err) {
+      console.log('gettenantlocations', err);
+    }
+  };
+  useEffect(() => {
+    gettenantlocations(tenantid);
+  }, [tenantid]);
+  // ========================================================= || clientdetails || =========================================================
+  const clientdetails = async () => {
+    try {
+      let url =
+        searchCustList == ''
+          ? `${process.env.REACT_APP_URL}/customers/gettenantcustomers/?tenantid=${tenantid}&pageno=1&pagesize=30`
+          : `${process.env.REACT_APP_URL}/customers/search/?tenantid=${tenantid}&keyword=${searchCustList}`;
+      await axios
+        .get(url)
+        .then((res) => {
+          if (res.data.status) {
+            console.log('clientdetails', res.data.details);
+
+            setCustomerlist(res.data.details);
+            let arr = [];
+            res.data.details.map((val) => {
+              arr.push({
+                label: `${val.firstname} | ${val.contactno}`,
+                ...val
+              });
+            });
+          }
+        })
+        .catch((err) => {
+          console.log(err);
+          opentoast('server error', 'warning');
+        });
+    } catch (err) {
+      console.log(err);
+    }
+  };
+  useEffect(() => {
+    if (tenantid) {
+      clientdetails();
+    }
+  }, [searchCustList.length > 3, searchCustList == '', tenantid]);
+
+  // ========================================================= || calculateTotal(dist , charge) || =========================================================
+  const calculateTotal = () => {
+    let a1 = 0;
+    let a2 = 0;
+    let a3 = 0;
+    let a4 = 0;
+    dropCust.map((customer) => {
+      a1 += customer.distance;
+      a2 += customer.totalcharge;
+      a3 += customer.quantity;
+      a4 += customer.collectionamt;
+    });
+    settotaldist(a1);
+    settotalAmt(a2);
+    settotalQty(a3);
+    settotalCash(a4);
+  };
+  useEffect(() => {
+    calculateTotal();
+  }, [dropCust]);
+
+  // ========================================================= || handleCheckboxChange || =========================================================
+  const handleCheckboxChange = async (event, customer) => {
+    setLoading(true);
+    if (event.target.checked) {
+      // If the checkbox is checked, calculate the distance and add the customer
+      try {
+        const obj = await calculateDistance(customer);
+        const { roundedDistance, totalcharge } = obj;
+        // Create a new customer object with the distance property
+        const updatedCustomer = {
+          ...customer,
+          distance: roundedDistance,
+          totalcharge: totalcharge
+        };
+
+        // Add the updated customer object to dropCust
+        setDropCust((prevDropCust) => [...prevDropCust, updatedCustomer]);
+
+        // Log the rounded distance
+        // console.log(`Rounded Distance: ${roundedDistance} km`);
+      } catch (error) {
+        console.error('Failed to calculate distance:', error);
+      } finally {
+        setLoading(false);
+      }
+    } else {
+      // If the checkbox is unchecked, remove the customer from dropCust
+      setDropCust((prevDropCust) => {
+        return prevDropCust.filter((cust) => cust.customerid !== customer.customerid);
+      });
+      setLoading(false);
+    }
+  };
+  // ========================================================= || handleCheckboxChange1 || =========================================================
+  // const handleCheckboxChange1 = async (customer) => {
+  //   console.log('customer', customer);
+  //   setLoading(true);
+  //   try {
+  //     const obj = await calculateDistance(customer);
+  //     const { roundedDistance, totalcharge } = obj;
+  //     // Create a new customer object with the distance property
+  //     const updatedCustomer = {
+  //       ...customer,
+  //       distance: roundedDistance,
+  //       totalcharge: totalcharge
+  //     };
+
+  //     // Add the updated customer object to dropCust
+  //     setDropCust((prevDropCust) => [...prevDropCust, updatedCustomer]);
+
+  //     // Log the rounded distance
+  //     console.log(`Rounded Distance: ${roundedDistance} km`);
+  //     setLoading(false);
+  //   } catch (error) {
+  //     console.error('Failed to calculate distance:', error);
+  //   }
+  // };
+  const handleCheckboxChange1 = async (customer) => {
+    console.log('customer', customer);
+
+    setLoading(true);
+
+    try {
+      setDropCust((prevDropCust) => {
+        const isAlreadySelected = prevDropCust.some((c) => c.firstname === customer.firstname);
+
+        // 🔴 REMOVE if already exists
+        if (isAlreadySelected) {
+          return prevDropCust.filter((c) => c.firstname !== customer.firstname);
+        }
+
+        // 🟢 ADD if not exists (calculate distance)
+        return prevDropCust;
+      });
+
+      // Only calculate distance if customer is not already added
+      const alreadyExists = dropCust.some((c) => c.firstname === customer.firstname);
+
+      if (!alreadyExists) {
+        const obj = await calculateDistance(customer);
+        const { roundedDistance, totalcharge } = obj;
+
+        const updatedCustomer = {
+          ...customer,
+          distance: roundedDistance,
+          totalcharge
+        };
+
+        setDropCust((prevDropCust) => [...prevDropCust, updatedCustomer]);
+
+        console.log(`Rounded Distance: ${roundedDistance} km`);
+      }
+    } catch (error) {
+      console.error('Failed to calculate distance:', error);
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  // ========================================================= || calculateDistance || =========================================================
+
+  // 🔹 Main distance calculation function
+  const calculateDistance = async (customer) => {
+    const service = new google.maps.DistanceMatrixService();
+
+    // Helper: safely get distance matrix
+    const getDistanceMatrix = (origins, destinations) => {
+      return new Promise((resolve, reject) => {
+        // 2;
+        try {
+          if (!origins || !destinations) {
+            return reject(new Error('Origin or destination data missing.'));
+          }
+          service.getDistanceMatrix(
+            {
+              origins: [new google.maps.LatLng(origins.latitude, origins.longitude)],
+              destinations: [new google.maps.LatLng(destinations.latitude, destinations.longitude)],
+              travelMode: 'DRIVING',
+              unitSystem: google.maps.UnitSystem.METRIC
+            },
+            (response, status) => {
+              if (status === 'OK') {
+                resolve(response);
+              } else {
+                reject(new Error(`Google API error: ${status}`));
+              }
+            }
+          );
+        } catch (err) {
+          reject(new Error(`Unexpected error inside DistanceMatrixService: ${err.message}`));
+        }
+      });
+    };
+
+    try {
+      // --- Input validation ---
+      if (!customer || typeof customer !== 'object') {
+        throw new Error('Invalid customer data: expected an object.');
+      }
+
+      if (!pickCust || typeof pickCust !== 'object') {
+        throw new Error('Origin (pickCust) data missing or invalid.');
+      }
+
+      // --- Call Google Maps API ---
+      const response = await getDistanceMatrix(pickCust, customer);
+
+      // --- Validate response structure ---
+      if (!response.rows?.[0]?.elements?.[0] || !response.rows[0].elements[0].distance?.value) {
+        throw new Error('Malformed Distance Matrix response: missing distance value.');
+      }
+      // --- Compute distance ---
+      const distanceInMeters = response.rows[0].elements[0].distance.value;
+      const distanceInKilometers = distanceInMeters / 1000;
+      const roundedDistance = Math.round(distanceInKilometers);
+
+      // --- Calculate total charge ---
+      let totalcharge;
+      if (roundedDistance < minKm) {
+        totalcharge = basePrice;
+      } else {
+        totalcharge = (roundedDistance - minKm) * pricePerKm + basePrice;
+      }
+      return { roundedDistance, totalcharge };
+    } catch (error) {
+      // --- Categorized smart error handling ---
+      console.log('on calculateDistance', error.message);
+      if (error.message.includes('Google API')) {
+        console.log('🚨 Google Maps API Error:', error.message);
+        OpenToast('Invalid file format, upload valid file', 'error', 5000);
+      } else if (error.message.includes('Invalid coordinates')) {
+        console.log('📍 Invalid coordinate format:', error.message, 3000);
+        OpenToast('Invalid coordinate format. Check location data.', 'warning'), 3000;
+      } else if (error.message.includes('Malformed Distance Matrix')) {
+        console.log('⚠️ Unexpected Google response structure:', error.message);
+        OpenToast('Google Distance Matrix returned invalid data.', 'error', 3000);
+      } else if (error.message.includes('Origin') || error.message.includes('customer')) {
+        console.log('❌ Missing or invalid input data:', error.message);
+        OpenToast('Missing or invalid input data for distance calculation.', 'warning', 3000);
+      } else {
+        console.log('💥 Unexpected error calculating distance:', error);
+        OpenToast('Unexpected error during distance calculation.', 'error', 3000);
+      }
+
+      throw error; // keeps your current flow intact
+    }
+  };
+
+  // ==================================================== || fetchTiming || ====================================================
+  const fetchTiming = async () => {
+    setLoading(true);
+    await axios
+      .get(`${process.env.REACT_APP_URL}/utils/getapplocations/?applocationid=${appId}`)
+      .then((res) => {
+        console.log('fetchTiming', res);
+        const { opentime, closetime } = res.data.details[0];
+        if (res.data.status) {
+          setStatrttime(`${dayjs().format('MM-DD-YYYY')} ${opentime}`);
+          setEndtime(`${dayjs().format('MM-DD-YYYY')} ${closetime}`);
+          console.log('starttime', `${dayjs().format('MM-DD-YYYY')} ${opentime}`);
+          console.log('endtime', `${dayjs().format('MM-DD-YYYY')} ${closetime} `);
+          let arr = [];
+          for (
+            let i = `${dayjs().format('MM-DD-YYYY')} ${opentime}`, j = 0;
+            dayjs(`${dayjs().format('MM-DD-YYYY')} ${closetime} `).diff(i, 'm') >= 0;
+            j++, i = dayjs(i).add(30, 'm')
+          ) {
+            arr.push(i);
+          }
+          console.log('setTimeslotarr', arr);
+          setTimeslotarr(arr);
+        }
+        setLoading(false);
+      })
+      .catch((err) => {
+        console.log(err);
+        setLoading(false);
+      });
+  };
+  useEffect(() => {
+    if (appId) {
+      fetchTiming();
+    }
+  }, [appId]);
+
+  const fetchAppAdminTokens = async () => {
+    setLoading(true);
+    await axios
+      .get(`${process.env.REACT_APP_URL}/utils/getapplocationconfig/?applocationid=${appId}`)
+      .then((res) => {
+        const userfcmtokemArray = res.data.details.applocationadmins.map((admin) => admin.userfcmtokem); // fcm => firebase cloud messaging
+        console.log('fetchAppAdminTokens', res);
+        console.log('userfcmtokemArray', userfcmtokemArray);
+        if (res.data.status) {
+          setAdmintoken(userfcmtokemArray);
+        }
+        setLoading(false);
+      })
+      .catch((err) => {
+        console.log(err);
+        setLoading(false);
+      });
+  };
+
+  useEffect(() => {
+    if (appId) {
+      fetchAppAdminTokens();
+    }
+  }, [appId]);
+
+  useEffect(() => {
+    console.log('pickCust', pickCust);
+  }, [pickCust]);
+  useEffect(() => {
+    console.log('dropCust', dropCust);
+  }, [dropCust]);
+  //   // ==================================================== || fetchtenantinfo || ====================================================
+  //   const fetchtenantinfo = async () => {
+  //     setLoading(true);
+  //     console.log('tenantid', tenantid);
+
+  //     await axios
+  //       .get(`${process.env.REACT_APP_URL}/tenants/gettenantinfo/?tenantid=${tenantid}`)
+  //       .then((res) => {
+  //         console.log('fetchtenantinfo', res);
+  //         if (res.data.status) {
+  //           setTenantid(res.data.details.tenantid);
+  //         }
+  //         setLoading(false);
+  //       })
+  //       .catch((err) => {
+  //         console.log(err);
+  //         setLoading(false);
+  //       });
+  //   };
+  //   useEffect(() => {
+  //     if (tenantid) {
+  //       fetchtenantinfo();
+  //     }
+  //   }, [tenantid]);
+  // ================================================== ||  sendnotifications || ==================================================
+  const sendnotifications = async () => {
+    setLoading(true);
+    await axios
+      .post(`${process.env.REACT_APP_URL}/utils/sendnotifications`, {
+        priority: 'high',
+        registration_ids: admintoken,
+        data: {
+          accessid: process.env.REACT_APP_RIDER_ACCESS_ID
+        },
+        notification: {
+          title: 'Nearle Merchant',
+          body: 'An Order has been placed successfully,kindly process the same',
+          sound: 'ring'
+        }
+      })
+      .then((res) => {
+        console.log(res);
+        if (res.data.message == 'Success') {
+          enqueueSnackbar('Notification sent Successfully', {
+            variant: 'success',
+            anchorOrigin: { vertical: 'top', horizontal: 'right' },
+            autoHideDuration: 1000
+          });
+        }
+        setLoading(false);
+      })
+      .catch((err) => {
+        console.log(err);
+        enqueueSnackbar(err.message, {
+          variant: 'error',
+          anchorOrigin: { vertical: 'top', horizontal: 'right' },
+          autoHideDuration: 1000
+        });
+        setLoading(false);
+      });
+  };
+
+  const cleanReceiverName = (name) => {
+    if (typeof name !== 'string') return name;
+    return name.replace(/^[\d.\s]+/, '').trim();
+  };
+
+  const handleFileUpload = (event) => {
+    console.log('Normal upload started...');
+    try {
+      const file = event.target.files?.[0];
+      if (!file) {
+        opentoast('No file selected.', 'warning');
+        return;
+      }
+
+      const fileName = file.name.toLowerCase();
+      const isCSV = fileName.endsWith('.csv');
+      const isExcel = fileName.endsWith('.xls') || fileName.endsWith('.xlsx');
+
+      // Invalid file
+      if (!isCSV && !isExcel) {
+        opentoast('Invalid file type. Please upload a CSV or Excel file.', 'warning');
+        return;
+      }
+
+      // ---------------------- CSV ----------------------
+      if (isCSV) {
+        Papa.parse(file, {
+          header: true,
+          dynamicTyping: true,
+          skipEmptyLines: true,
+          complete: (results) => {
+            const data = results.data || [];
+            if (data.length === 0) {
+              opentoast('CSV file is empty or invalid.', 'warning');
+              setUsers([]);
+              return;
+            }
+            const cleanedData = data.map((row) => ({
+              ...row,
+              firstname: cleanReceiverName(row.firstname)
+            }));
+            console.log('✅ Parsed CSV Data:', cleanedData);
+            setUsers(cleanedData);
+            opentoast('CSV file uploaded successfully,  ✅', 'success', 3000);
+            opentoast(' Press Continue to add delivery customers', 'warning', 5000);
+          },
+          error: (error) => {
+            console.error('❌ CSV Parse Error:', error.message);
+            opentoast(`CSV parsing failed: ${error.message}`, 'warning');
+          }
+        });
+      }
+
+      // ---------------------- EXCEL (.xls / .xlsx) ----------------------
+      if (isExcel) {
+        const reader = new FileReader();
+
+        reader.onload = (e) => {
+          try {
+            const data = e.target.result;
+
+            // Use correct mode for binary Excel formats
+            const workbook = XLSX.read(data, {
+              type: 'binary',
+              cellDates: true,
+              cellNF: false,
+              cellText: false
+            });
+            const firstSheet = workbook.SheetNames[0];
+            const worksheet = workbook.Sheets[firstSheet];
+            const jsonData = XLSX.utils.sheet_to_json(worksheet, { defval: '' });
+
+            if (!jsonData || jsonData.length === 0) {
+              opentoast('Excel file is empty or invalid.', 'warning');
+              setUsers([]);
+              return;
+            }
+
+            const cleanedData = jsonData.map((row) => ({
+              ...row,
+              firstname: cleanReceiverName(row.firstname)
+            }));
+
+            console.log('✅ Parsed Excel Data:', cleanedData);
+            setUsers(cleanedData);
+            opentoast('Excel file uploaded successfully ✅, press continue', 'success', 3000);
+          } catch (err) {
+            console.error('❌ Excel Parse Error:', err);
+            opentoast(`Error reading Excel: ${err.message}`, 'warning');
+          }
+        };
+
+        // ✅ Key fix: use readAsBinaryString for both .xls & .xlsx
+        reader.readAsBinaryString(file);
+      }
+    } catch (err) {
+      console.error('Unexpected error during file upload:', err.message);
+      opentoast(`Unexpected error: ${err.message}`, 'warning');
+    }
+  };
+
+  // your header mapping
+  const headerMap = {
+    'pickupdate(yyyy-mmm-dd)': 'date',
+    'sendername*': 'locationname',
+    'senderphone*': 'locationcontact',
+    'senderaddress*': 'locationaddress',
+    'receivername*': 'firstname',
+    'receiverphone*': 'contactno',
+    'receiveralternatephone*': 'altcontactno',
+    receiverfulladdress: 'address',
+    receiverlatitude: 'latitude',
+    receiverlongitude: 'longitude',
+    'itemdescription*': 'description',
+    Quantity: 'quantity',
+    ' Collect Cash': 'collectionamt'
+  };
+
+  // helper to normalize headers
+  const normalizeHeader = (header) => header?.toString().trim().toLowerCase().replace(/\s+/g, '');
+
+  const handleFileDirectUpload = (event) => {
+    try {
+      const file = event.target.files?.[0];
+      if (!file) {
+        opentoast('No file selected.', 'warning');
+        return;
+      }
+
+      const fileName = file.name.toLowerCase();
+      const isCSV = fileName.endsWith('.csv');
+      const isExcel = fileName.endsWith('.xls') || fileName.endsWith('.xlsx');
+
+      if (!isCSV && !isExcel) {
+        opentoast('Invalid file type. Please upload a CSV or Excel file.', 'warning');
+        return;
+      }
+
+      const processData = (data, headers) => {
+        console.log('data', data);
+        const normalizedMap = {};
+        for (const key in headerMap) {
+          normalizedMap[normalizeHeader(key)] = headerMap[key];
+        }
+        console.log('normalizedMap', normalizedMap);
+
+        const mappedData = data.map((row) => {
+          const newRow = {};
+          for (const key in row) {
+            const cleanKey = normalizeHeader(key);
+            const newKey = normalizedMap[cleanKey] || cleanKey;
+            let value = row[key];
+            if (newKey === 'firstname') value = cleanReceiverName(value);
+
+            newRow[newKey] = value;
+          }
+
+          return newRow;
+        });
+
+        const missingCols = Object.keys(headerMap).filter((clientCol) => !headers.includes(normalizeHeader(clientCol)));
+
+        if (missingCols.length > 0) {
+          isExcel && opentoast(`Missing columns: ${missingCols.join(', ')}`, 'warning');
+        }
+
+        console.log('✅ Final Processed Data:', mappedData);
+        setUsers(mappedData);
+        opentoast('File uploaded and  successfully ', 'success', 3000);
+        opentoast('Press Continue', 'warning', 3000);
+      };
+
+      // ============ CSV handler ============
+      if (isCSV) {
+        Papa.parse(file, {
+          header: true,
+          dynamicTyping: true,
+          skipEmptyLines: true,
+          complete: (results) => {
+            if (!results.data?.length) {
+              opentoast('CSV file is empty or has no valid rows.', 'warning');
+              setUsers([]);
+              return;
+            }
+            const headers = results.meta.fields.map(normalizeHeader);
+            processData(results.data, headers);
+          },
+          error: (error) => {
+            console.error('❌ CSV Parsing Error:', error);
+            opentoast(`CSV parsing failed: ${error.message}`, 'warning');
+          }
+        });
+      }
+
+      // ============ Excel handler ============
+      if (isExcel) {
+        const reader = new FileReader();
+        reader.onload = (e) => {
+          try {
+            const data = e.target.result;
+            // Try reading as binary first
+            let workbook;
+            try {
+              workbook = XLSX.read(data, { type: 'binary' });
+            } catch {
+              // fallback for modern XLSX files
+              const arrayBuffer = new Uint8Array(data);
+              workbook = XLSX.read(arrayBuffer, { type: 'array' });
+            }
+
+            const firstSheet = workbook.SheetNames[0];
+            const worksheet = workbook.Sheets[firstSheet];
+            const jsonData = XLSX.utils.sheet_to_json(worksheet, { defval: '' });
+
+            if (!jsonData?.length) {
+              opentoast('Excel file is empty or invalid.', 'warning');
+              setUsers([]);
+              return;
+            }
+
+            const headers = Object.keys(jsonData[0]).map(normalizeHeader);
+            processData(jsonData, headers);
+          } catch (err) {
+            console.error('❌ Error processing Excel:', err);
+            opentoast(`Error reading Excel: ${err.message}`, 'warning');
+          }
+        };
+
+        // Important: use readAsBinaryString for Excel
+        reader.readAsBinaryString(file);
+      }
+    } catch (err) {
+      console.error('Unexpected error during file upload:', err);
+      opentoast(`Unexpected error: ${err.message}`, 'warning');
+    }
+  };
+
+  // =============================================== ||  createorders  || ===============================================
+  const createorders = async () => {
+    // ===================== Build Payload =====================
+    const arr = dropCust.map((customer) => ({
+      applocationid: pickCust.applocationid,
+      configid: 9,
+      partnerid: pickCust.partnerid,
+      partneruserid: +userid,
+      paymentstatus: 1,
+      paymenttype: 42,
+      pickupaddress: pickCust.address || '',
+      pickupcity: pickCust.city || '',
+      pickupcontactno: pickCust.contactno || '',
+      pickupcustomer: pickCust.locationname || '',
+      pickuplandmark: pickCust.landmark || '',
+      pickuplat: pickCust.latitude,
+      pickuplocation: pickCust.suburb || '',
+      pickuplocationid: pickCust.locationid || 0,
+      pickuplong: pickCust.longitude,
+      tenantid: pickCust.tenantid,
+
+      customerid: +customer?.customerid,
+      deliveryaddress: customer.address || '',
+      deliverycharge: +customer.totalcharge || 0,
+      deliverycity: customer.city || '',
+      deliverycontactno: customer.contactno?.toString() || '',
+      deliverycustomer: customer.firstname || '',
+      deliveryid: +customer.customerid,
+      deliverylandmark: customer.landmark || '',
+      deliverylat: customer.latitude?.toString() || '',
+      deliverylocation: customer.suburb || '',
+      deliverylocationid: customer.deliverylocationid || 0,
+      deliverylong: customer.longitude?.toString() || '',
+      deliverytime: `${dayjs(startdate).format('YYYY-MM-DD')} ${dayjs(selectedtime.$d).format('HH:mm:ss')}`,
+      deliverytype: 'B',
+
+      itemcount: 1,
+      quantity: customer.quantity,
+      collectionamt: customer.collectionamt,
+      kms: customer.distance?.toString() || '0',
+      locationid: +pickCust.locationid,
+      moduleid: +pickCust.moduleid,
+
+      orderamount: +customer.totalcharge || 0,
+      ordercharges: 0.0,
+      orderdate: dayjs().format('YYYY-MM-DD HH:mm:ss'),
+      ordernotes: otherinstructions,
+      orderstatus: 'created',
+      ordervalue: +customer.totalcharge || 0,
+      pickupSlot
+    }));
+
+    console.log('arr', arr);
+
+    // ===================== Validation =====================
+    if (!tenantid) {
+      opentoast('Choose Client', 'warning');
+      return;
+    }
+    setLoading(true);
+    try {
+      const res = await axios.post(`${process.env.REACT_APP_URL}/orders/createorders`, arr);
+      if (res.data.status) {
+        opentoast('Order Created Successfully', 'success', 2000);
+        if (admintoken) {
+          sendnotifications();
+        }
+        navigate('/nearle/orders');
+        setLoading(false);
+      } else {
+        console.log(res.data);
+        console.error('Create order failed (API response):', res.data);
+        opentoast(res?.data?.message || 'Order creation failed. Please try again.', 'warning', 3000);
+      }
+    } catch (err) {
+      opentoast(err.message, 'error', 2000);
+      console.log('create orders', err.message);
+      console.error('Create order error:', {
+        message: err.message,
+        response: err.response,
+        request: err.request,
+        stack: err.stack
+      });
+
+      // Exact but short error for user
+      let toastMessage = 'Something went wrong. Please try again.';
+
+      if (err.response) {
+        // Server responded with error
+        toastMessage = err.response.data?.message || `Server error (${err.response.status})`;
+      } else if (err.request) {
+        // No response received
+        toastMessage = 'Network error. Check your internet connection.';
+      }
+      opentoast(toastMessage, 'error');
+      setLoading(false);
+    } finally {
+      setLoading(false);
+      setBtnLoading(false);
+    }
+  };
+
+  const [fileName, setFileName] = useState('');
+  const removeFileExtension = (fileName) => {
+    return fileName.replace(/\.[^/.]+$/, '');
+  };
+
+  const onFileChange = (event) => {
+    const file = event.target.files[0];
+    if (!file) return;
+    const cleanedName = removeFileExtension(file.name);
+    setFileName((prev) => (prev ? `${prev}, ${cleanedName}` : cleanedName));
+    if (tenantid === 916) {
+      handleFileDirectUpload(event);
+    } else {
+      handleFileDirectUpload(event);
+      // handleFileUpload(event);
+    }
+  };
+
+  const handleQuantityChange = (customerid, value) => {
+    setDropCust((prev) => prev.map((cust) => (cust.customerid === customerid ? { ...cust, quantity: Number(value) || 0 } : cust)));
+  };
+  const handleCollectionAmtChange = (customerid, value) => {
+    setDropCust((prev) => prev.map((cust) => (cust.customerid === customerid ? { ...cust, collectionamt: Number(value) || 0 } : cust)));
+  };
+
+  return (
+    <>
+      {loading && (
+        <>
+          <Loader />
+          {/* <CircularLoader /> */}
+        </>
+      )}
+      {
+        <Backdrop
+          sx={{
+            color: '#fff',
+            zIndex: (theme) => theme.zIndex.drawer + 1
+          }}
+          open={btnLoading} // when loader = true, backdrop covers the page
+        >
+          <CircularLoader color="inherit" />
+        </Backdrop>
+      }
+
+      <Grid
+        container
+        spacing={3}
+        sx={{
+          position: 'sticky',
+          top: '60px',
+          bgcolor: theme.palette.background.default,
+          zIndex: 100,
+          display: 'flex',
+          flexDirection: 'column',
+          justifyContent: 'start',
+          alignItems: 'center',
+          spacing: 5
+        }}
+      >
+        {/* ===================================================== ||Business Location || ===================================================== */}
+        <Grid item xs={12} sx={{ width: '100%', mt: -1 }}>
+          <Stack
+            direction={{ xs: 'column', sm: 'row' }}
+            spacing={2}
+            sx={{
+              width: '100%',
+              alignItems: { xs: 'stretch', sm: 'center' },
+              justifyContent: 'space-between',
+              mb: 2
+            }}
+          >
+            <Typography variant="h3">Create Multiple Order</Typography>
+
+            <Stack sx={{ width: { xs: '100%', sm: 400 } }}>
+              {tenantLocations?.length === 1 ? (
+                <TextField
+                  variant="outlined"
+                  fullWidth
+                  label="Business Location"
+                  value={tenantLocations[0]?.locationname || ''}
+                  focused
+                  InputProps={{
+                    style: {
+                      color: theme.palette.primary.main
+                    },
+                    startAdornment: (
+                      <InputAdornment position="start">
+                        <MyLocationIcon color="primary" />
+                      </InputAdornment>
+                    )
+                  }}
+                />
+              ) : (
+                <Autocomplete
+                  fullWidth
+                  options={tenantLocations || []}
+                  getOptionLabel={(option) => `${option.locationname} (${option.suburb})`}
+                  value={locationValue}
+                  onOpen={(event) => {
+                    if (!appId && !tenantid) {
+                      event.preventDefault();
+
+                      OpenToast('Please select Location and Tenant first!', 'warning', 3000);
+
+                      setTimeout(() => {
+                        locationRef.current?.focus();
+                      }, 0);
+                    } else if (!tenantid) {
+                      event.preventDefault();
+
+                      OpenToast('Please select Tenant first!', 'warning', 3000);
+
+                      setTimeout(() => {
+                        tenantRef.current?.focus();
+                      }, 0);
+                    }
+                  }}
+                  onChange={(event, value, reason) => {
+                    if (reason === 'clear') {
+                      setLocationid(0);
+                      setLocationValue(null);
+                      setPickCust(null);
+                    } else {
+                      setLocationid(value?.locationid || 0);
+                      setLocationValue(value);
+                      setPickCust(value);
+                      setPickupSlotsList(value?.slots);
+                    }
+                  }}
+                  renderInput={(params) => <TextField {...params} label="Select Business Location" color="primary" />}
+                />
+              )}
+            </Stack>
+          </Stack>
+        </Grid>
+
+        {/* ===================================================== || Pickup || ===================================================== */}
+        <Grid item xs={12} sx={{ width: '100%', mt: 0 }}>
+          <Grid container xs={12} spacing={3}>
+            {locationid !== 0 && (
+              <Grid item xs={12}>
+                <Box display="flex" alignItems="center" sx={{}}>
+                  <TextField
+                    label={'Pickup Location'}
+                    fullWidth
+                    value={`${pickCust?.locationname}  (${pickCust?.address})`}
+                    InputProps={{
+                      readOnly: true,
+                      style: { fontSize: '1rem', fontWeight: 'bold', color: theme.palette.primary.main }
+                    }}
+                  />
+                </Box>
+              </Grid>
+            )}
+            {/* ================================================= || Time || ================================================= */}
+
+            <Fragment>
+              <Grid item xs={6}>
+                <Stack>
+                  <LocalizationProvider dateAdapter={AdapterDayjs} sx={{}}>
+                    <DatePicker
+                      format="DD-MM-YYYY"
+                      onChange={(e) => {
+                        setStartdate(e);
+                        let dateres11 = dayjs().diff(dayjs(`${dayjs(e).format('YYYY-MM-DD')}`), 'd');
+                        console.log('dateres11');
+                        console.log(dateres11);
+                        setSelectedtime('');
+                        if (dateres11 <= 0) {
+                          console.log('startdate', e);
+                          setStartdate(e);
+
+                          let arr = [];
+                          timeslotarr.map((val) => {
+                            if (dayjs().diff(dayjs(`${dayjs(e).format('MM-DD-YYYY')} ${dayjs(val).format('HH:mm:ss')}`), 'm') <= 0) {
+                              arr.push(val);
+                            }
+                          });
+                        } else {
+                          setAlertmessage('choose Upcoming Date');
+                          opentoast('choose Upcoming Date', 'warning');
+                          setStartdate(NaN);
+                        }
+                      }}
+                      value={dayjs(startdate)}
+                      sx={{ width: 'auto', mt: 0 }}
+                      disablePast
+                    />
+                  </LocalizationProvider>
+                </Stack>
+                {/* {timeslotarr.length > 0 && (
+                    <MainCard sx={{ mt: 2 }}>
+                      <Grid container>
+                        <Grid item xs={12} sx={{}}>
+                          <Stack
+                            display={'flex'}
+                            flexDirection={'row'}
+                            alignItems={'center'}
+                            justifyContent={'space-between'}
+                            sx={{ width: '100%' }}
+                          >
+                            <Stack>
+                              <Typography variant="h5" sx={{ my: 2 }}>
+                                Time
+                              </Typography>
+                            </Stack>
+
+                            <Stack>
+                              <LocalizationProvider dateAdapter={AdapterDayjs} sx={{}}>
+                                <DatePicker
+                                  format="DD-MM-YYYY"
+                                  onChange={(e) => {
+                                    setStartdate(e);
+                                    let dateres11 = dayjs().diff(dayjs(`${dayjs(e).format('YYYY-MM-DD')}`), 'd');
+                                    console.log('dateres11');
+                                    console.log(dateres11);
+                                    setSelectedtime('');
+                                    if (dateres11 <= 0) {
+                                      console.log('startdate', e);
+                                      setStartdate(e);
+
+                                      let arr = [];
+                                      timeslotarr.map((val) => {
+                                        if (
+                                          dayjs().diff(dayjs(`${dayjs(e).format('MM-DD-YYYY')} ${dayjs(val).format('HH:mm:ss')}`), 'm') <= 0
+                                        ) {
+                                          arr.push(val);
+                                        }
+                                      });
+                                    } else {
+                                      setAlertmessage('choose Upcoming Date');
+                                      opentoast('choose Upcoming Date', 'warning');
+                                      setStartdate(NaN);
+                                    }
+                                  }}
+                                  value={dayjs(startdate)}
+                                  sx={{ width: 'auto', mt: 0 }}
+                                  disablePast
+                                />
+                              </LocalizationProvider>
+                            </Stack>
+                          </Stack>
+
+                          <MainCard
+                            sx={{
+                              mt: 1,
+                              overflowY: 'scroll',
+                              '&::-webkit-scrollbar': {
+                                width: '3px', // Width of vertical scrollbar
+                                height: '10px' // Height of horizontal scrollbar
+                              },
+                              '&::-webkit-scrollbar-thumb': {
+                                backgroundColor: '#65387A' // Color of the scrollbar thumb
+                              }
+                            }}
+                          >
+                            <Grid container spacing={2}>
+                              {timeslotarr.map((val, index) => {
+                                if (
+                                  dayjs().diff(dayjs(`${dayjs(startdate).format('MM-DD-YYYY')} ${dayjs(val).format('HH:mm:ss')}`), 'm') <= 0
+                                ) {
+                                  return (
+                                    <Fragment key={index}>
+                                      <Grid item>
+                                        <Chip
+                                          key={index}
+                                          sx={{ cursor: 'pointer' }}
+                                          color={dayjs(selectedtime).format('HH:mm') == dayjs(val).format('HH:mm') ? 'primary' : 'default'}
+                                          label={dayjs(val).format('hh:mm A')}
+                                          onClick={() => {
+                                            console.log('selectedtime', val);
+                                            setSelectedtime(val);
+                                          }}
+                                          // onClick={() => {
+                                          //   if (distance > appLocaRadius) {
+                                          //     setOpen(true);
+                                          //   } else if (showDistance) {
+                                          //     console.log('selectedtime', val);
+                                          //     setSelectedtime(val);
+                                          //   } else {
+                                          //     opentoast('Out of city limit', 'error');
+                                          //   }
+                                          // }}
+                                        />
+                                      </Grid>
+                                    </Fragment>
+                                  );
+                                }
+                              })}
+                            </Grid>
+                          </MainCard>
+                        </Grid>
+                      </Grid>
+                    </MainCard>
+                  )} */}
+              </Grid>
+              <Grid item xs={6}>
+                <Autocomplete
+                  options={pickupSlotsList || []}
+                  onChange={(e, newValue, reason) => {
+                    if (reason === 'clear') {
+                      setSelectedtime(null);
+                      setPickupSlot(null);
+                    } else {
+                      // Convert to AM/PM and merge with date
+                      const formattedTime = dayjs(newValue.time, 'HH:mm').format('hh:mm A');
+                      setSelectedtime(formattedTime);
+                      const finalDateTime = dayjs(`${startdate} ${formattedTime}`, 'MM-DD-YYYY hh:mm A').format('YYYY-MM-DD hh:mm A');
+                      setPickupSlot(finalDateTime);
+                    }
+                  }}
+                  getOptionLabel={(option) => `${option.name} (${dayjs(option.time, 'HH:mm').format('hh:mm A')})`}
+                  renderInput={(params) => <TextField {...params} placeholder="Select Pickup Slot" />}
+                />
+              </Grid>
+            </Fragment>
+          </Grid>
+        </Grid>
+
+        {/* ===================================================== || Drop  || ===================================================== */}
+
+        <Grid item xs={12} sx={{ width: '100%', mt: 0 }}>
+          <MainCard
+            sx={{ height: '100%' }}
+            title={
+              <Stack direction="row" spacing={1} alignItems="center" justifyContent="space-between" flexWrap="wrap" sx={{ mr: 1 }}>
+                <Typography variant="h5" sx={{ p: 3, whiteSpace: 'nowrap' }}>
+                  Drop ({dropCust?.length || 0})
+                </Typography>
+                <Stack direction="row" gap={2} alignItems="center" justifyContent="flex-end" flexWrap="wrap" sx={{ m: 3 }}>
+                  {/* ================= Upload CSV ================= */}
+                  {uploadType === 0 && (
+                    <>
+                      {fileName && (
+                        <Stack direction={'row'} spacing={1}>
+                          <FileAddOutlined />
+                          <Typography variant="body2" color="text.secondary">
+                            {fileName}
+                          </Typography>
+                        </Stack>
+                      )}
+
+                      <input
+                        accept=".csv, application/vnd.ms-excel, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
+                        id="upload-file"
+                        type="file"
+                        hidden
+                        onChange={onFileChange}
+                      />
+
+                      <label htmlFor="upload-file">
+                        <Button variant="contained" size="small" component="span" sx={{ minHeight: 36 }}>
+                          {dropCust?.length > 0 ? 'Add More Files' : ' Upload CSV'}
+                        </Button>
+                      </label>
+                    </>
+                  )}
+
+                  {/* ================= Continue ================= */}
+                  {users.length >= 1 && uploadType === 0 && (
+                    <Button
+                      variant="contained"
+                      size="small"
+                      color="warning"
+                      sx={{
+                        minHeight: 36,
+                        ...(!dropCust?.length && {
+                          '@keyframes blink': {
+                            '0%': { opacity: 1 },
+                            '50%': { opacity: 0.3 },
+                            '100%': { opacity: 1 }
+                          },
+                          animation: 'blink 1s infinite'
+                        })
+                      }}
+                      onClick={() => {
+                        users.forEach((customer) => handleCheckboxChange1(customer));
+                      }}
+                    >
+                      Continue
+                    </Button>
+                  )}
+
+                  {/* ================= Select Customers ================= */}
+                  {uploadType === 1 && (
+                    <Button
+                      variant="outlined"
+                      size="small"
+                      sx={{ minHeight: 36 }}
+                      onClick={() => {
+                        setIsCustomerOpen(true);
+                        setSearchCustList('');
+                      }}
+                    >
+                      Select Customers
+                    </Button>
+                  )}
+
+                  {/* ================= Upload Type ================= */}
+                  <Stack sx={{ bgcolor: 'secondary.lighter', py: 0.5, px: 1, borderRadius: 2 }}>
+                    <FormControl size="small">
+                      <FormLabel sx={{ fontSize: 12 }}>Upload Type</FormLabel>
+                      <RadioGroup
+                        row
+                        value={uploadType}
+                        onChange={(e) => {
+                          if (!locationid) {
+                            OpenToast('Please select  Business Location!', 'warning', 3000);
+                            return;
+                          }
+                          setUploadType(Number(e.target.value));
+                          setDropCust([]);
+                          setUsers([]);
+                          setFileName('');
+                        }}
+                      >
+                        <FormControlLabel value={0} control={<Radio size="small" />} label="Excel / CSV" />
+                        <FormControlLabel value={1} control={<Radio size="small" />} label="Selection" />
+                      </RadioGroup>
+                    </FormControl>
+                  </Stack>
+                </Stack>
+              </Stack>
+            }
+          >
+            <TableContainer component={Paper}>
+              <Table>
+                {dropCust?.length > 0 ? (
+                  <>
+                    <TableHead>
+                      <TableRow>
+                        <TableCell>S.No</TableCell>
+                        <TableCell>Customer</TableCell>
+                        <TableCell>Address</TableCell>
+                        <TableCell align={uploadType == 0 ? 'right' : 'center'}>Quantity</TableCell>
+
+                        <TableCell sx={{ whiteSpace: 'nowrap' }} align={uploadType == 0 ? 'right' : 'center'}>
+                          Cash Collect
+                        </TableCell>
+                        <TableCell>Kms</TableCell>
+
+                        <TableCell align="right">Charge</TableCell>
+                        <TableCell align="center">Action</TableCell>
+                      </TableRow>
+                    </TableHead>
+
+                    <TableBody>
+                      {dropCust?.map((customer, index) => (
+                        <TableRow key={index}>
+                          <TableCell>{index + 1}</TableCell>
+                          <TableCell sx={{ whiteSpace: 'nowrap' }}>{customer.firstname}</TableCell>
+                          <TableCell>{customer.address}</TableCell>
+                          <TableCell align="center">
+                            {uploadType == 0 ? (
+                              <Typography>{customer.quantity}</Typography>
+                            ) : (
+                              <TextField
+                                size="small"
+                                type="number"
+                                value={customer.quantity}
+                                onChange={(e) => handleQuantityChange(customer.customerid, e.target.value)}
+                                inputProps={{ min: 0 }}
+                              />
+                            )}
+                          </TableCell>
+                          <TableCell align="center">
+                            {uploadType == 0 ? (
+                              <Typography>₹{Number(customer.collectionamt || 0).toFixed(2)}</Typography>
+                            ) : (
+                              <TextField
+                                size="small"
+                                type="number"
+                                value={customer.collectionamt ? customer.collectionamt : ''}
+                                placeholder="0"
+                                onChange={(e) => {
+                                  if (e.target.value <= 0) {
+                                    handleCollectionAmtChange(customer.customerid, 0);
+                                  } else {
+                                    handleCollectionAmtChange(customer.customerid, e.target.value);
+                                  }
+                                }}
+                                inputProps={{ min: 0 }}
+                                InputProps={{
+                                  startAdornment: <InputAdornment position="start">₹</InputAdornment>
+                                }}
+                              />
+                            )}
+                          </TableCell>
+
+                          <TableCell>{customer.distance}</TableCell>
+                          <TableCell align="right">{`₹${customer?.totalcharge?.toFixed(2)}`}</TableCell>
+                          <TableCell align="center">
+                            {
+                              <>
+                                <CloseOutlined
+                                  style={{ cursor: 'pointer', color: 'red' }}
+                                  // onClick={(event) => handleCheckboxChange(event, customer)}
+                                  onClick={() => handleCheckboxChange1(customer)}
+                                />
+                              </>
+                            }
+                          </TableCell>
+                        </TableRow>
+                      ))}
+                      {dropCust?.length != 0 && (
+                        <TableRow>
+                          <TableCell>Total</TableCell>
+                          <TableCell colSpan={2}></TableCell>
+
+                          <TableCell>
+                            <Typography variant="h5" align="center">{`${totalQty} `}</Typography>
+                          </TableCell>
+
+                          <TableCell>
+                            <Typography align="center" variant="h5">{`${totalCash?.toFixed(2)} `}</Typography>
+                          </TableCell>
+                          <TableCell>
+                            <Typography variant="h5">{`${totaldist} `}</Typography>
+                          </TableCell>
+                          <TableCell align="right">
+                            <Typography align="right" variant="h5">{`₹${totalAmt?.toFixed(2)}`}</Typography>
+                          </TableCell>
+
+                          <TableCell></TableCell>
+                        </TableRow>
+                      )}
+                    </TableBody>
+                  </>
+                ) : (
+                  <Stack
+                    spacing={2}
+                    elevation={0}
+                    sx={{
+                      bgcolor: 'primary.lighter',
+                      border: 'none',
+                      p: 2.5,
+                      borderRadius: 1
+                    }}
+                  >
+                    {/* Header */}
+                    <Stack direction="row" alignItems="center" spacing={1}>
+                      <ExclamationCircleOutlined style={{ color: 'red', fontSize: 18 }} />{' '}
+                      <Typography variant="h5" sx={{ fontWeight: 600, color: 'red' }}>
+                        Important Instructions
+                      </Typography>
+                    </Stack>
+
+                    {/* Ordered List */}
+                    <Stack elevation={0} component="ol" sx={{ pl: 4, m: 0 }}>
+                      <Typography component="li" sx={{ fontSize: 15, mb: 1 }}>
+                        Choose either <b>Upload Type</b> to upload CSV/Excel files, or
+                        <b> Selection Type</b> to select from saved customers.
+                      </Typography>
+
+                      <Typography component="li" sx={{ fontSize: 15, mb: 1 }}>
+                        Uploaded CSV or Excel files must follow the required format and contain the correct column names.
+                      </Typography>
+
+                      <Typography component="li" sx={{ fontSize: 15, mb: 1 }}>
+                        Multiple files can be uploaded, but only <b>one file at a time</b>.
+                      </Typography>
+
+                      <Typography component="li" sx={{ fontSize: 15, color: 'error.main' }}>
+                        Invalid or incorrectly formatted files will not be processed.
+                      </Typography>
+                    </Stack>
+                  </Stack>
+                )}
+              </Table>
+            </TableContainer>
+          </MainCard>
+        </Grid>
+
+        <Grid item xs={12} sx={{ width: '100%', mt: -2 }}>
+          {/* ================================================= || Notes || ================================================= */}
+          <MainCard sx={{ mt: 2, p: 3 }} title={'Notes'}>
+            <Grid container>
+              <Grid item xs={12}>
+                <TextField
+                  focused
+                  id="outlined-multiline-static"
+                  sx={{ width: '100%', height: '100%', mb: 2 }}
+                  multiline
+                  rows={1}
+                  placeholder="Notes"
+                  value={otherinstructions}
+                  onChange={(e) => setOtherinstructions(e.target.value)}
+                />
+              </Grid>
+              <Stack direction="row" justifyContent={'end'} sx={{ mt: 2, width: '100%' }}>
+                <Button
+                  //   disabled={dropCust.length == 0 || !pickupSlot}
+                  disabled={dropCust.length == 0}
+                  size="medium"
+                  variant="outlined"
+                  onClick={() => {
+                    setLoading(true);
+                    setBtnLoading(true);
+                    createorders();
+                  }}
+                  sx={{
+                    '&:hover': {
+                      transform: 'scale(1.05)',
+                      transition: 'transform 0.3s ease'
+                    }
+                  }}
+                >
+                  {btnLoading ? <CircularProgress color="primary" size={20} thickness={10} /> : 'Create'}
+                </Button>
+              </Stack>
+            </Grid>
+          </MainCard>
+        </Grid>
+      </Grid>
+      {/* ============================================= || saved address Dialog || ============================================= */}
+      <Dialog
+        open={isCustomerOpen}
+        onClose={() => {
+          setIsCustomerOpen(false);
+        }}
+        fullWidth
+        sx={{ minWidth: 'lg' }}
+      >
+        <DialogTitle sx={{ bgcolor: theme.palette.primary.main, color: 'white' }}>
+          <Stack>
+            <Typography variant="h4"> {`Select Drop Customers (${dropCust.length || 0})`}</Typography>
+            <FormControl
+              sx={{
+                width: '100%',
+                mt: 1
+              }}
+            >
+              <Stack spacing={2} sx={{ py: 0.2 }}>
+                <OutlinedInput
+                  fullWidth
+                  id="input-search-header"
+                  placeholder="Search"
+                  value={searchCustList}
+                  onChange={(e) => setSearchCustList(e.target.value)}
+                  sx={{
+                    '& .MuiOutlinedInput-input': {
+                      p: '10.5px 0px 12px'
+                    },
+                    bgcolor: 'white'
+                  }}
+                  startAdornment={
+                    <InputAdornment position="start">
+                      <SearchOutlined style={{ fontSize: 'small' }} />
+                    </InputAdornment>
+                  }
+                  endAdornment={
+                    <IconButton
+                      sx={{ visibility: searchCustList ? 'visible' : 'hidden' }}
+                      onClick={() => {
+                        setSearchCustList('');
+                      }}
+                    >
+                      <ClearIcon />
+                    </IconButton>
+                  }
+                  autoComplete="off"
+                />
+              </Stack>
+            </FormControl>
+          </Stack>
+        </DialogTitle>
+        <Divider />
+        <DialogContent sx={{ p: 2.5 }}>
+          {customerlist?.length == 0 ? (
+            <Stack spacing={2} direction={'row'} alignItems={'center'} justifyContent={'center'} sx={{ minHeight: 600, maxHeight: 600 }}>
+              <Empty />
+            </Stack>
+          ) : (
+            <Stack spacing={2} sx={{ minHeight: 600, maxHeight: 600 }}>
+              {customerlist &&
+                customerlist?.map((customer, index) => (
+                  <FormGroup key={index}>
+                    <FormControlLabel
+                      control={
+                        <Checkbox
+                          checked={dropCust.some((cust) => cust.customerid === customer.customerid)} // Set the checked state of the checkbox based on whether the customer is in `dropCust`
+                          onChange={(event) => handleCheckboxChange(event, customer)}
+                        />
+                      }
+                      label={
+                        <div style={{ width: '100%' }}>
+                          <Typography variant="subtitle1" sx={{ textAlign: 'left' }}>
+                            {`${customer.firstname} (${customer.contactno})`}
+                          </Typography>
+
+                          <Typography variant="body2" color="secondary" sx={{ textAlign: 'left' }}>
+                            {customer.address}
+                          </Typography>
+                        </div>
+                      }
+                    />
+                  </FormGroup>
+                ))}
+            </Stack>
+          )}
+        </DialogContent>
+        <Divider />
+        <DialogActions sx={{ p: 2.5 }}>
+          <Button
+            color={dropCust.length == 0 ? 'error' : 'primary'}
+            variant="outlined"
+            sx={{
+              '&:hover': {
+                bgcolor: dropCust.length == 0 ? 'red' : theme.palette.primary.main,
+                color: 'white'
+              }
+            }}
+            onClick={() => {
+              setIsCustomerOpen(false);
+            }}
+          >
+            {dropCust.length == 0 ? 'Close' : 'Continue'}
+          </Button>
+        </DialogActions>
+      </Dialog>
+    </>
+  );
+};
+
+export default MultipleOrders;
diff --git a/src/pages/nearle/orders/multipleOrders.js b/src/pages/nearle/orders/multipleOrders.js
index 6a8c6b8..668fd53 100644
--- a/src/pages/nearle/orders/multipleOrders.js
+++ b/src/pages/nearle/orders/multipleOrders.js
@@ -71,7 +71,7 @@ const MultipleOrders = () => {
   const [appId, setAppId] = useState(0);
   const [tenantLocations, setTenantlocations] = useState([]);
   //   const [tenantid, setTenantid] = useState(0);
-  const tenantid = localStorage.getItem('tenantid') || 0;
+  const tenantid = localStorage.getItem('tenantid');
   const [locationid, setLocationid] = useState(0);
   const [basePrice, setBasePrice] = useState(0);
   const [pricePerKm, setPricePerKm] = useState(0);
@@ -193,6 +193,9 @@ const MultipleOrders = () => {
       console.log('fetchTenantPricing error', error);
     }
   };
+  useEffect(() => {
+    fetchTenantPricing(tenantid);
+  }, [tenantid]);
   // ============================================= || gettenantlocations (branches) || =============================================
   const gettenantlocations = async (id) => {
     try {
@@ -989,83 +992,74 @@ const MultipleOrders = () => {
           spacing: 5
         }}
       >
-        {/* ===================================================== ||Business Location || ===================================================== */}
         <Grid item xs={12} sx={{ width: '100%', mt: -1 }}>
-          <Stack
-            direction={{ xs: 'column', sm: 'row' }}
-            spacing={2}
-            sx={{
-              width: '100%',
-              alignItems: { xs: 'stretch', sm: 'center' },
-              justifyContent: 'space-between',
-              mb: 2
-            }}
-          >
-            <Typography variant="h3">Create Multiple Order</Typography>
-
-            <Stack sx={{ width: { xs: '100%', sm: 400 } }}>
-              {tenantLocations?.length === 1 ? (
-                <TextField
-                  variant="outlined"
-                  fullWidth
-                  label="Business Location"
-                  value={tenantLocations[0]?.locationname || ''}
-                  focused
-                  InputProps={{
-                    style: {
-                      color: theme.palette.primary.main
-                    },
-                    startAdornment: (
-                      <InputAdornment position="start">
-                        <MyLocationIcon color="primary" />
-                      </InputAdornment>
-                    )
-                  }}
-                />
-              ) : (
-                <Autocomplete
-                  fullWidth
-                  options={tenantLocations || []}
-                  getOptionLabel={(option) => `${option.locationname} (${option.suburb})`}
-                  value={locationValue}
-                  onOpen={(event) => {
-                    if (!appId && !tenantid) {
-                      event.preventDefault();
-
-                      OpenToast('Please select Location and Tenant first!', 'warning', 3000);
-
-                      setTimeout(() => {
-                        locationRef.current?.focus();
-                      }, 0);
-                    } else if (!tenantid) {
-                      event.preventDefault();
-
-                      OpenToast('Please select Tenant first!', 'warning', 3000);
-
-                      setTimeout(() => {
-                        tenantRef.current?.focus();
-                      }, 0);
-                    }
-                  }}
-                  onChange={(event, value, reason) => {
-                    if (reason === 'clear') {
-                      setLocationid(0);
-                      setLocationValue(null);
-                      setPickCust(null);
-                    } else {
-                      setLocationid(value?.locationid || 0);
-                      setLocationValue(value);
-                      setPickCust(value);
-                      setPickupSlotsList(value?.slots);
-                    }
-                  }}
-                  renderInput={(params) => <TextField {...params} label="Select Business Location" color="primary" />}
-                />
-              )}
-            </Stack>
+          <Stack>
+            <Typography variant="h3"> Create Multiple Order</Typography>
           </Stack>
         </Grid>
+        <Grid item xs={12} sx={{ width: '100%', mt: -2 }}>
+          <MainCard sx={{ height: '100%' }}>
+            <Grid container spacing={3} sx={{}}>
+              {/* ===================================================== || Choose  App location  || ===================================================== */}
 
+              {/* ===================================================== ||Business Location || ===================================================== */}
+              <Grid item xs={12} sm={4}>
+                {tenantLocations?.length == 1 ? (
+                  <TextField
+                    variant="outlined"
+                    fullWidth
+                    label={'Business Location'}
+                    value={tenantLocations[0]?.locationname || ''}
+                    focused
+                    InputProps={{
+                      style: { color: theme.palette.primary.main },
+                      startAdornment: (
+                        <InputAdornment position="start">
+                          <MyLocationIcon color="primary" />
+                        </InputAdornment>
+                      )
+                    }}
+                  />
+                ) : (
+                  <Autocomplete
+                    fullWidth
+                    options={tenantLocations || []}
+                    getOptionLabel={(option) => `${option.locationname} (${option.suburb})` || ''}
+                    value={locationValue}
+                    onOpen={(event) => {
+                      if (!appId && !tenantid) {
+                        event.preventDefault();
+                        OpenToast('Please select Location and Tenant first!', 'warning', 3000);
+                        setTimeout(() => {
+                          locationRef.current?.focus();
+                        }, 0);
+                      } else if (!tenantid) {
+                        event.preventDefault();
+                        OpenToast('Please select   Tenant first!', 'warning', 3000);
+                        setTimeout(() => {
+                          tenantRef.current?.focus();
+                        }, 0);
+                      }
+                    }}
+                    onChange={(event, value, reason) => {
+                      if (reason === 'clear') {
+                        setLocationid(0);
+                        setLocationValue(null);
+                        setPickCust(null);
+                      } else {
+                        setLocationid(value.locationid || 0);
+                        setLocationValue(value);
+                        setPickCust(value);
+                        setPickupSlotsList(value?.slots);
+                      }
+                    }}
+                    renderInput={(params) => <TextField {...params} label="Select Business Locations" color="primary" />}
+                  />
+                )}
+              </Grid>
+            </Grid>
+          </MainCard>
+        </Grid>
         {/* ===================================================== || Pickup || ===================================================== */}
         <Grid item xs={12} sx={{ width: '100%', mt: 0 }}>
           <Grid container xs={12} spacing={3}>
@@ -1337,7 +1331,7 @@ const MultipleOrders = () => {
                         value={uploadType}
                         onChange={(e) => {
                           if (!locationid) {
-                            OpenToast('Please select  Business Location!', 'warning', 3000);
+                            OpenToast('Please select Business Location !', 'warning', 3000);
                             return;
                           }
                           setUploadType(Number(e.target.value));
@@ -1521,8 +1515,7 @@ const MultipleOrders = () => {
               </Grid>
               <Stack direction="row" justifyContent={'end'} sx={{ mt: 2, width: '100%' }}>
                 <Button
-                  //   disabled={dropCust.length == 0 || !pickupSlot}
-                  disabled={dropCust.length == 0}
+                  disabled={dropCust.length == 0 || !pickupSlot}
                   size="medium"
                   variant="outlined"
                   onClick={() => {