CommobileModalList.jsx
3.53 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
/*eslint-disable*/
import React, { PureComponent } from 'react';
import { createForm } from 'rc-form';
import CommobileBase from '../../mobile/common/CommobileBase';
import CommobileListEvent from './CommobileListEvent';
import { Checkbox, ListView, TextareaItem } from 'antd-mobile';
import * as commonUtils from '../../utils/utils';
const CheckboxItem = Checkbox.CheckboxItem;
const dataSource = new ListView.DataSource({
rowHasChanged: (row1, row2) => row2,
});
class listContent extends PureComponent {
constructor(props) {
super(props);
}
render() {
const {
slaveConfig, slaveData: slaveDataOld, slaveSelectedRowKeys: slaveSelectedRowKeysOld,
needCheck, setSelectedRowkeys, filterSlaveData,
} = this.props;
let slaveDataOld2 = slaveDataOld === undefined ? [] : slaveDataOld;
typeof filterSlaveData === 'function' && (slaveDataOld2 = filterSlaveData(slaveDataOld2));
const slaveData = dataSource.cloneWithRows(slaveDataOld2);
const slaveSelectedRowKeys = slaveSelectedRowKeysOld === undefined ? [] : slaveSelectedRowKeysOld;
typeof setSelectedRowkeys === 'function' && setSelectedRowkeys(slaveDataOld2?.filter(i => i && slaveSelectedRowKeys.includes(i.sId)));
const separator = (sectionID, rowID) => (
<div
key={`${sectionID}-${rowID}`}
style={{
backgroundColor: '#F5F5F9',
height: 6,
borderTop: '1px solid #ECECED',
borderBottom: '1px solid #ECECED',
}}
/>
);
const row = (rowData, sectionID, rowID) => {
if (commonUtils.isEmptyObject(slaveConfig) || !Array.isArray(slaveConfig.gdsconfigformslave)) return <></>;
const obj = JSON.parse(JSON.stringify(rowData)); // 深拷贝
const allkey = slaveConfig.gdsconfigformslave.filter(item => item.bVisible && item.sName !== '')
const topInfo = needCheck && <CheckboxItem
key={rowData.sId}
checked={slaveSelectedRowKeys.findIndex(item => item === rowData.sId) > -1}
onChange={e => this.props.onCheckboxChange(e, rowData.sId)}
style={{
width: '100%',
marginRight: 0,
lineHeight: '30px',
color: '#888',
fontSize: 16,
fontWeight: 'bold',
borderBottom: '1px solid #F6F6F6',
}}
>
{ this.props.topTitle || '标签信息' }
</CheckboxItem>
const content = allkey.map(
i => {
if (typeof obj?.[i?.sName] === 'string' || typeof obj?.[i?.sName] === 'number') {
return <TextareaItem
style={{
fontWeight: 'bold',
color: '#888',
}}
title={<div style={{ fontWeight: 'bold', color: '#888', }}>{i?.showName || ''}</div>}
value={(obj?.[i?.sName]).toString()}
disabled
ref={el => this.autoFocusInst = el}
autoHeight
/>
}
return;
}
)
return <>
<div>
{topInfo}
{content}
</div>
</>
};
return <>
{Array.isArray(slaveDataOld2) && slaveDataOld2.length ?
<ListView
dataSource={slaveData}
renderRow={row}
renderSeparator={separator}
style={{
height: '100%',
}}
/> :
<div style={{
height: '100%',
textAlign: 'center',
lineHeight: '60vh',
}}>
暂无数据
</div>
}
</>
}
}
const ListComponent = createForm()(listContent);
export default CommobileBase(CommobileListEvent(ListComponent));