From d3edd6d592db12fbec67e2700d168e07546aed29 Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期五, 15 十一月 2019 09:46:00 +0800
Subject: [PATCH] 2019-11-15
---
src/components/sidemenu/comtableconfig/index.jsx | 328 ++++++++++++++++++++++++++++++++++++++++++++----------
1 files changed, 264 insertions(+), 64 deletions(-)
diff --git a/src/components/sidemenu/comtableconfig/index.jsx b/src/components/sidemenu/comtableconfig/index.jsx
index 3fb2036..830cc59 100644
--- a/src/components/sidemenu/comtableconfig/index.jsx
+++ b/src/components/sidemenu/comtableconfig/index.jsx
@@ -3,33 +3,40 @@
// import { is, fromJS } from 'immutable'
import { DndProvider } from 'react-dnd'
import HTML5Backend from 'react-dnd-html5-backend'
-import { Button, Card, Modal, Tabs } from 'antd'
+import { Button, Card, Modal, Collapse, Input, notification } from 'antd'
import DragElement from './dragelement'
import SourceElement from './dragelement/source'
+import Api from '@/api'
import SearchForm from './searchform'
import ActionForm from './actionform'
import ColumnForm from './columnform'
+import MenuForm from './menuform'
import zhCN from '@/locales/zh-CN/header.js'
import enUS from '@/locales/en-US/header.js'
import Utils from '@/utils/utils.js'
import './index.scss'
-const {TabPane} = Tabs
+const { Panel } = Collapse
+const { Search } = Input
const HeaderDict = (!localStorage.getItem('lang') || localStorage.getItem('lang') === 'zh-CN') ? zhCN : enUS
class ComTableConfig extends Component {
static propTpyes = {
- menuConfig: PropTypes.any,
- handleConfig: PropTypes.func
+ menu: PropTypes.any,
+ handleConfig: PropTypes.func,
+ supMenuList: PropTypes.array,
+ supMenu: PropTypes.object,
}
state = {
dict: HeaderDict,
config: null,
visible: false,
+ tableVisible: false,
+ addType: '',
+ menuformlist: null,
formlist: null,
formtemp: '',
- madalwidth: 520,
card: null,
searchloading: false,
actionloading: false,
@@ -47,10 +54,12 @@
setAll: 'false',
options: [],
dataSource: '',
+ linkField: '',
valueField: '',
valueText: '',
orderBy: '',
- orderType: 'asc'
+ orderType: 'asc',
+ display: 'dropdown'
}, {
id: 1,
uuid: Utils.getuuid(),
@@ -62,10 +71,12 @@
setAll: 'false',
options: [],
dataSource: '',
+ linkField: '',
valueField: '',
valueText: '',
orderBy: '',
- orderType: 'asc'
+ orderType: 'asc',
+ display: 'dropdown'
}, {
id: 2,
uuid: Utils.getuuid(),
@@ -77,47 +88,65 @@
setAll: 'false',
options: [],
dataSource: '',
+ linkField: '',
valueField: '',
valueText: '',
orderBy: '',
- orderType: 'asc'
+ orderType: 'asc',
+ display: 'dropdown'
}],
action: [{
id: 0,
uuid: Utils.getuuid(),
label: 'add',
+ intertype: 'inner',
+ interface: '',
func: '',
+ callbackFunc: '',
Ot: 'notRequired',
OpenType: 'pop',
+ pageTemplate: '',
icon: 'plus',
class: 'green'
}, {
id: 1,
uuid: Utils.getuuid(),
label: 'update',
+ intertype: 'inner',
+ interface: '',
func: '',
+ callbackFunc: '',
Ot: 'requiredSgl',
OpenType: 'pop',
+ pageTemplate: '',
icon: 'form',
class: 'purple'
}, {
id: 2,
uuid: Utils.getuuid(),
label: 'delete',
+ intertype: 'inner',
+ interface: '',
func: '',
+ callbackFunc: '',
Ot: 'required',
OpenType: 'prompt',
+ pageTemplate: '',
icon: 'delete',
class: 'red'
}, {
id: 3,
uuid: Utils.getuuid(),
label: 'freeze',
+ intertype: 'inner',
+ interface: '',
func: '',
+ callbackFunc: '',
Ot: 'requiredOnce',
OpenType: 'exec',
+ pageTemplate: '',
icon: '',
- class: ''
+ class: 'default'
}],
columns: [{
id: 0,
@@ -238,7 +267,6 @@
}
handleList = (list) => {
- console.log(list)
let config = this.state.config
this.setState({config: {...config, ...list}})
}
@@ -247,7 +275,6 @@
this.setState({
visible: true,
formtemp: 'search',
- madalwidth: 700,
card: card,
formlist: [
{
@@ -270,7 +297,7 @@
type: 'text',
key: 'initval',
label: this.state.dict['header.form.initval'],
- initVal: '',
+ initVal: card.initval,
required: false
},
{
@@ -286,6 +313,9 @@
MenuID: 'select',
text: this.state.dict['header.form.select']
}, {
+ MenuID: 'link',
+ text: this.state.dict['header.form.link']
+ }, {
MenuID: 'dateday',
text: this.state.dict['header.form.dateday']
}, {
@@ -298,6 +328,7 @@
key: 'resourceType',
label: this.state.dict['header.form.resourceType'],
initVal: card.resourceType,
+ required: true,
options: [{
MenuID: '0',
text: this.state.dict['header.form.custom']
@@ -337,6 +368,14 @@
},
{
type: 'text',
+ key: 'linkField',
+ label: this.state.dict['header.form.linkField'],
+ initVal: card.linkField,
+ required: true,
+ readonly: false
+ },
+ {
+ type: 'text',
key: 'valueField',
label: this.state.dict['header.form.valueField'],
initVal: card.valueField,
@@ -371,6 +410,20 @@
MenuID: 'desc',
text: this.state.dict['header.form.desc']
}]
+ },
+ {
+ type: 'select',
+ key: 'display',
+ label: this.state.dict['header.form.display'],
+ initVal: card.display,
+ required: true,
+ options: [{
+ MenuID: 'dropdown',
+ text: this.state.dict['header.form.dropdown']
+ }, {
+ MenuID: 'button',
+ text: this.state.dict['header.form.button']
+ }]
}
]
})
@@ -380,7 +433,6 @@
this.setState({
visible: true,
formtemp: 'action',
- madalwidth: 520,
card: card,
formlist: [
{
@@ -388,6 +440,62 @@
key: 'label',
label: this.state.dict['header.form.name'],
initVal: card.label,
+ required: true,
+ readonly: false
+ },
+ {
+ type: 'select',
+ key: 'OpenType',
+ label: this.state.dict['header.form.openType'],
+ initVal: card.OpenType,
+ required: true,
+ options: [{
+ MenuID: 'pop',
+ text: this.state.dict['header.form.pop']
+ }, {
+ MenuID: 'prompt',
+ text: this.state.dict['header.form.prompt']
+ }, {
+ MenuID: 'exec',
+ text: this.state.dict['header.form.exec']
+ }, {
+ MenuID: 'tab',
+ text: this.state.dict['header.form.tab']
+ }, {
+ MenuID: 'blank',
+ text: this.state.dict['header.form.blank']
+ }, {
+ MenuID: 'newpage',
+ text: this.state.dict['header.form.newpage']
+ }]
+ },
+ {
+ type: 'select',
+ key: 'pageTemplate',
+ label: this.state.dict['header.form.pageTemplate'],
+ initVal: card.pageTemplate,
+ required: true,
+ options: []
+ },
+ {
+ type: 'radio',
+ key: 'intertype',
+ label: this.state.dict['header.form.intertype'],
+ initVal: card.intertype,
+ required: true,
+ options: [{
+ MenuID: 'inner',
+ text: this.state.dict['header.form.interface.inner']
+ }, {
+ MenuID: 'outer',
+ text: this.state.dict['header.form.interface.outer']
+ }]
+ },
+ {
+ type: 'text',
+ key: 'interface',
+ label: this.state.dict['header.form.interface'],
+ initVal: card.interface,
required: true,
readonly: false
},
@@ -420,30 +528,12 @@
}]
},
{
- type: 'select',
- key: 'OpenType',
- label: this.state.dict['header.form.openType'],
- initVal: card.OpenType,
- required: true,
- options: [{
- MenuID: 'pop',
- text: this.state.dict['header.form.pop']
- }, {
- MenuID: 'prompt',
- text: this.state.dict['header.form.prompt']
- }, {
- MenuID: 'exec',
- text: this.state.dict['header.form.exec']
- }, {
- MenuID: 'tab',
- text: this.state.dict['header.form.tab']
- }, {
- MenuID: 'newpage',
- text: this.state.dict['header.form.newpage']
- }, {
- MenuID: 'blank',
- text: this.state.dict['header.form.blank']
- }]
+ type: 'text',
+ key: 'callbackFunc',
+ label: this.state.dict['header.form.callbackFunc'],
+ initVal: card.callbackFunc,
+ required: false,
+ readonly: false
},
{
type: 'select',
@@ -458,7 +548,7 @@
key: 'class',
label: this.state.dict['header.form.class'],
initVal: card.class,
- required: true,
+ required: false,
options: []
}
]
@@ -469,7 +559,6 @@
this.setState({
visible: true,
formtemp: 'columns',
- madalwidth: 520,
card: card,
formlist: [
{
@@ -505,7 +594,7 @@
}]
},
{
- type: 'select',
+ type: 'radio',
key: 'Hide',
label: this.state.dict['header.form.Hide'],
initVal: card.Hide,
@@ -545,6 +634,7 @@
handleSubmit = () => {
this.formRef.handleConfirm().then(res => {
+ console.log(res)
let _config = this.state.config
_config[res.type] = _config[res.type].map(item => {
if (item.uuid === res.values.uuid) {
@@ -598,24 +688,110 @@
}, 300)
}
+ changeTemplate = () => {
+ this.props.handleConfig('template')
+ }
+
submitConfig = () => {
- this.props.handleConfig()
+ this.menuformRef.handleConfirm().then(res => {
+ console.log(res)
+ })
+ // this.props.handleConfig('')
}
cancelConfig = () => {
- this.props.handleConfig()
+ this.props.handleConfig('')
+ }
+
+ queryField = (type, name) => {
+ if (!name) {
+ notification.warning({
+ top: 92,
+ message: '璇疯緭鍏ヨ〃鍚嶏紒',
+ duration: 10
+ })
+ return
+ }
+ if (type === 'search') {
+ Api.getSystemConfig({func: 'sPC_Get_MainMenu'}).then(res => {
+ if (res.status) {
+ this.setState({
+ tableVisible: true,
+ addType: type
+ })
+ } else {
+ notification.warning({
+ top: 92,
+ message: res.message,
+ duration: 10
+ })
+ }
+ })
+ }
+ }
+
+ addFieldSubmit = () => {
+ console.log(13)
+ }
+
+ cancelFieldSubmit = () => {
+ this.setState({
+ tableVisible: false,
+ addType: ''
+ })
}
UNSAFE_componentWillMount () {
- if (!this.props.menuConfig) {
- this.setState({
- config: JSON.parse(JSON.stringify((this.state.baseconfig)))
- })
+ let _config = ''
+ if (!this.props.menu.LongParam) {
+ _config = JSON.parse(JSON.stringify((this.state.baseconfig)))
} else {
- this.setState({
- config: this.props.menuConfig
- })
+ _config = this.props.menu.LongParam
}
+ this.setState({
+ config: _config,
+ menuformlist: [
+ {
+ type: 'select',
+ key: 'parentId',
+ label: this.state.dict['header.menu.supMenu'],
+ initVal: this.props.supMenu.MenuID,
+ required: true,
+ readonly: false,
+ options: this.props.supMenuList
+ },
+ {
+ type: 'text',
+ key: 'menuName',
+ label: this.state.dict['header.menu.menuName'],
+ initVal: this.props.menu.MenuName,
+ required: true,
+ readonly: false
+ },
+ {
+ type: 'text',
+ key: 'menuNo',
+ label: this.state.dict['header.menu.menuNo'],
+ initVal: this.props.menu.MenuNo,
+ required: true,
+ readonly: false
+ },
+ {
+ type: 'select',
+ key: 'opentype',
+ label: this.state.dict['header.menu.openType'],
+ initVal: this.props.menu.PageParam.OpenType,
+ required: true,
+ options: [{
+ MenuID: 'newtab',
+ text: this.state.dict['header.form.tab']
+ }, {
+ MenuID: 'newpage',
+ text: this.state.dict['header.form.newpage']
+ }]
+ }
+ ]
+ })
}
render () {
@@ -623,33 +799,43 @@
<div className="common-table-board">
<DndProvider backend={HTML5Backend}>
<div className="tools">
- <Tabs defaultActiveKey="1">
- <TabPane tab="鎼滅储" key="1">
- <ul className="search-element">
+ <Collapse accordion defaultActiveKey="0" bordered={false}>
+ <Panel header="鍩烘湰淇℃伅" key="0">
+ <MenuForm
+ dict={this.state.dict}
+ formlist={this.state.menuformlist}
+ wrappedComponentRef={(inst) => this.menuformRef = inst}
+ />
+ </Panel>
+ <Panel header="鎼滅储" key="1">
+ <Search placeholder="input table name." onSearch={value => this.queryField('search', value)} enterButton />
+ <div className="search-element">
{this.state.searchItems.map((item, index) => {
return (<SourceElement key={index} content={item}/>)
})}
- </ul>
- </TabPane>
- <TabPane tab="鎸夐挳" key="2">
- <ul className="search-element">
+ </div>
+ </Panel>
+ <Panel header="鎸夐挳" key="2">
+ <div className="search-element">
{this.state.actionItems.map((item, index) => {
return (<SourceElement key={index} content={item}/>)
})}
- </ul>
- </TabPane>
- <TabPane tab="鏄剧ず鍒�" key="3">
- <ul className="search-element">
+ </div>
+ </Panel>
+ <Panel header="鏄剧ず鍒�" key="3">
+ <Search placeholder="input table name." onSearch={value => this.queryField('column', value)} enterButton />
+ <div className="search-element">
{this.state.columnItems.map((item, index) => {
return (<SourceElement key={index} content={item}/>)
})}
- </ul>
- </TabPane>
- </Tabs>
+ </div>
+ </Panel>
+ </Collapse>
</div>
<div className="setting">
<Card title="椤甸潰閰嶇疆" bordered={false} extra={
<div>
+ <Button type="primary" onClick={this.changeTemplate}>{this.state.dict['header.menu.template.change']}</Button>
<Button type="primary" onClick={this.submitConfig}>{this.state.dict['header.submit']}</Button>
<Button onClick={this.cancelConfig}>{this.state.dict['header.cancel']}</Button>
</div>
@@ -659,6 +845,7 @@
<DragElement
list={this.state.config.search}
type="search"
+ placeholder={this.state.dict['header.form.search.placeholder']}
handleList={this.handleList}
handleMenu={this.handleSearch}
/>}
@@ -668,6 +855,7 @@
<DragElement
list={this.state.config.action}
type="action"
+ placeholder={this.state.dict['header.form.action.placeholder']}
handleList={this.handleList}
handleMenu={this.handleAction}
/>}
@@ -677,6 +865,7 @@
<DragElement
list={this.state.config.columns}
type="columns"
+ placeholder={this.state.dict['header.form.column.placeholder']}
handleList={this.handleList}
handleMenu={this.handleColumn}
/>}
@@ -687,7 +876,7 @@
<Modal
title={this.state.dict['header.edit']}
visible={this.state.visible}
- width={this.state.madalwidth}
+ width={700}
onCancel={this.handleCancel}
footer={null}
destroyOnClose
@@ -716,6 +905,17 @@
<Button type="primary" onClick={this.handleSubmit}>{this.state.dict['header.confirm']}</Button>
</div>
</Modal>
+ <Modal
+ title={this.state.dict['header.edit']}
+ visible={this.state.tableVisible}
+ width={'65vw'}
+ style={{minWidth: '900px', maxWidth: '1200px'}}
+ onOk={this.addFieldSubmit}
+ onCancel={this.cancelFieldSubmit}
+ destroyOnClose
+ >
+ {this.state.addType === 'search' && <div>djfiafadf</div>}
+ </Modal>
</div>
)
}
--
Gitblit v1.8.0