mirror of https://github.com/ElemeFE/element
Table: add tests for summary row (#4543)
parent
22c65df30f
commit
aff079d686
|
@ -1169,6 +1169,102 @@ describe('Table', () => {
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
describe('summary row', () => {
|
||||||
|
it('should render', done => {
|
||||||
|
const vm = createVue({
|
||||||
|
template: `
|
||||||
|
<el-table :data="testData" show-summary>
|
||||||
|
<el-table-column prop="name" />
|
||||||
|
<el-table-column prop="release"/>
|
||||||
|
<el-table-column prop="director"/>
|
||||||
|
<el-table-column prop="runtime"/>
|
||||||
|
</el-table>
|
||||||
|
`,
|
||||||
|
|
||||||
|
created() {
|
||||||
|
this.testData = getTestData();
|
||||||
|
}
|
||||||
|
}, true);
|
||||||
|
|
||||||
|
setTimeout(_ => {
|
||||||
|
const footer = vm.$el.querySelector('.el-table__footer');
|
||||||
|
expect(footer).to.exist;
|
||||||
|
const cells = toArray(footer.querySelectorAll('.cell'));
|
||||||
|
expect(cells[cells.length - 1].innerText).to.equal('459');
|
||||||
|
destroyVM(vm);
|
||||||
|
done();
|
||||||
|
}, DELAY);
|
||||||
|
});
|
||||||
|
|
||||||
|
it('custom sum text', done => {
|
||||||
|
const vm = createVue({
|
||||||
|
template: `
|
||||||
|
<el-table :data="testData" show-summary sum-text="Time">
|
||||||
|
<el-table-column prop="name" />
|
||||||
|
<el-table-column prop="release"/>
|
||||||
|
<el-table-column prop="director"/>
|
||||||
|
<el-table-column prop="runtime"/>
|
||||||
|
</el-table>
|
||||||
|
`,
|
||||||
|
|
||||||
|
created() {
|
||||||
|
this.testData = getTestData();
|
||||||
|
}
|
||||||
|
}, true);
|
||||||
|
|
||||||
|
setTimeout(_ => {
|
||||||
|
const cells = toArray(vm.$el.querySelectorAll('.el-table__footer .cell'));
|
||||||
|
expect(cells[0].innerText).to.equal('Time');
|
||||||
|
destroyVM(vm);
|
||||||
|
done();
|
||||||
|
}, DELAY);
|
||||||
|
});
|
||||||
|
|
||||||
|
it('custom summary method', done => {
|
||||||
|
const vm = createVue({
|
||||||
|
template: `
|
||||||
|
<el-table :data="testData" show-summary :summary-method="getSummary">
|
||||||
|
<el-table-column prop="name" />
|
||||||
|
<el-table-column prop="release"/>
|
||||||
|
<el-table-column prop="director"/>
|
||||||
|
<el-table-column prop="runtime"/>
|
||||||
|
</el-table>
|
||||||
|
`,
|
||||||
|
|
||||||
|
created() {
|
||||||
|
this.testData = getTestData();
|
||||||
|
},
|
||||||
|
|
||||||
|
methods: {
|
||||||
|
getSummary(param) {
|
||||||
|
const { columns, data } = param;
|
||||||
|
const result = [];
|
||||||
|
columns.forEach(column => {
|
||||||
|
const prop = column.property;
|
||||||
|
if (prop === 'release') {
|
||||||
|
const dates = data.map(item => item[prop]);
|
||||||
|
const releaseYears = dates.map(date => Number(date.slice(0, 4)));
|
||||||
|
result.push(releaseYears.reduce((prev, curr) => {
|
||||||
|
return prev + curr;
|
||||||
|
}));
|
||||||
|
} else {
|
||||||
|
result.push('');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
return result;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}, true);
|
||||||
|
|
||||||
|
setTimeout(_ => {
|
||||||
|
const cells = toArray(vm.$el.querySelectorAll('.el-table__footer .cell'));
|
||||||
|
expect(cells[1].innerText).to.equal('9996');
|
||||||
|
destroyVM(vm);
|
||||||
|
done();
|
||||||
|
}, DELAY);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
describe('multi level column', () => {
|
describe('multi level column', () => {
|
||||||
it('should works', done => {
|
it('should works', done => {
|
||||||
const vm = createVue({
|
const vm = createVue({
|
||||||
|
|
Loading…
Reference in New Issue