|
|
|
@ -1,22 +1,10 @@
|
|
|
|
|
import { Empty, Skeleton, Divider, Flex, Button } from 'antd'
|
|
|
|
|
import { Conditional } from '@/components/Conditional'
|
|
|
|
|
import { isEmpty, isNotEmpty } from '@/utils/commons'
|
|
|
|
|
|
|
|
|
|
const decodeHtml = (text) => {
|
|
|
|
|
|
|
|
|
|
if (isEmpty(text)) return
|
|
|
|
|
|
|
|
|
|
const temp = document.createElement('div')
|
|
|
|
|
temp.innerHTML = text
|
|
|
|
|
|
|
|
|
|
return temp.innerText || temp.textContent
|
|
|
|
|
}
|
|
|
|
|
import { isNotEmpty } from '@/utils/commons'
|
|
|
|
|
|
|
|
|
|
const HtmlPreview = (props) => {
|
|
|
|
|
const { loading = false, value } = props
|
|
|
|
|
|
|
|
|
|
const html = decodeHtml(value)
|
|
|
|
|
|
|
|
|
|
if (loading) {
|
|
|
|
|
return <Skeleton className='p-6' active />
|
|
|
|
|
}
|
|
|
|
@ -24,10 +12,9 @@ const HtmlPreview = (props) => {
|
|
|
|
|
return (
|
|
|
|
|
<div className='border-solid border rounded border-gray-300'>
|
|
|
|
|
<Conditional
|
|
|
|
|
condition={isNotEmpty(html)}
|
|
|
|
|
condition={isNotEmpty(value)}
|
|
|
|
|
whenTrue={
|
|
|
|
|
<pre className='whitespace-pre-wrap break-words ps-6 pe-6'>
|
|
|
|
|
{html}
|
|
|
|
|
<pre className='whitespace-pre-wrap break-words ps-6 pe-6' dangerouslySetInnerHTML={{__html:value}}>
|
|
|
|
|
</pre>
|
|
|
|
|
}
|
|
|
|
|
whenFalse={<Empty className='p-6' description={false} />}
|
|
|
|
|