Commit 4cb48e537fd0d6cdc85bfdaeec8af1a699a6a63b
1 parent
52991fcc
同步_Sum功能;
Showing
2 changed files
with
94 additions
and
2 deletions
src/components/Common/CommonTable/index.js
| ... | ... | @@ -292,6 +292,9 @@ class CommonTableRc extends React.Component { |
| 292 | 292 | } |
| 293 | 293 | |
| 294 | 294 | document.addEventListener('mouseover', this.handleLastTdMouseOver); |
| 295 | + | |
| 296 | + // 监听鼠标右击事件 | |
| 297 | + this.mydiv.addEventListener('contextmenu', this.handleContextMenu); | |
| 295 | 298 | } |
| 296 | 299 | |
| 297 | 300 | componentDidUpdate() { |
| ... | ... | @@ -411,7 +414,7 @@ class CommonTableRc extends React.Component { |
| 411 | 414 | this.forceUpdate(); |
| 412 | 415 | }); |
| 413 | 416 | document.removeEventListener('mouseover', this.handleLastTdMouseOver); |
| 414 | - | |
| 417 | + this.mydiv.removeEventListener('contextmenu', this.handleContextMenu); | |
| 415 | 418 | if (this.tableId && window[`${this.tableId}FieldPopupModal`]) { |
| 416 | 419 | delete window[`${this.tableId}FieldPopupModal`]; |
| 417 | 420 | } |
| ... | ... | @@ -825,6 +828,25 @@ class CommonTableRc extends React.Component { |
| 825 | 828 | }; |
| 826 | 829 | }; |
| 827 | 830 | |
| 831 | + handleContextMenu = (event) => { | |
| 832 | + // 判断右键位置是否有选中文本 | |
| 833 | + if (!window.getSelection().toString()) { | |
| 834 | + const { target } = event; | |
| 835 | + const { tagName } = target; | |
| 836 | + const oDiv = { | |
| 837 | + 'span': target.parentNode, | |
| 838 | + 'td': target.childNodes[0].childNodes[0], | |
| 839 | + 'div': target.getAttribute('data-name') ? target : target.childNodes[0], | |
| 840 | + }[tagName.toLowerCase()]; | |
| 841 | + | |
| 842 | + if (!oDiv) return; | |
| 843 | + if (!oDiv.getAttribute('data-control-name')?.includes('_Sum')) return; | |
| 844 | + // 阻止右键菜单 | |
| 845 | + event.preventDefault(); | |
| 846 | + this.setState({ totalDataNew: undefined, sumGroup: {} }); | |
| 847 | + } | |
| 848 | + | |
| 849 | + } | |
| 828 | 850 | |
| 829 | 851 | onRowMouseEnter= (record) => { // recor |
| 830 | 852 | if (this.props.enabled && this.props.tableBelone !== 'list' && commonUtils.isNotEmptyObject(this.props.tableProps) && |
| ... | ... | @@ -856,6 +878,8 @@ class CommonTableRc extends React.Component { |
| 856 | 878 | |
| 857 | 879 | /** 行选择 */ |
| 858 | 880 | onRowClick = (record, index, type, name, tabType) => { |
| 881 | + if (this.handleCellClick(record)) return; | |
| 882 | + | |
| 859 | 883 | if (this.stopRowClick) { |
| 860 | 884 | this.stopRowClick = false; |
| 861 | 885 | return; |
| ... | ... | @@ -4114,6 +4138,66 @@ class CommonTableRc extends React.Component { |
| 4114 | 4138 | }); |
| 4115 | 4139 | } |
| 4116 | 4140 | |
| 4141 | + handleCellClick = (record) => { | |
| 4142 | + const { enabled } = this.props; | |
| 4143 | + if (enabled) return false; | |
| 4144 | + | |
| 4145 | + const { target } = event; | |
| 4146 | + const { tagName } = target; | |
| 4147 | + const oDiv = { | |
| 4148 | + 'span': target.parentNode, | |
| 4149 | + 'td': target.childNodes[0].childNodes[0], | |
| 4150 | + 'div': target.getAttribute('data-name') ? target : target.childNodes[0], | |
| 4151 | + }[tagName.toLowerCase()]; | |
| 4152 | + | |
| 4153 | + if (!oDiv || window.getSelection().toString()) return false; | |
| 4154 | + | |
| 4155 | + const [sName, sControlName] = [oDiv.getAttribute('data-name'), oDiv.getAttribute('data-control-name')]; | |
| 4156 | + if (sControlName?.includes('_Sum')) { | |
| 4157 | + const { sumGroup = {}, totalData = [{}], totalDataNew: totalDataNew0 = [{}] } = this.state; | |
| 4158 | + const { dNetMoney, dNetPrice } = this.props.app.decimals; | |
| 4159 | + sumGroup[sName] = sumGroup[sName] || []; | |
| 4160 | + if (sumGroup[sName].includes(record[this.rowKey])) { | |
| 4161 | + sumGroup[sName] = sumGroup[sName].filter(item => item !== record[this.rowKey]); | |
| 4162 | + } else { | |
| 4163 | + sumGroup[sName].push(record[this.rowKey]); | |
| 4164 | + } | |
| 4165 | + | |
| 4166 | + let totalDataNew = [...totalDataNew0]; | |
| 4167 | + if (sumGroup[sName].length) { | |
| 4168 | + const sum = sumGroup[sName].reduce((pre, cur) => { | |
| 4169 | + const curData = this.props.data.find(item => item[this.rowKey] === cur); | |
| 4170 | + if (curData) { | |
| 4171 | + let tempValue = 0; | |
| 4172 | + if (sName.toLowerCase().endsWith('price')) { /* 价格 */ | |
| 4173 | + tempValue = commonUtils.convertFixNum(commonUtils.convertFixNum(commonUtils.isNull(curData[sName], 0), dNetPrice) + commonUtils.convertFixNum(commonUtils.isNull(pre, 0), dNetPrice), dNetPrice); | |
| 4174 | + } else { /* 金额 */ | |
| 4175 | + tempValue = commonUtils.convertFixNum(commonUtils.convertFixNum(commonUtils.isNull(curData[sName], 0), dNetMoney) + commonUtils.convertFixNum(commonUtils.isNull(pre, 0), dNetMoney), dNetMoney); | |
| 4176 | + } | |
| 4177 | + return tempValue; | |
| 4178 | + } | |
| 4179 | + return pre; | |
| 4180 | + }, 0); | |
| 4181 | + | |
| 4182 | + totalDataNew = [{ ...totalData[0], ...totalDataNew[0], [sName]: sum }]; | |
| 4183 | + } else { | |
| 4184 | + totalDataNew[0][sName] = totalData[0][sName]; | |
| 4185 | + } | |
| 4186 | + | |
| 4187 | + this.setState({ sumGroup, totalDataNew }); | |
| 4188 | + return true; | |
| 4189 | + } | |
| 4190 | + return false; | |
| 4191 | + } | |
| 4192 | + | |
| 4193 | + handleGetSumStyle = (sName, index) => { | |
| 4194 | + const { data = [] } = this.props; | |
| 4195 | + const { sumGroup = {} } = this.state; | |
| 4196 | + const sumList = sumGroup[sName] || []; | |
| 4197 | + const record = data[index]; | |
| 4198 | + return sumList.includes(record[this.rowKey]) ? " tableSumColor" : ""; | |
| 4199 | + } | |
| 4200 | + | |
| 4117 | 4201 | /* 点击图片预览 */ |
| 4118 | 4202 | handlePreviewImage= (e, dataUrlArr) => { |
| 4119 | 4203 | e.stopPropagation(); /* 阻止父级穿透 */ |
| ... | ... | @@ -4343,7 +4427,8 @@ class CommonTableRc extends React.Component { |
| 4343 | 4427 | } |
| 4344 | 4428 | |
| 4345 | 4429 | genFooter= () => { |
| 4346 | - const { tableColumn, totalData, totalData1 } = this.state; | |
| 4430 | + const { tableColumn, totalData: totalData0, totalDataNew, sumGroup = {}, totalData1 } = this.state; | |
| 4431 | + const totalData = Object.keys(sumGroup).some(key => sumGroup[key]?.length) ? totalDataNew : totalData0; | |
| 4347 | 4432 | const { dNetMoney, dNetPrice } = this.props.app.decimals; |
| 4348 | 4433 | const sModelsType = commonUtils.isNotEmptyObject(this.props) && commonUtils.isNotEmptyObject(this.props.app) ? this.props.app.currentPane.sModelsType : ''; |
| 4349 | 4434 | const sumset = commonFunc.showMessage(this.props.app.commonConst, 'sumSet') || '合计'; |
| ... | ... | @@ -5448,6 +5533,8 @@ class CommonTableRc extends React.Component { |
| 5448 | 5533 | style={{ |
| 5449 | 5534 | position: 'relative', overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap', color: `${cellColor}`, backgroundColor: `${backgroundColor}`, textAlign:`${displayAlign}`, |
| 5450 | 5535 | }} |
| 5536 | + data-name={showConfig.sName} | |
| 5537 | + data-control-name={showConfig.sControlName} | |
| 5451 | 5538 | > |
| 5452 | 5539 | {(commonUtils.isNotEmptyObject(sName) && sName.substring(0, 1) === 'b') || (imgBox !== '') ? '' : |
| 5453 | 5540 | <Tooltip |
| ... | ... | @@ -6320,6 +6407,7 @@ class CommonTableRc extends React.Component { |
| 6320 | 6407 | }); |
| 6321 | 6408 | }); |
| 6322 | 6409 | } |
| 6410 | + obj.props.className = `${obj.props.className || ''}${this.handleGetSumStyle(sName, index)}`; | |
| 6323 | 6411 | return obj; |
| 6324 | 6412 | } |
| 6325 | 6413 | ... | ... |