diff --git a/frontend/src/components/Terminal/splitUtils.ts b/frontend/src/components/Terminal/splitUtils.ts new file mode 100644 index 00000000..e136e005 --- /dev/null +++ b/frontend/src/components/Terminal/splitUtils.ts @@ -0,0 +1,42 @@ +/** + * Terminal 分屏相关工具函数 + */ +import type { LayoutOrientation } from './types'; +import { getHeightFromWidth } from '@/lib/screenUtils'; + +/** + * 根据容器尺寸和方向计算最小尺寸(像素) + * @param containerSize 容器尺寸(px) + * @param orientation 分割方向 + * @returns 最小尺寸(px) + */ +export const getMinSplitSize = (containerSize: number, orientation: LayoutOrientation): number => { + if (orientation === 'horizontal') { + // 左右分屏:最小宽度520px + return 520; + } else { + // 上下分屏:根据520px宽度和屏幕比例计算对应的高度 + return getHeightFromWidth(520); + } +}; + +/** + * 将像素最小值转换为百分比最小值 + * @param minPixels 最小像素值 + * @param containerSize 容器尺寸(px) + * @param totalPercent 两个分屏的总百分比 + * @returns 最小百分比 + */ +export const getMinSplitPercent = ( + minPixels: number, + containerSize: number, + totalPercent: number +): number => { + if (!containerSize) return totalPercent * 0.2; + + // 将像素转换为百分比 + const minPercent = (minPixels / containerSize) * totalPercent; + + // 确保不超过总量的50% + return Math.min(totalPercent * 0.5, minPercent); +}; diff --git a/frontend/src/lib/screenUtils.ts b/frontend/src/lib/screenUtils.ts new file mode 100644 index 00000000..e7c54837 --- /dev/null +++ b/frontend/src/lib/screenUtils.ts @@ -0,0 +1,23 @@ +/** + * 屏幕分辨率相关工具函数 + */ + +/** + * 获取屏幕分辨率比例(宽:高) + * @returns 高度与宽度的比例 (height / width) + */ +export const getScreenAspectRatio = (): number => { + const width = window.screen.width; + const height = window.screen.height; + return height / width; +}; + +/** + * 根据宽度和屏幕比例计算对应的高度 + * @param width 宽度(px) + * @returns 对应的高度(px) + */ +export const getHeightFromWidth = (width: number): number => { + const ratio = getScreenAspectRatio(); + return Math.round(width * ratio); +};