add QRCode to EditQuestionPage

This commit is contained in:
Majd_dk 2024-11-19 16:55:19 +03:00
parent 7b966d93ed
commit 2d3613d1e3
2 changed files with 19 additions and 5 deletions

View File

@ -1,12 +1,10 @@
import React from "react"; import React from "react";
import QRCode from "react-qr-code"; import QRCode from "react-qr-code";
const QRCodeGenerator = ({ url, serial }: any) => { const QRCodeGenerator = ({url}:any) => {
const qrValue = `${url}/${serial}`;
console.log(qrValue);
return ( return (
<div style={{ display: "flex", justifyContent: "center" }}> <div style={{display:'flex',justifyContent:'center'}} >
<QRCode value={qrValue} size={230} type="link" /> <QRCode value={url} size={230} type='link' />
</div> </div>
); );
}; };

View File

@ -8,6 +8,10 @@ import { CheckboxProps } from "antd/lib";
import { LocalStorageEnum } from "../../../../../enums/LocalStorageEnum"; import { LocalStorageEnum } from "../../../../../enums/LocalStorageEnum";
import { useObjectToEdit } from "../../../../../zustand/ObjectToEditState"; import { useObjectToEdit } from "../../../../../zustand/ObjectToEditState";
import ModelForm from "../../Model/ModelForm"; import ModelForm from "../../Model/ModelForm";
import QrCodeModels from "../../../../../Layout/Dashboard/QrCodeModels";
import { ModalEnum } from "../../../../../enums/Model";
import { BsQrCode } from "react-icons/bs";
import { useModalState } from "../../../../../zustand/Modal";
const FormContainer = ({ const FormContainer = ({
objectToEdit, objectToEdit,
@ -56,6 +60,12 @@ const FormContainer = ({
e.target.checked ? "true" : "false", e.target.checked ? "true" : "false",
); );
}; };
const { setIsOpen } = useModalState((state) => state);
const handleClickQr = () => {
setObjectToEdit(objectToEdit);
setIsOpen(ModalEnum?.QUESTION_QR);
};
const contentSetting = ( const contentSetting = (
<div> <div>
@ -71,6 +81,7 @@ const FormContainer = ({
return ( return (
<div className="QuestionPractical"> <div className="QuestionPractical">
<header> <header>
<MdOutlineArrowForwardIos onClick={handleNavigateToPage} />{" "} <MdOutlineArrowForwardIos onClick={handleNavigateToPage} />{" "}
{t("header.edit_question")} {t("header.edit_question")}
@ -93,8 +104,13 @@ const FormContainer = ({
{t("practical.edit")} {t("models.exercise")}{" "} {t("practical.edit")} {t("models.exercise")}{" "}
</div> </div>
<div className="SettingEdit"> <div className="SettingEdit">
{objectToEdit &&(<>
<QrCodeModels ModelEnum={ModalEnum?.QUESTION_QR} />
<BsQrCode onClick={handleClickQr} size={22} style={{ color: "#A098AE" }} />
</>)}
<Popover trigger="click" content={contentSetting}> <Popover trigger="click" content={contentSetting}>
<SettingFilled /> <SettingFilled />
</Popover> </Popover>
<div>{t("header.exercise")}</div> <div>{t("header.exercise")}</div>
</div> </div>