From 1ed217be1abce1a1da18d90a1a9f358beef79acd Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期三, 30 十二月 2020 18:31:28 +0800 Subject: [PATCH] 2020-12-30 --- src/tabviews/custom/components/share/normalTable/index.jsx | 150 ++++++++++++++++++++++++++++--------------------- 1 files changed, 85 insertions(+), 65 deletions(-) diff --git a/src/tabviews/custom/components/share/normalTable/index.jsx b/src/tabviews/custom/components/share/normalTable/index.jsx index 584b7c0..65f1256 100644 --- a/src/tabviews/custom/components/share/normalTable/index.jsx +++ b/src/tabviews/custom/components/share/normalTable/index.jsx @@ -22,7 +22,7 @@ } render() { - let { lineMarks, data, className, ...resProps } = this.props + let { lineMarks, onDoubleClick, data, className, ...resProps } = this.props let style = {} if (lineMarks && lineMarks.length > 0) { @@ -89,7 +89,7 @@ }) } - return <tr {...resProps} className={className} style={style}/> + return <tr {...resProps} onDoubleClick={onDoubleClick} className={className} style={style}/> } } @@ -205,7 +205,7 @@ if (col.linkThdMenu || col.linkurl) { content = ( <div> - <div className="link-menu" onDoubleClick={() => this.triggerLink(col, record)}></div> + <div className="link-menu" onDoubleClick={(e) => this.triggerLink(e, col, record)}></div> {content} </div> ) @@ -251,7 +251,7 @@ if (col.linkThdMenu || col.linkurl) { content = ( <div> - <div className="link-menu" onDoubleClick={() => this.triggerLink(col, record)}></div> + <div className="link-menu" onDoubleClick={(e) => this.triggerLink(e, col, record)}></div> {content} </div> ) @@ -344,7 +344,13 @@ {content && _href ? <a href={_href} target="_blank" rel="noopener noreferrer">{content}</a> : null } </div> ) - } else if (col.type === 'custom' || col.type === 'action') { + } else if (col.type === 'custom') { + style.padding = '0px' + resProps.children = ( + <CardCellComponent data={record} cards={config} elements={col.elements} updateStatus={this.props.updateStatus}/> + ) + } else if (col.type === 'action') { + style.padding = '0px 5px' resProps.children = ( <CardCellComponent data={record} cards={config} elements={col.elements} updateStatus={this.props.updateStatus}/> ) @@ -375,22 +381,23 @@ state = { dict: sessionStorage.getItem('lang') !== 'en-US' ? zhCN : enUS, + tableId: '', // 琛ㄦ牸ID selectedRowKeys: [], // 琛ㄦ牸涓�変腑琛� pageIndex: 1, // 鍒濆椤甸潰绱㈠紩 pageSize: 10, // 姣忛〉鏁版嵁鏉℃暟 columns: null, // 鏄剧ず鍒� activeIndex: null, // 鏍囪褰撳墠閫変腑琛� rowspans: null, // 琛屽悎骞跺瓧娈典俊鎭� - pickup: false + pickup: false, // 鏀惰捣鏈�夋嫨椤� + orderfields: {} // 鎺掑簭id涓巉ield杞崲 } UNSAFE_componentWillMount () { - const { menuType, memberLevel, setting, fields } = this.props - let columns = fromJS(this.props.columns).toJS() - let _columns = [] + const { menuType, memberLevel, setting, fields, columns } = this.props let radio = 5 // 铏氬寲姣斾緥 let _format = false // 鏄惁铏氬寲澶勭悊 let rowspans = [] + let orderfields = {} if (window.GLOB.dataFormat && menuType !== 'HS' && memberLevel) { _format = true @@ -402,78 +409,76 @@ } } - columns.forEach(item => { - if (item.hidden === true || item.Hide === 'true') return - let cell = null - - if (item.type === 'colspan') { - cell = {title: item.label, children: []} - - item.subcols.forEach(col => { - if (col.rowspan === 'true') { - rowspans.push(col.field) + let getColumns = (cols) => { + return cols.map(item => { + let cell = null + + if (item.type === 'colspan') { + cell = { title: item.label, align: item.Align } + cell.children = getColumns(item.subcols) + } else { + if (item.rowspan === 'true') { + rowspans.push(item.field) } if (_format && !Math.floor(Math.random() * radio)) { - col.blur = true + item.blur = true + } + + if (item.marks && item.marks.length === 0) { + item.marks = '' } - if (col.marks && col.marks.length === 0) { - col.marks = '' + if (item.field) { + orderfields[item.uuid] = item.field } - cell.children.push({ - align: col.Align, - title: col.label, - dataIndex: col.field || col.uuid, - key: col.uuid, - width: col.Width || 120, + cell = { + align: item.Align, + dataIndex: item.uuid, + title: item.label, + sorter: item.field && item.IsSort === 'true', + width: item.Width || 120, onCell: record => ({ record, - col, - config: col.type === 'custom' ? {setting, columns: fields} : null, + col: item, + config: item.type === 'custom' || item.type === 'action' ? {setting, columns: fields} : null, triggerLink: this.triggerLink, updateStatus: this.updateStatus }) - }) - }) - } else { - if (item.rowspan === 'true') { - rowspans.push(item.field) + } } - if (_format && !Math.floor(Math.random() * radio)) { - item.blur = true - } + + return cell + }) + } - if (item.marks && item.marks.length === 0) { - item.marks = '' - } - - cell = { - align: item.Align, - dataIndex: item.field || item.uuid, - title: item.label, - sorter: item.field && item.IsSort === 'true', - width: item.Width || 120, - onCell: record => ({ - record, - col: item, - config: item.type === 'custom' || item.type === 'action' ? {setting, columns: fields} : null, - triggerLink: this.triggerLink, - updateStatus: this.updateStatus - }) - } - } - - _columns.push(cell) - }) + let _columns = getColumns(columns) if (rowspans.length === 0) { rowspans = null } + let tableId = (() => { + let uuid = [] + let _options = 'abcdefghigklmnopqrstuv' + for (let i = 0; i < 19; i++) { + uuid.push(_options.substr(Math.floor(Math.random() * 0x20), 1)) + } + return uuid.join('') + }) () + + if (setting.borderColor) { // 杈规棰滆壊 + let style = `#${tableId} table, #${tableId} tr, #${tableId} th, #${tableId} td {border-color: ${setting.borderColor}}` + let ele = document.createElement('style') + ele.innerHTML = style + document.getElementsByTagName('head')[0].appendChild(ele) + } + this.setState({ columns: _columns, - rowspans + rowspans, + tableId, + orderfields }) } @@ -502,8 +507,9 @@ } // 瀛楁閫忚 - triggerLink = (item, record) => { + triggerLink = (e, item, record) => { const { tabviews, MenuID } = this.props + e.stopPropagation() if (item.linkThdMenu) { let tabmenu = item.linkThdMenu @@ -625,6 +631,8 @@ } changeTable = (pagination, filters, sorter) => { + const { orderfields } = this.state + this.setState({ pageIndex: pagination.current, pageSize: pagination.pageSize, @@ -632,6 +640,9 @@ activeIndex: null, pickup: false }) + + sorter.field = orderfields[sorter.field] || '' + this.props.refreshdata(pagination, filters, sorter) } @@ -730,9 +741,17 @@ }) } + doubleClickLine = (record) => { + const { setting } = this.props + + if (!setting.doubleClick) return + + MKEmitter.emit('triggerBtnId', setting.doubleClick, [record]) + } + render() { const { setting, statFValue, lineMarks, data } = this.props - const { selectedRowKeys, activeIndex, pickup } = this.state + const { selectedRowKeys, activeIndex, pickup, tableId } = this.state // 璁剧疆琛ㄦ牸閫夋嫨灞炴�э細鍗曢�夈�佸閫夈�佷笉鍙�� let rowSelection = null @@ -779,7 +798,7 @@ } return ( - <div className="normal-custom-table"> + <div className={'normal-custom-table ' + setting.tableHeader} id={tableId}> {(setting.tableType === 'radio' || setting.tableType === 'checkbox') && data && data.length > 0 ? <Switch title="鏀惰捣" className="main-pickup" checkedChildren="寮�" unCheckedChildren="鍏�" defaultChecked={pickup} onChange={this.pickupChange} /> : null } @@ -797,7 +816,8 @@ lineMarks, data: record, className: index === activeIndex ? ' mk-row-active ' : '', - onClick: () => {this.changeRow(record, index)} + onClick: () => {this.changeRow(record, index)}, + onDoubleClick: () => {this.doubleClickLine(record)} } }} onChange={this.changeTable} -- Gitblit v1.8.0