@ -6,7 +6,8 @@ import '@dckj/react-better-modal/dist/index.css';
import LexicalEditor from '@/components/LexicalEditor' ;
import { $getRoot , $getSelection , } from 'lexical' ;
import { $generateHtmlFromNodes } from '@lexical/html' ;
import { $generateHtmlFromNodes , $generateNodesFromDOM } from '@lexical/html' ;
import { isEmpty } from '@/utils/commons' ;
/ / i m p o r t { A u t o F o c u s P l u g i n } f r o m ' @ l e x i c a l / r e a c t / L e x i c a l A u t o F o c u s P l u g i n ' ;
/ / i m p o r t { L e x i c a l C o m p o s e r } f r o m ' @ l e x i c a l / r e a c t / L e x i c a l C o m p o s e r ' ;
@ -26,7 +27,7 @@ import {$generateHtmlFromNodes} from '@lexical/html';
/ / f u n c t i o n o n E r r o r ( e r r o r ) {
/ / c o n s o l e . e r r o r ( e r r o r ) ;
/ / }
const EmailEditorPopup = ( { open , setOpen , fromEmail , reference , ... props } ) => {
const EmailEditorPopup = ( { open , setOpen , fromEmail , reference , quote = { } , ... props } ) => {
const [ form ] = Form . useForm ( ) ;
/ / c o n s t [ o p e n , s e t O p e n ] = u s e S t a t e ( f a l s e ) ;
@ -43,6 +44,7 @@ const EmailEditorPopup = ({ open, setOpen, fromEmail, reference, ...props }) =>
function onHandleCancel ( ) {
console . log ( 'onCancel callback' ) ;
form . resetFields ( ) ;
setOpen ( false ) ;
}
function onStageChange ( { state } ) {
@ -73,10 +75,10 @@ const EmailEditorPopup = ({ open, setOpen, fromEmail, reference, ...props }) =>
const onHandleSend = ( ) => {
console . log ( 'onSend callback' , '\nisRichText' , isRichText ) ;
console . log ( form . getFieldsValue ( ) )
/ / c o n s o l e . l o g ( f o r m . g e t F i e l d s V a l u e ( ) )
const body = structuredClone ( form . getFieldsValue ( ) ) ;
body . content = isRichText ? htmlContent : textContent ;
console . log ( 'body' , body )
/ / c o n s o l e . l o g ( ' b o d y ' , b o d y )
form
. validateFields ( )
. then ( ( values ) => { } )
@ -87,6 +89,58 @@ const EmailEditorPopup = ({ open, setOpen, fromEmail, reference, ...props }) =>
/ / s e t O p e n ( f a l s e ) ;
} ;
const [ initialForm , setInitialForm ] = useState ( { } ) ;
const [ initialContent , setInitialContent ] = useState ( '' ) ;
useEffect ( ( ) => {
if ( isEmpty ( quote ) ) {
return ( ) => { } ;
}
setShowCc ( ! isEmpty ( quote . cc ) ) ;
const { fromEmail , replyToEmail , subject , content } = quote ;
const preQuoteBody = ` <p class="editor-paragraph" dir="ltr"><br></p><p class="editor-paragraph" dir="ltr"><br>
< hr >
< p class = "editor-paragraph" dir = "ltr" >
< b >
< strong class = "editor-text-bold" style = "white-space: pre-wrap;" > From : < / strong >
< / b >
< span style = "white-space: pre-wrap;" > $ { quote . fromName } & lt ; $ { quote . fromEmail } & gt ; < / span >
< / p >
< p class = "editor-paragraph" dir = "ltr" >
< b >
< strong class = "editor-text-bold" style = "white-space: pre-wrap;" > Sent : < / strong >
< / b >
< span style = "white-space: pre-wrap;" > $ { quote . sent } < / span >
< / p >
< p class = "editor-paragraph" dir = "ltr" >
< b >
< strong class = "editor-text-bold" style = "white-space: pre-wrap;" > To : < / strong >
< / b >
< span style = "white-space: pre-wrap;" > $ { quote . toName } & lt ; $ { quote . toEmail } & gt ; < / span >
< / p >
< p class = "editor-paragraph" dir = "ltr" >
< b >
< strong class = "editor-text-bold" style = "white-space: pre-wrap;" > Subject : < / strong >
< / b >
< span style = "white-space: pre-wrap;" > $ { subject } < / span >
< / p >
< p class = "editor-paragraph" dir = "ltr" > $ { content } < / p >
` ;
/ / < b l o c k q u o t e c l a s s = " e d i t o r - q u o t e " >
/ / < / b l o c k q u o t e >
setInitialContent ( preQuoteBody ) ;
const _formValues = {
to : replyToEmail || fromEmail ,
cc : quote . cc ,
subject : ` Re: ${ subject } ` ,
} ;
form . setFieldsValue ( _formValues ) ;
setInitialForm ( _formValues ) ;
return ( ) => { } ;
} , [ quote ] )
return (
< >
< Modal
@ -107,7 +161,7 @@ const EmailEditorPopup = ({ open, setOpen, fromEmail, reference, ...props }) =>
initialHeight = { 600 }
initialTop = { 74 }
initialLeft = { window . innerWidth - 700 }
title = { ` ${ reference ? '回复: ' : '写邮件: ' } ${ fromEmail || '' } ` }
title = { initialForm . subject || ` ${ reference ? '回复: ' : '写邮件: ' } ${ fromEmail || '' } ` }
minimizeButton = { < > < / > }
onMove = { onHandleMove }
onResize = { onHandleResize }
@ -132,7 +186,7 @@ const EmailEditorPopup = ({ open, setOpen, fromEmail, reference, ...props }) =>
name = 'conversation_filter_form'
size = 'small'
variant = { 'borderless' }
initialValues = { { } }
initialValues = { { } }
/ / o n F i n i s h = { ( ) = > { } }
className = '*:mb-2 *:border-b *:border-t-0 *:border-x-0 *:border-indigo-100 *:border-solid '
requiredMark = { false }
@ -179,7 +233,7 @@ const EmailEditorPopup = ({ open, setOpen, fromEmail, reference, ...props }) =>
< Input / >
< / Form.Item >
< / Form >
< LexicalEditor { ... { isRichText }} onChange = { handleEditorChange } / >
< LexicalEditor { ... { isRichText }} onChange = { handleEditorChange } initialValue = { initialContent } / >
< / Modal >
< / >
) ;
Lei OT
1 year ago
