|
|
@@ -1,4 +1,4 @@
|
|
|
-import { useRef, useState, useEffect } from 'react'
|
|
|
+import { useEffect } from 'react'
|
|
|
import MarkDown from 'react-markdown'
|
|
|
import styles from '@/pages/Hr/Notification/index.less'
|
|
|
import { Tag, Typography } from 'antd'
|
|
|
@@ -6,31 +6,27 @@ import { useIntl } from 'umi'
|
|
|
import 'vditor/src/assets/scss/index.scss'
|
|
|
|
|
|
const MessageDrawer = props => {
|
|
|
- const ref = useRef(null)
|
|
|
- const [tHeight, setTHeight] = useState(0)
|
|
|
const {
|
|
|
item: { title, createTime, content, msgType }
|
|
|
} = props
|
|
|
const intl = useIntl()
|
|
|
- useEffect(() => {
|
|
|
- if (ref?.current) {
|
|
|
- setTHeight(ref?.current.offsetTop)
|
|
|
- }
|
|
|
- }, [])
|
|
|
return (
|
|
|
- <div className="px-5 vditor-reset">
|
|
|
- <span className="pt-5 block">
|
|
|
- <Tag color="purple">{intl.formatMessage({ id: `component.globalHeader.${msgType}` })}</Tag>
|
|
|
- </span>
|
|
|
- <h1 className={['text-xl pr-6 mt-3', styles.NotificationCont].join(' ')}>{title}</h1>
|
|
|
- <span className="text-hex-aaa">{createTime}</span>
|
|
|
- <div className="w-22 h-[1px] bg-hex-ddd mt-3 mb-5 " />
|
|
|
+ <div className="px-5 vditor-reset h-full">
|
|
|
+ <div className="max-h-20vh">
|
|
|
+ <span className="pt-5 block">
|
|
|
+ <Tag color="purple">
|
|
|
+ {intl.formatMessage({ id: `component.globalHeader.${msgType}` })}
|
|
|
+ </Tag>
|
|
|
+ </span>
|
|
|
+ <h1 className={['text-xl pr-6 mt-3', styles.NotificationCont].join(' ')}>{title}</h1>
|
|
|
+ <span className="text-hex-aaa">{createTime}</span>
|
|
|
+ <div className="w-22 h-[1px] bg-hex-ddd mt-3 mb-5 " />
|
|
|
+ </div>
|
|
|
<div
|
|
|
- ref={ref}
|
|
|
- className={['py-3 px-4 bg-hex-f9f9f9 rounded-md boxShadow', styles.NotificationCont].join(
|
|
|
- ' '
|
|
|
- )}
|
|
|
- style={{ height: `calc(100vh - ${tHeight}px - 1.2rem)`, overflowY: 'auto' }}>
|
|
|
+ className={[
|
|
|
+ 'overflow-y-auto max-h-80vh py-3 px-4 bg-hex-f9f9f9 rounded-md boxShadow',
|
|
|
+ styles.NotificationCont
|
|
|
+ ].join(' ')}>
|
|
|
<Typography.Paragraph>
|
|
|
<MarkDown>{content}</MarkDown>
|
|
|
</Typography.Paragraph>
|