vendors and courier completed

src/routes.js

@@ -8,6 +8,7 @@ const EditCourier = React.lazy(() => import('./views/Courier/EditCourier'))
 const AddCourier = React.lazy(() => import('./views/Courier/AddCourier'))
 const Register = React.lazy(() => import('./views/pages/register/Register'))
 const Vendor = React.lazy(() => import('./views/Vendor/Vendor'))
+const VendorDetail = React.lazy(() => import('./views/Vendor/VendorDetail'))
 const EditVendor = React.lazy(() => import('./views/Vendor/EditVendor'))
 const AddVendor = React.lazy(() => import('./views/Vendor/AddVendor'))
 
@@ -71,6 +72,7 @@ const routes = [
   { path: '/addairwaysbill', name: 'Airways Bill / Add New Entry', component: AddAirwaysBill },
   { path: '/vendors', name: 'Vendors', component: Vendor },
   { path: '/editvendor/:id', name: 'Edit Vendor', component: EditVendor },
+  { path: '/viewvendor/:id', name: 'View Vendor', component: VendorDetail },
   { path: '/addvendor', name: 'Vendors / Add New Vendor', component: AddVendor },
   { path: '/dashboard', name: 'Dashboard', component: Dashboard },
   { path: '/theme', name: 'Theme', component: Colors, exact: true },

src/views/AirwaysBill/AddAirwaysBill.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useEffect } from 'react';
 import {
     CButton,
     CCard,
@@ -15,9 +15,51 @@ import {
 } from '@coreui/react'
 import CIcon from '@coreui/icons-react'
 import { cil3d, cilAirplaneMode, cilGlobeAlt, cilLocationPin, cilLockLocked, cilPeople, cilUser } from '@coreui/icons'
+import { useState } from 'react';
+import axios from 'axios';
+import { isAutheticated } from 'src/auth';
 
 
 const AddAirwaysBill = () => {
+    const { token } = isAutheticated()
+    const [bill, setBill] = useState({
+        vendor_name: '',
+        city: '',
+        state: 'Andhra Pradesh',
+        country: 'India',
+        address_1: '',
+        address_2: '',
+
+    })
+    const [code, setCode] = useState()
+    useEffect(() => {
+        const generateCode = () => {
+            setCode(Math.round(Math.random() * 1000000000))
+        }
+        const getData = async () => {
+            const res = await axios.get('/api/vendor/view',
+                {
+                    headers: {
+                        "Access-Control-Allow-Origin": "*",
+                        "Content-type": "Application/json",
+                        "Authorization": `Bearer ${token}`
+                    }
+                })
+            console.log(res.data.Stores);
+        }
+        getData();
+        generateCode()
+    }, [])
+    const formatDate = () => {
+        let today = new Date();
+        let dd = String(today.getDate()).padStart(2, '0');
+        let mm = String(today.getMonth() + 1).padStart(2, '0'); //January is 0!
+        let yyyy = today.getFullYear();
+
+        today = dd + '/' + mm + '/' + yyyy;
+        return today
+    }
+
     return <div className="bg-light min-vh-100 d-flex flex-row align-items-start">
         <CContainer>
             <CRow className="justify-content-start">
@@ -28,12 +70,12 @@ const AddAirwaysBill = () => {
                         <CRow className='flex-row align-items-center'>
                             <CCol md={2} ><h4>ID:</h4></CCol>
                             <CCol><h6>5324756898</h6></CCol>
-                            <p className="text-medium-emphasis">(auto-generated)</p>
+                            {/* <p className="text-medium-emphasis">(auto-generated)</p> */}
                         </CRow>
                         <CRow className='flex-row align-items-center'>
                             <CCol md={2} ><h4>Date:</h4></CCol>
-                            <CCol><h6>11/11/11</h6></CCol>
+                            <CCol><h6>{formatDate()}</h6></CCol>
-                            <p className="text-medium-emphasis">(auto-generated)</p>
+                            {/* <p className="text-medium-emphasis">(auto-generated)</p> */}
                         </CRow>
                         <CInputGroup className="mb-3">
                             <CInputGroupText>

src/views/Courier/Courier.js

@@ -55,7 +55,8 @@ const Courier = () => {
                 confirmButtonColor: '#303c54',
                 iconColor: '#303c54'
             }).then(() => {
-                history.push('/courier');
+                // history.push('/courier');
+                location.reload();
             });
         } else {
             Swal("Oops!", "Something went wrong!", "error");

src/views/Vendor/AddVendor.js

@@ -99,7 +99,7 @@ const AddVendor = () => {
                         <CRow className=' flex-row align-items-center'>
                             <CCol md={2} ><h4>Code:</h4></CCol>
                             <CCol><h6>{code}</h6></CCol>
-                            <p className="text-medium-emphasis">(auto-generated)</p>
+                            {/* <p className="text-medium-emphasis">(auto-generated)</p> */}
                         </CRow>
                         <CInputGroup className="mb-3">
                             <CInputGroupText>

src/views/Vendor/Vendor.js

@@ -61,7 +61,8 @@ const Vendor = () => {
                 confirmButtonColor: '#303c54',
                 iconColor: '#303c54'
             }).then(() => {
-                history.push('/vendors');
+                // history.('/vendors');
+                location.reload();
             });
         } else {
             Swal("Oops!", "Something went wrong!", "error");
@@ -87,33 +88,12 @@ const Vendor = () => {
                 <td>{item.code}</td>
                 <td>{item.city}</td>
                 <td><CButtonGroup role="group" aria-label="Basic mixed styles example">
-                    <Link to={`/editvendor/${item._id}`}>
+                    <CButton color="warning" onClick={() => history.push(`/editvendor/${item._id}`)}>Edit</CButton>
-                        <CButton color="warning">Edit</CButton>
+                    <CButton color="success" onClick={() => history.push(`/viewvendor/${item._id}`)}>View</CButton>
-                    </Link>
-                    <CButton color="success" >View</CButton>
                     <CButton color="danger" onClick={() => handleDelete(item._id)}>Delete</CButton>
                 </CButtonGroup></td>
-            </tr>)}</tbody>
+            </tr>)}
-            {/* <CTableBody>
+            </tbody>
-                {data?.map(item => {
-
-                    <CTableRow>
-                        <h1>{item.city}</h1>
-                        <CTableHeaderCell scope="row">{item.vendor_name}</CTableHeaderCell>
-                        <CTableDataCell>{item.code}</CTableDataCell>
-                        <CTableDataCell>{item.city}</CTableDataCell>
-                        <CTableDataCell>
-                            <CButtonGroup role="group" aria-label="Basic mixed styles example">
-                                <CButton color="warning">Edit</CButton>
-                                <CButton color="success">View</CButton>
-                                <CButton color="danger">Delete</CButton>
-                            </CButtonGroup>
-                        </CTableDataCell>
-                    </CTableRow>
-                })}
-
-
-            </CTableBody> */}
         </CTable>
     </div>;
 };

src/views/Vendor/VendorDetail.js

@@ -0,0 +1,80 @@
+import React, { useEffect, useState } from 'react';
+import {
+    CTable,
+    CTableBody,
+    CTableDataCell,
+    CTableHead,
+    CTableHeaderCell,
+    CTableRow,
+} from '@coreui/react'
+import { useParams } from 'react-router-dom';
+import axios from 'axios';
+import { isAutheticated } from '../../auth';
+
+
+
+const VendorDetail = () => {
+    const [data, setData] = useState({});
+    const { id } = useParams()
+    const { token } = isAutheticated();
+
+    useEffect(() => {
+        const getData = async () => {
+            const res = await axios.get(`/api/vendor/view/${id}`, {
+                headers: {
+                    "Access-Control-Allow-Origin": "*",
+                    "Content-type": "Application/json",
+                    "Authorization": `Bearer ${token}`
+                }
+            });
+            if (res) {
+                setData(res?.data?.Store)
+            }
+
+        }
+        getData();
+    }, []);
+    console.log(data);
+    const formatDate = (date) => {
+        let today = new Date(date);
+        let dd = String(today.getDate()).padStart(2, '0');
+        let mm = String(today.getMonth() + 1).padStart(2, '0'); //January is 0!
+        let yyyy = today.getFullYear();
+
+        today = dd + '/' + mm + '/' + yyyy;
+        return today
+    }
+
+
+    return <div >
+        <h1>Vendor Details</h1>
+        <CTable color="dark" striped>
+            <CTableHead>
+                <CTableRow>
+                    <CTableHeaderCell scope="col">Unique ID</CTableHeaderCell>
+                    <CTableDataCell scope="col">{data._id}</CTableDataCell>
+                </CTableRow>
+            </CTableHead>
+            <CTableBody>
+                <CTableRow>
+                    <CTableHeaderCell scope="col">Code</CTableHeaderCell>
+                    <CTableDataCell scope="col">{data.code}</CTableDataCell>
+                </CTableRow>
+                <CTableRow>
+                    <CTableHeaderCell scope="row">Vendor Name</CTableHeaderCell>
+                    <CTableDataCell>{data.vendor_name}</CTableDataCell>
+                </CTableRow>
+                <CTableRow>
+                    <CTableHeaderCell scope="row">Added On</CTableHeaderCell>
+                    <CTableDataCell>{formatDate(data.createdAt)}</CTableDataCell>
+                </CTableRow>
+                <CTableRow>
+                    <CTableHeaderCell scope="row">Address</CTableHeaderCell>
+                    <CTableDataCell>{data.address_1},{data.address_2},{data.city},{data.state},{data.country}</CTableDataCell>
+                </CTableRow>
+            </CTableBody>
+        </CTable>
+    </div>;
+};
+
+export default VendorDetail;