vue cli 2.0 集成国际化

npm install vue-i18n

在 main.js 中引入 vue-i18n

import Vue from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
import ElementUI from 'element-ui';

import vi18n from 'vue-i18n';

Vue.prototype.$api = api; 


Vue.config.productionTip = false

Vue.use(vi18n);
const i18n = new vi18n({
  locale: 'zh',
  messages: {
    "zh": require('./common/lang/zh-CN'),
    "en": require('./common/lang/en-US'),
  },
});

Vue.use(ElementUI, {
  i18n: (key, value) => i18n.t(key, value)
});

new Vue({
  router,
  store,
  i18n,
  render: h => h(App),
  data: {
    eventHub: new Vue(),
  }
}).$mount('#app')

en-US.js

export const m = {
        // 接口调用返回无数据或异常
        'infoGetFailed':'Information acquisition failed',
        // 登录
        'login': 'Login',
        'identityAuthenticate':'Identity Authenticate',
        'unmholder':'Please enter the job number',
        'pwdholder':'Please enter the password',
        'cpwdholder':'Please enter the verification code',
        // 银行信息检索
        'queryBankInfo':'Query Bank Information',
        'queryBankInfoHolder':'Please enter keywords, separated by spaces in case of multiple',
        'queryBankInfoTips':'Please double-click the bank after checking the information of the opposite company carefully',
        // 项目信息检索
        'queryProjectInfo':'Query Projects Information',
        'queryProjectInfoHolder':'Please enter keywords',
        // 员工信息检索
        'queryEmployeeInfo':'Query Employee Information',
        'queryEmployeeInfoHolder':'Please enter keywords',
        // 经费选择
        'ywbhLable':'Current reimbursement number:',
        'jfxzTab1Title':'Essential info',
        'jfxzTab2Title':'Description of loan times for operator',
        'jfxzTab3Title':'Description of loan times for project',
        'jfxzTab4Title':'Description of project quota',
        'proBalanceInfo':'Project balance information',
        'authInfo':'Authorization information',
        //一览页
        'newProjetctAdd':'new business filling',
        'backpage':'back home page',
        'mergeSubmit':'merge submission',
        'instructions':'Operating instructions',
        'notsubmit':'documents not submitted',
        'billsource':'bill source',
        'appointmentNo':'appointment bill no.',
        'businessNo':'business number',
        'busType':'business type',
        'reimbursePeson':'Reimbursement person',
        'abstract':'abstract',
        'reimbursementAmount':'Reimbursement amount',
        'deptNoAndName':'Department number & name',
        'projectNoAndName':'Project number & name',
        'state':'State',
        'operation':'Operation',
        'modify':'Modify',
        'del':'Delete',
        'select':'select',
        'applicationNum':'application no',
        'applicationCon':'application content',
        'query':'query',
        'reset':'reset',
        'otherMod':'other modify',
        'applicantNum':'applicant no',
        'applicant':'applicant',
        'applicationData':'application time',
        'waitsubmit':'wait submit',
        'noApproval':'not to approval',
        'checkProcess':'check approval process',
        'approvalFsh':'approval completed',
        'rejectionList':'rejection list',
        //往来单位弹出页
        'unitInfo':'Unit Info',
        'retrieval':'Retrieval',
        'tips':'Tips',
        //修改个人信息页
        'required':'Required',
        'useName':'Username',
        'telephoneNo':'Phone Number',
        'email':'Email',
        'personalInformation':'Personal info',
        'changeBankCard':'Bank card info',
        'depositBankInfo':'Deposit bank',
        'bankCardNum':'Bank card number',
        'celCard':'Cancel card',
        'businessCard':'Business card No',
        'changePWD':'Change password',
        'password':'Password',
        'newPWD':'New password',
        'confirmPWD':'Enter again',
        'confirm':'Confirm',
        'changePersonInfo':'Change info',
        'phoneMustInput':'Phone number cannot be empty',
        'enterPhoneNo':'Enter the correct phone number',
        'enterEmailFormat':'Enter the correct email format',
        'inputPassword':'Input password',
        'inputNewPassword':'Input new password',
        'inputPWDAgain':'Input new password again',
        'pwdInconsistent':'Passwords inconsistent',
        'fillDataCorrectly':'Please fill in the data correctly',
        'modfiybudget':'Modfiy budget',
        'lookUp':'Look up',
        'revoke':'Revoke',
        'lookLogistics':'Logistics info',
        'subApproval':'Submit approval',
        //日常报销页
        'homePage':'Home page',
        'nextStep':'NextStep',
        'bxlxmc':'Project',
        'jjflkmmc':'Sub Project',
        'zy':'Keyword & summary',
        'fjzs':'Number of documents',
        'jje':'Amount of money',
        'jkjje':'Loan amount',
        'cxjje':'Write off amount',
        'ms':'Describe',
        'bxyq':'Reimbursement requirements',
        'description':'Detailed description',
        'ErrorForBlankPrice':'Please input keyword Amount of money',
        'ErrorForBlankSummary':'Please input keyword summary',
        'ErrorForBlankFjzs':'Please enter the number of documents',
        'ErrorForEmptyForm':'Please enter at least one reimbursement data',
        'addExpenditure':'Split expenditure',
        'ErrorForBlankExpenditure':'Please select the split funds',

        'dept':'Department',
        'deptId':'Department ID',
        'deptName':'Department name',
        'loanDept':'Loan department',
        'loanDeptId':'Loan department ID',
        'project':'Project',
        'projectId':'Project ID',
        'projectName':'Project name',
        'loanProject':'Loan project',
        'loanProjectId':'Loan project ID',
        'targetId':'Target ID',
        'targetName':'Target name',
        'operator':'Operator',
        'operatorId':'Operator ID',
        'operatorName':'Operator name',
        'phone':'Phone number',
        'noInfo':'No Information',
        'index':'Index',
        'loanAmount':'Loan amount',
        'loanSlipBusNum':'Loan slip business number',
        'quotaControlCode':'Quota control code',
        'quotaControlName':'Quota control name',
        'balanceLimit':'Balance limit',
        'next':'Next',
        'back':'Back',
        'cancel':'Cancel',
        'submitPrint':'Submit(print expense account)',
        'saveMerge':'Save(merge submission)',
        'selectExpenditure':'Select Expenditure',
        'serialNum':'Serial number',
        'expenseAmount':'Expense amount(RMB)',
        'balance':'Balance(RMB)',
        'loanReversal':'Loan reversal',
        'selLoanReversal':'Select loan reversal information',
        'expenseAmountIntoOfficialCard':'Remittance of reimbursement funds into official card',
        'projectTransferAccounts':'Project transfer accounts',
        'payToPerson':'Payment to person',
        'payToCompany':'Payment to company',
        'paymentObj':'Payment object',
        'paymentMethod':'Payment method',
        'payeeType':'Payee type',
        'employeeNum':'Employee number',
        'employeeName':'Employee name',
        'remarks':'Remarks',
        'cardBankType':'Card / Bank type',
        'summary':'Summary',
        'offsetNumber':'Offset number',
        'add':'Add',
        'postscript':'Postscript',
        'salesCompany':'Sales company',
        'region':'Region',
        'date':'Date',
        'content':'Content',
        'loanBalance':'Loan balance',
        'loanReversalNum':'Loan reversal number',
        'corporateName':'Corporate name',
        'officialCardConsumeRec':'Official card consumption record',
        'jobNum':'Job number',
        'cardLast4Digits':'Last 4 digits of card',
        'startDate':'Start date',
        'endDate':'End date',
        'dateRange':'Date range',
        'consumptionDate':'Consumption date',
        'consumptionTime':'Consumption time',
        'merchantName':'Merchant name',
        'consumptionAmount':'Consumption amount',
        'reverseEntryAmount':'Reverse entry amount',
        'cardholder':'Cardholder',
        'inputInfoIncompletely':'The information you entered is incomplete',

        // 冲借款检索placeholder
        'loanReversalHolder':'Please input key words, such as: department name and number, project name and number, summary',
        // 双击Tips
        'dbclickTips':'Please check the information carefully and double-click to select the specified row',

        'yes':'Yes',
        'no':'No',
        'WriteOffDate':'WriteOffDate',
        'rcjk':'Daily loan',
        'gnclfjk':'Domestic travel',
        'gjclfjk':'International Travel',
        //国内差旅页
        'departmentInformation':'Department information',
        'itemInformation':'Item information ',
        'startTime':'Start time',
        'travelReason':'Travel reason',
        'addPersonnel':'Add personnel',
        'placeOfBusinessTrip':'Place of business trip ',
        'professionalTitle':'Professional title',
        'numberOfPeople':'Number of people ',
        //国际差旅
        'numberOfDays':'Please enter the number of days',
        'cf_gngwjd':'国内接待费',
        'cf_wbgwjd':'国外接待费',
        'cf_jbcf':'工作餐费',

}



export const el = {
        pagination:{
                'goto':'goto',
                'pagesize':' / page',
                'total':'total {total} ',
                'pageClassifier':'page'
        },
        datepicker:{
                'year':'year',
                'month':'month',
                'month1':'Jan',
                'month2':'Feb',
                'month3':'Mar',
                'month4':'Apr',
                'month5':'May',
                'month6':'Jun',
                'month7':'Jul',
                'month8':'Aug',
                'month9':'Sept',
                'month10':'Oct',
                'month11':'Nov',
                'month12':'Dec',
                weeks:{
                        'mon':'Mon',
                        'tue':'Tue',
                        'wed':'Wed',
                        'thu':'Thu',
                        'fri':'Fri',
                        'sat':'Sat',
                        'sun':'Sun',
                }
        },
        table:{
                emptyText:'no data',
        },
        select:{
                noData:'no data',
        }

}



export const fq = {
        datepicker:{
                'year':'year',
                'month':'month',
                'month1':'Jan',
                'month2':'Feb',
                'month3':'Mar',
                'month4':'Apr',
                'month5':'May',
                'month6':'Jun',
                'month7':'Jul',
                'month8':'Aug',
                'month9':'Sept',
                'month10':'Oct',
                'month11':'Nov',
                'month12':'Dec',
                'to':'to',
                weeks:{
                        'mon':'Mon',
                        'tue':'Tue',
                        'wed':'Wed',
                        'thu':'Thu',
                        'fri':'Fri',
                        'sat':'Sat',
                        'sun':'Sun',
                }
        },


}


// @_@
export const msg = {
        '2000':'系统异常,请联系管理员',
        '2001':'无法删除审核人退回的业务',
        '2002':'经费项目没有指定报账分类',
        '2003':'经费外拨新项目与原项目项目号前十位必须相同',
        '2004':'新项目与原项目报账分类不一致',
        '2005':'提交审批失败',
        '2006':'经费项目没有指定报账模板',
        '2007':'经费项目没有指定报销科目',
        '2008':'项目信息不存在',
        '2009':'您不是该项目的使用人',
        '2010':'校验码过期',
        '2011':'校验码填写错误',
        '2012':'身份认证失败',
        '2013':'登录尝试超过上限',
        '2014':'账户被锁定',
        '2015':'原密码错误',
        '2016':'经费项目指定报账模板重复',
        '2017':'经费项目没有设定允许支出的经济分类',
}

zh-CN.js

export const m = {
        // 接口调用返回无数据或异常
        'infoGetFailed':'信息获取失败',
        // 登录
        'login': '登录',
        'identityAuthenticate':'身份认证',
        'unmholder':'请输入工号',
        'pwdholder':'请输入密码',
        'cpwdholder':'请输入校验码',
        // 银行信息检索
        'queryBankInfo':'检索银行信息',
        'queryBankInfoHolder':'请输入关键字,多个的情况下用空格隔开',
        'queryBankInfoTips':'请仔细核对对方单位信息后,双击行选中银行',
        // 项目信息检索
        'queryProjectInfo':'检索项目信息',
        'queryProjectInfoHolder':'请输入关键字',
        // 员工信息检索
        'queryEmployeeInfo':'检索员工信息',
        'queryEmployeeInfoHolder':'请输入关键字',
        // 经费选择
        'ywbhLable':'当前报销业务编号:',
        'jfxzTab1Title':'基本信息',
        'jfxzTab2Title':'经办人借款次数说明',
        'jfxzTab3Title':'项目借款次数说明',
        'jfxzTab4Title':'项目额度说明',
        'proBalanceInfo':'项目余额信息',
        'authInfo':'授权信息',
        //一览页
        'newProjetctAdd':'新业务填报',
        'backpage':'返回首页',
        'mergeSubmit':'合并提交',
        'instructions':'操作说明',
        'notsubmit':'未提交单据',
        'billsource':'单据来源',
        'appointmentNo':'预约单号',
        'businessNo':'业务编号',
        'busType':'业务类型',
        'reimbursePeson':'报销人',
        'abstract':'摘要',
        'reimbursementAmount':'已报销金额',
        'deptNoAndName':'部门编号名称',
        'projectNoAndName':'项目编号名称',
        'state':'状态',
        'operation':'操作',
        'modify':'修改',
        'del':'删除',
        'select':'请选择',
        'applicationNum':'申请单号',
        'applicationCon':'申请内容',
        'query':'查询',
        'reset':'重置',
        'otherMod':'其他修改',
        'applicantNum':'申请人编号',
        'applicant':'申请人',
        'applicationData':'申请时间',
        'waitsubmit':'等待提交',
        'noApproval':'未被审批',
        'checkProcess':'审批流程查看',
        'approvalFsh':'已完成审批',
        'rejectionList':'驳回一览',
        'lookUp':'查看',
        'modfiybudget':'预算修改',
        'revoke':'撤销',
        'lookLogistics':'物流查看',
        'subApproval':'提交审批',
        //修改个人信息页
        'required':'必须填写',
        'useName':'用户姓名',
        'telephoneNo':'电话号码',
        'email':'电子邮箱',
        'personalInformation':'个人信息',
        'changeBankCard':'修改银行卡信息',
        'depositBankInfo':'银行开户行',
        'bankCardNum':'银行卡号',
        'celCard':'注销此卡',
        'businessCard':'公务卡号',
        'changePWD':'修改密码',
        'password':'原始密码',
        'newPWD':'新密码',
        'confirmPWD':'确认新密码',
        'confirm':'确定',
        'changePersonInfo':'修改个人信息',
        'phoneMustInput':'手机号不能为空',
        'enterPhoneNo':'请输入正确的手机号',
        'enterEmailFormat':'请输入正确的邮箱格式',
        'inputPassword':'请输入原始密码',
        'inputNewPassword':'请输入密码',
        'inputPWDAgain':'请再次输入密码',
        'pwdInconsistent':'两次输入密码不一致!',
        'fillDataCorrectly':'请正确填写数据',
        //往来单位弹出页
        'unitInfo':'往来单位信息',
        'retrieval':'检索',
        'tips':'提示',
        //日常报销页
        'homePage':'首页',
        'nextStep':'电子发票录入/收款方信息',
        'bxlxmc':'项目',
        'jjflkmmc':'子项目',
        'zy':'关键字摘要',
        'fjzs':'单据数',
        'jje':'金额',
        'jkjje':'借款金额',
        'cxjje':'冲销金额',
        'ms':'描述',
        'bxyq':'报销要求',
        'description':'报销小条贴士',
        'ErrorForBlankPrice':'请输入金额!',
        'ErrorForBlankSummary':'请输入关键字摘要!',
        'ErrorForBlankFjzs':'请输入单据数!',
        'ErrorForEmptyForm':'至少输入一条报销金额!',
        'addExpenditure':'经费拆分',
        'ErrorForBlankExpenditure':'请选择拆分的经费',
     
        'dept':'部门',
        'deptId':'部门编号',
        'deptName':'部门名称',
        'loanDept':'借款部门',
        'loanDeptId':'借款部门编号',
        'project':'项目',
        'projectId':'项目编号',
        'projectName':'项目名称',
        'loanProject':'借款项目',
        'loanProjectId':'借款项目编号',
        'targetId':'报销人ID',
        'targetName':'报销人名称',
        'operator':'经办人',
        'operatorId':'经办人Id',
        'operatorName':'经办人名称',
        'phone':'电话',
        'noInfo':'暂无信息',
        'index':'序号',
        'loanAmount':'借款金额',
        'loanSlipBusNum':'借款单业务编号',
        'quotaControlCode':'额度控制编码',
        'quotaControlName':'额度控制名称',
        'balanceLimit':'结余额度',
        'next':'下一步',
        'back':'上一步',
        'cancel':'取消',
        'submitPrint':'提交(打印报销单)',
        'saveMerge':'保存(与其他业务合并提交)',
        'selectExpenditure':'经费选择',
        'serialNum':'业务编号',
        'expenseAmount':'单据报销金额(元)',
        'balance':'差额(元)',
        'loanReversal':'冲借款',
        'selLoanReversal':'选择冲借款信息',
        'expenseAmountIntoOfficialCard':'报销款汇入公务卡',
        'projectTransferAccounts':'项目转账',
        'payToPerson':'对私支付',
        'payToCompany':'对公支付',
        'paymentObj':'支付对象',
        'paymentMethod':'支付方式',
        'payeeType':'收款方人员类型',
        'employeeNum':'员工编号',
        'employeeName':'员工姓名',
        'remarks':'备注',
        'cardBankType':'卡/银行类型',
        'summary':'摘要',
        'offsetNumber':'对冲号',
        'add':'添加',
        'postscript':'附言',
        'salesCompany':'销售单位',
        'region':'地区',
        'date':'日期',
        'content':'内容',
        'loanBalance':'借款余额',
        'loanReversalNum':'对冲票据号',
        'corporateName':'单位名称',
        'officialCardConsumeRec':'公务卡消费记录',
        'jobNum':'工号',
        'cardLast4Digits':'公务卡号后四位',
        'startDate':'开始日期',
        'endDate':'结束日期',
        'dateRange':'时间范围',
        'consumptionDate':'消费日期',
        'consumptionTime':'消费时间',
        'merchantName':'商户名称',
        'consumptionAmount':'消费金额',
        'reverseEntryAmount':'冲账金额',
        'cardholder':'持卡人',
        'inputInfoIncompletely':'您输入的信息不完整',
        
        // 冲借款检索placeholder
        'loanReversalHolder':'请输入关键字,如:部门名称及编号,项目名称及编号,摘要',
        // 双击Tips
        'dbclickTips':'请仔细核对信息后,双击选中指定行',
        'yes':'是',
        'no':'否',
        'WriteOffDate':'冲账日期',
        'rcjk':'日常借款',
        'gnclfjk':'国内差旅借款',
        'gjclfjk':'国际差旅借款',
        //国内差旅页
        'departmentInformation':'部门信息',
        'itemInformation':'项目信息',
        'startTime':'开始时间',
        'travelReason':'出差事由',
        'addPersonnel':'添加人员',
        'placeOfBusinessTrip':'出差地点',
        'professionalTitle':'职称',
        'numberOfPeople':'人数',
        //国际差旅
        'numberOfDays':'请输入天数',
        'cf_gngwjd':'国内接待费',
        'cf_wbgwjd':'国外接待费',
        'cf_jbcf':'工作餐费',

}

export const el = {
        pagination:{
                'goto':'前往',
                'pagesize':'条/页',
                'total':'共{total}条',
                'pageClassifier':'页'
        },
        datepicker:{
                'year':'年',
                'month':'月',
                'month1':'一月',
                'month2':'二月',
                'month3':'三月',
                'month4':'四月',
                'month5':'五月',
                'month6':'六月',
                'month7':'七月',
                'month8':'八月',
                'month9':'九月',
                'month10':'十月',
                'month11':'十一月',
                'month12':'十二月',
                weeks:{
                        'mon':'星期一',
                        'tue':'星期二',
                        'wed':'星期三',
                        'thu':'星期四',
                        'fri':'星期五',
                        'sat':'星期六',
                        'sun':'星期日',
                }
        },
        table:{
                emptyText:'暂无数据',
        },
        select:{
                noData:'暂无数据',
        }


}



export const fq = {
        datepicker:{
                'year':'年',
                'month':'月',
                'month1':'一月',
                'month2':'二月',
                'month3':'三月',
                'month4':'四月',
                'month5':'五月',
                'month6':'六月',
                'month7':'七月',
                'month8':'八月',
                'month9':'九月',
                'month10':'十月',
                'month11':'十一月',
                'month12':'十二月',
                'to':'至',
                weeks:{
                        'mon':'一',
                        'tue':'二',
                        'wed':'三',
                        'thu':'四',
                        'fri':'五',
                        'sat':'六',
                        'sun':'日',
                }
        },


}


// @_@
export const msg = {
        '2000':'系统异常,请联系管理员',
        '2001':'无法删除审核人退回的业务',
        '2002':'经费项目没有指定报账分类',
        '2003':'经费外拨新项目与原项目项目号前十位必须相同',
        '2004':'新项目与原项目报账分类不一致',
        '2005':'提交审批失败',
        '2006':'经费项目没有指定报账模板',
        '2007':'经费项目没有指定报销科目',
        '2008':'项目信息不存在',
        '2009':'您不是该项目的使用人',
        '2010':'校验码过期',
        '2011':'校验码填写错误',
        '2012':'身份认证失败',
        '2013':'登录尝试超过上限',
        '2014':'账户被锁定',
        '2015':'原密码错误',
        '2016':'经费项目指定报账模板重复',
        '2017':'经费项目没有设定允许支出的经济分类',
}

使用

 <el-form-item>
            <el-row style="width:100%">
              <el-col :span="16" :offset="5" >
                <el-button type="primary"  style="width:100%" @click="login">{{$t('m.login')}}</el-button>
              </el-col>
            </el-row>
          </el-form-item>

 

©️2020 CSDN 皮肤主题: 大白 设计师:CSDN官方博客 返回首页