github
/
element
mirror of https://github.com/ElemeFE/element
1
0
Fork 0
Code Issues Releases Wiki Activity

Add locale feature (#678) 

fix
pull/685/head
cinwell.li 2016-10-27 17:31:22 +08:00 committed by FuryBean
parent a1b83b5540
commit f960ea50b9
32 changed files with 295 additions and 182 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
.babelrc
View File

@ -1,4 +1,16 @@
{
"presets": [["es2015", { "loose": true }]],
"plugins": ["transform-vue-jsx"]
"plugins": ["transform-vue-jsx"],
"env": {
"utils": {
"plugins": [
["module-resolver", {
"root": ["element-ui"],
"alias": {
"element-ui/src/locale": "element-ui/lib/locale"
}
}]
]
}
}
}

4
build/bin/build-entry.js
View File

@ -8,10 +8,12 @@ var OUTPUT_PATH = path.join(__dirname, '../../src/index.js');
var IMPORT_TEMPLATE = 'import {{name}} from \'../packages/{{package}}/index.js\';';
var INSTALL_COMPONENT_TEMPLATE = ' Vue.component({{name}}.name, {{name}});';
var MAIN_TEMPLATE = `{{include}}
import locale from 'element-ui/src/locale';
const install = function(Vue) {
const install = function(Vue, opts = {}) {
/* istanbul ignore if */
if (install.installed) return;
locale.use(opts.locale);
{{install}}

3
package.json
View File

@ -17,7 +17,7 @@
"deploy": "npm run build:file && cooking build -c build/cooking.demo.js -p && echo element.eleme.io>>examples/element-ui/CNAME && gh-pages -d examples/element-ui --remote eleme && del examples/element-ui",
"pub": "sh build/release.sh",
"pub:all": "npm run dist:all && lerna publish",
"build:utils": "babel src --out-dir lib --ignore index.js",
"build:utils": "BABEL_ENV=utils babel src --out-dir lib --ignore src/index.js",
"clean": "rimraf lib && rimraf packages/*/lib && rimraf test/**/coverage",
"lint": "eslint src/**/* test/**/* packages/**/*.{js,vue} build/**/* --quiet",
"test:watch": "karma start test/unit/karma.conf.js",
@ -50,6 +50,7 @@
"babel-core": "^6.14.0",
"babel-helper-vue-jsx-merge-props": "^2.0.0",
"babel-loader": "^6.2.5",
"babel-plugin-module-resolver": "^2.2.0",
"babel-plugin-syntax-jsx": "^6.8.0",
"babel-plugin-transform-vue-jsx": "^3.1.0",
"babel-preset-es2015": "^6.14.0",

4
packages/checkbox/src/checkbox-group.vue
View File

@ -1,10 +1,10 @@
<script>
import emitter from 'element-ui/src/mixins/emitter';
import Emitter from 'element-ui/src/mixins/emitter';
export default {
name: 'ElCheckboxGroup',
mixins: [emitter],
mixins: [Emitter],
props: {
value: {}

2
packages/date-picker/index.js
View File

@ -1,7 +1,7 @@
import DatePicker from './src/picker/date-picker';
/* istanbul ignore next */
module.exports = function install(Vue) {
DatePicker.install = function install(Vue) {
Vue.component(DatePicker.name, DatePicker);
};

30
packages/date-picker/src/basic/date-table.vue
View File

@ -8,14 +8,14 @@
:class="{ 'is-week-mode': selectionMode === 'week' }">
<tbody>
<tr>
<th v-if="showWeekNumber">{{ $t('datepicker.week') }}</th>
<th>{{ $t('datepicker.weeks.sun') }}</th>
<th>{{ $t('datepicker.weeks.mon') }}</th>
<th>{{ $t('datepicker.weeks.tue') }}</th>
<th>{{ $t('datepicker.weeks.wed') }}</th>
<th>{{ $t('datepicker.weeks.thu') }}</th>
<th>{{ $t('datepicker.weeks.fri') }}</th>
<th>{{ $t('datepicker.weeks.sat') }}</th>
<th v-if="showWeekNumber">{{ $t('el.datepicker.week') }}</th>
<th>{{ $t('el.datepicker.weeks.sun') }}</th>
<th>{{ $t('el.datepicker.weeks.mon') }}</th>
<th>{{ $t('el.datepicker.weeks.tue') }}</th>
<th>{{ $t('el.datepicker.weeks.wed') }}</th>
<th>{{ $t('el.datepicker.weeks.thu') }}</th>
<th>{{ $t('el.datepicker.weeks.fri') }}</th>
<th>{{ $t('el.datepicker.weeks.sat') }}</th>
</tr>
<tr
class="el-date-table__row"
@ -24,16 +24,16 @@
<td
v-for="cell in row"
:class="getCellClasses(cell)"
v-text="cell.type === 'today' ? $t('datepicker.today') : cell.text"></td>
v-text="cell.type === 'today' ? $t('el.datepicker.today') : cell.text"></td>
</tr>
</tbody>
</table>
</template>
<script>
import { $t, getFirstDayOfMonth, getDayCountOfMonth, getWeekNumber, getStartDateOfMonth, DAY_DURATION } from '../util';
import { getFirstDayOfMonth, getDayCountOfMonth, getWeekNumber, getStartDateOfMonth, DAY_DURATION } from '../util';
import { hasClass } from 'wind-dom/src/class';
import Vue from 'vue';
import Locale from 'element-ui/src/mixins/locale';
const clearHours = function(time) {
const cloneDate = new Date(time);
@ -42,6 +42,8 @@
};
export default {
mixins: [Locale],
props: {
date: {},
@ -157,7 +159,7 @@
cell.disabled = typeof disabledDate === 'function' && disabledDate(new Date(time));
Vue.set(row, this.showWeekNumber ? j + 1 : j, cell);
this.$set(row, this.showWeekNumber ? j + 1 : j, cell);
}
if (this.selectionMode === 'week') {
@ -214,10 +216,6 @@
},
methods: {
$t(...args) {
return $t.apply(this, args);
},
getCellClasses(cell) {
const selectionMode = this.selectionMode;
const monthDate = this.monthDate;

32
packages/date-picker/src/basic/month-table.vue
View File

@ -3,44 +3,44 @@
<tbody>
<tr>
<td :class="{ current: month === 0 }">
<a class="cell">{{ $t('datepicker.months.jan') }}</a>
<a class="cell">{{ $t('el.datepicker.months.jan') }}</a>
</td>
<td :class="{ current: month === 1 }">
<a class="cell">{{ $t('datepicker.months.feb') }}</a>
<a class="cell">{{ $t('el.datepicker.months.feb') }}</a>
</td>
<td :class="{ current: month === 2 }">
<a class="cell">{{ $t('datepicker.months.mar') }}</a>
<a class="cell">{{ $t('el.datepicker.months.mar') }}</a>
</td>
<td :class="{ current: month === 3 }">
<a class="cell">{{ $t('datepicker.months.apr') }}</a>
<a class="cell">{{ $t('el.datepicker.months.apr') }}</a>
</td>
</tr>
<tr>
<td :class="{ current: month === 4 }">
<a class="cell">{{ $t('datepicker.months.may') }}</a>
<a class="cell">{{ $t('el.datepicker.months.may') }}</a>
</td>
<td :class="{ current: month === 5 }">
<a class="cell">{{ $t('datepicker.months.jun') }}</a>
<a class="cell">{{ $t('el.datepicker.months.jun') }}</a>
</td>
<td :class="{ current: month === 6 }">
<a class="cell">{{ $t('datepicker.months.jul') }}</a>
<a class="cell">{{ $t('el.datepicker.months.jul') }}</a>
</td>
<td :class="{ current: month === 7 }">
<a class="cell">{{ $t('datepicker.months.aug') }}</a>
<a class="cell">{{ $t('el.datepicker.months.aug') }}</a>
</td>
</tr>
<tr>
<td :class="{ current: month === 8 }">
<a class="cell">{{ $t('datepicker.months.sep') }}</a>
<a class="cell">{{ $t('el.datepicker.months.sep') }}</a>
</td>
<td :class="{ current: month === 9 }">
<a class="cell">{{ $t('datepicker.months.oct') }}</a>
<a class="cell">{{ $t('el.datepicker.months.oct') }}</a>
</td>
<td :class="{ current: month === 10 }">
<a class="cell">{{ $t('datepicker.months.nov') }}</a>
<a class="cell">{{ $t('el.datepicker.months.nov') }}</a>
</td>
<td :class="{ current: month === 11 }">
<a class="cell">{{ $t('datepicker.months.dec') }}</a>
<a class="cell">{{ $t('el.datepicker.months.dec') }}</a>
</td>
</tr>
</tbody>
@ -48,7 +48,7 @@
</template>
<script type="text/babel">
import { $t } from '../util';
import Locale from 'element-ui/src/mixins/locale';
export default {
props: {
@ -56,12 +56,8 @@
type: Number
}
},
mixins: [Locale],
methods: {
$t(...args) {
return $t.apply(this, args);
},
handleMonthTableClick(event) {
const target = event.target;
if (target.tagName !== 'A') return;

25
packages/date-picker/src/panel/date-range.vue
View File

@ -22,7 +22,7 @@
<span class="el-date-range-picker__editors-wrap">
<span class="el-date-range-picker__time-picker-wrap">
<input
placeholder="开始日期"
:placeholder="$t('el.datepicker.startDate')"
class="el-date-range-picker__editor"
:value="leftVisibleDate"
@input="handleDateInput($event, 'min')"
@ -30,7 +30,7 @@
</span>
<span class="el-date-range-picker__time-picker-wrap">
<input
placeholder="开始时间"
:placeholder="$t('el.datepicker.startTime')"
class="el-date-range-picker__editor"
:value="leftVisibleTime"
@focus="leftTimePickerVisible = !leftTimePickerVisible"
@ -49,7 +49,7 @@
<span class="el-date-range-picker__time-picker-wrap">
<input
ref="leftInput"
placeholder="结束日期"
:placeholder="$t('el.datepicker.endDate')"
class="el-date-range-picker__editor"
:value="rightVisibleDate"
:readonly="!minDate"
@ -59,7 +59,7 @@
<span class="el-date-range-picker__time-picker-wrap">
<input
ref="rightInput"
placeholder="结束时间"
:placeholder="$t('el.datepicker.endTime')"
class="el-date-range-picker__editor"
:value="rightVisibleTime"
@focus="minDate && (rightTimePickerVisible = !rightTimePickerVisible)"
@ -128,32 +128,35 @@
<div class="el-picker-panel__footer" v-if="showTime">
<!-- <a
class="el-picker-panel__link-btn"
@click="changeToToday">{{ $t('datepicker.now') }}</a> -->
@click="changeToToday">{{ $t('el.datepicker.now') }}</a> -->
<button
type="button"
class="el-picker-panel__btn"
@click="handleConfirm"
:disabled="btnDisabled">{{ $t('datepicker.confirm') }}</button>
:disabled="btnDisabled">{{ $t('el.datepicker.confirm') }}</button>
</div>
</div>
</transition>
</template>
<script type="text/babel">
import { nextMonth, prevMonth, toDate, $t, formatDate, parseDate } from '../util';
import { nextMonth, prevMonth, toDate, formatDate, parseDate } from '../util';
import Locale from 'element-ui/src/mixins/locale';
export default {
mixins: [Locale],
computed: {
btnDisabled() {
return !(this.minDate && this.maxDate && !this.selecting);
},
leftLabel() {
return this.date.getFullYear() + ' ' + this.$t('datepicker.year') + ' ' + (this.date.getMonth() + 1) + ' ' + this.$t('datepicker.month');
return this.date.getFullYear() + ' ' + this.$t('el.datepicker.year') + ' ' + (this.date.getMonth() + 1) + ' ' + this.$t('el.datepicker.month');
},
rightLabel() {
return this.rightDate.getFullYear() + ' ' + this.$t('datepicker.year') + ' ' + (this.rightDate.getMonth() + 1) + ' ' + this.$t('datepicker.month');
return this.rightDate.getFullYear() + ' ' + this.$t('el.datepicker.year') + ' ' + (this.rightDate.getMonth() + 1) + ' ' + this.$t('el.datepicker.month');
},
leftYear() {
@ -270,10 +273,6 @@
},
methods: {
$t(...args) {
return $t.apply(this, args);
},
handleDateInput(event, type) {
const value = event.target.value;
const parsedValue = parseDate(value, 'yyyy-MM-dd');

21
packages/date-picker/src/panel/date.vue
View File

@ -23,7 +23,7 @@
<div class="el-date-picker__time-header" v-if="showTime">
<span class="el-date-picker__editor-wrap">
<input
:placehoder="$t('datepicker.selectDate')"
:placehoder="$t('el.datepicker.selectDate')"
type="text"
v-model.lazy="visibleDate"
class="el-date-picker__editor">
@ -33,7 +33,7 @@
ref="input"
@focus="timePickerVisible = !timePickerVisible"
v-model.lazy="visibleTime"
:placehoder="$t('datepicker.selectTime')"
:placehoder="$t('el.datepicker.selectTime')"
type="text"
class="el-date-picker__editor">
<time-picker
@ -64,7 +64,7 @@
@click="showMonthPicker"
v-show="currentView === 'date'"
class="el-date-picker__header-label"
:class="{ active: currentView === 'month' }">{{ month + 1 }} {{$t('datepicker.month')}}</span>
:class="{ active: currentView === 'month' }">{{ month + 1 }} {{$t('el.datepicker.month')}}</span>
<button
type="button"
@click="nextYear"
@ -111,20 +111,23 @@
<a
href="JavaScript:"
class="el-picker-panel__link-btn"
@click="changeToNow">{{ $t('datepicker.now') }}</a>
@click="changeToNow">{{ $t('el.datepicker.now') }}</a>
<button
type="button"
class="el-picker-panel__btn"
@click="confirm">{{ $t('datepicker.confirm') }}</button>
@click="confirm">{{ $t('el.datepicker.confirm') }}</button>
</div>
</div>
</transition>
</template>
<script type="text/babel">
import { $t, formatDate, parseDate } from '../util';
import { formatDate, parseDate } from '../util';
import Locale from 'element-ui/src/mixins/locale';
export default {
mixins: [Locale],
watch: {
showTime(val) {
/* istanbul ignore if */
@ -174,10 +177,6 @@
},
methods: {
$t(...args) {
return $t.apply(this, args);
},
resetDate() {
this.date = new Date(this.date);
},
@ -414,7 +413,7 @@
yearLabel() {
const year = this.year;
if (!year) return '';
const yearTranslation = this.$t('datepicker.year');
const yearTranslation = this.$t('el.datepicker.year');
if (this.currentView === 'year') {
const startYear = Math.floor(year / 10) * 10;
return startYear + ' ' + yearTranslation + '-' + (startYear + 9) + ' ' + yearTranslation;

16
packages/date-picker/src/panel/time-range.vue
View File

@ -6,7 +6,7 @@
class="el-time-range-picker el-picker-panel">
<div class="el-time-range-picker__content">
<div class="el-time-range-picker__cell">
<div class="el-time-range-picker__header">{{ $t('datepicker.startTime') }}</div>
<div class="el-time-range-picker__header">{{ $t('el.datepicker.startTime') }}</div>
<div class="el-time-range-picker__body el-time-panel__content">
<time-spinner
ref="minSpinner"
@ -20,7 +20,7 @@
</div>
</div>
<div class="el-time-range-picker__cell">
<div class="el-time-range-picker__header">{{ $t('datepicker.endTime') }}</div>
<div class="el-time-range-picker__header">{{ $t('el.datepicker.endTime') }}</div>
<div class="el-time-range-picker__body el-time-panel__content">
<time-spinner
ref="maxSpinner"
@ -38,12 +38,12 @@
<button
type="button"
class="el-time-panel__btn cancel"
@click="handleCancel()">{{ $t('datepicker.cancel') }}</button>
@click="handleCancel()">{{ $t('el.datepicker.cancel') }}</button>
<button
type="button"
class="el-time-panel__btn confirm"
@click="handleConfirm()"
:disabled="btnDisabled">{{ $t('datepicker.confirm') }}</button>
:disabled="btnDisabled">{{ $t('el.datepicker.confirm') }}</button>
</div>
</div>
</transition>
@ -51,7 +51,7 @@
<script type="text/babel">
import { parseDate, limitRange } from '../util';
import { $t } from '../util';
import Locale from 'element-ui/src/mixins/locale';
const MIN_TIME = parseDate('00:00:00', 'HH:mm:ss');
const MAX_TIME = parseDate('23:59:59', 'HH:mm:ss');
@ -73,6 +73,8 @@
};
export default {
mixins: [Locale],
components: {
TimeSpinner: require('../basic/time-spinner')
},
@ -125,10 +127,6 @@
},
methods: {
$t(...args) {
return $t.apply(this, args);
},
handleCancel() {
this.$emit('pick');
},

12
packages/date-picker/src/panel/time.vue
View File

@ -19,11 +19,11 @@
<button
type="button"
class="el-time-panel__btn cancel"
@click="handleCancel">{{ $t('datepicker.cancel') }}</button>
@click="handleCancel">{{ $t('el.datepicker.cancel') }}</button>
<button
type="button"
class="el-time-panel__btn confirm"
@click="handleConfirm()">{{ $t('datepicker.confirm') }}</button>
@click="handleConfirm()">{{ $t('el.datepicker.confirm') }}</button>
</div>
</div>
</transition>
@ -31,9 +31,11 @@
<script type="text/babel">
import { limitRange } from '../util';
import { $t } from '../util';
import Locale from 'element-ui/src/mixins/locale';
export default {
mixins: [Locale],
components: {
TimeSpinner: require('../basic/time-spinner')
},
@ -98,10 +100,6 @@
},
methods: {
$t(...args) {
return $t.apply(this, args);
},
handleCancel() {
this.$emit('pick', null);
},

6
packages/date-picker/src/picker.vue
View File

@ -33,9 +33,9 @@ import Vue from 'vue';
import Clickoutside from 'element-ui/src/utils/clickoutside';
import { formatDate, parseDate, getWeekNumber } from './util';
import Popper from 'element-ui/src/utils/vue-popper';
import emitter from 'element-ui/src/mixins/emitter';
import Emitter from 'element-ui/src/mixins/emitter';
const newPopper = {
const NewPopper = {
props: {
appendToBody: Popper.props.appendToBody,
offset: Popper.props.offset,
@ -193,7 +193,7 @@ const PLACEMENT_MAP = {
};
export default {
mixins: [emitter, newPopper],
mixins: [Emitter, NewPopper],
props: {
format: String,

39
packages/date-picker/src/util/i18n.js
View File

@ -1,39 +0,0 @@
export default {
datepicker: {
now: '此刻',
today: '今天',
cancel: '取消',
clear: '清空',
confirm: '确定',
selectDate: '选择日期',
selectTime: '选择时间',
startTime: '开始时间',
endTime: '结束时间',
year: '年',
month: '月',
week: '周次',
weeks: {
sun: '日',
mon: '一',
tue: '二',
wed: '三',
thu: '四',
fri: '五',
sat: '六'
},
months: {
jan: '一月',
feb: '二月',
mar: '三月',
apr: '四月',
may: '五月',
jun: '六月',
jul: '七月',
aug: '八月',
sep: '九月',
oct: '十月',
nov: '十一月',
dec: '十二月'
}
}
};

19
packages/date-picker/src/util/index.js
View File

@ -157,22 +157,3 @@ export const limitRange = function(date, ranges) {
return date < minDate ? minDate : maxDate;
};
import i18n from './i18n';
export const $t = function(path, options) {
const vuei18n = Object.getPrototypeOf(this).$t;
if (typeof vuei18n === 'function') {
return vuei18n.apply(this, [path, options]);
}
const array = path.split('.');
let current = i18n;
for (var i = 0, j = array.length; i < j; i++) {
var property = array[i];
var value = current[property];
if (i === j - 1) return value;
if (!value) return '';
current = value;
}
return '';
};

2
packages/dialog/src/component.vue
View File

@ -27,7 +27,7 @@
export default {
name: 'el-dialog',
mixins: [ Popup ],
mixins: [Popup],
props: {
title: {

4
packages/dropdown/src/dropdown-item.vue
View File

@ -2,12 +2,12 @@
<li class="el-dropdown-item" @click="handleClick"><slot></slot></li>
</template>
<script>
import emitter from 'element-ui/src/mixins/emitter';
import Emitter from 'element-ui/src/mixins/emitter';
export default {
name: 'ElDropdownItem',
mixins: [emitter],
mixins: [Emitter],
methods: {
handleClick(e) {

4
packages/dropdown/src/dropdown.vue
View File

@ -1,11 +1,11 @@
<script>
import Clickoutside from 'element-ui/src/utils/clickoutside';
import emitter from 'element-ui/src/mixins/emitter';
import Emitter from 'element-ui/src/mixins/emitter';
export default {
name: 'ElDropdown',
mixins: [emitter],
mixins: [Emitter],
directives: { Clickoutside },

4
packages/menu/src/menu-item.vue
View File

@ -1,11 +1,11 @@
<script>
import menuMixin from './menu-mixin';
import Menu from './menu-mixin';
module.exports = {
name: 'el-menu-item',
componentName: 'menu-item',
mixins: [menuMixin],
mixins: [Menu],
props: {
index: {

23
packages/message-box/src/main.vue
View File

@ -24,8 +24,12 @@
</template>
<script type="text/babel">
let CONFIRM_TEXT = '确定';
let CANCEL_TEXT = '取消';
import Popup from 'vue-popup';
import ElInput from 'element-ui/packages/input';
import ElButton from 'element-ui/packages/button';
import { addClass, removeClass } from 'wind-dom/src/class';
import { $t } from 'element-ui/src/locale';
let typeMap = {
success: 'circle-check',
info: 'information',
@ -33,13 +37,8 @@
error: 'circle-cross'
};
import Popup from 'vue-popup';
import ElInput from 'element-ui/packages/input';
import ElButton from 'element-ui/packages/button';
import { addClass, removeClass } from 'wind-dom/src/class';
export default {
mixins: [ Popup ],
mixins: [Popup],
props: {
modal: {
@ -115,7 +114,7 @@
if (this.$type === 'prompt') {
var inputPattern = this.inputPattern;
if (inputPattern && !inputPattern.test(this.inputValue || '')) {
this.editorErrorMessage = this.inputErrorMessage || '输入的数据不合法!';
this.editorErrorMessage = this.inputErrorMessage || $t('el.messagebox.error');
addClass(this.$refs.input.$el.querySelector('input'), 'invalid');
return false;
}
@ -123,7 +122,7 @@
if (typeof inputValidator === 'function') {
var validateResult = inputValidator(this.inputValue);
if (validateResult === false) {
this.editorErrorMessage = this.inputErrorMessage || '输入的数据不合法!';
this.editorErrorMessage = this.inputErrorMessage || $t('el.messagebox.error');
addClass(this.$refs.input.$el.querySelector('input'), 'invalid');
return false;
}
@ -174,8 +173,8 @@
inputErrorMessage: '',
showConfirmButton: true,
showCancelButton: false,
confirmButtonText: CONFIRM_TEXT,
cancelButtonText: CANCEL_TEXT,
confirmButtonText: $t('el.messagebox.confirm'),
cancelButtonText: $t('el.messagebox.cancel'),
confirmButtonClass: '',
confirmButtonDisabled: false,
cancelButtonClass: '',

6
packages/pagination/src/pagination.js
View File

@ -1,8 +1,8 @@
import Vue from 'vue';
import Pager from './pager.vue';
import ElSelect from 'element-ui/packages/select';
import ElOption from 'element-ui/packages/option';
import Migrating from 'element-ui/src/mixins/migrating';
import { $t } from 'element-ui/src/locale';
export default {
name: 'ElPagination',
@ -138,7 +138,7 @@ export default {
this.$parent.pageSizes.map(item =>
<el-option
value={ item }
label={ item + ' 条/页' }>
label={ item + ' ' + $t('el.pagination.pagesize') }>
</el-option>
)
}
@ -339,7 +339,7 @@ export default {
}
if (newVal !== undefined) {
Vue.nextTick(() => {
this.$nextTick(() => {
this.internalCurrentPage = newVal;
});
}

4
packages/radio/src/radio-group.vue
View File

@ -1,12 +1,12 @@
<script>
import emitter from 'element-ui/src/mixins/emitter';
import Emitter from 'element-ui/src/mixins/emitter';
export default {
name: 'ElRadioGroup',
componentName: 'radio-group',
mixins: [emitter],
mixins: [Emitter],
props: {
value: [String, Number],

4
packages/select/src/option-group.vue
View File

@ -10,10 +10,10 @@
</template>
<script type="text/babel">
import emitter from 'element-ui/src/mixins/emitter';
import Emitter from 'element-ui/src/mixins/emitter';
export default {
mixins: [emitter],
mixins: [Emitter],
name: 'el-option-group',

4
packages/select/src/option.vue
View File

@ -12,10 +12,10 @@
</template>
<script type="text/babel">
import emitter from 'element-ui/src/mixins/emitter';
import Emitter from 'element-ui/src/mixins/emitter';
export default {
mixins: [emitter],
mixins: [Emitter],
name: 'el-option',

14
packages/select/src/select.vue
View File

@ -64,7 +64,8 @@
</template>
<script type="text/babel">
import emitter from 'element-ui/src/mixins/emitter';
import Emitter from 'element-ui/src/mixins/emitter';
import Locale from 'element-ui/src/mixins/locale';
import ElInput from 'element-ui/packages/input';
import ElSelectMenu from './select-dropdown.vue';
import ElTag from 'element-ui/packages/tag';
@ -72,9 +73,10 @@
import Clickoutside from 'element-ui/src/utils/clickoutside';
import { addClass, removeClass, hasClass } from 'wind-dom/src/class';
import { addResizeListener, removeResizeListener } from 'element-ui/src/utils/resize-event';
import { $t } from 'element-ui/src/locale';
export default {
mixins: [emitter],
mixins: [Emitter, Locale],
name: 'ElSelect',
@ -108,17 +110,17 @@
emptyText() {
if (this.loading) {
return '加载中';
return this.$t('el.select.loading');
} else {
if (this.voidRemoteQuery) {
this.voidRemoteQuery = false;
return false;
}
if (this.filteredOptionsCount === 0) {
return '无匹配数据';
return this.$t('el.select.noMatch');
}
if (this.options.length === 0) {
return '无数据';
return this.$t('el.select.noData');
}
}
return null;
@ -147,7 +149,7 @@
multiple: Boolean,
placeholder: {
type: String,
default: '请选择'
default: $t('el.select.placeholder')
}
},

10
packages/upload/src/cover.vue
View File

@ -19,9 +19,9 @@
<transition name="fade-in">
<div v-show="mouseover" class="el-dragger__cover__interact">
<div class="el-draggeer__cover__btns">
<span class="btn" @click="$parent.handleClick()"><i class="el-icon-upload2"></i><span>继续上传</span></span>
<span class="btn" @click="onPreview(image)"><i class="el-icon-view"></i><span>查看图片</span></span>
<span class="btn" @click="onRemove(image)"><i class="el-icon-delete2"></i><span>删除</span></span>
<span class="btn" @click="$parent.handleClick()"><i class="el-icon-upload2"></i><span>{{ $t('el.upload.continue') }}</span></span>
<span class="btn" @click="onPreview(image)"><i class="el-icon-view"></i><span>{{ $t('el.upload.preview') }}</span></span>
<span class="btn" @click="onRemove(image)"><i class="el-icon-delete2"></i><span>{{ $t('el.upload.delete') }}</span></span>
</div>
</div>
</transition>
@ -32,7 +32,11 @@
</div>
</template>
<script>
import Locale from 'element-ui/src/mixins/locale';
export default {
mixins: [Locale],
props: {
image: {},
onPreview: {

5
packages/upload/src/upload-list.vue
View File

@ -12,7 +12,7 @@
<a class="el-upload__file__name" @click="$emit('preview', file)">
<i class="el-icon-document"></i>{{file.name}}
</a>
<span class="el-upload__btn-delete" @click="$emit('remove', file)" v-show="file.status === 'finished'">删除</span>
<span class="el-upload__btn-delete" @click="$emit('remove', file)" v-show="file.status === 'finished'">{{ $t('el.upload.delete') }}</span>
<el-progress
v-if="file.showProgress"
:stroke-width="2"
@ -23,7 +23,10 @@
</transition-group>
</template>
<script>
import Locale from 'element-ui/src/mixins/locale';
export default {
mixins: [Locale],
props: {
files: {
type: Array,

3
packages/upload/src/upload.vue
View File

@ -8,8 +8,7 @@
@click="handleClick"
@drop.prevent="onDrop"
@dragover.prevent="dragOver = true"
@dragleave.prevent="dragOver = false"
>
@dragleave.prevent="dragOver = false">
<slot v-if="!showCover"></slot>
<cover :image="lastestFile" :on-preview="onPreview" :on-remove="onRemove" v-else></cover>
<input class="el-upload__input" type="file" ref="input" @change="handleChange" :multiple="multiple" :accept="accept">

4
src/index.js
View File

@ -53,10 +53,12 @@ import Card from '../packages/card/index.js';
import Rate from '../packages/rate/index.js';
import Steps from '../packages/steps/index.js';
import Step from '../packages/step/index.js';
import locale from 'element-ui/src/locale';
const install = function(Vue) {
const install = function(Vue, opts = {}) {
/* istanbul ignore if */
if (install.installed) return;
locale.use(opts.locale);
Vue.component(Pagination.name, Pagination);
Vue.component(Dialog.name, Dialog);

26
src/locale/index.js Normal file
View File

@ -0,0 +1,26 @@
import defaultLang from 'element-ui/src/locale/lang/zh-cn';
import Vue from 'vue';
let lang = defaultLang;
export const $t = function(path, options) {
const vuei18n = Object.getPrototypeOf(this || Vue).$t;
if (typeof vuei18n === 'function') {
return vuei18n.apply(this, [path, options]);
}
const array = path.split('.');
let current = lang;
for (var i = 0, j = array.length; i < j; i++) {
var property = array[i];
var value = current[property];
if (i === j - 1) return value;
if (!value) return '';
current = value;
}
return '';
};
export const use = function(l) {
lang = l || lang;
};
export default { use, $t };

62
src/locale/lang/en.js Normal file
View File

@ -0,0 +1,62 @@
export default {
el: {
datepicker: {
now: 'now',
today: 'today',
cancel: 'cancel',
clear: 'clear',
confirm: 'confirm',
selectDate: 'selectDate',
selectTime: 'selectTime',
startDate: 'startDate',
startTime: 'startTime',
endDate: 'endDate',
endTime: 'endTime',
year: 'year',
month: 'month',
week: 'week',
weeks: {
sun: 'sun',
mon: 'mon',
tue: 'tue',
wed: 'wed',
thu: 'thu',
fri: 'fri',
sat: 'sat'
},
months: {
jan: 'jan',
feb: 'feb',
mar: 'mar',
apr: 'apr',
may: 'may',
jun: 'jun',
jul: 'jul',
aug: 'aug',
sep: 'sep',
oct: 'oct',
nov: 'nov',
dec: 'dec'
}
},
select: {
loading: 'loading',
noMatch: 'noMatch',
noData: 'noData',
placeholder: 'placeholder'
},
pagination: {
pagesize: 'pagesize/页'
},
messagebox: {
confirm: 'confirm',
cancel: 'cancel',
error: 'error!'
},
upload: {
delete: 'delete',
preview: 'preview',
continue: 'continue'
}
}
};

62
src/locale/lang/zh-cn.js Normal file
View File

@ -0,0 +1,62 @@
export default {
el: {
datepicker: {
now: '此刻',
today: '今天',
cancel: '取消',
clear: '清空',
confirm: '确定',
selectDate: '选择日期',
selectTime: '选择时间',
startDate: '开始日期',
startTime: '开始时间',
endDate: '结束日期',
endTime: '结束时间',
year: '年',
month: '月',
week: '周次',
weeks: {
sun: '日',
mon: '一',
tue: '二',
wed: '三',
thu: '四',
fri: '五',
sat: '六'
},
months: {
jan: '一月',
feb: '二月',
mar: '三月',
apr: '四月',
may: '五月',
jun: '六月',
jul: '七月',
aug: '八月',
sep: '九月',
oct: '十月',
nov: '十一月',
dec: '十二月'
}
},
select: {
loading: '加载中',
noMatch: '无匹配数据',
noData: '无数据',
placeholder: '请选择'
},
pagination: {
pagesize: '条/页'
},
messagebox: {
confirm: '确定',
cancel: '取消',
error: '输入的数据不合法!'
},
upload: {
delete: '删除',
preview: '查看图片',
continue: '继续上传'
}
}
};

9
src/mixins/locale.js Normal file
View File

@ -0,0 +1,9 @@
import { $t } from 'element-ui/src/locale';
export default {
methods: {
$t(...args) {
return $t.apply(this, args);
}
}
};