This commit is contained in:
2026-07-01 11:32:41 +08:00
5 changed files with 202 additions and 97 deletions
@@ -0,0 +1,30 @@
# Debug Session: ratio-options-not-showing
## Session ID
ratio-options-not-showing
## Created
2026-07-01
## Symptom
用户反馈:GenerateConver.tsx 中比例选项(ratioOptions)不显示,控制台无报错。
## Hypotheses (待验证假设)
1. **H1**: `ratioOptions` 默认值未生效 - useState 初始化失败
2. **H2**: `getEngine()` 返回的 `data.engine.image` 不存在或为空数组,if 条件未进入
3. **H3**: 比例按钮渲染区域被父容器 CSS 隐藏(如 `display: none`, `visibility: hidden`, `overflow: hidden`
4. **H4**: `ratioOptions` 在某处被重置为空数组
5. **H5**: 组件条件渲染导致整个比例区域未挂载
## Evidence Points
- EP1: 检查 `ratioOptions` 初始值是否为 8 个元素的数组
- EP2: 检查 `getEngine()` 返回后 `data.engine.image` 是否存在
- EP3: 检查渲染区域父容器的 CSS 是否有隐藏属性
- EP4: 搜索代码中是否有 `setRatioOptions([])` 调用
## Status
[OPEN] - 调试中
## Log File
`trae-debug-log-ratio-options-not-showing.ndjson`
File diff suppressed because one or more lines are too long
+1 -1
View File
@@ -28,7 +28,7 @@
}
})();
</script>
<script type="module" crossorigin src="/assets/index-Cbav91yV.js"></script>
<script type="module" crossorigin src="/assets/index-C_zmnmex.js"></script>
<link rel="stylesheet" crossorigin href="/assets/index-BhPFzWLH.css">
</head>
<body>
+41 -1
View File
@@ -305,7 +305,47 @@ export async function getCreditRatios(): Promise<any[]> {
return api.get('/credits/ratios');
}
// 引擎配置
export async function getEngine(): Promise<any[]> {
export async function getEngine(): Promise<any> {
if (USE_MOCK) return {
engine: {
image: [
{
id: "0019e3dac0b795b925b",
name: "Seedream 5.0",
provider: "ark",
model_name: "doubao-seedream-5-0-260128",
supported_models: ["doubao-seedream-5-0-260128"],
supported_sizes: {
"2K": {
"1:1": "2048×2048",
"4:3": "2304×1728",
"3:4": "1728×2304",
"16:9": "2560×1440",
"9:16": "1600×2848",
"3:2": "2496×1664",
"2:3": "1664×2496",
"21:9": "3024×1296"
},
"4K": {
"1:1": "4096×4096",
"4:3": "4608×3456",
"3:4": "3520×4704",
"16:9": "5404×3040",
"9:16": "3040×5504",
"3:2": "4992×3328",
"2:3": "3328×4992",
"21:9": "6197×2656"
}
},
default_size: "2K",
priority: 10
}
],
video: [
{ id: 'mock', name: 'Seedance', provider: 'seedance', supportedRatios: ['16:9', '9:16', '1:1', '4:3', '3:4', '21:9'], supportedResolutions: ['480p', '720p', '1080p'], supportedDurations: [4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15] }
]
}
};
return api.get('/generation-ai/engines');
}
// ── Generation AI Tasks ────────────────────────────────────
+62 -27
View File
@@ -426,33 +426,9 @@ const AIChatPage: React.FC = () => {
setCountType(targetEngine.id);
}
}
})
.catch(() => {
});
getCreditRatios()
.then((data: any) => {
// console.log('积分', data);
setCreditRatios(data.video || []);
setCimage(data.image || []);
})
.catch((error) => {
});
calculateCredits().then((data: any) => {
// console.log('积分计算', data);
// 保存积分计算数据
setCreditCalculationData(data);
})
getgen_list(Pagebreak).then((data: any) => {
let mess_list = data.items
let total = data.total
setGen_list(mess_list)
setTotalnumber(total)
})
getParameters()
.then((data) => {
let supportedSizes = (data as any).items?.[0]?.supportedSizes || {};
let supportedResolutions = [];
let supportedSizes = (data as any).engine.image?.[0]?.supportedSizes || {};
let supportedResolutions = [];
let twokwidth = [];
let fourkwidth = [];
@@ -477,8 +453,67 @@ const AIChatPage: React.FC = () => {
{ value: '2K', label: '高清 2K' },
{ value: '4K', label: '超清 4K' },
]);
})
.catch(() => { });
.catch(() => {
});
// getCreditRatios()
// .then((data: any) => {
// // console.log('积分', data);
// setCreditRatios(data.video || []);
// setCimage(data.image || []);
// })
// .catch((error) => {
// });
calculateCredits().then((data: any) => {
// console.log('积分计算', data);
// 保存积分计算数据
setCreditCalculationData(data);
})
getgen_list(Pagebreak).then((data: any) => {
let mess_list = data.items
let total = data.total
setGen_list(mess_list)
setTotalnumber(total)
})
// getParameters()
// .then((data) => {
// let supportedSizes = (data as any).items?.[0]?.supportedSizes || {};
// let supportedResolutions = [];
// let twokwidth = [];
// let fourkwidth = [];
// for (let key in supportedSizes["2K"]) {
// supportedResolutions.push(key);
// twokwidth.push(supportedSizes["2K"][key]);
// }
// const newRatioOptions = supportedResolutions.map((res: any, index: number) => ({
// value: res,
// label: String(index),
// }));
// setRatioOptions(newRatioOptions);
// for (let key in supportedSizes["4K"]) {
// fourkwidth.push(supportedSizes["4K"][key]);
// }
// const newWidthandHeight = [twokwidth, fourkwidth];
// setWidthandHeight(newWidthandHeight);
// setResolutionOptions([
// { value: '2K', label: '高清 2K' },
// { value: '4K', label: '超清 4K' },
// ]);
// })
// .catch(() => { });
}, []);