From 92108e6c93de657838bbd766a9eb4f27d85e1c2d Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期二, 05 五月 2020 16:41:28 +0800
Subject: [PATCH] 2020-05-05
---
src/templates/formtabconfig/index.jsx | 345 ++++++++-------------------------------------------------
1 files changed, 50 insertions(+), 295 deletions(-)
diff --git a/src/templates/formtabconfig/index.jsx b/src/templates/formtabconfig/index.jsx
index cd8d82f..5571f51 100644
--- a/src/templates/formtabconfig/index.jsx
+++ b/src/templates/formtabconfig/index.jsx
@@ -14,17 +14,17 @@
import { getModalForm, getActionForm } from '@/templates/zshare/formconfig'
import { queryTableSql } from '@/utils/option.js'
+import TabsComponent from '@/templates/sharecomponent/tabscomponent'
+
import ModalForm from '@/templates/zshare/modalform'
import PasteForm from '@/templates/zshare/pasteform'
import ActionForm from './actionform'
import SettingForm from './settingform'
import DragElement from './dragelement'
import GroupForm from './groupform'
-import TabForm from '@/templates/zshare/tabform'
import EditCard from '@/templates/zshare/editcard'
import VerifyCard from '@/templates/zshare/verifycard'
import MenuForm from '@/templates/zshare/menuform'
-import TabDragElement from '@/templates/zshare/tabdragelement'
import SourceElement from '@/templates/zshare/dragsource'
import CreateFunc from '@/templates/zshare/createfunc'
import Source from './source'
@@ -121,6 +121,24 @@
}
})
})
+ }
+
+ if (!_config.tabgroups) {
+ _config.tabgroups = [{ uuid: 'tabs', sublist: [] }]
+ } else if (typeof(_config.tabgroups[0]) === 'string') {
+ let _tabgroups = []
+ _config.tabgroups.forEach(groupId => {
+ let _group = {
+ uuid: groupId,
+ sublist: fromJS(_config[groupId]).toJS()
+ }
+
+ delete _config[groupId]
+
+ _tabgroups.push(_group)
+ })
+
+ _config.tabgroups = _tabgroups
}
if (menu && menu.LongParam && menu.LongParam.columns) {
@@ -348,15 +366,7 @@
handleList = (type, list, card, groupId, elementId) => {
const { config } = this.state
- if (type === 'tabs') { // 鏍囩椤佃皟鏁撮『搴忔垨娣诲姞鍏冪礌
- if (list.length > config[card.groupId].length) {
- list = list.filter(item => !item.origin)
-
- this.handleTab(card)
- }
-
- this.setState({config: {...config, [card.groupId]: list}})
- } else if (type === 'action') {
+ if (type === 'action') {
if (list.length > config.action.length) {
this.handleAction(card)
@@ -509,127 +519,6 @@
})
}
- handleTab = (card) => {
- const { config } = this.state
-
- let menus = [
- {value: '', text: '绌�'},
- {value: 'mainTable', text: '涓绘暟鎹�'}
- ]
- let equalTabs = []
- let supMenu = card.supMenu || ''
- let equalTab = card.equalTab || []
- let isuptab = true
- let equalTabIds = []
-
- config.tabgroups.forEach((groupId, i) => {
- if (groupId === card.groupId) {
- isuptab = false
- config[card.groupId].forEach(tab => { // 鍙叧鑱旂殑鍚岀骇鏍囩
- if (tab.uuid === card.uuid) return
-
- equalTabIds.push(tab.uuid)
- equalTabs.push(tab)
- })
- } else if (isuptab) {
- config[groupId].forEach(tab => {
- menus.push({
- value: tab.uuid,
- text: tab.label
- })
- })
- }
- })
-
- if (supMenu && menus.filter(menu => menu.value === supMenu).length === 0) {
- supMenu = ''
- }
-
- if (equalTab.length > 0) {
- equalTab = equalTab.filter(tabId => equalTabIds.includes(tabId))
- }
-
- this.setState({
- modaltype: 'tabs',
- card: card,
- formlist: [
- {
- type: 'text',
- key: 'label',
- label: this.state.dict['header.menu.tabName'],
- initVal: card.label || '',
- required: true
- },
- {
- type: 'select',
- key: 'type',
- label: this.state.dict['header.form.tabType'],
- initVal: card.type || 'SubTable',
- required: true,
- options: [{
- value: 'SubTable',
- text: this.state.dict['header.menu.tab.subtable']
- }]
- },
- {
- type: 'select',
- key: 'linkTab',
- label: '鍏宠仈鏍囩',
- initVal: card.linkTab || '',
- required: false,
- options: []
- },
- {
- type: 'select',
- key: 'icon',
- label: this.state.dict['header.menu.icon'],
- initVal: card.icon || '',
- required: false,
- options: [{
- value: '',
- text: this.state.dict['header.form.empty']
- }, {
- value: 'table',
- text: 'table'
- }, {
- value: 'bar-chart',
- text: 'bar-chart'
- }, {
- value: 'pie-chart',
- text: 'pie-chart'
- }, {
- value: 'line-chart',
- text: 'line-chart'
- }]
- },
- {
- type: 'select',
- key: 'supMenu',
- label: this.state.dict['header.form.supTab'],
- initVal: supMenu,
- required: false,
- options: menus
- },
- {
- type: 'mutilselect',
- key: 'equalTab',
- label: this.state.dict['header.form.equalTab'],
- tooltip: '濡傛灉瀛愭爣绛句腑鍚湁鍒锋柊鍚岀骇鏍囩鐨勬寜閽紝鍦ㄦ澶勬坊鍔犻渶瑕佸埛鏂扮殑鏍囩銆�',
- initVal: equalTab,
- required: false,
- options: equalTabs
- },
- {
- type: 'text',
- key: 'foreignKey',
- label: '澶栭敭',
- tooltip: '澶栭敭鏃ㄥ湪鏍囩椤典腑鎵ц榛樿鍑芥暟锛堟坊鍔狅級鏃讹紝鏇挎崲BID瀛楁',
- initVal: card.foreignKey || '',
- required: false
- }
- ]
- })
- }
/**
* @description 鎼滅储銆佹寜閽�佹樉绀哄垪淇敼鍚庢彁浜や繚瀛�
@@ -789,22 +678,6 @@
modaltype: ''
})
})
- } else if (modaltype === 'tabs') {
- this.tabsFormRef.handleConfirm().then(res => {
- let _tabgroup = config[res.groupId].map(item => {
- if (item.uuid === res.uuid) {
- return res
- } else {
- return item
- }
- })
- _tabgroup = _tabgroup.filter(item => !item.origin)
-
- this.setState({
- config: {...config, [res.groupId]: _tabgroup},
- modaltype: ''
- })
- })
}
}
@@ -822,9 +695,6 @@
} else if (modaltype === 'actionEdit') {
let _action = config.action.filter(item => item.uuid !== card.uuid)
_config = {...config, action: _action}
- } else if (modaltype === 'tabs') {
- let _tabgroup = config[card.groupId].filter(item => item.uuid !== card.uuid)
- _config = {...config, [card.groupId]: _tabgroup}
} else {
_config = config
}
@@ -959,16 +829,7 @@
let _config = JSON.parse(JSON.stringify(_this.state.config))
let _delActions = _this.state.delActions
- if (element.type === 'tabs') {
- _config[element.card.groupId] = _config[element.card.groupId].filter(item => {
- if (item.uuid === element.card.uuid) {
- return false
- } else {
- return true
- }
- })
- _delActions.push(element.card.uuid)
- } else if (element.type === 'search') {
+ if (element.type === 'search') {
_config.groups = _config.groups.map(group => {
group.sublist = group.sublist.filter(item => item.uuid !== element.card.uuid)
return group
@@ -1057,25 +918,6 @@
return
}
- let tabNames = []
- let tablength = 0
- config.tabgroups.forEach(group => {
- config[group].forEach(tab => {
- tabNames.push(tab.label)
- })
- tablength += config[group].length
- })
- tabNames = Array.from(new Set(tabNames))
-
- if (tabNames.length < tablength) {
- notification.warning({
- top: 92,
- message: '鏍囩鍚嶇О涓嶅彲鐩稿悓锛�',
- duration: 5
- })
- return
- }
-
let _LongParam = ''
let _config = {...config, tables: this.state.selectedTables}
@@ -1088,8 +930,8 @@
// 鏍囩涓嶅悎娉曟椂锛屽惎鐢ㄧ姸鎬佷负false
if (_config.tabgroups.length > 1) {
- _config.tabgroups.forEach(groupId => {
- if (_config[groupId].length === 0) {
+ _config.tabgroups.forEach(group => {
+ if (group.sublist.length === 0) {
_config.enabled = false
}
})
@@ -1142,10 +984,8 @@
}
})
- _config.tabgroups.forEach(groupId => {
- if (_config[groupId].length === 0) return
-
- _config[groupId].forEach(tab => {
+ _config.tabgroups.forEach(group => {
+ group.sublist.forEach(tab => {
_config.funcs.push({
type: 'tab',
subtype: 'tab',
@@ -1256,8 +1096,8 @@
let _LText = []
- config.tabgroups.forEach(groupId => {
- config[groupId].forEach(item => {
+ config.tabgroups.forEach(group => {
+ group.sublist.forEach(item => {
_sort++
_LText.push(`select '${btnTab.uuid}' as MenuID ,'${item.linkTab}' as Tabid,'${item.label}' as TabName ,'${_sort * 10}' as Sort`)
})
@@ -1792,7 +1632,7 @@
let tabinvalid = true
if (config.tabgroups.length > 1) {
config.tabgroups.forEach(group => {
- if (config[group].length === 0) {
+ if (group.sublist.length === 0) {
tabinvalid = false
}
})
@@ -1854,48 +1694,7 @@
}
}
- addTabGroup = () => {
- let _this = this
- let _config = JSON.parse(JSON.stringify(this.state.config))
- confirm({
- content: `纭畾鏂板缓鏍囩缁勫悧锛焋,
- okText: this.state.dict['model.confirm'],
- cancelText: this.state.dict['header.cancel'],
- onOk() {
- let newgroup = 'tabs' + Utils.getuuid()
-
- _config.tabgroups.push(newgroup)
- _config[newgroup] = []
-
- _this.setState({
- config: _config,
- })
- },
- onCancel() {}
- })
- }
-
- delTabGroup = (groupId) => {
- let _this = this
- let _config = JSON.parse(JSON.stringify(this.state.config))
-
- confirm({
- content: `纭畾鍒犻櫎鏍囩缁勫悧锛焋,
- okText: this.state.dict['model.confirm'],
- cancelText: this.state.dict['header.cancel'],
- onOk() {
-
- _config.tabgroups = _config.tabgroups.filter(group => group !== groupId)
- delete _config[groupId]
-
- _this.setState({
- config: _config
- })
- },
- onCancel() {}
- })
- }
handleGroup = (group) => {
let editgroup = {
@@ -1964,25 +1763,6 @@
})
}
- handleTabGroup = (index, type) => {
- let config = JSON.parse(JSON.stringify(this.state.config))
-
- if (type === 'up') {
- config.tabgroups.splice(index, 0, config.tabgroups.splice(index - 1, 1)[0])
- } else {
- config.tabgroups.splice(index, 0, config.tabgroups.splice(index + 1, 1)[0])
- }
-
- this.setState({
- config: config
- })
-
- notification.success({
- top: 92,
- message: '璋冩暣鎴愬姛',
- duration: 2
- })
- }
pasteSubmit = () => {
let _config = JSON.parse(JSON.stringify(this.state.config))
@@ -2020,13 +1800,25 @@
})
}
+ /**
+ * @description 鏇存柊鏍囩閰嶇疆淇℃伅
+ */
+ updatetabs = (config, delcards) => {
+ const { delActions } = this.state
+
+ this.setState({
+ config: config,
+ delActions: delcards ? [...delActions, ...delcards.map(item => item.uuid)] : delActions
+ })
+ }
+
render () {
const { config, modaltype, activeKey } = this.state
let _length = config.groups.length
let configTabs = []
- this.state.config.tabgroups.forEach(group => {
- configTabs.push(...this.state.config[group])
+ config.tabgroups.forEach(group => {
+ configTabs.push(...group.sublist)
})
return (
@@ -2196,30 +1988,13 @@
/>
</div>
{/* 鏍囩缁� */}
- {this.state.config.tabgroups.map((groupId, index) => {
- return (
- <div key={index} className="tab-list">
- {index === 0 ? <Tooltip placement="bottomLeft" overlayClassName="middle" title="鍦ㄥ乏渚у伐鍏锋爮銆婃爣绛鹃〉銆嬩腑锛岄�夋嫨瀵瑰簲绫诲瀷鐨勬爣绛鹃〉鎷栬嚦姝ゅ娣诲姞銆�">
- <Icon type="question-circle" />
- </Tooltip> : null}
- {index !== (this.state.config.tabgroups.length - 1) ?
- <Icon type="arrow-down" onClick={() => {this.handleTabGroup(index, 'down')}} /> : null
- }
- {index !== 0 ? <Icon type="arrow-up" onClick={() => {this.handleTabGroup(index, 'up')}} /> : null}
- {index === 0 ? <Icon type="plus" onClick={this.addTabGroup} /> : null}
- {index !== 0 ? <Icon type="delete" onClick={() => {this.delTabGroup(groupId)}} /> : null}
- <TabDragElement
- type="tabs"
- groupId={groupId}
- list={this.state.config[groupId]}
- handleList={this.handleList}
- handleMenu={this.handleTab}
- deleteMenu={this.deleteElement}
- doubleClickCard={(tab) => this.setSubConfig(tab, 'tab')}
- placeholder={this.state.dict['header.form.tab.placeholder']}
- />
- </div>)
- })}
+ <TabsComponent
+ type="formtab"
+ config={config}
+ tabs={this.state.tabviews}
+ setSubConfig={(item) => this.setSubConfig(item, 'tab')}
+ updatetabs={this.updatetabs}
+ />
</Card>
</div>
</DndProvider>
@@ -2265,26 +2040,6 @@
formlist={this.state.formlist}
inputSubmit={this.handleSubmit}
wrappedComponentRef={(inst) => this.actionFormRef = inst}
- />
- </Modal>
- {/* 鏍囩缂栬緫 */}
- <Modal
- title={this.state.dict['header.modal.tabs.edit']}
- visible={modaltype === 'tabs'}
- width={700}
- maskClosable={false}
- onOk={this.handleSubmit}
- onCancel={this.editModalCancel}
- destroyOnClose
- >
- <TabForm
- type="tabs"
- dict={this.state.dict}
- card={this.state.card}
- tabs={this.state.tabviews}
- formlist={this.state.formlist}
- inputSubmit={this.handleSubmit}
- wrappedComponentRef={(inst) => this.tabsFormRef = inst}
/>
</Modal>
{/* 鏍规嵁瀛楁鍚嶆坊鍔犳樉绀哄垪鍙婃悳绱㈡潯浠� */}
--
Gitblit v1.8.0