Commit 0988926b authored by Christopher Cottier's avatar Christopher Cottier

Merge branch 'master' of https://gitlab.mynisum.com/ascend/ecommerce-maven...

Merge branch 'master' of https://gitlab.mynisum.com/ascend/ecommerce-maven into AFP-127/add-promotions-to-post-order
parents a5671314 3181467b
<component name="libraryTable">
<library name="Maven: com.fasterxml:classmate:1.5.1">
<CLASSES>
<root url="jar://$MAVEN_REPOSITORY$/com/fasterxml/classmate/1.5.1/classmate-1.5.1.jar!/" />
</CLASSES>
<JAVADOC>
<root url="jar://$MAVEN_REPOSITORY$/com/fasterxml/classmate/1.5.1/classmate-1.5.1-javadoc.jar!/" />
</JAVADOC>
<SOURCES>
<root url="jar://$MAVEN_REPOSITORY$/com/fasterxml/classmate/1.5.1/classmate-1.5.1-sources.jar!/" />
</SOURCES>
</library>
</component>
\ No newline at end of file
<component name="libraryTable">
<library name="Maven: io.github.classgraph:classgraph:4.8.83">
<CLASSES>
<root url="jar://$MAVEN_REPOSITORY$/io/github/classgraph/classgraph/4.8.83/classgraph-4.8.83.jar!/" />
</CLASSES>
<JAVADOC>
<root url="jar://$MAVEN_REPOSITORY$/io/github/classgraph/classgraph/4.8.83/classgraph-4.8.83-javadoc.jar!/" />
</JAVADOC>
<SOURCES>
<root url="jar://$MAVEN_REPOSITORY$/io/github/classgraph/classgraph/4.8.83/classgraph-4.8.83-sources.jar!/" />
</SOURCES>
</library>
</component>
\ No newline at end of file
<component name="libraryTable">
<library name="Maven: io.springfox:springfox-bean-validators:3.0.0">
<CLASSES>
<root url="jar://$MAVEN_REPOSITORY$/io/springfox/springfox-bean-validators/3.0.0/springfox-bean-validators-3.0.0.jar!/" />
</CLASSES>
<JAVADOC>
<root url="jar://$MAVEN_REPOSITORY$/io/springfox/springfox-bean-validators/3.0.0/springfox-bean-validators-3.0.0-javadoc.jar!/" />
</JAVADOC>
<SOURCES>
<root url="jar://$MAVEN_REPOSITORY$/io/springfox/springfox-bean-validators/3.0.0/springfox-bean-validators-3.0.0-sources.jar!/" />
</SOURCES>
</library>
</component>
\ No newline at end of file
<component name="libraryTable">
<library name="Maven: io.springfox:springfox-boot-starter:3.0.0">
<CLASSES>
<root url="jar://$MAVEN_REPOSITORY$/io/springfox/springfox-boot-starter/3.0.0/springfox-boot-starter-3.0.0.jar!/" />
</CLASSES>
<JAVADOC>
<root url="jar://$MAVEN_REPOSITORY$/io/springfox/springfox-boot-starter/3.0.0/springfox-boot-starter-3.0.0-javadoc.jar!/" />
</JAVADOC>
<SOURCES>
<root url="jar://$MAVEN_REPOSITORY$/io/springfox/springfox-boot-starter/3.0.0/springfox-boot-starter-3.0.0-sources.jar!/" />
</SOURCES>
</library>
</component>
\ No newline at end of file
<component name="libraryTable">
<library name="Maven: io.springfox:springfox-core:3.0.0">
<CLASSES>
<root url="jar://$MAVEN_REPOSITORY$/io/springfox/springfox-core/3.0.0/springfox-core-3.0.0.jar!/" />
</CLASSES>
<JAVADOC>
<root url="jar://$MAVEN_REPOSITORY$/io/springfox/springfox-core/3.0.0/springfox-core-3.0.0-javadoc.jar!/" />
</JAVADOC>
<SOURCES>
<root url="jar://$MAVEN_REPOSITORY$/io/springfox/springfox-core/3.0.0/springfox-core-3.0.0-sources.jar!/" />
</SOURCES>
</library>
</component>
\ No newline at end of file
<component name="libraryTable">
<library name="Maven: io.springfox:springfox-data-rest:3.0.0">
<CLASSES>
<root url="jar://$MAVEN_REPOSITORY$/io/springfox/springfox-data-rest/3.0.0/springfox-data-rest-3.0.0.jar!/" />
</CLASSES>
<JAVADOC>
<root url="jar://$MAVEN_REPOSITORY$/io/springfox/springfox-data-rest/3.0.0/springfox-data-rest-3.0.0-javadoc.jar!/" />
</JAVADOC>
<SOURCES>
<root url="jar://$MAVEN_REPOSITORY$/io/springfox/springfox-data-rest/3.0.0/springfox-data-rest-3.0.0-sources.jar!/" />
</SOURCES>
</library>
</component>
\ No newline at end of file
<component name="libraryTable">
<library name="Maven: io.springfox:springfox-oas:3.0.0">
<CLASSES>
<root url="jar://$MAVEN_REPOSITORY$/io/springfox/springfox-oas/3.0.0/springfox-oas-3.0.0.jar!/" />
</CLASSES>
<JAVADOC>
<root url="jar://$MAVEN_REPOSITORY$/io/springfox/springfox-oas/3.0.0/springfox-oas-3.0.0-javadoc.jar!/" />
</JAVADOC>
<SOURCES>
<root url="jar://$MAVEN_REPOSITORY$/io/springfox/springfox-oas/3.0.0/springfox-oas-3.0.0-sources.jar!/" />
</SOURCES>
</library>
</component>
\ No newline at end of file
<component name="libraryTable">
<library name="Maven: io.springfox:springfox-schema:3.0.0">
<CLASSES>
<root url="jar://$MAVEN_REPOSITORY$/io/springfox/springfox-schema/3.0.0/springfox-schema-3.0.0.jar!/" />
</CLASSES>
<JAVADOC>
<root url="jar://$MAVEN_REPOSITORY$/io/springfox/springfox-schema/3.0.0/springfox-schema-3.0.0-javadoc.jar!/" />
</JAVADOC>
<SOURCES>
<root url="jar://$MAVEN_REPOSITORY$/io/springfox/springfox-schema/3.0.0/springfox-schema-3.0.0-sources.jar!/" />
</SOURCES>
</library>
</component>
\ No newline at end of file
<component name="libraryTable">
<library name="Maven: io.springfox:springfox-spi:3.0.0">
<CLASSES>
<root url="jar://$MAVEN_REPOSITORY$/io/springfox/springfox-spi/3.0.0/springfox-spi-3.0.0.jar!/" />
</CLASSES>
<JAVADOC>
<root url="jar://$MAVEN_REPOSITORY$/io/springfox/springfox-spi/3.0.0/springfox-spi-3.0.0-javadoc.jar!/" />
</JAVADOC>
<SOURCES>
<root url="jar://$MAVEN_REPOSITORY$/io/springfox/springfox-spi/3.0.0/springfox-spi-3.0.0-sources.jar!/" />
</SOURCES>
</library>
</component>
\ No newline at end of file
<component name="libraryTable">
<library name="Maven: io.springfox:springfox-spring-web:3.0.0">
<CLASSES>
<root url="jar://$MAVEN_REPOSITORY$/io/springfox/springfox-spring-web/3.0.0/springfox-spring-web-3.0.0.jar!/" />
</CLASSES>
<JAVADOC>
<root url="jar://$MAVEN_REPOSITORY$/io/springfox/springfox-spring-web/3.0.0/springfox-spring-web-3.0.0-javadoc.jar!/" />
</JAVADOC>
<SOURCES>
<root url="jar://$MAVEN_REPOSITORY$/io/springfox/springfox-spring-web/3.0.0/springfox-spring-web-3.0.0-sources.jar!/" />
</SOURCES>
</library>
</component>
\ No newline at end of file
<component name="libraryTable">
<library name="Maven: io.springfox:springfox-spring-webflux:3.0.0">
<CLASSES>
<root url="jar://$MAVEN_REPOSITORY$/io/springfox/springfox-spring-webflux/3.0.0/springfox-spring-webflux-3.0.0.jar!/" />
</CLASSES>
<JAVADOC>
<root url="jar://$MAVEN_REPOSITORY$/io/springfox/springfox-spring-webflux/3.0.0/springfox-spring-webflux-3.0.0-javadoc.jar!/" />
</JAVADOC>
<SOURCES>
<root url="jar://$MAVEN_REPOSITORY$/io/springfox/springfox-spring-webflux/3.0.0/springfox-spring-webflux-3.0.0-sources.jar!/" />
</SOURCES>
</library>
</component>
\ No newline at end of file
<component name="libraryTable">
<library name="Maven: io.springfox:springfox-spring-webmvc:3.0.0">
<CLASSES>
<root url="jar://$MAVEN_REPOSITORY$/io/springfox/springfox-spring-webmvc/3.0.0/springfox-spring-webmvc-3.0.0.jar!/" />
</CLASSES>
<JAVADOC>
<root url="jar://$MAVEN_REPOSITORY$/io/springfox/springfox-spring-webmvc/3.0.0/springfox-spring-webmvc-3.0.0-javadoc.jar!/" />
</JAVADOC>
<SOURCES>
<root url="jar://$MAVEN_REPOSITORY$/io/springfox/springfox-spring-webmvc/3.0.0/springfox-spring-webmvc-3.0.0-sources.jar!/" />
</SOURCES>
</library>
</component>
\ No newline at end of file
<component name="libraryTable">
<library name="Maven: io.springfox:springfox-swagger2:3.0.0">
<CLASSES>
<root url="jar://$MAVEN_REPOSITORY$/io/springfox/springfox-swagger2/3.0.0/springfox-swagger2-3.0.0.jar!/" />
</CLASSES>
<JAVADOC>
<root url="jar://$MAVEN_REPOSITORY$/io/springfox/springfox-swagger2/3.0.0/springfox-swagger2-3.0.0-javadoc.jar!/" />
</JAVADOC>
<SOURCES>
<root url="jar://$MAVEN_REPOSITORY$/io/springfox/springfox-swagger2/3.0.0/springfox-swagger2-3.0.0-sources.jar!/" />
</SOURCES>
</library>
</component>
\ No newline at end of file
<component name="libraryTable">
<library name="Maven: io.springfox:springfox-swagger-common:3.0.0">
<CLASSES>
<root url="jar://$MAVEN_REPOSITORY$/io/springfox/springfox-swagger-common/3.0.0/springfox-swagger-common-3.0.0.jar!/" />
</CLASSES>
<JAVADOC>
<root url="jar://$MAVEN_REPOSITORY$/io/springfox/springfox-swagger-common/3.0.0/springfox-swagger-common-3.0.0-javadoc.jar!/" />
</JAVADOC>
<SOURCES>
<root url="jar://$MAVEN_REPOSITORY$/io/springfox/springfox-swagger-common/3.0.0/springfox-swagger-common-3.0.0-sources.jar!/" />
</SOURCES>
</library>
</component>
\ No newline at end of file
<component name="libraryTable">
<library name="Maven: io.springfox:springfox-swagger-ui:3.0.0">
<CLASSES>
<root url="jar://$MAVEN_REPOSITORY$/io/springfox/springfox-swagger-ui/3.0.0/springfox-swagger-ui-3.0.0.jar!/" />
</CLASSES>
<JAVADOC>
<root url="jar://$MAVEN_REPOSITORY$/io/springfox/springfox-swagger-ui/3.0.0/springfox-swagger-ui-3.0.0-javadoc.jar!/" />
</JAVADOC>
<SOURCES>
<root url="jar://$MAVEN_REPOSITORY$/io/springfox/springfox-swagger-ui/3.0.0/springfox-swagger-ui-3.0.0-sources.jar!/" />
</SOURCES>
</library>
</component>
\ No newline at end of file
<component name="libraryTable">
<library name="Maven: io.swagger.core.v3:swagger-annotations:2.1.2">
<CLASSES>
<root url="jar://$MAVEN_REPOSITORY$/io/swagger/core/v3/swagger-annotations/2.1.2/swagger-annotations-2.1.2.jar!/" />
</CLASSES>
<JAVADOC>
<root url="jar://$MAVEN_REPOSITORY$/io/swagger/core/v3/swagger-annotations/2.1.2/swagger-annotations-2.1.2-javadoc.jar!/" />
</JAVADOC>
<SOURCES>
<root url="jar://$MAVEN_REPOSITORY$/io/swagger/core/v3/swagger-annotations/2.1.2/swagger-annotations-2.1.2-sources.jar!/" />
</SOURCES>
</library>
</component>
\ No newline at end of file
<component name="libraryTable">
<library name="Maven: io.swagger.core.v3:swagger-models:2.1.2">
<CLASSES>
<root url="jar://$MAVEN_REPOSITORY$/io/swagger/core/v3/swagger-models/2.1.2/swagger-models-2.1.2.jar!/" />
</CLASSES>
<JAVADOC>
<root url="jar://$MAVEN_REPOSITORY$/io/swagger/core/v3/swagger-models/2.1.2/swagger-models-2.1.2-javadoc.jar!/" />
</JAVADOC>
<SOURCES>
<root url="jar://$MAVEN_REPOSITORY$/io/swagger/core/v3/swagger-models/2.1.2/swagger-models-2.1.2-sources.jar!/" />
</SOURCES>
</library>
</component>
\ No newline at end of file
<component name="libraryTable">
<library name="Maven: io.swagger:swagger-annotations:1.5.20">
<CLASSES>
<root url="jar://$MAVEN_REPOSITORY$/io/swagger/swagger-annotations/1.5.20/swagger-annotations-1.5.20.jar!/" />
</CLASSES>
<JAVADOC>
<root url="jar://$MAVEN_REPOSITORY$/io/swagger/swagger-annotations/1.5.20/swagger-annotations-1.5.20-javadoc.jar!/" />
</JAVADOC>
<SOURCES>
<root url="jar://$MAVEN_REPOSITORY$/io/swagger/swagger-annotations/1.5.20/swagger-annotations-1.5.20-sources.jar!/" />
</SOURCES>
</library>
</component>
\ No newline at end of file
<component name="libraryTable">
<library name="Maven: io.swagger:swagger-models:1.5.20">
<CLASSES>
<root url="jar://$MAVEN_REPOSITORY$/io/swagger/swagger-models/1.5.20/swagger-models-1.5.20.jar!/" />
</CLASSES>
<JAVADOC>
<root url="jar://$MAVEN_REPOSITORY$/io/swagger/swagger-models/1.5.20/swagger-models-1.5.20-javadoc.jar!/" />
</JAVADOC>
<SOURCES>
<root url="jar://$MAVEN_REPOSITORY$/io/swagger/swagger-models/1.5.20/swagger-models-1.5.20-sources.jar!/" />
</SOURCES>
</library>
</component>
\ No newline at end of file
<component name="libraryTable">
<library name="Maven: org.mapstruct:mapstruct:1.3.1.Final">
<CLASSES>
<root url="jar://$MAVEN_REPOSITORY$/org/mapstruct/mapstruct/1.3.1.Final/mapstruct-1.3.1.Final.jar!/" />
</CLASSES>
<JAVADOC>
<root url="jar://$MAVEN_REPOSITORY$/org/mapstruct/mapstruct/1.3.1.Final/mapstruct-1.3.1.Final-javadoc.jar!/" />
</JAVADOC>
<SOURCES>
<root url="jar://$MAVEN_REPOSITORY$/org/mapstruct/mapstruct/1.3.1.Final/mapstruct-1.3.1.Final-sources.jar!/" />
</SOURCES>
</library>
</component>
\ No newline at end of file
<component name="libraryTable">
<library name="Maven: org.springframework.plugin:spring-plugin-core:2.0.0.RELEASE">
<CLASSES>
<root url="jar://$MAVEN_REPOSITORY$/org/springframework/plugin/spring-plugin-core/2.0.0.RELEASE/spring-plugin-core-2.0.0.RELEASE.jar!/" />
</CLASSES>
<JAVADOC>
<root url="jar://$MAVEN_REPOSITORY$/org/springframework/plugin/spring-plugin-core/2.0.0.RELEASE/spring-plugin-core-2.0.0.RELEASE-javadoc.jar!/" />
</JAVADOC>
<SOURCES>
<root url="jar://$MAVEN_REPOSITORY$/org/springframework/plugin/spring-plugin-core/2.0.0.RELEASE/spring-plugin-core-2.0.0.RELEASE-sources.jar!/" />
</SOURCES>
</library>
</component>
\ No newline at end of file
<component name="libraryTable">
<library name="Maven: org.springframework.plugin:spring-plugin-metadata:2.0.0.RELEASE">
<CLASSES>
<root url="jar://$MAVEN_REPOSITORY$/org/springframework/plugin/spring-plugin-metadata/2.0.0.RELEASE/spring-plugin-metadata-2.0.0.RELEASE.jar!/" />
</CLASSES>
<JAVADOC>
<root url="jar://$MAVEN_REPOSITORY$/org/springframework/plugin/spring-plugin-metadata/2.0.0.RELEASE/spring-plugin-metadata-2.0.0.RELEASE-javadoc.jar!/" />
</JAVADOC>
<SOURCES>
<root url="jar://$MAVEN_REPOSITORY$/org/springframework/plugin/spring-plugin-metadata/2.0.0.RELEASE/spring-plugin-metadata-2.0.0.RELEASE-sources.jar!/" />
</SOURCES>
</library>
</component>
\ No newline at end of file
// import util api call for cart order
import { sendOrderPost } from './../util/order-api';
export const SEND_USER_ORDER = "SEND_USER_ORDER"
const sendUserOrder = (orderConfirmationResponse) => ({
type: SEND_USER_ORDER,
payload: orderConfirmationResponse
})
export const dispatchOrderInfo = (orderInfo) => dispatch => sendOrderPost(orderInfo)
.then( response => dispatch(sendUserOrder(response.data)) )
// import React, {useState, useEffect} from 'react'
export default function PaymentMethod() {
export default function PaymentMethod(props) {
return (
<div>
PAYMENT METHOD COMPONENT
<div className="order-component" id="PaymentInput">
<div className="OrderDirectionsElement" id="PaymentLabel">
<p>Step 2 - Billing</p>
</div>
<div className="shippingInfoInput" id="cardNumberInput">
<input placeholder={props.cardNumber}
type="text"
onChange={(e) => props.captureCardNumber(e.target.value)}
className="input-text"
></input>
</div>
<div className="shippingInfoInput" id="cardholderNameInput">
<input placeholder={props.cardHolderName}
type="text"
onChange={(e) => props.captureCardHolderName(e.target.value)}
className="input-text"
></input>
</div>
<div className="shippingInfoInput" id="expirationDateInput">
<input placeholder={props.expirationDate}
type="text"
onChange={(e) => props.captureExpirationDate(e.target.value)}
className="input-text"
></input>
</div>
<div className="shippingInfoInput" id="cvvCodeInput">
<input placeholder={props.cvv}
type="text"
onChange={(e) => props.captureCVV(e.target.value)}
className="input-text"
></input>
</div>
</div>
)
}
// import React, {useState, useEffect} from 'react'
import React, { useState, useEffect } from 'react'
export default function ReviewOrder(props) {
let calcTotalBeforeTax = (itemsTotal, shippingTotal) => {
return parseFloat(itemsTotal) + parseFloat(shippingTotal)
}
let calcTaxAmount = (itemsTotal, shippingTotal, taxRate) => {
return calcTotalBeforeTax(itemsTotal, shippingTotal) * taxRate
}
let calcGrandTotal = (itemsTotal, shippingTotal, taxRate) => {
return calcTotalBeforeTax(itemsTotal, shippingTotal) * (parseFloat(1.00) + parseFloat(taxRate))
}
export default function ReviewOrder() {
return (
<div>
REVIEW ORDER COMPONENT
<div className="order-component" id="ReviewOrder">
<div className="OrderDirectionsElement" id="OrderSummary">
<p>Step 3 - Order Summary</p>
</div>
<div id="orderSummaryContainer">
<div className="OrderSummaryElement" id="itemsPrice">
<div>
Items ({props.numCartItems}):
</div>
<div>
${parseFloat(props.itemsTotal).toFixed(2)}
</div>
</div>
<div className="OrderSummaryElement" id="shippingHandling">
<div id="shippingHandlingLabel">
Shipping and Handling:
</div>
<div id="shippingHandlingPrice">
${parseFloat(props.shippingHandling).toFixed(2)}
</div>
</div>
<div className="OrderSummaryElement" id="beforeTax">
<div id="beforeTaxLabel">
Total Before Tax
</div>
<div id="beforeTaxPrice">
${calcTotalBeforeTax(props.itemsTotal, props.shippingHandling).toFixed(2)}
</div>
</div>
<div className="OrderSummaryElement" id="taxCalculated">
<div id="taxCalculatedLabel">
Estimated Tax:
</div>
<div id="taxCalculatedPrice">
${calcTaxAmount(props.itemsTotal, props.shippingHandling, props.taxRate).toFixed(2)}
</div>
</div>
<div className="OrderSummaryElement" id="orderTotal">
<div id="orderTotalLabel">
Order Total:
</div>
<div id="orderTotalPrice">
${calcGrandTotal(props.itemsTotal, props.shippingHandling, props.taxRate).toFixed(2)}
</div>
</div>
</div>
</div>
)
}
// import React, {useState, useEffect} from 'react'
export default function ShippingAddress() {
export default function ShippingAddress(props) {
return (
<div>
SHIPPING ADDRESS COMPONENT
<div className="order-component" id="shippingInput">
<div className="OrderDirectionsElement" id="ShippingLabel">
<p>Step 1 - Shipping</p>
</div>
<div className="shippingInfoInput" id="firstNameInput">
<input placeholder="First Name*"
type="text"
onChange={(e) => props.captureFirstName(e.target.value)}
className="input-text"
></input>
</div>
<div className="shippingInfoInput" id="lastNameInput">
<input placeholder="Last Name*"
type="text"
onChange={(e) => props.captureLastName(e.target.value)}
className="input-text"
></input>
</div>
<div className="shippingInfoInput" id="addressInput">
<input placeholder="Shipping Address*"
type="text"
onChange={(e) => props.captureShippingAddress(e.target.value)}
className="input-text"
></input>
</div>
<div className="shippingInfoInput" id="aptSuiteInput">
<input placeholder="Apt. / Suite no"
type="text"
onChange={(e) => props.captureAptSuiteNo(e.target.value)}
className="input-text"
></input>
</div>
<div className="shippingInfoInput" id="cityInput">
<input placeholder="City*"
type="text"
onChange={(e) => props.captureCity(e.target.value)}
className="input-text"
></input>
</div>
<div className="shippingInfoInput" id="stateInput">
<input placeholder="State*"
type="text"
onChange={(e) => props.captureState(e.target.value)}
className="input-text"
></input>
</div>
<div className="shippingInfoInput" id="zipCodeInput">
<input placeholder="Postal Code*"
type="text"
onChange={(e) => props.captureZipCode(e.target.value)}
className="input-text"
></input>
</div>
</div>
)
}
// import React, {useState, useEffect} from 'react'
import React, { useState, useEffect } from 'react'
export default function SubmitOrder() {
export default function SubmitOrder(props) {
let handleSubmitClick = (e) => {
console.log("Submit Button Clicked")
props.setSubmitButtonActive(1)
}
return (
<div>
SUBMIT ORDER COMPONENT
<div className="order-component" id="SubmitOrder">
<div className="OrderDirectionsElement" id="SubmitLabel">
<p>Step 4 - Checkout</p>
</div>
<div id="SubmitButtonContainer">
<p className="errorMessage">{(props.errorWhileValidating === 1 && props.allFieldsValidated[0] === 0)? 'One or more fields is missing a value' : ''}</p>
<button id="SubmitButtonInput" onClick={handleSubmitClick} >Submit Order</button>
</div>
</div>
)
}
* {
font-family: Arial, sans-serif;
}
#checkout-container {
height: 100vh;
width: 100%;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: center;
}
.OrderDirectionsElement {
font-size: 150%;
font-weight: bold;
}
.shippingInfoInput {
margin-bottom: 10px;
}
.input-text {
height: 40px;
width: 100%;
padding-left: 20px;
font-size: 120%;
}
.order-component {
border-top: 2px solid black;
min-width: 60%;
margin-bottom: 50px;
}
#orderSummaryContainer {
display: flex;
flex-direction: column;
width: 100%;
align-items: center;
justify-content: center;
margin-top: 50px;
}
.OrderSummaryElement {
display: flex;
flex-direction: row;
width: 40%;
justify-content: space-between;
margin-bottom: 10px;
font-size: 150%;
}
#orderTotal {
border-top: 2px solid black;
padding-top: 10px;
font-weight: bolder;
color: rgb(223, 5, 5);
}
#SubmitButtonContainer {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
margin-bottom: 100px;
margin-top: 75px;
}
#SubmitButtonInput {
width: 75%;
color: white;
background-color: black;
height: 80px;
font-size: 200%;
}
.errorMessage {
color: red;
font-weight: bold;
font-size: 120%;
}
\ No newline at end of file
import React, {useState, useEffect} from 'react'
import {useSelector, useDispatch} from 'react-redux'
import ShippingAddress from './ShippingAddress.js'
import PaymentMethod from './PaymentMethod.js'
import ReviewOrder from './ReviewOrder.js'
import SubmitOrder from './SubmitOrder.js'
import './checkout.css'
import {dispatchOrderInfo} from './../../actions/checkout_actions'
export default function Checkout() {
///////////////////////
// REDUX Global State
///////////////////////
// const {currentUser} = useSelector(state => state)
// const {cart} = useSelector(state => state)
///////////////////////
// Shipping Info State
///////////////////////
const [firstName, setFirstName] = useState([])
const [lastName, setLastName] = useState([])
const [shippingAddress, setShippingAddress] = useState([])
const [aptSuiteNo, setAptSuiteNo] = useState([])
const [city, setCity] = useState([])
const [state, setState] = useState([])
const [zipCode, setZipCode] = useState([])
///////////////////////
// Billing Info State
///////////////////////
const [cardNumber, setCardNumber] = useState(["123456789"])
const [cardHolderName, setCardHolderName] = useState(["Jane Doe"])
const [expirationDate, setExpirationDate] = useState(["05/20206"])
const [cvv, setCVV] = useState(["123"])
///////////////////////
// Order Review / Summary State
///////////////////////
const [numCartItems, setNumCartItems] = useState([3])
const [itemsTotal, setItemsTotal] = useState([87.65]) // arbitrary cart total
const [shippingHandling, setShippingHandling] = useState([8.00]) // arbitraty shipping and handling amount
const [taxRate, setTaxRate] = useState([0.0725]) // california tax rate
///////////////////////
// Submit Button State
///////////////////////
const [submitButtonActive, setSubmitButtonActive] = useState([0])
const [allFieldsValidated, setAllFieldsValidated] = useState([0])
const [errorWhileValidating, setErrorWhileValidating] = useState([0])
///////////////////////
// Submit Action State
///////////////////////
const dispatch = useDispatch()
// This effect listens for the submit button to be clicked
// It then checks each of the required fields to make sure they are non null
useEffect( () => {
// when submit button clicked after being inactive
if (submitButtonActive === 1) {
// fields to make sure are non-empty
let fieldsToCheck = [
firstName,
lastName,
shippingAddress,
city,
state,
zipCode,
// cardNumber,
// cardHolderName,
// expirationDate,
// cvv
]
// initially validated, gets flipped if required field is empty
let validated = 1
for (let i in fieldsToCheck) {
if (fieldsToCheck[i].length === 0) {
console.log("a required Field Value was empty")
validated = 0
break
}
}
// if validated, propogate to component state that all fields were validated
if (validated === 1) {
setAllFieldsValidated(1)
}
// if invalid, propogate to component state
else {
console.log("Failed to validate")
setErrorWhileValidating(1)
setSubmitButtonActive(0)
}
}
// when submit button gets reset from active to inactive
else if (submitButtonActive === 0) {
;
}
}, [submitButtonActive])
// This effect looks for the allFieldsValidated signal and fires off the order submission when complete
useEffect( () => {
handleSubmit()
console.log("Successful submission request")
}, [allFieldsValidated])
let handleSubmit = () => {
console.log("Submitting Order!")
// let order = {}
// order["firstName"] = firstName
// order["lastName"] = lastName
// order["shippingAddress"] = shippingAddress
// order["aptSuitNo"] = aptSuiteNo
// order["city"] = city
// order["state"] = state
// order["zipCode"] = zipCode
// order["cardNumber"] = cardNumber
// order["cardHolderName"] = cardHolderName
// order["expirationDate"] = expirationDate
// order["cvv"] = cvv
// console.log(order)
let chrisSpec = {
"user": {
"userId": "e-com-test-id",
"email": "test@test.test",
"firstName":"ecom",
"lastName":"test"
},
"address": {
"state": "IL",
"city": "chicago",
"zip": "90210",
"street": "Grand"
},
"cart": {
"id": "something",
"userId": "e-com-test-id",
"cartItems":[
{
"quantity": 2,
"productRef": {
"id": "something",
"sku": "AFP-1",
"upc": "00002"
}
}
]
}
}
dispatch(dispatchOrderInfo(chrisSpec))
}
// This watches for changes on any shipping input fields and prints the current states on any change
useEffect( () => {
console.log("======================================")
console.log("First Name: " + firstName)
console.log("Last Name: " + lastName)
console.log("Shipping Address: " + shippingAddress)
console.log("Apt Suite No: " + aptSuiteNo)
console.log("City: " + city)
console.log("State: " + state)
console.log("Zip: " + zipCode)
}, [firstName, lastName, shippingAddress, aptSuiteNo, city, state, zipCode])
// This watches for changes on any billing input fields and prints the current states on any change
useEffect( () => {
console.log("======================================")
console.log("Card Number: " + cardNumber)
console.log("Card Holder Name: " + cardHolderName)
console.log("Expiration Date: " + expirationDate)
console.log("CVV: " + cvv)
}, [cardNumber, cardHolderName, expirationDate, cvv])
return (
<div id="checkout-container">
{/* Collects User's shipping info */}
<ShippingAddress
captureFirstName={setFirstName}
captureLastName={setLastName}
captureShippingAddress={setShippingAddress}
captureAptSuiteNo={setAptSuiteNo}
captureCity={setCity}
captureState={setState}
captureZipCode={setZipCode}
/>
{/* Collects User's payment info */}
<PaymentMethod
cardNumber={cardNumber}
cardHolderName={cardHolderName}
expirationDate={expirationDate}
cvv={cvv}
captureCardNumber={setCardNumber}
captureCardHolderName={setCardHolderName}
captureExpirationDate={setExpirationDate}
captureCVV={setCVV}
/>
{/* Displays info about order. Calculates price with tax / shipping applied */}
<ReviewOrder
numCartItems={numCartItems}
itemsTotal={itemsTotal}
shippingHandling={shippingHandling}
taxRate={taxRate}
/>
{/* Request to submit happens here, initiates input validation and sends if success */}
<SubmitOrder
submitButtonActive={submitButtonActive}
setSubmitButtonActive={setSubmitButtonActive}
errorWhileValidating={errorWhileValidating}
allFieldsValidated={allFieldsValidated}
/>
</div>
)
}
// import React, {useState, useEffect} from 'react'
// import ShippingAddress from './ShippingAddress.js'
// import PaymentMethod from './PaymentMethod.js'
// import ReviewOrder from './ReviewOrder.js'
// import SubmitOrder from './SubmitOrder.js'
export default function checkout() {
return (
<div>
</div>
)
}
/*
1. Shipping Address
2. Payment Method
3. Review Order
4. Submit Order
*/
\ No newline at end of file
......@@ -3,7 +3,15 @@ import React, { Component } from 'react'
export default class ProductDetails extends Component {
constructor(props) {
super(props)
this.state = {}
this.state = {
orderItemQuantity: 1,
}
}
handleChange(type) {
return e => {
this.setState({ [type]: e.target.value })
}
}
handleSubmit(e, product) {
......@@ -12,6 +20,15 @@ export default class ProductDetails extends Component {
userId: this.props.user.currentUser.email,
cartItems: JSON.parse(JSON.stringify(this.props.cart)) // JSON.parse/stringify will deep-dup the object
})
for (let i = 0; i < newCart.cartItems.length; i++) {
let item = newCart.cartItems[i];
if(item.productRef.sku === product.sku) {
item.quantity += parseInt(this.state.orderItemQuantity)
this.props.addToCart(newCart, this.props.user.currentUser.email)
.then(() => this.props.closeModal(e))
return;
}
}
const newCartItem = {
productRef: {
id: product.sku,
......@@ -21,7 +38,8 @@ export default class ProductDetails extends Component {
quantity: parseInt(this.state.orderItemQuantity)
}
newCart.cartItems.push(newCartItem);
this.props.addToCart(newCart, this.props.user.currentUser.email);
this.props.addToCart(newCart, this.props.user.currentUser.email)
.then(() => this.props.closeModal(e))
}
render() {
......@@ -69,7 +87,9 @@ export default class ProductDetails extends Component {
type="number"
className="prod-details-quantity"
disabled={ !this.props.user?.currentUser }
onChange={this.handleChange("orderItemQuantity")}
placeholder="Quantity"
value={ this.state.orderItemQuantity }
/>
<button className="prod-details-add-to-cart" disabled={ !this.props.user?.currentUser }>
Add to Cart
......
......@@ -141,6 +141,8 @@ export default class ProductItem extends Component {
discount={ discount }
user={ this.props.user }
addToCart={ this.props.addToCart }
cart={ this.props.cart }
closeModal={ this.toggleDetailsModal }
/>
</Modal>
</div>
......
import {SEND_USER_ORDER} from './../actions/checkout_actions'
const initialState = {
orderResponse: {},
}
const orderReducer = (prevState = initialState, action) => {
Object.freeze(prevState);
const nextState = {...prevState};
switch(action.type) {
case SEND_USER_ORDER:
nextState.orderResponse = action.payload
return nextState
default:
return nextState
}
}
export default orderReducer
\ No newline at end of file
import { combineReducers } from 'redux';
import productsReducer from './products_reducer';
import orderReducer from './order_reducer'
import userReducer from './user_reducer'
import cartReducer from './cart_reducer';
const rootReducer = combineReducers({
market: productsReducer,
user: userReducer,
cart: cartReducer
cart: cartReducer,
orderStatus: orderReducer
});
export default rootReducer;
\ No newline at end of file
import axios from 'axios'
export const sendOrderPost = (order) => {
return axios.post("http://localhost:8080/api/orders", order)
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment