From e8edfdadb561cd83bf6e1c3e00d55b8cc2aee6d5 Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期一, 17 十月 2022 17:57:34 +0800
Subject: [PATCH] 2022-10-17
---
src/menu/components/code/sandbox/editorcode/index.jsx | 40 +++++++++++++++++++++++++++-------------
1 files changed, 27 insertions(+), 13 deletions(-)
diff --git a/src/menu/components/code/sandbox/editorcode/index.jsx b/src/menu/components/code/sandbox/editorcode/index.jsx
index dc9923a..45acab3 100644
--- a/src/menu/components/code/sandbox/editorcode/index.jsx
+++ b/src/menu/components/code/sandbox/editorcode/index.jsx
@@ -1,10 +1,9 @@
import React, {Component} from 'react'
import PropTypes from 'prop-types'
import { is, fromJS } from 'immutable'
-import { Icon, Modal, Tabs } from 'antd'
+import { Modal, Tabs, message } from 'antd'
+import { FormOutlined } from '@ant-design/icons'
-import zhCN from '@/locales/zh-CN/model.js'
-import enUS from '@/locales/en-US/model.js'
import asyncComponent from '@/utils/asyncComponent'
import './index.scss'
@@ -18,10 +17,10 @@
}
state = {
- dict: localStorage.getItem('lang') !== 'en-US' ? zhCN : enUS,
visible: false,
html: '',
- css: ''
+ css: '',
+ js: ''
}
shouldComponentUpdate (nextProps, nextState) {
@@ -34,18 +33,19 @@
this.setState({
visible: true,
html: config.html || '',
- css: config.css || ''
+ css: config.css || '',
+ js: config.js || '',
})
}
verifySubmit = () => {
const { config } = this.props
- const { html, css } = this.state
+ const { html, css, js } = this.state
this.setState({
visible: false
})
- this.props.updateConfig({...config, html, css})
+ this.props.updateConfig({...config, html, css, js})
}
onHtmlChange = (val) => {
@@ -60,29 +60,43 @@
})
}
+ onJsChange = (val) => {
+ if (/document\.getElementsByTagName/g.test(val)) {
+ message.warning('涓洪槻姝唬鐮佸啿绐侊紝js涓笉鍙娇鐢╠ocument.getElementsByTagName鏂规硶!')
+ return
+ }
+
+ this.setState({
+ js: val
+ })
+ }
+
render () {
- const { visible, dict, html, css } = this.state
+ const { visible, html, css, js } = this.state
return (
<div style={{display: 'inline-block'}}>
- <Icon title="浠ｇ爜缂栬緫" style={{color: 'purple'}} type="form" onClick={() => this.trigger()} />
+ <FormOutlined title="浠ｇ爜缂栬緫" style={{color: 'purple'}} onClick={() => this.trigger()} />
<Modal
wrapClassName="popview-modal code-sand-box-code-editor"
title="鍐呭缂栬緫"
visible={visible}
width={950}
maskClosable={false}
- okText={dict['model.submit']}
+ okText="鎻愪氦"
onOk={this.verifySubmit}
onCancel={() => { this.setState({ visible: false }) }}
destroyOnClose
>
<Tabs>
<TabPane tab="HTML" key="HTML">
- <CodeMirror mode="text/xml" value={html} onChange={this.onHtmlChange} />
+ <CodeMirror mode="text/xml" theme="cobalt" value={html} onChange={this.onHtmlChange} />
</TabPane>
<TabPane tab="CSS" key="CSS">
- <CodeMirror mode="text/css" value={css} onChange={this.onCssChange} />
+ <CodeMirror mode="text/css" theme="cobalt" value={css} onChange={this.onCssChange} />
+ </TabPane>
+ <TabPane tab="JS" key="JS">
+ <CodeMirror mode="text/javascript" theme="cobalt" value={js} onChange={this.onJsChange} />
</TabPane>
</Tabs>
</Modal>
--
Gitblit v1.8.0