更新分享页面基础信息显示与隐藏

dev_na
alanpaine 2026-04-17 11:30:22 +08:00
parent 9480d0e4bf
commit b1fd9de87d
2 changed files with 75 additions and 58 deletions

View File

@ -15,6 +15,8 @@ import {
ShareAltOutlined, ShareAltOutlined,
TeamOutlined, TeamOutlined,
UserOutlined, UserOutlined,
DownOutlined,
UpOutlined,
} from "@ant-design/icons"; } from "@ant-design/icons";
import dayjs from "dayjs"; import dayjs from "dayjs";
import ReactMarkdown from "react-markdown"; import ReactMarkdown from "react-markdown";
@ -177,6 +179,7 @@ export default function MeetingPreview() {
const [audioCurrentTime, setAudioCurrentTime] = useState(0); const [audioCurrentTime, setAudioCurrentTime] = useState(0);
const [audioDuration, setAudioDuration] = useState(0); const [audioDuration, setAudioDuration] = useState(0);
const [audioPlaybackRate, setAudioPlaybackRate] = useState(1); const [audioPlaybackRate, setAudioPlaybackRate] = useState(1);
const [isMetricsExpanded, setIsMetricsExpanded] = useState(false);
const [isMobile, setIsMobile] = useState(() => const [isMobile, setIsMobile] = useState(() =>
typeof window !== "undefined" ? window.matchMedia("(max-width: 767px)").matches : false, typeof window !== "undefined" ? window.matchMedia("(max-width: 767px)").matches : false,
); );
@ -786,63 +789,77 @@ export default function MeetingPreview() {
</div> </div>
</div> </div>
<div className="meeting-preview-metrics"> <div style={{ display: isMetricsExpanded ? 'block' : 'none' }}>
<div className="meeting-preview-metric"> <div className="meeting-preview-metrics">
<span className="meeting-preview-metric-label">{TEXT.meetingTime}</span> <div className="meeting-preview-metric">
<span className="meeting-preview-metric-value"> <span className="meeting-preview-metric-label">{TEXT.meetingTime}</span>
{meeting.meetingTime ? dayjs(meeting.meetingTime).format("YYYY.MM.DD HH:mm") : TEXT.notSet} <span className="meeting-preview-metric-value">
</span> {meeting.meetingTime ? dayjs(meeting.meetingTime).format("YYYY.MM.DD HH:mm") : TEXT.notSet}
</div> </span>
<div className="meeting-preview-metric"> </div>
<span className="meeting-preview-metric-label">{TEXT.createdAt}</span> <div className="meeting-preview-metric">
<span className="meeting-preview-metric-value"> <span className="meeting-preview-metric-label">{TEXT.createdAt}</span>
{meeting.createdAt ? dayjs(meeting.createdAt).format("YYYY.MM.DD HH:mm") : TEXT.notSet} <span className="meeting-preview-metric-value">
</span> {meeting.createdAt ? dayjs(meeting.createdAt).format("YYYY.MM.DD HH:mm") : TEXT.notSet}
</div> </span>
<div className="meeting-preview-metric"> </div>
<span className="meeting-preview-metric-label">{TEXT.creator}</span> <div className="meeting-preview-metric">
<span className="meeting-preview-metric-value">{meeting.creatorName || TEXT.notSet}</span> <span className="meeting-preview-metric-label">{TEXT.creator}</span>
</div> <span className="meeting-preview-metric-value">{meeting.creatorName || TEXT.notSet}</span>
<div className="meeting-preview-metric"> </div>
<span className="meeting-preview-metric-label">{TEXT.host}</span> <div className="meeting-preview-metric">
<span className="meeting-preview-metric-value">{meeting.hostName || TEXT.notSet}</span> <span className="meeting-preview-metric-label">{TEXT.host}</span>
</div> <span className="meeting-preview-metric-value">{meeting.hostName || TEXT.notSet}</span>
<div className="meeting-preview-metric"> </div>
<span className="meeting-preview-metric-label">{TEXT.participantsCount}</span> <div className="meeting-preview-metric">
<span className="meeting-preview-metric-value">{participantCountValue || TEXT.notFilled}</span> <span className="meeting-preview-metric-label">{TEXT.participantsCount}</span>
</div> <span className="meeting-preview-metric-value">{participantCountValue || TEXT.notFilled}</span>
<div className="meeting-preview-metric"> </div>
<span className="meeting-preview-metric-label"></span> <div className="meeting-preview-metric">
<span className="meeting-preview-metric-value">{meetingDuration > 0 ? formatDurationRange(0, meetingDuration).split(' - ')[1] : TEXT.noDuration}</span> <span className="meeting-preview-metric-label"></span>
<span className="meeting-preview-metric-value">{meetingDuration > 0 ? formatDurationRange(0, meetingDuration).split(' - ')[1] : TEXT.noDuration}</span>
</div>
</div> </div>
{participants.length > 0 ? (
<div className="meeting-preview-overview" style={{ marginTop: 20 }}>
<div className="meeting-preview-overview-label">{TEXT.participants}</div>
<div className="meeting-preview-tags">
{participants.map((item) => (
<span key={item} className="meeting-preview-tag">
<TeamOutlined style={{ marginRight: 8 }} />
{item}
</span>
))}
</div>
</div>
) : null}
{tags.length > 0 ? (
<div className="meeting-preview-overview" style={{ marginTop: participants.length > 0 ? 12 : 20 }}>
<div className="meeting-preview-overview-label">{TEXT.tags}</div>
<div className="meeting-preview-tags">
{tags.map((item) => (
<Tag key={item} bordered={false} className="meeting-preview-tag">
{item}
</Tag>
))}
</div>
</div>
) : null}
</div> </div>
{participants.length > 0 ? ( <div style={{ textAlign: 'center', marginTop: 12 }}>
<div className="meeting-preview-overview" style={{ marginTop: 20 }}> <Button
<div className="meeting-preview-overview-label">{TEXT.participants}</div> type="text"
<div className="meeting-preview-tags"> block
{participants.map((item) => ( onClick={() => setIsMetricsExpanded(!isMetricsExpanded)}
<span key={item} className="meeting-preview-tag"> style={{ color: 'var(--preview-muted)', height: 40, backgroundColor: 'rgba(0, 0, 0, 0.02)' }}
<TeamOutlined style={{ marginRight: 8 }} /> icon={isMetricsExpanded ? <UpOutlined /> : <DownOutlined />}
{item} >
</span> {isMetricsExpanded ? '收起基础信息' : '展开基础信息'}
))} </Button>
</div> </div>
</div>
) : null}
{tags.length > 0 ? (
<div className="meeting-preview-overview" style={{ marginTop: participants.length > 0 ? 12 : 20 }}>
<div className="meeting-preview-overview-label">{TEXT.tags}</div>
<div className="meeting-preview-tags">
{tags.map((item) => (
<Tag key={item} bordered={false} className="meeting-preview-tag">
{item}
</Tag>
))}
</div>
</div>
) : null}
</section> </section>
<div className="meeting-preview-panels"> <div className="meeting-preview-panels">

View File

@ -14,11 +14,11 @@ export default defineConfig({
server: { server: {
port: 5174, port: 5174,
proxy: { proxy: {
"/auth": "http://10.100.52.13:8081", "/auth": "http://10.100.51.199:8080",
"/sys": "http://10.100.52.13:8081", "/sys": "http://10.100.51.199:8080",
"/api": "http://10.100.52.13:8081", "/api": "http://10.100.51.199:8080",
"/ws": { "/ws": {
target: "ws://10.100.52.13:8081", target: "ws://10.100.51.199:8080",
ws: true ws: true
} }
} }