xueteng/video-flow-b
1
0
Fork 0
forked from 77media/video-flow
Code Pull Requests Activity

优化顶部导航栏和媒体查看器，添加完成状态标签，调整按钮样式

Browse Source
This commit is contained in:
北枳 2025-08-31 02:11:43 +08:00
parent 64bd73db29
commit 787529fa18
4 changed files with 28 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
components/layout/top-bar.tsx
View File

@ -207,7 +207,7 @@ export function TopBar({ collapsed }: { collapsed: boolean }) {
</div>
{isLogin ? (
<div className="flex items-center space-x-4">
<div className="flex items-center space-x-2">
{/* Pricing Link */}
{pathname === "/" ? (
<div
@ -263,6 +263,7 @@ export function TopBar({ collapsed }: { collapsed: boolean }) {
data-alt="user-menu-trigger"
style={{
background: "unset !important",
padding: "unset !important",
}}
>
<div className="h-10 w-10 rounded-full bg-[#C73BFF] flex items-center justify-center text-white font-semibold">
@ -320,7 +321,7 @@ export function TopBar({ collapsed }: { collapsed: boolean }) {
</div>
{/* 操作按钮区域 */}
<div className="flex-1 flex flex-row justify-center items-end space-x-2 pb-2">
<div className="flex-1 flex flex-row justify-center items-end">
<button
className="flex-1 bg-transparent border border-white/30 text-white text-xs py-0.5 h-6 rounded hover:bg-white/10 transition-colors"
onClick={() => {

17
components/pages/work-flow/media-viewer.tsx
View File

@ -349,6 +349,21 @@ export const MediaViewer = React.memo(function MediaViewer({
{memoizedFinalVideoElement}
</motion.div>
{/* 完成状态标签 */}
<motion.div
initial={{ opacity: 0, y: -20 }}
animate={{ opacity: 1, y: 0 }}
transition={{ delay: 0.8, duration: 0.6 }}
className="absolute top-4 left-4 z-20"
>
<div className="px-3 py-1.5 rounded-lg bg-white/10 backdrop-blur-md border border-white/20 shadow-lg">
<div className="flex items-center gap-2">
<div className="w-2 h-2 rounded-full bg-emerald-500"></div>
<span className="text-sm font-medium text-white">completed</span>
</div>
</div>
</motion.div>
{/* 操作按钮组 */}
{/* <AnimatePresence>
<motion.div
@ -467,7 +482,7 @@ export const MediaViewer = React.memo(function MediaViewer({
}}>
{/* 添加到chat去编辑 按钮 */}
<Tooltip placement="top" title="Edit video with chat">
<GlassIconButton icon={Video} size='sm' text="Edit with chat" onClick={() => {
<GlassIconButton icon={Edit3} size='sm' onClick={() => {
const currentVideo = taskObject.videos.data[currentSketchIndex];
if (currentVideo && currentVideo.urls && currentVideo.urls.length > 0 && setVideoPreview) {
setVideoPreview(currentVideo.urls[0], currentVideo.video_id);

12
components/pages/work-flow/task-info.tsx
View File

@ -249,17 +249,7 @@ export function TaskInfo({
/>
{currentLoadingText === 'Task completed' ? (
<motion.div
className="flex items-center gap-3 justify-center"
initial={{ opacity: 0, y: -10 }}
animate={{ opacity: 1, y: 0 }}
transition={{ duration: 0.5 }}
>
<div className="flex items-center gap-2">
<CheckCircle className="w-5 h-5 text-emerald-500" />
<span className="text-emerald-500 font-medium">{currentLoadingText}</span>
</div>
</motion.div>
<></>
) : (
<motion.div
className="flex items-center gap-2 justify-center"

15
components/pages/work-flow/use-workflow-data.tsx
View File

@ -114,15 +114,16 @@ export function useWorkflowData() {
}, [taskObject.currentStage]);
const generateEditPlan = useCallback(async () => {
// await getGenerateEditPlan({ project_id: episodeId });
window.open(`https://smartcut.huiying.video/ai-editor/${episodeId}?token=${token}&user_id=${useid}`, '_blank');
window.open(`https://smartcut.huiying.video/ai-editor/${episodeId}?token=${token}&user_id=${useid}`, '_target');
}, [episodeId]);
// useEffect(() => {
// if (!from && canGoToCut) {
// generateEditPlan();
// }
// }, [canGoToCut]);
useEffect(() => {
if (!from && canGoToCut && taskObject.status !== 'COMPLETED') {
getGenerateEditPlan({ project_id: episodeId }).then(() => {
generateEditPlan();
});
}
}, [canGoToCut, taskObject.status]);
useUpdateEffect(() => {