From 01a88094eaa183714ed7490ca7b85fee1e7bb064 Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期六, 20 五月 2023 23:03:41 +0800 Subject: [PATCH] 2023-05-20 --- src/menu/components/table/base-table/columns/index.jsx | 111 +++++++++++++++++++++++++++++++------------------------ 1 files changed, 63 insertions(+), 48 deletions(-) diff --git a/src/menu/components/table/base-table/columns/index.jsx b/src/menu/components/table/base-table/columns/index.jsx index 07ec61f..c6b6e95 100644 --- a/src/menu/components/table/base-table/columns/index.jsx +++ b/src/menu/components/table/base-table/columns/index.jsx @@ -3,7 +3,7 @@ import { is, fromJS } from 'immutable' import { DndProvider, DragSource, DropTarget } from 'react-dnd' import { Table, Popover, Modal, message, notification } from 'antd' -import { PlusOutlined, EditOutlined, CopyOutlined, DeleteOutlined, FontColorsOutlined, CloseCircleOutlined, AntDesignOutlined, InfoOutlined } from '@ant-design/icons' +import { PlusOutlined, PlusSquareOutlined, EditOutlined, CopyOutlined, DeleteOutlined, FontColorsOutlined, CloseCircleOutlined, AntDesignOutlined, InfoOutlined } from '@ant-design/icons' import asyncComponent from '@/utils/asyncComponent' import asyncIconComponent from '@/utils/asyncIconComponent' @@ -46,31 +46,36 @@ return !is(fromJS(this.props.column), fromJS(nextProps.column)) || !is(fromJS(this.props.fields), fromJS(nextProps.fields)) || - this.props.index !== nextProps.index + this.props.index !== nextProps.index || + window.GLOB.columnId === nextProps.column.uuid || window.GLOB.precolumnId === nextProps.column.uuid } render() { const { connectDragSource, connectDropTarget, moveCol, addElement, dropCol, updateCol, editColumn, pasteCell, changeStyle, deleteCol, index, column, align, fields, children, ...restProps } = this.props - if (index !== undefined) { + if (index !== undefined && column) { let style = {cursor: 'move', textAlign: align} if (column.Width) { style.width = column.Width style.minWidth = column.Width } + if (window.GLOB.columnId === column.uuid) { + style.color = '#1890ff' + } + return connectDragSource( - connectDropTarget(<th {...restProps} index={index} style={style} onDoubleClick={() => column && this.props.editColumn(column)}> + connectDropTarget(<th {...restProps} index={index} style={style} onDoubleClick={() => this.props.editColumn(column)}> <Popover overlayClassName="mk-popover-control-wrap" mouseLeaveDelay={0.2} mouseEnterDelay={0.2} content={ <div className="mk-popover-control" onDoubleClick={(e) => e.stopPropagation()}> - {column && ['custom', 'colspan', 'action'].includes(column.type) ? - <PlusOutlined className="plus" title="娣诲姞" onClick={() => this.props.addElement(column)} /> : null - } + {column.type === 'colspan' ? <PlusOutlined className="plus" title="娣诲姞鍒�" onClick={() => this.props.addElement(column)} /> : null} + {column.type === 'custom' ? <PlusOutlined className="plus" title="娣诲姞鍏冪礌" onClick={() => this.props.addElement(column)} /> : null} + {column.type === 'custom' ? <PlusSquareOutlined className="plus" title="娣诲姞鎸夐挳" onClick={() => this.props.addElement(column, 'button')} /> : null} <EditOutlined className="edit" title="缂栬緫" onClick={() => this.props.editColumn(column)} /> - {column && column.type === 'custom' ? <PasteComponent options={['customCardElement']} updateConfig={(res, resolve) => this.props.pasteCell(column, res, resolve)} /> : null} - {column && column.type === 'custom' ? <FontColorsOutlined className="style" title="璋冩暣鏍峰紡" onClick={() => this.props.changeStyle(column)}/> : null} + {column.type === 'custom' ? <PasteComponent options={['customCardElement', 'action']} updateConfig={(res, resolve) => this.props.pasteCell(column, res, resolve)} /> : null} + {column.type === 'custom' ? <FontColorsOutlined className="style" title="璋冩暣鏍峰紡" onClick={() => this.props.changeStyle(column)}/> : null} <DeleteOutlined className="close" title="鍒犻櫎" onClick={this.deleteCol} /> - {column && ['text', 'number', 'formula'].includes(column.type) ? <MarkColumn field={column.field || ''} columns={fields} marks={column.marks} onSubmit={this.updateMarks} /> : null } + {['text', 'number', 'formula'].includes(column.type) ? <MarkColumn field={column.field || ''} columns={fields} marks={column.marks} onSubmit={this.updateMarks} /> : null } </div> } trigger="hover"> {children} @@ -83,17 +88,22 @@ style.width = column.Width style.minWidth = column.Width } + + if (window.GLOB.columnId === column.uuid) { + style.color = '#1890ff' + } + return ( <th {...restProps} style={style} key={column.uuid} onDoubleClick={() => this.props.editColumn(column)}> <Popover overlayClassName="mk-popover-control-wrap" mouseLeaveDelay={0.2} mouseEnterDelay={0.2} content={ <div className="mk-popover-control" onDoubleClick={(e) => e.stopPropagation()}> - {column && ['custom', 'colspan'].includes(column.type) ? - <PlusOutlined className="plus" title="娣诲姞" onClick={() => this.props.addElement(column)} /> : null - } + {column.type === 'colspan' ? <PlusOutlined className="plus" title="娣诲姞鍒�" onClick={() => this.props.addElement(column)} /> : null} + {column.type === 'custom' ? <PlusOutlined className="plus" title="娣诲姞鍏冪礌" onClick={() => this.props.addElement(column)} /> : null} + {column.type === 'custom' ? <PlusSquareOutlined className="plus" title="娣诲姞鎸夐挳" onClick={() => this.props.addElement(column, 'button')} /> : null} <EditOutlined className="edit" title="缂栬緫" onClick={() => this.props.editColumn(column)} /> - {column.type === 'custom' ? <PasteComponent options={['customCardElement']} updateConfig={(res, resolve) => this.props.pasteCell(column, res, resolve)} /> : null} + {column.type === 'custom' ? <PasteComponent options={['customCardElement', 'action']} updateConfig={(res, resolve) => this.props.pasteCell(column, res, resolve)} /> : null} <DeleteOutlined className="close" title="鍒犻櫎" onClick={this.deleteCol} /> - {column && ['text', 'number', 'formula'].includes(column.type) ? <MarkColumn field={column.field || ''} columns={fields} marks={column.marks} onSubmit={this.updateMarks} /> : null } + {['text', 'number', 'formula'].includes(column.type) ? <MarkColumn field={column.field || ''} columns={fields} marks={column.marks} onSubmit={this.updateMarks} /> : null } </div> } trigger="hover"> {children} @@ -190,12 +200,6 @@ if (column && column.type === 'custom') { return ( <td style={{padding: 0, ...(column.style || {})}} className={className}> - <CardCellComponent cards={config} cardCell={column} elements={column.elements} updateElement={this.updateCard}/> - </td> - ) - } else if (column && column.type === 'action') { - return ( - <td style={{padding: '0 5px', textAlign: column.Align}} className={'action-column ' + className}> <CardCellComponent cards={config} cardCell={column} elements={column.elements} updateElement={this.updateCard}/> </td> ) @@ -312,11 +316,9 @@ dropCol = (item, hoverIndex) => { let _columns = fromJS(this.state.columns).toJS() - let col = { focus: true, uuid: Utils.getuuid(), label: 'label', field: '', type: item.subType, elements: [] } + let col = { focus: true, uuid: Utils.getuuid(), Width: 120, label: 'label', field: '', type: item.subType, elements: [] } if (col.type === 'colspan') { col.subcols = [] - } else if (col.type === 'action') { - col.label = '鎿嶄綔' } else if (col.type === 'index') { col.label = '搴忓彿' } @@ -354,7 +356,7 @@ config.action = config.action.filter(item => item.uuid !== btn.uuid) setTimeout(() => { - MKEmitter.emit('revert', config.uuid) + MKEmitter.emit('revertBtn', config.uuid) }, 200) } @@ -371,14 +373,23 @@ pasteCell = (col, cell, resolve) => { resolve({status: true}) - delete cell.copyType cell.uuid = Utils.getuuid() cell.focus = true + + if (!cell.eleType) { + if (cell.copyType === 'action') { + cell.eleType = 'button' + cell.width = cell.width || 12 + } else { + cell.eleType = 'text' + } + } + delete cell.copyType MKEmitter.emit('cardAddElement', col.uuid, cell) } - addElement = (col) => { + addElement = (col, type) => { let column = fromJS(col).toJS() if (column.type === 'colspan') { @@ -391,26 +402,28 @@ }) this.updateCol(column) } else if (column.type === 'custom') { - let newcard = {uuid: Utils.getuuid(), focus: true, width: 24, eleType: 'text', datatype: 'dynamic', style: {paddingLeft: '4px'}} + if (type === 'button') { + let newcard = { + uuid: Utils.getuuid(), + focus: true, + eleType: 'button', + label: 'button', + OpenType: 'prompt', + class: 'primary', + intertype: 'system', + execSuccess: 'grid', + execError: 'never', + show: 'link' + } - // 娉ㄥ唽浜嬩欢-娣诲姞鍏冪礌 - MKEmitter.emit('cardAddElement', column.uuid, newcard) - } else if (column.type === 'action') { - let newcard = { - uuid: Utils.getuuid(), - focus: true, - eleType: 'button', - label: 'button', - OpenType: 'prompt', - class: 'primary', - intertype: 'system', - execSuccess: 'grid', - execError: 'never', - show: 'link' + // 娉ㄥ唽浜嬩欢-娣诲姞鍏冪礌 + MKEmitter.emit('cardAddElement', column.uuid, newcard) + } else { + let newcard = {uuid: Utils.getuuid(), focus: true, width: 24, eleType: 'text', datatype: 'dynamic', style: {paddingLeft: '4px'}} + + // 娉ㄥ唽浜嬩欢-娣诲姞鍏冪礌 + MKEmitter.emit('cardAddElement', column.uuid, newcard) } - - // 娉ㄥ唽浜嬩欢-娣诲姞鍏冪礌 - MKEmitter.emit('cardAddElement', column.uuid, newcard) } } @@ -424,9 +437,8 @@ if (col.type === 'colspan') { col.subcols = card.subcols || [] } else if (col.type === 'custom') { + col.style = card.style || {} col.elements = card.type === 'custom' ? (card.elements || []) : [] - } else if (col.type === 'action') { - col.elements = card.type === 'action' ? (card.elements || []) : [] } if (!col.field || col.isSub) { @@ -450,6 +462,9 @@ resolve() } } + + window.GLOB.precolumnId = window.GLOB.columnId || '' + window.GLOB.columnId = col.uuid this.setState({card: null}) this.updateCol(col) @@ -648,7 +663,7 @@ } return ( - <div className={`normal-table-columns ${config.setting.laypage} ${config.wrap.tableType} ${config.wrap.mode || ''}`} id={tableId}> + <div className={`normal-table-columns ${config.setting.laypage} ${config.wrap.tableType} ${config.wrap.mode || ''} table-vertical-${config.wrap.vertical || ''} table-col-${columns.length}`} id={tableId}> <div className="col-control"> <FieldsComponent config={config} type="columns" /> <CopyOutlined title="澶嶅埗鏄剧ず鍒�" onClick={this.copycolumn} /> -- Gitblit v1.8.0