diff --git a/src/components/PopupCard/index.js b/src/components/PopupCard/index.js index 53b7657..1ea5d69 100644 --- a/src/components/PopupCard/index.js +++ b/src/components/PopupCard/index.js @@ -1,10 +1,12 @@ import React, { useState } from "react"; import "./index.scss"; +import CancleIcon from "../CancleIcon"; import cancleIcon from "./cancle-icon.svg"; import calender from "./calender.svg"; +import OutlineInput from "../OutlineInput"; -const PopupCard = ({ textArea }) => { +const PopupCard = ({ textArea, selectedChecklist, notSelectedChecklist }) => { const [activeInput, setActiveInput] = useState(false); const [checklist, setChecklist] = useState(0); @@ -28,38 +30,25 @@ const PopupCard = ({ textArea }) => {
{/* cancle icon */} -
- -
+
{/* modalBody */}
{/* top */}
{/* right */} - setSelectedTab(true)} onFocus={() => setActiveInput(true)} onBlur={() => setActiveInput(false)} /> - - نام کارت - + {/* divider */} -
+
{/* left */}
@@ -92,32 +81,40 @@ const PopupCard = ({ textArea }) => {
چک لیست ها
{checklist} -
- setChecklist(checklist + 25)} - /> - چک لیست ها -
-
- setChecklist(checklist + 25)} - /> - چک لیست ها -
+ {selectedChecklist.slice(0, 1).map((item, index) => ( +
+ setChecklist(checklist + 25)} + // onChange={(e) => + // e.target.checked === true + // ? checklist - 25 + // : checklist + 25 + // } + // onClick={() => + // setChecklist( + // checked === true ? checklist - 25 : checklist + 25 + // ) + // } + type="checkbox" + checked + className="form-checkbox text-blue-500 bg-red-600" + onClick={() => setChecklist(checklist + 25)} + /> + {item.title} +
+ ))}
{/* divider */} -
+
{/* left */}
@@ -145,4 +142,26 @@ export default PopupCard; PopupCard.defaultProps = { textArea: "جنگ اول خلیج فارس، جنگی به رهبری آمریکا و با همکاری ائتلافی از ۳۵ کشور مختلف بود که علیه عراق بعثی در واکنش به اشغال کویت توسط عراق انجام گرفت پایان جنگ ایران و عراق هم ‌زمان با بروز تشنّج عراق و کویت بود. ارتش عراق در زمان حکومت صدام حسین و حزب بعث عراق د", + selectedChecklist: [ + { + title: "خرید شماره 1", + }, + { + title: "خرید شماره 1", + }, + { + title: "خرید شماره 3", + }, + ], + notSelectedChecklist: [ + { + title: "خرید شماره 1", + }, + { + title: "خرید شماره 1", + }, + { + title: "خرید شماره 3", + }, + ], };