yusmar
/
tbg-ecomm-nextjs


			
				
					
						
						
							
							{"ast":null,"code":"import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nvar _excluded = [\"backend\", \"detailproduct\"];\nvar __jsx = React.createElement;\nimport React, { useState, useEffect } from \"react\";\nimport classNames from \"classnames\";\nimport { makeStyles } from \"@material-ui/core/styles\";\nimport ReactHtmlParser from \"react-html-parser\";\nimport Dashboard from \"@material-ui/icons/Dashboard\";\nimport Icon from \"@material-ui/core/Icon\";\nimport GridContainer from \"components/Grid/GridContainer.js\";\nimport Grid from '@material-ui/core/Grid';\nimport GridItem from \"components/Grid/GridItem.js\";\nimport NavPills from \"components/NavPills/NavPills.js\";\nimport Card from \"components/Card/Card.js\";\nimport CardBody from \"components/Card/CardBody.js\";\nimport CardHeader from \"components/Card/CardHeader.js\";\nimport CardFooter from \"components/Card/CardFooter.js\";\nimport Button from \"components/CustomButtons/Button.js\";\nimport styles from \"assets/jss/nextjs-material-kit/pages/profilePage.js\";\nimport Carousel from \"react-slick\";\nimport NumberFormat from 'react-number-format';\nvar useStyles = makeStyles(styles);\n\nvar DataProduct = function DataProduct(_ref) {\n  var backend = _ref.backend,\n      detailproduct = _ref.detailproduct,\n      props = _objectWithoutProperties(_ref, _excluded);\n\n  console.log(detailproduct);\n  var classes = useStyles();\n\n  var rest = _extends({}, props);\n\n  var imageClasses = classNames(classes.imgRaised, classes.imgRoundedCircle, classes.imgFluid);\n  var settings = {\n    dots: true,\n    infinite: true,\n    speed: 500,\n    slidesToShow: 1,\n    slidesToScroll: 1,\n    autoplay: true,\n    time: 5\n  };\n  var navImageClasses = classNames(classes.imgRounded, classes.imgGallery);\n  var Productdetails = detailproduct.map(function (data) {\n    return __jsx(\"div\", null, __jsx(GridContainer, null, __jsx(Grid, {\n      fluid: true,\n      xs: 5\n    }, __jsx(\"div\", {\n      className: classes.section,\n      id: \"notifications\"\n    }, __jsx(\"div\", {\n      className: classes.section\n    }, __jsx(\"div\", {\n      className: classes.container\n    }, __jsx(GridContainer, null, __jsx(GridItem, {\n      className: classes.marginAuto\n    }, __jsx(Card, {\n      carousel: true\n    }, __jsx(Carousel, settings, __jsx(\"img\", {\n      className: navImageClasses,\n      width: \"300px\",\n      alt: \"First slide\",\n      src: \"\".concat(backend).concat(data.img[0][\"url\"])\n    }))))))))), __jsx(Grid, {\n      xs: 7,\n      style: {\n        padding: \"40px\",\n        marginTop: \"-30px\"\n      }\n    }, __jsx(\"h3\", null, data.name), __jsx(\"h3\", null, __jsx(NumberFormat, {\n      value: data.price,\n      displayType: 'text',\n      thousandSeparator: true,\n      prefix: 'Rp.'\n    }), \" - Stock Unit : \", data.stock), __jsx(\"hr\", null), __jsx(\"div\", {\n      align: \"justify\"\n    }, __jsx(\"p\", null, ReactHtmlParser(data.description))))), __jsx(GridContainer, {\n      justify: \"center\"\n    }, __jsx(GridItem, null, __jsx(NavPills, {\n      color: \"primary\",\n      align: \"center\",\n      alignCenter: true,\n      tabs: [// {\n      //   tabButton: \"Overview\",\n      //   tabIcon: Dashboard,\n      //   tabContent: (\n      //     <div>\n      //     <GridItem className={classes.marginAuto}>\n      //         <div align=\"justify\">\n      //          <table>\n      //             <tr>\n      //               <td>\n      //                 <h4><b>{ReactHtmlParser(data.overview1)}</b></h4>\n      //               </td>\n      //               <td>\n      //                 <img src={`${backend}${data.img_overview1[\"url\"]}`} />\n      //               </td>\n      //             </tr>\n      //             <tr>\n      //               <td>\n      //                 <img src={`${backend}${data.img_overview2[\"url\"]}`} />\n      //               </td>\n      //               <td>\n      //                 <h4><b>{ReactHtmlParser(data.overview2)}</b></h4>\n      //               </td>\n      //             </tr>\n      //             <tr>\n      //               <td>\n      //                 <h4><b>{ReactHtmlParser(data.overview3)}</b></h4>\n      //               </td>\n      //               <td>\n      //                 <img src={`${backend}${data.img_overview3[\"url\"]}`} />\n      //               </td>\n      //             </tr>\n      //             <tr>\n      //               <td>\n      //                 <img src={`${backend}${data.img_overview4[\"url\"]}`} />\n      //               </td>\n      //               <td>\n      //                 <h4><b>{ReactHtmlParser(data.overview4)}</b></h4>\n      //               </td>\n      //             </tr>\n      //             <tr>\n      //               <td>\n      //                 <h4><b>{ReactHtmlParser(data.overview5)}</b></h4>\n      //               </td>\n      //               <td>\n      //                 <img src={`${backend}${data.img_overview5[\"url\"]}`} />\n      //               </td>\n      //             </tr>\n      //             <tr>\n      //               <td>\n      //                 <img src={`${backend}${data.img_overview6[\"url\"]}`} />\n      //               </td>\n      //               <td>\n      //                 <h4><b>{ReactHtmlParser(data.overview6)}</b></h4>\n      //               </td>\n      //             </tr>\n      //             <tr>\n      //               <td>\n      //                 <h4><b>{ReactHtmlParser(data.overview7)}</b></h4>\n      //               </td>\n      //               <td>\n      //                 <img src={`${backend}${data.img_overview7[\"url\"]}`} />\n      //               </td>\n      //             </tr>\n      //             <tr>\n      //               <td>\n      //                 <img src={`${backend}${data.img_overview8[\"url\"]}`} />\n      //               </td>\n      //               <td>\n      //                 <h4><b>{ReactHtmlParser(data.overview8)}</b></h4>\n      //               </td>\n      //             </tr>\n      //             <tr>\n      //               <td>\n      //                 <h4><b>{ReactHtmlParser(data.overview9)}</b></h4>\n      //               </td>\n      //               <td>\n      //                 <img src={`${backend}${data.img_overview9[\"url\"]}`} />\n      //               </td>\n      //             </tr>\n      //             <tr>\n      //               <td>\n      //                 <img src={`${backend}${data.img_overview10[\"url\"]}`} />\n      //               </td>\n      //               <td>\n      //                 <h4><b>{ReactHtmlParser(data.overview10)}</b></h4>\n      //               </td>\n      //             </tr>\n      //           </table>\n      //         </div>\n      //       </GridItem>\n      //     </div>\n      //   ),\n      // },\n      {\n        tabButton: \"Overview\",\n        tabIcon: Dashboard,\n        tabContent: __jsx(\"div\", null, __jsx(GridItem, {\n          className: classes.marginAuto\n        }, __jsx(\"div\", {\n          align: \"center\"\n        }, __jsx(\"table\", null, __jsx(\"tr\", null, __jsx(\"td\", null, __jsx(\"h4\", null, __jsx(\"b\", null, ReactHtmlParser(data.overview1)))), __jsx(\"td\", null, __jsx(\"img\", {\n          src: \"https://www.yamaha-motor.co.id/uploads/products/overview/201912012240262893A2540.jpg\"\n        }))), __jsx(\"tr\", null, __jsx(\"td\", null, __jsx(\"img\", {\n          src: \"https://www.yamaha-motor.co.id/uploads/products/overview/2019120516484034670K42560.jpg\"\n        })), __jsx(\"td\", null, __jsx(\"h4\", null, __jsx(\"b\", null, ReactHtmlParser(data.overview2))))), __jsx(\"tr\", null, __jsx(\"td\", null, __jsx(\"h4\", null, __jsx(\"b\", null, ReactHtmlParser(data.overview3)))), __jsx(\"td\", null, __jsx(\"img\", {\n          src: \"https://www.yamaha-motor.co.id/uploads/products/overview/2019120122402661202S19702.jpg\"\n        }))), __jsx(\"tr\", null, __jsx(\"td\", null, __jsx(\"img\", {\n          src: \"https://www.yamaha-motor.co.id/uploads/products/overview/2019120123231136996Y5592.jpg\"\n        })), __jsx(\"td\", null, __jsx(\"h4\", null, __jsx(\"b\", null, ReactHtmlParser(data.overview4))))), __jsx(\"tr\", null, __jsx(\"td\", null, __jsx(\"h4\", null, __jsx(\"b\", null, ReactHtmlParser(data.overview5)))), __jsx(\"td\", null, __jsx(\"img\", {\n          src: \"https://www.yamaha-motor.co.id/uploads/products/overview/2019120123173855561Z61407.jpg\"\n        }))), __jsx(\"tr\", null, __jsx(\"td\", null, __jsx(\"img\", {\n          src: \"https://www.yamaha-motor.co.id/uploads/products/overview/2019120123173867373B74912.jpg\"\n        })), __jsx(\"td\", null, __jsx(\"h4\", null, __jsx(\"b\", null, ReactHtmlParser(data.overview6))))), __jsx(\"tr\", null, __jsx(\"td\", null, __jsx(\"h4\", null, __jsx(\"b\", null, ReactHtmlParser(data.overview7)))), __jsx(\"td\", null, __jsx(\"img\", {\n          src: \"https://www.yamaha-motor.co.id/uploads/products/overview/2019120123173831375M60860.jpg\"\n        }))), __jsx(\"tr\", null, __jsx(\"td\", null, __jsx(\"img\", {\n          src: \"https://www.yamaha-motor.co.id/uploads/products/overview/2019120122402691982X34635.jpg\"\n        })), __jsx(\"td\", null, __jsx(\"h4\", null, __jsx(\"b\", null, ReactHtmlParser(data.overview8))))), __jsx(\"tr\", null, __jsx(\"td\", null, __jsx(\"h4\", null, __jsx(\"b\", null, ReactHtmlParser(data.overview9)))), __jsx(\"td\", null, __jsx(\"img\", {\n          src: \"https://www.yamaha-motor.co.id/uploads/products/overview/201912012240264043F92645.jpg\"\n        }))), __jsx(\"tr\", null, __jsx(\"td\", null, __jsx(\"img\", {\n          src: \"https://www.yamaha-motor.co.id/uploads/products/overview/2019120122402675980Z35071.jpg\"\n        })), __jsx(\"td\", null, __jsx(\"h4\", null, __jsx(\"b\", null, ReactHtmlParser(data.overview10)))))))))\n      }, {\n        tabButton: \"Specification\",\n        tabIcon: Dashboard,\n        tabContent: __jsx(GridContainer, {\n          justify: \"center\",\n          style: {\n            padding: \"40px\",\n            marginTop: \"-30px\"\n          }\n        }, __jsx(GridItem, {\n          className: classes.marginAuto\n        }, __jsx(\"div\", {\n          align: \"justify\"\n        }, __jsx(\"h2\", null, \"Spesifikasi Mesin\"), ReactHtmlParser(data.spesifikasi_mesin), __jsx(\"br\", null), __jsx(\"br\", null), __jsx(\"h2\", null, \"Spesifikasi Dimensi\"), ReactHtmlParser(data.spesifikasi_dimensi), __jsx(\"br\", null), __jsx(\"br\", null), __jsx(\"h2\", null, \"Spesifikasi Rangka\"), ReactHtmlParser(data.spesifikasi_rangka), __jsx(\"br\", null), __jsx(\"br\", null), __jsx(\"h2\", null, \"Spesifikasi Kelistrikan\"), ReactHtmlParser(data.spesifikasi_kelistrikan), __jsx(\"br\", null), __jsx(\"br\", null))))\n      }, {\n        tabButton: \"Film\",\n        tabIcon: Dashboard,\n        tabContent: __jsx(GridContainer, {\n          justify: \"center\",\n          style: {\n            padding: \"40px\",\n            marginTop: \"-30px\"\n          }\n        }, __jsx(GridItem, {\n          className: classes.marginAuto\n        }, __jsx(\"div\", {\n          align: \"justify\"\n        }, ReactHtmlParser(data.film))))\n      }]\n    }))));\n  });\n  return __jsx(Card, {\n    className: classes.textCenter\n  }, __jsx(\"div\", {\n    align: \"center\"\n  }, __jsx(CardHeader, {\n    color: \"info\"\n  }, \"Product Detail\")), __jsx(CardBody, null, __jsx(\"div\", null, Productdetails)), __jsx(CardFooter, {\n    className: classes.textMuted,\n    textAlign: \"center\"\n  }, \"\\xA9 2020 , All Right Reserved by @Thamrin Brother Company\"));\n};\n\nexport default DataProduct;","map":null,"metadata":{},"sourceType":"module"}