選択できるのは25トピックまでです。 トピックは、先頭が英数字で、英数字とダッシュ('-')を使用した35文字以内のものにしてください。

178 行
5.1 KiB

  1. import React from "react";
  2. import classNames from "classnames";
  3. import { makeStyles } from "@material-ui/core/styles";
  4. import { QueryClient, QueryClientProvider, useQuery } from 'react-query'
  5. import Header from "components/Header/Header.js";
  6. import HeaderLinks from "components/Header/HeaderLinks.js";
  7. import Footer from "components/Footer/Footer.js";
  8. import Parallax from "components/Parallax/Parallax.js";
  9. import styles from "assets/jss/nextjs-material-kit/pages/components.js";
  10. import GetDataApparel from "api/sparepart/sparepart.js";
  11. import DataApparel from "pages-sections/yamaha/product/apparel.js";
  12. import DataSnackbarContent from "pages-sections/yamaha/snackbar.js";
  13. import Router from 'next/router'
  14. import Cookies from "cookies";
  15. const useStyles = makeStyles(styles);
  16. const queryClient = new QueryClient();
  17. const handleName = values => {
  18. Router.push({
  19. pathname: 'yamaha/product/apparel',
  20. query: (values&&values.length!=0)?{ filter: values[0]["name"] }:{},
  21. })
  22. }
  23. const Apparel = function ({
  24. user,
  25. selected,
  26. apparel,
  27. asia,
  28. basic,
  29. merchand,
  30. maxi,
  31. rainsuit,
  32. motogp,
  33. offroad,
  34. backend,
  35. ...props })
  36. {
  37. const classes = useStyles();
  38. const { ...rest } = props;
  39. return (
  40. <div>
  41. <Header
  42. rightLinks={<HeaderLinks username={user} />}
  43. fixed
  44. color="info"
  45. changeColorOnScroll={{
  46. height: 400,
  47. color: "white",
  48. }}
  49. {...rest}
  50. />
  51. <Parallax image={require("assets/img/yamalube.jpg")} height="200px"/>
  52. <div className={classNames(classes.main, classes.mainRaised)}>
  53. <QueryClientProvider client={queryClient}>
  54. <DataSnackbarContent/>
  55. <DataApparel selected={(selected=="")?null:selected[0]["id"]} handleName={handleName} apparel={apparel} asia={asia} basic={basic} merchand={merchand} maxi={maxi} rainsuit={rainsuit} motogp={motogp} offroad={offroad} backend={backend} />
  56. </QueryClientProvider>
  57. </div>
  58. <Footer />
  59. </div>
  60. );
  61. };
  62. export default Apparel;
  63. export async function getServerSideProps(context) {
  64. var apparel = [];
  65. var asia = [];
  66. var basic = [];
  67. var merchand = [];
  68. var maxi = [];
  69. var rainsuit = [];
  70. var motogp = [];
  71. var offroad = [];
  72. var filter = context.query.filter||"";
  73. var selected = "";
  74. var { req, resp } = context;
  75. const cookies = new Cookies(req, resp);
  76. var user = "";
  77. var userObj = (await cookies.get("user"))
  78. ? JSON.parse(await cookies.get("user"))
  79. : null;
  80. if (userObj) {
  81. let sessionId = userObj["partners_login_states"].filter(function (i) {
  82. return (
  83. i.business_partner && i.business_partner.name.toUpperCase() == "YAMAHA"
  84. );
  85. });
  86. if (sessionId.length != 0) user = userObj["username"];
  87. }
  88. const backend = process.env.BACKEND_SERVER_URI;
  89. var res = await GetDataApparel.GetApparel(filter);
  90. if (res["STATUS"] === 1) {
  91. apparel = res["DATA"]["apparels"];
  92. if (filter !=""){
  93. selected = apparel.filter((i)=>i.name==filter);
  94. }
  95. }
  96. var res = await GetDataApparel.GetApparel46Asia(filter);
  97. if (res["STATUS"] === 1) {
  98. asia = res["DATA"]["apparels"];
  99. if (filter !=""){
  100. selected = asia.filter((i)=>i.name==filter);
  101. }
  102. }
  103. var res = await GetDataApparel.GetApparelBasic(filter);
  104. if (res["STATUS"] === 1) {
  105. basic = res["DATA"]["apparels"];
  106. if (filter !=""){
  107. selected = basic.filter((i)=>i.name==filter);
  108. }
  109. }
  110. var res = await GetDataApparel.GetApparelMerchandise(filter);
  111. if (res["STATUS"] === 1) {
  112. merchand = res["DATA"]["apparels"];
  113. if (filter !=""){
  114. selected = merchand.filter((i)=>i.name==filter);
  115. }
  116. }
  117. var res = await GetDataApparel.GetApparelMaxi(filter);
  118. if (res["STATUS"] === 1) {
  119. maxi = res["DATA"]["apparels"];
  120. if (filter !=""){
  121. selected = maxi.filter((i)=>i.name==filter);
  122. }
  123. }
  124. var res = await GetDataApparel.GetApparelRainSuit(filter);
  125. if (res["STATUS"] === 1) {
  126. rainsuit = res["DATA"]["apparels"];
  127. if (filter !=""){
  128. selected = rainsuit.filter((i)=>i.name==filter);
  129. }
  130. }
  131. var res = await GetDataApparel.GetApparelMotoGP(filter);
  132. if (res["STATUS"] === 1) {
  133. motogp = res["DATA"]["apparels"];
  134. if (filter !=""){
  135. selected = motogp.filter((i)=>i.name==filter);
  136. }
  137. }
  138. var res = await GetDataApparel.GetApparelOffRoad(filter);
  139. if (res["STATUS"] === 1) {
  140. offroad = res["DATA"]["apparels"];
  141. if (filter !=""){
  142. selected = offroad.filter((i)=>i.name==filter);
  143. }
  144. }
  145. return {
  146. props: {
  147. user,
  148. selected,
  149. apparel,
  150. asia,
  151. basic,
  152. merchand,
  153. maxi,
  154. rainsuit,
  155. motogp,
  156. offroad,
  157. backend
  158. },
  159. // will be passed to the page component as props
  160. };
  161. }