home content changes

api/transaction/transaction.js

@@ -0,0 +1,155 @@
+import apollo from "../../lib/apollo.js";
+
+async function getTransaction(token = "") {
+  var res = await apollo.query(
+    `
+    query {
+      transactions{
+        id
+        order_id
+        cust_name
+        cust_telp
+        cust_address
+        product_img{
+          url
+        }
+        product_name
+        product_color
+        product_quantity
+        product_courier
+        product_price
+      }
+    }`,
+    token
+  );
+  return res;
+}
+
+async function getTransactionUnpaid(token = "") {
+  var res = await apollo.query(
+    `
+    query {
+      transactions(where: { status: "1" }){
+        id
+        order_id
+        cust_name
+        cust_telp
+        cust_address
+        product_img{
+          url
+        }
+        product_name
+        product_color
+        product_quantity
+        product_courier
+        product_price
+      }
+    }`,
+    token
+  );
+  return res;
+}
+
+async function getTransactionPrepared(token = "") {
+  var res = await apollo.query(
+    `
+    query {
+      transactions(where: { status: "2" }){
+        id
+        order_id
+        cust_name
+        cust_telp
+        cust_address
+        product_img{
+          url
+        }
+        product_name
+        product_color
+        product_quantity
+        product_courier
+        product_price
+      }
+    }`,
+    token
+  );
+  return res;
+}
+
+async function getTransactionSending(token = "") {
+  var res = await apollo.query(
+    `
+    query {
+      transactions(where: { status: "3" }){
+        id
+        order_id
+        cust_name
+        cust_telp
+        cust_address
+        product_img{
+          url
+        }
+        product_name
+        product_color
+        product_quantity
+        product_courier
+        product_price
+      }
+    }`,
+    token
+  );
+  return res;
+}
+
+async function getTransactionFinished(token = "") {
+  var res = await apollo.query(
+    `
+    query {
+      transactions(where: { status: "4" }){
+        id
+        order_id
+        cust_name
+        cust_telp
+        cust_address
+        product_img{
+          url
+        }
+        product_name
+        product_color
+        product_quantity
+        product_courier
+        product_price
+      }
+    }`,
+    token
+  );
+  return res;
+}
+
+async function newTransaction(content, token="") {
+    var res = await apollo.mutation(
+        `
+        mutation($input : TransactionInput!){
+            createTransaction( input:{data:$input} )
+            {
+                transaction{
+                    id
+                }
+            }
+        }
+        `,
+        token,
+		{
+		input: content,
+		}
+    );
+	return res;
+}
+
+module.exports = {
+	newTransaction: newTransaction,
+    getTransaction:getTransaction,
+    getTransactionUnpaid:getTransactionUnpaid,
+    getTransactionPrepared:getTransactionPrepared,
+    getTransactionSending:getTransactionSending,
+    getTransactionFinished:getTransactionFinished,
+};

assets/jss/nextjs-material-kit/components/headerLinksStyle.js

@@ -24,11 +24,10 @@ const headerLinksStyle = theme => ({
     [theme.breakpoints.down("sm")]: {
       width: "100%",
       "&:after": {
-        width: "calc(100% - 30px)",
+        width: "100%",
         content: '""',
         display: "block",
         height: "1px",
-        marginLeft: "15px",
         backgroundColor: "#e5e5e5"
       }
     }
@@ -69,7 +68,6 @@ const headerLinksStyle = theme => ({
       margin: "5px 15px"
     },
     color: "#FFF",
-    padding: "0.9375rem",
     fontWeight: "400",
     fontSize: "12px",
     textTransform: "uppercase",

assets/jss/nextjs-material-kit/pages/componentsSections/homeStyle.js

@@ -6,7 +6,6 @@ const notificationsStyles = {
         display: "block",
         width: "100%",
         position: "relative",
-        padding: "0"
     },
     title: {
         ...title,

components/Footer/Footer.js

@@ -1,16 +1,10 @@
-/*eslint-disable*/
 import React from "react";
-// nodejs library to set properties for components
 import PropTypes from "prop-types";
-// nodejs library that concatenates classes
 import classNames from "classnames";
-// material-ui core components
 import { List, ListItem } from "@material-ui/core";
 import { makeStyles } from "@material-ui/core/styles";
 
-// @material-ui/icons
 import Favorite from "@material-ui/icons/Favorite";
-
 import GridContainer from "components/Grid/GridContainer.js";
 import Grid from '@material-ui/core/Grid';
 import GridItem from "components/Grid/GridItem.js";
@@ -18,39 +12,30 @@ import Paper from '@material-ui/core/Paper';
 import Card from "components/Card/Card.js";
 import styles from "assets/jss/nextjs-material-kit/components/footerStyle.js";
 
-// import iconfb from "assets/img/sosmed/iconfb.png";
-// import iconig from "assets/img/sosmed/iconig.png";
-// import icontwt from "assets/img/sosmed/icontwt.png";
-// import iconyt from "assets/img/sosmed/iconyt.png";
-
 const useStyles = makeStyles(styles);
 
 export default function Footer(props) {
-  const classes = useStyles();
-  const { whiteFont } = props;
-  const footerClasses = classNames({
-    [classes.footer]: true,
-    [classes.footerWhiteFont]: whiteFont
-  });
-  const aClasses = classNames({
-    [classes.a]: true,
-    [classes.footerWhiteFont]: whiteFont
-  });
-  return (
-    <div>
-    <GridContainer style={{padding: "40px"}} justify="center">
-      <Grid>
-        <div align="center" style={{marginTop:"-20px"}}>
-          <img className={classes.imgCard} src="https://1.bp.blogspot.com/-GTTVvnJ9x0c/Wn70CJxGoYI/AAAAAAAACRY/GSv1ehPFOPQZcvOfiALy_p7Xa7GOBRHKgCLcBGAs/s320/TB.pn" style={{width:"350px"}}/>
-          <img className={classes.imgCard} src="https://belimotoryuk.com/wp-content/uploads/2017/03/cropped-logo-yamaha.png" style={{width:"350px"}}/>
-        </div>
-      </Grid>
-      <Grid>
-        <div>
-          <footer className={footerClasses}>
-            <div className={classes.container}>
-              <div className={classes.left}>
-                <List className={classes.list}>
+    const classes = useStyles();
+    const { whiteFont } = props;
+    const footerClasses = classNames({
+      [classes.footer]: true,
+      [classes.footerWhiteFont]: whiteFont
+    });
+    const aClasses = classNames({
+      [classes.a]: true,
+      [classes.footerWhiteFont]: whiteFont
+    });
+    return (
+        <GridItem xs={12}>
+            <div align="center" style={{marginTop:"-20px"}}>
+                <br></br>
+                <div align="center" style={{marginTop:"-20px"}}>
+                  <img className={classes.imgCard} src="https://1.bp.blogspot.com/-GTTVvnJ9x0c/Wn70CJxGoYI/AAAAAAAACRY/GSv1ehPFOPQZcvOfiALy_p7Xa7GOBRHKgCLcBGAs/s320/TB.pn" style={{width:"350px"}}/>
+                  <img className={classes.imgCard} src="https://belimotoryuk.com/wp-content/uploads/2017/03/cropped-logo-yamaha.png" style={{width:"350px"}}/>
+                </div>
+            </div><br/>
+            <div align="center">
+            <List className={classes.list}>
                   <ListItem className={classes.inlineBlock}>
                     <a href="/yamaha/home" className={classes.block} > Home </a>
                   </ListItem>
@@ -88,51 +73,30 @@ export default function Footer(props) {
                     <a href="/yamaha/about_us/aboutus" className={classes.block}> About Us </a>
                   </ListItem>
                 </List>
-              </div>
             </div>
-          </footer>
-        </div>
-      </Grid>
-    </GridContainer>
-    <GridContainer style={{marginTop: "-100px", padding:"50px"}} justify="center">
-      <Grid>
-        <div>
-          <footer className={footerClasses}>
-            <div className={classes.container}>
-              <div className={classes.left}>
-              <List className={classes.list}>
-                  <ListItem className={classes.inlineBlock}>
-                        <a href="#" className={classes.block} >Facebook</a>
+            <div align="center">
+                <List className={classes.list}>
+                    <ListItem className={classes.inlineBlock}>
+                        <a href="#" target="_blank" className={classes.block} >Facebook</a>
                     </ListItem>
                     <ListItem className={classes.inlineBlock}>
-                        <a href="#" className={classes.block}>Instagram</a>
+                        <a href="#" target="_blank" className={classes.block}>Instagram</a>
                     </ListItem>
                     <ListItem className={classes.inlineBlock}>
-                        <a href="#" className={classes.block}>Twitter</a>
+                        <a href="#" target="_blank" className={classes.block}>Twitter</a>
                     </ListItem>
                     <ListItem className={classes.inlineBlock}>
-                        <a href="//#endregion" className={classes.block}>Youtube</a>
+                        <a href="#" target="_blank" className={classes.block}>Youtube</a>
                     </ListItem>
                 </List>
-              </div>
-            </div>
-          </footer>
-        </div>
-      </Grid>
-    </GridContainer>
-    <GridContainer style={{marginTop: "-40px"}} justify="center">
-    <Grid>
-      <div align="center">
-      <div className={classes.right}>
-              &copy; {1900 + new Date().getYear()} , All Right Reserved{" "} by{" "} @Thamrin Group Company
-          </div>
-      </div>
-    </Grid>
-  </GridContainer>
-  </div>
-  );
+            </div><br/><br/>
+            <div align="center">
+                &copy; {1900 + new Date().getYear()} , All Right Reserved{" "} by{" "} @Thamrin Brothers
+            </div><br/><br/>
+        </GridItem>
+    );
 }
 
 Footer.propTypes = {
-  whiteFont: PropTypes.bool
+    whiteFont: PropTypes.bool
 };

components/Footer/FooterHino.js

@@ -2,26 +2,16 @@
 import React from "react";
 // nodejs library to set properties for components
 import PropTypes from "prop-types";
-// nodejs library that concatenates classes
 import classNames from "classnames";
-// material-ui core components
 import { List, ListItem } from "@material-ui/core";
 import { makeStyles } from "@material-ui/core/styles";
 
-// @material-ui/icons
-import Favorite from "@material-ui/icons/Favorite";
-
-import GridContainer from "components/Grid/GridContainer.js";
-import Grid from '@material-ui/core/Grid';
-import Paper from '@material-ui/core/Paper';
-import Card from "components/Card/Card.js";
+import GridItem from "components/Grid/GridItem.js";
 import styles from "assets/jss/nextjs-material-kit/components/footerStyle.js";
-
 import CLM from "assets/img/clm.png";
 import Hino from "assets/img/logohino.png";
 
 const useStyles = makeStyles(styles);
-
 export default function Footer(props) {
     const classes = useStyles();
     const { whiteFont } = props;
@@ -34,98 +24,53 @@ export default function Footer(props) {
         [classes.footerWhiteFont]: whiteFont
     });
     return (
-        <div><br/>
-            <GridContainer justify="center">
-                <Grid style={{padding:"25px"}}>
-                    <br/>
-                    <img className={classes.imgCard} src={CLM} style={{width:"200px"}}/>
-                </Grid>
-                <Grid style={{padding:"25px"}}>
-                    <img className={classes.imgCard} src={Hino} style={{width:"250px"}}/>
-                </Grid>
-            </GridContainer>
-            <GridContainer justify="center">
-                <Grid style={{padding:"25px", marginTop:"-50px"}}>
-                    <footer className={footerClasses}>
-                        <div className={classes.container}>
-                            <div className={classes.left}>
-                                <List className={classes.list}>
-                                <ListItem className={classes.inlineBlock}>
-                                    <a href="/suzuki/home" className={classes.block} > Home </a>
-                                </ListItem>
-                                <ListItem className={classes.inlineBlock}>
-                                    <a href="/suzuki/product/product" className={classes.block}> Product </a>
-                                </ListItem>
-                                {/* <ListItem className={classes.inlineBlock}>
-                                    <a href="/suzuki/product/ygp" className={classes.block}> YGP </a>
-                                </ListItem>
-                                <ListItem className={classes.inlineBlock}>
-                                    <a href="/suzuki/product/yamalube" className={classes.block}> Yamalube </a>
-                                </ListItem>
-                                <ListItem className={classes.inlineBlock}>
-                                    <a href="/suzuki/product/apparel" className={classes.block}> Apparel </a>
-                                </ListItem>
-                                <ListItem className={classes.inlineBlock}>
-                                    <a href="/suzuki/product/helmet" className={classes.block}> Helmet </a>
-                                </ListItem>
-                                <ListItem className={classes.inlineBlock}>
-                                    <a href="/suzuki/product/accessories" className={classes.block}> Accessories </a>
-                                </ListItem>
-                                <ListItem className={classes.inlineBlock}>
-                                    <a href="/suzuki/product/service" className={classes.block}> Service </a>
-                                </ListItem>
-                                <ListItem className={classes.inlineBlock}>
-                                    <a href="/suzuki/product/dealer" className={classes.block}> Dealer </a>
-                                </ListItem> */}
-                                <ListItem className={classes.inlineBlock}>
-                                    <a href="/suzuki/latestsnews" className={classes.block}> Latest News </a>
-                                </ListItem>
-                                <ListItem className={classes.inlineBlock}>
-                                    <a href="/suzuki/carrer" className={classes.block}> Carrer </a>
-                                </ListItem>
-                                <ListItem className={classes.inlineBlock}>
-                                    <a href="/suzuki/about_us/aboutus" className={classes.block}> About Us </a>
-                                </ListItem>
-                                </List>
-                            </div>
-                        </div>
-                    </footer>
-                </Grid>
-            </GridContainer>
-            <GridContainer style={{marginTop: "-100px", padding:"50px"}} justify="center">
-            <Grid>
-                <div>
-                <footer className={footerClasses}>
-                    <div className={classes.container}>
-                    <div className={classes.left}>
-                    <List className={classes.list}>
-                        <ListItem className={classes.inlineBlock}>
-                            <a href="#" className={classes.block} >Facebook</a>
-                        </ListItem>
-                        <ListItem className={classes.inlineBlock}>
-                            <a href="#" className={classes.block}>Instagram</a>
-                        </ListItem>
-                        <ListItem className={classes.inlineBlock}>
-                            <a href="#" className={classes.block}>Twitter</a>
-                        </ListItem>
-                        <ListItem className={classes.inlineBlock}>
-                            <a href="//#endregion" className={classes.block}>Youtube</a>
-                        </ListItem>
-                        </List>
-                    </div>
-                    </div>
-                </footer>
+        <GridItem xs={12}>
+            <div align="center" style={{marginTop:"-20px"}}>
+                <br/><br/><br/>
+                <div align="center" style={{marginTop:"-20px"}}>
+                    <img className={classes.imgCard} src={CLM}style={{width:"250px", padding:"20px"}}/>
+                    <img className={classes.imgCard} src={Hino} style={{width:"250px", padding:"20px"}}/>
                 </div>
-            </Grid>
-            </GridContainer>
-            <GridContainer justify="center">
-                <Grid style={{padding:"25px", marginTop:"-50px"}}>
-                    <div className={classes.right}>
-                        &copy; {1900 + new Date().getYear()} , All Right Reserved{" "} by{" "} @Thamrin Group Company
-                    </div>
-                </Grid>
-            </GridContainer>
-        </div>
+            </div><br/>
+            <div align="center">
+                <List className={classes.list}>
+                    <ListItem className={classes.inlineBlock}>
+                        <a href="/suzuki/home" className={classes.block} > Home </a>
+                    </ListItem>
+                    <ListItem className={classes.inlineBlock}>
+                        <a href="/suzuki/product/product" className={classes.block}> Product </a>
+                    </ListItem>
+                    <ListItem className={classes.inlineBlock}>
+                        <a href="/suzuki/latestsnews" className={classes.block}> Latest News </a>
+                    </ListItem>
+                    <ListItem className={classes.inlineBlock}>
+                        <a href="/suzuki/carrer" className={classes.block}> Carrer </a>
+                    </ListItem>
+                    <ListItem className={classes.inlineBlock}>
+                        <a href="/suzuki/about_us/aboutus" className={classes.block}> About Us </a>
+                    </ListItem>
+                </List>
+            </div>
+            <div align="center">
+                <List className={classes.list}>
+                    <ListItem className={classes.inlineBlock}>
+                        <a href="#" target="_blank" className={classes.block} >Facebook</a>
+                    </ListItem>
+                    <ListItem className={classes.inlineBlock}>
+                        <a href="#" target="_blank" className={classes.block}>Instagram</a>
+                    </ListItem>
+                    <ListItem className={classes.inlineBlock}>
+                        <a href="#" target="_blank" className={classes.block}>Twitter</a>
+                    </ListItem>
+                    <ListItem className={classes.inlineBlock}>
+                        <a href="#" target="_blank" className={classes.block}>Youtube</a>
+                    </ListItem>
+                </List>
+            </div><br/><br/>
+            <div align="center">
+                &copy; {1900 + new Date().getYear()} , All Right Reserved{" "} by{" "} @Thamrin Brothers
+            </div><br/><br/>
+        </GridItem>
     );
 }
 

components/Footer/FooterHome.js

@@ -1,30 +1,19 @@
 /*eslint-disable*/
 import React from "react";
-// nodejs library to set properties for components
 import PropTypes from "prop-types";
-// nodejs library that concatenates classes
 import classNames from "classnames";
-// material-ui core components
 import { List, ListItem } from "@material-ui/core";
 import { makeStyles } from "@material-ui/core/styles";
 
-// @material-ui/icons
 import Favorite from "@material-ui/icons/Favorite";
-
 import GridContainer from "components/Grid/GridContainer.js";
 import Grid from '@material-ui/core/Grid';
 import GridItem from "components/Grid/GridItem.js";
 import Paper from '@material-ui/core/Paper';
 import Card from "components/Card/Card.js";
 import styles from "assets/jss/nextjs-material-kit/components/footerStyle.js";
-
 import Logo from "assets/img/White.png";
 
-// import iconfb from "assets/img/sosmed/iconfb.png";
-// import iconig from "assets/img/sosmed/iconig.png";
-// import icontwt from "assets/img/sosmed/icontwt.png";
-// import iconyt from "assets/img/sosmed/iconyt.png";
-
 const useStyles = makeStyles(styles);
 
 export default function Footer(props) {
@@ -39,20 +28,13 @@ export default function Footer(props) {
         [classes.footerWhiteFont]: whiteFont
     });
     return (
-        <div>
-        <GridContainer style={{padding: "40px"}} justify="center">
-        <Grid>
+        <GridItem xs={12}>
             <div align="center" style={{marginTop:"-20px"}}>
                 <br></br>
-            <img className={classes.imgCard} src={Logo} style={{width:"500px"}}/>
-            </div>
-        </Grid>
-        <Grid>
-            <div>
-            <footer className={footerClasses}>
-                <div className={classes.container}>
-                <div className={classes.left}>
-                    <List className={classes.list}>
+                <img className={classes.imgCard} src={Logo} style={{width:"500px"}}/>
+            </div><br/><br/>
+            <div align="center">
+                <List className={classes.list}>
                     <ListItem className={classes.inlineBlock}>
                         <a href="/yamaha/home" target="_blank" className={classes.block} > Yamaha </a>
                     </ListItem>
@@ -80,19 +62,9 @@ export default function Footer(props) {
                     <ListItem className={classes.inlineBlock}>
                         <a href="http://homes.thamrin.xyz/" target="_blank" className={classes.block}> Thamrin Homes </a>
                     </ListItem>
-                    </List>
-                </div>
-                </div>
-            </footer>
+                </List>
             </div>
-        </Grid>
-        </GridContainer>
-        <GridContainer style={{marginTop: "-100px", padding:"50px"}} justify="center">
-        <Grid>
-            <div>
-            <footer className={footerClasses}>
-                <div className={classes.container}>
-                <div className={classes.left}>
+            <div align="center">
                 <List className={classes.list}>
                     <ListItem className={classes.inlineBlock}>
                         <a href="#" target="_blank" className={classes.block} >Facebook</a>
@@ -106,23 +78,12 @@ export default function Footer(props) {
                     <ListItem className={classes.inlineBlock}>
                         <a href="#" target="_blank" className={classes.block}>Youtube</a>
                     </ListItem>
-                    </List>
-                </div>
-                </div>
-            </footer>
-            </div>
-        </Grid>
-        </GridContainer>
-        <GridContainer style={{marginTop: "-40px"}} justify="center">
-        <Grid>
-        <div align="center">
-        <div className={classes.right}>
+                </List>
+            </div><br/><br/>
+            <div align="center">
                 &copy; {1900 + new Date().getYear()} , All Right Reserved{" "} by{" "} @Thamrin Group Company
-            </div>
-        </div>
-        </Grid>
-    </GridContainer>
-    </div>
+            </div><br/><br/>
+        </GridItem>
     );
 }
 

components/Footer/FooterHonda.js

@@ -1,22 +1,17 @@
 /*eslint-disable*/
 import React from "react";
-// nodejs library to set properties for components
 import PropTypes from "prop-types";
-// nodejs library that concatenates classes
 import classNames from "classnames";
-// material-ui core components
 import { List, ListItem } from "@material-ui/core";
 import { makeStyles } from "@material-ui/core/styles";
 
-// @material-ui/icons
 import Favorite from "@material-ui/icons/Favorite";
-
 import GridContainer from "components/Grid/GridContainer.js";
 import Grid from '@material-ui/core/Grid';
+import GridItem from "components/Grid/GridItem.js";
 import Paper from '@material-ui/core/Paper';
 import Card from "components/Card/Card.js";
 import styles from "assets/jss/nextjs-material-kit/components/footerStyle.js";
-import NSCB from "assets/img/nscb.png";
 
 const useStyles = makeStyles(styles);
 
@@ -32,97 +27,74 @@ export default function Footer(props) {
         [classes.footerWhiteFont]: whiteFont
     });
     return (
-        <div><br/>
-            <GridContainer justify="center">
-                <Grid style={{padding:"25px"}}>
-                    <img className={classes.imgCard} src="https://cdn.pixabay.com/photo/2016/08/15/18/18/honda-1596081_640.png" style={{width:"300px"}}/>
-                </Grid>
-                <Grid style={{padding:"25px"}}>
-                    <img className={classes.imgCard} src="https://cdn.pixabay.com/photo/2016/08/15/18/18/honda-1596081_640.png" style={{width:"300px"}}/>
-                </Grid>
-            </GridContainer>
-            <GridContainer justify="center">
-                <Grid style={{padding:"25px", marginTop:"-50px"}}>
-                    <footer className={footerClasses}>
-                        <div className={classes.container}>
-                            <div className={classes.left}>
-                                <List className={classes.list}>
-                                <ListItem className={classes.inlineBlock}>
-                                    <a href="/suzuki/home" className={classes.block} > Home </a>
-                                </ListItem>
-                                <ListItem className={classes.inlineBlock}>
-                                    <a href="/suzuki/product/product" className={classes.block}> Product </a>
-                                </ListItem>
-                                {/* <ListItem className={classes.inlineBlock}>
-                                    <a href="/suzuki/product/ygp" className={classes.block}> YGP </a>
-                                </ListItem>
-                                <ListItem className={classes.inlineBlock}>
-                                    <a href="/suzuki/product/yamalube" className={classes.block}> Yamalube </a>
-                                </ListItem>
-                                <ListItem className={classes.inlineBlock}>
-                                    <a href="/suzuki/product/apparel" className={classes.block}> Apparel </a>
-                                </ListItem>
-                                <ListItem className={classes.inlineBlock}>
-                                    <a href="/suzuki/product/helmet" className={classes.block}> Helmet </a>
-                                </ListItem>
-                                <ListItem className={classes.inlineBlock}>
-                                    <a href="/suzuki/product/accessories" className={classes.block}> Accessories </a>
-                                </ListItem>
-                                <ListItem className={classes.inlineBlock}>
-                                    <a href="/suzuki/product/service" className={classes.block}> Service </a>
-                                </ListItem>
-                                <ListItem className={classes.inlineBlock}>
-                                    <a href="/suzuki/product/dealer" className={classes.block}> Dealer </a>
-                                </ListItem> */}
-                                <ListItem className={classes.inlineBlock}>
-                                    <a href="/suzuki/latestsnews" className={classes.block}> Latest News </a>
-                                </ListItem>
-                                <ListItem className={classes.inlineBlock}>
-                                    <a href="/suzuki/carrer" className={classes.block}> Carrer </a>
-                                </ListItem>
-                                <ListItem className={classes.inlineBlock}>
-                                    <a href="/suzuki/about_us/aboutus" className={classes.block}> About Us </a>
-                                </ListItem>
-                                </List>
-                            </div>
-                        </div>
-                    </footer>
-                </Grid>
-            </GridContainer>
-            <GridContainer style={{marginTop: "-100px", padding:"50px"}} justify="center">
-            <Grid>
-                <div>
-                <footer className={footerClasses}>
-                    <div className={classes.container}>
-                    <div className={classes.left}>
-                        <List className={classes.list}>
-                            <ListItem className={classes.inlineBlock}>
-                                <a href="#" className={classes.block} >Facebook</a>
-                            </ListItem>
-                            <ListItem className={classes.inlineBlock}>
-                                <a href="#" className={classes.block}>Instagram</a>
-                            </ListItem>
-                            <ListItem className={classes.inlineBlock}>
-                                <a href="#" className={classes.block}>Twitter</a>
-                            </ListItem>
-                            <ListItem className={classes.inlineBlock}>
-                                <a href="//#endregion" className={classes.block}>Youtube</a>
-                            </ListItem>
-                        </List>
-                    </div>
-                    </div>
-                </footer>
-                </div>
-            </Grid>
-            </GridContainer>
-            <GridContainer justify="center">
-                <Grid style={{padding:"25px", marginTop:"-50px"}}>
-                    <div className={classes.right}>
-                        &copy; {1900 + new Date().getYear()} , All Right Reserved{" "} by{" "} @Thamrin Group Company
+        <GridItem xs={12}>
+            <div align="center" style={{marginTop:"-20px"}}>
+                <br/><br/><br/>
+                <div align="center" style={{marginTop:"-20px"}}>
+                    <img className={classes.imgCard} src="https://cdn.pixabay.com/photo/2016/08/15/18/18/honda-1596081_640.png" style={{width:"300px", padding:"20px"}}/>
+                    <img className={classes.imgCard} src="https://cdn.pixabay.com/photo/2016/08/15/18/18/honda-1596081_640.png" style={{width:"300px", padding:"20px"}}/>
                     </div>
-                </Grid>
-            </GridContainer>
-        </div>
+                </div><br/>
+                <div align="center">
+                <List className={classes.list}>
+                    <ListItem className={classes.inlineBlock}>
+                        <a href="/honda/home" className={classes.block} > Home </a>
+                    </ListItem>
+                    <ListItem className={classes.inlineBlock}>
+                        <a href="/honda/product/product" className={classes.block}> Product </a>
+                    </ListItem>
+                    {/* <ListItem className={classes.inlineBlock}>
+                        <a href="/honda/product/ygp" className={classes.block}> YGP </a>
+                    </ListItem>
+                    <ListItem className={classes.inlineBlock}>
+                        <a href="/honda/product/yamalube" className={classes.block}> Yamalube </a>
+                    </ListItem>
+                    <ListItem className={classes.inlineBlock}>
+                        <a href="/honda/product/apparel" className={classes.block}> Apparel </a>
+                    </ListItem>
+                    <ListItem className={classes.inlineBlock}>
+                        <a href="/honda/product/helmet" className={classes.block}> Helmet </a>
+                    </ListItem>
+                    <ListItem className={classes.inlineBlock}>
+                        <a href="/honda/product/accessories" className={classes.block}> Accessories </a>
+                    </ListItem>
+                    <ListItem className={classes.inlineBlock}>
+                        <a href="/honda/product/service" className={classes.block}> Service </a>
+                    </ListItem>
+                    <ListItem className={classes.inlineBlock}>
+                        <a href="/honda/product/dealer" className={classes.block}> Dealer </a>
+                    </ListItem> */}
+                    <ListItem className={classes.inlineBlock}>
+                        <a href="/honda/latestsnews" className={classes.block}> Latest News </a>
+                    </ListItem>
+                    <ListItem className={classes.inlineBlock}>
+                        <a href="/honda/carrer" className={classes.block}> Carrer </a>
+                    </ListItem>
+                    <ListItem className={classes.inlineBlock}>
+                        <a href="/honda/about_us/aboutus" className={classes.block}> About Us </a>
+                    </ListItem>
+                </List>
+            </div>
+            <div align="center">
+                <List className={classes.list}>
+                    <ListItem className={classes.inlineBlock}>
+                        <a href="#" target="_blank" className={classes.block} >Facebook</a>
+                    </ListItem>
+                    <ListItem className={classes.inlineBlock}>
+                        <a href="#" target="_blank" className={classes.block}>Instagram</a>
+                    </ListItem>
+                    <ListItem className={classes.inlineBlock}>
+                        <a href="#" target="_blank" className={classes.block}>Twitter</a>
+                    </ListItem>
+                    <ListItem className={classes.inlineBlock}>
+                        <a href="#" target="_blank" className={classes.block}>Youtube</a>
+                    </ListItem>
+                </List>
+            </div><br/><br/>
+            <div align="center">
+                &copy; {1900 + new Date().getYear()} , All Right Reserved{" "} by{" "} @Thamrin Brothers
+            </div><br/><br/>
+        </GridItem>
     );
 }
 

components/Footer/FooterSuzuki.js

@@ -1,25 +1,20 @@
-/*eslint-disable*/
 import React from "react";
-// nodejs library to set properties for components
 import PropTypes from "prop-types";
-// nodejs library that concatenates classes
 import classNames from "classnames";
-// material-ui core components
 import { List, ListItem } from "@material-ui/core";
 import { makeStyles } from "@material-ui/core/styles";
 
-// @material-ui/icons
 import Favorite from "@material-ui/icons/Favorite";
-
 import GridContainer from "components/Grid/GridContainer.js";
 import Grid from '@material-ui/core/Grid';
+import GridItem from "components/Grid/GridItem.js";
 import Paper from '@material-ui/core/Paper';
 import Card from "components/Card/Card.js";
 import styles from "assets/jss/nextjs-material-kit/components/footerStyle.js";
 import NSCB from "assets/img/nscb.png";
+import Suzuki from "assets/img/Suzuki.png";
 
 const useStyles = makeStyles(styles);
-
 export default function Footer(props) {
     const classes = useStyles();
     const { whiteFont } = props;
@@ -32,97 +27,53 @@ export default function Footer(props) {
         [classes.footerWhiteFont]: whiteFont
     });
     return (
-        <div><br/>
-            <GridContainer justify="center">
-                <Grid style={{padding:"25px"}}>
-                    <img className={classes.imgCard} src={NSCB} style={{width:"300px"}}/>
-                </Grid>
-                <Grid style={{padding:"25px"}}>
-                    <img className={classes.imgCard} src="https://nomorsalesmobil.com/wp-content/uploads/2018/10/Suzuki-logo-5000x2500.png" style={{width:"350px"}}/>
-                </Grid>
-            </GridContainer>
-            <GridContainer justify="center">
-                <Grid style={{padding:"25px", marginTop:"-50px"}}>
-                    <footer className={footerClasses}>
-                        <div className={classes.container}>
-                            <div className={classes.left}>
-                                <List className={classes.list}>
-                                <ListItem className={classes.inlineBlock}>
-                                    <a href="/suzuki/home" className={classes.block} > Home </a>
-                                </ListItem>
-                                <ListItem className={classes.inlineBlock}>
-                                    <a href="/suzuki/product/product" className={classes.block}> Product </a>
-                                </ListItem>
-                                {/* <ListItem className={classes.inlineBlock}>
-                                    <a href="/suzuki/product/ygp" className={classes.block}> YGP </a>
-                                </ListItem>
-                                <ListItem className={classes.inlineBlock}>
-                                    <a href="/suzuki/product/yamalube" className={classes.block}> Yamalube </a>
-                                </ListItem>
-                                <ListItem className={classes.inlineBlock}>
-                                    <a href="/suzuki/product/apparel" className={classes.block}> Apparel </a>
-                                </ListItem>
-                                <ListItem className={classes.inlineBlock}>
-                                    <a href="/suzuki/product/helmet" className={classes.block}> Helmet </a>
-                                </ListItem>
-                                <ListItem className={classes.inlineBlock}>
-                                    <a href="/suzuki/product/accessories" className={classes.block}> Accessories </a>
-                                </ListItem>
-                                <ListItem className={classes.inlineBlock}>
-                                    <a href="/suzuki/product/service" className={classes.block}> Service </a>
-                                </ListItem>
-                                <ListItem className={classes.inlineBlock}>
-                                    <a href="/suzuki/product/dealer" className={classes.block}> Dealer </a>
-                                </ListItem> */}
-                                <ListItem className={classes.inlineBlock}>
-                                    <a href="/suzuki/latestsnews" className={classes.block}> Latest News </a>
-                                </ListItem>
-                                <ListItem className={classes.inlineBlock}>
-                                    <a href="/suzuki/carrer" className={classes.block}> Carrer </a>
-                                </ListItem>
-                                <ListItem className={classes.inlineBlock}>
-                                    <a href="/suzuki/about_us/aboutus" className={classes.block}> About Us </a>
-                                </ListItem>
-                                </List>
-                            </div>
-                        </div>
-                    </footer>
-                </Grid>
-            </GridContainer>
-            <GridContainer style={{marginTop: "-100px", padding:"50px"}} justify="center">
-            <Grid>
-                <div>
-                <footer className={footerClasses}>
-                    <div className={classes.container}>
-                    <div className={classes.left}>
-                        <List className={classes.list}>
-                            <ListItem className={classes.inlineBlock}>
-                                <a href="#" className={classes.block} >Facebook</a>
-                            </ListItem>
-                            <ListItem className={classes.inlineBlock}>
-                                <a href="#" className={classes.block}>Instagram</a>
-                            </ListItem>
-                            <ListItem className={classes.inlineBlock}>
-                                <a href="#" className={classes.block}>Twitter</a>
-                            </ListItem>
-                            <ListItem className={classes.inlineBlock}>
-                                <a href="//#endregion" className={classes.block}>Youtube</a>
-                            </ListItem>
-                        </List>
-                    </div>
-                    </div>
-                </footer>
+        <GridItem xs={12}>
+            <div align="center" style={{marginTop:"-20px"}}>
+                <br/><br/><br/>
+                <div align="center" style={{marginTop:"-20px"}}>
+                    <img className={classes.imgCard} src={NSCB}style={{width:"350px", padding:"20px"}}/>
+                    <img className={classes.imgCard} src={Suzuki} style={{width:"350px", padding:"20px"}}/>
                 </div>
-            </Grid>
-            </GridContainer>
-            <GridContainer justify="center">
-                <Grid style={{padding:"25px", marginTop:"-50px"}}>
-                    <div className={classes.right}>
-                        &copy; {1900 + new Date().getYear()} , All Right Reserved{" "} by{" "} @Thamrin Group Company
-                    </div>
-                </Grid>
-            </GridContainer>
-        </div>
+            </div><br/>
+            <div align="center">
+                <List className={classes.list}>
+                    <ListItem className={classes.inlineBlock}>
+                        <a href="/suzuki/home" className={classes.block} > Home </a>
+                    </ListItem>
+                    <ListItem className={classes.inlineBlock}>
+                        <a href="/suzuki/product/product" className={classes.block}> Product </a>
+                    </ListItem>
+                    <ListItem className={classes.inlineBlock}>
+                        <a href="/suzuki/latestsnews" className={classes.block}> Latest News </a>
+                    </ListItem>
+                    <ListItem className={classes.inlineBlock}>
+                        <a href="/suzuki/carrer" className={classes.block}> Carrer </a>
+                    </ListItem>
+                    <ListItem className={classes.inlineBlock}>
+                        <a href="/suzuki/about_us/aboutus" className={classes.block}> About Us </a>
+                    </ListItem>
+                </List>
+            </div>
+            <div align="center">
+                <List className={classes.list}>
+                    <ListItem className={classes.inlineBlock}>
+                        <a href="#" target="_blank" className={classes.block} >Facebook</a>
+                    </ListItem>
+                    <ListItem className={classes.inlineBlock}>
+                        <a href="#" target="_blank" className={classes.block}>Instagram</a>
+                    </ListItem>
+                    <ListItem className={classes.inlineBlock}>
+                        <a href="#" target="_blank" className={classes.block}>Twitter</a>
+                    </ListItem>
+                    <ListItem className={classes.inlineBlock}>
+                        <a href="#" target="_blank" className={classes.block}>Youtube</a>
+                    </ListItem>
+                </List>
+            </div><br/><br/>
+            <div align="center">
+                &copy; {1900 + new Date().getYear()} , All Right Reserved{" "} by{" "} @Thamrin Brothers
+            </div><br/><br/>
+        </GridItem>
     );
 }
 

components/Header/HeaderHome.js

@@ -43,7 +43,7 @@ export default function HeaderHome(props) {
             </Link>
         </ListItem>
         <ListItem className={classes.listItem}>
-            <Link href="#">
+            <Link href='#section1'>
             <Button color="transparent" className={classes.navLink} style={{marginTop:"10px"}}>
                 <Icon className={classes.icons}>card_travel</Icon> Core Value
             </Button>

components/Header/HeaderLinks.js

@@ -88,6 +88,9 @@ export default function HeaderLinks({ username, ...props }) {
             <a href="/yamaha/dealer/dealers" className={classes.dropdownLink}>
               Dealers
             </a>,
+            <a href="/yamaha/order/order" className={classes.dropdownLink}>
+              Dealers
+            </a>,
           ]}
         />
       </ListItem>

lib/apollo.js

@@ -68,6 +68,7 @@ async function mutation(mutation, token = "", variables = {}) {
     });
     res = { STATUS: 1, DATA: sql.data };
   } catch (e) {
+    console.log(e);
     res = { STATUS: 0, DATA: errorHandler(e) };
   }
   return res;

package.json

@@ -65,6 +65,7 @@
     "react-datetime": "2.16.3",
     "react-dom": "16.13.1",
     "react-html-parser": "^2.0.2",
+    "react-input-number": "^5.0.19",
     "react-paginate": "^7.1.0",
     "react-query": "^3.12.1",
     "react-select": "^4.2.1",
@@ -73,6 +74,7 @@
     "rsuite": "^4.9.2",
     "scss": "^0.2.4",
     "styled-components": "5.1.0",
+    "sweetalert": "^2.1.2",
     "webpack": "4.43.0"
   }
 }

pages-sections/hino/cart/checkout.js

@@ -0,0 +1,341 @@
+import React from 'react';
+import { makeStyles } from '@material-ui/core/styles';
+import clsx from 'clsx';
+
+import SnackbarContent from "components/Snackbar/SnackbarContent.js";
+import Button1 from "components/CustomButtons/Button.js";
+import image1 from "../../../assets/img/mail.png"
+import GridContainer from "components/Grid/GridContainer.js";
+import classNames from "classnames";
+
+import Icon from "@material-ui/core/Icon";
+import Grid from '@material-ui/core/Grid';
+import TextField from '@material-ui/core/TextField';
+import Button from '@material-ui/core/Button';
+import Dialog from '@material-ui/core/Dialog';
+import ListItemText from '@material-ui/core/ListItemText';
+import ListItem from '@material-ui/core/ListItem';
+import List from '@material-ui/core/List';
+import Divider from '@material-ui/core/Divider';
+import AppBar from '@material-ui/core/AppBar';
+import Toolbar from '@material-ui/core/Toolbar';
+import IconButton from '@material-ui/core/IconButton';
+import Typography from '@material-ui/core/Typography';
+import CloseIcon from '@material-ui/icons/Close';
+import Slide from '@material-ui/core/Slide';
+import FormControl from '@material-ui/core/FormControl';
+import Select from '@material-ui/core/Select';
+import MenuItem from '@material-ui/core/MenuItem';
+import Card from "components/Card/Card.js";
+import CardBody from "components/Card/CardBody.js";
+
+const useStyles = makeStyles((theme) => ({
+    root: {
+        width: '100%',
+    },
+    button: {
+        marginTop: theme.spacing(1),
+        marginRight: theme.spacing(1),
+    },
+    actionsContainer: {
+        marginBottom: theme.spacing(2),
+    },
+    resetContainer: {
+        padding: theme.spacing(3),
+    },
+    appBar: {
+        position: 'relative',
+    },
+    title: {
+        marginLeft: theme.spacing(2),
+        flex: 1,
+    },
+    root: {
+        '&:hover': {
+        backgroundColor: 'transparent',
+        },
+    },
+    icon: {
+        borderRadius: '50%',
+        width: 16,
+        height: 16,
+        boxShadow: 'inset 0 0 0 1px rgba(16,22,26,.2), inset 0 -1px 0 rgba(16,22,26,.1)',
+        backgroundColor: '#f5f8fa',
+        backgroundImage: 'linear-gradient(180deg,hsla(0,0%,100%,.8),hsla(0,0%,100%,0))',
+        '$root.Mui-focusVisible &': {
+            outline: '2px auto rgba(19,124,189,.6)',
+            outlineOffset: 2,
+        },
+        'input:hover ~ &': {
+            backgroundColor: '#ebf1f5',
+        },
+        'input:disabled ~ &': {
+            boxShadow: 'none',
+            background: 'rgba(206,217,224,.5)',
+        },
+    },
+    checkedIcon: {
+        backgroundColor: '#137cbd',
+        backgroundImage: 'linear-gradient(180deg,hsla(0,0%,100%,.1),hsla(0,0%,100%,0))',
+        '&:before': {
+            display: 'block',
+            width: 16,
+            height: 16,
+            backgroundImage: 'radial-gradient(#fff,#fff 28%,transparent 32%)',
+            content: '""',
+        },
+        'input:hover ~ &': {
+            backgroundColor: '#106ba3',
+        },
+    },
+}));
+
+const Transition = React.forwardRef(function Transition(props, ref) {
+    return <Slide direction="up" ref={ref} {...props} />;
+});
+
+const DataCheckout = function ({ province, cities, midtransClient, backend, checkoutproduct, transactionToken,  ...props }) {
+    console.log('Token :',transactionToken);
+    const classes = useStyles();
+    const [open, setOpen] = React.useState(false);
+    const handleClickOpen = () => {
+        setOpen(true);
+    };
+    const handleClose = () => {
+        setOpen(false);
+    };
+    const { ...rest } = props;
+    const imageClasses = classNames(
+        classes.imgRaised,
+        classes.imgRoundedCircle,
+        classes.imgFluid
+    );
+    const navImageClasses = classNames(classes.imgRounded, classes.imgGallery);
+
+    const CheckoutAlamat = checkoutproduct.map((data) => {
+        return (
+            <div align="center">
+                <Card className={classes.textCenter} align="center">
+                    <CardBody>
+                    <div style={{padding:"10px"}}>
+                        <Typography variant="h6" align="left" className={classes.title}>
+                            Alamat Pengiriman
+                        </Typography><br></br>
+                        <img src={image1} style={{width:"1100px"}}/><br></br>
+                        <h5>Yusmar</h5>
+                        <h5>087797315685</h5>
+                        <h5>Thamrin Indrapura Jl.Aipda Karel Satsuit Tubun,17 Ilir, Kec.Ilir Tim.I, Palembang, KOTA PALEMBANG - ILIR TIMUR II, SUMATERA SELATAN, ID 30114</h5>
+                        <Button1 color="info" href={"/yamaha/profile/edit-profile"}>
+                            <Icon className={classes.icons}>cached</Icon>
+                            Ubah Alamat
+                        </Button1>
+                    </div>
+                    </CardBody>
+                </Card>
+            </div>
+        );
+    })
+
+    const CheckoutProdukPesanan = checkoutproduct.map((data) => {
+        const handleChange = (event) => {
+            setAge(event.target.value);
+        };
+        const handleChanges = (event) => {
+            setPengiriman(event.target.value);
+        };
+        const [age, setAge] = React.useState('');
+        const [pengiriman, setPengiriman] = React.useState('');
+        return (
+            <div align="center">
+                <Card className={classes.textCenter} align="center">
+                    <CardBody>
+                        <div style={{padding:"10px"}}>
+                        <Typography variant="h6" align="left" className={classes.title}>
+                            Pesanan Produk
+                        </Typography><br></br><hr></hr>
+                        <GridContainer>
+                            <Grid item xs>
+                                <div align="center">
+                                    <h4>Produk Dipesan</h4>
+                                    <img className={navImageClasses} width="200px" alt="First slide" src={`${backend}${data.img[0]["url"]}`} />
+                                </div>
+                            </Grid>
+                            <Grid item xs>
+                                <div align="center">
+                                    <h4></h4><br></br><br></br><br></br><br></br>
+                                    <h5>{data.name}</h5>
+                                </div>
+                            </Grid>
+                            <Grid item xs>
+                                <div align="center">
+                                    <h4>Warna</h4><br></br><br></br><br></br>
+                                    <FormControl className={classes.formControl}>
+                                        <Select
+                                        labelId="demo-simple-select-label"
+                                        id="demo-simple-select"
+                                        value={age}
+                                        onChange={handleChange}
+                                        >
+                                        <MenuItem value={10}>Hitam</MenuItem>
+                                        <MenuItem value={20}>Merah</MenuItem>
+                                        <MenuItem value={30}>Biru</MenuItem>
+                                        <MenuItem value={30}>Putih</MenuItem>
+                                        </Select>
+                                    </FormControl>
+                                </div>
+                            </Grid>
+                            <Grid item xs>
+                                <div align="center">
+                                    <h4>Harga Satuan</h4><br></br><br></br><br></br>
+                                    <h5>Rp.{data.price}</h5>
+                                </div>
+                            </Grid>
+                            <Grid item xs>
+                                <div align="center">
+                                    <h4>Jumlah Unit</h4><br></br><br></br><br></br>
+                                    <FormControl className={classes.formControl}>
+                                        <TextField
+                                            id="outlined-number"
+                                            type="number"
+                                            align="center"
+                                            InputLabelProps={{
+                                                shrink: true,
+                                            }}
+                                        />
+                                    </FormControl>
+                                </div>
+                            </Grid>
+                            <Grid item xs>
+                                <div align="center">
+                                    <h4>Sub Total Produk</h4><br></br><br></br><br></br>
+                                    <h5>Total Rp.{data.price}</h5>
+                                </div>
+                            </Grid>
+                        </GridContainer>
+                        <GridContainer style={{padding:"20px"}}>
+                            <Grid item xs style={{padding:"20px"}}>
+                                <TextField
+                                    id="outlined-full-width"
+                                    label="Pesan"
+                                    style={{ margin: 8 }}
+                                    placeholder="( Opsional ) Tinggalkan Pesan Kepada Dealer"
+                                    fullWidth
+                                    margin="normal"
+                                    InputLabelProps={{
+                                        shrink: true,
+                                    }}
+                                    variant="outlined"
+                                />
+                            </Grid>
+                            <Grid item xs style={{padding:"20px"}}><br></br>
+                                <Button variant="outlined" color="primary" onClick={handleClickOpen}>
+                                    Pilih Opsi Pengiriman
+                                </Button>
+                                <Dialog fullScreen open={open} onClose={handleClose} TransitionComponent={Transition}>
+                                    <AppBar className={classes.appBar}>
+                                    <Toolbar>
+                                        <IconButton edge="start" color="inherit" onClick={handleClose} aria-label="close">
+                                        <CloseIcon />
+                                        </IconButton>
+                                        <Typography variant="h6" className={classes.title}>
+                                            Pilih Opsi Pengiriman
+                                        </Typography>
+                                        <Button autoFocus color="inherit" onClick={handleClose}>
+                                            Pilih
+                                        </Button>
+                                    </Toolbar>
+                                    </AppBar>
+                                    <List>
+                                    <ListItem button
+                                        id="POS"
+                                        value={pengiriman}
+                                        onChange={handleChanges}
+                                    >
+                                        <ListItemText primary="POS" secondary="Akan diterima pada tanggal 2 Apr - 6 Apr" />
+                                    </ListItem>
+                                    <Divider />
+                                    <ListItem button
+                                        id="JNE"
+                                        value={pengiriman}
+                                        onChange={handleChanges}
+                                    >
+                                        <ListItemText primary="JNE" secondary="Akan diterima pada tanggal 30 Mar - 2 Apr" />
+                                    </ListItem>
+                                    <ListItem button
+                                        id="TIKI"
+                                        value={pengiriman}
+                                        onChange={handleChanges}
+                                    >
+                                        <ListItemText primary="TIKI" secondary="Akan diterima pada tanggal 1 Apr - 4 Apr, COD (Bayar di Tempat) tidak didukung" />
+                                    </ListItem>
+                                    </List>
+                                </Dialog>
+                            </Grid>
+                            <Grid item xs align="right" style={{padding:"20px"}}><br></br>
+                                Total Rp. {data.price}
+                            </Grid>
+                        </GridContainer>
+                        </div>
+                    </CardBody>
+                </Card>
+            </div>
+        );
+    })
+
+    return (
+        <div style={{padding:"50px"}}>
+            <script type="text/javascript" src="https://app.sandbox.midtrans.com/snap/snap.js" data-client-key="SB-Mid-client-srx674LjNbEybd4-"/>
+            <div align="center" className={classes.section} id="notifications">
+                <SnackbarContent
+                    message={
+                        <h2><b>Checkout</b></h2>
+                    }
+                    align="center"
+                    color="danger"
+                />
+            </div>
+            <div>
+                {CheckoutAlamat}
+            </div>
+            <div>
+                {CheckoutProdukPesanan}
+            </div>
+            <div>
+                <Card className={classes.textCenter} align="center">
+                    <CardBody>
+                        {/* <GridContainer>
+                            <Grid item xs={6} style={{padding:"20px"}}>
+                                <Button1 color="info" href="/yamaha/order/order"> 
+                                    <Icon className={classes.icons}>attach_money</Icon>
+                                    Buat Pesanan
+                                </Button1>
+                            </Grid>
+                            <Grid item xs={6} style={{padding:"20px"}}>
+                                <Button1 color="danger" onClick={(e)=>{snap.pay(transactionToken);}} style={{width:"100%"}}>
+                                    <Icon className={classes.icons}>attach_money</Icon>
+                                    Batalkan Pesanan
+                                </Button1>
+                            </Grid>
+                        </GridContainer> */}
+                        <GridContainer>
+                            <Grid item xs={6} style={{padding:"20px"}}>
+                                <Button1 color="info" onClick={(e)=>{snap.pay(transactionToken);}} style={{width:"100%"}}>
+                                    <Icon className={classes.icons}>attach_money</Icon>
+                                    Bayar Pesanan
+                                </Button1>
+                            </Grid>
+                            {/* <Grid item xs={6} style={{padding:"20px"}}>
+                                <Button1 color="info" onClick={(e)=>{snap.pay(transactionToken);}} style={{width:"100%"}}>
+                                    <Icon className={classes.icons}>attach_money</Icon>
+                                    Bayar Pesanan
+                                </Button1>
+                            </Grid> */}
+                        </GridContainer>
+                    </CardBody>
+                </Card>
+            </div>
+        </div>
+    );
+}
+
+export default DataCheckout;

pages-sections/hino/latest_news/news_details.js

@@ -68,11 +68,6 @@ const DataLatestNews = function ({ backend, news, othernews,...props }) {
                                             <img className={navImageClasses} width="300px" alt="First slide" src={`${backend}${data.img[0]["url"]}`} />
                                         </Carousel>
                                     </Card>
-                                    <hr></hr>
-                                    <div align="center">
-                                        <h3>Other Latest News</h3>
-                                        <h3>{otherlatnews}</h3>
-                                    </div>
                                 </GridItem>
                             </GridContainer>
                             </div>

pages-sections/hino/product/product.js

@@ -45,7 +45,7 @@ const DataProduct = function ({ backend, car, ...props })  {
                     </Button>
                     <Button 
                         color="info" round
-                        href={"/hino/checkout/checkout?s="+data.id}
+                        href={"/hino/cart/checkout?s="+data.id}
                     >
                         <Icon className={classes.icons}>shopping_cart</Icon>Add to Cart
                     </Button>

pages-sections/home/Businees-Partner.js

@@ -31,14 +31,9 @@ export default function WorkSection() {
     console.log(stylecss.container);
     return (
         <div>
-            <GridContainer justify="center" color="dark">
-                <GridItem xs={12} sm={12}>
-                    <h2 className={classes.title}>Thamrin Group Businees Partner</h2>
-                </GridItem>
-            </GridContainer>
+            <h2 className={classes.title}>Thamrin Group Businees Partner</h2>
             <div className={classes.root}>
-                <Grid container spacing={3}>
-                    <Grid item xs={12} sm={12} className={classes.marginAuto}>
+            <Grid item xs={12} sm={12} className={classes.marginAuto}>
                         <Card>
                         <div className="container">
                         <img src={yamaha} alt="Snow" style={{width:"100%"}}/>
@@ -46,7 +41,7 @@ export default function WorkSection() {
                         </div>
                         </Card>
                     </Grid>
-                    <Grid item xs={12} sm={12} style={{marginTop:"-85px"}} className={classes.marginAuto}>
+                    <Grid item xs={12} sm={12} style={{marginTop:"-30px"}} className={classes.marginAuto}>
                         <Card>
                         <div className="container">
                         <img src={suzuki} alt="Snow" style={{width:"100%"}}/>
@@ -54,15 +49,7 @@ export default function WorkSection() {
                         </div>
                         </Card>
                     </Grid>
-                    <Grid item xs={12} sm={12} style={{marginTop:"-85px"}} className={classes.marginAuto}>
-                        <Card>
-                        <div className="container">
-                        <img src={honda} alt="Snow" style={{width:"100%"}}/>
-                            <Button href="/honda/home" target="_blank" className="btn">Visit Page</Button>
-                        </div>
-                        </Card>
-                    </Grid>
-                    <Grid item xs={12} sm={12} style={{marginTop:"-85px"}} className={classes.marginAuto}>
+                    <Grid item xs={12} sm={12} style={{marginTop:"-30px"}} className={classes.marginAuto}>
                         <Card>
                         <div className="container">
                         <img src={hino} alt="Snow" style={{width:"100%"}}/>
@@ -70,23 +57,23 @@ export default function WorkSection() {
                         </div>
                         </Card>
                     </Grid>
-                    <Grid item xs={12} sm={12} style={{marginTop:"-85px"}} className={classes.marginAuto}>
+                    <Grid item xs={12} sm={12} style={{marginTop:"-30px"}} className={classes.marginAuto}>
                         <Card>
                         <div className="container">
-                        <img src={mercedes} alt="Snow" style={{width:"100%"}}/>
-                            <Button href="https://www.thamrin.mercedes-benz.co.id/en/desktop/passenger-cars.html" target="_blank" className="btn">Visit Page</Button>
+                        <img src={honda} alt="Snow" style={{width:"100%"}}/>
+                            <Button href="/honda/home" target="_blank" className="btn">Visit Page</Button>
                         </div>
                         </Card>
                     </Grid>
-                    <Grid item xs={12} sm={12} style={{marginTop:"-85px"}} className={classes.marginAuto}>
+                    <Grid item xs={12} sm={12} style={{marginTop:"-30px"}} className={classes.marginAuto}>
                         <Card>
                         <div className="container">
-                            <img src={emilia} alt="Snow" style={{width:"100%"}}/>
-                            <Button href="http://www.emilia-hotel.com/" target="_blank" className="btn">Visit Page</Button>
+                        <img src={mercedes} alt="Snow" style={{width:"100%"}}/>
+                            <Button href="https://www.thamrin.mercedes-benz.co.id/en/desktop/passenger-cars.html" target="_blank" className="btn">Visit Page</Button>
                         </div>
                         </Card>
                     </Grid>
-                    <Grid item xs={12} sm={12} style={{marginTop:"-85px"}} className={classes.marginAuto}>
+                    <Grid item xs={12} sm={12} style={{marginTop:"-30px"}} className={classes.marginAuto}>
                         <Card>
                             <div className="container">
                             <img src={bpr} alt="Snow" style={{width:"100%"}}/>
@@ -94,7 +81,15 @@ export default function WorkSection() {
                             </div>
                         </Card>
                     </Grid>
-                    <Grid item xs={12} sm={12} style={{marginTop:"-85px"}} className={classes.marginAuto}>
+                    <Grid item xs={12} sm={12} style={{marginTop:"-30px"}} className={classes.marginAuto}>
+                        <Card>
+                        <div className="container">
+                            <img src={emilia} alt="Snow" style={{width:"100%"}}/>
+                            <Button href="http://www.emilia-hotel.com/" target="_blank" className="btn">Visit Page</Button>
+                        </div>
+                        </Card>
+                    </Grid>
+                    <Grid item xs={12} sm={12} style={{marginTop:"-30px"}} className={classes.marginAuto}>
                         <Card>
                             <div className="container">
                             <img src={pim} alt="Snow" style={{width:"100%"}}/>
@@ -102,7 +97,7 @@ export default function WorkSection() {
                             </div>
                         </Card>
                     </Grid>
-                    <Grid item xs={12} sm={12} style={{marginTop:"-85px"}} className={classes.marginAuto}>
+                    <Grid item xs={12} sm={12} style={{marginTop:"-30px"}} className={classes.marginAuto}>
                         <Card>
                             <div className="container">
                             <img src={home} alt="Snow" style={{width:"100%"}}/>
@@ -110,7 +105,6 @@ export default function WorkSection() {
                             </div>
                         </Card>
                     </Grid>
-                </Grid>
             </div>
         </div>
     );

pages-sections/home/CoreValue.js

@@ -10,6 +10,8 @@ import Fingerprint from "@material-ui/icons/Fingerprint";
 import GridContainer from "components/Grid/GridContainer.js";
 import GridItem from "components/Grid/GridItem.js";
 import InfoArea from "components/InfoArea/InfoArea.js";
+import Paper from '@material-ui/core/Paper';
+import Grid from '@material-ui/core/Grid';
 
 import styles from "assets/jss/nextjs-material-kit/pages/landingPageSections/productStyle.js";
 
@@ -25,14 +27,9 @@ export default function ProductSection() {
   const classes = useStyles();
   return (
     <div className={classes.section}>
-      <GridContainer justify="center">
-        <GridItem xs={12} sm={12} md={8}>
-          <h2 className={classes.title}>Thamrin Group Core Value</h2>
-        </GridItem>
-      </GridContainer>
+      <h2 className={classes.title}>Thamrin Group Core Value</h2>
       <div>
-        <GridContainer>
-          <GridItem xs={12} sm={12} md={4}>
+          <GridItem xs={12}>
             <br/>
             <div align="center">
               <img src={core1}/>
@@ -45,7 +42,7 @@ export default function ProductSection() {
               />
             </div>
           </GridItem>
-          <GridItem xs={12} sm={12} md={4}>
+          <GridItem xs={12}>
             <br/>
             <div align="center">
               <img src={core2}/>
@@ -58,7 +55,7 @@ export default function ProductSection() {
               />
             </div>
           </GridItem>
-          <GridItem xs={12} sm={12} md={4}>
+          <GridItem xs={12}>
             <br/>
             <div align="center">
               <img src={core3}/>
@@ -71,9 +68,7 @@ export default function ProductSection() {
               />
             </div>
           </GridItem>
-        </GridContainer>
-        <GridContainer>
-          <GridItem xs={6} sm={6}>
+          <GridItem xs={12}>
             <br/>
             <div align="center">
               <img src={core4}/>
@@ -86,7 +81,7 @@ export default function ProductSection() {
               />
             </div>
           </GridItem>
-          <GridItem xs={6} sm={6}>
+          <GridItem xs={12}>
             <br/>
             <div align="center">
               <img src={core5}/>
@@ -99,7 +94,6 @@ export default function ProductSection() {
               />
             </div>
           </GridItem>
-        </GridContainer>
       </div>
     </div>
   );

pages-sections/home/gallery.js

@@ -26,15 +26,11 @@ export default function WorkSection() {
     const classes = useStyles();
     return (
         <div>
-            <GridContainer justify="center">
-                <GridItem xs={12} sm={12} md={8}>
-                <h2 className={classes.title}>Thamrin Group Gallery</h2>
-                </GridItem>
-            </GridContainer>
+            <h2 className={classes.title}>Thamrin Group Gallery</h2>
             <div className={classes.section} id="notifications" style={{marginTop:"-150px"}}>
                 <div className={classes.section}>
                     <div className={classes.container} align="center">
-                        <Grid container spacing={3}>
+                        <Grid item spacing={3}>
                             <Grid item xs={3}>
                                 <Card>
                                     <img src={img1} alt="First slide" className="slick-image"/>
@@ -56,7 +52,7 @@ export default function WorkSection() {
                                 </Card>
                             </Grid>
                         </Grid>
-                        <Grid container spacing={3}>
+                        {/* <Grid container spacing={3}>
                             <Grid item xs={3}>
                                 <Card>
                                     <img src={img8} alt="First slide" className="slick-image"/>
@@ -99,7 +95,7 @@ export default function WorkSection() {
                                     <img src={img4} alt="First slide" className="slick-image"/>
                                 </Card>
                             </Grid>
-                        </Grid>
+                        </Grid> */}
                     </div>
                 </div>
             </div>

pages-sections/honda/cart/checkout.js

@@ -0,0 +1,341 @@
+import React from 'react';
+import { makeStyles } from '@material-ui/core/styles';
+import clsx from 'clsx';
+
+import SnackbarContent from "components/Snackbar/SnackbarContent.js";
+import Button1 from "components/CustomButtons/Button.js";
+import image1 from "../../../assets/img/mail.png"
+import GridContainer from "components/Grid/GridContainer.js";
+import classNames from "classnames";
+
+import Icon from "@material-ui/core/Icon";
+import Grid from '@material-ui/core/Grid';
+import TextField from '@material-ui/core/TextField';
+import Button from '@material-ui/core/Button';
+import Dialog from '@material-ui/core/Dialog';
+import ListItemText from '@material-ui/core/ListItemText';
+import ListItem from '@material-ui/core/ListItem';
+import List from '@material-ui/core/List';
+import Divider from '@material-ui/core/Divider';
+import AppBar from '@material-ui/core/AppBar';
+import Toolbar from '@material-ui/core/Toolbar';
+import IconButton from '@material-ui/core/IconButton';
+import Typography from '@material-ui/core/Typography';
+import CloseIcon from '@material-ui/icons/Close';
+import Slide from '@material-ui/core/Slide';
+import FormControl from '@material-ui/core/FormControl';
+import Select from '@material-ui/core/Select';
+import MenuItem from '@material-ui/core/MenuItem';
+import Card from "components/Card/Card.js";
+import CardBody from "components/Card/CardBody.js";
+
+const useStyles = makeStyles((theme) => ({
+    root: {
+        width: '100%',
+    },
+    button: {
+        marginTop: theme.spacing(1),
+        marginRight: theme.spacing(1),
+    },
+    actionsContainer: {
+        marginBottom: theme.spacing(2),
+    },
+    resetContainer: {
+        padding: theme.spacing(3),
+    },
+    appBar: {
+        position: 'relative',
+    },
+    title: {
+        marginLeft: theme.spacing(2),
+        flex: 1,
+    },
+    root: {
+        '&:hover': {
+        backgroundColor: 'transparent',
+        },
+    },
+    icon: {
+        borderRadius: '50%',
+        width: 16,
+        height: 16,
+        boxShadow: 'inset 0 0 0 1px rgba(16,22,26,.2), inset 0 -1px 0 rgba(16,22,26,.1)',
+        backgroundColor: '#f5f8fa',
+        backgroundImage: 'linear-gradient(180deg,hsla(0,0%,100%,.8),hsla(0,0%,100%,0))',
+        '$root.Mui-focusVisible &': {
+            outline: '2px auto rgba(19,124,189,.6)',
+            outlineOffset: 2,
+        },
+        'input:hover ~ &': {
+            backgroundColor: '#ebf1f5',
+        },
+        'input:disabled ~ &': {
+            boxShadow: 'none',
+            background: 'rgba(206,217,224,.5)',
+        },
+    },
+    checkedIcon: {
+        backgroundColor: '#137cbd',
+        backgroundImage: 'linear-gradient(180deg,hsla(0,0%,100%,.1),hsla(0,0%,100%,0))',
+        '&:before': {
+            display: 'block',
+            width: 16,
+            height: 16,
+            backgroundImage: 'radial-gradient(#fff,#fff 28%,transparent 32%)',
+            content: '""',
+        },
+        'input:hover ~ &': {
+            backgroundColor: '#106ba3',
+        },
+    },
+}));
+
+const Transition = React.forwardRef(function Transition(props, ref) {
+    return <Slide direction="up" ref={ref} {...props} />;
+});
+
+const DataCheckout = function ({ province, cities, midtransClient, backend, checkoutproduct, transactionToken,  ...props }) {
+    console.log('Token :',transactionToken);
+    const classes = useStyles();
+    const [open, setOpen] = React.useState(false);
+    const handleClickOpen = () => {
+        setOpen(true);
+    };
+    const handleClose = () => {
+        setOpen(false);
+    };
+    const { ...rest } = props;
+    const imageClasses = classNames(
+        classes.imgRaised,
+        classes.imgRoundedCircle,
+        classes.imgFluid
+    );
+    const navImageClasses = classNames(classes.imgRounded, classes.imgGallery);
+
+    const CheckoutAlamat = checkoutproduct.map((data) => {
+        return (
+            <div align="center">
+                <Card className={classes.textCenter} align="center">
+                    <CardBody>
+                    <div style={{padding:"10px"}}>
+                        <Typography variant="h6" align="left" className={classes.title}>
+                            Alamat Pengiriman
+                        </Typography><br></br>
+                        <img src={image1} style={{width:"1100px"}}/><br></br>
+                        <h5>Yusmar</h5>
+                        <h5>087797315685</h5>
+                        <h5>Thamrin Indrapura Jl.Aipda Karel Satsuit Tubun,17 Ilir, Kec.Ilir Tim.I, Palembang, KOTA PALEMBANG - ILIR TIMUR II, SUMATERA SELATAN, ID 30114</h5>
+                        <Button1 color="info" href={"/yamaha/profile/edit-profile"}>
+                            <Icon className={classes.icons}>cached</Icon>
+                            Ubah Alamat
+                        </Button1>
+                    </div>
+                    </CardBody>
+                </Card>
+            </div>
+        );
+    })
+
+    const CheckoutProdukPesanan = checkoutproduct.map((data) => {
+        const handleChange = (event) => {
+            setAge(event.target.value);
+        };
+        const handleChanges = (event) => {
+            setPengiriman(event.target.value);
+        };
+        const [age, setAge] = React.useState('');
+        const [pengiriman, setPengiriman] = React.useState('');
+        return (
+            <div align="center">
+                <Card className={classes.textCenter} align="center">
+                    <CardBody>
+                        <div style={{padding:"10px"}}>
+                        <Typography variant="h6" align="left" className={classes.title}>
+                            Pesanan Produk
+                        </Typography><br></br><hr></hr>
+                        <GridContainer>
+                            <Grid item xs>
+                                <div align="center">
+                                    <h4>Produk Dipesan</h4>
+                                    <img className={navImageClasses} width="200px" alt="First slide" src={`${backend}${data.img[0]["url"]}`} />
+                                </div>
+                            </Grid>
+                            <Grid item xs>
+                                <div align="center">
+                                    <h4></h4><br></br><br></br><br></br><br></br>
+                                    <h5>{data.name}</h5>
+                                </div>
+                            </Grid>
+                            <Grid item xs>
+                                <div align="center">
+                                    <h4>Warna</h4><br></br><br></br><br></br>
+                                    <FormControl className={classes.formControl}>
+                                        <Select
+                                        labelId="demo-simple-select-label"
+                                        id="demo-simple-select"
+                                        value={age}
+                                        onChange={handleChange}
+                                        >
+                                        <MenuItem value={10}>Hitam</MenuItem>
+                                        <MenuItem value={20}>Merah</MenuItem>
+                                        <MenuItem value={30}>Biru</MenuItem>
+                                        <MenuItem value={30}>Putih</MenuItem>
+                                        </Select>
+                                    </FormControl>
+                                </div>
+                            </Grid>
+                            <Grid item xs>
+                                <div align="center">
+                                    <h4>Harga Satuan</h4><br></br><br></br><br></br>
+                                    <h5>Rp.{data.price}</h5>
+                                </div>
+                            </Grid>
+                            <Grid item xs>
+                                <div align="center">
+                                    <h4>Jumlah Unit</h4><br></br><br></br><br></br>
+                                    <FormControl className={classes.formControl}>
+                                        <TextField
+                                            id="outlined-number"
+                                            type="number"
+                                            align="center"
+                                            InputLabelProps={{
+                                                shrink: true,
+                                            }}
+                                        />
+                                    </FormControl>
+                                </div>
+                            </Grid>
+                            <Grid item xs>
+                                <div align="center">
+                                    <h4>Sub Total Produk</h4><br></br><br></br><br></br>
+                                    <h5>Total Rp.{data.price}</h5>
+                                </div>
+                            </Grid>
+                        </GridContainer>
+                        <GridContainer style={{padding:"20px"}}>
+                            <Grid item xs style={{padding:"20px"}}>
+                                <TextField
+                                    id="outlined-full-width"
+                                    label="Pesan"
+                                    style={{ margin: 8 }}
+                                    placeholder="( Opsional ) Tinggalkan Pesan Kepada Dealer"
+                                    fullWidth
+                                    margin="normal"
+                                    InputLabelProps={{
+                                        shrink: true,
+                                    }}
+                                    variant="outlined"
+                                />
+                            </Grid>
+                            <Grid item xs style={{padding:"20px"}}><br></br>
+                                <Button variant="outlined" color="primary" onClick={handleClickOpen}>
+                                    Pilih Opsi Pengiriman
+                                </Button>
+                                <Dialog fullScreen open={open} onClose={handleClose} TransitionComponent={Transition}>
+                                    <AppBar className={classes.appBar}>
+                                    <Toolbar>
+                                        <IconButton edge="start" color="inherit" onClick={handleClose} aria-label="close">
+                                        <CloseIcon />
+                                        </IconButton>
+                                        <Typography variant="h6" className={classes.title}>
+                                            Pilih Opsi Pengiriman
+                                        </Typography>
+                                        <Button autoFocus color="inherit" onClick={handleClose}>
+                                            Pilih
+                                        </Button>
+                                    </Toolbar>
+                                    </AppBar>
+                                    <List>
+                                    <ListItem button
+                                        id="POS"
+                                        value={pengiriman}
+                                        onChange={handleChanges}
+                                    >
+                                        <ListItemText primary="POS" secondary="Akan diterima pada tanggal 2 Apr - 6 Apr" />
+                                    </ListItem>
+                                    <Divider />
+                                    <ListItem button
+                                        id="JNE"
+                                        value={pengiriman}
+                                        onChange={handleChanges}
+                                    >
+                                        <ListItemText primary="JNE" secondary="Akan diterima pada tanggal 30 Mar - 2 Apr" />
+                                    </ListItem>
+                                    <ListItem button
+                                        id="TIKI"
+                                        value={pengiriman}
+                                        onChange={handleChanges}
+                                    >
+                                        <ListItemText primary="TIKI" secondary="Akan diterima pada tanggal 1 Apr - 4 Apr, COD (Bayar di Tempat) tidak didukung" />
+                                    </ListItem>
+                                    </List>
+                                </Dialog>
+                            </Grid>
+                            <Grid item xs align="right" style={{padding:"20px"}}><br></br>
+                                Total Rp. {data.price}
+                            </Grid>
+                        </GridContainer>
+                        </div>
+                    </CardBody>
+                </Card>
+            </div>
+        );
+    })
+
+    return (
+        <div style={{padding:"50px"}}>
+            <script type="text/javascript" src="https://app.sandbox.midtrans.com/snap/snap.js" data-client-key="SB-Mid-client-srx674LjNbEybd4-"/>
+            <div align="center" className={classes.section} id="notifications">
+                <SnackbarContent
+                    message={
+                        <h2><b>Checkout</b></h2>
+                    }
+                    align="center"
+                    color="danger"
+                />
+            </div>
+            <div>
+                {CheckoutAlamat}
+            </div>
+            <div>
+                {CheckoutProdukPesanan}
+            </div>
+            <div>
+                <Card className={classes.textCenter} align="center">
+                    <CardBody>
+                        {/* <GridContainer>
+                            <Grid item xs={6} style={{padding:"20px"}}>
+                                <Button1 color="info" href="/yamaha/order/order"> 
+                                    <Icon className={classes.icons}>attach_money</Icon>
+                                    Buat Pesanan
+                                </Button1>
+                            </Grid>
+                            <Grid item xs={6} style={{padding:"20px"}}>
+                                <Button1 color="danger" onClick={(e)=>{snap.pay(transactionToken);}} style={{width:"100%"}}>
+                                    <Icon className={classes.icons}>attach_money</Icon>
+                                    Batalkan Pesanan
+                                </Button1>
+                            </Grid>
+                        </GridContainer> */}
+                        <GridContainer>
+                            <Grid item xs={6} style={{padding:"20px"}}>
+                                <Button1 color="info" onClick={(e)=>{snap.pay(transactionToken);}} style={{width:"100%"}}>
+                                    <Icon className={classes.icons}>attach_money</Icon>
+                                    Bayar Pesanan
+                                </Button1>
+                            </Grid>
+                            {/* <Grid item xs={6} style={{padding:"20px"}}>
+                                <Button1 color="info" onClick={(e)=>{snap.pay(transactionToken);}} style={{width:"100%"}}>
+                                    <Icon className={classes.icons}>attach_money</Icon>
+                                    Bayar Pesanan
+                                </Button1>
+                            </Grid> */}
+                        </GridContainer>
+                    </CardBody>
+                </Card>
+            </div>
+        </div>
+    );
+}
+
+export default DataCheckout;

pages-sections/honda/home/carousel.js

@@ -32,25 +32,29 @@ const DataCarousel = function ({ backend, carousel, ...props })  {
             <div className={classes.section}>
             <div className={classes.container}>
                 <GridContainer>
-                <GridItem className={classes.marginAuto}>
-                <Card carousel>
-                    <Carousel {...settings}>
-                    {Carousels}
-                    </Carousel>
-                </Card>
-                </GridItem>
+                    <GridItem className={classes.marginAuto}>
+                        <Card carousel>
+                            <Carousel {...settings}>
+                            {Carousels}
+                            </Carousel>
+                        </Card>
+                    </GridItem>
                 </GridContainer>
-                <GridContainer style={{marginTop:"-30px"}}>
-                    <Grid style={{padding:"35px"}}>
-                        <Card>
-                        <iframe width="815" height="448" src="https://www.youtube.com/embed/ctv6XEB3ZT4" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen style={{height: "300px", width: "500px", display: "block"}}></iframe>
+                <GridContainer>
+                    <GridItem className={classes.marginAuto} xs={6}>
+                        <Card carousel>
+                        <Carousel {...settings}>
+                            <iframe height="300px" src="https://www.youtube.com/embed/ctv6XEB3ZT4" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
+                        </Carousel>
                         </Card>
-                    </Grid>
-                    <Grid  style={{padding:"35px"}}>
-                        <Card>
-                        <iframe width="815" height="448" src="https://www.youtube.com/embed/sI3n7Fh8lrQ" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen style={{height: "300px", width: "500px", display: "block"}}></iframe>
+                    </GridItem>
+                    <GridItem className={classes.marginAuto} xs={6}>
+                        <Card carousel>
+                        <Carousel {...settings}>
+                            <iframe height="300px" src="https://www.youtube.com/embed/sI3n7Fh8lrQ" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
+                        </Carousel>
                         </Card>
-                    </Grid>
+                    </GridItem>
                 </GridContainer>
             </div>
             </div>

pages-sections/honda/product/product.js

@@ -43,8 +43,8 @@ const DataProduct = function ({ backend, car, ...props })  {
                         <Icon className={classes.icons}>open_in_new</Icon>Detail Product
                     </Button>
                     <Button 
-                        color="info" round
-                        href={"/honda/checkout/checkout?s="+data.id}
+                    color="info" round
+                    href={"/honda/cart/checkout?s="+data.id}
                     >
                         <Icon className={classes.icons}>shopping_cart</Icon>Add to Cart
                     </Button>

pages-sections/suzuki/cart/checkout.js

@@ -0,0 +1,341 @@
+import React from 'react';
+import { makeStyles } from '@material-ui/core/styles';
+import clsx from 'clsx';
+
+import SnackbarContent from "components/Snackbar/SnackbarContent.js";
+import Button1 from "components/CustomButtons/Button.js";
+import image1 from "../../../assets/img/mail.png"
+import GridContainer from "components/Grid/GridContainer.js";
+import classNames from "classnames";
+
+import Icon from "@material-ui/core/Icon";
+import Grid from '@material-ui/core/Grid';
+import TextField from '@material-ui/core/TextField';
+import Button from '@material-ui/core/Button';
+import Dialog from '@material-ui/core/Dialog';
+import ListItemText from '@material-ui/core/ListItemText';
+import ListItem from '@material-ui/core/ListItem';
+import List from '@material-ui/core/List';
+import Divider from '@material-ui/core/Divider';
+import AppBar from '@material-ui/core/AppBar';
+import Toolbar from '@material-ui/core/Toolbar';
+import IconButton from '@material-ui/core/IconButton';
+import Typography from '@material-ui/core/Typography';
+import CloseIcon from '@material-ui/icons/Close';
+import Slide from '@material-ui/core/Slide';
+import FormControl from '@material-ui/core/FormControl';
+import Select from '@material-ui/core/Select';
+import MenuItem from '@material-ui/core/MenuItem';
+import Card from "components/Card/Card.js";
+import CardBody from "components/Card/CardBody.js";
+
+const useStyles = makeStyles((theme) => ({
+    root: {
+        width: '100%',
+    },
+    button: {
+        marginTop: theme.spacing(1),
+        marginRight: theme.spacing(1),
+    },
+    actionsContainer: {
+        marginBottom: theme.spacing(2),
+    },
+    resetContainer: {
+        padding: theme.spacing(3),
+    },
+    appBar: {
+        position: 'relative',
+    },
+    title: {
+        marginLeft: theme.spacing(2),
+        flex: 1,
+    },
+    root: {
+        '&:hover': {
+        backgroundColor: 'transparent',
+        },
+    },
+    icon: {
+        borderRadius: '50%',
+        width: 16,
+        height: 16,
+        boxShadow: 'inset 0 0 0 1px rgba(16,22,26,.2), inset 0 -1px 0 rgba(16,22,26,.1)',
+        backgroundColor: '#f5f8fa',
+        backgroundImage: 'linear-gradient(180deg,hsla(0,0%,100%,.8),hsla(0,0%,100%,0))',
+        '$root.Mui-focusVisible &': {
+            outline: '2px auto rgba(19,124,189,.6)',
+            outlineOffset: 2,
+        },
+        'input:hover ~ &': {
+            backgroundColor: '#ebf1f5',
+        },
+        'input:disabled ~ &': {
+            boxShadow: 'none',
+            background: 'rgba(206,217,224,.5)',
+        },
+    },
+    checkedIcon: {
+        backgroundColor: '#137cbd',
+        backgroundImage: 'linear-gradient(180deg,hsla(0,0%,100%,.1),hsla(0,0%,100%,0))',
+        '&:before': {
+            display: 'block',
+            width: 16,
+            height: 16,
+            backgroundImage: 'radial-gradient(#fff,#fff 28%,transparent 32%)',
+            content: '""',
+        },
+        'input:hover ~ &': {
+            backgroundColor: '#106ba3',
+        },
+    },
+}));
+
+const Transition = React.forwardRef(function Transition(props, ref) {
+    return <Slide direction="up" ref={ref} {...props} />;
+});
+
+const DataCheckout = function ({ province, cities, midtransClient, backend, checkoutproduct, transactionToken,  ...props }) {
+    console.log('Token :',transactionToken);
+    const classes = useStyles();
+    const [open, setOpen] = React.useState(false);
+    const handleClickOpen = () => {
+        setOpen(true);
+    };
+    const handleClose = () => {
+        setOpen(false);
+    };
+    const { ...rest } = props;
+    const imageClasses = classNames(
+        classes.imgRaised,
+        classes.imgRoundedCircle,
+        classes.imgFluid
+    );
+    const navImageClasses = classNames(classes.imgRounded, classes.imgGallery);
+
+    const CheckoutAlamat = checkoutproduct.map((data) => {
+        return (
+            <div align="center">
+                <Card className={classes.textCenter} align="center">
+                    <CardBody>
+                    <div style={{padding:"10px"}}>
+                        <Typography variant="h6" align="left" className={classes.title}>
+                            Alamat Pengiriman
+                        </Typography><br></br>
+                        <img src={image1} style={{width:"1100px"}}/><br></br>
+                        <h5>Yusmar</h5>
+                        <h5>087797315685</h5>
+                        <h5>Thamrin Indrapura Jl.Aipda Karel Satsuit Tubun,17 Ilir, Kec.Ilir Tim.I, Palembang, KOTA PALEMBANG - ILIR TIMUR II, SUMATERA SELATAN, ID 30114</h5>
+                        <Button1 color="info" href={"/yamaha/profile/edit-profile"}>
+                            <Icon className={classes.icons}>cached</Icon>
+                            Ubah Alamat
+                        </Button1>
+                    </div>
+                    </CardBody>
+                </Card>
+            </div>
+        );
+    })
+
+    const CheckoutProdukPesanan = checkoutproduct.map((data) => {
+        const handleChange = (event) => {
+            setAge(event.target.value);
+        };
+        const handleChanges = (event) => {
+            setPengiriman(event.target.value);
+        };
+        const [age, setAge] = React.useState('');
+        const [pengiriman, setPengiriman] = React.useState('');
+        return (
+            <div align="center">
+                <Card className={classes.textCenter} align="center">
+                    <CardBody>
+                        <div style={{padding:"10px"}}>
+                        <Typography variant="h6" align="left" className={classes.title}>
+                            Pesanan Produk
+                        </Typography><br></br><hr></hr>
+                        <GridContainer>
+                            <Grid item xs>
+                                <div align="center">
+                                    <h4>Produk Dipesan</h4>
+                                    <img className={navImageClasses} width="200px" alt="First slide" src={`${backend}${data.img[0]["url"]}`} />
+                                </div>
+                            </Grid>
+                            <Grid item xs>
+                                <div align="center">
+                                    <h4></h4><br></br><br></br><br></br><br></br>
+                                    <h5>{data.name}</h5>
+                                </div>
+                            </Grid>
+                            <Grid item xs>
+                                <div align="center">
+                                    <h4>Warna</h4><br></br><br></br><br></br>
+                                    <FormControl className={classes.formControl}>
+                                        <Select
+                                        labelId="demo-simple-select-label"
+                                        id="demo-simple-select"
+                                        value={age}
+                                        onChange={handleChange}
+                                        >
+                                        <MenuItem value={10}>Hitam</MenuItem>
+                                        <MenuItem value={20}>Merah</MenuItem>
+                                        <MenuItem value={30}>Biru</MenuItem>
+                                        <MenuItem value={30}>Putih</MenuItem>
+                                        </Select>
+                                    </FormControl>
+                                </div>
+                            </Grid>
+                            <Grid item xs>
+                                <div align="center">
+                                    <h4>Harga Satuan</h4><br></br><br></br><br></br>
+                                    <h5>Rp.{data.price}</h5>
+                                </div>
+                            </Grid>
+                            <Grid item xs>
+                                <div align="center">
+                                    <h4>Jumlah Unit</h4><br></br><br></br><br></br>
+                                    <FormControl className={classes.formControl}>
+                                        <TextField
+                                            id="outlined-number"
+                                            type="number"
+                                            align="center"
+                                            InputLabelProps={{
+                                                shrink: true,
+                                            }}
+                                        />
+                                    </FormControl>
+                                </div>
+                            </Grid>
+                            <Grid item xs>
+                                <div align="center">
+                                    <h4>Sub Total Produk</h4><br></br><br></br><br></br>
+                                    <h5>Total Rp.{data.price}</h5>
+                                </div>
+                            </Grid>
+                        </GridContainer>
+                        <GridContainer style={{padding:"20px"}}>
+                            <Grid item xs style={{padding:"20px"}}>
+                                <TextField
+                                    id="outlined-full-width"
+                                    label="Pesan"
+                                    style={{ margin: 8 }}
+                                    placeholder="( Opsional ) Tinggalkan Pesan Kepada Dealer"
+                                    fullWidth
+                                    margin="normal"
+                                    InputLabelProps={{
+                                        shrink: true,
+                                    }}
+                                    variant="outlined"
+                                />
+                            </Grid>
+                            <Grid item xs style={{padding:"20px"}}><br></br>
+                                <Button variant="outlined" color="primary" onClick={handleClickOpen}>
+                                    Pilih Opsi Pengiriman
+                                </Button>
+                                <Dialog fullScreen open={open} onClose={handleClose} TransitionComponent={Transition}>
+                                    <AppBar className={classes.appBar}>
+                                    <Toolbar>
+                                        <IconButton edge="start" color="inherit" onClick={handleClose} aria-label="close">
+                                        <CloseIcon />
+                                        </IconButton>
+                                        <Typography variant="h6" className={classes.title}>
+                                            Pilih Opsi Pengiriman
+                                        </Typography>
+                                        <Button autoFocus color="inherit" onClick={handleClose}>
+                                            Pilih
+                                        </Button>
+                                    </Toolbar>
+                                    </AppBar>
+                                    <List>
+                                    <ListItem button
+                                        id="POS"
+                                        value={pengiriman}
+                                        onChange={handleChanges}
+                                    >
+                                        <ListItemText primary="POS" secondary="Akan diterima pada tanggal 2 Apr - 6 Apr" />
+                                    </ListItem>
+                                    <Divider />
+                                    <ListItem button
+                                        id="JNE"
+                                        value={pengiriman}
+                                        onChange={handleChanges}
+                                    >
+                                        <ListItemText primary="JNE" secondary="Akan diterima pada tanggal 30 Mar - 2 Apr" />
+                                    </ListItem>
+                                    <ListItem button
+                                        id="TIKI"
+                                        value={pengiriman}
+                                        onChange={handleChanges}
+                                    >
+                                        <ListItemText primary="TIKI" secondary="Akan diterima pada tanggal 1 Apr - 4 Apr, COD (Bayar di Tempat) tidak didukung" />
+                                    </ListItem>
+                                    </List>
+                                </Dialog>
+                            </Grid>
+                            <Grid item xs align="right" style={{padding:"20px"}}><br></br>
+                                Total Rp. {data.price}
+                            </Grid>
+                        </GridContainer>
+                        </div>
+                    </CardBody>
+                </Card>
+            </div>
+        );
+    })
+
+    return (
+        <div style={{padding:"50px"}}>
+            <script type="text/javascript" src="https://app.sandbox.midtrans.com/snap/snap.js" data-client-key="SB-Mid-client-srx674LjNbEybd4-"/>
+            <div align="center" className={classes.section} id="notifications">
+                <SnackbarContent
+                    message={
+                        <h2><b>Checkout</b></h2>
+                    }
+                    align="center"
+                    color="danger"
+                />
+            </div>
+            <div>
+                {CheckoutAlamat}
+            </div>
+            <div>
+                {CheckoutProdukPesanan}
+            </div>
+            <div>
+                <Card className={classes.textCenter} align="center">
+                    <CardBody>
+                        {/* <GridContainer>
+                            <Grid item xs={6} style={{padding:"20px"}}>
+                                <Button1 color="info" href="/yamaha/order/order"> 
+                                    <Icon className={classes.icons}>attach_money</Icon>
+                                    Buat Pesanan
+                                </Button1>
+                            </Grid>
+                            <Grid item xs={6} style={{padding:"20px"}}>
+                                <Button1 color="danger" onClick={(e)=>{snap.pay(transactionToken);}} style={{width:"100%"}}>
+                                    <Icon className={classes.icons}>attach_money</Icon>
+                                    Batalkan Pesanan
+                                </Button1>
+                            </Grid>
+                        </GridContainer> */}
+                        <GridContainer>
+                            <Grid item xs={6} style={{padding:"20px"}}>
+                                <Button1 color="info" onClick={(e)=>{snap.pay(transactionToken);}} style={{width:"100%"}}>
+                                    <Icon className={classes.icons}>attach_money</Icon>
+                                    Bayar Pesanan
+                                </Button1>
+                            </Grid>
+                            {/* <Grid item xs={6} style={{padding:"20px"}}>
+                                <Button1 color="info" onClick={(e)=>{snap.pay(transactionToken);}} style={{width:"100%"}}>
+                                    <Icon className={classes.icons}>attach_money</Icon>
+                                    Bayar Pesanan
+                                </Button1>
+                            </Grid> */}
+                        </GridContainer>
+                    </CardBody>
+                </Card>
+            </div>
+        </div>
+    );
+}
+
+export default DataCheckout;

pages-sections/suzuki/home/carousel.js

@@ -40,17 +40,21 @@ const DataCarousel = function ({ backend, carousels, ...props })  {
               </Card>
               </GridItem>
             </GridContainer>
-            <GridContainer style={{marginTop:"-30px"}}>
-                <Grid style={{padding:"35px"}}>
-                    <Card>
-                      <iframe width="853" height="480" src="https://www.youtube.com/embed/lF8mfdLz2A8" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen style={{height: "300px", width: "500px", display: "block"}}></iframe>
-                    </Card>
-                </Grid>
-                <Grid  style={{padding:"35px"}}>
-                    <Card>
-                      <iframe width="853" height="480" src="https://www.youtube.com/embed/W5y2C8lqOeA" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen style={{height: "300px", width: "500px", display: "block"}}></iframe>
-                    </Card>
-                </Grid>
+            <GridContainer>
+              <GridItem className={classes.marginAuto} xs={6}>
+                <Card carousel>
+                  <Carousel {...settings}>
+                    <iframe height="300px" src="https://www.youtube.com/embed/lF8mfdLz2A8" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
+                  </Carousel>
+                </Card>
+              </GridItem>
+              <GridItem className={classes.marginAuto} xs={6}>
+                <Card carousel>
+                  <Carousel {...settings}>
+                    <iframe height="300px" src="https://www.youtube.com/embed/W5y2C8lqOeA" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
+                  </Carousel>
+                </Card>
+              </GridItem>
             </GridContainer>
           </div>
         </div>

pages-sections/suzuki/latest_news/news.js

@@ -40,10 +40,8 @@ const DataLatestNews = function ({ backend, news, ...props }) {
       <div align="center">
           <h2>Latest News</h2>
       </div>
-      <div>
-        <GridContainer justify="center">
-          {latnews}
-        </GridContainer>
+      <div align="center">
+      {latnews}
       </div>
       <div align="center">
         <Paginations

pages-sections/suzuki/latest_news/news_details.js

@@ -55,7 +55,6 @@ const DataLatestNews = function ({ backend, news, othernews,...props }) {
     })
     const latnews = news.map((data) => {
         return (
-            
             <GridContainer justify="center">
                 <Grid fluid xs={4}> 
                     <div className={classes.section} id="notifications">
@@ -68,11 +67,6 @@ const DataLatestNews = function ({ backend, news, othernews,...props }) {
                                             <img className={navImageClasses} width="300px" alt="First slide" src={`${backend}${data.img[0]["url"]}`} />
                                         </Carousel>
                                     </Card>
-                                    <hr></hr>
-                                    <div align="center">
-                                        <h3>Other Latest News</h3>
-                                        <h3>{otherlatnews}</h3>
-                                    </div>
                                 </GridItem>
                             </GridContainer>
                             </div>

pages-sections/suzuki/product/product.js

@@ -45,7 +45,7 @@ const DataProduct = function ({ backend, car, ...props })  {
                 </Button>
                 <Button 
                     color="info" round
-                    href={"/suzuki/checkout/checkout?s="+data.id}
+                    href={"/suzuki/cart/checkout?s="+data.id}
                 >
                     <Icon className={classes.icons}>shopping_cart</Icon>Add to Cart
                 </Button>

pages-sections/yamaha/cart/checkout.js

@@ -7,6 +7,7 @@ import Button1 from "components/CustomButtons/Button.js";
 import image1 from "../../../assets/img/mail.png"
 import GridContainer from "components/Grid/GridContainer.js";
 import classNames from "classnames";
+import swal from 'sweetalert';
 
 import Icon from "@material-ui/core/Icon";
 import Grid from '@material-ui/core/Grid';
@@ -23,11 +24,12 @@ import IconButton from '@material-ui/core/IconButton';
 import Typography from '@material-ui/core/Typography';
 import CloseIcon from '@material-ui/icons/Close';
 import Slide from '@material-ui/core/Slide';
-import FormControl from '@material-ui/core/FormControl';
 import Select from '@material-ui/core/Select';
 import MenuItem from '@material-ui/core/MenuItem';
 import Card from "components/Card/Card.js";
 import CardBody from "components/Card/CardBody.js";
+import FormControl from '@material-ui/core/FormControl';
+import { FormGroup } from "rsuite";
 
 const useStyles = makeStyles((theme) => ({
     root: {
@@ -112,6 +114,30 @@ const DataCheckout = function ({ province, cities, midtransClient, backend, chec
     );
     const navImageClasses = classNames(classes.imgRounded, classes.imgGallery);
 
+    const [formValue, setFormValue] = React.useState({
+        cust_name: "cust_name",
+        cust_telp: null,
+        cust_address: null,
+        product_img: null,
+        product_name: null,
+        product_color: null,
+        product_quantity: null,
+        product_price: null,
+        product_courier: null,
+	});
+
+    function create_UUID(){
+        var dt = new Date().getTime();
+        var uuid = 'Order-ID-xxxxxxxx'.replace(/[x]/g, function(c) {
+            var r = (dt + Math.random()*16)%16 | 0;
+            dt = Math.floor(dt/16);
+            return (c=='x' ? r :(r&0x3|0x8)).toString(16);
+        });
+        return uuid;
+    }
+
+    console.log(create_UUID);
+        
     const CheckoutAlamat = checkoutproduct.map((data) => {
         return (
             <div align="center">
@@ -122,8 +148,17 @@ const DataCheckout = function ({ province, cities, midtransClient, backend, chec
                             Alamat Pengiriman
                         </Typography><br></br>
                         <img src={image1} style={{width:"1100px"}}/><br></br>
-                        <h5>Yusmar</h5>
+                        <FormGroup>
+                            <FormControl name="cust_name" type="text" value={data.name}/>
+						</FormGroup>
+                        <h5>{data.name}</h5>
+                        <FormGroup>
+                            <FormControl name="cust_telp" type="text"/>
+						</FormGroup>
                         <h5>087797315685</h5>
+                        <FormGroup>
+                            <FormControl name="cust_address" type="text" value={data.name}/>
+						</FormGroup>
                         <h5>Thamrin Indrapura Jl.Aipda Karel Satsuit Tubun,17 Ilir, Kec.Ilir Tim.I, Palembang, KOTA PALEMBANG - ILIR TIMUR II, SUMATERA SELATAN, ID 30114</h5>
                         <Button1 color="info" href={"/yamaha/profile/edit-profile"}>
                             <Icon className={classes.icons}>cached</Icon>
@@ -154,18 +189,27 @@ const DataCheckout = function ({ province, cities, midtransClient, backend, chec
                             Pesanan Produk
                         </Typography><br></br><hr></hr>
                         <GridContainer>
+                            <FormGroup>
+                                <FormControl name="product_img" type="text" value={data.name}/>
+                            </FormGroup>
                             <Grid item xs>
                                 <div align="center">
                                     <h4>Produk Dipesan</h4>
                                     <img className={navImageClasses} width="200px" alt="First slide" src={`${backend}${data.img[0]["url"]}`} />
                                 </div>
                             </Grid>
+                            <FormGroup>
+                                <FormControl name="product_name" type="text" value={data.name}/>
+                            </FormGroup>
                             <Grid item xs>
                                 <div align="center">
                                     <h4></h4><br></br><br></br><br></br><br></br>
                                     <h5>{data.name}</h5>
                                 </div>
                             </Grid>
+                            <FormGroup>
+                                <FormControl name="product_color" type="text" value={data.name}/>
+                            </FormGroup>
                             <Grid item xs>
                                 <div align="center">
                                     <h4>Warna</h4><br></br><br></br><br></br>
@@ -190,6 +234,9 @@ const DataCheckout = function ({ province, cities, midtransClient, backend, chec
                                     <h5>Rp.{data.price}</h5>
                                 </div>
                             </Grid>
+                            <FormGroup>
+                                <FormControl name="product_quantity" type="text" value={data.name}/>
+                            </FormGroup>
                             <Grid item xs>
                                 <div align="center">
                                     <h4>Jumlah Unit</h4><br></br><br></br><br></br>
@@ -198,6 +245,7 @@ const DataCheckout = function ({ province, cities, midtransClient, backend, chec
                                             id="outlined-number"
                                             type="number"
                                             align="center"
+                                            name="quantity"
                                             InputLabelProps={{
                                                 shrink: true,
                                             }}
@@ -205,6 +253,9 @@ const DataCheckout = function ({ province, cities, midtransClient, backend, chec
                                     </FormControl>
                                 </div>
                             </Grid>
+                            <FormGroup>
+                                <FormControl name="product_price" type="text"/>
+                            </FormGroup>
                             <Grid item xs>
                                 <div align="center">
                                     <h4>Sub Total Produk</h4><br></br><br></br><br></br>
@@ -227,6 +278,9 @@ const DataCheckout = function ({ province, cities, midtransClient, backend, chec
                                     variant="outlined"
                                 />
                             </Grid>
+                            <FormGroup>
+                                <FormControl name="product_courier" type="text" value={data.name}/>
+                            </FormGroup>
                             <Grid item xs style={{padding:"20px"}}><br></br>
                                 <Button variant="outlined" color="primary" onClick={handleClickOpen}>
                                     Pilih Opsi Pengiriman
@@ -248,7 +302,6 @@ const DataCheckout = function ({ province, cities, midtransClient, backend, chec
                                     <List>
                                     <ListItem button
                                         id="POS"
-                                        value={pengiriman}
                                         onChange={handleChanges}
                                     >
                                         <ListItemText primary="POS" secondary="Akan diterima pada tanggal 2 Apr - 6 Apr" />
@@ -256,14 +309,12 @@ const DataCheckout = function ({ province, cities, midtransClient, backend, chec
                                     <Divider />
                                     <ListItem button
                                         id="JNE"
-                                        value={pengiriman}
                                         onChange={handleChanges}
                                     >
                                         <ListItemText primary="JNE" secondary="Akan diterima pada tanggal 30 Mar - 2 Apr" />
                                     </ListItem>
                                     <ListItem button
                                         id="TIKI"
-                                        value={pengiriman}
                                         onChange={handleChanges}
                                     >
                                         <ListItemText primary="TIKI" secondary="Akan diterima pada tanggal 1 Apr - 4 Apr, COD (Bayar di Tempat) tidak didukung" />
@@ -301,41 +352,57 @@ const DataCheckout = function ({ province, cities, midtransClient, backend, chec
                 {CheckoutProdukPesanan}
             </div>
             <div>
-                <Card className={classes.textCenter} align="center">
-                    <CardBody>
-                        <GridContainer>
-                            <Grid item xs={6} style={{padding:"20px"}}>
-                                <Button1 color="info" href="/yamaha/order/order"> 
-                                    <Icon className={classes.icons}>attach_money</Icon>
-                                    Buat Pesanan
-                                </Button1>
-                            </Grid>
-                            <Grid item xs={6} style={{padding:"20px"}}>
-                                <Button1 color="danger" onClick={(e)=>{snap.pay(transactionToken);}} style={{width:"100%"}}>
-                                    <Icon className={classes.icons}>attach_money</Icon>
-                                    Batalkan Pesanan
-                                </Button1>
-                            </Grid>
-                        </GridContainer>
-                        {/* <GridContainer>
-                            <Grid item xs={6} style={{padding:"20px"}}>
-                                <Button1 color="info" onClick={(e)=>{snap.pay(transactionToken);}} style={{width:"100%"}}>
-                                    <Icon className={classes.icons}>attach_money</Icon>
-                                    Bayar Pesanan
-                                </Button1>
-                            </Grid>
-                            <Grid item xs={6} style={{padding:"20px"}}>
-                                <Button1 color="info" onClick={(e)=>{snap.pay(transactionToken);}} style={{width:"100%"}}>
-                                    <Icon className={classes.icons}>attach_money</Icon>
-                                    Bayar Pesanan
-                                </Button1>
-                            </Grid>
-                        </GridContainer> */}
-                    </CardBody>
-                </Card>
+                <GridContainer>
+                    <Grid item xs={6} style={{padding:"20px"}}>
+                        <Button1 color="info" style={{width:"100%"}}
+                            onClick={async function (e) {
+                                // setFormValue({cust_name:"tes"});
+                                const response = await fetch(
+                                    "/api/transaction/create",
+                                    {
+                                        method: "POST",
+                                        headers: {
+                                            'Content-Type': 'application/json'
+                                        },
+                                        body: JSON.stringify({formValue}),
+                                    }
+                                );
+                                if (response.ok) {
+                                    var res = await response.json();
+                                    if (res["STATUS"] === 1) {
+                                        res["DATA"]["transaction"];
+                                        swal("Transaksi Berhasil", "success");
+                                    } 
+                                    else {
+                                        swal("Transaksi Gagal", `${res["DATA"].message || res["DATA"] }`, "error");
+                                    }
+                                } else {
+                                    alert(`Transaksi Gagal 2. ${response.statusText} `);
+                                }
+                            }}
+                        > 
+                            <Icon className={classes.icons}>attach_money</Icon>
+                            Buat Pesanan
+                        </Button1>
+                    </Grid>
+                    <Grid item xs={6} style={{padding:"20px"}}>
+                        <Button1 color="danger" style={{width:"100%"}}>
+                            <Icon className={classes.icons}>attach_money</Icon>
+                            Batalkan Pesanan
+                        </Button1>
+                    </Grid>
+                </GridContainer>
+                {/* <GridContainer>
+                    <Grid item xs={6} style={{padding:"20px"}}>
+                        <Button1 color="info" onClick={(e)=>{snap.pay(transactionToken);}} style={{width:"100%"}}>
+                            <Icon className={classes.icons}>attach_money</Icon>
+                            Bayar Pesanan
+                        </Button1>
+                    </Grid>
+                </GridContainer> */}
             </div>
         </div>
     );
 }
 
-export default DataCheckout;
+export default DataCheckout;

pages-sections/yamaha/home/business_partner.js

@@ -4,7 +4,7 @@ import { makeStyles } from "@material-ui/core/styles";
 import GridContainer from "components/Grid/GridContainer.js";
 import Grid from '@material-ui/core/Grid';
 import Card from "components/Card/Card.js";
-import styles from "assets/jss/nextjs-material-kit/pages/componentsSections/notificationsStyles.js";
+import styles from "assets/jss/nextjs-material-kit/pages/profilePage.js";
 import SnackbarContent from "components/Snackbar/SnackbarContent.js";
 
 const useStyles = makeStyles(styles);

pages-sections/yamaha/home/core_value.js

@@ -4,7 +4,7 @@ import { makeStyles } from "@material-ui/core/styles";
 import GridContainer from "components/Grid/GridContainer.js";
 import GridItem from "components/Grid/GridItem.js";
 import Card from "components/Card/Card.js";
-import styles from "assets/jss/nextjs-material-kit/pages/componentsSections/notificationsStyles.js";
+import styles from "assets/jss/nextjs-material-kit/pages/profilePage.js";
 import Carousel from "react-slick";
 
 import image1 from "assets/img/core1.png";

pages-sections/yamaha/home/service.js

@@ -5,7 +5,7 @@ import GridContainer from "components/Grid/GridContainer.js";
 import Grid from '@material-ui/core/Grid';
 import Paper from '@material-ui/core/Paper';
 import Card from "components/Card/Card.js";
-import styles from "assets/jss/nextjs-material-kit/pages/componentsSections/notificationsStyles.js";
+import styles from "assets/jss/nextjs-material-kit/pages/profilePage.js";
 import SnackbarContent from "components/Snackbar/SnackbarContent.js";
 
 const useStyles = makeStyles(styles);

pages-sections/yamaha/latest_news/news.js

@@ -2,7 +2,7 @@ import React from 'react';
 
 import { makeStyles } from "@material-ui/core/styles";
 
-import styles from "assets/jss/nextjs-material-kit/pages/componentsSections/notificationsStyles.js";
+import styles from "assets/jss/nextjs-material-kit/pages/profilePage.js";
 import Grid from '@material-ui/core/Grid';
 import GridContainer from "components/Grid/GridContainer.js";
 import GridItem from "components/Grid/GridItem.js";

pages-sections/yamaha/latest_news/news_details.js

@@ -69,11 +69,6 @@ const DataLatestNews = function ({ backend, news, othernews,...props }) {
                                             <img className={navImageClasses} width="300px" alt="First slide" src={`${backend}${data.img[0]["url"]}`} />
                                         </Carousel>
                                     </Card>
-                                    <hr></hr>
-                                    <div align="center">
-                                        <h3>Other Latest News</h3>
-                                        <h3>{otherlatnews}</h3>
-                                    </div>
                                 </GridItem>
                             </GridContainer>
                             </div>

pages-sections/yamaha/order/order.js

@@ -17,120 +17,343 @@ import Typography from '@material-ui/core/Typography';
 import styles from "assets/jss/nextjs-material-kit/pages/profilePage.js";
 import Carousel from "react-slick";
 import Image from "assets/img/sosmed/yt.jpg";
+import Paper from '@material-ui/core/Paper';
 
 const useStyles = makeStyles(styles);
-const DataCheckout = function ({ backend, order,  ...props }) {
+const DataCheckout = function ({ backend, order, unpaid, prepared, sending, finished, ...props }) {
     const classes = useStyles();
     const navImageClasses = classNames(classes.imgRounded, classes.imgGallery);
     const SemuaOrder = order.map((data) => {
         return (
-            <div align="center">
-                <Card className={classes.textCenter} align="center">
-                    <CardBody>
-                    <div style={{padding:"10px"}}>
-                        <h5>Yusmar</h5>
-                        <h5>087797315685</h5>
-                        <h5>Thamrin Indrapura Jl.Aipda Karel Satsuit Tubun,17 Ilir, Kec.Ilir Tim.I, Palembang, KOTA PALEMBANG - ILIR TIMUR II, SUMATERA SELATAN, ID 30114</h5>
-                        <Button color="info" href={"/yamaha/profile/edit-profile"}>
-                            <Icon className={classes.icons}>cached</Icon>
-                            Ubah Alamat
-                        </Button>
-                    </div>
-                    </CardBody>
+            <div className={classes.root}>
+                <Card style={{padding:"10px"}}>
+                    <Grid container spacing={3}>
+                        <Grid item xs={6}>
+                            <h4>Dealer A.Rivai | Thamrin Brothers - Yamaha</h4>
+                        </Grid>
+                        <Grid item xs={6}>
+                            <div align="right">
+                                <h4>Paket Telah Diterima | Selesai</h4>
+                            </div>
+                        </Grid>
+                    </Grid>
+                    <Grid container spacing={3}>
+                        <Grid item xs={4}><br/>
+                            <img src={Image} width="60%"/>
+                        </Grid>
+                        <Grid item xs={4} style={{marginLeft:"-70px", marginTop:"12px"}}>
+                            <h4>All New NMAX 155 Connected / ABS Version</h4>
+                            <h5>Variasi = Hitam</h5>
+                            <h5>Jumlah = 1 Unit</h5>
+                        </Grid>
+                        <Grid item xs={4}>
+                            <div align="right" style={{marginRight:"-70px", marginTop:"12px"}}>
+                                <h4>Rp.32.000.000,-</h4><br/><br/><br/><br/>
+                                <h4>Total Pesanan = Rp.32.000.000,-</h4>
+                            </div>
+                        </Grid>
+                    </Grid>
+                    <Grid container>
+                        <Grid item xs={4}>
+                            <h5>Nilai produk sebelum 30-10-2021</h5>
+                            <h5>Nilai sekarang & dapatkan 100 Koin Loyalty!</h5>
+                        </Grid>
+                        <Grid item xs={2}>
+
+                        </Grid>
+                        <Grid item xs={2}>
+
+                        </Grid>
+                        <Grid item xs={2}>
+                            <div align="right">
+                            <Button color="danger" href={"/yamaha/product/product_detail?s="}>
+                                <Icon className={classes.icons}>shopping_cart</Icon>Beli Lagi Produk
+                            </Button>
+                            </div>
+                        </Grid>
+                        <Grid item xs={2}>
+                            <div align="right">
+                            <Button 
+                                color="info"
+                                href={"/yamaha/product/product_detail?s="}
+                            >
+                                <Icon className={classes.icons}>open_in_new</Icon>Beri Nilai Produk
+                            </Button>
+                            </div>
+                        </Grid>
+                    </Grid>
                 </Card>
             </div>
         );
     })
 
-    const BelumBayar = order.map((data) => {
+    const BelumBayar = unpaid.map((data) => {
         return (
-            <div align="center">
-                <Card className={classes.textCenter} align="center">
-                    <CardBody>
-                    <div style={{padding:"10px"}}>
-                        <h5>Yusmar</h5>
-                        <h5>087797315685</h5>
-                        <h5>Thamrin Indrapura Jl.Aipda Karel Satsuit Tubun,17 Ilir, Kec.Ilir Tim.I, Palembang, KOTA PALEMBANG - ILIR TIMUR II, SUMATERA SELATAN, ID 30114</h5>
-                        <Button color="info" href={"/yamaha/profile/edit-profile"}>
-                            <Icon className={classes.icons}>cached</Icon>
-                            Ubah Alamat
-                        </Button>
-                    </div>
-                    </CardBody>
+            <div className={classes.root}>
+                <Card style={{padding:"10px"}}>
+                    <Grid container spacing={3}>
+                        <Grid item xs={6}>
+                            <h4>Dealer A.Rivai | Thamrin Brothers - Yamaha</h4>
+                        </Grid>
+                        <Grid item xs={6}>
+                            <div align="right">
+                                <h4>Paket Telah Diterima | Selesai</h4>
+                            </div>
+                        </Grid>
+                    </Grid>
+                    <hr/>
+                    <Grid container spacing={3}>
+                        <Grid item xs={4}><br/>
+                            <img src={Image} width="60%"/>
+                        </Grid>
+                        <Grid item xs={4} style={{marginLeft:"-70px", marginTop:"12px"}}>
+                            <h4>All New NMAX 155 Connected / ABS Version</h4>
+                            <h5>Variasi = Hitam</h5>
+                            <h5>Jumlah = 1 Unit</h5>
+                        </Grid>
+                        <Grid item xs={4}>
+                            <div align="right" style={{marginRight:"-70px", marginTop:"12px"}}>
+                                <h4>Rp.32.000.000,-</h4><br/><br/><br/><br/>
+                                <h4>Total Pesanan = Rp.32.000.000,-</h4>
+                            </div>
+                        </Grid>
+                    </Grid>
+                    <Grid container>
+                        <Grid item xs={4}>
+                            <h5>Nilai produk sebelum 30-10-2021</h5>
+                            <h5>Nilai sekarang & dapatkan 100 Koin Loyalty!</h5>
+                        </Grid>
+                        <Grid item xs={2}>
+
+                        </Grid>
+                        <Grid item xs={2}>
+
+                        </Grid>
+                        <Grid item xs={2}>
+                            <div align="right">
+                            <Button color="danger" href={"/yamaha/product/product_detail?s="}>
+                                <Icon className={classes.icons}>shopping_cart</Icon>Bayar Produk
+                            </Button>
+                            </div>
+                        </Grid>
+                        <Grid item xs={2}>
+                            <div align="right">
+                            <Button 
+                                color="info"
+                                href={"/yamaha/product/product_detail?s="}
+                            >
+                                <Icon className={classes.icons}>open_in_new</Icon>Hapus Produk
+                            </Button>
+                            </div>
+                        </Grid>
+                    </Grid>
                 </Card>
             </div>
         );
     })
 
-    const Dikemas = order.map((data) => {
+    const Dikemas = prepared.map((data) => {
         return (
-            <GridContainer>
-                <div align="left">
-                        <GridContainer style={{padding:"15px"}}>
-                            <Grid xs={4}> 
-                                <div className={classes.section} id="notifications">
-                                    <div className={classes.section}>
-                                        <div className={classes.container}>
-                                        <GridContainer>
-                                            <GridItem className={classes.marginAuto}>
-                                                <img className={navImageClasses} width="100px" alt="First slide" src={Image}/>
-                                            </GridItem>
-                                        </GridContainer>
-                                        </div>
-                                    </div>
-                                </div>
-                            </Grid>
-                            <Grid xs={8} style={{padding:"40px", marginTop:"-50px"}}>
-                                <div align="right">
+            <div className={classes.root}>
+                <Card style={{padding:"10px"}}>
+                    <Grid container spacing={3}>
+                        <Grid item xs={6}>
+                            <h4>Dealer A.Rivai | Thamrin Brothers - Yamaha</h4>
+                        </Grid>
+                        <Grid item xs={6}>
+                            <div align="right">
+                                <h4>Paket Telah Diterima | Selesai</h4>
+                            </div>
+                        </Grid>
+                    </Grid>
+                    <hr/>
+                    <Grid container spacing={3}>
+                        <Grid item xs={4}><br/>
+                            <img src={Image} width="80%"/>
+                        </Grid>
+                        <Grid item xs={4}>
+                            <h3>All New NMAX 155 Connected / ABS Version</h3>
+                            <h5>Variasi = Hitam</h5>
+                            <h5>Jumlah = 1 Unit</h5>
+                        </Grid>
+                        <Grid item xs={4}>
+                            <div align="left">
+                                <h3>Rp.32.000.000,-</h3><br/><br/><br/><br/>
+                                <h3>Total Pesanan = Rp.32.000.000,-</h3>
+                            </div>
+                        </Grid>
+                    </Grid>
+                    <hr/><br/>
+                    <Grid container>
+                        <Grid item xs={4}>
+                            <h5>Nilai produk sebelum 30-10-2021</h5>
+                            <h5>Nilai sekarang & dapatkan 100 Koin Loyalty!</h5>
+                        </Grid>
+                        <Grid item xs={2}>
 
-                                </div>
-                                <div align="left">
-                                    <h4>All New NMAX VSS</h4>
-                                    <h4>Variasi : Hitam</h4>
-                                    <h4>Jumlah : 1 Unit</h4>
-                                </div>
-                            </Grid>
-                        </GridContainer>
-                </div>    
-            </GridContainer>
+                        </Grid>
+                        <Grid item xs={2}>
+
+                        </Grid>
+                        <Grid item xs={2}>
+                            <div align="right">
+                            <Button 
+                                color="danger"
+                                href={"/yamaha/product/product_detail?s="}
+                            >
+                                <Icon className={classes.icons}>shopping_cart</Icon>Beli Lagi Produk
+                            </Button>
+                            </div>
+                        </Grid>
+                        <Grid item xs={2}>
+                            <div align="right">
+                            <Button 
+                                color="info"
+                                href={"/yamaha/product/product_detail?s="}
+                            >
+                                <Icon className={classes.icons}>open_in_new</Icon>Beri Nilai Produk
+                            </Button>
+                            </div>
+                        </Grid>
+                    </Grid>
+                </Card>
+            </div>
         );
     })
 
-    const Dikirim = order.map((data) => {
+    const Dikirim = sending.map((data) => {
         return (
-            <div align="center">
-                <Card className={classes.textCenter} align="center">
-                    <CardBody>
-                    <div style={{padding:"10px"}}>
-                        <h5>Yusmar</h5>
-                        <h5>087797315685</h5>
-                        <h5>Thamrin Indrapura Jl.Aipda Karel Satsuit Tubun,17 Ilir, Kec.Ilir Tim.I, Palembang, KOTA PALEMBANG - ILIR TIMUR II, SUMATERA SELATAN, ID 30114</h5>
-                        <Button color="info" href={"/yamaha/profile/edit-profile"}>
-                            <Icon className={classes.icons}>cached</Icon>
-                            Ubah Alamat
-                        </Button>
-                    </div>
-                    </CardBody>
+            <div className={classes.root}>
+                <Card style={{padding:"10px"}}>
+                    <Grid container spacing={3}>
+                        <Grid item xs={6}>
+                            <h4>Dealer A.Rivai | Thamrin Brothers - Yamaha</h4>
+                        </Grid>
+                        <Grid item xs={6}>
+                            <div align="right">
+                                <h4>Paket Telah Diterima | Selesai</h4>
+                            </div>
+                        </Grid>
+                    </Grid>
+                    <hr/>
+                    <Grid container spacing={3}>
+                        <Grid item xs={4}><br/>
+                            <img src={Image} width="80%"/>
+                        </Grid>
+                        <Grid item xs={4}>
+                            <h3>All New NMAX 155 Connected / ABS Version</h3>
+                            <h5>Variasi = Hitam</h5>
+                            <h5>Jumlah = 1 Unit</h5>
+                        </Grid>
+                        <Grid item xs={4}>
+                            <div align="left">
+                                <h3>Rp.32.000.000,-</h3><br/><br/><br/><br/>
+                                <h3>Total Pesanan = Rp.32.000.000,-</h3>
+                            </div>
+                        </Grid>
+                    </Grid>
+                    <hr/><br/>
+                    <Grid container>
+                        <Grid item xs={4}>
+                            <h5>Nilai produk sebelum 30-10-2021</h5>
+                            <h5>Nilai sekarang & dapatkan 100 Koin Loyalty!</h5>
+                        </Grid>
+                        <Grid item xs={2}>
+
+                        </Grid>
+                        <Grid item xs={2}>
+
+                        </Grid>
+                        <Grid item xs={2}>
+                            <div align="right">
+                            <Button 
+                                color="danger"
+                                href={"/yamaha/product/product_detail?s="}
+                            >
+                                <Icon className={classes.icons}>shopping_cart</Icon>Beli Lagi Produk
+                            </Button>
+                            </div>
+                        </Grid>
+                        <Grid item xs={2}>
+                            <div align="right">
+                            <Button 
+                                color="info"
+                                href={"/yamaha/product/product_detail?s="}
+                            >
+                                <Icon className={classes.icons}>open_in_new</Icon>Beri Nilai Produk
+                            </Button>
+                            </div>
+                        </Grid>
+                    </Grid>
                 </Card>
             </div>
         );
     })
 
-    const Selesai = order.map((data) => {
+    const Selesai = finished.map((data) => {
         return (
-            <div align="center">
-                <Card className={classes.textCenter} align="center">
-                    <CardBody>
-                    <div style={{padding:"10px"}}>
-                        <h5>Yusmar</h5>
-                        <h5>087797315685</h5>
-                        <h5>Thamrin Indrapura Jl.Aipda Karel Satsuit Tubun,17 Ilir, Kec.Ilir Tim.I, Palembang, KOTA PALEMBANG - ILIR TIMUR II, SUMATERA SELATAN, ID 30114</h5>
-                        <Button color="info" href={"/yamaha/profile/edit-profile"}>
-                            <Icon className={classes.icons}>cached</Icon>
-                            Ubah Alamat
-                        </Button>
-                    </div>
-                    </CardBody>
+            <div className={classes.root}>
+                <Card style={{padding:"10px"}}>
+                    <Grid container spacing={3}>
+                        <Grid item xs={6}>
+                            <h4>Dealer A.Rivai | Thamrin Brothers - Yamaha</h4>
+                        </Grid>
+                        <Grid item xs={6}>
+                            <div align="right">
+                                <h4>Paket Telah Diterima | Selesai</h4>
+                            </div>
+                        </Grid>
+                    </Grid>
+                    <hr/>
+                    <Grid container spacing={3}>
+                        <Grid item xs={4}><br/>
+                            <img src={Image} width="80%"/>
+                        </Grid>
+                        <Grid item xs={4}>
+                            <h3>All New NMAX 155 Connected / ABS Version</h3>
+                            <h5>Variasi = Hitam</h5>
+                            <h5>Jumlah = 1 Unit</h5>
+                        </Grid>
+                        <Grid item xs={4}>
+                            <div align="left">
+                                <h3>Rp.32.000.000,-</h3><br/><br/><br/><br/>
+                                <h3>Total Pesanan = Rp.32.000.000,-</h3>
+                            </div>
+                        </Grid>
+                    </Grid>
+                    <hr/><br/>
+                    <Grid container>
+                        <Grid item xs={4}>
+                            <h5>Nilai produk sebelum 30-10-2021</h5>
+                            <h5>Nilai sekarang & dapatkan 100 Koin Loyalty!</h5>
+                        </Grid>
+                        <Grid item xs={2}>
+
+                        </Grid>
+                        <Grid item xs={2}>
+
+                        </Grid>
+                        <Grid item xs={2}>
+                            <div align="right">
+                            <Button
+                                color="danger"
+                                href={"/yamaha/product/product_detail?s="}
+                            >
+                                <Icon className={classes.icons}>shopping_cart</Icon>Beli Lagi Produk
+                            </Button>
+                            </div>
+                        </Grid>
+                        <Grid item xs={2}>
+                            <div align="right">
+                            <Button 
+                                color="info"
+                                href={"/yamaha/product/product_detail?s="}
+                            >
+                                <Icon className={classes.icons}>open_in_new</Icon>Beri Nilai Produk
+                            </Button>
+                            </div>
+                        </Grid>
+                    </Grid>
                 </Card>
             </div>
         );
@@ -155,64 +378,60 @@ const DataCheckout = function ({ backend, order,  ...props }) {
                             tabButton: "Semua",
                             tabIcon: Dashboard,
                             tabContent: (
-                            <GridContainer justify="center">
                                 <div>
-                                    <Typography variant="h6" align="left" className={classes.title}>
-                                        Semua Pesanan
-                                    </Typography><hr/>
-                                    {SemuaOrder}
+                                    <h2>Semua Pesanan</h2><hr/>
+                                    <div style={{padding:"20px"}}>
+                                        {SemuaOrder}
+                                    </div>
                                 </div>
-                            </GridContainer>
                             ),
                         },
                         {
                             tabButton: "Belum Bayar",
                             tabIcon: Dashboard,
                             tabContent: (
-                            <GridContainer justify="center">
                                 <div>
-                                    <Typography variant="h6" align="left" className={classes.title}>
-                                        Belum Bayar
-                                    </Typography><hr/>
-                                    {BelumBayar}
+                                    <h2>Belum Bayar</h2><hr/>
+                                    <div >
+                                        {BelumBayar}
+                                    </div>
                                 </div>
-                            </GridContainer>
                             ),
                         },
                         {
                             tabButton: "Dikemas",
                             tabIcon: Dashboard,
                             tabContent: (
-                            <GridContainer justify="center">
-                                <Typography variant="h6" align="left" className={classes.title}>
-                                    Dikemas
-                                </Typography><hr/>
-                                {Dikemas}
-                            </GridContainer>
+                                <div>
+                                    <h2>Dikemas</h2><hr/>
+                                    <div >
+                                        {Dikemas}
+                                    </div>
+                                </div>
                             ),
                         },
                         {
                             tabButton: "Dikirim",
                             tabIcon: Dashboard,
                             tabContent: (
-                            <GridContainer justify="center">
-                                <Typography variant="h6" align="left" className={classes.title}>
-                                    Dikirim
-                                </Typography><hr/>
-                                {Dikirim}
-                            </GridContainer>
+                                <div>
+                                    <h2>Dikirim</h2><hr/>
+                                    <div >
+                                        {Dikirim}
+                                    </div>
+                                </div>
                             ),
                         },
                         {
                             tabButton: "Selesai",
                             tabIcon: Dashboard,
                             tabContent: (
-                            <GridContainer justify="center">
-                                <Typography variant="h6" align="left" className={classes.title}>
-                                    Selesai
-                                </Typography><hr/>
-                                {Selesai}
-                            </GridContainer>
+                                <div>
+                                    <h2>Selesai</h2><hr/>
+                                    <div >
+                                        {Selesai}
+                                    </div>
+                                </div>
                             ),
                         },
                         ]}

pages-sections/yamaha/product/product.js

@@ -2,15 +2,12 @@ import React from "react";
 import classNames from "classnames";
 
 import { makeStyles } from "@material-ui/core/styles";
-import Dashboard from "@material-ui/icons/Dashboard";
-
 import GridContainer from "components/Grid/GridContainer.js";
 import GridItem from "components/Grid/GridItem.js";
 import NavPills from "components/NavPills/NavPills.js";
 import Card from "components/Card/Card.js";
 import CardBody from "components/Card/CardBody.js";
 import CardHeader from "components/Card/CardHeader.js";
-import CardFooter from "components/Card/CardFooter.js";
 import Button from "components/CustomButtons/Button.js";
 import styles from "assets/jss/nextjs-material-kit/pages/profilePage.js";
 import Icon from "@material-ui/core/Icon";
@@ -36,7 +33,9 @@ const DataProduct = function ({ backend, maxi, matic, naked, sport, offroad, mop
                 />
                 <div align="center">
                 <h5>{data.name}</h5>
-                <h5>Rp.{data.price}</h5>
+                <h5>Rp.{data.price}
+                  {/* <NumberFormat value={data.price} displayType={'text'} thousandSeparator={true} prefix={'$'} /> */}
+                </h5>
                 <Button 
                     color="info" round
                     href={"/yamaha/product/product_detail?s="+data.id}

pages/api/auth/login.js

@@ -1,41 +0,0 @@
-import auth from "../../../api/auth/auth";
-import Cookies from "cookies";
-
-export default async function handler(req, res) {
-    if (req.method == "POST") {
-        const cookies = new Cookies(req, res);
-        var email = req.body.email;
-        var pass = req.body.pass;
-        var partner = req.body.partner;
-        var resp = await auth.login(partner, email, pass);
-        var login = resp["res"];
-        // console.log(login["DATA"]);
-        if (login["STATUS"] == 0) {
-            return res
-                .status(400)
-                .send(login["DATA"] + ". Check user and password again.");
-        }
-        var userObj = resp["cookies"]["user"];
-        await cookies.set("myToken", resp["cookies"]["token"], {
-            httpOnly: true, // true by default
-        });
-        await cookies.set("user", JSON.stringify(userObj), {
-            httpOnly: true, // true by default
-        });
-        let sessionId = userObj["partners_login_states"].filter(
-            (i) =>
-                i.business_partner &&
-                i.business_partner.name.toUpperCase() == partner.toUpperCase()
-        );
-        if (sessionId.length == 0) return res.status(400).send("Login Failed");
-        return res.status(200).send("Success Login");
-        // res.status(200).json(login);
-        // res.writeHead(200, {
-        //     Location: "../home",
-        //     //add other headers here...
-        // });
-        // res.end();
-    } else {
-        return res.status(400).send("NOT FOUND");
-    }
-}

pages/api/auth/logout.js

@@ -1,36 +0,0 @@
-import auth from "../../../api/auth/auth";
-import Cookies from "cookies";
-
-export default async function handler(req, res) {
-    if (req.method == "POST") {
-        const cookies = new Cookies(req, res);
-        const partner = req.body.p;
-        var user = await cookies.get("user");
-        var token = await cookies.get("myToken");
-        var userObj = user ? JSON.parse(user) : null;
-        let sessionId = userObj["partners_login_states"].filter(
-            (i) =>
-                i.business_partner &&
-                i.business_partner.name.toUpperCase() == partner.toUpperCase()
-        );
-        sessionId.forEach(async (i) => {
-            var resp = await auth.logout(i.id, token);
-            if (resp["STATUS"] == 0) {
-                return res.status(400).send(resp["DATA"]);
-            }
-        });
-        userObj["partners_login_states"] = userObj[
-            "partners_login_states"
-        ].filter(
-            (i) =>
-                i.business_partner &&
-                i.business_partner.name.toUpperCase() != partner.toUpperCase()
-        );
-        await cookies.set("user", JSON.stringify(userObj), {
-            httpOnly: true, // true by default
-        });
-        return res.status(200).send("Success Logout");
-    } else {
-        return res.status(400).send("NOT FOUND");
-    }
-}

pages/api/transaction/create.js

@@ -0,0 +1,8 @@
+import Transaction from "api/transaction/transaction";
+
+export default async function handler(req, resp) {
+    var input = req.body;
+    var res = await Transaction.newTransaction(input.formValue);
+    console.log(input);
+    resp.status(200).json(res);
+}

pages/hino/cart/checkout.js

@@ -0,0 +1,149 @@
+import React from "react";
+import classNames from "classnames";
+import { makeStyles } from "@material-ui/core/styles";
+
+import Header from "components/Header/Header.js";
+import HeaderLinks from "components/Header/HeaderHino.js";
+import Footer from "components/Footer/FooterHino.js";
+import Checkout from "pages-sections/yamaha/cart/checkout.js";
+import Parallax from "components/Parallax/Parallax.js";
+import styles from "assets/jss/nextjs-material-kit/pages/components.js";
+import GetCheckoutproduct from "api/cart/checkout.js";
+import Cookies from "cookies";
+
+const useStyles = makeStyles(styles);
+const ProductDetails = function ({ province, cities, backend, checkoutproduct, user, transactionToken, ...props })  {
+    const classes = useStyles();
+    const { ...rest } = props;
+    return (
+        <div>
+        <Header
+            rightLinks={<HeaderLinks username={user} />}
+            fixed
+            color="info"
+            changeColorOnScroll={{
+            height: 400,
+            color: "white"
+            }}
+            {...rest}
+        />
+        <Parallax image={require("assets/img/Promotion_2-1.jpg")} width="200px"/>
+        <div className={classNames(classes.main, classes.mainRaised)}>
+            <Checkout province={province} cities={cities} checkoutproduct={checkoutproduct} transactionToken={transactionToken} backend={backend} />  
+        </div>
+        <Footer />
+        </div>
+    );
+}
+
+export default ProductDetails;
+
+export async function getServerSideProps(context) {
+    var {query} = context;
+	var checkoutproduct = [];
+    const backend = process.env.BACKEND_SERVER_URI;
+
+    var { req, resp } = context;
+    const cookies = new Cookies(req, resp);
+    var user = "";
+    var userObj = (await cookies.get("user"))
+        ? JSON.parse(await cookies.get("user"))
+        : null;
+    if (userObj) {
+        let sessionId = userObj["partners_login_states"].filter(function (i) {
+        return (
+            i.business_partner && i.business_partner.name.toUpperCase() == "YAMAHA"
+        );
+        });
+        if (sessionId.length != 0) user = userObj["username"];
+    }
+
+	var res = await GetCheckoutproduct.GetCheckoutproduct(query.s||0);
+	if (res["STATUS"] === 1) {
+		checkoutproduct = res["DATA"]["products"];
+	}
+
+    //midtrans
+    var parameters = await GetCheckoutproduct.GetCheckoutproductBayar(query.s||0);
+    var transactionToken = [];
+    if ( parameters["STATUS"] === 1 )
+    {
+        const midtransClient = require('midtrans-client');
+        let snap = new midtransClient.Snap({
+            isProduction : false,
+            serverKey : 'SB-Mid-server-SfBhLkXXlTxCBx7EYP5T2k3d',
+            clientKey : 'SB-Mid-client-srx674LjNbEybd4-'
+        });
+        let parameter = {
+            "transaction_details": {
+                "order_id":parameters["DATA"]["product"]["id"],
+                "gross_amount":parameters["DATA"]["product"]["price"],
+            }, "credit_card":{
+                "secure" : true
+            },
+            "customer_details": {
+                    "first_name": "Yusmardi",
+                    "last_name": "anto",
+                    "email": "yusmardianto@thamrin.co.id",
+                    "phone": "087797315685",
+                    "billing_address": 
+                {
+                    "first_name": "Yusmardi",
+                    "last_name": "anto",
+                    "email": "yusmardianto@thamrin.co.id",
+                    "phone": "087797315685",
+                    "address": "Thamrin Indrapura Jl.Aipda Karel Satsuit Tubun",
+                    "city": "Kec.Ilir Tim.I, Palembang",
+                    "postal_code": "30114",
+                    "country_code": "IDN"
+                },
+                "shipping_address": 
+                {
+                    "first_name": "Yusmardi",
+                    "last_name": "anto",
+                    "email": "yusmardianto@thamrin.co.id",
+                    "phone": "087797315685",
+                    "address": "Thamrin Indrapura Jl.Aipda Karel Satsuit Tubun",
+                    "city": "Kec.Ilir Tim.I, Palembang",
+                    "postal_code": "30114",
+                    "country_code": "IDN"
+                }
+            }
+        };
+        
+        await snap.createTransaction(parameter)
+            .then((transaction)=>{
+                // transaction token
+                transactionToken = transaction.token;
+                console.log('transactionToken:',transactionToken);
+        
+                // transaction redirect url
+                let transactionRedirectUrl = transaction.redirect_url;
+                console.log('transactionRedirectUrl:',transactionRedirectUrl);
+            })
+            .catch((e)=>{
+                console.log('Error occured:',e.message);
+        });
+    }
+    
+    //rajaOngkir
+    var province = [];
+    var cities = [];
+    var RajaOngkir = require('rajaongkir-nodejs').Starter('f4ac703bb25ada32478d52ef2e1cab7a');
+
+    await RajaOngkir.getProvinces().then(function (result){
+        province = result;
+    }).catch(function (error){
+        // Aksi ketika error terjadi
+    });
+
+    await RajaOngkir.getCities().then(function (result){
+        cities = result;
+    }).catch(function (error){
+        // Aksi ketika error terjadi
+    });
+
+	return {
+		props: { province, cities, user, checkoutproduct, backend, transactionToken }, // will be passed to the page component as props
+	};
+}

pages/home.js

@@ -37,14 +37,9 @@ export default function LandingPage(props) {
     console.log(stylecss.act);
     return (
         <div>
-            <Header
-                color="dark"
-                routes={dashboardRoutes}
-                rightLinks={<HeaderHome />}
-                fixed
-            />
+        <Header color="dark" routes={dashboardRoutes} rightLinks={<HeaderHome />} fixed/>
         <Parallax color="dark" responsive image={require("assets/img/bga.png")}>
-            <div className={classes.container}>
+            <div>
             <GridContainer>
                 <GridItem>
                 <div align="center">
@@ -70,14 +65,14 @@ export default function LandingPage(props) {
         <div className={classNames(classes.main, classes.mainRaised)}>
             <div className={classes.container}>
                 <Carousel />
-                <CoreValue />
+                <CoreValue id={'section1'}/>
                 <BusineesPartner />
-                <Gallery />
-                <a href="https://wa.me/087797315685" target="_blank" class="float">
-                    <i class="fa fa-phone my-float"></i>
-                </a>
+                {/* <Gallery /> */}
+                {/* <a href="https://wa.me/087797315685" target="_blank" className="float">
+                    <i className="fa fa-phone my-float"></i>
+                </a> */}
             </div>
-        </div>
+        </div><br/>
         <Footer />
         </div>
     );

pages/honda/cart/checkout.js

@@ -0,0 +1,149 @@
+import React from "react";
+import classNames from "classnames";
+import { makeStyles } from "@material-ui/core/styles";
+
+import Header from "components/Header/Header.js";
+import HeaderLinks from "components/Header/HeaderHonda.js";
+import Footer from "components/Footer/FooterHonda.js";
+import Checkout from "pages-sections/yamaha/cart/checkout.js";
+import Parallax from "components/Parallax/Parallax.js";
+import styles from "assets/jss/nextjs-material-kit/pages/components.js";
+import GetCheckoutproduct from "api/cart/checkout.js";
+import Cookies from "cookies";
+
+const useStyles = makeStyles(styles);
+const ProductDetails = function ({ province, cities, backend, checkoutproduct, user, transactionToken, ...props })  {
+    const classes = useStyles();
+    const { ...rest } = props;
+    return (
+        <div>
+        <Header
+            rightLinks={<HeaderLinks username={user} />}
+            fixed
+            color="info"
+            changeColorOnScroll={{
+            height: 400,
+            color: "white"
+            }}
+            {...rest}
+        />
+        <Parallax image={require("assets/img/Promotion_2-1.jpg")} width="200px"/>
+        <div className={classNames(classes.main, classes.mainRaised)}>
+            <Checkout province={province} cities={cities} checkoutproduct={checkoutproduct} transactionToken={transactionToken} backend={backend} />  
+        </div>
+        <Footer />
+        </div>
+    );
+}
+
+export default ProductDetails;
+
+export async function getServerSideProps(context) {
+    var {query} = context;
+	var checkoutproduct = [];
+    const backend = process.env.BACKEND_SERVER_URI;
+
+    var { req, resp } = context;
+    const cookies = new Cookies(req, resp);
+    var user = "";
+    var userObj = (await cookies.get("user"))
+        ? JSON.parse(await cookies.get("user"))
+        : null;
+    if (userObj) {
+        let sessionId = userObj["partners_login_states"].filter(function (i) {
+        return (
+            i.business_partner && i.business_partner.name.toUpperCase() == "YAMAHA"
+        );
+        });
+        if (sessionId.length != 0) user = userObj["username"];
+    }
+
+	var res = await GetCheckoutproduct.GetCheckoutproduct(query.s||0);
+	if (res["STATUS"] === 1) {
+		checkoutproduct = res["DATA"]["products"];
+	}
+
+    //midtrans
+    var parameters = await GetCheckoutproduct.GetCheckoutproductBayar(query.s||0);
+    var transactionToken = [];
+    if ( parameters["STATUS"] === 1 )
+    {
+        const midtransClient = require('midtrans-client');
+        let snap = new midtransClient.Snap({
+            isProduction : false,
+            serverKey : 'SB-Mid-server-SfBhLkXXlTxCBx7EYP5T2k3d',
+            clientKey : 'SB-Mid-client-srx674LjNbEybd4-'
+        });
+        let parameter = {
+            "transaction_details": {
+                "order_id":parameters["DATA"]["product"]["id"],
+                "gross_amount":parameters["DATA"]["product"]["price"],
+            }, "credit_card":{
+                "secure" : true
+            },
+            "customer_details": {
+                    "first_name": "Yusmardi",
+                    "last_name": "anto",
+                    "email": "yusmardianto@thamrin.co.id",
+                    "phone": "087797315685",
+                    "billing_address": 
+                {
+                    "first_name": "Yusmardi",
+                    "last_name": "anto",
+                    "email": "yusmardianto@thamrin.co.id",
+                    "phone": "087797315685",
+                    "address": "Thamrin Indrapura Jl.Aipda Karel Satsuit Tubun",
+                    "city": "Kec.Ilir Tim.I, Palembang",
+                    "postal_code": "30114",
+                    "country_code": "IDN"
+                },
+                "shipping_address": 
+                {
+                    "first_name": "Yusmardi",
+                    "last_name": "anto",
+                    "email": "yusmardianto@thamrin.co.id",
+                    "phone": "087797315685",
+                    "address": "Thamrin Indrapura Jl.Aipda Karel Satsuit Tubun",
+                    "city": "Kec.Ilir Tim.I, Palembang",
+                    "postal_code": "30114",
+                    "country_code": "IDN"
+                }
+            }
+        };
+        
+        await snap.createTransaction(parameter)
+            .then((transaction)=>{
+                // transaction token
+                transactionToken = transaction.token;
+                console.log('transactionToken:',transactionToken);
+        
+                // transaction redirect url
+                let transactionRedirectUrl = transaction.redirect_url;
+                console.log('transactionRedirectUrl:',transactionRedirectUrl);
+            })
+            .catch((e)=>{
+                console.log('Error occured:',e.message);
+        });
+    }
+    
+    //rajaOngkir
+    var province = [];
+    var cities = [];
+    var RajaOngkir = require('rajaongkir-nodejs').Starter('f4ac703bb25ada32478d52ef2e1cab7a');
+
+    await RajaOngkir.getProvinces().then(function (result){
+        province = result;
+    }).catch(function (error){
+        // Aksi ketika error terjadi
+    });
+
+    await RajaOngkir.getCities().then(function (result){
+        cities = result;
+    }).catch(function (error){
+        // Aksi ketika error terjadi
+    });
+
+	return {
+		props: { province, cities, user, checkoutproduct, backend, transactionToken }, // will be passed to the page component as props
+	};
+}

pages/suzuki/cart/checkout.js

@@ -0,0 +1,149 @@
+import React from "react";
+import classNames from "classnames";
+import { makeStyles } from "@material-ui/core/styles";
+
+import Header from "components/Header/Header.js";
+import HeaderLinks from "components/Header/HeaderSuzuki.js";
+import Footer from "components/Footer/FooterSuzuki.js";
+import Checkout from "pages-sections/yamaha/cart/checkout.js";
+import Parallax from "components/Parallax/Parallax.js";
+import styles from "assets/jss/nextjs-material-kit/pages/components.js";
+import GetCheckoutproduct from "api/cart/checkout.js";
+import Cookies from "cookies";
+
+const useStyles = makeStyles(styles);
+const ProductDetails = function ({ province, cities, backend, checkoutproduct, user, transactionToken, ...props })  {
+    const classes = useStyles();
+    const { ...rest } = props;
+    return (
+        <div>
+        <Header
+            rightLinks={<HeaderLinks username={user} />}
+            fixed
+            color="info"
+            changeColorOnScroll={{
+            height: 400,
+            color: "white"
+            }}
+            {...rest}
+        />
+        <Parallax image={require("assets/img/Promotion_2-1.jpg")} width="200px"/>
+        <div className={classNames(classes.main, classes.mainRaised)}>
+            <Checkout province={province} cities={cities} checkoutproduct={checkoutproduct} transactionToken={transactionToken} backend={backend} />  
+        </div>
+        <Footer />
+        </div>
+    );
+}
+
+export default ProductDetails;
+
+export async function getServerSideProps(context) {
+    var {query} = context;
+	var checkoutproduct = [];
+    const backend = process.env.BACKEND_SERVER_URI;
+
+    var { req, resp } = context;
+    const cookies = new Cookies(req, resp);
+    var user = "";
+    var userObj = (await cookies.get("user"))
+        ? JSON.parse(await cookies.get("user"))
+        : null;
+    if (userObj) {
+        let sessionId = userObj["partners_login_states"].filter(function (i) {
+        return (
+            i.business_partner && i.business_partner.name.toUpperCase() == "YAMAHA"
+        );
+        });
+        if (sessionId.length != 0) user = userObj["username"];
+    }
+
+	var res = await GetCheckoutproduct.GetCheckoutproduct(query.s||0);
+	if (res["STATUS"] === 1) {
+		checkoutproduct = res["DATA"]["products"];
+	}
+
+    //midtrans
+    var parameters = await GetCheckoutproduct.GetCheckoutproductBayar(query.s||0);
+    var transactionToken = [];
+    if ( parameters["STATUS"] === 1 )
+    {
+        const midtransClient = require('midtrans-client');
+        let snap = new midtransClient.Snap({
+            isProduction : false,
+            serverKey : 'SB-Mid-server-SfBhLkXXlTxCBx7EYP5T2k3d',
+            clientKey : 'SB-Mid-client-srx674LjNbEybd4-'
+        });
+        let parameter = {
+            "transaction_details": {
+                "order_id":parameters["DATA"]["product"]["id"],
+                "gross_amount":parameters["DATA"]["product"]["price"],
+            }, "credit_card":{
+                "secure" : true
+            },
+            "customer_details": {
+                    "first_name": "Yusmardi",
+                    "last_name": "anto",
+                    "email": "yusmardianto@thamrin.co.id",
+                    "phone": "087797315685",
+                    "billing_address": 
+                {
+                    "first_name": "Yusmardi",
+                    "last_name": "anto",
+                    "email": "yusmardianto@thamrin.co.id",
+                    "phone": "087797315685",
+                    "address": "Thamrin Indrapura Jl.Aipda Karel Satsuit Tubun",
+                    "city": "Kec.Ilir Tim.I, Palembang",
+                    "postal_code": "30114",
+                    "country_code": "IDN"
+                },
+                "shipping_address": 
+                {
+                    "first_name": "Yusmardi",
+                    "last_name": "anto",
+                    "email": "yusmardianto@thamrin.co.id",
+                    "phone": "087797315685",
+                    "address": "Thamrin Indrapura Jl.Aipda Karel Satsuit Tubun",
+                    "city": "Kec.Ilir Tim.I, Palembang",
+                    "postal_code": "30114",
+                    "country_code": "IDN"
+                }
+            }
+        };
+        
+        await snap.createTransaction(parameter)
+            .then((transaction)=>{
+                // transaction token
+                transactionToken = transaction.token;
+                console.log('transactionToken:',transactionToken);
+        
+                // transaction redirect url
+                let transactionRedirectUrl = transaction.redirect_url;
+                console.log('transactionRedirectUrl:',transactionRedirectUrl);
+            })
+            .catch((e)=>{
+                console.log('Error occured:',e.message);
+        });
+    }
+    
+    //rajaOngkir
+    var province = [];
+    var cities = [];
+    var RajaOngkir = require('rajaongkir-nodejs').Starter('f4ac703bb25ada32478d52ef2e1cab7a');
+
+    await RajaOngkir.getProvinces().then(function (result){
+        province = result;
+    }).catch(function (error){
+        // Aksi ketika error terjadi
+    });
+
+    await RajaOngkir.getCities().then(function (result){
+        cities = result;
+    }).catch(function (error){
+        // Aksi ketika error terjadi
+    });
+
+	return {
+		props: { province, cities, user, checkoutproduct, backend, transactionToken }, // will be passed to the page component as props
+	};
+}

pages/suzuki/home.js

@@ -50,8 +50,7 @@ const Home = function ({
         <DataSnackbarContent />
         <DataCarousel carousels={carousels} backend={backend} />
         <DataService service={service} backend={backend} />
-        <DataFeature />
-        {/* <DataSosmed service={service} backend={backend} /> */}
+        {/* <DataFeature /> */}
         <a href="https://wa.me/087797315685" target="_blank" class="float">
           <i class="fa fa-phone my-float"></i>
         </a>

pages/suzuki/latest_news/latestnews.js

@@ -8,9 +8,9 @@ import FooterSuzuki from "components/Footer/FooterSuzuki.js";
 import Parallax from "components/Parallax/Parallax.js";
 import styles from "assets/jss/nextjs-material-kit/pages/components.js";
 
-import GetLatestNews from "../../../api/latest_news/news.js"
-import DataSnackbarContent from "../../../pages-sections/suzuki/snackbar.js";
-import DataLatestNews from "../../../pages-sections/suzuki/latest_news/news.js";
+import GetLatestNews from "api/latest_news/news.js"
+import DataSnackbarContent from "pages-sections/suzuki/snackbar.js";
+import DataLatestNews from "pages-sections/suzuki/latest_news/news.js";
 
 const useStyles = makeStyles(styles);
 

pages/yamaha/cart/checkout.js

@@ -143,9 +143,6 @@ export async function getServerSideProps(context) {
         // Aksi ketika error terjadi
     });
 
-    console.log('provinsi',province);
-    console.log('kota',cities);
-    // console.log(cost);
 	return {
 		props: { province, cities, user, checkoutproduct, backend, transactionToken }, // will be passed to the page component as props
 	};

pages/yamaha/home.js

@@ -52,15 +52,9 @@ const Home = function ({
       />
       <div className={classNames(classes.main, classes.mainRaised)}>
         <DataSnackbarContent />
-        {/* <CoreValue /> */}
         <DataCarousel carousel={carousel} backend={backend} />
         <DataService service={service} backend={backend} />
         <DataFeature />
-        {/* <DataBusinessPartner
-          businessPartners={businessPartners}
-          backend={backend}
-        /> */}
-        {/* <DataSosmed /> */}
         <a href="https://wa.me/087797315685" target="_blank" class="float">
           <i class="fa fa-phone my-float"></i>
         </a>

pages/yamaha/order/order.js

@@ -8,11 +8,11 @@ import Footer from "components/Footer/Footer.js";
 import OrderProduct from "pages-sections/yamaha/order/order.js";
 import Parallax from "components/Parallax/Parallax.js";
 import styles from "assets/jss/nextjs-material-kit/pages/components.js";
-import GetOrder from "api/home/businessPartner.js";
+import GetTransaction from "api/transaction/transaction.js";
 import Cookies from "cookies";
 
 const useStyles = makeStyles(styles);
-const Order = function ({ user, order, backend, ...props })  {
+const Order = function ({ user, order, unpaid, prepared, sending, finished, backend, ...props })  {
     const classes = useStyles();
     const { ...rest } = props;
     return (
@@ -29,7 +29,7 @@ const Order = function ({ user, order, backend, ...props })  {
         />
         <Parallax image={require("assets/img/Promotion_2-1.jpg")} width="200px"/>
         <div className={classNames(classes.main, classes.mainRaised)}>
-            <OrderProduct order={order} backend={backend}/>  
+            <OrderProduct order={order} unpaid={unpaid} prepared={prepared} sending={sending} finished={finished} backend={backend}/>  
         </div>
         <Footer />
         </div>
@@ -41,9 +41,33 @@ export default Order;
 export async function getServerSideProps(context) {
 
     var order = [];
-    var res = await GetOrder.GetbusinessPartners();
+    var res = await GetTransaction.getTransaction();
     if (res["STATUS"] === 1) {
-        order = res["DATA"]["businessPartners"];
+        order = res["DATA"]["transactions"];
+    }
+
+    var unpaid = [];
+    var res = await GetTransaction.getTransactionUnpaid();
+    if (res["STATUS"] === 1) {
+        unpaid = res["DATA"]["transactions"];
+    }
+
+    var prepared = [];
+    var res = await GetTransaction.getTransactionPrepared();
+    if (res["STATUS"] === 1) {
+        prepared = res["DATA"]["transactions"];
+    }
+
+    var sending = [];
+    var res = await GetTransaction.getTransactionSending();
+    if (res["STATUS"] === 1) {
+        sending = res["DATA"]["transactions"];
+    }
+
+    var finished = [];
+    var res = await GetTransaction.getTransactionFinished();
+    if (res["STATUS"] === 1) {
+        finished = res["DATA"]["transactions"];
     }
 
     //backend
@@ -66,6 +90,6 @@ export async function getServerSideProps(context) {
     }
     
 	return {
-		props: { backend, user, order, }, // will be passed to the page component as props
+		props: { backend, user, unpaid, prepared, sending, finished, order, }, // will be passed to the page component as props
 	};
 }

yarn.lock

@@ -65,7 +65,7 @@
     tslib "^1.10.0"
     zen-observable "^0.8.14"
 
-"@babel/code-frame@^7.12.13", "@babel/code-frame@^7.5.5":
+"@babel/code-frame@^7.0.0", "@babel/code-frame@^7.12.13", "@babel/code-frame@^7.5.5":
   version "7.12.13"
   resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.12.13.tgz#dcfc826beef65e75c50e21d3837d7d95798dd658"
   integrity sha512-HV1Cm0Q3ZrpCR93tkWOYiuYIgLxZXZFVG2VgK+MBWjUqZTundupbfx2aXarXuw5Ko5aMcjtJgbSs4vUGBS5v6g==
@@ -942,6 +942,16 @@
   resolved "https://registry.yarnpkg.com/@date-io/moment/-/moment-1.3.5.tgz#e5bf3837cbd3f5f5f5d7f49d8549e4118ea75f8d"
   integrity sha512-b0JQb10Lie07iW2/9uKCQSrXif262d6zfYBstCLLJUk0JVA+7o/yLDg5p2+GkjgJbmodjHozIXs4Bi34RRhL8Q==
 
+"@emotion/cache@^10.0.27":
+  version "10.0.29"
+  resolved "https://registry.yarnpkg.com/@emotion/cache/-/cache-10.0.29.tgz#87e7e64f412c060102d589fe7c6dc042e6f9d1e0"
+  integrity sha512-fU2VtSVlHiF27empSbxi1O2JFdNWZO+2NFHfwO0pxgTep6Xa3uGb+3pVKfLww2l/IBGLNEZl5Xf/++A4wAYDYQ==
+  dependencies:
+    "@emotion/sheet" "0.9.4"
+    "@emotion/stylis" "0.8.5"
+    "@emotion/utils" "0.11.3"
+    "@emotion/weak-memoize" "0.2.5"
+
 "@emotion/cache@^11.0.0", "@emotion/cache@^11.1.3":
   version "11.1.3"
   resolved "https://registry.yarnpkg.com/@emotion/cache/-/cache-11.1.3.tgz#c7683a9484bcd38d5562f2b9947873cf66829afd"
@@ -953,7 +963,28 @@
     "@emotion/weak-memoize" "^0.2.5"
     stylis "^4.0.3"
 
-"@emotion/hash@^0.8.0":
+"@emotion/core@^10.0.14":
+  version "10.1.1"
+  resolved "https://registry.yarnpkg.com/@emotion/core/-/core-10.1.1.tgz#c956c1365f2f2481960064bcb8c4732e5fb612c3"
+  integrity sha512-ZMLG6qpXR8x031NXD8HJqugy/AZSkAuMxxqB46pmAR7ze47MhNJ56cdoX243QPZdGctrdfo+s08yZTiwaUcRKA==
+  dependencies:
+    "@babel/runtime" "^7.5.5"
+    "@emotion/cache" "^10.0.27"
+    "@emotion/css" "^10.0.27"
+    "@emotion/serialize" "^0.11.15"
+    "@emotion/sheet" "0.9.4"
+    "@emotion/utils" "0.11.3"
+
+"@emotion/css@^10.0.27":
+  version "10.0.27"
+  resolved "https://registry.yarnpkg.com/@emotion/css/-/css-10.0.27.tgz#3a7458198fbbebb53b01b2b87f64e5e21241e14c"
+  integrity sha512-6wZjsvYeBhyZQYNrGoR5yPMYbMBNEnanDrqmsqS1mzDm1cOTu12shvl2j4QHNS36UaTE0USIJawCH9C8oW34Zw==
+  dependencies:
+    "@emotion/serialize" "^0.11.15"
+    "@emotion/utils" "0.11.3"
+    babel-plugin-emotion "^10.0.27"
+
+"@emotion/hash@0.8.0", "@emotion/hash@^0.8.0":
   version "0.8.0"
   resolved "https://registry.yarnpkg.com/@emotion/hash/-/hash-0.8.0.tgz#bbbff68978fefdbe68ccb533bc8cbe1d1afb5413"
   integrity sha512-kBJtf7PH6aWwZ6fka3zQ0p6SBYzx4fl1LoZXE2RrnYST9Xljm7WfKJrU4g/Xr3Beg72MLrp1AWNUmuYJTL7Cow==
@@ -988,6 +1019,17 @@
     "@emotion/weak-memoize" "^0.2.5"
     hoist-non-react-statics "^3.3.1"
 
+"@emotion/serialize@^0.11.15", "@emotion/serialize@^0.11.16":
+  version "0.11.16"
+  resolved "https://registry.yarnpkg.com/@emotion/serialize/-/serialize-0.11.16.tgz#dee05f9e96ad2fb25a5206b6d759b2d1ed3379ad"
+  integrity sha512-G3J4o8by0VRrO+PFeSc3js2myYNOXVJ3Ya+RGVxnshRYgsvErfAOglKAiy1Eo1vhzxqtUvjCyS5gtewzkmvSSg==
+  dependencies:
+    "@emotion/hash" "0.8.0"
+    "@emotion/memoize" "0.7.4"
+    "@emotion/unitless" "0.7.5"
+    "@emotion/utils" "0.11.3"
+    csstype "^2.5.7"
+
 "@emotion/serialize@^1.0.0":
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/@emotion/serialize/-/serialize-1.0.2.tgz#77cb21a0571c9f68eb66087754a65fa97bfcd965"
@@ -999,27 +1041,37 @@
     "@emotion/utils" "^1.0.0"
     csstype "^3.0.2"
 
+"@emotion/sheet@0.9.4":
+  version "0.9.4"
+  resolved "https://registry.yarnpkg.com/@emotion/sheet/-/sheet-0.9.4.tgz#894374bea39ec30f489bbfc3438192b9774d32e5"
+  integrity sha512-zM9PFmgVSqBw4zL101Q0HrBVTGmpAxFZH/pYx/cjJT5advXguvcgjHFTCaIO3enL/xr89vK2bh0Mfyj9aa0ANA==
+
 "@emotion/sheet@^1.0.0", "@emotion/sheet@^1.0.1":
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/@emotion/sheet/-/sheet-1.0.1.tgz#245f54abb02dfd82326e28689f34c27aa9b2a698"
   integrity sha512-GbIvVMe4U+Zc+929N1V7nW6YYJtidj31lidSmdYcWozwoBIObXBnaJkKNDjZrLm9Nc0BR+ZyHNaRZxqNZbof5g==
 
-"@emotion/stylis@^0.8.4":
+"@emotion/stylis@0.8.5", "@emotion/stylis@^0.8.4":
   version "0.8.5"
   resolved "https://registry.yarnpkg.com/@emotion/stylis/-/stylis-0.8.5.tgz#deacb389bd6ee77d1e7fcaccce9e16c5c7e78e04"
   integrity sha512-h6KtPihKFn3T9fuIrwvXXUOwlx3rfUvfZIcP5a6rh8Y7zjE3O06hT5Ss4S/YI1AYhuZ1kjaE/5EaOOI2NqSylQ==
 
-"@emotion/unitless@^0.7.4", "@emotion/unitless@^0.7.5":
+"@emotion/unitless@0.7.5", "@emotion/unitless@^0.7.4", "@emotion/unitless@^0.7.5":
   version "0.7.5"
   resolved "https://registry.yarnpkg.com/@emotion/unitless/-/unitless-0.7.5.tgz#77211291c1900a700b8a78cfafda3160d76949ed"
   integrity sha512-OWORNpfjMsSSUBVrRBVGECkhWcULOAJz9ZW8uK9qgxD+87M7jHRcvh/A96XXNhXTLmKcoYSQtBEX7lHMO7YRwg==
 
+"@emotion/utils@0.11.3":
+  version "0.11.3"
+  resolved "https://registry.yarnpkg.com/@emotion/utils/-/utils-0.11.3.tgz#a759863867befa7e583400d322652a3f44820924"
+  integrity sha512-0o4l6pZC+hI88+bzuaX/6BgOvQVhbt2PfmxauVaYOGgbsAw14wdKyvMCZXnsnsHys94iadcF+RG/wZyx6+ZZBw==
+
 "@emotion/utils@^1.0.0":
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/@emotion/utils/-/utils-1.0.0.tgz#abe06a83160b10570816c913990245813a2fd6af"
   integrity sha512-mQC2b3XLDs6QCW+pDQDiyO/EdGZYOygE8s5N5rrzjSI4M3IejPE/JPndCBwRT9z982aqQNi6beWs1UeayrQxxA==
 
-"@emotion/weak-memoize@^0.2.5":
+"@emotion/weak-memoize@0.2.5", "@emotion/weak-memoize@^0.2.5":
   version "0.2.5"
   resolved "https://registry.yarnpkg.com/@emotion/weak-memoize/-/weak-memoize-0.2.5.tgz#8eed982e2ee6f7f4e44c253e12962980791efd46"
   integrity sha512-6U71C2Wp7r5XtFtQzYrW5iKFT67OixrSxjI4MptCHzdSVlgabczzqLe0ZSgnub/5Kp4hSbpDB1tMytZY9pwxxA==
@@ -1229,6 +1281,11 @@
     csstype "^2.0.0"
     indefinite-observable "^1.0.1"
 
+"@types/parse-json@^4.0.0":
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/@types/parse-json/-/parse-json-4.0.0.tgz#2f8bb441434d163b35fb8ffdccd7138927ffb8c0"
+  integrity sha512-//oorEZjL6sbPcKUaCdIGlIUeH26mgzimjBB77G6XRgnDl/L5wOnpyBGRe/Mmf5CVW3PwEBE1NjiMZ/ssFh4wA==
+
 "@types/prop-types@*", "@types/prop-types@^15.7.3":
   version "15.7.3"
   resolved "https://registry.yarnpkg.com/@types/prop-types/-/prop-types-15.7.3.tgz#2ab0d5da2e5815f94b0b9d4b95d1e5f243ab2ca7"
@@ -1746,6 +1803,31 @@ babel-plugin-dynamic-import-node@^2.3.0, babel-plugin-dynamic-import-node@^2.3.3
   dependencies:
     object.assign "^4.1.0"
 
+babel-plugin-emotion@^10.0.27:
+  version "10.2.2"
+  resolved "https://registry.yarnpkg.com/babel-plugin-emotion/-/babel-plugin-emotion-10.2.2.tgz#a1fe3503cff80abfd0bdda14abd2e8e57a79d17d"
+  integrity sha512-SMSkGoqTbTyUTDeuVuPIWifPdUGkTk1Kf9BWRiXIOIcuyMfsdp2EjeiiFvOzX8NOBvEh/ypKYvUh2rkgAJMCLA==
+  dependencies:
+    "@babel/helper-module-imports" "^7.0.0"
+    "@emotion/hash" "0.8.0"
+    "@emotion/memoize" "0.7.4"
+    "@emotion/serialize" "^0.11.16"
+    babel-plugin-macros "^2.0.0"
+    babel-plugin-syntax-jsx "^6.18.0"
+    convert-source-map "^1.5.0"
+    escape-string-regexp "^1.0.5"
+    find-root "^1.1.0"
+    source-map "^0.5.7"
+
+babel-plugin-macros@^2.0.0:
+  version "2.8.0"
+  resolved "https://registry.yarnpkg.com/babel-plugin-macros/-/babel-plugin-macros-2.8.0.tgz#0f958a7cc6556b1e65344465d99111a1e5e10138"
+  integrity sha512-SEP5kJpfGYqYKpBrj5XU3ahw5p5GOHJ0U5ssOSQ/WBVdwkD2Dzlce95exQTs3jOVWPPKLBN2rlEWkCK7dSmLvg==
+  dependencies:
+    "@babel/runtime" "^7.7.2"
+    cosmiconfig "^6.0.0"
+    resolve "^1.12.0"
+
 "babel-plugin-styled-components@>= 1":
   version "1.12.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-styled-components/-/babel-plugin-styled-components-1.12.0.tgz#1dec1676512177de6b827211e9eda5a30db4f9b9"
@@ -2085,6 +2167,11 @@ callsites@^2.0.0:
   resolved "https://registry.yarnpkg.com/callsites/-/callsites-2.0.0.tgz#06eb84f00eea413da86affefacbffb36093b3c50"
   integrity sha1-BuuE8A7qQT2oav/vrL/7Ngk7PFA=
 
+callsites@^3.0.0:
+  version "3.1.0"
+  resolved "https://registry.yarnpkg.com/callsites/-/callsites-3.1.0.tgz#b3630abd8943432f54b3f0519238e33cd7df2f73"
+  integrity sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ==
+
 camelcase-keys@^2.0.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/camelcase-keys/-/camelcase-keys-2.1.0.tgz#308beeaffdf28119051efa1d932213c91b8f92e7"
@@ -2417,7 +2504,7 @@ constants-browserify@^1.0.0:
   resolved "https://registry.yarnpkg.com/constants-browserify/-/constants-browserify-1.0.0.tgz#c20b96d8c617748aaf1c16021760cd27fcb8cb75"
   integrity sha1-wguW2MYXdIqvHBYCF2DNJ/y4y3U=
 
-convert-source-map@1.7.0, convert-source-map@^1.7.0:
+convert-source-map@1.7.0, convert-source-map@^1.5.0, convert-source-map@^1.7.0:
   version "1.7.0"
   resolved "https://registry.yarnpkg.com/convert-source-map/-/convert-source-map-1.7.0.tgz#17a2cb882d7f77d3490585e2ce6c524424a3a442"
   integrity sha512-4FJkXzKXEDB1snCFZlLP4gpC3JILicCpGbzG9f9G7tGqGCzETQ2hWPrcinA9oU4wtf2biUaEH5065UnMeR33oA==
@@ -2489,6 +2576,17 @@ cosmiconfig@^5.0.0:
     js-yaml "^3.13.1"
     parse-json "^4.0.0"
 
+cosmiconfig@^6.0.0:
+  version "6.0.0"
+  resolved "https://registry.yarnpkg.com/cosmiconfig/-/cosmiconfig-6.0.0.tgz#da4fee853c52f6b1e6935f41c1a2fc50bd4a9982"
+  integrity sha512-xb3ZL6+L8b9JLLCx3ZdoZy4+2ECphCMo2PwqgP1tlfVq6M6YReyzBJtvWWtbDSpNr9hn96pkCiZqUcFEc+54Qg==
+  dependencies:
+    "@types/parse-json" "^4.0.0"
+    import-fresh "^3.1.0"
+    parse-json "^5.0.0"
+    path-type "^4.0.0"
+    yaml "^1.7.2"
+
 create-ecdh@^4.0.0:
   version "4.0.4"
   resolved "https://registry.yarnpkg.com/create-ecdh/-/create-ecdh-4.0.4.tgz#d6e7f4bffa66736085a0762fd3a632684dabcc4e"
@@ -2780,7 +2878,7 @@ csso@^4.0.2:
   dependencies:
     css-tree "^1.1.2"
 
-csstype@^2.0.0, csstype@^2.5.2:
+csstype@^2.0.0, csstype@^2.5.2, csstype@^2.5.7:
   version "2.6.17"
   resolved "https://registry.yarnpkg.com/csstype/-/csstype-2.6.17.tgz#4cf30eb87e1d1a005d8b6510f95292413f6a1c0e"
   integrity sha512-u1wmTI1jJGzCJzWndZo8mk4wnPTZd1eOIYTYvuEyOQGfmDl3TrabCCfKnOC86FZwW/9djqTl933UF/cS425i9A==
@@ -3216,6 +3314,11 @@ es6-iterator@2.0.3, es6-iterator@~2.0.3:
     es5-ext "^0.10.35"
     es6-symbol "^3.1.1"
 
+es6-object-assign@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/es6-object-assign/-/es6-object-assign-1.1.0.tgz#c2c3582656247c39ea107cb1e6652b6f9f24523c"
+  integrity sha1-wsNYJlYkfDnqEHyx5mUrb58kUjw=
+
 es6-symbol@^3.1.1, es6-symbol@~3.1.3:
   version "3.1.3"
   resolved "https://registry.yarnpkg.com/es6-symbol/-/es6-symbol-3.1.3.tgz#bad5d3c1bcdac28269f4cb331e431c78ac705d18"
@@ -3437,6 +3540,11 @@ find-cache-dir@^2.1.0:
     make-dir "^2.0.0"
     pkg-dir "^3.0.0"
 
+find-root@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/find-root/-/find-root-1.1.0.tgz#abcfc8ba76f708c42a97b3d685b7e9450bfb9ce4"
+  integrity sha512-NKfW6bec6GfKc0SGx1e07QZY9PE99u0Bft/0rzSD5k3sO/vwkVUpDUKVm5Gpp5Ue3YfShPFTX2070tDs5kB9Ng==
+
 find-up@2.1.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/find-up/-/find-up-2.1.0.tgz#45d1b7e506c717ddd482775a2b77920a3c0c57a7"
@@ -3994,6 +4102,14 @@ import-fresh@^2.0.0:
     caller-path "^2.0.0"
     resolve-from "^3.0.0"
 
+import-fresh@^3.1.0:
+  version "3.3.0"
+  resolved "https://registry.yarnpkg.com/import-fresh/-/import-fresh-3.3.0.tgz#37162c25fcb9ebaa2e6e53d5b4d88ce17d9e0c2b"
+  integrity sha512-veYYhQa+D1QBKznvhUHxb8faxlrwUnxseDAbAp457E0wLNio2bOSKnjYDhMj+YiAq61xrMGhQk9iXVk5FzgQMw==
+  dependencies:
+    parent-module "^1.0.0"
+    resolve-from "^4.0.0"
+
 import-from@^2.1.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/import-from/-/import-from-2.1.0.tgz#335db7f2a7affd53aaa471d4b8021dee36b7f3b1"
@@ -4470,6 +4586,11 @@ json-parse-better-errors@^1.0.1, json-parse-better-errors@^1.0.2:
   resolved "https://registry.yarnpkg.com/json-parse-better-errors/-/json-parse-better-errors-1.0.2.tgz#bb867cfb3450e69107c131d1c514bab3dc8bcaa9"
   integrity sha512-mrqyZKfX5EhL7hvqcV6WG1yYjnjeuYDzDhhcAAUrq8Po85NBQBJP+ZDUT75qZQ98IkUoBqdkExkukOU7Ts2wrw==
 
+json-parse-even-better-errors@^2.3.0:
+  version "2.3.1"
+  resolved "https://registry.yarnpkg.com/json-parse-even-better-errors/-/json-parse-even-better-errors-2.3.1.tgz#7c47805a94319928e05777405dc12e1f7a4ee02d"
+  integrity sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w==
+
 json-schema-traverse@^0.4.1:
   version "0.4.1"
   resolved "https://registry.yarnpkg.com/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz#69f6a87d9513ab8bb8fe63bdb0979c448e684660"
@@ -4706,6 +4827,11 @@ less@^4.1.1:
     needle "^2.5.2"
     source-map "~0.6.0"
 
+lines-and-columns@^1.1.6:
+  version "1.1.6"
+  resolved "https://registry.yarnpkg.com/lines-and-columns/-/lines-and-columns-1.1.6.tgz#1c00c743b433cd0a4e80758f7b64a57440d9ff00"
+  integrity sha1-HADHQ7QzzQpOgHWPe2SldEDZ/wA=
+
 load-json-file@^1.0.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/load-json-file/-/load-json-file-1.1.0.tgz#956905708d58b4bab4c2261b04f59f31c99374c0"
@@ -5698,6 +5824,13 @@ parallel-transform@^1.1.0:
     inherits "^2.0.3"
     readable-stream "^2.1.5"
 
+parent-module@^1.0.0:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/parent-module/-/parent-module-1.0.1.tgz#691d2709e78c79fae3a156622452d00762caaaa2"
+  integrity sha512-GQ2EWRpQV8/o+Aw8YqtfZZPfNRWZYkbidE9k5rpl/hC3vtHHBfGm2Ifi6qWV+coDGkrUKZAxE3Lot5kcsRlh+g==
+  dependencies:
+    callsites "^3.0.0"
+
 parse-asn1@^5.0.0, parse-asn1@^5.1.5:
   version "5.1.6"
   resolved "https://registry.yarnpkg.com/parse-asn1/-/parse-asn1-5.1.6.tgz#385080a3ec13cb62a62d39409cb3e88844cdaed4"
@@ -5724,6 +5857,16 @@ parse-json@^4.0.0:
     error-ex "^1.3.1"
     json-parse-better-errors "^1.0.1"
 
+parse-json@^5.0.0:
+  version "5.2.0"
+  resolved "https://registry.yarnpkg.com/parse-json/-/parse-json-5.2.0.tgz#c76fc66dee54231c962b22bcc8a72cf2f99753cd"
+  integrity sha512-ayCKvm/phCGxOkYRSCM82iDwct8/EonSEgCSxWxD7ve6jHggsFl4fZVQBPRNgQoKiuV/odhFrGzQXZwbifC8Rg==
+  dependencies:
+    "@babel/code-frame" "^7.0.0"
+    error-ex "^1.3.1"
+    json-parse-even-better-errors "^2.3.0"
+    lines-and-columns "^1.1.6"
+
 parse-node-version@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/parse-node-version/-/parse-node-version-1.0.1.tgz#e2b5dbede00e7fa9bc363607f53327e8b073189b"
@@ -5787,6 +5930,11 @@ path-type@^1.0.0:
     pify "^2.0.0"
     pinkie-promise "^2.0.0"
 
+path-type@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/path-type/-/path-type-4.0.0.tgz#84ed01c0a7ba380afe09d90a8c180dcd9d03043b"
+  integrity sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==
+
 path@0.12.7:
   version "0.12.7"
   resolved "https://registry.yarnpkg.com/path/-/path-0.12.7.tgz#d4dc2a506c4ce2197eb481ebfcd5b36c0140b10f"
@@ -6302,6 +6450,11 @@ promise-inflight@^1.0.1:
   resolved "https://registry.yarnpkg.com/promise-inflight/-/promise-inflight-1.0.1.tgz#98472870bf228132fcbdd868129bad12c3c029e3"
   integrity sha1-mEcocL8igTL8vdhoEputEsPAKeM=
 
+promise-polyfill@^6.0.2:
+  version "6.1.0"
+  resolved "https://registry.yarnpkg.com/promise-polyfill/-/promise-polyfill-6.1.0.tgz#dfa96943ea9c121fca4de9b5868cb39d3472e057"
+  integrity sha1-36lpQ+qcEh/KTem1hoyznTRy4Fc=
+
 promise@^7.1.1:
   version "7.3.1"
   resolved "https://registry.yarnpkg.com/promise/-/promise-7.3.1.tgz#064b72602b18f90f29192b8b1bc418ffd1ebd3bf"
@@ -6535,6 +6688,15 @@ react-input-autosize@^3.0.0:
   dependencies:
     prop-types "^15.5.8"
 
+react-input-number@^5.0.19:
+  version "5.0.19"
+  resolved "https://registry.yarnpkg.com/react-input-number/-/react-input-number-5.0.19.tgz#3ce3e9522190c908a0f616364ca735914648c83c"
+  integrity sha512-Aa9RmOoOgzCn6b/RYyrKRkBtIWGum6v9sA73rJFtl9N0O3kjWrAdj9lk09n9QoOaxvyEHc3GQZwLcUrBEIH2Cw==
+  dependencies:
+    "@babel/runtime" "^7.5.5"
+    "@emotion/core" "^10.0.14"
+    lodash "^4.17.15"
+
 react-is@16.8.6:
   version "16.8.6"
   resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.8.6.tgz#5bbc1e2d29141c9fbdfed456343fe2bc430a6a16"
@@ -7009,6 +7171,11 @@ resolve-from@^3.0.0:
   resolved "https://registry.yarnpkg.com/resolve-from/-/resolve-from-3.0.0.tgz#b22c7af7d9d6881bc8b6e653335eebcb0a188748"
   integrity sha1-six699nWiBvItuZTM17rywoYh0g=
 
+resolve-from@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/resolve-from/-/resolve-from-4.0.0.tgz#4abcd852ad32dd7baabfe9b40e00a36db5f392e6"
+  integrity sha512-pb/MYmXstAkysRFx8piNI1tGFNQIFA3vkE3Gq4EuA1dF6gHp/+vgZqsCGJapvy8N3Q+4o7FwvquPJcnZ7RYy4g==
+
 resolve-pathname@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/resolve-pathname/-/resolve-pathname-3.0.0.tgz#99d02224d3cf263689becbb393bc560313025dcd"
@@ -7035,7 +7202,7 @@ resolve-url@^0.2.1:
   resolved "https://registry.yarnpkg.com/resolve-url/-/resolve-url-0.2.1.tgz#2c637fe77c893afd2a663fe21aa9080068e2052a"
   integrity sha1-LGN/53yJOv0qZj/iGqkIAGjiBSo=
 
-resolve@^1.10.0, resolve@^1.3.2, resolve@^1.8.1:
+resolve@^1.10.0, resolve@^1.12.0, resolve@^1.3.2, resolve@^1.8.1:
   version "1.20.0"
   resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.20.0.tgz#629a013fb3f70755d6f0b7935cc1c2c5378b1975"
   integrity sha512-wENBPt4ySzg4ybFQW2TT1zMQucPK95HSh/nq2CFTZVOGut2+pQvSsgtda4d26YrYcr067wjbmzOG8byDPBX63A==
@@ -7420,7 +7587,7 @@ source-map@^0.4.2:
   dependencies:
     amdefine ">=0.0.4"
 
-source-map@^0.5.0, source-map@^0.5.6:
+source-map@^0.5.0, source-map@^0.5.6, source-map@^0.5.7:
   version "0.5.7"
   resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.5.7.tgz#8a039d2d1021d22d1ea14c80d8ea468ba2ef3fcc"
   integrity sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w=
@@ -7743,6 +7910,14 @@ svgo@^1.0.0:
     unquote "~1.1.1"
     util.promisify "~1.0.0"
 
+sweetalert@^2.1.2:
+  version "2.1.2"
+  resolved "https://registry.yarnpkg.com/sweetalert/-/sweetalert-2.1.2.tgz#010baaa80d0dbdc86f96bfcaa96b490728594b79"
+  integrity sha512-iWx7X4anRBNDa/a+AdTmvAzQtkN1+s4j/JJRWlHpYE8Qimkohs8/XnFcWeYHH2lMA8LRCa5tj2d244If3S/hzA==
+  dependencies:
+    es6-object-assign "^1.1.0"
+    promise-polyfill "^6.0.2"
+
 symbol-observable@1.2.0, symbol-observable@^1.0.4, symbol-observable@^1.1.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/symbol-observable/-/symbol-observable-1.2.0.tgz#c22688aed4eab3cdc2dfeacbb561660560a00804"
@@ -8350,6 +8525,11 @@ yallist@^4.0.0:
   resolved "https://registry.yarnpkg.com/yallist/-/yallist-4.0.0.tgz#9bb92790d9c0effec63be73519e11a35019a3a72"
   integrity sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==
 
+yaml@^1.7.2:
+  version "1.10.2"
+  resolved "https://registry.yarnpkg.com/yaml/-/yaml-1.10.2.tgz#2301c5ffbf12b467de8da2333a459e29e7920e4b"
+  integrity sha512-r3vXyErRCYJ7wg28yvBY5VSoAF8ZvlcW9/BwUzEtUsjvX/DKs24dIkuwjtuprwJJHsbyUbLApepYTR1BN4uHrg==
+
 yargs-parser@^13.1.2:
   version "13.1.2"
   resolved "https://registry.yarnpkg.com/yargs-parser/-/yargs-parser-13.1.2.tgz#130f09702ebaeef2650d54ce6e3e5706f7a4fb38"