ui: 对富文本的纯文件消息进行显示优化

* 唉太难弄了, 那边距可太恐怖了
This commit is contained in:
CrescentLeaf
2025-10-24 21:21:12 +08:00
parent 5e5436b02c
commit 50e3e21634
2 changed files with 19 additions and 6 deletions

View File

@@ -44,6 +44,17 @@ export default function Message({ userId, rawData, renderHTML, message, openUser
const [isDropDownOpen, setDropDownOpen] = React.useState(false) const [isDropDownOpen, setDropDownOpen] = React.useState(false)
const [isUsingFullDisplay, setIsUsingFullDisplay] = React.useState(false)
React.useEffect(() => {
const text = $(dropDownRef.current as HTMLElement).find('#msg').text().trim()
console.log(renderHTML)
setIsUsingFullDisplay(text == '' || (
rawData.split("tws:\/\/file\?hash=").length == 2
&& /\<\/chat\-(file|image|video)\>(\<\/span\>)?$/.test(renderHTML.trim())
))
}, [renderHTML])
return ( return (
<div <div
slot="trigger" slot="trigger"
@@ -112,10 +123,12 @@ export default function Message({ userId, rawData, renderHTML, message, openUser
minWidth: "0%", minWidth: "0%",
[isAtRight ? "marginRight" : "marginLeft"]: "55px", [isAtRight ? "marginRight" : "marginLeft"]: "55px",
marginTop: "-5px", marginTop: "-5px",
padding: "15px", padding: isUsingFullDisplay ? undefined : "13px",
paddingTop: isUsingFullDisplay ? undefined : "14px",
alignSelf: isAtRight ? "flex-end" : "flex-start", alignSelf: isAtRight ? "flex-end" : "flex-start",
backgroundColor: isUsingFullDisplay ? "inherit" : undefined
}}> }}>
<mdui-dialog close-on-overlay-click close-on-esc fullscreen ref={messageJsonDialogRef}> <mdui-dialog close-on-overlay-click close-on-esc ref={messageJsonDialogRef}>
{ {
// @ts-ignore 这是可以正常工作的 // @ts-ignore 这是可以正常工作的
<ReactJson src={message} /> <ReactJson src={message} />

View File

@@ -11,10 +11,10 @@ export default function SystemMessage({ children }: React.HTMLAttributes<HTMLEle
<mdui-card variant="filled" <mdui-card variant="filled"
style={{ style={{
alignSelf: 'center', alignSelf: 'center',
paddingTop: '9px', paddingTop: '8px',
paddingBottom: '9px', paddingBottom: '8px',
paddingLeft: '18px', paddingLeft: '17px',
paddingRight: '18px', paddingRight: '17px',
fontSize: '92%', fontSize: '92%',
}}> }}>
{children} {children}