refactor: delete GreenScreenPanel.tsx (#1899 #1900)

This commit is contained in:
2026-09-14 20:43:33 +08:00
parent 7fd57e8fd1
commit edc68067e9
@@ -1,92 +0,0 @@
import React, { useCallback } from "react"
import { Drawer, Switch } from "antd"
import type { ChromaKeyConfig, ChromaKeyColorPreset } from "../types"
import { DEFAULT_CHROMA_KEY_CONFIG, CHROMA_KEY_PRESET_COLORS } from "../types"
import { GreenScreenPresets } from "./green-screen/GreenScreenPresets"
import { GreenScreenCustomColor } from "./green-screen/GreenScreenCustomColor"
import { GreenScreenSliders } from "./green-screen/GreenScreenSliders"
import { GreenScreenPreview } from "./green-screen/GreenScreenPreview"
interface GreenScreenPanelProps {
open: boolean
onClose: () => void
config: ChromaKeyConfig
onChange: (config: ChromaKeyConfig) => void
}
const GreenScreenPanel: React.FC<GreenScreenPanelProps> = ({ open, onClose, config, onChange }) => {
const update = useCallback(
(partial: Partial<ChromaKeyConfig>) => {
onChange({ ...config, ...partial })
},
[config, onChange],
)
const handleReset = useCallback(() => {
onChange({ ...DEFAULT_CHROMA_KEY_CONFIG, enabled: config.enabled })
}, [config.enabled, onChange])
const handlePresetSelect = useCallback(
(preset: ChromaKeyColorPreset) => {
update({
color_preset: preset,
color: CHROMA_KEY_PRESET_COLORS[preset],
})
},
[update],
)
const handleColorChange = useCallback(
(color: string) => {
update({ color })
},
[update],
)
return (
<Drawer
title="绿幕抠像"
placement="right"
width={420}
styles={{ wrapper: { maxWidth: "100vw" } }}
open={open}
onClose={onClose}
className="green-screen-panel-drawer"
>
<div className="green-header">
<span className="green-header-label">启用绿幕抠像</span>
<Switch
size="small"
checked={config.enabled}
onChange={(checked) => update({ enabled: checked })}
/>
</div>
<GreenScreenPresets
selectedPreset={config.color_preset}
onPresetSelect={handlePresetSelect}
/>
<GreenScreenCustomColor color={config.color} onColorChange={handleColorChange} />
<GreenScreenSliders
similarity={config.similarity}
blend={config.blend}
spill={config.spill}
onSimilarityChange={(v) => update({ similarity: v })}
onBlendChange={(v) => update({ blend: v })}
onSpillChange={(v) => update({ spill: v })}
/>
<GreenScreenPreview color={config.color} blend={config.blend} />
<div className="green-footer">
<button className="green-reset-btn" onClick={handleReset}>
重置参数
</button>
</div>
</Drawer>
)
}
export default GreenScreenPanel