From afdcb4d7666072133e93b45b81479c1c6bb6d314 Mon Sep 17 00:00:00 2001 From: JasmeetLuthra Date: Tue, 30 Jun 2020 18:49:45 +0530 Subject: [PATCH 1/3] displaying user's carts details, email support --- components/ProductLinkCard.js | 142 ++++++++++++++----------- controllers/products.js | 27 ++++- controllers/users.js | 18 +++- forms/ProductLink.js | 15 ++- pages/admin/products/generateLink.js | 150 +++++++++++++++++++++++---- 5 files changed, 268 insertions(+), 84 deletions(-) diff --git a/components/ProductLinkCard.js b/components/ProductLinkCard.js index ee3fa5e..3f742ca 100644 --- a/components/ProductLinkCard.js +++ b/components/ProductLinkCard.js @@ -1,14 +1,15 @@ import React from 'react'; import { makeStyles } from '@material-ui/core/styles'; +import Avatar from '@material-ui/core/Avatar'; import Card from '@material-ui/core/Card'; import CardActionArea from '@material-ui/core/CardActionArea'; +import CardActions from '@material-ui/core/CardActions'; import CardContent from '@material-ui/core/CardContent'; import CardMedia from '@material-ui/core/CardMedia'; import { CopyToClipboard } from 'react-copy-to-clipboard'; import Button from '@material-ui/core/Button'; -import FileCopyIcon from '@material-ui/icons/FileCopy'; -import Grid from "@material-ui/core/Grid"; -import Typography from '@material-ui/core/Typography'; +import EmailOutlinedIcon from '@material-ui/icons/EmailOutlined'; +import FileCopyOutlinedIcon from '@material-ui/icons/FileCopyOutlined'; import Snackbar from '@material-ui/core/Snackbar'; import IconButton from '@material-ui/core/IconButton'; import CloseIcon from '@material-ui/icons/Close'; @@ -18,84 +19,98 @@ import config from "../config"; const useStyles = makeStyles({ root: { maxWidth: 400, + marginBottom: 10 }, media: { objectFit: 'cover', }, }); -const ProductLinkCard = ({ product, user, useCredits }) => { +const ProductLinkCard = ({ link, product, user, onSendEmailClick, calculatedAmountDetails }) => { const [open, setOpen] = React.useState(false); - const generatedLink = useCredits - ? `${config.domain}buy?productId=${product.id}&oneauthId=${user.oneauth_id}&userCredits=true` - : `${config.domain}buy?productId=${product.id}&oneauthId=${user.oneauth_id}` - const handleClick = () => { - setOpen(true); - }; + setOpen(true); + } const handleClose = (event, reason) => { - if (reason === 'clickaway') { - return; - } + if (reason === 'clickaway') { + return; + } setOpen(false); - }; + } const classes = useStyles(); return ( -
+
- - - - Product -
    -
  • Name: {product.name}
    • -
  • Description: {product.description}
    • -
  • Type: {product.type}
    • -
  • Mrp: {product.mrp / 100}
    • - -
- - - User -
    -
  • UserName: {user.username}
    • -
  • OneauthId: {user.oneauth_id}
    • -
  • Email: {user.email}
    • -
  • Wallet Amount: {user.wallet_amount / 100}
    • -
- - -
- - - - {generatedLink} - - - - - - - - + +
+
+ +
+
+
+
+ {product.description} +
+
+
+
+
+
+ +
+ +
+
Discount
+
{calculatedAmountDetails.discount}
+
+ +
+
Taxes
+
{calculatedAmountDetails.tax/100}
+
+ +
+
Credits
+
{calculatedAmountDetails.creditsApplied/100}
+
+ +
+
Amount
+
{calculatedAmountDetails.amount/100}
+
+ +
+
Type
+
{product.type}
+
+ +
+ +
+
+ {link} +
+ +
+ + + +
+
+ +
+ { } /> - + + + + +
diff --git a/controllers/products.js b/controllers/products.js index 2609b57..d20c5ed 100644 --- a/controllers/products.js +++ b/controllers/products.js @@ -1,6 +1,8 @@ import {axios} from "../DukaanAPI"; import ErrorHandler from "../helpers/ErrorHandler"; import organizationController from './organizations'; +import userController from './users'; + const querystring = require('querystring'); @@ -131,6 +133,26 @@ const fetchCenters = (organizationId) => { return organizationController.getOrganizationCenters(organizationId) } +const sendBuyLinkEmail = (data) => { + return axios.post("/api/v2/admin/products/productBuyLinkEmail", data) +} + +const getUserCartDetailsUrls = (data) => { + return userController.getUserCartDetailsUrls(data) +} + +const getProductBuyLinkData = (data) => { + return Promise.all ([ + getUserCartDetailsUrls({id: data.userId}), + handleCalculatePrice({ + oneauthId: data.oneauthId, + productId: data.productId, + quantity: data.quantity, + useCredits: data.useCredits + }) + ]) +} + module.exports = { handleGetProducts, handleAddProduct, @@ -138,5 +160,8 @@ module.exports = { handleCalculatePrice, searchProducts, fetchGenerateLinkData, - fetchCenters + fetchCenters, + sendBuyLinkEmail, + getUserCartDetailsUrls, + getProductBuyLinkData } diff --git a/controllers/users.js b/controllers/users.js index 3b4348f..924c505 100644 --- a/controllers/users.js +++ b/controllers/users.js @@ -60,11 +60,27 @@ const updateUserDetails = (values) => { }; +const getUsersActiveCartDetailsUrl = (data) => { + return axios.get(`api/v2/admin/users/activeCartDetails`, {params: data}) +} + +const getUsersPurchasedProductsDetialsUrl = (data) => { + return axios.get(`api/v2/admin/users/purchasedProductsDetails`, {params: data}) +} + +const getUserCartDetailsUrls = (data) => { + return Promise.all([ + getUsersActiveCartDetailsUrl(data), + getUsersPurchasedProductsDetialsUrl(data) + ]) +} + module.exports = { handleGetUserByEmailOrPhone, handleAddUser, handleGetUserById, getUsernameAvailability, getUserByFromOneAuthByOneAuthId, - updateUserDetails + updateUserDetails, + getUserCartDetailsUrls }; diff --git a/forms/ProductLink.js b/forms/ProductLink.js index 1188a1a..198a2ae 100644 --- a/forms/ProductLink.js +++ b/forms/ProductLink.js @@ -60,8 +60,17 @@ class ProductLinkForm extends React.Component { super(props) } - generateLink = () => { - this.props.ongenerateLinkClick() + generateLink = (fields) => { + + const productId = fields.product.id + const oneauthId = fields.user.oneauth_id + + let useCreditsQueryParams = '' + if (fields.applyCredits) + useCreditsQueryParams = '/useCredits=true' + + const link = `${config.domain}buy?productId=${productId}&oneauthId=${oneauthId}${useCreditsQueryParams}` + this.props.ongenerateLink(link) } render() { @@ -96,7 +105,7 @@ class ProductLinkForm extends React.Component { onClose={() => { this.props.onAutoCompleteClose('user') }} loading={this.props.selectUserOpen && !this.props.userSearchResults.length} value={values.user} - onChange={(e, value) => { + onChange={ (e, value) => { this.props.handleUserChange(e, value) setFieldValue("user", value) } } diff --git a/pages/admin/products/generateLink.js b/pages/admin/products/generateLink.js index 134cf54..3808890 100644 --- a/pages/admin/products/generateLink.js +++ b/pages/admin/products/generateLink.js @@ -1,5 +1,7 @@ import React from 'react' import Head from '../../../components/head'; +import Backdrop from '@material-ui/core/Backdrop'; +import CircularProgress from '@material-ui/core/CircularProgress'; import Layout from "../../../components/layout"; import ProductLinkForm from "../../../forms/ProductLink"; import CheckLogin from "../../../components/CheckLogin"; @@ -8,7 +10,14 @@ import * as userController from '../../../controllers/users' import ProductLinkCard from "../../../components/ProductLinkCard" import ErrorHandler from "../../../helpers/ErrorHandler"; import Swal from 'sweetalert2'; +import { withStyles } from '@material-ui/core'; +const useStyles = theme => ({ + backdrop: { + zIndex: theme.zIndex.drawer + 1, + color: '#fff', + }, +}); class GenerateLink extends React.Component { @@ -28,12 +37,19 @@ class GenerateLink extends React.Component { product:'', user:'', useCredits:false, - generateLinkClicked:false + generatedLink: '', + generateLinkClicked:false, + activeCartIframeUrl: '', + purchasedProductIframeurl: '', + calculatedAmountDetails: '', + loading: false, } } componentDidMount() { - controller.fetchGenerateLinkData().then((organizations) => { + controller.fetchGenerateLinkData({ + user_id: this.state.user_id + }).then((organizations) => { this.setState({ organizations: organizations.data, }) @@ -126,8 +142,10 @@ class GenerateLink extends React.Component { handleProductChange = async (event, value) => { this.setState({ - product: value - }); + product: value, + }) + + this.unsetGeneratedLink() } @@ -157,37 +175,94 @@ class GenerateLink extends React.Component { } } - handleUserChange = (event, value) => { + handleUserChange = (event, value) => { + this.setState({ user: value, - }); + }) + this.unsetGeneratedLink() } onApplyCreditsChange = (event) => { this.setState({ useCredits: !JSON.parse(event.target.value) }) + this.unsetGeneratedLink() + } + + ongenerateLink = (link) => { + + controller.getProductBuyLinkData({ + userId: this.state.user.id, + oneauthId: this.state.user.oneauth_id, + productId: this.state.product.id, + quantity: 1, + useCredits: this.state.useCredits + }).then(([ [activeCartDetails, purchasedProductDetails], calculatedAmountDetails]) => { + this.setState({ + activeCartIframeUrl: activeCartDetails.data.iframeUrl, + purchasedProductIframeurl: purchasedProductDetails.data.iframeUrl, + generatedLink: link, + generateLinkClicked: true, + calculatedAmountDetails: calculatedAmountDetails.data, + loading: true + }) + }) } - ongenerateLinkClick = () => { + unsetGeneratedLink = () => { this.setState({ - generateLinkClicked: true + generatedLink: '', + generateLinkClicked: false }) } + onSendEmailClick = () => { + controller.sendBuyLinkEmail({ + user_id: this.state.user.id, + link: this.state.generatedLink + }).then((response) => { + Swal.fire({ + title: "Success", + text: "Email sent successfully!", + icon: "success", + }); + }).catch((err) => { + Swal.fire({ + type: "error", + title: "Error", + text: "Error sending email!" + }); + }) + } + + hideSpinner = () => { + this.setState({ + loading: false + }); + }; + render() { + const { classes } = this.props; + return (
+ + -
-
-

Create Buy Link

-
- -
+ + + + +
+

Create Buy Link

+
+ +
+
-
+
+ { this.state.generateLinkClicked && + +
+ +
+ } +
+
- { this.state.generateLinkClicked && this.state.product && this.state.user && + { this.state.generateLinkClicked && + +
+ +
+ +
+ +
+ {!this.state.loading && } +
+ } -
) } } -export default GenerateLink +export default withStyles(useStyles)(GenerateLink) From fefe4aa98bbe384f133b3cbdd266a340a84f7b91 Mon Sep 17 00:00:00 2001 From: JasmeetLuthra Date: Tue, 30 Jun 2020 20:36:56 +0530 Subject: [PATCH 2/3] product link panel UI changes --- components/ProductLinkCard.js | 129 ++++++++++++--------------- forms/ProductLink.js | 2 +- pages/admin/products/generateLink.js | 100 +++++++++++++++------ 3 files changed, 131 insertions(+), 100 deletions(-) diff --git a/components/ProductLinkCard.js b/components/ProductLinkCard.js index 3f742ca..8ee6214 100644 --- a/components/ProductLinkCard.js +++ b/components/ProductLinkCard.js @@ -3,9 +3,7 @@ import { makeStyles } from '@material-ui/core/styles'; import Avatar from '@material-ui/core/Avatar'; import Card from '@material-ui/core/Card'; import CardActionArea from '@material-ui/core/CardActionArea'; -import CardActions from '@material-ui/core/CardActions'; import CardContent from '@material-ui/core/CardContent'; -import CardMedia from '@material-ui/core/CardMedia'; import { CopyToClipboard } from 'react-copy-to-clipboard'; import Button from '@material-ui/core/Button'; import EmailOutlinedIcon from '@material-ui/icons/EmailOutlined'; @@ -14,18 +12,16 @@ import Snackbar from '@material-ui/core/Snackbar'; import IconButton from '@material-ui/core/IconButton'; import CloseIcon from '@material-ui/icons/Close'; import config from "../config"; +import Table from '@material-ui/core/Table'; +import TableBody from '@material-ui/core/TableBody'; +import TableCell from '@material-ui/core/TableCell'; +import TableContainer from '@material-ui/core/TableContainer'; +import Paper from '@material-ui/core/Paper'; +import TableHead from '@material-ui/core/TableHead'; +import TableRow from '@material-ui/core/TableRow'; +import Typography from '@material-ui/core/Typography'; -const useStyles = makeStyles({ - root: { - maxWidth: 400, - marginBottom: 10 - }, - media: { - objectFit: 'cover', - }, -}); - const ProductLinkCard = ({ link, product, user, onSendEmailClick, calculatedAmountDetails }) => { const [open, setOpen] = React.useState(false); @@ -42,74 +38,68 @@ const ProductLinkCard = ({ link, product, user, onSendEmailClick, calculatedAmo setOpen(false); } - const classes = useStyles(); - return ( -
- - + -
-
- + + + {product.description} + + + + + + Product Name + Product Mrp + Discount + Taxes + Credits + Amount + Type + + + + + + {product.name} + + {product.mrp / 100} + {calculatedAmountDetails.discount / 100} + {calculatedAmountDetails.tax /100} + {calculatedAmountDetails.creditsApplied /100 } + {calculatedAmountDetails.amount /100} + {product.type} + + +
+ + + +
+
+ Product Buy Link:
-
-
-
- {product.description} -
-
-
-
-
-
- -
-
-
Discount
-
{calculatedAmountDetails.discount}
-
- -
-
Taxes
-
{calculatedAmountDetails.tax/100}
-
- -
-
Credits
-
{calculatedAmountDetails.creditsApplied/100}
-
- -
-
Amount
-
{calculatedAmountDetails.amount/100}
-
- -
-
Type
-
{product.type}
-
- -
- -
-
- {link} -
- -
+
+ {link}
+ +
+ +
-
+
- - - -
); } diff --git a/forms/ProductLink.js b/forms/ProductLink.js index 198a2ae..ab2c487 100644 --- a/forms/ProductLink.js +++ b/forms/ProductLink.js @@ -78,7 +78,7 @@ class ProductLinkForm extends React.Component { const { classes } = this.props; return ( -
+

diff --git a/pages/admin/products/generateLink.js b/pages/admin/products/generateLink.js index 3808890..69d8c33 100644 --- a/pages/admin/products/generateLink.js +++ b/pages/admin/products/generateLink.js @@ -11,12 +11,24 @@ import ProductLinkCard from "../../../components/ProductLinkCard" import ErrorHandler from "../../../helpers/ErrorHandler"; import Swal from 'sweetalert2'; import { withStyles } from '@material-ui/core'; +import Table from '@material-ui/core/Table'; +import TableBody from '@material-ui/core/TableBody'; +import TableCell from '@material-ui/core/TableCell'; +import TableContainer from '@material-ui/core/TableContainer'; +import Paper from '@material-ui/core/Paper'; +import TableHead from '@material-ui/core/TableHead'; +import TableRow from '@material-ui/core/TableRow'; +import Typography from '@material-ui/core/Typography'; + const useStyles = theme => ({ backdrop: { zIndex: theme.zIndex.drawer + 1, color: '#fff', }, + title: { + // minWidth: 650, + }, }); class GenerateLink extends React.Component { @@ -262,7 +274,7 @@ class GenerateLink extends React.Component {

-
+
-
{ this.state.generateLinkClicked && +
+ + {!this.state.loading && + +
+ + + User Details + + + + + + Name + Username + Wallet Amount + Oneauth Id + Email + Mobile Number + Credit Limit + Address + + + + + + {this.state.user.firstname} {this.state.user.lastname} + + {this.state.user.username} + {this.state.user.wallet_amount} + {this.state.user.oneauth_id} + {this.state.user.email} + {this.state.user.mobile_number} + {this.state.user.credit_limit} + {this.state.user.permanent_address} + + +
+ +
+ } -
+
- } -
-
- - { this.state.generateLinkClicked && - -
-
+
-
+
+ +
+ + {!this.state.loading && + + } +
-
- {!this.state.loading && - - }
-
- } + } +
From 260dbfa6a20732f61abbf8b70e3aed73c20357e4 Mon Sep 17 00:00:00 2001 From: JasmeetLuthra Date: Tue, 30 Jun 2020 21:15:16 +0530 Subject: [PATCH 3/3] UI modifications --- components/ProductLinkCard.js | 17 ++++++----------- forms/ProductLink.js | 2 +- pages/admin/products/generateLink.js | 8 +------- 3 files changed, 8 insertions(+), 19 deletions(-) diff --git a/components/ProductLinkCard.js b/components/ProductLinkCard.js index 8ee6214..910a47d 100644 --- a/components/ProductLinkCard.js +++ b/components/ProductLinkCard.js @@ -56,7 +56,7 @@ const ProductLinkCard = ({ link, product, user, onSendEmailClick, calculatedAmo Discount Taxes Credits - Amount + Amount To Pay Type @@ -69,8 +69,8 @@ const ProductLinkCard = ({ link, product, user, onSendEmailClick, calculatedAmo {calculatedAmountDetails.discount / 100} {calculatedAmountDetails.tax /100} {calculatedAmountDetails.creditsApplied /100 } - {calculatedAmountDetails.amount /100} - {product.type} + {calculatedAmountDetails.amount /100} + {product.type} @@ -82,8 +82,8 @@ const ProductLinkCard = ({ link, product, user, onSendEmailClick, calculatedAmo Product Buy Link:
-
- {link} +
+ {link}
-
- -
+
diff --git a/forms/ProductLink.js b/forms/ProductLink.js index ab2c487..2a336d6 100644 --- a/forms/ProductLink.js +++ b/forms/ProductLink.js @@ -82,7 +82,7 @@ class ProductLinkForm extends React.Component {

- Generate + Generate Buy Link

diff --git a/pages/admin/products/generateLink.js b/pages/admin/products/generateLink.js index 69d8c33..69a7d94 100644 --- a/pages/admin/products/generateLink.js +++ b/pages/admin/products/generateLink.js @@ -269,10 +269,6 @@ class GenerateLink extends React.Component { -
-

Create Buy Link

-
-
Oneauth Id Email Mobile Number - Credit Limit Address @@ -319,11 +314,10 @@ class GenerateLink extends React.Component { {this.state.user.firstname} {this.state.user.lastname} {this.state.user.username} - {this.state.user.wallet_amount} + {this.state.user.wallet_amount /100} {this.state.user.oneauth_id} {this.state.user.email} {this.state.user.mobile_number} - {this.state.user.credit_limit} {this.state.user.permanent_address}