1
This commit is contained in:
parent
cd650f56f5
commit
15ebbab10a
@ -220,7 +220,63 @@ const DeploymentConfigModal: React.FC<DeploymentConfigModalProps> = ({
|
|||||||
{/* 富文本编辑器字段 */}
|
{/* 富文本编辑器字段 */}
|
||||||
{Object.entries(selectedTemplate.buildVariablesSchema.properties)
|
{Object.entries(selectedTemplate.buildVariablesSchema.properties)
|
||||||
.filter(([_, property]) => property.editorConfig)
|
.filter(([_, property]) => property.editorConfig)
|
||||||
.map(([key, property]) => (
|
.map(([key, property]) => {
|
||||||
|
const isFullscreen = fullscreenEditor?.key === key;
|
||||||
|
const editorConfig = property.editorConfig;
|
||||||
|
|
||||||
|
const editor = (
|
||||||
|
<Editor
|
||||||
|
height={isFullscreen ? "calc(100vh - 55px)" : "300px"}
|
||||||
|
defaultLanguage={editorConfig.language || 'shell'}
|
||||||
|
theme={editorConfig.theme || 'vs-dark'}
|
||||||
|
value={buildVariables[key] || property.default || ''}
|
||||||
|
onChange={(value) => handleEditorChange(key, value)}
|
||||||
|
options={{
|
||||||
|
minimap: { enabled: isFullscreen ? true : (editorConfig.minimap ?? false) },
|
||||||
|
fontSize: editorConfig.fontSize || 14,
|
||||||
|
lineNumbers: editorConfig.lineNumbers ? 'on' : 'off',
|
||||||
|
wordWrap: editorConfig.wordWrap ? 'on' : 'off',
|
||||||
|
tabSize: editorConfig.tabSize || 2,
|
||||||
|
scrollBeyondLastLine: false,
|
||||||
|
automaticLayout: true,
|
||||||
|
folding: editorConfig.folding ?? true,
|
||||||
|
autoClosingBrackets: 'always',
|
||||||
|
autoClosingQuotes: 'always',
|
||||||
|
formatOnPaste: true,
|
||||||
|
formatOnType: true,
|
||||||
|
suggestOnTriggerCharacters: editorConfig.autoComplete ?? true,
|
||||||
|
renderWhitespace: 'boundary',
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
);
|
||||||
|
|
||||||
|
return isFullscreen ? (
|
||||||
|
<Modal
|
||||||
|
key={key}
|
||||||
|
title={property.title || key}
|
||||||
|
open={true}
|
||||||
|
onCancel={() => setFullscreenEditor(null)}
|
||||||
|
footer={null}
|
||||||
|
width="100vw"
|
||||||
|
styles={{
|
||||||
|
body: { padding: 0 },
|
||||||
|
mask: { backgroundColor: 'rgba(0, 0, 0, 0.65)' },
|
||||||
|
content: {
|
||||||
|
position: 'fixed',
|
||||||
|
top: 0,
|
||||||
|
left: 0,
|
||||||
|
right: 0,
|
||||||
|
bottom: 0,
|
||||||
|
margin: 0,
|
||||||
|
padding: 0,
|
||||||
|
width: '100vw',
|
||||||
|
height: '100vh'
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{editor}
|
||||||
|
</Modal>
|
||||||
|
) : (
|
||||||
<Form.Item
|
<Form.Item
|
||||||
key={key}
|
key={key}
|
||||||
label={
|
label={
|
||||||
@ -239,31 +295,10 @@ const DeploymentConfigModal: React.FC<DeploymentConfigModalProps> = ({
|
|||||||
required={selectedTemplate.buildVariablesSchema.required?.includes(key)}
|
required={selectedTemplate.buildVariablesSchema.required?.includes(key)}
|
||||||
tooltip={property.description}
|
tooltip={property.description}
|
||||||
>
|
>
|
||||||
<Editor
|
{editor}
|
||||||
height="300px"
|
|
||||||
defaultLanguage={property.editorConfig.language || 'shell'}
|
|
||||||
theme={property.editorConfig.theme || 'vs-dark'}
|
|
||||||
value={buildVariables[key] || property.default || ''}
|
|
||||||
onChange={(value) => handleEditorChange(key, value)}
|
|
||||||
options={{
|
|
||||||
minimap: { enabled: property.editorConfig.minimap ?? false },
|
|
||||||
fontSize: property.editorConfig.fontSize || 14,
|
|
||||||
lineNumbers: property.editorConfig.lineNumbers ? 'on' : 'off',
|
|
||||||
wordWrap: property.editorConfig.wordWrap ? 'on' : 'off',
|
|
||||||
tabSize: property.editorConfig.tabSize || 2,
|
|
||||||
scrollBeyondLastLine: false,
|
|
||||||
automaticLayout: true,
|
|
||||||
folding: property.editorConfig.folding ?? true,
|
|
||||||
autoClosingBrackets: 'always',
|
|
||||||
autoClosingQuotes: 'always',
|
|
||||||
formatOnPaste: true,
|
|
||||||
formatOnType: true,
|
|
||||||
suggestOnTriggerCharacters: property.editorConfig.autoComplete ?? true,
|
|
||||||
renderWhitespace: 'boundary',
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</Form.Item>
|
</Form.Item>
|
||||||
))
|
);
|
||||||
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
{/* 普通字段 */}
|
{/* 普通字段 */}
|
||||||
@ -319,56 +354,6 @@ const DeploymentConfigModal: React.FC<DeploymentConfigModalProps> = ({
|
|||||||
</Form.Item>
|
</Form.Item>
|
||||||
</Form>
|
</Form>
|
||||||
</Modal>
|
</Modal>
|
||||||
|
|
||||||
{/* 全屏编辑器模态框 */}
|
|
||||||
{fullscreenEditor && selectedTemplate?.buildVariablesSchema?.properties && (
|
|
||||||
<Modal
|
|
||||||
title={fullscreenEditor.title}
|
|
||||||
open={true}
|
|
||||||
onCancel={() => setFullscreenEditor(null)}
|
|
||||||
footer={null}
|
|
||||||
width="100vw"
|
|
||||||
styles={{
|
|
||||||
body: { padding: 0 },
|
|
||||||
mask: { backgroundColor: 'rgba(0, 0, 0, 0.65)' },
|
|
||||||
content: {
|
|
||||||
position: 'fixed',
|
|
||||||
top: 0,
|
|
||||||
left: 0,
|
|
||||||
right: 0,
|
|
||||||
bottom: 0,
|
|
||||||
margin: 0,
|
|
||||||
padding: 0,
|
|
||||||
width: '100vw',
|
|
||||||
height: '100vh'
|
|
||||||
}
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<Editor
|
|
||||||
height="calc(100vh - 55px)"
|
|
||||||
defaultLanguage={selectedTemplate.buildVariablesSchema.properties[fullscreenEditor.key]?.editorConfig?.language || 'shell'}
|
|
||||||
theme="vs-dark"
|
|
||||||
value={buildVariables[fullscreenEditor.key] || ''}
|
|
||||||
onChange={(value) => handleEditorChange(fullscreenEditor.key, value)}
|
|
||||||
options={{
|
|
||||||
minimap: { enabled: true },
|
|
||||||
fontSize: 14,
|
|
||||||
lineNumbers: 'on',
|
|
||||||
wordWrap: 'on',
|
|
||||||
tabSize: 2,
|
|
||||||
scrollBeyondLastLine: false,
|
|
||||||
automaticLayout: true,
|
|
||||||
folding: true,
|
|
||||||
autoClosingBrackets: 'always',
|
|
||||||
autoClosingQuotes: 'always',
|
|
||||||
formatOnPaste: true,
|
|
||||||
formatOnType: true,
|
|
||||||
suggestOnTriggerCharacters: true,
|
|
||||||
renderWhitespace: 'boundary',
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</Modal>
|
|
||||||
)}
|
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user