update data.js

master
mahdi 2 years ago
parent e3d79c342f
commit 79f9f8d91a
  1. 111
      src/components/ProductDescriptionTable/ProductTable1/index.js
  2. 25
      src/components/ProductDescriptionTable/index.js
  3. 11
      src/redux/data.js

@ -0,0 +1,111 @@
import React from "react";
const ProductTable1 = ({ navTitles, items, addToCart }) => {
return (
<>
<div className="w-full flex justify-center rounded bg-gray-200">
<ul className="w-full flex justify-center">
{navTitles.map((item) => (
<li
key={`NavTitle_${item.id}`}
className={`p-6 mx-4 cursor-pointer
${
item.isActive
? "border-0 border-b-4 border-solid border-blue-500"
: null
}`}
onClick={() =>
item.isActive ? null : (item.isActive = !item.isActive)
}
>
{item.title}
</li>
))}
</ul>
</div>
<div className="w-full flex">
<div className="flex-1 ">
{items.map((e) =>
e.items.map((item) => (
<ul className="flex w-full flex-1 my-2 items-center">
<li
className="py-4 px-8 min-w-md bg-gray-200 ml-4 text-blueC0"
style={{ minWidth: "300px" }}
>
{item.title}
</li>
<li className="py-4 px-8 min-w-md bg-gray-200 ml-4 w-full">
{item.description}
</li>
</ul>
))
)}
</div>
<div className="my-2">{addToCart}</div>
</div>
</>
);
};
export default ProductTable1;
ProductTable1.defaultProps = {
navTitles: [
{
id: 0,
title: "مشخصات",
isActive: true,
name: "moshakhasat",
},
{
id: 1,
title: "نقد و بررسی",
isActive: false,
},
{
id: 2,
title: "برسش و باسخ",
isActive: false,
},
],
items: [
{
name: "moshakhasat",
items: [
{
title: "وزن کتاب",
description: "۱ کیلوگرم",
},
{
title: "تعداد صفحات",
description: "400 صفحه",
},
{
title: "نوع کاغذ",
description: "گلاسه",
},
{
title: "شماره شابک",
description: "1225548218000005818765",
},
{
title: "انتشارات",
description: "رزمندگان",
},
{
title: "نویسنده و یا معلف",
description: "یک نویسنده گمنام",
},
{
title: "قطع",
description: "خشتی",
},
{
title: "سال انتشار",
description: "1399",
},
],
},
],
};

@ -0,0 +1,25 @@
import React, { useState } from "react";
import ProductTable1 from "./ProductTable1";
function Advertisements() {
const list = {
1: <ProductTable1 />,
};
const [type, setType] = useState(1);
return (
<div className="w-full flex flex-col items-center">
<select
className="mb-10 w-20 bg-gray-200"
onChange={(e) => setType(e.target.value)}
>
{Object.keys(list).map((option, index) => (
<option key={index}>{option}</option>
))}
</select>
{list[type]}
</div>
);
}
export default Advertisements;

@ -26,6 +26,7 @@ import SingleProduct from "../components/SingleProduct";
import Rating from "../components/Rating";
import Tooltip from "../components/Tooltip";
import ProductSuggestionCard from "../components/ProductSuggestionCard";
import ProductDescriptionTable from "../components/ProductDescriptionTable";
// mini components
import MiniComponents from "../components/MiniComponents";
@ -599,6 +600,16 @@ const components = [
code: null,
},
},
{
name: "Product Description Table",
author: "Keshavarzi",
props: [],
content: {
name: "Product Description Table",
component: <ProductDescriptionTable />,
code: null,
},
},
// mini components
{
name: "Mini Components",

Loading…
Cancel
Save