From 8f984c1eeadb0a5e263e6d5750716b0d1cff2906 Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期三, 20 一月 2021 18:40:09 +0800
Subject: [PATCH] 2021-01-20
---
src/menu/components/code/sandbox/editorcode/index.jsx | 42 +++++++++++++++++++++++++++---------------
1 files changed, 27 insertions(+), 15 deletions(-)
diff --git a/src/menu/components/code/sandbox/editorcode/index.jsx b/src/menu/components/code/sandbox/editorcode/index.jsx
index 69ad361..dc9923a 100644
--- a/src/menu/components/code/sandbox/editorcode/index.jsx
+++ b/src/menu/components/code/sandbox/editorcode/index.jsx
@@ -1,7 +1,7 @@
import React, {Component} from 'react'
import PropTypes from 'prop-types'
import { is, fromJS } from 'immutable'
-import { Icon, Modal } from 'antd'
+import { Icon, Modal, Tabs } from 'antd'
import zhCN from '@/locales/zh-CN/model.js'
import enUS from '@/locales/en-US/model.js'
@@ -9,6 +9,7 @@
import './index.scss'
const CodeMirror = asyncComponent(() => import('@/templates/zshare/codemirror'))
+const { TabPane } = Tabs
class DataSource extends Component {
static propTpyes = {
@@ -19,7 +20,8 @@
state = {
dict: localStorage.getItem('lang') !== 'en-US' ? zhCN : enUS,
visible: false,
- html: null
+ html: '',
+ css: ''
}
shouldComponentUpdate (nextProps, nextState) {
@@ -31,38 +33,41 @@
this.setState({
visible: true,
- html: config.html || null
+ html: config.html || '',
+ css: config.css || ''
})
}
verifySubmit = () => {
const { config } = this.props
- const { html } = this.state
+ const { html, css } = this.state
this.setState({
visible: false
})
- this.props.updateConfig({...config, html})
+ this.props.updateConfig({...config, html, css})
}
- onChange = (val) => {
+ onHtmlChange = (val) => {
this.setState({
html: val
})
}
- render () {
- const { config } = this.props
- const { visible, dict, html } = this.state
+ onCssChange = (val) => {
+ this.setState({
+ css: val
+ })
+ }
- if (!config) return null
+ render () {
+ const { visible, dict, html, css } = this.state
return (
- <div className="model-menu-edit-content-wrap">
- {config.wrap.datatype === 'static' ? <Icon title="鍐呭缂栬緫" type="form" onClick={() => this.trigger()} /> : null}
- {config.wrap.datatype !== 'static' ? <Icon title="鍐呭缂栬緫" style={{color: '#eeeeee', cursor: 'not-allowed'}} type="form"/> : null}
+ <div style={{display: 'inline-block'}}>
+ <Icon title="浠ｇ爜缂栬緫" style={{color: 'purple'}} type="form" onClick={() => this.trigger()} />
<Modal
- wrapClassName="popview-modal model-menu-edit-content-form"
+ wrapClassName="popview-modal code-sand-box-code-editor"
title="鍐呭缂栬緫"
visible={visible}
width={950}
@@ -72,7 +77,14 @@
onCancel={() => { this.setState({ visible: false }) }}
destroyOnClose
>
- <CodeMirror value={html} onChange={this.onChange} />
+ <Tabs>
+ <TabPane tab="HTML" key="HTML">
+ <CodeMirror mode="text/xml" value={html} onChange={this.onHtmlChange} />
+ </TabPane>
+ <TabPane tab="CSS" key="CSS">
+ <CodeMirror mode="text/css" value={css} onChange={this.onCssChange} />
+ </TabPane>
+ </Tabs>
</Modal>
</div>
)
--
Gitblit v1.8.0