init
This commit is contained in:
@@ -0,0 +1,165 @@
|
||||
import React from 'react'
|
||||
|
||||
function InvoiceKPI({num}) {
|
||||
|
||||
|
||||
return (
|
||||
|
||||
<div className="card">
|
||||
<div className="card-header">
|
||||
<h4 className="card-title">Previous Invoices</h4>
|
||||
</div>
|
||||
<div className="card-body">
|
||||
|
||||
<div className="invoice-table">
|
||||
<div className="table-responsive">
|
||||
<table className="table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>
|
||||
<div className="form-check">
|
||||
<input
|
||||
className="form-check-input"
|
||||
type="checkbox"
|
||||
value=""
|
||||
id="flexCheckDefault"
|
||||
/>
|
||||
</div>
|
||||
</th>
|
||||
<th>Client</th>
|
||||
<th>Amount</th>
|
||||
<th>Status</th>
|
||||
<th>Due</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>
|
||||
<div className="form-check">
|
||||
<input
|
||||
className="form-check-input"
|
||||
type="checkbox"
|
||||
value=""
|
||||
id="flexCheckDefault"
|
||||
/>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<img
|
||||
src="/images/avatar/1.jpg"
|
||||
alt=""
|
||||
width="30"
|
||||
className="me-2"
|
||||
/>
|
||||
Weston P. Thomas
|
||||
</td>
|
||||
<td>₹7000</td>
|
||||
<td>
|
||||
<span className="badge px-3 py-2 bg-success">
|
||||
Paid
|
||||
</span>
|
||||
</td>
|
||||
<td>February 16, 2021</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<div className="form-check">
|
||||
<input
|
||||
className="form-check-input"
|
||||
type="checkbox"
|
||||
value=""
|
||||
id="flexCheckDefault"
|
||||
/>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<img
|
||||
src="/images/avatar/2.jpg"
|
||||
alt=""
|
||||
width="30"
|
||||
className="me-2"
|
||||
/>
|
||||
William D. Gibson
|
||||
</td>
|
||||
<td>₹650</td>
|
||||
<td>
|
||||
<span className="badge px-3 py-2 bg-success">
|
||||
Paid
|
||||
</span>
|
||||
</td>
|
||||
<td>December 21, 2021</td>
|
||||
</tr>
|
||||
|
||||
|
||||
|
||||
<tr>
|
||||
<td>
|
||||
<div className="form-check">
|
||||
<input
|
||||
className="form-check-input"
|
||||
type="checkbox"
|
||||
value=""
|
||||
id="flexCheckDefault"
|
||||
/>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<img
|
||||
src="/images/avatar/5.jpg"
|
||||
alt=""
|
||||
width="30"
|
||||
className="me-2"
|
||||
/>
|
||||
Terry P. Camacho
|
||||
</td>
|
||||
<td>₹465</td>
|
||||
<td>
|
||||
<span className="badge px-3 py-2 bg-danger">
|
||||
Cancel
|
||||
</span>
|
||||
</td>
|
||||
<td>November 26, 2021</td>
|
||||
</tr>
|
||||
|
||||
{num?<React.Fragment>
|
||||
<tr>
|
||||
<td>
|
||||
<div className="form-check">
|
||||
<input
|
||||
className="form-check-input"
|
||||
type="checkbox"
|
||||
value=""
|
||||
id="flexCheckDefault"
|
||||
/>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<img
|
||||
src="/images/avatar/5.jpg"
|
||||
alt=""
|
||||
width="30"
|
||||
className="me-2"
|
||||
/>
|
||||
Terry P. Camacho
|
||||
</td>
|
||||
<td>₹645</td>
|
||||
<td>
|
||||
<span className="badge px-3 py-2 bg-danger">
|
||||
Cancel
|
||||
</span>
|
||||
</td>
|
||||
<td>November 26, 2021</td>
|
||||
</tr>
|
||||
|
||||
</React.Fragment>:null}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
)
|
||||
}
|
||||
|
||||
export default InvoiceKPI
|
||||
@@ -0,0 +1,24 @@
|
||||
import React from 'react'
|
||||
|
||||
function NewConnection() {
|
||||
return (
|
||||
<div className="col-xl-12 col-lg-12">
|
||||
{/* </div> <div className="col-xl-6 col-lg-6"> */}
|
||||
<div className="card">
|
||||
<div className="card-body">
|
||||
<div className='d-flex flex-column align-items-center'>
|
||||
<div className='water-connection'>
|
||||
<img src='./images/kerala/tap.jpg' className='w-100 h-100' />
|
||||
</div>
|
||||
<div className='d-flex flex-column pt-3'>
|
||||
<span className='text-dark' style={{fontSize:'20px'}}> </span>
|
||||
<button className="btn bg-primary br-btn">Click here for new Connection</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default NewConnection
|
||||
@@ -0,0 +1,49 @@
|
||||
import React from 'react'
|
||||
|
||||
function PaymentAddKPI() {
|
||||
return (
|
||||
|
||||
<div className="card">
|
||||
{/* <div className="card-header">
|
||||
<h4 className="card-title">Stats</h4>
|
||||
</div> */}
|
||||
<div className="card-body">
|
||||
<div>
|
||||
<h3>Your Wallet</h3>
|
||||
</div>
|
||||
<hr />
|
||||
<div>
|
||||
<h1 className='p-0 m-0'>₹0.00</h1>
|
||||
<span className='font-14'>Your Current Balance</span>
|
||||
</div>
|
||||
|
||||
<hr />
|
||||
|
||||
<div>
|
||||
<div className='text-dark'>Add money to wallet</div>
|
||||
<span style={{fontSize:'10px'}}>We recommend to recharge your Wallet with <span className='text-success'>₹500.00</span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<div className="py-4 position-relative">
|
||||
<span style={{top:'30px'}} className="align-items-center pl-2 position-absolute pt-2">
|
||||
<span className='px-2'>₹</span>
|
||||
</span>
|
||||
|
||||
<input type="number" className="form-control hs_borderRadius-4 pl-4" />
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<button className='btn bg-primary br-btn'>Proceed</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
)
|
||||
}
|
||||
|
||||
export default PaymentAddKPI
|
||||
@@ -0,0 +1,29 @@
|
||||
import React from 'react'
|
||||
|
||||
function PaymentKPI() {
|
||||
return (
|
||||
<div className="col-xxl-12 col-xl-6 col-lg-12">
|
||||
<div id="user-activity" className="card" data-aos="fade-up">
|
||||
<div className="card-header">
|
||||
<h4 className="card-title">Amount To Be Paid</h4>
|
||||
</div>
|
||||
|
||||
<div className="card-body">
|
||||
|
||||
<div className='d-flex justify-content-between '>
|
||||
{/* <div className='text-dark'>Amount To Be Paid</div> */}
|
||||
<div className='d-flex justify-content-center align-items-center'><div className='pb-0 text-danger' style={{fontWeight:'900',fontSize:'1.3rem'}}>₹14000</div></div>
|
||||
<div className='d-flex justify-content-end '>
|
||||
<button className='btn bg-primary br-btn'>Pay Now</button>
|
||||
</div>
|
||||
</div>
|
||||
{/* <div className='d-flex justify-content-end pt-2 '>
|
||||
<button className='btn bg-primary br-btn'>Pay Now</button>
|
||||
</div> */}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default PaymentKPI
|
||||
@@ -0,0 +1,9 @@
|
||||
import React from 'react'
|
||||
|
||||
function PrevPayment() {
|
||||
return (
|
||||
<div>PrevPayment</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default PrevPayment
|
||||
@@ -0,0 +1,22 @@
|
||||
import React from 'react'
|
||||
|
||||
function SupportKPI() {
|
||||
return (
|
||||
<div className="col-xxl-6 col-xl-6 col-lg-6">
|
||||
<div id="user-activity" className="card" data-aos="fade-up">
|
||||
|
||||
<div className="card-body">
|
||||
|
||||
<div>
|
||||
<img src='./images/kerala/support.png' className='w-100 h-100' />
|
||||
</div>
|
||||
<div className='d-flex justify-content-around py-2'>
|
||||
<button className='btn bg-primary br-btn'>Create Support Ticket</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default SupportKPI
|
||||
Verwijs in nieuw issue
Block a user