feat(VideoPlayer): 隐藏 logo 功能
- 添加 hideLogo 的 useMemo 计算,根据 localStorage 的值决定是否隐藏 logo - 修改 logo 渲染逻辑,根据 hideLogo 的值确定是否显示- 更新视频资源路径,从 assets 改为 public
This commit is contained in:
parent
f6bd08da49
commit
d3a0b05910
@ -149,7 +149,7 @@ export const Sidebar = ({
|
|||||||
const db = new PageAssitDatabase()
|
const db = new PageAssitDatabase()
|
||||||
const history = await db.getChatHistory(chat.id)
|
const history = await db.getChatHistory(chat.id)
|
||||||
setHistoryId(chat.id)
|
setHistoryId(chat.id)
|
||||||
setCurrentMessageId()
|
setCurrentMessageId("")
|
||||||
setHistory(formatToChatHistory(history))
|
setHistory(formatToChatHistory(history))
|
||||||
setMessages(formatToMessage(history))
|
setMessages(formatToMessage(history))
|
||||||
stopStreamingRequest()
|
stopStreamingRequest()
|
||||||
|
@ -1,5 +1,5 @@
|
|||||||
import React, { useEffect, useRef, useState } from "react"
|
import React, { useEffect, useMemo, useRef, useState } from "react"
|
||||||
import iodVideo from "@/assets/video.mp4"
|
import iodVideo from "@/public/video.mp4"
|
||||||
import { useOptionLayoutContext } from "@/components/Layouts/Layout.tsx"
|
import { useOptionLayoutContext } from "@/components/Layouts/Layout.tsx"
|
||||||
import {
|
import {
|
||||||
ExpandOutlined,
|
ExpandOutlined,
|
||||||
@ -313,6 +313,11 @@ const VideoPlayer = () => {
|
|||||||
// 计算进度条百分比
|
// 计算进度条百分比
|
||||||
const progressPercent = duration ? (currentTime / duration) * 100 : 0
|
const progressPercent = duration ? (currentTime / duration) * 100 : 0
|
||||||
|
|
||||||
|
// 是否隐藏logo
|
||||||
|
const hideLogo = useMemo(() => {
|
||||||
|
return localStorage.getItem("hideLogo") === "true"
|
||||||
|
}, [])
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
ref={containerRef}
|
ref={containerRef}
|
||||||
@ -345,12 +350,13 @@ const VideoPlayer = () => {
|
|||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
|
|
||||||
{/* 控制栏 - 使用与原始HTML相同的类名和行为 */}
|
{/* 控制栏 - 使用与原始HTML相同的类名和行为 */}
|
||||||
<div
|
<div
|
||||||
className={`absolute left-0 w-full bg-gradient-to-t from-black to-transparent p-4 transition-all duration-300 ease-in-out flex flex-col gap-2.5 ${showControls ? "bottom-0" : "-bottom-40"}`}>
|
className={`absolute left-0 w-full bg-gradient-to-t from-black to-transparent p-4 transition-all duration-300 ease-in-out flex flex-col gap-2.5 ${showControls ? "bottom-0" : "-bottom-40"}`}>
|
||||||
<div className="flex items-center justify-end gap-2 cursor-pointer" onClick={handleEnded}>
|
<div
|
||||||
{<img src={logo} alt="logo" className="w-8" />}
|
className="flex items-center justify-end gap-2 cursor-pointer"
|
||||||
|
onClick={handleEnded}>
|
||||||
|
{!hideLogo && <img src={logo} alt="logo" className="w-8" />}
|
||||||
<h2 className="text-xl font-bold text-white dark:text-zinc-300 mr-3">
|
<h2 className="text-xl font-bold text-white dark:text-zinc-300 mr-3">
|
||||||
<span className="text-[#d30100]">数联网</span>科创智能体
|
<span className="text-[#d30100]">数联网</span>科创智能体
|
||||||
</h2>
|
</h2>
|
||||||
@ -368,7 +374,7 @@ const VideoPlayer = () => {
|
|||||||
className="bg-transparent border-none text-white text-lg cursor-pointer p-1 rounded-full w-12 h-12 flex items-center justify-center hover:bg-white hover:bg-opacity-20 transition-colors"
|
className="bg-transparent border-none text-white text-lg cursor-pointer p-1 rounded-full w-12 h-12 flex items-center justify-center hover:bg-white hover:bg-opacity-20 transition-colors"
|
||||||
onClick={togglePlayPause}>
|
onClick={togglePlayPause}>
|
||||||
{isPlaying ? (
|
{isPlaying ? (
|
||||||
<PauseCircleOutlined className="text-2xl" />
|
<PauseCircleOutlined className="text-2xl" />
|
||||||
) : (
|
) : (
|
||||||
<PlayCircleOutlined className="text-2xl" />
|
<PlayCircleOutlined className="text-2xl" />
|
||||||
)}
|
)}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user