github
/
ant-design-vue
mirror of https://github.com/vueComponent/ant-design-vue
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

test: update statistic test

pull/1845/head
tangjinzhou 2020-02-23 10:11:00 +08:00
parent ed2b541e87
commit 98a59074d3
5 changed files with 34 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
build/config.js
View File

@ -1,5 +1,5 @@
module.exports = {
dev: {
componentName: 'skeleton', // dev components
componentName: 'statistic', // dev components
},
};

14
components/statistic/__tests__/__snapshots__/demo.test.js.snap
View File

@ -16,7 +16,7 @@ exports[`renders ./components/statistic/demo/basic.md correctly 1`] = `
exports[`renders ./components/statistic/demo/card.md correctly 1`] = `
<div style="background: rgb(236, 236, 236); padding: 30px;">
<div class="ant-row" style="margin-left: -8px; margin-right: -8px;">
<div class="ant-col-12" style="padding-left: 8px; padding-right: 8px;">
<div class="ant-col ant-col-12" style="padding-left: 8px; padding-right: 8px;">
<div class="ant-card ant-card-bordered">
<div class="ant-card-body">
<div class="ant-statistic" style="margin-right: 50px;">
@ -26,7 +26,7 @@ exports[`renders ./components/statistic/demo/card.md correctly 1`] = `
</div>
</div>
</div>
<div class="ant-col-12" style="padding-left: 8px; padding-right: 8px;">
<div class="ant-col ant-col-12" style="padding-left: 8px; padding-right: 8px;">
<div class="ant-card ant-card-bordered">
<div class="ant-card-body">
<div class="ant-statistic" valueclass="demo-class">
@ -42,19 +42,19 @@ exports[`renders ./components/statistic/demo/card.md correctly 1`] = `
exports[`renders ./components/statistic/demo/countdown.md correctly 1`] = `
<div class="ant-row" style="margin-left: -8px; margin-right: -8px;">
<div class="ant-col-12" style="padding-left: 8px; padding-right: 8px;">
<div class="ant-col ant-col-12" style="padding-left: 8px; padding-right: 8px;">
<div class="ant-statistic" style="margin-right: 50px;">
<div class="ant-statistic-title">Countdown</div>
<div class="ant-statistic-content"><span class="ant-statistic-content-value">48:00:30</span></div>
</div>
</div>
<div class="ant-col-12" style="padding-left: 8px; padding-right: 8px;">
<div class="ant-col ant-col-12" style="padding-left: 8px; padding-right: 8px;">
<div class="ant-statistic" style="margin-right: 50px;">
<div class="ant-statistic-title">Million Seconds</div>
<div class="ant-statistic-content"><span class="ant-statistic-content-value">48:00:30:000</span></div>
</div>
</div>
<div class="ant-col-24" style="padding-left: 8px; padding-right: 8px; margin-top: 32px;">
<div class="ant-col ant-col-24" style="padding-left: 8px; padding-right: 8px; margin-top: 32px;">
<div class="ant-statistic">
<div class="ant-statistic-title">Day Level</div>
<div class="ant-statistic-content"><span class="ant-statistic-content-value">2 天 0 时 0 分 30 秒</span></div>
@ -65,13 +65,13 @@ exports[`renders ./components/statistic/demo/countdown.md correctly 1`] = `
exports[`renders ./components/statistic/demo/unit.md correctly 1`] = `
<div class="ant-row" style="margin-left: -8px; margin-right: -8px;">
<div class="ant-col-12" style="padding-left: 8px; padding-right: 8px;">
<div class="ant-col ant-col-12" style="padding-left: 8px; padding-right: 8px;">
<div class="ant-statistic" style="margin-right: 50px;">
<div class="ant-statistic-title">Feedback</div>
<div class="ant-statistic-content"><span class="ant-statistic-content-value"><span class="ant-statistic-content-value-int">1,128</span></span><span class="ant-statistic-content-suffix"><i aria-label="icon: like" class="anticon anticon-like"><svg viewBox="64 64 896 896" data-icon="like" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M885.9 533.7c16.8-22.2 26.1-49.4 26.1-77.7 0-44.9-25.1-87.4-65.5-111.1a67.67 67.67 0 0 0-34.3-9.3H572.4l6-122.9c1.4-29.7-9.1-57.9-29.5-79.4A106.62 106.62 0 0 0 471 99.9c-52 0-98 35-111.8 85.1l-85.9 311H144c-17.7 0-32 14.3-32 32v364c0 17.7 14.3 32 32 32h601.3c9.2 0 18.2-1.8 26.5-5.4 47.6-20.3 78.3-66.8 78.3-118.4 0-12.6-1.8-25-5.4-37 16.8-22.2 26.1-49.4 26.1-77.7 0-12.6-1.8-25-5.4-37 16.8-22.2 26.1-49.4 26.1-77.7-.2-12.6-2-25.1-5.6-37.1zM184 852V568h81v284h-81zm636.4-353l-21.9 19 13.9 25.4a56.2 56.2 0 0 1 6.9 27.3c0 16.5-7.2 32.2-19.6 43l-21.9 19 13.9 25.4a56.2 56.2 0 0 1 6.9 27.3c0 16.5-7.2 32.2-19.6 43l-21.9 19 13.9 25.4a56.2 56.2 0 0 1 6.9 27.3c0 22.4-13.2 42.6-33.6 51.8H329V564.8l99.5-360.5a44.1 44.1 0 0 1 42.2-32.3c7.6 0 15.1 2.2 21.1 6.7 9.9 7.4 15.2 18.6 14.6 30.5l-9.6 198.4h314.4C829 418.5 840 436.9 840 456c0 16.5-7.2 32.1-19.6 43z"></path></svg></i></span></div>
</div>
</div>
<div class="ant-col-12" style="padding-left: 8px; padding-right: 8px;">
<div class="ant-col ant-col-12" style="padding-left: 8px; padding-right: 8px;">
<div class="ant-statistic" valueclass="demo-class">
<div class="ant-statistic-title">Unmerged</div>
<div class="ant-statistic-content"><span class="ant-statistic-content-value"><span class="ant-statistic-content-value-int">93</span></span><span class="ant-statistic-content-suffix"><span> / 100</span></span></div>

11
components/statistic/__tests__/index.test.js
View File

@ -3,8 +3,14 @@ import { asyncExpect } from '@/tests/utils';
import MockDate from 'mockdate';
import moment from 'moment';
import Statistic from '..';
import { formatTimeStr } from '../utils';
import { sleep } from '../../../tests/utils';
import mountTest from '../../../tests/shared/mountTest';
describe('Statistic', () => {
mountTest(Statistic);
mountTest(Statistic.Countdown);
beforeAll(() => {
MockDate.set(moment('2018-11-28 00:00:00'));
});
@ -104,4 +110,9 @@ describe('Statistic', () => {
// expect(instance.countdownId).toBe(undefined);
});
});
describe('utils', () => {
it('format should support escape', () => {
expect(formatTimeStr(1000 * 60 * 60 * 24, 'D [Day]')).toBe('1 Day');
});
});
});

2
components/statistic/demo/countdown.md
View File

@ -41,7 +41,7 @@ Countdown component.
},
methods: {
onFinish() {
console.log('over');
console.log('finished!');
},
},
};

17
components/statistic/utils.js
View File

@ -14,10 +14,14 @@ const timeUnits = [
['S', 1], // million seconds
];
function formatTimeStr(duration, format) {
export function formatTimeStr(duration, format) {
let leftDuration = duration;
return timeUnits.reduce((current, [name, unit]) => {
const escapeRegex = /\[[^\]]*\]/g;
const keepList = (format.match(escapeRegex) || []).map(str => str.slice(1, -1));
const templateText = format.replace(escapeRegex, '[]');
const replacedText = timeUnits.reduce((current, [name, unit]) => {
if (current.indexOf(name) !== -1) {
const value = Math.floor(leftDuration / unit);
leftDuration -= value * unit;
@ -27,7 +31,14 @@ function formatTimeStr(duration, format) {
});
}
return current;
}, format);
}, templateText);
let index = 0;
return replacedText.replace(escapeRegex, () => {
const match = keepList[index];
index += 1;
return match;
});
}
export function formatCountdown(value, config) {