From 84e806945ef8982508a79e0b62a7bcb0881b108c Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期一, 30 十二月 2019 10:09:26 +0800 Subject: [PATCH] 2019-12-30 --- src/templates/comtableconfig/index.jsx | 282 +++++++++++++++++++++++++++++++++++++++----------------- 1 files changed, 195 insertions(+), 87 deletions(-) diff --git a/src/templates/comtableconfig/index.jsx b/src/templates/comtableconfig/index.jsx index 58cba79..3506b6b 100644 --- a/src/templates/comtableconfig/index.jsx +++ b/src/templates/comtableconfig/index.jsx @@ -109,6 +109,8 @@ } _config.tabs = _config.tabs || [] + _config.tabgroups = _config.tabgroups || ['tabs'] + _config.setting.subtabs = _config.setting.subtabs || [] this.setState({ originActions: _oriActions, @@ -290,30 +292,49 @@ handleList = (type, list, card) => { const { config } = this.state - if (list.length > config[type].length) { - list = list.filter(item => !item.origin) - - this.setState({ - [type + 'loading']: true, - config: {...config, [type]: list } - }, () => { - // 鍒锋柊瀵瑰簲鐨勯厤缃俊鎭� + if (type === 'tabs') { // 鏍囩椤佃皟鏁撮『搴忔垨娣诲姞鍏冪礌 + if (list.length > config[card.groupId].length) { + list = list.filter(item => !item.origin) + this.setState({ - [type + 'loading']: false - }) - - if (type === 'search') { - this.handleSearch(card) - } else if (type === 'action') { - this.handleAction(card) - } else if (type === 'columns') { - this.handleColumn(card) - } else if (type === 'tabs') { + tabloading: true, + config: {...config, [card.groupId]: list } + }, () => { + // 鍒锋柊瀵瑰簲鐨勯厤缃俊鎭� + this.setState({ + tabloading: false + }) this.handleTab(card) - } - }) + }) + } else { + this.setState({config: {...config, [card.groupId]: list}}) + } } else { - this.setState({config: {...config, [type]: list}}) + if (list.length > config[type].length) { + list = list.filter(item => !item.origin) + + this.setState({ + [type + 'loading']: true, + config: {...config, [type]: list } + }, () => { + // 鍒锋柊瀵瑰簲鐨勯厤缃俊鎭� + this.setState({ + [type + 'loading']: false + }) + + if (type === 'search') { + this.handleSearch(card) + } else if (type === 'action') { + this.handleAction(card) + } else if (type === 'columns') { + this.handleColumn(card) + } else if (type === 'tabs') { + this.handleTab(card) + } + }) + } else { + this.setState({config: {...config, [type]: list}}) + } } } @@ -531,23 +552,23 @@ MenuID: 'pop', text: this.state.dict['header.form.popform'] }, { - MenuID: 'popview', - text: this.state.dict['header.form.popview'] - }, { 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: 'excelIn', text: this.state.dict['header.form.excelIn'] }, { MenuID: 'excelOut', text: this.state.dict['header.form.excelOut'] + }, { + MenuID: 'popview', + text: this.state.dict['header.form.popview'] + }, { + MenuID: 'tab', + text: this.state.dict['header.form.tab'] }, { MenuID: 'blank', text: this.state.dict['header.form.blank'] @@ -788,11 +809,11 @@ MenuID: 'text', text: this.state.dict['header.form.text'] }, { - MenuID: 'picture', - text: this.state.dict['header.form.picture'] - }, { MenuID: 'number', text: this.state.dict['header.form.number'] + }, { + MenuID: 'picture', + text: this.state.dict['header.form.picture'] }, { MenuID: 'textarea', text: this.state.dict['header.form.textarea'] @@ -964,6 +985,7 @@ this.setState({ visible: true, formtemp: 'columns', + modalTitle: '缂栬緫-鍚堝苟鍒�', card: card }) } @@ -972,24 +994,42 @@ handleTab = (card) => { const { config } = this.state - let menus = [] - - config.tabs.forEach(item => { - if (item.origin || card.uuid === item.uuid) return - - let menu = { - value: item.uuid, - text: item.label + let index = 0 // 绛涢�変笅涓�缁� + config.tabgroups.forEach((groupId, i) => { + if (groupId === card.groupId) { + index = i } - - menus.push(menu) }) - if (card.supMenu && card.supMenu !== 'mainTable') { - let _menu = menus.filter(item => item.value === card.supMenu)[0] - if (!_menu) { - card.supMenu = '' - } + let menus = [] + let subtabs = card.subtabs || [] + let nextTabId = config.tabgroups[index + 1] + + if (nextTabId) { + let _tabMap = new Map() + let _usedTabMap = new Map() + + config[nextTabId].forEach(tab => { // 涓嬬骇鎵�鏈夌殑鏍囩 + menus.push(tab) + _tabMap.set(tab.uuid, true) + }) + + config[card.groupId].forEach(tab => { // 鍚岀骇鏍囩宸查�夌殑涓嬬骇鏍囩 + if (tab.uuid === card.uuid) return + + tab.subtabs.forEach(subtab => { + _usedTabMap.set(subtab, true) + }) + }) + console.log(config) + config.setting.subtabs.forEach(subtab => { // 涓昏〃宸查�夌殑涓嬬骇鏍囩 + _usedTabMap.set(subtab, true) + }) + + subtabs = subtabs.filter(tab => _tabMap.has(tab.uuid) && !_usedTabMap.has(tab.uuid)) + menus = menus.filter(tab => !_usedTabMap.has(tab.uuid)) + } else { + subtabs = [] } this.setState({ @@ -1048,21 +1088,12 @@ }] }, { - type: 'select', - key: 'supMenu', - label: '鍏宠仈鑿滃崟', - initVal: card.supMenu || '', + type: 'mutilselect', + key: 'subtabs', + label: '涓嬬骇鏍囩', + initVal: subtabs, required: false, - options: [ - { - value: '', - text: this.state.dict['header.form.empty'] - }, { - value: 'mainTable', - text: '涓昏〃' - }, - ...menus - ] + options: menus } ] }) @@ -1134,19 +1165,36 @@ }) } - _config[res.type] = _config[res.type].map(item => { - if (item.uuid === res.values.uuid) { - isupdate = true - return res.values - } else { - return item + if (res.type !== 'tabs') { + _config[res.type] = _config[res.type].map(item => { + if (item.uuid === res.values.uuid) { + isupdate = true + return res.values + } else { + return item + } + }) + _config[res.type] = _config[res.type].filter(item => !item.origin) + + if (!isupdate) { // 鎿嶄綔涓嶆槸淇敼锛屾坊鍔犲厓绱犺嚦鍒楄〃 + _config[res.type].push(res.values) } - }) - _config[res.type] = _config[res.type].filter(item => !item.origin) - - if (!isupdate) { // 鎿嶄綔涓嶆槸淇敼锛屾坊鍔犲厓绱犺嚦鍒楄〃 - _config[res.type].push(res.values) + } else { // 鏍囩椤电殑娣诲姞涓庝慨鏀� + _config[res.values.groupId] = _config[res.values.groupId].map(item => { + if (item.uuid === res.values.uuid) { + isupdate = true + return res.values + } else { + return item + } + }) + _config[res.values.groupId] = _config[res.values.groupId].filter(item => !item.origin) + + if (!isupdate) { // 鎿嶄綔涓嶆槸淇敼锛屾坊鍔犲厓绱犺嚦鍒楄〃 + _config[res.values.groupId].push(res.values) + } } + if (res.type === 'action') { let gridbtn = _config.action.filter(act => act.position === 'grid') @@ -1172,7 +1220,7 @@ } } } - + this.setState({ config: _config, searchloading: true, @@ -1833,6 +1881,7 @@ let tabParam = { // 娣诲姞鑿滃崟tab椤� func: 'sPC_sMenusTab_AddUpt', + MenuID: menu.MenuID, LText: config.tabs.map((item, index) => { return `select '${menu.MenuID}' as MenuID ,'${item.linkTab}' as Tabid,'${item.label}' as TabName ,'${(index + 1) * 10}' as Sort` }) @@ -2567,6 +2616,59 @@ }) } + addTabGroup = () => { + let _this = this + let _config = JSON.parse(JSON.stringify(this.state.config)) + + confirm({ + content: `纭畾鏂板缓鏍囩缁勫悧锛焋, + okText: this.state.dict['header.confirm'], + cancelText: this.state.dict['header.cancel'], + onOk() { + let newgroup = 'tabs' + Utils.getuuid() + + _config.tabgroups.push(newgroup) + _config[newgroup] = [] + + _this.setState({ + config: _config, + tabloading: true + }, () => { + _this.setState({ + tabloading: false + }) + }) + }, + onCancel() {} + }) + } + + delTabGroup = (groupId) => { + let _this = this + let _config = JSON.parse(JSON.stringify(this.state.config)) + + confirm({ + content: `纭畾鍒犻櫎鏍囩缁勫悧锛焋, + okText: this.state.dict['header.confirm'], + cancelText: this.state.dict['header.cancel'], + onOk() { + + _config.tabgroups = _config.tabgroups.filter(group => group !== groupId) + delete _config[groupId] + + _this.setState({ + config: _config, + tabloading: true + }, () => { + _this.setState({ + tabloading: false + }) + }) + }, + onCancel() {} + }) + } + render () { const configAction = this.state.config.action.filter(_action => !_action.origin && (_action.OpenType === 'pop' || _action.OpenType === 'popview' || _action.OpenType === 'blank' || _action.OpenType === 'tab') @@ -2740,6 +2842,7 @@ /> : null } </div> + {/* 鏄剧ず鍒� */} <div className="column-list"> <Tooltip placement="bottomLeft" overlayClassName="middle" title="鍦ㄥ乏渚у伐鍏锋爮銆婃樉绀哄垪銆嬩腑锛岄�夋嫨瀵瑰簲绫诲瀷鐨勬樉绀哄垪鎷栬嚦姝ゅ娣诲姞锛涙垨鐐瑰嚮銆婃坊鍔犳樉绀哄垪銆嬫寜閽壒閲忔坊鍔狅紝閫夋嫨鎵归噺娣诲姞鏃讹紝闇�鎻愬墠閫夋嫨浣跨敤琛ㄣ�傛敞锛氭坊鍔犲悎骞跺垪鏃讹紝闇�璁剧疆鍙�夊垪銆�"> <Icon type="question-circle" /> @@ -2760,22 +2863,26 @@ /> : null } </div> - <div className="tab-list"> - <Tooltip placement="bottomLeft" overlayClassName="middle" title="鍦ㄥ乏渚у伐鍏锋爮銆婃爣绛鹃〉銆嬩腑锛岄�夋嫨瀵瑰簲绫诲瀷鐨勬爣绛鹃〉鎷栬嚦姝ゅ娣诲姞銆�"> - <Icon type="question-circle" /> - </Tooltip> - {!this.state.tabloading ? - <TabDragElement - type="tabs" - list={this.state.config.tabs} - setting={this.state.config.setting} - handleList={this.handleList} - handleMenu={this.handleTab} - deleteMenu={this.deleteElement} - placeholder={this.state.dict['header.form.tab.placeholder']} - /> : null - } - </div> + {/* 鏍囩缁� */} + {!this.state.tabloading && 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 === 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} + placeholder={this.state.dict['header.form.tab.placeholder']} + /> + </div>) + })} </Card> </div> </DndProvider> @@ -2888,6 +2995,7 @@ <SettingForm dict={this.state.dict} menu={this.props.menu} + config={this.state.config} data={this.state.config.setting} columns={this.state.config.columns} usefulFields={this.props.permFuncField} -- Gitblit v1.8.0