mirror of
https://gitee.com/ant-design/ant-design.git
synced 2024-12-03 04:30:06 +08:00
parent
fc8189303d
commit
58922a34c6
@ -186,3 +186,197 @@ exports[`Transfer should render correctly 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
|
||||
exports[`Transfer should show sorted targetkey 1`] = `
|
||||
<div
|
||||
class="ant-transfer"
|
||||
>
|
||||
<div
|
||||
class="ant-transfer-list"
|
||||
>
|
||||
<div
|
||||
class="ant-transfer-list-header"
|
||||
>
|
||||
<label
|
||||
class="ant-checkbox-wrapper"
|
||||
>
|
||||
<span
|
||||
class="ant-checkbox"
|
||||
>
|
||||
<input
|
||||
class="ant-checkbox-input"
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
class="ant-checkbox-inner"
|
||||
/>
|
||||
</span>
|
||||
</label>
|
||||
<span
|
||||
class="ant-transfer-list-header-selected"
|
||||
>
|
||||
<span>
|
||||
1
|
||||
</span>
|
||||
<span
|
||||
class="ant-transfer-list-header-title"
|
||||
/>
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="ant-transfer-list-body"
|
||||
>
|
||||
<ul
|
||||
class="ant-transfer-list-content"
|
||||
>
|
||||
<li
|
||||
class="ant-transfer-list-content-item"
|
||||
title="a"
|
||||
>
|
||||
<label
|
||||
class="ant-checkbox-wrapper"
|
||||
>
|
||||
<span
|
||||
class="ant-checkbox"
|
||||
>
|
||||
<input
|
||||
class="ant-checkbox-input"
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
class="ant-checkbox-inner"
|
||||
/>
|
||||
</span>
|
||||
</label>
|
||||
<span>
|
||||
a
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
<div
|
||||
class="ant-transfer-list-body-not-found"
|
||||
>
|
||||
Not Found
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="ant-transfer-operation"
|
||||
>
|
||||
<button
|
||||
class="ant-btn ant-btn-primary ant-btn-sm"
|
||||
disabled=""
|
||||
type="button"
|
||||
>
|
||||
<span>
|
||||
<i
|
||||
class="anticon anticon-left"
|
||||
/>
|
||||
</span>
|
||||
</button>
|
||||
<button
|
||||
class="ant-btn ant-btn-primary ant-btn-sm"
|
||||
disabled=""
|
||||
type="button"
|
||||
>
|
||||
<span>
|
||||
<i
|
||||
class="anticon anticon-right"
|
||||
/>
|
||||
</span>
|
||||
</button>
|
||||
</div>
|
||||
<div
|
||||
class="ant-transfer-list"
|
||||
>
|
||||
<div
|
||||
class="ant-transfer-list-header"
|
||||
>
|
||||
<label
|
||||
class="ant-checkbox-wrapper"
|
||||
>
|
||||
<span
|
||||
class="ant-checkbox"
|
||||
>
|
||||
<input
|
||||
class="ant-checkbox-input"
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
class="ant-checkbox-inner"
|
||||
/>
|
||||
</span>
|
||||
</label>
|
||||
<span
|
||||
class="ant-transfer-list-header-selected"
|
||||
>
|
||||
<span>
|
||||
2
|
||||
</span>
|
||||
<span
|
||||
class="ant-transfer-list-header-title"
|
||||
/>
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="ant-transfer-list-body"
|
||||
>
|
||||
<ul
|
||||
class="ant-transfer-list-content"
|
||||
>
|
||||
<li
|
||||
class="ant-transfer-list-content-item"
|
||||
title="c"
|
||||
>
|
||||
<label
|
||||
class="ant-checkbox-wrapper"
|
||||
>
|
||||
<span
|
||||
class="ant-checkbox"
|
||||
>
|
||||
<input
|
||||
class="ant-checkbox-input"
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
class="ant-checkbox-inner"
|
||||
/>
|
||||
</span>
|
||||
</label>
|
||||
<span>
|
||||
c
|
||||
</span>
|
||||
</li>
|
||||
<li
|
||||
class="ant-transfer-list-content-item"
|
||||
title="b"
|
||||
>
|
||||
<label
|
||||
class="ant-checkbox-wrapper"
|
||||
>
|
||||
<span
|
||||
class="ant-checkbox"
|
||||
>
|
||||
<input
|
||||
class="ant-checkbox-input"
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
class="ant-checkbox-inner"
|
||||
/>
|
||||
</span>
|
||||
</label>
|
||||
<span>
|
||||
b
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
<div
|
||||
class="ant-transfer-list-body-not-found"
|
||||
>
|
||||
Not Found
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
|
@ -229,4 +229,23 @@ describe('Transfer', () => {
|
||||
wrapper.find(TransferList).at(0).find('.ant-transfer-list-header input[type="checkbox"]').simulate('change');
|
||||
expect(handleSelectChange).toHaveBeenLastCalledWith(['b'], []);
|
||||
});
|
||||
|
||||
it('should show sorted targetkey', () => {
|
||||
const sortedTargetKeyProps = {
|
||||
dataSource: [{
|
||||
key: 'a',
|
||||
title: 'a',
|
||||
}, {
|
||||
key: 'b',
|
||||
title: 'b',
|
||||
}, {
|
||||
key: 'c',
|
||||
title: 'c',
|
||||
}],
|
||||
targetKeys: ['c', 'b'],
|
||||
lazy: false,
|
||||
};
|
||||
const wrapper = render(<Transfer {...sortedTargetKeyProps} render={item => item.title} />);
|
||||
expect(wrapper).toMatchSnapshot();
|
||||
});
|
||||
});
|
||||
|
@ -138,18 +138,30 @@ abstract class Transfer extends React.Component<TransferProps, any> {
|
||||
|
||||
const leftDataSource: TransferItem[] = [];
|
||||
const rightDataSource: TransferItem[] = [];
|
||||
const tempRightDataSource: TransferItem[] = [];
|
||||
|
||||
dataSource.forEach(record => {
|
||||
if (rowKey) {
|
||||
record.key = rowKey(record);
|
||||
}
|
||||
if (targetKeys.includes(record.key)) {
|
||||
rightDataSource.push(record);
|
||||
tempRightDataSource.push(record);
|
||||
} else {
|
||||
leftDataSource.push(record);
|
||||
}
|
||||
});
|
||||
|
||||
const itemMap = {};
|
||||
tempRightDataSource.forEach((item) => {
|
||||
itemMap[item.key] = item;
|
||||
});
|
||||
|
||||
targetKeys.forEach((targetKey) => {
|
||||
if (itemMap[targetKey]) {
|
||||
rightDataSource.push(itemMap[targetKey]);
|
||||
}
|
||||
});
|
||||
|
||||
this.splitedDataSource = {
|
||||
leftDataSource,
|
||||
rightDataSource,
|
||||
|
Loading…
Reference in New Issue
Block a user