修复弹框日志样式

This commit is contained in:
hanhh 2021-07-26 00:56:53 +08:00
parent fd7153403d
commit c77e302874
4 changed files with 31 additions and 38 deletions

View File

@ -6,7 +6,6 @@ import {
Loading3QuartersOutlined, Loading3QuartersOutlined,
CheckCircleOutlined, CheckCircleOutlined,
} from '@ant-design/icons'; } from '@ant-design/icons';
import Editor from "@monaco-editor/react";
enum CrontabStatus { enum CrontabStatus {
'running', 'running',
@ -92,50 +91,40 @@ const CronLogModal = ({
setIsPhone(document.body.clientWidth < 768); setIsPhone(document.body.clientWidth < 768);
}, []); }, []);
useEffect(()=>{
const media = window.matchMedia('(prefers-color-scheme: dark)');
const storageTheme = localStorage.getItem('qinglong_dark_theme');
const isDark = (media.matches && storageTheme !== 'light') || storageTheme === 'dark';
setTheme(isDark?'vs-dark':'vs');
media.addEventListener('change',(e)=>{
if(storageTheme === 'auto' || !storageTheme){
if(e.matches){
setTheme('vs-dark')
}else{
setTheme('vs');
}
}
})
},[])
return ( return (
<Modal <Modal
title={titleElement()} title={titleElement()}
visible={visible} visible={visible}
centered centered
// bodyStyle={{ bodyStyle={{
// overflowY: 'auto', overflowY: 'auto',
// maxHeight: 'calc(80vh - var(--vh-offset, 0px))', maxHeight: 'calc(80vh - var(--vh-offset, 0px))',
// }} }}
forceRender forceRender
wrapClassName="log-modal"
onOk={() => cancel()} onOk={() => cancel()}
onCancel={() => cancel()} onCancel={() => cancel()}
> >
{!loading && value && ( {!loading && value && (
<Editor <pre
defaultLanguage="shell" style={
value={value} !isPhone
theme={theme} ? {
options={{ whiteSpace: 'break-spaces',
fontSize: 12, lineHeight: '17px',
minimap: {enabled: false}, marginBottom: 0,
lineNumbersMinChars: 3, }
folding: false, : {
whiteSpace: 'break-spaces',
lineHeight: '17px',
marginBottom: 0,
fontFamily: 'Source Code Pro', fontFamily: 'Source Code Pro',
glyphMargin: false width: 375,
}} zoom: 0.83,
/> }
}
>
{value}
</pre>
)} )}
</Modal> </Modal>
); );

View File

@ -91,7 +91,8 @@ const Crontab = () => {
lineNumbersMinChars: 3, lineNumbersMinChars: 3,
folding: false, folding: false,
glyphMargin: false, glyphMargin: false,
renderSideBySide: width==='100%' renderSideBySide: width==='100%',
wordWrap: 'on'
}} }}
theme={theme} theme={theme}
/> />

View File

@ -196,8 +196,10 @@ const Log = () => {
fontSize: 12, fontSize: 12,
minimap: {enabled: width==='100%'}, minimap: {enabled: width==='100%'},
lineNumbersMinChars: 3, lineNumbersMinChars: 3,
fontFamily: 'Source Code Pro',
folding: false, folding: false,
glyphMargin: false glyphMargin: false,
wordWrap: 'on'
}} }}
onChange={(val, ev) => {setValue(val as string)}} onChange={(val, ev) => {setValue(val as string)}}
/> />

View File

@ -172,7 +172,8 @@ const Script = () => {
minimap: {enabled: width==='100%'}, minimap: {enabled: width==='100%'},
lineNumbersMinChars: 3, lineNumbersMinChars: 3,
folding: false, folding: false,
glyphMargin: false glyphMargin: false,
wordWrap: 'on'
}} }}
onChange={(val) => {setValue(val as string)}} onChange={(val) => {setValue(val as string)}}
/> />