add switch For more than line in MML
This commit is contained in:
parent
5638be0664
commit
cbd3698b58
|
|
@ -1,10 +1,11 @@
|
|||
import { Modal } from "antd";
|
||||
import { Modal, Switch } from "antd";
|
||||
import TextArea from "antd/es/input/TextArea";
|
||||
import { useFormikContext } from "formik";
|
||||
import React, { useState } from "react";
|
||||
import { convertMathMLToLaTeX } from "../../utils/convertMathMLToLaTeX";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { toast } from "react-toastify";
|
||||
import ValidationField from "../ValidationField/ValidationField";
|
||||
|
||||
const AddLaTexModal = ({
|
||||
name,
|
||||
|
|
@ -22,19 +23,27 @@ const AddLaTexModal = ({
|
|||
setCurrentValue: (value: string) => void;
|
||||
}) => {
|
||||
const { values, setFieldValue, getFieldProps } = useFormikContext<any>();
|
||||
const [isSwitchActive,setIsSwitchActive] = useState(false)
|
||||
|
||||
const onChange = (checked: boolean) => {
|
||||
setIsSwitchActive(checked)
|
||||
};
|
||||
|
||||
const currentValue = getFieldProps(name).value;
|
||||
const handleOk = () => {
|
||||
const oldValue = currentValue ?? "";
|
||||
const newLatex = convertMathMLToLaTeX(Latex)
|
||||
const final = oldValue + " $$ " + newLatex + " $$ "
|
||||
const final = oldValue + (isSwitchActive ? " $$$ " + newLatex + " $$$ " : " $$ " + newLatex + " $$ ")
|
||||
setFieldValue(name, final);
|
||||
setCurrentValue(final);
|
||||
setLatex("");
|
||||
setIsSwitchActive(false)
|
||||
setIsModalOpen(false);
|
||||
|
||||
};
|
||||
|
||||
const handleCancel = () => {
|
||||
setIsSwitchActive(false)
|
||||
setIsModalOpen(false);
|
||||
setLatex("");
|
||||
};
|
||||
|
|
@ -65,6 +74,11 @@ const AddLaTexModal = ({
|
|||
onChange={handleChangeInputLatex}
|
||||
value={Latex}
|
||||
/>
|
||||
<div>
|
||||
|
||||
<Switch id="switch" value={isSwitchActive} onChange={onChange} />
|
||||
<label className="mb-3 "style={{cursor:"pointer"}} htmlFor="switch"> {t("input.moreThanOneLine")} </label>
|
||||
</div>
|
||||
<div className="buttons">
|
||||
<div className="back_button pointer" onClick={handleCancel}>
|
||||
{t("practical.cancel")}
|
||||
|
|
|
|||
|
|
@ -8,12 +8,14 @@ interface TextPart {
|
|||
export const parseTextAndLatex = (input: string = ""): TextPart[] => {
|
||||
const out: TextPart[] = [];
|
||||
|
||||
const parts = input.split(/(\$\$[\s\S]+?\$\$|<<img>>[\s\S]+?<<img>>)/g);
|
||||
const parts = input.split(/(\$\$\$[\s\S]+?\$\$\$|\$\$[\s\S]+?\$\$|<<img>>[\s\S]+?<<img>>)/g);
|
||||
|
||||
parts.forEach((part, index) => {
|
||||
if (!part) return;
|
||||
|
||||
if (part.startsWith("$$") && part.endsWith("$$")) {
|
||||
if (part.startsWith("$$$") && part.endsWith("$$$")) {
|
||||
out.push({ text: part.slice(3, -3), isLatex: true, isImage: false, key: index });
|
||||
}else if (part.startsWith("$$") && part.endsWith("$$")) {
|
||||
out.push({ text: part.slice(2, -2), isLatex: true, isImage: false, key: index });
|
||||
} else if (part.startsWith("<<img>>") && part.endsWith("<<img>>")) {
|
||||
const url = part.slice("<<img>>".length, -"<<img>>".length).trim();
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user