@@ -38,7 +38,7 @@ const DataCarrers = function ({ backend, s1, d3, sma, ...props }) { | |||
author="Post By Thamrin Group" | |||
/> | |||
Masa Pendaftaran : {data.start_regis} s/d {data.until_regis} | |||
<Button color="info" style={{marginLeft:"20px"}} round href={"/hino/carrer_details?s="+data.id}> | |||
<Button color="info" style={{marginLeft:"20px"}} round href={"/hino/carrer/carrer_details?s="+data.id}> | |||
<Icon className={classes.icons}>open_in_new</Icon>Detail Carrer | |||
</Button> | |||
</CardBody> | |||
@@ -57,7 +57,7 @@ const DataCarrers = function ({ backend, s1, d3, sma, ...props }) { | |||
author="Post By Thamrin Group" | |||
/> | |||
Masa Pendaftaran : {data.start_regis} s/d {data.until_regis} | |||
<Button color="info" style={{marginLeft:"20px"}} round href={"/honda/carrer_details?s="+data.id}> | |||
<Button color="info" style={{marginLeft:"20px"}} round href={"/hino/carrer/carrer_details?s="+data.id}> | |||
<Icon className={classes.icons}>open_in_new</Icon>Detail Carrer | |||
</Button> | |||
</CardBody> | |||
@@ -76,7 +76,7 @@ const DataCarrers = function ({ backend, s1, d3, sma, ...props }) { | |||
author="Post By Thamrin Group" | |||
/> | |||
Masa Pendaftaran : {data.start_regis} s/d {data.until_regis} | |||
<Button color="info" style={{marginLeft:"20px"}} round href={"/honda/carrer_details?s="+data.id}> | |||
<Button color="info" style={{marginLeft:"20px"}} round href={"/hino/carrer/carrer_details?s="+data.id}> | |||
<Icon className={classes.icons}>open_in_new</Icon>Detail Carrer | |||
</Button> | |||
</CardBody> | |||
@@ -11,6 +11,13 @@ import SnackbarContent from "components/Snackbar/SnackbarContent.js"; | |||
import imagesStyles from "assets/jss/nextjs-material-kit/imagesStyles.js"; | |||
import { cardTitle } from "assets/jss/nextjs-material-kit.js"; | |||
import Motor from "assets/img/feature/1.jpg"; | |||
import YGP from "assets/img/feature/2.jpg"; | |||
import Yamalube from "assets/img/feature/3.jpg"; | |||
import Apparel from "assets/img/feature/4.jpg"; | |||
import Helmet from "assets/img/feature/5.jpg"; | |||
import Accessories from "assets/img/feature/6.jpg"; | |||
const styles = { | |||
...imagesStyles, | |||
cardTitle, | |||
@@ -27,88 +34,56 @@ const DataFeature = function ({ backend, service, ...props }) { | |||
<h4>Feature Product</h4> | |||
} | |||
align="center" | |||
color="danger" | |||
color="info" | |||
/> | |||
</div> | |||
<GridContainer justify="center" style={{padding:"50px", marginTop:"-70px"}}> | |||
<Grid> | |||
<Card style={{height: "250px", width: "400px", padding:"20px"}}> | |||
<img className={classes.imgCard} src="https://a.ipricegroup.com/media/0630/2006_sprint12/harga_yamaha_motor.jpg" alt="Card-img" style={{height: "200px", width: "350px", display: "block"}}/> | |||
{/* <div className={classes.imgCardOverlay}> | |||
<div align="center" style={{marginTop:"120px"}}> | |||
<Button color="white" href="https://www.instagram.com/yamahaindonesia/" target="_blank"> | |||
<Icon className={classes.icons}>open_in_new</Icon>For More Info | |||
</Button> | |||
</div> | |||
</div> */} | |||
<GridContainer justify="center" style={{padding:"50px", marginTop:"-30px"}}> | |||
<Grid align="center" style={{padding:"25px", marginTop:"-30px"}}> | |||
<Card style={{width: "19rem"}}> | |||
<div align="center"> | |||
<img | |||
style={{height: "180px", width: "300px", display: "block"}} className={classes.imgCardTop} src={Motor}/> | |||
</div> | |||
</Card> | |||
</Grid> | |||
<Grid> | |||
<Card style={{height: "250px", width: "400px", padding:"20px"}}> | |||
<img className={classes.imgCard} src="https://www.akhtarnews.com/wp-content/uploads/2019/03/harga-sparepart-yamaha.jpg" alt="Card-img" style={{height: "200px", width: "350px", display: "block"}}/> | |||
{/* <div className={classes.imgCardOverlay}> | |||
<div align="center" style={{marginTop:"120px"}}> | |||
<Button color="white" href="https://twitter.com/YamahaIndonesia/status/1369143579684171778" target="_blank"> | |||
<Icon className={classes.icons}>open_in_new</Icon>For More Info | |||
</Button> | |||
</div> | |||
</div> */} | |||
<Grid align="center" style={{padding:"25px", marginTop:"-30px"}}> | |||
<Card style={{width: "19rem"}}> | |||
<div align="center"> | |||
<img | |||
style={{height: "180px", width: "300px", display: "block"}} className={classes.imgCardTop} src={YGP}/> | |||
</div> | |||
</Card> | |||
</Grid> | |||
<Grid> | |||
<Card style={{height: "250px", width: "400px", padding:"20px"}}> | |||
<div align="center"> | |||
<img className={classes.imgCard} src="https://2.bp.blogspot.com/-pzpJ-ltEFsA/V6Kh26cBoNI/AAAAAAAAAKY/ZLnJ9v_lDIcKUUNcoVKM8Qw0Izawq08_wCLcB/s1600/yamalube%2B2.jpg" alt="Card-img" style={{height: "200px", width: "300px", display: "block"}}/> | |||
</div> | |||
{/* <div className={classes.imgCardOverlay}> | |||
<div align="center" style={{marginTop:"120px"}}> | |||
<Button color="white" href="https://twitter.com/YamahaIndonesia/status/1369143579684171778" target="_blank"> | |||
<Icon className={classes.icons}>open_in_new</Icon>For More Info | |||
</Button> | |||
</div> | |||
</div> */} | |||
<Grid align="center" style={{padding:"25px", marginTop:"-30px"}}> | |||
<Card style={{width: "19rem"}}> | |||
<div align="center"> | |||
<img | |||
style={{height: "180px", width: "300px", display: "block"}} className={classes.imgCardTop} src={Yamalube}/> | |||
</div> | |||
</Card> | |||
</Grid> | |||
<Grid> | |||
<Card style={{height: "250px", width: "400px", padding:"20px"}}> | |||
<div align="center"> | |||
<img className={classes.imgCard} src="https://aomc.mx/mm5/graphics/00000001/X0779100X.jpg" alt="Card-img" style={{height: "200px", width: "200px", display: "block"}}/> | |||
</div> | |||
{/* <div className={classes.imgCardOverlay}> | |||
<div align="center" style={{marginTop:"120px"}}> | |||
<Button color="white" href="https://twitter.com/YamahaIndonesia/status/1369143579684171778" target="_blank"> | |||
<Icon className={classes.icons}>open_in_new</Icon>For More Info | |||
</Button> | |||
</div> | |||
</div> */} | |||
<Grid align="center" style={{padding:"25px", marginTop:"-30px"}}> | |||
<Card style={{width: "19rem"}}> | |||
<div align="center"> | |||
<img | |||
style={{height: "180px", width: "200px", display: "block"}} className={classes.imgCardTop} src={Apparel}/> | |||
</div> | |||
</Card> | |||
</Grid> | |||
<Grid> | |||
<Card style={{height: "250px", width: "400px", padding:"20px"}}> | |||
<div align="center"> | |||
<img className={classes.imgCard} src="https://content.motosport.com/images/items/900/TLD/TLDY0AF/X001.jpg" alt="Card-img" style={{height: "200px", width: "200px", display: "block"}}/> | |||
</div> | |||
{/* <div className={classes.imgCardOverlay}> | |||
<div align="center" style={{marginTop:"120px"}}> | |||
<Button color="white" href="https://twitter.com/YamahaIndonesia/status/1369143579684171778" target="_blank"> | |||
<Icon className={classes.icons}>open_in_new</Icon>For More Info | |||
</Button> | |||
</div> | |||
</div> */} | |||
<Grid align="center" style={{padding:"25px", marginTop:"-30px"}}> | |||
<Card style={{width: "19rem"}}> | |||
<div align="center"> | |||
<img | |||
style={{height: "180px", width: "200px", display: "block"}} className={classes.imgCardTop} src={Helmet}/> | |||
</div> | |||
</Card> | |||
</Grid> | |||
<Grid> | |||
<Card style={{height: "250px", width: "400px", padding:"20px"}}> | |||
<div align="center"> | |||
<img className={classes.imgCard} src="https://static.wixstatic.com/media/bb08a6_fe756d074abc4e4c86ed0fe0134e50a5~mv2.jpg/v1/fill/w_960,h_429,al_c,q_85/bb08a6_fe756d074abc4e4c86ed0fe0134e50a5~mv2.webp" alt="Card-img" style={{height: "200px", width: "350px", display: "block"}}/> | |||
</div> | |||
{/* <div className={classes.imgCardOverlay}> | |||
<div align="center" style={{marginTop:"120px"}}> | |||
<Button color="white" href="https://twitter.com/YamahaIndonesia/status/1369143579684171778" target="_blank"> | |||
<Icon className={classes.icons}>open_in_new</Icon>For More Info | |||
</Button> | |||
</div> | |||
</div> */} | |||
<Grid align="center" style={{padding:"25px", marginTop:"-30px"}}> | |||
<Card style={{width: "19rem"}}> | |||
<div align="center"> | |||
<img | |||
style={{height: "180px", width: "300px", display: "block"}} className={classes.imgCardTop} src={Accessories}/> | |||
</div> | |||
</Card> | |||
</Grid> | |||
</GridContainer> | |||
@@ -12,7 +12,7 @@ const useStyles = makeStyles(styles); | |||
const DataService = function ({ backend, service, ...props }) { | |||
const classes = useStyles(); | |||
const services = service.map((data, index) => ( | |||
<Grid align="center" style={{padding:"40px", marginTop:"-50px"}}> | |||
<Grid align="center" style={{padding:"25px", marginTop:"-30px"}}> | |||
<Card style={{width: "20rem"}}> | |||
<div align="center"> | |||
<img | |||
@@ -20,8 +20,8 @@ const DataService = function ({ backend, service, ...props }) { | |||
</div> | |||
</Card> | |||
</Grid> | |||
)); | |||
return ( | |||
)); | |||
return ( | |||
<div className={classes.section} id="notifications"> | |||
<div align="center"> | |||
<div align="center" className={classes.section} id="notifications"> | |||
@@ -30,7 +30,7 @@ const DataService = function ({ backend, service, ...props }) { | |||
<h4>Our Service</h4> | |||
} | |||
align="center" | |||
color="danger" | |||
color="info" | |||
/> | |||
</div> | |||
</div> | |||
@@ -39,7 +39,7 @@ const DataProduct = function ({ backend, car, ...props }) { | |||
<h5>Rp.{data.price}</h5> | |||
<Button | |||
color="info" round | |||
href={"/hino/product/product_detail?s="+data.id} | |||
href={"/hino/product/product_details?s="+data.id} | |||
> | |||
<Icon className={classes.icons}>open_in_new</Icon>Detail Product | |||
</Button> | |||
@@ -72,8 +72,8 @@ const DataProduct = function ({ backend, car, ...props }) { | |||
color="primary" | |||
tabs={[ | |||
{ | |||
tabButton: "XL7", | |||
tabIcon: Motorcycle, | |||
tabButton: "Profia", | |||
tabIcon: Dashboard, | |||
tabContent: ( | |||
<GridContainer justify="center"> | |||
{ProductSuzuki} | |||
@@ -0,0 +1,145 @@ | |||
import React, { useState, useEffect } from "react"; | |||
import classNames from "classnames"; | |||
import { makeStyles } from "@material-ui/core/styles"; | |||
import ReactHtmlParser from "react-html-parser"; | |||
import Dashboard from "@material-ui/icons/Dashboard"; | |||
import Icon from "@material-ui/core/Icon"; | |||
import GridContainer from "components/Grid/GridContainer.js"; | |||
import Grid from '@material-ui/core/Grid'; | |||
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 Carousel from "react-slick"; | |||
const useStyles = makeStyles(styles); | |||
const DataProduct = function ({ backend, detailproduct, ...props }) { | |||
const classes = useStyles(); | |||
const { ...rest } = props; | |||
const imageClasses = classNames( | |||
classes.imgRaised, | |||
classes.imgRoundedCircle, | |||
classes.imgFluid | |||
); | |||
const settings = { | |||
dots: true, | |||
infinite: true, | |||
speed: 500, | |||
slidesToShow: 1, | |||
slidesToScroll: 1, | |||
autoplay: true, | |||
time: 5 | |||
}; | |||
const navImageClasses = classNames(classes.imgRounded, classes.imgGallery); | |||
const Productdetails = detailproduct.map((data) => { | |||
return ( | |||
<div> | |||
<GridContainer> | |||
<Grid fluid xs={5}> | |||
<div className={classes.section} id="notifications"> | |||
<div className={classes.section}> | |||
<div className={classes.container}> | |||
<GridContainer> | |||
<GridItem className={classes.marginAuto}> | |||
<Card carousel> | |||
<Carousel {...settings}> | |||
<img className={navImageClasses} width="300px" alt="First slide" src={`${backend}${data.img[0]["url"]}`} /> | |||
</Carousel> | |||
</Card> | |||
{/* <Button color="info" round href={"/product_detail?s="+data.id}> | |||
<Icon className={classes.icons}>shopping_cart</Icon>Add To Cart | |||
</Button> */} | |||
</GridItem> | |||
</GridContainer> | |||
</div> | |||
</div> | |||
</div> | |||
</Grid> | |||
<Grid xs={7} style={{padding:"40px", marginTop:"-30px"}}> | |||
<h3>{data.name}</h3> | |||
<h3>Rp.{data.price} - Stock Unit : {data.stock}</h3> | |||
<hr></hr> | |||
<div align="justify"> | |||
<p>{ReactHtmlParser(data.description)}</p> | |||
</div> | |||
</Grid> | |||
</GridContainer> | |||
<GridContainer justify="center"> | |||
<GridItem> | |||
<NavPills | |||
color="primary" | |||
align="center" | |||
alignCenter | |||
tabs={[ | |||
{ | |||
tabButton: "Overview", | |||
tabIcon: Dashboard, | |||
tabContent: ( | |||
<div> | |||
<GridContainer justify="center" style={{padding:"40px", marginTop:"-30px"}}> | |||
<GridItem className={classes.marginAuto}> | |||
<div align="justify"> | |||
{ReactHtmlParser(data.overview)} | |||
</div> | |||
</GridItem> | |||
</GridContainer> | |||
</div> | |||
), | |||
}, | |||
{ | |||
tabButton: "Specification", | |||
tabIcon: Dashboard, | |||
tabContent: ( | |||
<GridContainer justify="center" style={{padding:"40px", marginTop:"-30px"}}> | |||
<GridItem className={classes.marginAuto}> | |||
<div align="justify"> | |||
{ReactHtmlParser(data.specification)} | |||
</div> | |||
</GridItem> | |||
</GridContainer> | |||
), | |||
}, | |||
{ | |||
tabButton: "Film", | |||
tabIcon: Dashboard, | |||
tabContent: ( | |||
<GridContainer justify="center" style={{padding:"40px", marginTop:"-30px"}}> | |||
<GridItem className={classes.marginAuto}> | |||
<div align="justify"> | |||
{ReactHtmlParser(data.film)} | |||
</div> | |||
</GridItem> | |||
</GridContainer> | |||
), | |||
}, | |||
]} | |||
/> | |||
</GridItem> | |||
</GridContainer> | |||
</div> | |||
); | |||
}) | |||
return ( | |||
<Card className={classes.textCenter}> | |||
<div align="center"> | |||
<CardHeader color="info">Product Detail</CardHeader> | |||
</div> | |||
<CardBody> | |||
<div> | |||
{Productdetails} | |||
</div> | |||
</CardBody> | |||
<CardFooter className={classes.textMuted} textAlign="center"> | |||
© 2020 , All Right Reserved by @Thamrin Brother Company | |||
</CardFooter> | |||
</Card> | |||
); | |||
} | |||
export default DataProduct; |
@@ -31,14 +31,14 @@ const DataCarrers = function ({ backend, s1, d3, sma, ...props }) { | |||
return ( | |||
<Grid style={{width:"600px", padding:"30px"}}> | |||
<Card> | |||
<CardHeader color="danger"><div align="center">{data.name}</div></CardHeader> | |||
<CardHeader color="info"><div align="center">{data.name}</div></CardHeader> | |||
<CardBody> | |||
<Quote | |||
text={data.name_description} | |||
author="Post By Thamrin Group" | |||
/> | |||
Masa Pendaftaran : {data.start_regis} s/d {data.until_regis} | |||
<Button color="danger" style={{marginLeft:"20px"}} round href={"/honda/carrer_details?s="+data.id}> | |||
<Button color="info" style={{marginLeft:"20px"}} round href={"/honda/carrer/carrer_details?s="+data.id}> | |||
<Icon className={classes.icons}>open_in_new</Icon>Detail Carrer | |||
</Button> | |||
</CardBody> | |||
@@ -50,14 +50,14 @@ const DataCarrers = function ({ backend, s1, d3, sma, ...props }) { | |||
return ( | |||
<Grid style={{width:"600px", padding:"30px"}}> | |||
<Card> | |||
<CardHeader color="danger">{data.name}</CardHeader> | |||
<CardHeader color="info">{data.name}</CardHeader> | |||
<CardBody> | |||
<Quote | |||
text={data.name_description} | |||
author="Post By Thamrin Group" | |||
/> | |||
Masa Pendaftaran : {data.start_regis} s/d {data.until_regis} | |||
<Button color="danger" style={{marginLeft:"20px"}} round href={"/honda/carrer_details?s="+data.id}> | |||
<Button color="info" style={{marginLeft:"20px"}} round href={"/honda/carrer/carrer_details?s="+data.id}> | |||
<Icon className={classes.icons}>open_in_new</Icon>Detail Carrer | |||
</Button> | |||
</CardBody> | |||
@@ -69,14 +69,14 @@ const DataCarrers = function ({ backend, s1, d3, sma, ...props }) { | |||
return ( | |||
<Grid style={{width:"600px", padding:"30px"}}> | |||
<Card> | |||
<CardHeader justify="center" color="danger">{data.name}</CardHeader> | |||
<CardHeader justify="center" color="info">{data.name}</CardHeader> | |||
<CardBody> | |||
<Quote | |||
text={data.name_description} | |||
author="Post By Thamrin Group" | |||
/> | |||
Masa Pendaftaran : {data.start_regis} s/d {data.until_regis} | |||
<Button color="danger" style={{marginLeft:"20px"}} round href={"/honda/carrer_details?s="+data.id}> | |||
<Button color="info" style={{marginLeft:"20px"}} round href={"/honda/carrer/carrer_details?s="+data.id}> | |||
<Icon className={classes.icons}>open_in_new</Icon>Detail Carrer | |||
</Button> | |||
</CardBody> | |||
@@ -11,6 +11,13 @@ import SnackbarContent from "components/Snackbar/SnackbarContent.js"; | |||
import imagesStyles from "assets/jss/nextjs-material-kit/imagesStyles.js"; | |||
import { cardTitle } from "assets/jss/nextjs-material-kit.js"; | |||
import Motor from "assets/img/feature/1.jpg"; | |||
import YGP from "assets/img/feature/2.jpg"; | |||
import Yamalube from "assets/img/feature/3.jpg"; | |||
import Apparel from "assets/img/feature/4.jpg"; | |||
import Helmet from "assets/img/feature/5.jpg"; | |||
import Accessories from "assets/img/feature/6.jpg"; | |||
const styles = { | |||
...imagesStyles, | |||
cardTitle, | |||
@@ -30,85 +37,53 @@ const DataFeature = function ({ backend, service, ...props }) { | |||
color="info" | |||
/> | |||
</div> | |||
<GridContainer justify="center" style={{padding:"50px", marginTop:"-70px"}}> | |||
<Grid> | |||
<Card style={{height: "250px", width: "400px", padding:"20px"}}> | |||
<img className={classes.imgCard} src="https://a.ipricegroup.com/media/0630/2006_sprint12/harga_yamaha_motor.jpg" alt="Card-img" style={{height: "200px", width: "350px", display: "block"}}/> | |||
{/* <div className={classes.imgCardOverlay}> | |||
<div align="center" style={{marginTop:"120px"}}> | |||
<Button color="white" href="https://www.instagram.com/yamahaindonesia/" target="_blank"> | |||
<Icon className={classes.icons}>open_in_new</Icon>For More Info | |||
</Button> | |||
</div> | |||
</div> */} | |||
<GridContainer justify="center" style={{padding:"50px", marginTop:"-30px"}}> | |||
<Grid align="center" style={{padding:"25px", marginTop:"-30px"}}> | |||
<Card style={{width: "19rem"}}> | |||
<div align="center"> | |||
<img | |||
style={{height: "180px", width: "300px", display: "block"}} className={classes.imgCardTop} src={Motor}/> | |||
</div> | |||
</Card> | |||
</Grid> | |||
<Grid> | |||
<Card style={{height: "250px", width: "400px", padding:"20px"}}> | |||
<img className={classes.imgCard} src="https://www.akhtarnews.com/wp-content/uploads/2019/03/harga-sparepart-yamaha.jpg" alt="Card-img" style={{height: "200px", width: "350px", display: "block"}}/> | |||
{/* <div className={classes.imgCardOverlay}> | |||
<div align="center" style={{marginTop:"120px"}}> | |||
<Button color="white" href="https://twitter.com/YamahaIndonesia/status/1369143579684171778" target="_blank"> | |||
<Icon className={classes.icons}>open_in_new</Icon>For More Info | |||
</Button> | |||
</div> | |||
</div> */} | |||
<Grid align="center" style={{padding:"25px", marginTop:"-30px"}}> | |||
<Card style={{width: "19rem"}}> | |||
<div align="center"> | |||
<img | |||
style={{height: "180px", width: "300px", display: "block"}} className={classes.imgCardTop} src={YGP}/> | |||
</div> | |||
</Card> | |||
</Grid> | |||
<Grid> | |||
<Card style={{height: "250px", width: "400px", padding:"20px"}}> | |||
<div align="center"> | |||
<img className={classes.imgCard} src="https://2.bp.blogspot.com/-pzpJ-ltEFsA/V6Kh26cBoNI/AAAAAAAAAKY/ZLnJ9v_lDIcKUUNcoVKM8Qw0Izawq08_wCLcB/s1600/yamalube%2B2.jpg" alt="Card-img" style={{height: "200px", width: "300px", display: "block"}}/> | |||
</div> | |||
{/* <div className={classes.imgCardOverlay}> | |||
<div align="center" style={{marginTop:"120px"}}> | |||
<Button color="white" href="https://twitter.com/YamahaIndonesia/status/1369143579684171778" target="_blank"> | |||
<Icon className={classes.icons}>open_in_new</Icon>For More Info | |||
</Button> | |||
</div> | |||
</div> */} | |||
<Grid align="center" style={{padding:"25px", marginTop:"-30px"}}> | |||
<Card style={{width: "19rem"}}> | |||
<div align="center"> | |||
<img | |||
style={{height: "180px", width: "300px", display: "block"}} className={classes.imgCardTop} src={Yamalube}/> | |||
</div> | |||
</Card> | |||
</Grid> | |||
<Grid> | |||
<Card style={{height: "250px", width: "400px", padding:"20px"}}> | |||
<div align="center"> | |||
<img className={classes.imgCard} src="https://aomc.mx/mm5/graphics/00000001/X0779100X.jpg" alt="Card-img" style={{height: "200px", width: "200px", display: "block"}}/> | |||
</div> | |||
{/* <div className={classes.imgCardOverlay}> | |||
<div align="center" style={{marginTop:"120px"}}> | |||
<Button color="white" href="https://twitter.com/YamahaIndonesia/status/1369143579684171778" target="_blank"> | |||
<Icon className={classes.icons}>open_in_new</Icon>For More Info | |||
</Button> | |||
</div> | |||
</div> */} | |||
<Grid align="center" style={{padding:"25px", marginTop:"-30px"}}> | |||
<Card style={{width: "19rem"}}> | |||
<div align="center"> | |||
<img | |||
style={{height: "180px", width: "200px", display: "block"}} className={classes.imgCardTop} src={Apparel}/> | |||
</div> | |||
</Card> | |||
</Grid> | |||
<Grid> | |||
<Card style={{height: "250px", width: "400px", padding:"20px"}}> | |||
<div align="center"> | |||
<img className={classes.imgCard} src="https://content.motosport.com/images/items/900/TLD/TLDY0AF/X001.jpg" alt="Card-img" style={{height: "200px", width: "200px", display: "block"}}/> | |||
</div> | |||
{/* <div className={classes.imgCardOverlay}> | |||
<div align="center" style={{marginTop:"120px"}}> | |||
<Button color="white" href="https://twitter.com/YamahaIndonesia/status/1369143579684171778" target="_blank"> | |||
<Icon className={classes.icons}>open_in_new</Icon>For More Info | |||
</Button> | |||
</div> | |||
</div> */} | |||
<Grid align="center" style={{padding:"25px", marginTop:"-30px"}}> | |||
<Card style={{width: "19rem"}}> | |||
<div align="center"> | |||
<img | |||
style={{height: "180px", width: "200px", display: "block"}} className={classes.imgCardTop} src={Helmet}/> | |||
</div> | |||
</Card> | |||
</Grid> | |||
<Grid> | |||
<Card style={{height: "250px", width: "400px", padding:"20px"}}> | |||
<div align="center"> | |||
<img className={classes.imgCard} src="https://static.wixstatic.com/media/bb08a6_fe756d074abc4e4c86ed0fe0134e50a5~mv2.jpg/v1/fill/w_960,h_429,al_c,q_85/bb08a6_fe756d074abc4e4c86ed0fe0134e50a5~mv2.webp" alt="Card-img" style={{height: "200px", width: "350px", display: "block"}}/> | |||
</div> | |||
{/* <div className={classes.imgCardOverlay}> | |||
<div align="center" style={{marginTop:"120px"}}> | |||
<Button color="white" href="https://twitter.com/YamahaIndonesia/status/1369143579684171778" target="_blank"> | |||
<Icon className={classes.icons}>open_in_new</Icon>For More Info | |||
</Button> | |||
</div> | |||
</div> */} | |||
<Grid align="center" style={{padding:"25px", marginTop:"-30px"}}> | |||
<Card style={{width: "19rem"}}> | |||
<div align="center"> | |||
<img | |||
style={{height: "180px", width: "300px", display: "block"}} className={classes.imgCardTop} src={Accessories}/> | |||
</div> | |||
</Card> | |||
</Grid> | |||
</GridContainer> | |||
@@ -12,7 +12,7 @@ const useStyles = makeStyles(styles); | |||
const DataService = function ({ backend, service, ...props }) { | |||
const classes = useStyles(); | |||
const services = service.map((data, index) => ( | |||
<Grid align="center" style={{padding:"40px", marginTop:"-50px"}}> | |||
<Grid align="center" style={{padding:"25px", marginTop:"-30px"}}> | |||
<Card style={{width: "20rem"}}> | |||
<div align="center"> | |||
<img | |||
@@ -14,7 +14,6 @@ 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"; | |||
import { Motorcycle } from "@material-ui/icons"; | |||
const useStyles = makeStyles(styles); | |||
const DataProduct = function ({ backend, car, ...props }) { | |||
@@ -39,7 +38,7 @@ const DataProduct = function ({ backend, car, ...props }) { | |||
<h5>Rp.{data.price}</h5> | |||
<Button | |||
color="info" round | |||
href={"/honda/product/product_detail?s="+data.id} | |||
href={"/honda/product/product_details?s="+data.id} | |||
> | |||
<Icon className={classes.icons}>open_in_new</Icon>Detail Product | |||
</Button> | |||
@@ -72,8 +71,8 @@ const DataProduct = function ({ backend, car, ...props }) { | |||
color="primary" | |||
tabs={[ | |||
{ | |||
tabButton: "XL7", | |||
tabIcon: Motorcycle, | |||
tabButton: "Brio", | |||
tabIcon: Dashboard, | |||
tabContent: ( | |||
<GridContainer justify="center"> | |||
{ProductSuzuki} | |||
@@ -0,0 +1,145 @@ | |||
import React, { useState, useEffect } from "react"; | |||
import classNames from "classnames"; | |||
import { makeStyles } from "@material-ui/core/styles"; | |||
import ReactHtmlParser from "react-html-parser"; | |||
import Dashboard from "@material-ui/icons/Dashboard"; | |||
import Icon from "@material-ui/core/Icon"; | |||
import GridContainer from "components/Grid/GridContainer.js"; | |||
import Grid from '@material-ui/core/Grid'; | |||
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 Carousel from "react-slick"; | |||
const useStyles = makeStyles(styles); | |||
const DataProduct = function ({ backend, detailproduct, ...props }) { | |||
const classes = useStyles(); | |||
const { ...rest } = props; | |||
const imageClasses = classNames( | |||
classes.imgRaised, | |||
classes.imgRoundedCircle, | |||
classes.imgFluid | |||
); | |||
const settings = { | |||
dots: true, | |||
infinite: true, | |||
speed: 500, | |||
slidesToShow: 1, | |||
slidesToScroll: 1, | |||
autoplay: true, | |||
time: 5 | |||
}; | |||
const navImageClasses = classNames(classes.imgRounded, classes.imgGallery); | |||
const Productdetails = detailproduct.map((data) => { | |||
return ( | |||
<div> | |||
<GridContainer> | |||
<Grid fluid xs={5}> | |||
<div className={classes.section} id="notifications"> | |||
<div className={classes.section}> | |||
<div className={classes.container}> | |||
<GridContainer> | |||
<GridItem className={classes.marginAuto}> | |||
<Card carousel> | |||
<Carousel {...settings}> | |||
<img className={navImageClasses} width="300px" alt="First slide" src={`${backend}${data.img[0]["url"]}`} /> | |||
</Carousel> | |||
</Card> | |||
{/* <Button color="info" round href={"/product_detail?s="+data.id}> | |||
<Icon className={classes.icons}>shopping_cart</Icon>Add To Cart | |||
</Button> */} | |||
</GridItem> | |||
</GridContainer> | |||
</div> | |||
</div> | |||
</div> | |||
</Grid> | |||
<Grid xs={7} style={{padding:"40px", marginTop:"-30px"}}> | |||
<h3>{data.name}</h3> | |||
<h3>Rp.{data.price} - Stock Unit : {data.stock}</h3> | |||
<hr></hr> | |||
<div align="justify"> | |||
<p>{ReactHtmlParser(data.description)}</p> | |||
</div> | |||
</Grid> | |||
</GridContainer> | |||
<GridContainer justify="center"> | |||
<GridItem> | |||
<NavPills | |||
color="primary" | |||
align="center" | |||
alignCenter | |||
tabs={[ | |||
{ | |||
tabButton: "Overview", | |||
tabIcon: Dashboard, | |||
tabContent: ( | |||
<div> | |||
<GridContainer justify="center" style={{padding:"40px", marginTop:"-30px"}}> | |||
<GridItem className={classes.marginAuto}> | |||
<div align="justify"> | |||
{ReactHtmlParser(data.overview)} | |||
</div> | |||
</GridItem> | |||
</GridContainer> | |||
</div> | |||
), | |||
}, | |||
{ | |||
tabButton: "Specification", | |||
tabIcon: Dashboard, | |||
tabContent: ( | |||
<GridContainer justify="center" style={{padding:"40px", marginTop:"-30px"}}> | |||
<GridItem className={classes.marginAuto}> | |||
<div align="justify"> | |||
{ReactHtmlParser(data.specification)} | |||
</div> | |||
</GridItem> | |||
</GridContainer> | |||
), | |||
}, | |||
{ | |||
tabButton: "Film", | |||
tabIcon: Dashboard, | |||
tabContent: ( | |||
<GridContainer justify="center" style={{padding:"40px", marginTop:"-30px"}}> | |||
<GridItem className={classes.marginAuto}> | |||
<div align="justify"> | |||
{ReactHtmlParser(data.film)} | |||
</div> | |||
</GridItem> | |||
</GridContainer> | |||
), | |||
}, | |||
]} | |||
/> | |||
</GridItem> | |||
</GridContainer> | |||
</div> | |||
); | |||
}) | |||
return ( | |||
<Card className={classes.textCenter}> | |||
<div align="center"> | |||
<CardHeader color="info">Product Detail</CardHeader> | |||
</div> | |||
<CardBody> | |||
<div> | |||
{Productdetails} | |||
</div> | |||
</CardBody> | |||
<CardFooter className={classes.textMuted} textAlign="center"> | |||
© 2020 , All Right Reserved by @Thamrin Brother Company | |||
</CardFooter> | |||
</Card> | |||
); | |||
} | |||
export default DataProduct; |
@@ -11,6 +11,13 @@ import SnackbarContent from "components/Snackbar/SnackbarContent.js"; | |||
import imagesStyles from "assets/jss/nextjs-material-kit/imagesStyles.js"; | |||
import { cardTitle } from "assets/jss/nextjs-material-kit.js"; | |||
import Motor from "assets/img/feature/1.jpg"; | |||
import YGP from "assets/img/feature/2.jpg"; | |||
import Yamalube from "assets/img/feature/3.jpg"; | |||
import Apparel from "assets/img/feature/4.jpg"; | |||
import Helmet from "assets/img/feature/5.jpg"; | |||
import Accessories from "assets/img/feature/6.jpg"; | |||
const styles = { | |||
...imagesStyles, | |||
cardTitle, | |||
@@ -30,85 +37,53 @@ const DataFeature = function ({ backend, service, ...props }) { | |||
color="info" | |||
/> | |||
</div> | |||
<GridContainer justify="center" style={{padding:"50px", marginTop:"-70px"}}> | |||
<Grid> | |||
<Card style={{height: "250px", width: "400px", padding:"20px"}}> | |||
<img className={classes.imgCard} src="https://a.ipricegroup.com/media/0630/2006_sprint12/harga_yamaha_motor.jpg" alt="Card-img" style={{height: "200px", width: "350px", display: "block"}}/> | |||
{/* <div className={classes.imgCardOverlay}> | |||
<div align="center" style={{marginTop:"120px"}}> | |||
<Button color="white" href="https://www.instagram.com/yamahaindonesia/" target="_blank"> | |||
<Icon className={classes.icons}>open_in_new</Icon>For More Info | |||
</Button> | |||
</div> | |||
</div> */} | |||
<GridContainer justify="center" style={{padding:"50px", marginTop:"-30px"}}> | |||
<Grid align="center" style={{padding:"25px", marginTop:"-30px"}}> | |||
<Card style={{width: "19rem"}}> | |||
<div align="center"> | |||
<img | |||
style={{height: "180px", width: "300px", display: "block"}} className={classes.imgCardTop} src={Motor}/> | |||
</div> | |||
</Card> | |||
</Grid> | |||
<Grid> | |||
<Card style={{height: "250px", width: "400px", padding:"20px"}}> | |||
<img className={classes.imgCard} src="https://www.akhtarnews.com/wp-content/uploads/2019/03/harga-sparepart-yamaha.jpg" alt="Card-img" style={{height: "200px", width: "350px", display: "block"}}/> | |||
{/* <div className={classes.imgCardOverlay}> | |||
<div align="center" style={{marginTop:"120px"}}> | |||
<Button color="white" href="https://twitter.com/YamahaIndonesia/status/1369143579684171778" target="_blank"> | |||
<Icon className={classes.icons}>open_in_new</Icon>For More Info | |||
</Button> | |||
</div> | |||
</div> */} | |||
<Grid align="center" style={{padding:"25px", marginTop:"-30px"}}> | |||
<Card style={{width: "19rem"}}> | |||
<div align="center"> | |||
<img | |||
style={{height: "180px", width: "300px", display: "block"}} className={classes.imgCardTop} src={YGP}/> | |||
</div> | |||
</Card> | |||
</Grid> | |||
<Grid> | |||
<Card style={{height: "250px", width: "400px", padding:"20px"}}> | |||
<div align="center"> | |||
<img className={classes.imgCard} src="https://2.bp.blogspot.com/-pzpJ-ltEFsA/V6Kh26cBoNI/AAAAAAAAAKY/ZLnJ9v_lDIcKUUNcoVKM8Qw0Izawq08_wCLcB/s1600/yamalube%2B2.jpg" alt="Card-img" style={{height: "200px", width: "300px", display: "block"}}/> | |||
</div> | |||
{/* <div className={classes.imgCardOverlay}> | |||
<div align="center" style={{marginTop:"120px"}}> | |||
<Button color="white" href="https://twitter.com/YamahaIndonesia/status/1369143579684171778" target="_blank"> | |||
<Icon className={classes.icons}>open_in_new</Icon>For More Info | |||
</Button> | |||
</div> | |||
</div> */} | |||
<Grid align="center" style={{padding:"25px", marginTop:"-30px"}}> | |||
<Card style={{width: "19rem"}}> | |||
<div align="center"> | |||
<img | |||
style={{height: "180px", width: "300px", display: "block"}} className={classes.imgCardTop} src={Yamalube}/> | |||
</div> | |||
</Card> | |||
</Grid> | |||
<Grid> | |||
<Card style={{height: "250px", width: "400px", padding:"20px"}}> | |||
<div align="center"> | |||
<img className={classes.imgCard} src="https://aomc.mx/mm5/graphics/00000001/X0779100X.jpg" alt="Card-img" style={{height: "200px", width: "200px", display: "block"}}/> | |||
</div> | |||
{/* <div className={classes.imgCardOverlay}> | |||
<div align="center" style={{marginTop:"120px"}}> | |||
<Button color="white" href="https://twitter.com/YamahaIndonesia/status/1369143579684171778" target="_blank"> | |||
<Icon className={classes.icons}>open_in_new</Icon>For More Info | |||
</Button> | |||
</div> | |||
</div> */} | |||
<Grid align="center" style={{padding:"25px", marginTop:"-30px"}}> | |||
<Card style={{width: "19rem"}}> | |||
<div align="center"> | |||
<img | |||
style={{height: "180px", width: "200px", display: "block"}} className={classes.imgCardTop} src={Apparel}/> | |||
</div> | |||
</Card> | |||
</Grid> | |||
<Grid> | |||
<Card style={{height: "250px", width: "400px", padding:"20px"}}> | |||
<div align="center"> | |||
<img className={classes.imgCard} src="https://content.motosport.com/images/items/900/TLD/TLDY0AF/X001.jpg" alt="Card-img" style={{height: "200px", width: "200px", display: "block"}}/> | |||
</div> | |||
{/* <div className={classes.imgCardOverlay}> | |||
<div align="center" style={{marginTop:"120px"}}> | |||
<Button color="white" href="https://twitter.com/YamahaIndonesia/status/1369143579684171778" target="_blank"> | |||
<Icon className={classes.icons}>open_in_new</Icon>For More Info | |||
</Button> | |||
</div> | |||
</div> */} | |||
<Grid align="center" style={{padding:"25px", marginTop:"-30px"}}> | |||
<Card style={{width: "19rem"}}> | |||
<div align="center"> | |||
<img | |||
style={{height: "180px", width: "200px", display: "block"}} className={classes.imgCardTop} src={Helmet}/> | |||
</div> | |||
</Card> | |||
</Grid> | |||
<Grid> | |||
<Card style={{height: "250px", width: "400px", padding:"20px"}}> | |||
<div align="center"> | |||
<img className={classes.imgCard} src="https://static.wixstatic.com/media/bb08a6_fe756d074abc4e4c86ed0fe0134e50a5~mv2.jpg/v1/fill/w_960,h_429,al_c,q_85/bb08a6_fe756d074abc4e4c86ed0fe0134e50a5~mv2.webp" alt="Card-img" style={{height: "200px", width: "350px", display: "block"}}/> | |||
</div> | |||
{/* <div className={classes.imgCardOverlay}> | |||
<div align="center" style={{marginTop:"120px"}}> | |||
<Button color="white" href="https://twitter.com/YamahaIndonesia/status/1369143579684171778" target="_blank"> | |||
<Icon className={classes.icons}>open_in_new</Icon>For More Info | |||
</Button> | |||
</div> | |||
</div> */} | |||
<Grid align="center" style={{padding:"25px", marginTop:"-30px"}}> | |||
<Card style={{width: "19rem"}}> | |||
<div align="center"> | |||
<img | |||
style={{height: "180px", width: "300px", display: "block"}} className={classes.imgCardTop} src={Accessories}/> | |||
</div> | |||
</Card> | |||
</Grid> | |||
</GridContainer> | |||
@@ -12,7 +12,7 @@ const useStyles = makeStyles(styles); | |||
const DataService = function ({ backend, service, ...props }) { | |||
const classes = useStyles(); | |||
const services = service.map((data, index) => ( | |||
<Grid align="center" style={{padding:"40px", marginTop:"-50px"}}> | |||
<Grid align="center" style={{padding:"25px", marginTop:"-30px"}}> | |||
<Card style={{width: "20rem"}}> | |||
<div align="center"> | |||
<img | |||
@@ -11,6 +11,13 @@ import SnackbarContent from "components/Snackbar/SnackbarContent.js"; | |||
import imagesStyles from "assets/jss/nextjs-material-kit/imagesStyles.js"; | |||
import { cardTitle } from "assets/jss/nextjs-material-kit.js"; | |||
import Motor from "assets/img/feature/1.jpg"; | |||
import YGP from "assets/img/feature/2.jpg"; | |||
import Yamalube from "assets/img/feature/3.jpg"; | |||
import Apparel from "assets/img/feature/4.jpg"; | |||
import Helmet from "assets/img/feature/5.jpg"; | |||
import Accessories from "assets/img/feature/6.jpg"; | |||
const styles = { | |||
...imagesStyles, | |||
cardTitle, | |||
@@ -30,85 +37,53 @@ const DataFeature = function ({ backend, service, ...props }) { | |||
color="info" | |||
/> | |||
</div> | |||
<GridContainer justify="center" style={{padding:"50px", marginTop:"-70px"}}> | |||
<Grid> | |||
<Card style={{height: "250px", width: "400px", padding:"20px"}}> | |||
<img className={classes.imgCard} src="https://a.ipricegroup.com/media/0630/2006_sprint12/harga_yamaha_motor.jpg" alt="Card-img" style={{height: "200px", width: "350px", display: "block"}}/> | |||
{/* <div className={classes.imgCardOverlay}> | |||
<div align="center" style={{marginTop:"120px"}}> | |||
<Button color="white" href="https://www.instagram.com/yamahaindonesia/" target="_blank"> | |||
<Icon className={classes.icons}>open_in_new</Icon>For More Info | |||
</Button> | |||
</div> | |||
</div> */} | |||
<GridContainer justify="center" style={{padding:"50px", marginTop:"-30px"}}> | |||
<Grid align="center" style={{padding:"25px", marginTop:"-30px"}}> | |||
<Card style={{width: "19rem"}}> | |||
<div align="center"> | |||
<img | |||
style={{height: "180px", width: "300px", display: "block"}} className={classes.imgCardTop} src={Motor}/> | |||
</div> | |||
</Card> | |||
</Grid> | |||
<Grid> | |||
<Card style={{height: "250px", width: "400px", padding:"20px"}}> | |||
<img className={classes.imgCard} src="https://www.akhtarnews.com/wp-content/uploads/2019/03/harga-sparepart-yamaha.jpg" alt="Card-img" style={{height: "200px", width: "350px", display: "block"}}/> | |||
{/* <div className={classes.imgCardOverlay}> | |||
<div align="center" style={{marginTop:"120px"}}> | |||
<Button color="white" href="https://twitter.com/YamahaIndonesia/status/1369143579684171778" target="_blank"> | |||
<Icon className={classes.icons}>open_in_new</Icon>For More Info | |||
</Button> | |||
</div> | |||
</div> */} | |||
<Grid align="center" style={{padding:"25px", marginTop:"-30px"}}> | |||
<Card style={{width: "19rem"}}> | |||
<div align="center"> | |||
<img | |||
style={{height: "180px", width: "300px", display: "block"}} className={classes.imgCardTop} src={YGP}/> | |||
</div> | |||
</Card> | |||
</Grid> | |||
<Grid> | |||
<Card style={{height: "250px", width: "400px", padding:"20px"}}> | |||
<div align="center"> | |||
<img className={classes.imgCard} src="https://2.bp.blogspot.com/-pzpJ-ltEFsA/V6Kh26cBoNI/AAAAAAAAAKY/ZLnJ9v_lDIcKUUNcoVKM8Qw0Izawq08_wCLcB/s1600/yamalube%2B2.jpg" alt="Card-img" style={{height: "200px", width: "300px", display: "block"}}/> | |||
</div> | |||
{/* <div className={classes.imgCardOverlay}> | |||
<div align="center" style={{marginTop:"120px"}}> | |||
<Button color="white" href="https://twitter.com/YamahaIndonesia/status/1369143579684171778" target="_blank"> | |||
<Icon className={classes.icons}>open_in_new</Icon>For More Info | |||
</Button> | |||
</div> | |||
</div> */} | |||
<Grid align="center" style={{padding:"25px", marginTop:"-30px"}}> | |||
<Card style={{width: "19rem"}}> | |||
<div align="center"> | |||
<img | |||
style={{height: "180px", width: "300px", display: "block"}} className={classes.imgCardTop} src={Yamalube}/> | |||
</div> | |||
</Card> | |||
</Grid> | |||
<Grid> | |||
<Card style={{height: "250px", width: "400px", padding:"20px"}}> | |||
<div align="center"> | |||
<img className={classes.imgCard} src="https://aomc.mx/mm5/graphics/00000001/X0779100X.jpg" alt="Card-img" style={{height: "200px", width: "200px", display: "block"}}/> | |||
</div> | |||
{/* <div className={classes.imgCardOverlay}> | |||
<div align="center" style={{marginTop:"120px"}}> | |||
<Button color="white" href="https://twitter.com/YamahaIndonesia/status/1369143579684171778" target="_blank"> | |||
<Icon className={classes.icons}>open_in_new</Icon>For More Info | |||
</Button> | |||
</div> | |||
</div> */} | |||
<Grid align="center" style={{padding:"25px", marginTop:"-30px"}}> | |||
<Card style={{width: "19rem"}}> | |||
<div align="center"> | |||
<img | |||
style={{height: "180px", width: "200px", display: "block"}} className={classes.imgCardTop} src={Apparel}/> | |||
</div> | |||
</Card> | |||
</Grid> | |||
<Grid> | |||
<Card style={{height: "250px", width: "400px", padding:"20px"}}> | |||
<div align="center"> | |||
<img className={classes.imgCard} src="https://content.motosport.com/images/items/900/TLD/TLDY0AF/X001.jpg" alt="Card-img" style={{height: "200px", width: "200px", display: "block"}}/> | |||
</div> | |||
{/* <div className={classes.imgCardOverlay}> | |||
<div align="center" style={{marginTop:"120px"}}> | |||
<Button color="white" href="https://twitter.com/YamahaIndonesia/status/1369143579684171778" target="_blank"> | |||
<Icon className={classes.icons}>open_in_new</Icon>For More Info | |||
</Button> | |||
</div> | |||
</div> */} | |||
<Grid align="center" style={{padding:"25px", marginTop:"-30px"}}> | |||
<Card style={{width: "19rem"}}> | |||
<div align="center"> | |||
<img | |||
style={{height: "180px", width: "200px", display: "block"}} className={classes.imgCardTop} src={Helmet}/> | |||
</div> | |||
</Card> | |||
</Grid> | |||
<Grid> | |||
<Card style={{height: "250px", width: "400px", padding:"20px"}}> | |||
<div align="center"> | |||
<img className={classes.imgCard} src="https://static.wixstatic.com/media/bb08a6_fe756d074abc4e4c86ed0fe0134e50a5~mv2.jpg/v1/fill/w_960,h_429,al_c,q_85/bb08a6_fe756d074abc4e4c86ed0fe0134e50a5~mv2.webp" alt="Card-img" style={{height: "200px", width: "350px", display: "block"}}/> | |||
</div> | |||
{/* <div className={classes.imgCardOverlay}> | |||
<div align="center" style={{marginTop:"120px"}}> | |||
<Button color="white" href="https://twitter.com/YamahaIndonesia/status/1369143579684171778" target="_blank"> | |||
<Icon className={classes.icons}>open_in_new</Icon>For More Info | |||
</Button> | |||
</div> | |||
</div> */} | |||
<Grid align="center" style={{padding:"25px", marginTop:"-30px"}}> | |||
<Card style={{width: "19rem"}}> | |||
<div align="center"> | |||
<img | |||
style={{height: "180px", width: "300px", display: "block"}} className={classes.imgCardTop} src={Accessories}/> | |||
</div> | |||
</Card> | |||
</Grid> | |||
</GridContainer> | |||
@@ -55,7 +55,7 @@ export async function getServerSideProps(context) { | |||
if (userObj) { | |||
let sessionId = userObj["partners_login_states"].filter(function (i) { | |||
return ( | |||
i.business_partner && i.business_partner.name.toUpperCase() == "YAMAHA" | |||
i.business_partner && i.business_partner.name.toUpperCase() == "HINO" | |||
); | |||
}); | |||
if (sessionId.length != 0) user = userObj["username"]; | |||
@@ -53,7 +53,7 @@ export async function getServerSideProps(context) { | |||
if (userObj) { | |||
let sessionId = userObj["partners_login_states"].filter(function (i) { | |||
return ( | |||
i.business_partner && i.business_partner.name.toUpperCase() == "YAMAHA" | |||
i.business_partner && i.business_partner.name.toUpperCase() == "HINO" | |||
); | |||
}); | |||
if (sessionId.length != 0) user = userObj["username"]; | |||
@@ -64,8 +64,6 @@ export async function getServerSideProps(context) { | |||
detailcarrer = res["DATA"]["carrers"]; | |||
} | |||
console.log(res); | |||
return { | |||
props: { user, detailcarrer, backend }, // will be passed to the page component as props | |||
}; |
@@ -78,7 +78,7 @@ export async function getServerSideProps(context) { | |||
if (userObj) { | |||
let sessionId = userObj["partners_login_states"].filter(function (i) { | |||
return ( | |||
i.business_partner && i.business_partner.name.toUpperCase() == "YAMAHA" | |||
i.business_partner && i.business_partner.name.toUpperCase() == "HINO" | |||
); | |||
}); | |||
if (sessionId.length != 0) user = userObj["username"]; | |||
@@ -5,7 +5,7 @@ import { makeStyles } from "@material-ui/core/styles"; | |||
import Header from "components/Header/Header.js"; | |||
import HeaderHino from "components/Header/HeaderHino.js"; | |||
import FooterHino from "components/Footer/FooterHino.js"; | |||
import DataProduct from "pages-sections/honda/product/product.js"; | |||
import DataProduct from "pages-sections/hino/product/product.js"; | |||
import Parallax from "components/Parallax/Parallax.js"; | |||
import styles from "assets/jss/nextjs-material-kit/pages/components.js"; | |||
@@ -61,7 +61,7 @@ export async function getServerSideProps(context) { | |||
if (userObj) { | |||
let sessionId = userObj["partners_login_states"].filter(function (i) { | |||
return ( | |||
i.business_partner && i.business_partner.name.toUpperCase() == "SUZUKI" | |||
i.business_partner && i.business_partner.name.toUpperCase() == "HINO" | |||
); | |||
}); | |||
if (sessionId.length != 0) user = userObj["username"]; | |||
@@ -0,0 +1,70 @@ | |||
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 ProductDetail from "pages-sections/hino/product/product_details.js"; | |||
import Parallax from "components/Parallax/Parallax.js"; | |||
import styles from "assets/jss/nextjs-material-kit/pages/components.js"; | |||
import GetDetailproduct from "api/product/product.js" | |||
import Cookies from "cookies"; | |||
const useStyles = makeStyles(styles); | |||
const ProductDetails = function ({ backend, detailproduct, user, ...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)}> | |||
<ProductDetail detailproduct={detailproduct} backend={backend}/> | |||
</div> | |||
<Footer /> | |||
</div> | |||
); | |||
} | |||
export default ProductDetails; | |||
export async function getServerSideProps(context) { | |||
var {query} = context; | |||
var detailproduct = []; | |||
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() == "HINO" | |||
); | |||
}); | |||
if (sessionId.length != 0) user = userObj["username"]; | |||
} | |||
var res = await GetDetailproduct.GetDetailProduct(query.s||0); | |||
if (res["STATUS"] === 1) { | |||
detailproduct = res["DATA"]["products"]; | |||
} | |||
return { | |||
props: { detailproduct, backend, user }, // will be passed to the page component as props | |||
}; | |||
} |
@@ -55,7 +55,7 @@ export async function getServerSideProps(context) { | |||
if (userObj) { | |||
let sessionId = userObj["partners_login_states"].filter(function (i) { | |||
return ( | |||
i.business_partner && i.business_partner.name.toUpperCase() == "YAMAHA" | |||
i.business_partner && i.business_partner.name.toUpperCase() == "HINO" | |||
); | |||
}); | |||
if (sessionId.length != 0) user = userObj["username"]; | |||
@@ -55,7 +55,7 @@ export async function getServerSideProps(context) { | |||
if (userObj) { | |||
let sessionId = userObj["partners_login_states"].filter(function (i) { | |||
return ( | |||
i.business_partner && i.business_partner.name.toUpperCase() == "YAMAHA" | |||
i.business_partner && i.business_partner.name.toUpperCase() == "HONDA" | |||
); | |||
}); | |||
if (sessionId.length != 0) user = userObj["username"]; | |||
@@ -53,7 +53,7 @@ export async function getServerSideProps(context) { | |||
if (userObj) { | |||
let sessionId = userObj["partners_login_states"].filter(function (i) { | |||
return ( | |||
i.business_partner && i.business_partner.name.toUpperCase() == "YAMAHA" | |||
i.business_partner && i.business_partner.name.toUpperCase() == "HONDA" | |||
); | |||
}); | |||
if (sessionId.length != 0) user = userObj["username"]; | |||
@@ -64,8 +64,6 @@ export async function getServerSideProps(context) { | |||
detailcarrer = res["DATA"]["carrers"]; | |||
} | |||
console.log(res); | |||
return { | |||
props: { user, detailcarrer, backend }, // will be passed to the page component as props | |||
}; |
@@ -78,7 +78,7 @@ export async function getServerSideProps(context) { | |||
if (userObj) { | |||
let sessionId = userObj["partners_login_states"].filter(function (i) { | |||
return ( | |||
i.business_partner && i.business_partner.name.toUpperCase() == "YAMAHA" | |||
i.business_partner && i.business_partner.name.toUpperCase() == "HONDA" | |||
); | |||
}); | |||
if (sessionId.length != 0) user = userObj["username"]; | |||
@@ -61,7 +61,7 @@ export async function getServerSideProps(context) { | |||
if (userObj) { | |||
let sessionId = userObj["partners_login_states"].filter(function (i) { | |||
return ( | |||
i.business_partner && i.business_partner.name.toUpperCase() == "SUZUKI" | |||
i.business_partner && i.business_partner.name.toUpperCase() == "HONDA" | |||
); | |||
}); | |||
if (sessionId.length != 0) user = userObj["username"]; | |||
@@ -0,0 +1,70 @@ | |||
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 ProductDetail from "pages-sections/honda/product/product_details.js"; | |||
import Parallax from "components/Parallax/Parallax.js"; | |||
import styles from "assets/jss/nextjs-material-kit/pages/components.js"; | |||
import GetDetailproduct from "api/product/product.js" | |||
import Cookies from "cookies"; | |||
const useStyles = makeStyles(styles); | |||
const ProductDetails = function ({ backend, detailproduct, user, ...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)}> | |||
<ProductDetail detailproduct={detailproduct} backend={backend}/> | |||
</div> | |||
<Footer /> | |||
</div> | |||
); | |||
} | |||
export default ProductDetails; | |||
export async function getServerSideProps(context) { | |||
var {query} = context; | |||
var detailproduct = []; | |||
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() == "HONDA" | |||
); | |||
}); | |||
if (sessionId.length != 0) user = userObj["username"]; | |||
} | |||
var res = await GetDetailproduct.GetDetailProduct(query.s||0); | |||
if (res["STATUS"] === 1) { | |||
detailproduct = res["DATA"]["products"]; | |||
} | |||
return { | |||
props: { detailproduct, backend, user }, // will be passed to the page component as props | |||
}; | |||
} |
@@ -55,7 +55,7 @@ export async function getServerSideProps(context) { | |||
if (userObj) { | |||
let sessionId = userObj["partners_login_states"].filter(function (i) { | |||
return ( | |||
i.business_partner && i.business_partner.name.toUpperCase() == "YAMAHA" | |||
i.business_partner && i.business_partner.name.toUpperCase() == "HONDA" | |||
); | |||
}); | |||
if (sessionId.length != 0) user = userObj["username"]; | |||