From 4c9741f851155a3ccbe7e1c1f36246575646d709 Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期一, 21 十一月 2022 15:54:05 +0800
Subject: [PATCH] 2022-11-21
---
src/menu/components/code/sandbox/index.jsx | 11 ++-
src/tabviews/custom/components/code/sand-box/index.jsx | 36 +++++++-----
src/menu/components/code/sandbox/codecontent/index.jsx | 76 +++++++++++--------------
src/menu/components/group/paste/index.jsx | 2
src/menu/components/share/copycomponent/index.jsx | 1
src/menu/components/share/markcomponent/index.jsx | 12 +++
src/menu/components/code/sandbox/options.jsx | 14 ++++
src/menu/components/tabs/paste/index.jsx | 2
src/menu/pastecontroller/index.jsx | 2
9 files changed, 90 insertions(+), 66 deletions(-)
diff --git a/src/menu/components/code/sandbox/codecontent/index.jsx b/src/menu/components/code/sandbox/codecontent/index.jsx
index 306fd59..42ff7c2 100644
--- a/src/menu/components/code/sandbox/codecontent/index.jsx
+++ b/src/menu/components/code/sandbox/codecontent/index.jsx
@@ -4,85 +4,77 @@
import './index.scss'
-class BraftContent extends Component {
+class CodeContent extends Component {
static propTpyes = {
- name: PropTypes.string,
- html: PropTypes.any,
- css: PropTypes.any,
- js: PropTypes.any,
+ config: PropTypes.object,
}
- state = {
- csselement: null
- }
+ state = {}
UNSAFE_componentWillMount () {
- const { css } = this.props
+ const { config } = this.props
- if (css) {
- // let style = css.replace(/^[^}{]*{|}[^}{]*{/ig, (word) => {
- // return word.replace(/}\n*/ig, `}\n#${mark}`).replace(/,/ig, `,#${mark} `)
- // })
- // style = `\n/* 鑷畾涔� */\n#${mark} ${style}\n`
-
+ if (config.css) {
+ let node = document.getElementById(config.uuid + 'style')
+ node && node.remove()
+
let ele = document.createElement('style')
- ele.innerHTML = css
+ ele.id = config.uuid + 'style'
+ ele.innerHTML = config.css
document.getElementsByTagName('head')[0].appendChild(ele)
- // document.getElementsByTagName('head')[0].prepend(ele)
-
- this.setState({csselement: ele})
}
}
componentDidMount () {
- const { js, name } = this.props
- if (js) {
+ const { config } = this.props
+ if (config.js && config.wrap.compileMode !== 'custom') {
try {
// eslint-disable-next-line no-eval
- eval(js)
+ eval(config.js)
} catch (e) {
- message.warning(name + 'JS 鎵ц澶辫触锛�')
+ message.warning(config.name + 'JS 鎵ц澶辫触锛�')
+ console.warn(config.name + e)
}
}
}
UNSAFE_componentWillReceiveProps(nextProps) {
- if (this.props.css !== nextProps.css) {
- const { csselement } = this.state
-
- if (csselement && csselement.remove) {
- csselement.remove()
- }
- if (nextProps.css) {
- let ele = document.createElement('style')
- ele.innerHTML = nextProps.css
- document.getElementsByTagName('head')[0].appendChild(ele)
+ const { config } = this.props
- this.setState({csselement: ele})
+ if (config.css !== nextProps.config.css) {
+ let node = document.getElementById(config.uuid + 'style')
+ node && node.remove()
+
+ if (nextProps.config.css) {
+ let ele = document.createElement('style')
+ ele.id = config.uuid + 'style'
+ ele.innerHTML = nextProps.config.css
+ document.getElementsByTagName('head')[0].appendChild(ele)
}
}
- if (this.props.html !== nextProps.html || this.props.js !== nextProps.js) {
- if (nextProps.js) {
+ if (config.html !== nextProps.config.html || config.js !== nextProps.config.js) {
+ if (nextProps.config.js && nextProps.config.wrap.compileMode !== 'custom') {
try {
// eslint-disable-next-line no-eval
- eval(nextProps.js)
+ eval(nextProps.config.js)
} catch (e) {
- message.warning(nextProps.name + 'JS 鎵ц澶辫触锛�')
+ message.warning(config.name + 'JS 鎵ц澶辫触锛�')
+ console.warn(config.name + e)
}
}
}
}
render() {
- const { html } = this.props
+ const { config } = this.props
- if (!html) return <Empty style={{padding: '10px 0px'}} description={null}/>
+ if (!config.html) return <Empty style={{padding: '10px 0px'}} description={null}/>
return (
- <div dangerouslySetInnerHTML={{ __html: html }}></div>
+ <div dangerouslySetInnerHTML={{ __html: config.html }}></div>
)
}
}
-export default BraftContent
\ No newline at end of file
+export default CodeContent
\ No newline at end of file
diff --git a/src/menu/components/code/sandbox/index.jsx b/src/menu/components/code/sandbox/index.jsx
index 53856d4..d633dd7 100644
--- a/src/menu/components/code/sandbox/index.jsx
+++ b/src/menu/components/code/sandbox/index.jsx
@@ -38,7 +38,7 @@
let _card = {
uuid: card.uuid,
type: card.type,
- format: 'object', // 缁勪欢灞炴�� - 鏁版嵁鏍煎紡
+ format: 'array', // 缁勪欢灞炴�� - 鏁版嵁鏍煎紡
pageable: false, // 缁勪欢灞炴�� - 鏄惁鍙垎椤�
switchable: false, // 缁勪欢灞炴�� - 鏁版嵁鏄惁鍙垏鎹�
width: card.width || 24,
@@ -71,8 +71,11 @@
this.updateComponent(_card)
} else {
+ let _card = fromJS(card).toJS()
+ _card.format = 'array'
+
this.setState({
- card: fromJS(card).toJS()
+ card: _card
})
}
}
@@ -168,7 +171,7 @@
<NormalForm title="鑷畾涔夌粍浠惰缃�" width={700} update={this.updateWrap} getForms={this.getWrapForms}>
<EditOutlined style={{color: '#1890ff'}} title="缂栬緫"/>
</NormalForm>
- <CopyComponent type="normaltable" card={card}/>
+ <CopyComponent type="sandbox" card={card}/>
<FontColorsOutlined className="style" title="璋冩暣鏍峰紡" onClick={this.changeStyle}/>
<UserComponent config={card}/>
<DeleteOutlined className="close" title="鍒犻櫎缁勪欢" onClick={() => this.props.deletecomponent(card.uuid)} />
@@ -179,7 +182,7 @@
} trigger="hover">
<ToolOutlined />
</Popover>
- <CodeContent name={card.name} html={card.html} css={card.css} js={card.js}/>
+ <CodeContent config={card}/>
<div className="component-name">
<div className="center">
<div className="title">{card.name}</div>
diff --git a/src/menu/components/code/sandbox/options.jsx b/src/menu/components/code/sandbox/options.jsx
index 6aab039..de03409 100644
--- a/src/menu/components/code/sandbox/options.jsx
+++ b/src/menu/components/code/sandbox/options.jsx
@@ -45,6 +45,20 @@
options: [
{value: 'dynamic', label: '鍔ㄦ��'},
{value: 'static', label: '闈欐��'},
+ ],
+ controlFields: [
+ {field: 'compileMode', values: ['dynamic']}
+ ]
+ },
+ {
+ type: 'radio',
+ field: 'compileMode',
+ label: '缂栬瘧鏂瑰紡',
+ initval: wrap.compileMode || 'replace',
+ required: false,
+ options: [
+ {value: 'replace', label: '瀛楁鏇挎崲'},
+ {value: 'custom', label: '鑷畾涔�'},
]
},
{
diff --git a/src/menu/components/group/paste/index.jsx b/src/menu/components/group/paste/index.jsx
index a7fd1b8..df04404 100644
--- a/src/menu/components/group/paste/index.jsx
+++ b/src/menu/components/group/paste/index.jsx
@@ -24,7 +24,7 @@
pasteSubmit = () => {
let appType = sessionStorage.getItem('appType')
- let options = ['datacard', 'propcard', 'balcony', 'timeline', 'simpleform', 'stepform', 'tabform', 'normaltable', 'tablecard', 'line', 'bar', 'pie', 'dashboard', 'scatter', 'chart']
+ let options = ['datacard', 'propcard', 'balcony', 'timeline', 'simpleform', 'stepform', 'tabform', 'normaltable', 'tablecard', 'line', 'bar', 'pie', 'dashboard', 'scatter', 'chart', 'sandbox']
let types = {
login: '鐧诲綍',
navbar: '瀵艰埅鏍�',
diff --git a/src/menu/components/share/copycomponent/index.jsx b/src/menu/components/share/copycomponent/index.jsx
index fea13ae..af234aa 100644
--- a/src/menu/components/share/copycomponent/index.jsx
+++ b/src/menu/components/share/copycomponent/index.jsx
@@ -48,6 +48,7 @@
_val = window.btoa(window.encodeURIComponent(JSON.stringify(_val)))
} catch (e) {
+ console.warn(e)
message.warning('澶嶅埗澶辫触锛岃閲嶈瘯锛�')
_val = ''
}
diff --git a/src/menu/components/share/markcomponent/index.jsx b/src/menu/components/share/markcomponent/index.jsx
index 6da49ef..50c608f 100644
--- a/src/menu/components/share/markcomponent/index.jsx
+++ b/src/menu/components/share/markcomponent/index.jsx
@@ -144,9 +144,13 @@
_columns.unshift({field: '$Index', label: '搴忓彿'})
let options = _columns.map(col => {
+ let label = col.label
+ if (col.label.toLowerCase() !== col.field.toLowerCase()) {
+ label += `锛�${col.field}锛塦
+ }
return {
value: col.field,
- label: col.label,
+ label: label,
isLeaf: false,
children: [
{
@@ -157,9 +161,13 @@
value: 'dynamic',
label: '鍔ㄦ�佸��',
children: _columns.map(cell => {
+ let _label = cell.label
+ if (cell.label.toLowerCase() !== cell.field.toLowerCase()) {
+ _label += `锛�${cell.field}锛塦
+ }
return {
value: cell.field,
- label: cell.label
+ label: _label
}
})
}
diff --git a/src/menu/components/tabs/paste/index.jsx b/src/menu/components/tabs/paste/index.jsx
index dad1a72..d8ae618 100644
--- a/src/menu/components/tabs/paste/index.jsx
+++ b/src/menu/components/tabs/paste/index.jsx
@@ -60,7 +60,7 @@
pasteSubmit = () => {
const { Tab } = this.props
let appType = sessionStorage.getItem('appType')
- let options = ['tabs', 'group', 'datacard', 'propcard', 'timeline', 'balcony', 'normaltable', 'mainsearch', 'simpleform', 'stepform', 'tabform', 'tablecard', 'line', 'bar', 'pie', 'dashboard', 'scatter', 'chart']
+ let options = ['tabs', 'group', 'datacard', 'propcard', 'timeline', 'balcony', 'normaltable', 'mainsearch', 'simpleform', 'stepform', 'tabform', 'tablecard', 'line', 'bar', 'pie', 'dashboard', 'scatter', 'chart', 'sandbox']
let types = {
login: '鐧诲綍',
navbar: '瀵艰埅鏍�',
diff --git a/src/menu/pastecontroller/index.jsx b/src/menu/pastecontroller/index.jsx
index d1d47fa..7c21f66 100644
--- a/src/menu/pastecontroller/index.jsx
+++ b/src/menu/pastecontroller/index.jsx
@@ -59,7 +59,7 @@
pasteSubmit = () => {
let appType = sessionStorage.getItem('appType')
- let options = ['tabs', 'timeline', 'datacard', 'propcard', 'mainsearch', 'simpleform', 'stepform', 'tabform', 'balcony', 'group', 'normaltable', 'tablecard', 'line', 'bar', 'pie', 'dashboard', 'scatter', 'iframe']
+ let options = ['tabs', 'timeline', 'datacard', 'propcard', 'mainsearch', 'simpleform', 'stepform', 'tabform', 'balcony', 'group', 'normaltable', 'tablecard', 'line', 'bar', 'pie', 'dashboard', 'scatter', 'iframe', 'sandbox']
if (appType === 'mob') {
options.push('menubar', 'topbar')
diff --git a/src/tabviews/custom/components/code/sand-box/index.jsx b/src/tabviews/custom/components/code/sand-box/index.jsx
index 4863e1f..2456f8b 100644
--- a/src/tabviews/custom/components/code/sand-box/index.jsx
+++ b/src/tabviews/custom/components/code/sand-box/index.jsx
@@ -48,15 +48,9 @@
if (_sync && data) {
_data = data[_config.dataName] || {}
- if (_data && Array.isArray(_data)) {
- _data = _data[0] || {}
- }
_sync = false
} else if (_sync && initdata) {
_data = initdata || {}
- if (_data && Array.isArray(_data)) {
- _data = _data[0] || {}
- }
_sync = false
}
} else {
@@ -64,7 +58,11 @@
}
if (_config.css) {
+ let node = document.getElementById(_config.uuid)
+ node && node.remove()
+
let ele = document.createElement('style')
+ ele.id = _config.uuid
ele.innerHTML = _config.css
document.getElementsByTagName('head')[0].appendChild(ele)
}
@@ -110,9 +108,6 @@
let _data = {}
if (nextProps.data && nextProps.data[config.dataName]) {
_data = nextProps.data[config.dataName]
- if (_data && Array.isArray(_data)) {
- _data = _data[0]
- }
}
this.setState({sync: false, data: _data}, () => {
@@ -167,7 +162,7 @@
let result = await Api.genericInterface(param)
if (result.status) {
- let _data = result.data && result.data[0] ? result.data[0] : {}
+ let _data = result.data || {}
this.setState({
data: _data,
@@ -192,23 +187,34 @@
const { html, js, wrap, columns } = this.state.config
let _html = html
- if (_html && wrap.datatype !== 'static') {
+ if (_html && wrap.datatype !== 'static' && wrap.compileMode !== 'custom') {
+ let _data = data
+ if (Array.isArray(_data)) {
+ _data = _data[0] || {}
+ }
columns.forEach(col => {
if (col.field) {
- let val = (data[col.field] || data[col.field] === 0) ? data[col.field] : ''
+ let val = (_data[col.field] || _data[col.field] === 0) ? _data[col.field] : ''
let reg = new RegExp('@' + col.field + '@', 'ig')
_html = _html.replace(reg, val)
}
})
}
+
this.setState({html: _html}, () => {
if (js) {
try {
- // eslint-disable-next-line no-eval
- eval(js)
+ if (wrap.compileMode !== 'custom') {
+ // eslint-disable-next-line no-eval
+ eval(js)
+ } else {
+ // eslint-disable-next-line
+ let evalfunc = eval('(true && function (data) {' + js + '})')
+ evalfunc(data)
+ }
} catch (e) {
- console.warn('JS 鎵ц澶辫触锛�')
+ console.warn(e)
}
}
})
--
Gitblit v1.8.0