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

some component support i18n

Browse source 
some component support i18n
This commit is contained in:
梁灏 2017-01-11 21:02:55 +08:00
parent d33b51432d
commit 4ab118119a
13 changed files with 238 additions and 30 deletions
Download patch file Download diff file Expand all files Collapse all files

25
src/components/date-picker/panel/date-range.vue
View file

@ -22,7 +22,7 @@
<span
:class="[datePrefixCls + '-header-label']"
@click="showMonthPicker('left')"
v-show="leftCurrentView === 'date'">{{ leftMonth + 1 }} 月</span>
v-show="leftCurrentView === 'date'">{{ leftMonthLabel }}</span>
<span
:class="iconBtnCls('next', '-double')"
@click="nextYear('left')"
@ -72,7 +72,7 @@
<span
:class="[datePrefixCls + '-header-label']"
@click="showMonthPicker('right')"
v-show="rightCurrentView === 'date'">{{ rightMonth + 1 }} 月</span>
v-show="rightCurrentView === 'date'">{{ rightMonthLabel }}</span>
<span
:class="iconBtnCls('next', '-double')"
@click="nextYear('right')"><Icon type="ios-arrow-right"></Icon></span>
@ -141,13 +141,14 @@
import { toDate, prevMonth, nextMonth, initTimeDate } from '../util';
import Mixin from './mixin';
import Locale from '../../../mixins/locale';
const prefixCls = 'ivu-picker-panel';
const datePrefixCls = 'ivu-date-picker';
export default {
name: 'DatePicker',
mixins: [Mixin],
mixins: [ Mixin, Locale ],
components: { Icon, DateTable, YearTable, MonthTable, TimePicker, Confirm },
data () {
return {
@ -195,20 +196,25 @@
}
},
leftYearLabel () {
const tYear = this.t('i.datepicker.year');
if (this.leftCurrentView === 'year') {
const year = this.leftTableYear;
if (!year) return '';
const startYear = Math.floor(year / 10) * 10;
return `${startYear}年 - ${startYear + 9}年`;
return `${startYear}${tYear} - ${startYear + 9}${tYear}`;
} else {
const year = this.leftCurrentView === 'month' ? this.leftTableYear : this.leftYear;
if (!year) return '';
return `${year}年`;
return `${year}${tYear}`;
}
},
leftMonth () {
return this.date.getMonth();
},
leftMonthLabel () {
const month = this.leftMonth + 1;
return this.t(`i.datepicker.month${month}`);
},
rightYear () {
return this.rightDate.getFullYear();
},
@ -220,20 +226,25 @@
}
},
rightYearLabel () {
const tYear = this.t('i.datepicker.year');
if (this.rightCurrentView === 'year') {
const year = this.rightTableYear;
if (!year) return '';
const startYear = Math.floor(year / 10) * 10;
return `${startYear}年 - ${startYear + 9}年`;
return `${startYear}${tYear} - ${startYear + 9}${tYear}`;
} else {
const year = this.rightCurrentView === 'month' ? this.rightTableYear : this.rightYear;
if (!year) return '';
return `${year}年`;
return `${year}${tYear}`;
}
},
rightMonth () {
return this.rightDate.getMonth();
},
rightMonthLabel () {
const month = this.rightMonth + 1;
return this.t(`i.datepicker.month${month}`);
},
rightDate () {
const newDate = new Date(this.date);
const month = newDate.getMonth();

14
src/components/date-picker/panel/date.vue
View file

@ -21,7 +21,7 @@
<span
:class="[datePrefixCls + '-header-label']"
@click="showMonthPicker"
v-show="currentView === 'date'">{{ month + 1 + '月' }}</span>
v-show="currentView === 'date'">{{ monthLabel }}</span>
<span
:class="iconBtnCls('next', '-double')"
@click="nextYear"><Icon type="ios-arrow-right"></Icon></span>
@ -85,6 +85,7 @@
import Confirm from '../base/confirm.vue';
import Mixin from './mixin';
import Locale from '../../../mixins/locale';
import { initTimeDate } from '../util';
@ -93,7 +94,7 @@
export default {
name: 'DatePicker',
mixins: [Mixin],
mixins: [ Mixin, Locale ],
components: { Icon, DateTable, YearTable, MonthTable, TimePicker, Confirm },
data () {
return {
@ -123,13 +124,18 @@
];
},
yearLabel () {
const tYear = this.t('i.datepicker.year');
const year = this.year;
if (!year) return '';
if (this.currentView === 'year') {
const startYear = Math.floor(year / 10) * 10;
return `${startYear}年 - ${startYear + 9}年`;
return `${startYear}${tYear} - ${startYear + 9}${tYear}`;
}
return `${year}年`;
return `${year}${tYear}`;
},
monthLabel () {
const month = this.month + 1;
return this.t(`i.datepicker.month${month}`);
}
},
watch: {

17
src/components/date-picker/panel/time-range.vue
View file

@ -4,7 +4,7 @@
<div :class="[prefixCls + '-content', prefixCls + '-content-left']">
<div :class="[timePrefixCls + '-header']">
<template v-if="showDate">{{ visibleDate }}</template>
<template v-else>开始时间</template>
<template v-else>{{ t('i.datepicker.startTime') }}</template>
</div>
<time-spinner
v-ref:time-spinner
@ -22,7 +22,7 @@
<div :class="[prefixCls + '-content', prefixCls + '-content-right']">
<div :class="[timePrefixCls + '-header']">
<template v-if="showDate">{{ visibleDateEnd }}</template>
<template v-else>结束时间</template>
<template v-else>{{ t('i.datepicker.endTime') }}</template>
</div>
<time-spinner
v-ref:time-spinner-end
@ -49,6 +49,7 @@
import Confirm from '../base/confirm.vue';
import Mixin from './mixin';
import Locale from '../../../mixins/locale';
import { initTimeDate, toDate, formatDate } from '../util';
@ -56,7 +57,7 @@
const timePrefixCls = 'ivu-time-picker';
export default {
mixins: [Mixin],
mixins: [ Mixin, Locale ],
components: { TimeSpinner, Confirm },
data () {
return {
@ -95,11 +96,17 @@
},
visibleDate () {
const date = this.date || initTimeDate();
return `${date.getFullYear()}年 ${date.getMonth() + 1}月`;
const tYear = this.t('i.datepicker.year');
const month = date.getMonth() + 1;
const tMonth = this.t(`i.datepicker.month${month}`);
return `${date.getFullYear()}${tYear} ${tMonth}`;
},
visibleDateEnd () {
const date = this.dateEnd || initTimeDate();
return `${date.getFullYear()}年 ${date.getMonth() + 1}月`;
const tYear = this.t('i.datepicker.year');
const month = date.getMonth() + 1;
const tMonth = this.t(`i.datepicker.month${month}`);
return `${date.getFullYear()}${tYear} ${tMonth}`;
}
},
watch: {

8
src/components/date-picker/panel/time.vue
View file

@ -28,6 +28,7 @@
import Confirm from '../base/confirm.vue';
import Mixin from './mixin';
import Locale from '../../../mixins/locale';
import { initTimeDate } from '../util';
@ -35,7 +36,7 @@
const timePrefixCls = 'ivu-time-picker';
export default {
mixins: [Mixin],
mixins: [ Mixin, Locale ],
components: { TimeSpinner, Confirm },
data () {
return {
@ -61,7 +62,10 @@
},
visibleDate () {
const date = this.date;
return `${date.getFullYear()}年 ${date.getMonth() + 1}月`;
const month = date.getMonth() + 1;
const tYear = this.t('i.datepicker.year');
const tMonth = this.t(`i.datepicker.month${month}`);
return `${date.getFullYear()}${tYear} ${tMonth}`;
}
},
watch: {