drip-public/iview
6
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge pull request #2170 from SergioCrisostomo/use-locale-formated-year-month

Browse source 
Correct month calculation and add specs for date-picker labels
This commit is contained in:
Aresn 2017-10-23 04:22:44 -05:00 • committed by GitHub
commit b92a1b5c99
3 changed files with 68 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
src/components/date-picker/util.js
View file

@ -67,7 +67,7 @@ export const formatDateLabels = (function() {
Formats:
yyyy - 4 digit year
m - month, numeric, 1 - 12
m - month, numeric, 01 - 12
mm - month, numeric, 01 - 12
mmm - month, 3 letters, as in `toLocaleDateString`
Mmm - month, 3 letters, capitalize the return from `toLocaleDateString`
mmmm - month, full name, as in `toLocaleDateString`
@ -76,8 +76,8 @@ export const formatDateLabels = (function() {
const formats = {
yyyy: date => date.getFullYear(),
m: date => date.getMonth(),
mm: date => ('0' + date.getMonth()).slice(-2),
m: date => date.getMonth() + 1,
mm: date => ('0' + (date.getMonth() + 1)).slice(-2),
mmm: (date, locale) => {
const monthName = date.toLocaleDateString(locale, {
month: 'long'

17
test/unit/specs/assets/locale-expects.js Normal file
View file

@ -0,0 +1,17 @@
export default {
'de-DE': 'Oktober 2030',
'en-US': 'October 2030',
'es-ES': 'octubre 2030',
'fr-FR': 'octobre 2030',
'id-ID': 'Oktober 2030',
'ja-JP': '2030年 10月',
'ko-KR': '2030년 10월',
'pt-BR': 'outubro de 2030',
'pt-PT': 'outubro de 2030',
'ru-RU': 'Октябрь 2030',
'sv-SE': 'oktober 2030',
'tr-TR': 'Ekim 2030',
'vi-VN': 'Tháng 10/2030',
'zh-CN': '2030年 10月',
'zh-TW': '2030年 10月'
};

37
test/unit/specs/date-picker.spec.js
View file

@ -191,4 +191,41 @@ describe('DatePicker.vue', () => {
});
});
it('should render date-picker label correctly in zh-CN', done => {
vm = createVue(`
<Date-picker type="date"></Date-picker>
`);
const picker = vm.$children[0];
picker.handleIconClick();
vm.$nextTick(() => {
const now = new Date();
const labels = vm.$el.querySelectorAll('.ivu-picker-panel-body .ivu-date-picker-header-label');
const labelText = [...labels].map(el => el.textContent).join(' ');
expect(labelText).to.equal([now.getFullYear() + '年', now.getMonth() + 1 + '月'].join(' '));
done();
});
});
it('Should format labels correctly', done => {
const formater = require('../../../src/components/date-picker/util').formatDateLabels;
const expectedResults = require('./assets/locale-expects.js').default;
const locales = [
'de-DE', 'en-US', 'es-ES', 'fr-FR', 'id-ID', 'ja-JP', 'ko-KR', 'pt-BR',
'pt-PT', 'ru-RU', 'sv-SE', 'tr-TR', 'vi-VN', 'zh-CN', 'zh-TW'
].reduce((obj, locale) => {
obj[locale] = require('../../../src/locale/lang/' + locale).default;
return obj;
}, {});
const testDate = new Date(2030, 9); // October 2030
Object.keys(locales).forEach(locale => {
const format = locales[locale].i.datepicker.datePanelLabel;
const f = formater(locale, format, testDate);
const labelText = f.labels.map(obj => obj.label).join(f.separator);
expect(labelText).to.equal(expectedResults[locale]);
});
expect(Object.keys(locales).length > 0).to.equal(true);
done();
});
});