import React, {Component} from 'react'
|
import PropTypes from 'prop-types'
|
import { fromJS } from 'immutable'
|
|
import Utils from '@/utils/utils.js'
|
import ColumnForm from './columnform'
|
import asyncComponent from '@/utils/asyncComponent'
|
import MenuUtils from '@/utils/utils-custom.js'
|
// import './index.scss'
|
|
const EditTable = asyncComponent(() => import('@/templates/zshare/editTable'))
|
|
class SupNodes extends Component {
|
static propTpyes = {
|
card: PropTypes.object,
|
supNodes: PropTypes.array,
|
update: PropTypes.func
|
}
|
|
state = {
|
modules: [],
|
columns: [
|
{
|
title: '组件',
|
dataIndex: 'label',
|
editable: false,
|
width: '60%'
|
}
|
]
|
}
|
|
UNSAFE_componentWillMount() {
|
const { supNodes, card } = this.props
|
|
let modules = MenuUtils.getSupModules(window.GLOB.customMenu.components, card.uuid) || []
|
|
this.setState({
|
modules,
|
supNodes: fromJS(supNodes).toJS()
|
})
|
}
|
|
columnChange = (values) => {
|
const { supNodes } = this.state
|
values.uuid = Utils.getuuid()
|
let _nodes = [...supNodes, values]
|
|
this.setState({supNodes: _nodes})
|
this.props.update(_nodes)
|
}
|
|
changeColumns = (columns) => {
|
this.setState({supNodes: columns})
|
this.props.update(columns)
|
}
|
|
render() {
|
const { supNodes, columns, modules } = this.state
|
|
return (
|
<div style={{minHeight: '250px'}}>
|
<ColumnForm supNodes={supNodes} modules={modules} columnChange={this.columnChange}/>
|
<EditTable actions={['del']} data={supNodes} columns={columns} onChange={this.changeColumns}/>
|
</div>
|
)
|
}
|
}
|
|
export default SupNodes
|