diff --git a/api/product/accessories.js b/api/product/accessories.js new file mode 100644 index 0000000..3806975 --- /dev/null +++ b/api/product/accessories.js @@ -0,0 +1,46 @@ +import apollo from "../../lib/apollo.js"; + +async function GetYGP(token="") { + var res = await apollo.query( + ` + query { + accessories(where: { category: "YGP" }) { + id + name + description + price + part_code + img { + url + } + } + }`, + token + ); + return res; +} + +async function GetYamalube(token="") { + var res = await apollo.query( + ` + query { + accessories(where: { category: "Yamalube" }) { + id + name + description + price + part_code + img { + url + } + } + }`, + token + ); + return res; +} + +module.exports = { + GetYGP:GetYGP, + GetYamalube:GetYamalube, +}; \ No newline at end of file diff --git a/api/product/product.js b/api/product/product.js index c7994a3..15e446e 100644 --- a/api/product/product.js +++ b/api/product/product.js @@ -45,7 +45,6 @@ async function GetDetailProduct(id, token="") { } overview specification - accessories film{ url } @@ -79,7 +78,6 @@ async function GetProductYamaha(token="") { } overview specification - accessories film{ url } @@ -110,7 +108,6 @@ async function GetProductSuzuki(token="") { } overview specification - accessories film{ url } @@ -141,7 +138,6 @@ async function GetProductHonda(token="") { } overview specification - accessories film{ url } @@ -172,7 +168,6 @@ async function GetProductHino(token="") { } overview specification - accessories film{ url } @@ -203,7 +198,6 @@ async function GetProductMercedes(token="") { } overview specification - accessories film{ url } @@ -234,7 +228,6 @@ async function GetProductBPR(token="") { } overview specification - accessories film{ url } @@ -265,7 +258,6 @@ async function GetProductEmilia(token="") { } overview specification - accessories film{ url } @@ -296,7 +288,6 @@ async function GetProductHomes(token="") { } overview specification - accessories film{ url } diff --git a/components/Header/HeaderLinks.js b/components/Header/HeaderLinks.js index fa2b5e0..128d076 100644 --- a/components/Header/HeaderLinks.js +++ b/components/Header/HeaderLinks.js @@ -48,10 +48,10 @@ export default function HeaderLinks(props) { }} buttonIcon={Apps} dropdownList={[ - + Motor , - + YGP , diff --git a/package.json b/package.json index d402687..5671595 100644 --- a/package.json +++ b/package.json @@ -59,6 +59,7 @@ "react-slick": "0.25.2", "react-swipeable-views": "0.13.9", "rsuite": "^4.9.2", + "scss": "^0.2.4", "styled-components": "5.1.0", "webpack": "4.43.0" } diff --git a/pages-sections/product/product_details.js b/pages-sections/product/product_details.js index 6fe5c7b..18b3df8 100644 --- a/pages-sections/product/product_details.js +++ b/pages-sections/product/product_details.js @@ -1,4 +1,4 @@ -import React from "react"; +import React, { useState, useEffect } from "react"; import classNames from "classnames"; import { makeStyles } from "@material-ui/core/styles"; import ReactHtmlParser from "react-html-parser"; @@ -50,9 +50,11 @@ const DataProduct = function ({ backend, detailproduct, ...props }) { First slide - First slide + {/* */} @@ -66,9 +68,18 @@ const DataProduct = function ({ backend, detailproduct, ...props }) {

{ReactHtmlParser(data.description)}

- + + + + + + + + + + + + @@ -85,7 +96,7 @@ const DataProduct = function ({ backend, detailproduct, ...props }) {
-
+
{ReactHtmlParser(data.overview)}
@@ -107,29 +118,18 @@ const DataProduct = function ({ backend, detailproduct, ...props }) { ), }, { - tabButton: "Accessories", + tabButton: "Film", tabIcon: Dashboard, tabContent: (
- {ReactHtmlParser(data.accessories)} + {ReactHtmlParser(data.film)}
), }, - { - tabButton: "Film", - tabIcon: Dashboard, - tabContent: ( - - - First slide - - - ), - }, ]} /> diff --git a/pages-sections/product/ygp.js b/pages-sections/product/ygp.js new file mode 100644 index 0000000..a9916fc5 --- /dev/null +++ b/pages-sections/product/ygp.js @@ -0,0 +1,29 @@ +import React from "react"; +import { makeStyles } from "@material-ui/core/styles"; + +import styles from "assets/jss/nextjs-material-kit/pages/componentsSections/notificationsStyles.js"; +import Card from "components/Card/Card.js"; +import CardBody from "components/Card/CardBody.js"; +import CardHeader from "components/Card/CardHeader.js"; + +const useStyles = makeStyles(styles); + +const DataYGP = function ({ backend, ygp, ...props }) { + const classes = useStyles(); + return ( +
+ +
+ +

Yamaha Geniue Part

+
+
+ +

Yamaha Geniue Part

+
+
+
+ ); +} + +export default DataYGP; \ No newline at end of file diff --git a/pages/chart.js b/pages/cart.js similarity index 92% rename from pages/chart.js rename to pages/cart.js index f4e7ebe..1b9514d 100644 --- a/pages/chart.js +++ b/pages/cart.js @@ -5,7 +5,7 @@ import { makeStyles } from "@material-ui/core/styles"; import Header from "components/Header/Header.js"; import HeaderLinks from "components/Header/HeaderLinks.js"; import Footer from "components/Footer/Footer.js"; -// import SectionChart from "pages-sections/Components-Sections/SectionChart.js"; +// import SectionChart from "pages-sections/cart/SectionChart.js"; import Parallax from "components/Parallax/Parallax.js"; import styles from "../assets/jss/nextjs-material-kit/pages/components.js"; diff --git a/pages/product.js b/pages/product/product.js similarity index 98% rename from pages/product.js rename to pages/product/product.js index c5a6c3e..ca3fbcb 100644 --- a/pages/product.js +++ b/pages/product/product.js @@ -9,7 +9,7 @@ import DataProduct from "pages-sections/product/product.js"; import Parallax from "components/Parallax/Parallax.js"; import styles from "assets/jss/nextjs-material-kit/pages/components.js"; -import Getproduct from "../api/product/product.js"; +import Getproduct from "../../api/product/product.js"; const useStyles = makeStyles(styles); diff --git a/pages/product_detail.js b/pages/product/product_detail.js similarity index 95% rename from pages/product_detail.js rename to pages/product/product_detail.js index 33dc3e4..c05dc9d 100644 --- a/pages/product_detail.js +++ b/pages/product/product_detail.js @@ -8,7 +8,7 @@ import Footer from "components/Footer/Footer.js"; import ProductDetail from "pages-sections/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 GetDetailproduct from "../../api/product/product.js" const useStyles = makeStyles(styles); @@ -48,8 +48,6 @@ export async function getServerSideProps(context) { detailproduct = res["DATA"]["products"]; } - console.log(res); - return { props: { detailproduct, backend }, // will be passed to the page component as props }; diff --git a/pages/product/ygp.js b/pages/product/ygp.js new file mode 100644 index 0000000..b624e6e --- /dev/null +++ b/pages/product/ygp.js @@ -0,0 +1,54 @@ +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/HeaderLinks.js"; +import Footer from "components/Footer/Footer.js"; +import DataYGP from "pages-sections/product/ygp.js"; +import Parallax from "components/Parallax/Parallax.js"; +import styles from "assets/jss/nextjs-material-kit/pages/components.js"; + +import GetAccessories from "../../api/product/accessories.js"; + +const useStyles = makeStyles(styles); + +const Product = function ({ backend, ygp, ...props }) { + const classes = useStyles(); + const { ...rest } = props; + return ( +
+
} + fixed + color="info" + changeColorOnScroll={{ + height: 400, + color: "white", + }} + {...rest} + /> + +
+ +
+
+ ); +}; + +export default Product; + +export async function getServerSideProps(context) { + var ygp = []; + const backend = process.env.BACKEND_SERVER_URI; + + var res = await GetAccessories.GetYGP(); + if (res["STATUS"] === 1) { + ygp = res["DATA"]["accessories"]; + } + + return { + props: { backend, ygp, }, // will be passed to the page component as props + }; +} diff --git a/yarn.lock b/yarn.lock index b20c543..c646d44 100644 --- a/yarn.lock +++ b/yarn.lock @@ -5221,6 +5221,11 @@ object.values@^1.1.0: es-abstract "^1.18.0-next.1" has "^1.0.3" +ometa@0.2.2: + version "0.2.2" + resolved "https://registry.yarnpkg.com/ometa/-/ometa-0.2.2.tgz#f53c4735ba6d56af5a46b04dfb7c4334c596d44e" + integrity sha1-9TxHNbptVq9aRrBN+3xDNMWW1E4= + once@^1.3.0, once@^1.3.1, once@^1.4.0: version "1.4.0" resolved "https://registry.yarnpkg.com/once/-/once-1.4.0.tgz#583b1aa775961d4b113ac17d9c50baef9dd76bd1" @@ -6779,6 +6784,13 @@ scss-tokenizer@^0.2.3: js-base64 "^2.1.8" source-map "^0.4.2" +scss@^0.2.4: + version "0.2.4" + resolved "https://registry.yarnpkg.com/scss/-/scss-0.2.4.tgz#040d903ed37c5d4fa4ad33ae1fd389ac12a4e065" + integrity sha1-BA2QPtN8XU+krTOuH9OJrBKk4GU= + dependencies: + ometa "0.2.2" + "semver@2 || 3 || 4 || 5", semver@^5.4.1, semver@^5.5.0, semver@^5.5.1, semver@^5.6.0: version "5.7.1" resolved "https://registry.yarnpkg.com/semver/-/semver-5.7.1.tgz#a954f931aeba508d307bbf069eff0c01c96116f7"