import React, {Component} from 'react'
|
import PropTypes from 'prop-types'
|
import { connect } from 'react-redux'
|
import { is, fromJS } from 'immutable'
|
import { DndProvider } from 'react-dnd'
|
import HTML5Backend from 'react-dnd-html5-backend'
|
import { Button, Card, Modal, Collapse, notification, Spin, Icon, Switch, Tooltip, Row, Col, Tree } from 'antd'
|
import moment from 'moment'
|
|
import Api from '@/api'
|
import Utils from '@/utils/utils.js'
|
import zhCN from '@/locales/zh-CN/model.js'
|
import enUS from '@/locales/en-US/model.js'
|
import { getMainMenuForm } from '@/templates/zshare/formconfig'
|
|
import asyncComponent from '@/utils/asyncComponent'
|
|
import MenuForm from '@/templates/zshare/menuform'
|
import EditComponent from '@/templates/zshare/editcomponent'
|
import SourceElement from '@/templates/zshare/dragsource'
|
import Source from './source'
|
import './index.scss'
|
|
const { Panel } = Collapse
|
const { confirm } = Modal
|
const { TreeNode } = Tree
|
const TreeSettingComponent = asyncComponent(() => import('@/templates/sharecomponent/treesettingcomponent'))
|
const TabsComponent = asyncComponent(() => import('@/templates/sharecomponent/tabscomponent'))
|
|
class ComTableConfig extends Component {
|
static propTpyes = {
|
menu: PropTypes.any,
|
optionLibs: PropTypes.any,
|
reloadmenu: PropTypes.func,
|
handleView: PropTypes.func
|
}
|
|
state = {
|
dict: localStorage.getItem('lang') !== 'en-US' ? zhCN : enUS,
|
config: null, // 页面配置
|
menuformlist: null, // 基本信息表单字段
|
formlist: null, // 搜索条件、按钮、显示列表单字段
|
menuloading: false, // 菜单保存中
|
menucloseloading: false, // 菜单关闭时,选择保存
|
loading: false, // 加载中,页面spin
|
closeVisible: false, // 关闭模态框
|
tables: [], // 可用表名
|
originMenu: null, // 原始菜单
|
delTabs: [], // 删除标签列表
|
tabviews: [], // 所有标签页
|
optionLibs: null, // 自定义下拉选项库
|
activeKey: '0', // 默认展开基本信息
|
pasteContent: null, // 粘贴配置信息
|
openEdition: '' // 编辑版本标记,防止多人操作
|
}
|
|
/**
|
* @description 数据预处理
|
* 1、设置页面配置信息,新建或无配置信息时(切换模板后无配置信息),使用模板默认配置
|
* 2、设置操作类型、原始菜单信息(每次保存后重置)、已使用表及基本信息表单
|
*/
|
UNSAFE_componentWillMount () {
|
const { menu, optionLibs } = this.props
|
|
let _LongParam = menu.LongParam
|
let _config = ''
|
|
if (!_LongParam) {
|
_config = fromJS(Source.baseConfig).toJS()
|
_config.isAdd = true
|
} else {
|
_config = _LongParam
|
}
|
|
// 配置默认值,兼容
|
_config.Template = 'TreePage'
|
_config.easyCode = _config.easyCode || ''
|
|
if (_config.type === 'user') {
|
// 重置标签ID
|
_config.tabgroups.forEach(group => {
|
group.sublist = group.sublist.map(tab => {
|
tab.uuid = Utils.getuuid()
|
|
if (tab.linkTab) {
|
tab.linkTab = ''
|
}
|
|
return tab
|
})
|
})
|
}
|
|
this.setState({
|
config: _config,
|
openEdition: menu.open_edition || '',
|
activeKey: menu.activeKey || '0',
|
optionLibs: optionLibs,
|
originMenu: fromJS(menu).toJS(),
|
menuformlist: getMainMenuForm(menu, _config)
|
})
|
}
|
|
/**
|
* @description 加载完成后, 获取所有标签页信息
|
*/
|
componentDidMount () {
|
this.reloadTab(false)
|
}
|
|
/**
|
* @description 组件销毁,清除state更新
|
*/
|
componentWillUnmount () {
|
this.setState = () => {
|
return
|
}
|
}
|
|
/**
|
* @description 加载或刷新标签信息
|
*/
|
reloadTab = (type) => {
|
this.setState({
|
loading: type,
|
tabviews: []
|
})
|
Api.getSystemConfig({func: 'sPC_Get_UserTemp', TypeCharTwo: 'tab'}).then(res => {
|
if (res.status) {
|
this.setState({
|
loading: false,
|
tabviews: res.UserTemp.map(temp => {
|
return {
|
uuid: temp.MenuID,
|
value: temp.MenuID,
|
text: temp.MenuName,
|
type: temp.Template,
|
MenuNo: temp.MenuNo
|
}
|
})
|
})
|
|
if (type) {
|
notification.success({
|
top: 92,
|
message: '刷新成功。',
|
duration: 2
|
})
|
}
|
} else {
|
this.setState({
|
loading: false
|
})
|
notification.warning({
|
top: 92,
|
message: res.message,
|
duration: 5
|
})
|
}
|
})
|
}
|
|
getFuncNames = (data, funcNames, tableNames) => {
|
data.forEach(item => {
|
if (item.subfuncs) {
|
this.getFuncNames(item.subfuncs, funcNames, tableNames)
|
} else {
|
if (item.tableName) {
|
tableNames.push(item.tableName)
|
}
|
if (item.innerFunc) {
|
funcNames.push({func: item.innerFunc, label: item.label || ''})
|
}
|
|
if (item.callbackFunc) {
|
funcNames.push({func: item.callbackFunc, label: item.label || ''})
|
}
|
}
|
})
|
|
return {
|
func: funcNames,
|
table: tableNames
|
}
|
}
|
|
/**
|
* @description 三级菜单保存
|
*/
|
submitConfig = () => {
|
const { menu } = this.props
|
const { originMenu, delTabs, openEdition } = this.state
|
|
let config = fromJS(this.state.config).toJS()
|
|
this.menuformRef.handleConfirm().then(res => {
|
if (config.isAdd) {
|
config.tabgroups[0].sublist = config.tabgroups[0].sublist.filter(item => !item.origin)
|
}
|
|
if (config.type === 'user') { // 使用已有菜单时,默认添加关联标签id
|
config.tabgroups.forEach(group => {
|
group.sublist = group.sublist.map(tab => {
|
if (!tab.linkTab) {
|
tab.linkTab = Utils.getuuid()
|
}
|
return tab
|
})
|
})
|
}
|
|
let _LongParam = ''
|
let _config = {...config, easyCode: res.easyCode}
|
let _pageParam = {...menu.PageParam, OpenType: res.opentype}
|
|
// 未设置数据源或标签不合法时,启用状态为false
|
let vresult = this.verifyconfig(_config)
|
if (vresult !== true) {
|
_config.enabled = false
|
}
|
|
_config.funcs = [] // 页面及子页面存储过程集
|
|
_config.funcs.push({
|
type: 'view',
|
subtype: 'view',
|
uuid: menu.MenuID,
|
intertype: _config.setting.interType || 'inner',
|
interface: _config.setting.interface || '',
|
tableName: _config.setting.tableName || '',
|
innerFunc: _config.setting.innerFunc || '',
|
outerFunc: _config.setting.outerFunc || ''
|
})
|
|
_config.tabgroups.forEach(group => {
|
group.sublist.forEach(tab => {
|
_config.funcs.push({
|
type: 'tab',
|
subtype: 'tab',
|
uuid: tab.uuid,
|
label: tab.label,
|
linkTab: tab.linkTab
|
})
|
})
|
})
|
|
if (this.state.closeVisible) { // 显示关闭对话框时,模态框中保存按钮,显示保存中状态
|
this.setState({
|
menucloseloading: true
|
})
|
} else {
|
this.setState({
|
menuloading: true
|
})
|
}
|
|
new Promise(resolve => {
|
let deffers = []
|
_config.funcs.forEach(item => {
|
if (item.type === 'tab') {
|
let deffer = new Promise(resolve => {
|
Api.getSystemConfig({
|
func: 'sPC_Get_LongParam',
|
MenuID: item.linkTab
|
}).then(result => {
|
if (result.status && result.LongParam) {
|
let _LongParam = ''
|
|
if (result.LongParam) {
|
try {
|
_LongParam = JSON.parse(window.decodeURIComponent(window.atob(result.LongParam)))
|
} catch (e) {
|
console.warn('Parse Failure')
|
_LongParam = ''
|
}
|
}
|
|
if (_LongParam) {
|
item.menuNo = _LongParam.tabNo || ''
|
item.subfuncs = _LongParam.funcs || []
|
}
|
}
|
resolve()
|
})
|
})
|
|
deffers.push(deffer)
|
}
|
})
|
|
if (deffers.length === 0) {
|
resolve()
|
} else {
|
Promise.all(deffers).then(() => {
|
resolve()
|
})
|
}
|
}).then(() => {
|
// 保存时删除配置类型,system 、user
|
delete _config.type
|
delete _config.isAdd
|
|
try {
|
_LongParam = window.btoa(window.encodeURIComponent(JSON.stringify(_config)))
|
} catch (e) {
|
notification.warning({
|
top: 92,
|
message: '编译错误',
|
duration: 5
|
})
|
this.setState({
|
menucloseloading: false,
|
menuloading: false
|
})
|
return
|
}
|
|
let _sort = 0
|
let btntabs = []
|
|
let tabParam = { // 添加菜单tab页
|
func: 'sPC_sMenusTab_AddUpt',
|
MenuID: menu.MenuID
|
}
|
|
let _LText = []
|
|
btntabs.forEach(item => {
|
_LText.push(`select '${item.uuid}' as MenuID ,'${item.linkTab}' as Tabid,'${item.label}' as TabName ,'${item.sort * 10}' as Sort`)
|
})
|
_config.tabgroups.forEach(group => {
|
group.sublist.forEach(item => {
|
_sort++
|
_LText.push(`select '${menu.MenuID}' as MenuID ,'${item.linkTab}' as Tabid,'${item.label}' as TabName ,'${_sort * 10}' as Sort`)
|
})
|
})
|
|
_LText = _LText.join(' union all ')
|
|
tabParam.LText = Utils.formatOptions(_LText)
|
tabParam.timestamp = moment().format('YYYY-MM-DD HH:mm:ss') + '.000'
|
tabParam.secretkey = Utils.encrypt(tabParam.LText, tabParam.timestamp)
|
|
let _vals = this.getFuncNames(_config.funcs, [], [])
|
let _tables = Array.from(new Set(_vals.table))
|
|
let param = {
|
func: 'sPC_TrdMenu_AddUpt',
|
FstID: res.fstMenuId,
|
SndID: res.parentId,
|
ParentID: res.parentId,
|
MenuID: menu.MenuID,
|
MenuNo: res.MenuNo,
|
EasyCode: res.easyCode,
|
Template: menu.PageParam.Template || '',
|
MenuName: res.MenuName,
|
PageParam: JSON.stringify(_pageParam),
|
LongParam: _LongParam,
|
LText: _vals.func.map(item => `select '${menu.MenuID}' as MenuID,'${item.func}' as ProcName,'${item.label}' as MenuName`),
|
LTexttb: _tables.map(item => `select '${menu.MenuID}' as MenuID,'${item}' as tbName`)
|
}
|
|
if (menu.menuSort) { // 菜单新建时设置排序
|
param.Sort = menu.menuSort
|
}
|
|
param.LText = param.LText.join(' union all ')
|
param.LText = Utils.formatOptions(param.LText)
|
param.LTexttb = param.LTexttb.join(' union all ')
|
param.LTexttb = Utils.formatOptions(param.LTexttb)
|
param.timestamp = moment().format('YYYY-MM-DD HH:mm:ss') + '.000'
|
param.secretkey = Utils.encrypt(param.LText, param.timestamp)
|
|
if (openEdition) { // 版本管理
|
param.open_edition = openEdition
|
}
|
|
// 有按钮或标签删除时,先进行删除操作
|
// 删除成功后,保存页面配置
|
new Promise(resolve => {
|
if (delTabs.length > 0) {
|
let deffers = delTabs.map(item => {
|
let _param = {
|
func: 'sPC_MainMenu_Del',
|
MenuID: item.uuid
|
}
|
|
return new Promise(resolve => {
|
Api.getSystemConfig(_param).then(response => {
|
resolve(response)
|
})
|
})
|
})
|
Promise.all(deffers).then(result => {
|
let error = null
|
result.forEach(response => {
|
if (!response.status) {
|
error = response
|
}
|
})
|
|
if (error) {
|
this.setState({
|
menuloading: false,
|
menucloseloading: false
|
})
|
notification.warning({
|
top: 92,
|
message: error.message,
|
duration: 5
|
})
|
resolve(false)
|
} else {
|
this.setState({
|
delTabs: []
|
})
|
resolve(true)
|
}
|
})
|
} else if (delTabs.length === 0) {
|
resolve(true)
|
}
|
}).then(resp => {
|
if (resp === false) return
|
let localParam = fromJS(param).toJS()
|
|
Api.getSystemConfig(param).then(response => {
|
if (response.status) {
|
let _FMenu = originMenu.fstMenuList.filter(fstM => fstM.MenuID === res.fstMenuId)[0]
|
let _supMenuList = []
|
if (_FMenu) {
|
_supMenuList = _FMenu.options
|
}
|
|
this.setState({
|
config: _config,
|
openEdition: response.open_edition || '',
|
originMenu: {
|
...originMenu,
|
LongParam: _config,
|
PageParam: _pageParam,
|
MenuName: res.MenuName,
|
MenuNo: res.MenuNo,
|
ParentID: res.parentId,
|
fstMenuId: res.fstMenuId,
|
supMenuList: _supMenuList
|
}
|
})
|
|
this.props.reloadmenu()
|
|
// 存在标签页时
|
if (tabParam.LText) {
|
Api.getSystemConfig(tabParam).then(result => {
|
if (result.status) {
|
notification.success({
|
top: 92,
|
message: '保存成功',
|
duration: 2
|
})
|
if (this.state.closeVisible) {
|
this.props.handleView()
|
} else {
|
this.setState({
|
menuloading: false,
|
menucloseloading: false
|
})
|
}
|
} else {
|
notification.warning({
|
top: 92,
|
message: result.message,
|
duration: 5
|
})
|
this.setState({
|
menuloading: false,
|
menucloseloading: false
|
})
|
}
|
})
|
} else {
|
notification.success({
|
top: 92,
|
message: '保存成功',
|
duration: 2
|
})
|
if (this.state.closeVisible) {
|
this.props.handleView()
|
} else {
|
this.setState({
|
menuloading: false,
|
menucloseloading: false
|
})
|
}
|
}
|
|
localParam.func = 'sPC_TrdMenu_AddUpt_For_Local'
|
delete localParam.LongParam
|
delete localParam.PageParam
|
delete localParam.Template
|
delete localParam.Sort
|
delete localParam.EasyCode
|
delete localParam.open_edition
|
|
Api.getLocalConfig(localParam)
|
} else {
|
this.setState({
|
menuloading: false,
|
menucloseloading: false
|
})
|
notification.warning({
|
top: 92,
|
message: response.message,
|
duration: 5
|
})
|
}
|
})
|
})
|
})
|
}, () => {
|
notification.warning({
|
top: 92,
|
message: this.state.dict['model.menu.basemsg'],
|
duration: 5
|
})
|
})
|
}
|
|
/**
|
* @description 点击返回时,判断配置保存状态
|
*/
|
cancelConfig = () => {
|
const { menu } = this.props
|
const { config, originMenu } = this.state
|
|
let _this = this
|
|
if (config.isAdd) {
|
confirm({
|
content: '菜单尚未提交,确定放弃保存吗?',
|
okText: this.state.dict['model.confirm'],
|
cancelText: this.state.dict['model.cancel'],
|
onOk() {
|
_this.props.handleView()
|
},
|
onCancel() {}
|
})
|
} else {
|
this.menuformRef.handleConfirm().then(res => {
|
let _config = {...config, easyCode: res.easyCode}
|
let _pageParam = {...menu.PageParam, OpenType: res.opentype}
|
let _originMenu = {
|
...originMenu,
|
LongParam: _config,
|
PageParam: _pageParam,
|
MenuName: res.MenuName,
|
MenuNo: res.MenuNo,
|
ParentID: res.parentId,
|
fstMenuId: res.fstMenuId
|
}
|
|
if (!is(fromJS(originMenu), fromJS(_originMenu))) {
|
this.setState({
|
closeVisible: true
|
})
|
} else {
|
this.props.handleView()
|
}
|
}, () => {
|
this.setState({
|
closeVisible: true
|
})
|
})
|
}
|
}
|
|
/**
|
* @description 设置可配置按钮
|
*/
|
setSubConfig = (item, type) => {
|
const { menu } = this.props
|
const { config, originMenu, optionLibs, activeKey, openEdition } = this.state
|
|
if (!originMenu.MenuID) { // menuID不存在时,为新建菜单,提示菜单尚未保存
|
notification.warning({
|
top: 92,
|
message: this.state.dict['header.menu.config.notsave'],
|
duration: 5
|
})
|
} else {
|
this.menuformRef.handleConfirm().then(res => {
|
let _config = {...config, easyCode: res.easyCode}
|
let _pageParam = {...menu.PageParam, OpenType: res.opentype}
|
let _originMenu = {
|
...originMenu,
|
LongParam: _config,
|
PageParam: _pageParam,
|
MenuName: res.MenuName,
|
MenuNo: res.MenuNo,
|
ParentID: res.parentId,
|
fstMenuId: res.fstMenuId
|
}
|
|
if (!is(fromJS(originMenu), fromJS(_originMenu))) { // 菜单信息变化时,提示保存
|
notification.warning({
|
top: 92,
|
message: this.state.dict['header.menu.config.update'],
|
duration: 5
|
})
|
return
|
}
|
|
_originMenu.activeKey = activeKey // 保存当前打开页签
|
_originMenu.open_edition = openEdition // 更新版本号
|
|
let param = {
|
optionLibs: optionLibs,
|
editMenu: _originMenu,
|
editTab: item,
|
tabConfig: null,
|
editSubTab: null,
|
subTabConfig: null,
|
btnTab: null,
|
btnTabConfig: null,
|
editAction: null,
|
subConfig: '',
|
tabview: item.type
|
}
|
|
this.setState({
|
loading: true
|
})
|
|
Api.getSystemConfig({
|
func: 'sPC_Get_LongParam',
|
MenuID: item.linkTab
|
}).then(res => {
|
if (res.status) {
|
this.setState({
|
loading: false
|
})
|
let _LongParam = ''
|
if (res.LongParam) {
|
try {
|
_LongParam = JSON.parse(window.decodeURIComponent(window.atob(res.LongParam)))
|
} catch (e) {
|
console.warn('Parse Failure')
|
_LongParam = ''
|
}
|
}
|
|
if (_LongParam && param.tabview === 'SubTable' && _LongParam.Template === 'SubTable') {
|
param.subConfig = _LongParam
|
}
|
|
if (param.editTab) {
|
param.editTab.open_edition = res.open_edition || ''
|
}
|
|
this.props.handleView(param)
|
} else {
|
this.setState({
|
loading: false
|
})
|
notification.warning({
|
top: 92,
|
message: res.message,
|
duration: 5
|
})
|
}
|
})
|
}, () => {
|
notification.warning({
|
top: 92,
|
message: this.state.dict['header.menu.config.update'],
|
duration: 5
|
})
|
})
|
}
|
}
|
|
/**
|
* @description 页面启用停止切换
|
*/
|
onEnabledChange = () => {
|
const { config } = this.state
|
|
let _enabled = !config.enabled
|
let result = this.verifyconfig(config)
|
if (_enabled && result !== true) {
|
notification.warning({
|
top: 92,
|
message: result,
|
duration: 5
|
})
|
return
|
}
|
|
this.setState({
|
config: {...config, enabled: _enabled}
|
})
|
}
|
|
/**
|
* @description 校验配置信息的合法性
|
*/
|
verifyconfig = (config) => {
|
let tabinvalid = true
|
if (config.tabgroups.length > 1) {
|
config.tabgroups.forEach(group => {
|
if (group.sublist.length === 0) {
|
tabinvalid = false
|
}
|
})
|
}
|
|
if (!config.setting.tableName || !config.setting.valueField || !config.setting.labelField || !config.setting.parentField) {
|
return '请完善树形结构配置信息!'
|
} else if (!tabinvalid) {
|
return '菜单标签页设置错误(存在多行标签时,行标签不可为空)!'
|
} else {
|
return true
|
}
|
}
|
|
/**
|
* @description 选择不保存时,如有复制按钮,则删除
|
*/
|
notsave = () => {
|
this.props.handleView()
|
}
|
|
/**
|
* @description 编辑功能完成更新,包括解冻按钮、粘贴、替换等
|
*/
|
editConfig = (res) => {
|
if (res.type === 'paste') {
|
this.setState({
|
pasteContent: res.content
|
}, () => {
|
this.setState({
|
pasteContent: null
|
})
|
})
|
}
|
}
|
|
/**
|
* @description 更新标签配置信息
|
*/
|
updatetabs = (config, delcards) => {
|
const { delTabs } = this.state
|
|
this.setState({
|
config: config,
|
delTabs: delcards ? [...delTabs, ...delcards] : delTabs
|
})
|
}
|
|
/**
|
* @description 更新配置信息
|
*/
|
updateconfig = (config) => {
|
this.setState({
|
config: config
|
})
|
}
|
|
render () {
|
const { activeKey, config } = this.state
|
|
let configTabs = []
|
config.tabgroups.forEach(group => {
|
configTabs.push(...group.sublist)
|
})
|
|
return (
|
<div className="tree-page-board">
|
<DndProvider backend={HTML5Backend}>
|
{/* 工具栏 */}
|
<div className="tools">
|
<Collapse accordion defaultActiveKey={activeKey} bordered={false} onChange={(key) => this.setState({activeKey: key})}>
|
{/* 基本信息 */}
|
<Panel forceRender={true} header={this.state.dict['header.menu.basedata']} key="0" id="main-basedata">
|
{/* 菜单信息 */}
|
<MenuForm
|
dict={this.state.dict}
|
formlist={this.state.menuformlist}
|
wrappedComponentRef={(inst) => this.menuformRef = inst}
|
/>
|
</Panel>
|
{/* 添加标签 */}
|
<Panel header={this.state.dict['header.menu.tab']} key="4">
|
<div className="search-element">
|
{Source.tabItems.map((item, index) => {
|
return (<SourceElement key={index} content={item}/>)
|
})}
|
</div>
|
{configTabs.length > 0 ?
|
<p className="config-btn-title">
|
<Tooltip placement="topLeft" title="点击按钮,可完成或查看标签配置信息。">
|
<Icon type="question-circle" />
|
</Tooltip>
|
{this.state.dict['header.menu.tab.configurable']}
|
</p> : null
|
}
|
{configTabs.map((item, index) => {
|
return (
|
<div key={index}>
|
<Button
|
className="config-button"
|
icon={item.icon}
|
style={{marginBottom: '10px'}}
|
onClick={() => this.setSubConfig(item, 'tab')}
|
>{item.label}</Button>
|
</div>
|
)
|
})}
|
</Panel>
|
</Collapse>
|
</div>
|
<div className="setting">
|
<Card title={
|
<div>
|
{this.state.dict['header.menu.page.configurable']}
|
<Icon type="redo" style={{marginLeft: '10px'}} title="刷新标签列表" onClick={() => this.reloadTab(true)} />
|
</div>
|
} bordered={false} extra={
|
<div>
|
<EditComponent dict={this.state.dict} type="TreePage" config={this.state.config} MenuID={this.props.menu.MenuID} refresh={this.editConfig}/>
|
<Switch className="big" checkedChildren="启" unCheckedChildren="停" checked={this.state.config.enabled} onChange={this.onEnabledChange} />
|
<Button type="primary" onClick={this.submitConfig} loading={this.state.menuloading}>{this.state.dict['model.save']}</Button>
|
<Button onClick={this.cancelConfig}>{this.state.dict['model.back']}</Button>
|
</div>
|
} style={{ width: '100%' }}>
|
<Row gutter={16}>
|
<Col span={config.setting.width}>
|
<TreeSettingComponent
|
config={config}
|
MenuID={this.props.menu.MenuID}
|
menuformRef={this.menuformRef}
|
permFuncField={this.props.permFuncField}
|
updatesetting={this.updateconfig}
|
/>
|
<Card
|
className="tree-card"
|
title={
|
<span className="tree-title">
|
<span className="title">{config.setting.title}</span>
|
{config.setting.searchable !== 'false' ? <span className="ant-input-search ant-input-affix-wrapper"><span className="ant-input-suffix"><Icon type="search" /></span></span> : null}
|
</span>
|
}
|
bordered={false}
|
>
|
<div className="tree-box">
|
<Tree
|
defaultExpandAll={true}
|
blockNode
|
showIcon={config.setting.showIcon === 'true'}
|
showLine={config.setting.showLine === 'true'}
|
>
|
<TreeNode icon={<Icon type="folder-open" />} title="parent 0" key="0-0">
|
<TreeNode icon={<Icon type="file" />} title="leaf 0-0" key="0-0-0" isLeaf />
|
<TreeNode icon={<Icon type="file" />} title="leaf 0-1" key="0-0-1" isLeaf />
|
</TreeNode>
|
<TreeNode icon={<Icon type="folder-open" />} title="parent 1" key="0-1">
|
<TreeNode icon={<Icon type="file" />} title="leaf 1-0" key="0-1-0" isLeaf />
|
<TreeNode icon={<Icon type="file" />} title="leaf 1-1" key="0-1-1" isLeaf />
|
</TreeNode>
|
</Tree>
|
</div>
|
</Card>
|
</Col>
|
<Col span={24 - config.setting.width}>
|
{/* 标签组 */}
|
<TabsComponent
|
config={config}
|
tabs={this.state.tabviews}
|
setSubConfig={(item) => this.setSubConfig(item, 'tab')}
|
updatetabs={this.updatetabs}
|
/>
|
</Col>
|
</Row>
|
</Card>
|
</div>
|
</DndProvider>
|
{/* 返回时未保存提示 */}
|
<Modal
|
bodyStyle={{textAlign: 'center', color: '#000000', fontSize: '16px'}}
|
closable={false}
|
maskClosable={false}
|
visible={this.state.closeVisible}
|
onCancel={() => { this.setState({closeVisible: false}) }}
|
footer={[
|
<Button key="save" className="mk-btn mk-green" loading={this.state.menucloseloading} onClick={this.submitConfig}>{this.state.dict['model.save']}</Button>,
|
<Button key="notsave" className="mk-btn mk-yellow" onClick={this.notsave}>{this.state.dict['model.notsave']}</Button>,
|
<Button key="cancel" onClick={() => { this.setState({closeVisible: false}) }}>{this.state.dict['model.cancel']}</Button>
|
]}
|
destroyOnClose
|
>
|
{this.state.dict['header.menu.config.placeholder']}
|
</Modal>
|
{this.state.loading && <Spin size="large" />}
|
</div>
|
)
|
}
|
}
|
|
const mapStateToProps = (state) => {
|
return {
|
sysRoles: state.sysRoles,
|
permFuncField: state.permFuncField,
|
memberLevel: state.memberLevel
|
}
|
}
|
|
const mapDispatchToProps = () => {
|
return {}
|
}
|
|
export default connect(mapStateToProps, mapDispatchToProps)(ComTableConfig)
|