Skip to content

Commit 15e0054

Browse files
Merge pull request #120 from coding-blocks/buy_link_list_view
Buy link list view
2 parents 881f139 + 08e1095 commit 15e0054

File tree

8 files changed

+736
-26
lines changed

8 files changed

+736
-26
lines changed

components/BuyLinksView/BuyLinkFilterForm.js

Lines changed: 375 additions & 0 deletions
Large diffs are not rendered by default.
Lines changed: 190 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,190 @@
1+
import React from 'react';
2+
import Router from 'next/router';
3+
import Table from '@material-ui/core/Table';
4+
import TableBody from '@material-ui/core/TableBody';
5+
import TableCell from '@material-ui/core/TableCell';
6+
import TableContainer from '@material-ui/core/TableContainer';
7+
import Grid from "@material-ui/core/Grid";
8+
import TableHead from '@material-ui/core/TableHead';
9+
import TableRow from '@material-ui/core/TableRow';
10+
import Paper from '@material-ui/core/Paper';
11+
import Chip from "@material-ui/core/Chip";
12+
import * as controller from "../../controllers/buyLink";
13+
import CircularProgress from "@material-ui/core/CircularProgress";
14+
import TablePagination from "@material-ui/core/TablePagination";
15+
import { withStyles } from '@material-ui/core';
16+
import Button from '@material-ui/core/Button';
17+
import Swal from 'sweetalert2';
18+
import Link from "next/link";
19+
import withReactContent from 'sweetalert2-react-content';
20+
21+
const PaginationTheme = withStyles({
22+
actions: {
23+
color: "red",
24+
backgroundColor: 'white',
25+
}
26+
})(TablePagination);
27+
28+
const useStyles = theme => ({
29+
root: {
30+
background: 'linear-gradient(45deg, #FE6B8B 30%, #FF8E53 90%)',
31+
color: 'white',
32+
border: 0,
33+
borderRadius: 3,
34+
boxShadow: '0 3px 5px 2px rgba(255, 105, 135, .3)'
35+
},
36+
});
37+
38+
const ReactSwal = withReactContent(Swal);
39+
40+
class BuyLinksTable extends React.Component {
41+
42+
constructor(props) {
43+
super(props);
44+
this.state = {
45+
buyLinks: [],
46+
totalBuyLinks: 0,
47+
rowsPerPage: 10,
48+
currentPage: 0,
49+
totalPages: 0,
50+
}
51+
}
52+
53+
resetPageInfo = () => {
54+
this.setState({
55+
rowsPerPage: 10,
56+
currentPage: 0,
57+
totalPages: 0,
58+
})
59+
}
60+
61+
fillTable = () => {
62+
controller.searchBuyLinks(this.props.filterParams, {
63+
rowsPerPage: this.state.rowsPerPage,
64+
currentPage: this.state.currentPage,
65+
}).then((response) => {
66+
this.setState({
67+
buyLinks: response.data.buyLinks,
68+
totalBuyLinks: response.data.totalBuyLinks,
69+
totalPages: response.data.pagesInfo.pageCount
70+
})
71+
}).catch((error) => {
72+
Swal.fire({
73+
type: 'error',
74+
title: 'Error while fetching buy links!',
75+
text: error
76+
});
77+
this.setState({
78+
loading: false
79+
});
80+
});
81+
}
82+
83+
componentDidMount() {
84+
this.fillTable()
85+
}
86+
87+
88+
handleChangePage = (event, newPage) => {
89+
this.setState({
90+
currentPage: newPage
91+
}, () => {
92+
this.fillTable()
93+
})
94+
95+
}
96+
97+
handleChangeRowsPerPage = (event) => {
98+
this.setState({
99+
rowsPerPage: parseInt(event.target.value, 10),
100+
currentPage: 0
101+
}, () => {
102+
this.fillTable()
103+
})
104+
}
105+
106+
render() {
107+
const { classes } = this.props;
108+
109+
if (!this.state.buyLinks) {
110+
return (
111+
<CircularProgress/>
112+
)
113+
}
114+
return (
115+
<div>
116+
<Grid xs={11} className={"mt-5 mr-5"}>
117+
<Paper>
118+
<TableContainer>
119+
<Grid container justify="center" className={"mb-1"}>
120+
<h2 className={"title"}> Buy Links</h2>
121+
</Grid>
122+
<Table aria-label="simple table">
123+
<TableHead>
124+
<TableRow>
125+
<TableCell align="center" className={"red"}>USER</TableCell>
126+
<TableCell align="center" className={"red"}>PRODUCT</TableCell>
127+
<TableCell align="center" className={"red"}>URL</TableCell>
128+
<TableCell align="center" className={"red"}>CODE</TableCell>
129+
<TableCell align="center" className={"red"}>STATUS</TableCell>
130+
<TableCell align="center" className={"red"}>COUPON</TableCell>
131+
<TableCell align="center" className={"red"}>STATE</TableCell>
132+
<TableCell align="center" className={"red"}>CREDITS</TableCell>
133+
<TableCell align="center" className={"red"}>CREATED BY</TableCell>
134+
135+
</TableRow>
136+
</TableHead>
137+
<TableBody>
138+
{this.state.buyLinks.map((buyLink) => (
139+
<TableRow key={buyLink.id}
140+
style={{borderTop: '1px solid lightgrey'}}>
141+
<TableCell align="center">
142+
{buyLink.user.firstname} {buyLink.user.lastname}
143+
</TableCell>
144+
<TableCell align="center">
145+
{buyLink.product.description}
146+
</TableCell>
147+
<TableCell align="center">
148+
{buyLink.short_url}
149+
</TableCell>
150+
<TableCell align="center">
151+
{buyLink.code}
152+
</TableCell>
153+
<TableCell align="center">
154+
{buyLink.active === true ? 'Active' : 'Inactive'}
155+
</TableCell>
156+
<TableCell align="center">
157+
{buyLink.coupon ? buyLink.coupon.code : '-'}
158+
</TableCell>
159+
<TableCell align="center">
160+
{buyLink.state ? buyLink.state.name : '-'}
161+
</TableCell>
162+
<TableCell align="center">
163+
{buyLink.use_credits ? 'Applicable' : 'Not Applicable'}
164+
</TableCell>
165+
<TableCell align="center">
166+
{buyLink.buyLink_creator.firstname} {buyLink.buyLink_creator.lastname}
167+
</TableCell>
168+
169+
</TableRow>
170+
))}
171+
</TableBody>
172+
</Table>
173+
</TableContainer>
174+
<PaginationTheme
175+
rowsPerPageOptions={[5,10]}
176+
component="div"
177+
count={this.state.totalBuyLinks}
178+
rowsPerPage={this.state.rowsPerPage}
179+
page={this.state.currentPage}
180+
onChangePage={this.handleChangePage}
181+
onChangeRowsPerPage={this.handleChangeRowsPerPage}
182+
/>
183+
</Paper>
184+
</Grid>
185+
</div>
186+
);
187+
}
188+
}
189+
190+
export default withStyles(useStyles)(BuyLinksTable)

components/layout.js

Lines changed: 17 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -125,14 +125,29 @@ class Layout extends React.Component {
125125
<a>Add New</a>
126126
</Link>
127127
</div>
128+
</div>
129+
</li>
130+
131+
<li className="dropdown">
132+
<button className="dropbtn dropdown-toggle">
133+
Buy Links
134+
<i className="fa fa-caret-down pl-2" />
135+
</button>
136+
<div className="dropdown-content">
137+
<div className="flex-row justify-content-center">
138+
<Link href="/admin/buyLinks">
139+
<a>All</a>
140+
</Link>
141+
</div>
128142
<div className="divider-h" />
129143
<div className="flex-row justify-content-center">
130-
<Link href="/admin/products/generateLink">
131-
<a>Generate Link</a>
144+
<Link href="/admin/buyLinks/add">
145+
<a>Add New</a>
132146
</Link>
133147
</div>
134148
</div>
135149
</li>
150+
136151
</div>
137152
)}
138153
<li className="nav-items pointer capitalize">

controllers/buyLink.js

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
import {axios} from "../DukaanAPI";
2+
import ErrorHandler from '../helpers/ErrorHandler';
3+
import organizationController from './organizations';
4+
import resourcesController from "./resources";
5+
6+
const querystring = require('querystring');
7+
8+
const handleAddBuyLink = (data) => {
9+
return axios.post(`/api/v2/admin/buy_links`, data)
10+
}
11+
12+
const searchBuyLinks = (queryParams, pagination) => {
13+
14+
if (!queryParams.product_id)
15+
delete queryParams.product_id
16+
17+
if (!queryParams.user_id)
18+
delete queryParams.user_id
19+
20+
let query = querystring.stringify(queryParams);
21+
return axios.get(`/api/v2/admin/buy_links?page=` + pagination.currentPage + `&limit=` + pagination.rowsPerPage + `&` +query)
22+
}
23+
24+
const getFilterFormData = () => {
25+
return Promise.all([
26+
organizationController.getAllOrganizations(),
27+
resourcesController.getStates()
28+
])
29+
}
30+
31+
export {
32+
handleAddBuyLink,
33+
searchBuyLinks,
34+
getFilterFormData
35+
}

controllers/products.js

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import {axios} from "../DukaanAPI";
22
import ErrorHandler from "../helpers/ErrorHandler";
33
import organizationController from './organizations';
44
import userController from './users';
5-
5+
import resourcesController from "./resources";
66

77
const querystring = require('querystring');
88

@@ -137,7 +137,10 @@ const fetchOrganizations = () => {
137137
}
138138

139139
const fetchGenerateLinkData = () => {
140-
return fetchOrganizations()
140+
return Promise.all([
141+
fetchOrganizations(),
142+
resourcesController.getStates()
143+
])
141144
}
142145

143146
const fetchCenters = (organizationId) => {

forms/ProductLink.js

Lines changed: 48 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import CircularProgress from '@material-ui/core/CircularProgress';
55
import Checkbox from "@material-ui/core/Checkbox";
66
import CheckBoxOutlineBlankIcon from '@material-ui/icons/CheckBoxOutlineBlank';
77
import CheckBoxIcon from '@material-ui/icons/CheckBox';
8-
import config from "../config";
8+
import * as controller from '../controllers/buyLink'
99
import FormControl from "@material-ui/core/FormControl";
1010
import FormControlLabel from '@material-ui/core/FormControlLabel';
1111
import { Formik, Field} from 'formik';
@@ -53,7 +53,8 @@ const initialValues = {
5353
user: '',
5454
applyCredits: false,
5555
category: '',
56-
coupon: ''
56+
coupon: '',
57+
state: ''
5758
}
5859

5960
class ProductLinkForm extends React.Component {
@@ -64,20 +65,22 @@ class ProductLinkForm extends React.Component {
6465
}
6566

6667
generateLink = (fields) => {
67-
const productId = fields.product.id
68-
const oneauthId = fields.user.oneauth_id
6968

70-
let useCreditsQueryParams = ''
71-
if (fields.applyCredits)
72-
useCreditsQueryParams = '&useCredits=true'
73-
74-
let couponQueryParams = ''
75-
if (fields.coupon)
76-
couponQueryParams = `&coupon=${fields.coupon.code}`
77-
78-
const link = `https://dukaan.codingblocks.com/buy?productId=${productId}&oneauthId=${oneauthId}${useCreditsQueryParams}${couponQueryParams}`
79-
80-
this.props.ongenerateLink(link)
69+
controller.handleAddBuyLink({
70+
user_id: fields.user.id,
71+
product_id: fields.product.id,
72+
coupon_id: fields.coupon ? fields.coupon.id : '',
73+
use_credits: fields.applyCredits,
74+
state_id: fields.state,
75+
}).then((response) => {
76+
this.props.ongenerateLink(response.data.short_url)
77+
}).catch((error) => {
78+
Swal.fire({
79+
title: "Error while creating link!",
80+
type: "error",
81+
text: error
82+
});
83+
});
8184
}
8285

8386
handleCustomCouponCreation = (coupon) => {
@@ -362,6 +365,36 @@ class ProductLinkForm extends React.Component {
362365
</FormControl>
363366

364367

368+
<FormControl variant="outlined" size={"medium"}
369+
fullWidth={true} className={"mb-4"}>
370+
<InputLabel id="state">State</InputLabel>
371+
372+
<Select
373+
value={values.state}
374+
name={"state"}
375+
onChange={(e) => {
376+
this.props.unsetGeneratedLink()
377+
setFieldValue("state", e.target.value)
378+
}}
379+
label="State">
380+
381+
<MenuItem value="">
382+
<em>Select</em>
383+
</MenuItem>
384+
{
385+
this.props.addressStates.map((state) => {
386+
return (
387+
<MenuItem
388+
key={state.id}
389+
value={state.id}>{
390+
state.name
391+
}</MenuItem>
392+
)
393+
})
394+
}
395+
396+
</Select>
397+
</FormControl>
365398

366399
<FormControlLabel
367400
className={"mb-4"}

0 commit comments

Comments
 (0)