refactor: optimize header override copy and JSON example dialog

This commit is contained in:
Seefs
2026-03-10 01:59:34 +08:00
parent 6ff5a5dc99
commit c3b9ae5f3b

View File

@@ -163,7 +163,7 @@ const MODE_DESCRIPTIONS = {
prune_objects: '按条件清理对象中的子项',
pass_headers: '把指定请求头透传到上游请求',
sync_fields: '在一个字段有值、另一个缺失时自动补齐',
set_header: '设置运行期请求头(支持整值覆盖,或用 JSON 映射按逗号 token 替换/删除/追加/白名单保留',
set_header: '设置运行期请求头:可直接覆盖整条值,也可对逗号分隔的 token 做删除、替换、追加白名单保留',
delete_header: '删除运行期请求头',
copy_header: '复制请求头',
move_header: '移动请求头',
@@ -230,23 +230,29 @@ const getModeValueLabel = (mode) => {
return '值(支持 JSON 或普通文本)';
};
const HEADER_VALUE_JSONC_EXAMPLE = `{
// 置空:删除 Bedrock 不支持的 beta特性
"files-api-2025-04-14": null,
// 替换:把旧特性改成兼容特性
"advanced-tool-use-2025-11-20": "tool-search-tool-2025-10-19",
// 追加:在末尾补一个需要的特性
"$append": ["context-1m-2025-08-07"]
}`;
const getModeValuePlaceholder = (mode) => {
if (mode === 'set_header') {
return [
'String example:',
'纯字符串(整条覆盖):',
'Bearer sk-xxx',
'',
'JSON map example:',
'{"advanced-tool-use-2025-11-20": null, "computer-use-2025-01-24": "computer-use-2025-01-24"}',
'',
'JSON map wildcard:',
'{"*": null, "computer-use-2025-11-24": "computer-use-2025-11-24"}',
'',
'JSON append example:',
'{"$append": ["context-1m-2025-08-07"]}',
'',
'JSON strict keep example:',
'{"computer-use-2025-01-24": "computer-use-2025-01-24", "$append": ["context-1m-2025-08-07"], "$keep_only_declared": true}',
'或使用 JSON 规则:',
'{',
' "files-api-2025-04-14": null,',
' "advanced-tool-use-2025-11-20": "tool-search-tool-2025-10-19",',
' "$append": ["context-1m-2025-08-07"]',
'}',
].join('\n');
}
if (mode === 'pass_headers') return 'Authorization, X-Request-Id';
@@ -264,11 +270,6 @@ const getModeValuePlaceholder = (mode) => {
return '0.7';
};
const getModeValueHelp = (mode) => {
if (mode !== 'set_header') return '';
return '字符串整条请求头直接覆盖。JSON 映射:按逗号分隔 token 逐项处理null 表示删除string/array 表示替换,* 表示兜底规则,$append 可在末尾追加新 token$keep_only_declared=true 时会丢弃未声明 token。';
};
const SYNC_TARGET_TYPE_OPTIONS = [
{ label: '请求体字段', value: 'json' },
{ label: '请求头字段', value: 'header' },
@@ -1080,6 +1081,7 @@ const ParamOverrideEditorModal = ({ visible, value, onSave, onCancel }) => {
const [dragOverPosition, setDragOverPosition] = useState('before');
const [templateGroupKey, setTemplateGroupKey] = useState('basic');
const [templatePresetKey, setTemplatePresetKey] = useState('operations_default');
const [headerValueExampleVisible, setHeaderValueExampleVisible] = useState(false);
const [fieldGuideVisible, setFieldGuideVisible] = useState(false);
const [fieldGuideTarget, setFieldGuideTarget] = useState('path');
const [fieldGuideKeyword, setFieldGuideKeyword] = useState('');
@@ -1106,6 +1108,7 @@ const ParamOverrideEditorModal = ({ visible, value, onSave, onCancel }) => {
setTemplateGroupKey('basic');
setTemplatePresetKey('operations_default');
}
setHeaderValueExampleVisible(false);
setFieldGuideVisible(false);
setFieldGuideTarget('path');
setFieldGuideKeyword('');
@@ -2828,15 +2831,35 @@ const ParamOverrideEditorModal = ({ visible, value, onSave, onCancel }) => {
{t(getModeValueLabel(mode))}
</Text>
{mode === 'set_header' ? (
<Button
size='small'
type='tertiary'
onClick={formatSelectedOperationValueAsJson}
>
{t('格式化 JSON')}
</Button>
<Space spacing={6}>
<Button
size='small'
type='tertiary'
onClick={() =>
setHeaderValueExampleVisible(true)
}
>
{t('查看 JSON 示例')}
</Button>
<Button
size='small'
type='tertiary'
onClick={formatSelectedOperationValueAsJson}
>
{t('格式化 JSON')}
</Button>
</Space>
) : null}
</div>
{mode === 'set_header' ? (
<Text
type='tertiary'
size='small'
className='mt-1 mb-2 block'
>
{t('纯字符串会直接覆盖整条请求头,或者点击“查看 JSON 示例”按 token 规则处理。')}
</Text>
) : null}
<TextArea
value={selectedOperation.value_text}
autosize={{ minRows: 1, maxRows: 4 }}
@@ -2847,11 +2870,6 @@ const ParamOverrideEditorModal = ({ visible, value, onSave, onCancel }) => {
})
}
/>
{getModeValueHelp(mode) ? (
<Text type='tertiary' size='small'>
{t(getModeValueHelp(mode))}
</Text>
) : null}
</div>
)
) : null}
@@ -3307,6 +3325,27 @@ const ParamOverrideEditorModal = ({ visible, value, onSave, onCancel }) => {
</Space>
</Modal>
<Modal
title={t('anthropic-beta JSON 示例')}
visible={headerValueExampleVisible}
width={760}
footer={null}
onCancel={() => setHeaderValueExampleVisible(false)}
bodyStyle={{ padding: 16, paddingBottom: 24 }}
>
<Space vertical align='start' spacing={12} style={{ width: '100%' }}>
<Text type='tertiary' size='small'>
{t('下面是带注释的示例,仅用于参考;实际保存时请删除注释。')}
</Text>
<TextArea
value={HEADER_VALUE_JSONC_EXAMPLE}
readOnly
autosize={{ minRows: 16, maxRows: 20 }}
style={{ marginBottom: 8 }}
/>
</Space>
</Modal>
<Modal
title={null}
visible={fieldGuideVisible}