chenhaodong / mew-iview

Commit b92a1b5c99643f0147b1eb09e18ddff81e177e43

Authored by Aresn
Committed by GitHub
2 parents 6261a49d 3ed12b4e

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

Correct month calculation and add specs for date-picker labels
Showing 3 changed files with 70 additions and 16 deletions   Show diff stats
Inline Side-by-side
src/components/date-picker/util.js
  Show/Hide comments   View file @b92a1b5
... ... @@ -67,7 +67,7 @@ export const formatDateLabels = (function() {
67 67 Formats:
68 68 yyyy - 4 digit year
69 69 m - month, numeric, 1 - 12
70   - m - month, numeric, 01 - 12
  70 + mm - month, numeric, 01 - 12
71 71 mmm - month, 3 letters, as in `toLocaleDateString`
72 72 Mmm - month, 3 letters, capitalize the return from `toLocaleDateString`
73 73 mmmm - month, full name, as in `toLocaleDateString`
... ... @@ -76,8 +76,8 @@ export const formatDateLabels = (function() {
76 76  
77 77 const formats = {
78 78 yyyy: date => date.getFullYear(),
79   - m: date => date.getMonth(),
80   - mm: date => ('0' + date.getMonth()).slice(-2),
  79 + m: date => date.getMonth() + 1,
  80 + mm: date => ('0' + (date.getMonth() + 1)).slice(-2),
81 81 mmm: (date, locale) => {
82 82 const monthName = date.toLocaleDateString(locale, {
83 83 month: 'long'
... ...
test/unit/specs/assets/locale-expects.js 0 → 100644
  Show/Hide comments   View file @b92a1b5
  1 +export default {
  2 + 'de-DE': 'Oktober 2030',
  3 + 'en-US': 'October 2030',
  4 + 'es-ES': 'octubre 2030',
  5 + 'fr-FR': 'octobre 2030',
  6 + 'id-ID': 'Oktober 2030',
  7 + 'ja-JP': '2030年 10月',
  8 + 'ko-KR': '2030년 10월',
  9 + 'pt-BR': 'outubro de 2030',
  10 + 'pt-PT': 'outubro de 2030',
  11 + 'ru-RU': 'Октябрь 2030',
  12 + 'sv-SE': 'oktober 2030',
  13 + 'tr-TR': 'Ekim 2030',
  14 + 'vi-VN': 'Tháng 10/2030',
  15 + 'zh-CN': '2030年 10月',
  16 + 'zh-TW': '2030年 10月'
  17 +};
... ...
test/unit/specs/date-picker.spec.js
  Show/Hide comments   View file @b92a1b5
... ... @@ -103,19 +103,19 @@ describe('DatePicker.vue', () => {
103 103  
104 104 vm.dateType = 'year';
105 105 promissedTick(picker)
106   - .then(() => {
107   - expect(picker.type).to.equal('year');
108   - expect(picker.selectionMode).to.equal('year');
109   -
110   - vm.dateType = 'date';
111   - return promissedTick(picker);
112   - })
113   - .then(() => {
114   - expect(picker.type).to.equal('date');
115   - expect(picker.selectionMode).to.equal('day');
116   -
117   - done();
118   - });
  106 + .then(() => {
  107 + expect(picker.type).to.equal('year');
  108 + expect(picker.selectionMode).to.equal('year');
  109 +
  110 + vm.dateType = 'date';
  111 + return promissedTick(picker);
  112 + })
  113 + .then(() => {
  114 + expect(picker.type).to.equal('date');
  115 + expect(picker.selectionMode).to.equal('day');
  116 +
  117 + done();
  118 + });
119 119 });
120 120 });
121 121  
... ... @@ -191,4 +191,41 @@ describe('DatePicker.vue', () => {
191 191 });
192 192 });
193 193  
  194 + it('should render date-picker label correctly in zh-CN', done => {
  195 + vm = createVue(`
  196 + <Date-picker type="date"></Date-picker>
  197 + `);
  198 +
  199 + const picker = vm.$children[0];
  200 + picker.handleIconClick();
  201 + vm.$nextTick(() => {
  202 + const now = new Date();
  203 + const labels = vm.$el.querySelectorAll('.ivu-picker-panel-body .ivu-date-picker-header-label');
  204 + const labelText = [...labels].map(el => el.textContent).join(' ');
  205 + expect(labelText).to.equal([now.getFullYear() + '年', now.getMonth() + 1 + '月'].join(' '));
  206 + done();
  207 + });
  208 + });
  209 +
  210 + it('Should format labels correctly', done => {
  211 + const formater = require('../../../src/components/date-picker/util').formatDateLabels;
  212 + const expectedResults = require('./assets/locale-expects.js').default;
  213 + const locales = [
  214 + 'de-DE', 'en-US', 'es-ES', 'fr-FR', 'id-ID', 'ja-JP', 'ko-KR', 'pt-BR',
  215 + 'pt-PT', 'ru-RU', 'sv-SE', 'tr-TR', 'vi-VN', 'zh-CN', 'zh-TW'
  216 + ].reduce((obj, locale) => {
  217 + obj[locale] = require('../../../src/locale/lang/' + locale).default;
  218 + return obj;
  219 + }, {});
  220 + const testDate = new Date(2030, 9); // October 2030
  221 +
  222 + Object.keys(locales).forEach(locale => {
  223 + const format = locales[locale].i.datepicker.datePanelLabel;
  224 + const f = formater(locale, format, testDate);
  225 + const labelText = f.labels.map(obj => obj.label).join(f.separator);
  226 + expect(labelText).to.equal(expectedResults[locale]);
  227 + });
  228 + expect(Object.keys(locales).length > 0).to.equal(true);
  229 + done();
  230 + });
194 231 });
... ...