completed ui

This commit is contained in:
sanaya 2022-02-03 14:35:24 +05:30
parent caeace5f25
commit edf47fd1bd
4 changed files with 331 additions and 0 deletions

View File

@ -0,0 +1,128 @@
import React from 'react';
import {
CButton,
CCard,
CCardBody,
CCardGroup,
CCol,
CContainer,
CForm,
CFormInput,
CFormSelect,
CInputGroup,
CInputGroupText,
CRow,
} from '@coreui/react'
import CIcon from '@coreui/icons-react'
import { cil3d, cilAirplaneMode, cilGlobeAlt, cilLocationPin, cilLockLocked, cilPeople, cilUser } from '@coreui/icons'
const AddAirwaysBill = () => {
return <div className="bg-light min-vh-100 d-flex flex-row align-items-start">
<CContainer>
<CRow className="justify-content-start">
<CCol md={8}>
<CForm>
<h1>Add New Bill</h1>
<p className="text-medium-emphasis">Fill the fields and submit to add a new bill</p>
<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>
</CRow>
<CRow className='flex-row align-items-center'>
<CCol md={2} ><h4>Date:</h4></CCol>
<CCol><h6>11/11/11</h6></CCol>
<p className="text-medium-emphasis">(auto-generated)</p>
</CRow>
<CInputGroup className="mb-3">
<CInputGroupText>
<CIcon icon={cilUser} />
</CInputGroupText>
<CFormSelect
aria-label="Default select example"
options={[
'Select Vendor',
{ label: 'One', value: '1' },
{ label: 'Two', value: '2' },
{ label: 'Three', value: '3', disabled: true }
]}
/>
</CInputGroup>
<CInputGroup className="mb-3">
<CInputGroupText>
<CIcon icon={cilLocationPin} />
</CInputGroupText>
<CFormInput
type="text"
placeholder="Address Line 1"
// autoComplete="address"
/>
<CFormInput
type="text"
placeholder="Address Line 2(area)"
autoComplete="address2"
/>
</CInputGroup>
<CInputGroup className="mb-3">
<CInputGroupText>
<CIcon icon={cilPeople} />
</CInputGroupText>
<CFormInput
type="text"
placeholder="To (Name)"
autoComplete="toname"
/>
</CInputGroup>
<CInputGroup className="mb-3">
<CInputGroupText>
<CIcon icon={cilLocationPin} />
</CInputGroupText>
<CFormInput
type="text"
placeholder="Address Line 1"
// autoComplete="address"
/>
<CFormInput
type="text"
placeholder="Address Line 2(area)"
autoComplete="address2"
/>
</CInputGroup>
<CInputGroup className="mb-3">
<CInputGroupText>
<CIcon icon={cil3d} />
</CInputGroupText>
<CFormSelect
aria-label="Default select example"
options={[
'Select Courier',
{ label: 'One', value: '1' },
{ label: 'Two', value: '2' },
{ label: 'Three', value: '3', disabled: true }
]}
/></CInputGroup>
<CInputGroup className="mb-3">
<CInputGroupText>
<CIcon icon={cilAirplaneMode} />
</CInputGroupText>
<CFormInput
type="text"
placeholder="AWB"
autoComplete="AWB"
/>
</CInputGroup>
<CButton color="dark" className="px-4">
Submit
</CButton>
</CForm>
</CCol>
</CRow>
</CContainer>
</div>;;
};
export default AddAirwaysBill;

View File

@ -0,0 +1,60 @@
import React from 'react';
import {
CAvatar,
CButton,
CButtonGroup,
CCard,
CCardBody,
CCardFooter,
CCardHeader,
CCol,
CContainer,
CProgress,
CRow,
CTable,
CTableBody,
CTableDataCell,
CTableHead,
CTableHeaderCell,
CTableRow,
} from '@coreui/react'
import { Link } from 'react-router-dom';
const AirwaysBill = () => {
return <div>
<CButton color="dark">+ Upload Spreadsheet</CButton>
<Link to='/addairwaysbill'>
<CButton className='ms-3' color="dark">+Add New Entry</CButton>
</Link>
<hr />
<CTable striped hover>
<CTableHead>
<CTableRow>
<CTableHeaderCell scope="col">ID</CTableHeaderCell>
<CTableHeaderCell scope="col">Vendor</CTableHeaderCell>
<CTableHeaderCell scope="col">Date</CTableHeaderCell>
<CTableHeaderCell scope="col">To (Name)</CTableHeaderCell>
<CTableHeaderCell scope="col">AWB</CTableHeaderCell>
<CTableHeaderCell scope="col">Action</CTableHeaderCell>
</CTableRow>
</CTableHead>
<CTableBody>
<CTableRow>
<CTableHeaderCell scope="row">Mark</CTableHeaderCell>
<CTableDataCell>123</CTableDataCell>
<CTableDataCell>Otto</CTableDataCell>
<CTableDataCell>123</CTableDataCell>
<CTableDataCell>Otto</CTableDataCell>
<CTableDataCell>
<CButtonGroup role="group" aria-label="Basic mixed styles example">
<CButton color="success">View</CButton>
</CButtonGroup>
</CTableDataCell>
</CTableRow>
</CTableBody>
</CTable></div>;
};
export default AirwaysBill;

View File

@ -0,0 +1,59 @@
import React from 'react';
import {
CButton,
CCard,
CCardBody,
CCardGroup,
CCol,
CContainer,
CForm,
CFormInput,
CInputGroup,
CInputGroupText,
CRow,
} from '@coreui/react'
import CIcon from '@coreui/icons-react'
import { cil3d } from '@coreui/icons'
const AddCourier = () => {
return <div className="bg-light min-vh-100 d-flex flex-row align-items-start">
<CContainer>
<CRow className="justify-content-start">
<CCol md={8}>
<CForm>
<h1>Add New Courier</h1>
<p className="text-medium-emphasis">Fill the fields and submit to add a new vendor</p>
<CRow className=' flex-row align-items-center'>
<CCol md={2} ><h5>Unique ID:</h5></CCol>
<CCol><h6>5324756898</h6></CCol>
<p className="text-medium-emphasis">(auto-generated)</p>
</CRow>
<CRow className=' flex-row align-items-center'>
<CCol md={2} ><h5>Added On:</h5></CCol>
<CCol><h6>5324756898</h6></CCol>
<p className="text-medium-emphasis">(auto-generated)</p>
</CRow>
<CInputGroup className="mb-3">
<CInputGroupText>
<CIcon icon={cil3d} />
</CInputGroupText>
<CFormInput
type="text"
placeholder="Courier Name"
autoComplete="courier"
/>
</CInputGroup>
<CButton color="dark" className="px-4">
Submit
</CButton>
</CForm>
</CCol>
</CRow>
</CContainer>
</div>;
};
export default AddCourier;

84
src/views/Vendor/AddVendor.js vendored Normal file
View File

@ -0,0 +1,84 @@
import React from 'react';
import {
CButton,
CCard,
CCardBody,
CCardGroup,
CCol,
CContainer,
CForm,
CFormInput,
CInputGroup,
CInputGroupText,
CRow,
} from '@coreui/react'
import CIcon from '@coreui/icons-react'
import { cilGlobeAlt, cilLocationPin, cilLockLocked, cilUser } from '@coreui/icons'
import { Link } from 'react-router-dom';
const AddVendor = () => {
return <div className="bg-light min-vh-100 d-flex flex-row align-items-start">
<CContainer>
<CRow className="justify-content-start">
<CCol md={8}>
<CForm>
<h1>Add New Vendor</h1>
<p className="text-medium-emphasis">Fill the fields and submit to add a new vendor</p>
<CRow className=' flex-row align-items-center'>
<CCol md={2} ><h4>Code:</h4></CCol>
<CCol><h6>5324756898</h6></CCol>
<p className="text-medium-emphasis">(auto-generated)</p>
</CRow>
<CInputGroup className="mb-3">
<CInputGroupText>
<CIcon icon={cilUser} />
</CInputGroupText>
<CFormInput placeholder="Vendor Name" autoComplete="vendorname" />
</CInputGroup>
<CInputGroup className="mb-3">
<CInputGroupText>
<CIcon icon={cilLocationPin} />
</CInputGroupText>
<CFormInput
type="text"
placeholder="Address Line 1"
// autoComplete="address"
/>
<CFormInput
type="text"
placeholder="Address Line 2(area)"
autoComplete="address2"
/>
</CInputGroup>
<CInputGroup className="mb-3">
<CInputGroupText>
<CIcon icon={cilGlobeAlt} />
</CInputGroupText>
<CFormInput
type="text"
placeholder="Country"
autoComplete="country"
/>
<CFormInput
type="text"
placeholder="State"
autoComplete="state"
/>
<CFormInput
type="text"
placeholder="City"
autoComplete="city"
/>
</CInputGroup>
<CButton color="dark" className="px-4">
Submit
</CButton>
</CForm>
</CCol>
</CRow>
</CContainer>
</div>;
};
export default AddVendor;