Added report starter
This commit is contained in:
@@ -2,6 +2,174 @@ import React from "react";
|
|||||||
|
|
||||||
export default function PaymentReportTable() {
|
export default function PaymentReportTable() {
|
||||||
return (<>
|
return (<>
|
||||||
Payment Table
|
|
||||||
|
{/*<div className="row">*/}
|
||||||
|
{/* <div className="col-md-12 m-b-30">*/}
|
||||||
|
{/* <div className="d-block d-sm-flex flex-nowrap align-items-center">*/}
|
||||||
|
{/* <div className="page-title mb-2 mb-sm-0">*/}
|
||||||
|
{/* <h4>Payments Report</h4>*/}
|
||||||
|
{/* </div>*/}
|
||||||
|
{/* </div>*/}
|
||||||
|
{/* </div>*/}
|
||||||
|
{/*</div>*/}
|
||||||
|
|
||||||
|
<div className="row">
|
||||||
|
<div className="col-lg-12">
|
||||||
|
<div className="card card-statistics">
|
||||||
|
<div className="card-body">
|
||||||
|
<div className="page-title mb-2 mb-sm-0">
|
||||||
|
<h4>Payments Report</h4>
|
||||||
|
</div>
|
||||||
|
<div className="export-table-wrapper table-responsive">
|
||||||
|
<table id="export-table" className="table table-bordered">
|
||||||
|
<thead className="thead-light">
|
||||||
|
<tr>
|
||||||
|
<th>Name</th>
|
||||||
|
<th>Position</th>
|
||||||
|
<th>Office</th>
|
||||||
|
<th>Age</th>
|
||||||
|
<th>Start date</th>
|
||||||
|
<th>Salary</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
|
<tr>
|
||||||
|
<td>Tiger Nixon</td>
|
||||||
|
<td>System Architect</td>
|
||||||
|
<td>Edinburgh</td>
|
||||||
|
<td>61</td>
|
||||||
|
<td>2011/04/25</td>
|
||||||
|
<td>$320,800</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Garrett Winters</td>
|
||||||
|
<td>Accountant</td>
|
||||||
|
<td>Tokyo</td>
|
||||||
|
<td>63</td>
|
||||||
|
<td>2011/07/25</td>
|
||||||
|
<td>$170,750</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Ashton Cox</td>
|
||||||
|
<td>Junior Technical Author</td>
|
||||||
|
<td>San Francisco</td>
|
||||||
|
<td>66</td>
|
||||||
|
<td>2009/01/12</td>
|
||||||
|
<td>$86,000</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Cedric Kelly</td>
|
||||||
|
<td>Senior Javascript Developer</td>
|
||||||
|
<td>Edinburgh</td>
|
||||||
|
<td>22</td>
|
||||||
|
<td>2012/03/29</td>
|
||||||
|
<td>$433,060</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Airi Satou</td>
|
||||||
|
<td>Accountant</td>
|
||||||
|
<td>Tokyo</td>
|
||||||
|
<td>33</td>
|
||||||
|
<td>2008/11/28</td>
|
||||||
|
<td>$162,700</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Brielle Williamson</td>
|
||||||
|
<td>Integration Specialist</td>
|
||||||
|
<td>New York</td>
|
||||||
|
<td>61</td>
|
||||||
|
<td>2012/12/02</td>
|
||||||
|
<td>$372,000</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Herrod Chandler</td>
|
||||||
|
<td>Sales Assistant</td>
|
||||||
|
<td>San Francisco</td>
|
||||||
|
<td>59</td>
|
||||||
|
<td>2012/08/06</td>
|
||||||
|
<td>$137,500</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Rhona Davidson</td>
|
||||||
|
<td>Integration Specialist</td>
|
||||||
|
<td>Tokyo</td>
|
||||||
|
<td>55</td>
|
||||||
|
<td>2010/10/14</td>
|
||||||
|
<td>$327,900</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Colleen Hurst</td>
|
||||||
|
<td>Javascript Developer</td>
|
||||||
|
<td>San Francisco</td>
|
||||||
|
<td>39</td>
|
||||||
|
<td>2009/09/15</td>
|
||||||
|
<td>$205,500</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Sonya Frost</td>
|
||||||
|
<td>Software Engineer</td>
|
||||||
|
<td>Edinburgh</td>
|
||||||
|
<td>23</td>
|
||||||
|
<td>2008/12/13</td>
|
||||||
|
<td>$103,600</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Jena Gaines</td>
|
||||||
|
<td>Office Manager</td>
|
||||||
|
<td>London</td>
|
||||||
|
<td>30</td>
|
||||||
|
<td>2008/12/19</td>
|
||||||
|
<td>$90,560</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Quinn Flynn</td>
|
||||||
|
<td>Support Lead</td>
|
||||||
|
<td>Edinburgh</td>
|
||||||
|
<td>22</td>
|
||||||
|
<td>2013/03/03</td>
|
||||||
|
<td>$342,000</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Charde Marshall</td>
|
||||||
|
<td>Regional Director</td>
|
||||||
|
<td>San Francisco</td>
|
||||||
|
<td>36</td>
|
||||||
|
<td>2008/10/16</td>
|
||||||
|
<td>$470,600</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Haley Kennedy</td>
|
||||||
|
<td>Senior Marketing Designer</td>
|
||||||
|
<td>London</td>
|
||||||
|
<td>43</td>
|
||||||
|
<td>2012/12/18</td>
|
||||||
|
<td>$313,500</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Tatyana Fitzpatrick</td>
|
||||||
|
<td>Regional Director</td>
|
||||||
|
<td>London</td>
|
||||||
|
<td>19</td>
|
||||||
|
<td>2010/03/17</td>
|
||||||
|
<td>$385,750</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Michael Silva</td>
|
||||||
|
<td>Marketing Designer</td>
|
||||||
|
<td>London</td>
|
||||||
|
<td>66</td>
|
||||||
|
<td>2012/11/27</td>
|
||||||
|
<td>$198,500</td>
|
||||||
|
</tr>
|
||||||
|
|
||||||
|
</tbody>
|
||||||
|
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
</>)
|
</>)
|
||||||
}
|
}
|
||||||
@@ -0,0 +1,172 @@
|
|||||||
|
import React from "react";
|
||||||
|
|
||||||
|
export default function ProductReportTable() {
|
||||||
|
return (<>
|
||||||
|
|
||||||
|
<div className="row">
|
||||||
|
<div className="col-md-12 m-b-30">
|
||||||
|
<div className="d-block d-sm-flex flex-nowrap align-items-center">
|
||||||
|
<div className="page-title mb-2 mb-sm-0">
|
||||||
|
<h4>Payments Report</h4>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="row">
|
||||||
|
<div className="col-lg-12">
|
||||||
|
<div className="card card-statistics">
|
||||||
|
<div className="card-body">
|
||||||
|
<div className="export-table-wrapper table-responsive">
|
||||||
|
<table id="export-table" className="table table-bordered">
|
||||||
|
<thead className="thead-light">
|
||||||
|
<tr>
|
||||||
|
<th>Name</th>
|
||||||
|
<th>Position</th>
|
||||||
|
<th>Office</th>
|
||||||
|
<th>Age</th>
|
||||||
|
<th>Start date</th>
|
||||||
|
<th>Salary</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
|
<tr>
|
||||||
|
<td>Tiger Nixon</td>
|
||||||
|
<td>System Architect</td>
|
||||||
|
<td>Edinburgh</td>
|
||||||
|
<td>61</td>
|
||||||
|
<td>2011/04/25</td>
|
||||||
|
<td>$320,800</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Garrett Winters</td>
|
||||||
|
<td>Accountant</td>
|
||||||
|
<td>Tokyo</td>
|
||||||
|
<td>63</td>
|
||||||
|
<td>2011/07/25</td>
|
||||||
|
<td>$170,750</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Ashton Cox</td>
|
||||||
|
<td>Junior Technical Author</td>
|
||||||
|
<td>San Francisco</td>
|
||||||
|
<td>66</td>
|
||||||
|
<td>2009/01/12</td>
|
||||||
|
<td>$86,000</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Cedric Kelly</td>
|
||||||
|
<td>Senior Javascript Developer</td>
|
||||||
|
<td>Edinburgh</td>
|
||||||
|
<td>22</td>
|
||||||
|
<td>2012/03/29</td>
|
||||||
|
<td>$433,060</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Airi Satou</td>
|
||||||
|
<td>Accountant</td>
|
||||||
|
<td>Tokyo</td>
|
||||||
|
<td>33</td>
|
||||||
|
<td>2008/11/28</td>
|
||||||
|
<td>$162,700</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Brielle Williamson</td>
|
||||||
|
<td>Integration Specialist</td>
|
||||||
|
<td>New York</td>
|
||||||
|
<td>61</td>
|
||||||
|
<td>2012/12/02</td>
|
||||||
|
<td>$372,000</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Herrod Chandler</td>
|
||||||
|
<td>Sales Assistant</td>
|
||||||
|
<td>San Francisco</td>
|
||||||
|
<td>59</td>
|
||||||
|
<td>2012/08/06</td>
|
||||||
|
<td>$137,500</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Rhona Davidson</td>
|
||||||
|
<td>Integration Specialist</td>
|
||||||
|
<td>Tokyo</td>
|
||||||
|
<td>55</td>
|
||||||
|
<td>2010/10/14</td>
|
||||||
|
<td>$327,900</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Colleen Hurst</td>
|
||||||
|
<td>Javascript Developer</td>
|
||||||
|
<td>San Francisco</td>
|
||||||
|
<td>39</td>
|
||||||
|
<td>2009/09/15</td>
|
||||||
|
<td>$205,500</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Sonya Frost</td>
|
||||||
|
<td>Software Engineer</td>
|
||||||
|
<td>Edinburgh</td>
|
||||||
|
<td>23</td>
|
||||||
|
<td>2008/12/13</td>
|
||||||
|
<td>$103,600</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Jena Gaines</td>
|
||||||
|
<td>Office Manager</td>
|
||||||
|
<td>London</td>
|
||||||
|
<td>30</td>
|
||||||
|
<td>2008/12/19</td>
|
||||||
|
<td>$90,560</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Quinn Flynn</td>
|
||||||
|
<td>Support Lead</td>
|
||||||
|
<td>Edinburgh</td>
|
||||||
|
<td>22</td>
|
||||||
|
<td>2013/03/03</td>
|
||||||
|
<td>$342,000</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Charde Marshall</td>
|
||||||
|
<td>Regional Director</td>
|
||||||
|
<td>San Francisco</td>
|
||||||
|
<td>36</td>
|
||||||
|
<td>2008/10/16</td>
|
||||||
|
<td>$470,600</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Haley Kennedy</td>
|
||||||
|
<td>Senior Marketing Designer</td>
|
||||||
|
<td>London</td>
|
||||||
|
<td>43</td>
|
||||||
|
<td>2012/12/18</td>
|
||||||
|
<td>$313,500</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Tatyana Fitzpatrick</td>
|
||||||
|
<td>Regional Director</td>
|
||||||
|
<td>London</td>
|
||||||
|
<td>19</td>
|
||||||
|
<td>2010/03/17</td>
|
||||||
|
<td>$385,750</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Michael Silva</td>
|
||||||
|
<td>Marketing Designer</td>
|
||||||
|
<td>London</td>
|
||||||
|
<td>66</td>
|
||||||
|
<td>2012/11/27</td>
|
||||||
|
<td>$198,500</td>
|
||||||
|
</tr>
|
||||||
|
|
||||||
|
</tbody>
|
||||||
|
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</>)
|
||||||
|
}
|
||||||
@@ -4,6 +4,7 @@ import {useQuery} from "@tanstack/react-query";
|
|||||||
import queryKeys from "../../services/queryKeys";
|
import queryKeys from "../../services/queryKeys";
|
||||||
import {getReportsTopicsList} from "../../services/services";
|
import {getReportsTopicsList} from "../../services/services";
|
||||||
import PaymentReportTable from "./PaymentReportTable";
|
import PaymentReportTable from "./PaymentReportTable";
|
||||||
|
import ProductReportTable from "./ProductReportTable";
|
||||||
|
|
||||||
|
|
||||||
export default function Reports() {
|
export default function Reports() {
|
||||||
@@ -21,18 +22,12 @@ export default function Reports() {
|
|||||||
|
|
||||||
const reportTopicList = data?.data?.topics?.topics;
|
const reportTopicList = data?.data?.topics?.topics;
|
||||||
|
|
||||||
debugger;
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<BreadcrumbComBS title='Reports' paths={['Dashboard', 'Reports']}/>
|
<BreadcrumbComBS title='Reports' paths={['Dashboard', 'Reports']}/>
|
||||||
<div className="row">
|
<div className="row">
|
||||||
|
|
||||||
|
|
||||||
<div>
|
<div>
|
||||||
|
|
||||||
<div>
|
<div>
|
||||||
|
|
||||||
<div className="card card-statistics" style={{minHeight: '550px'}}>
|
<div className="card card-statistics" style={{minHeight: '550px'}}>
|
||||||
{/*<div className="card-header">*/}
|
{/*<div className="card-header">*/}
|
||||||
{/* <div className="card-heading">*/}
|
{/* <div className="card-heading">*/}
|
||||||
@@ -57,31 +52,11 @@ export default function Reports() {
|
|||||||
<div className="tab-content">
|
<div className="tab-content">
|
||||||
<div className="tab-pane fade active show" id="home-09" role="tabpanel"
|
<div className="tab-pane fade active show" id="home-09" role="tabpanel"
|
||||||
aria-labelledby="home-09-tab">
|
aria-labelledby="home-09-tab">
|
||||||
{<PaymentReportTable />}
|
{<PaymentReportTable/>}
|
||||||
</div>
|
</div>
|
||||||
<div className="tab-pane fade" id="profile-09" role="tabpanel"
|
<div className="tab-pane fade" id="profile-09" role="tabpanel"
|
||||||
aria-labelledby="profile-09-tab">
|
aria-labelledby="profile-09-tab">
|
||||||
<p>Reflect and experiment until you find the right combination of motivators
|
{<ProductReportTable/>}
|
||||||
for your personality and your personal goals. Do it today. Remind
|
|
||||||
yourself of someone you know who died suddenly and the fact that there
|
|
||||||
is no guarantee that tomorrow will come.</p>
|
|
||||||
</div>
|
|
||||||
<div className="tab-pane fade" id="portfolio-09" role="tabpanel"
|
|
||||||
aria-labelledby="portfolio-09-tab">
|
|
||||||
<p>Commitment is something that comes from understanding that everything has
|
|
||||||
its price and then having the willingness to pay that price. This is
|
|
||||||
important because nobody wants to put significant effort into something,
|
|
||||||
only to find out after the fact that the price was too high. We all know
|
|
||||||
people who live this truth.Give yourself the power of
|
|
||||||
responsibility.</p>
|
|
||||||
</div>
|
|
||||||
<div className="tab-pane fade" id="contact-09" role="tabpanel"
|
|
||||||
aria-labelledby="contact-09-tab">
|
|
||||||
<p>I truly believe Augustine’s words are true and if you look at history you
|
|
||||||
know it is true. There are many people in the world with amazing talents
|
|
||||||
who realize only a small percentage of their potential. We all know
|
|
||||||
people who live this truth.Give yourself the power of responsibility.
|
|
||||||
Remind yourself the only thing stopping you is yourself.</p>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -89,8 +64,6 @@ export default function Reports() {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</>
|
</>
|
||||||
)
|
)
|
||||||
|
|||||||
Reference in New Issue
Block a user