init i18n
This commit is contained in:
parent
1e78bbf6ee
commit
974079296b
6
src/i18n/en.js
Normal file
6
src/i18n/en.js
Normal file
@ -0,0 +1,6 @@
|
||||
const t = {}
|
||||
|
||||
t.loading = 'Loading...'
|
||||
t.createTime = 'Create Time'
|
||||
|
||||
export default t
|
||||
@ -2,8 +2,9 @@ import Vue from 'vue'
|
||||
import VueI18n from 'vue-i18n'
|
||||
import Cookies from 'js-cookie'
|
||||
import zhCNLocale from 'element-ui/lib/locale/lang/zh-CN'
|
||||
import enLocale from 'element-ui/lib/locale/lang/en'
|
||||
import zhCN from './zh-CN'
|
||||
|
||||
import en from './en'
|
||||
Vue.use(VueI18n)
|
||||
|
||||
export const messages = {
|
||||
@ -11,11 +12,33 @@ export const messages = {
|
||||
'_lang': '简体中文',
|
||||
...zhCN,
|
||||
...zhCNLocale
|
||||
},
|
||||
'en': {
|
||||
'_lang': 'English',
|
||||
...en,
|
||||
...enLocale
|
||||
}
|
||||
}
|
||||
|
||||
export function getLanguage() {
|
||||
const chooseLanguage = Cookies.get('language')
|
||||
if (chooseLanguage) return chooseLanguage
|
||||
|
||||
// if has not choose language
|
||||
const language = (navigator.language || navigator.browserLanguage).toLowerCase()
|
||||
const locales = Object.keys(messages)
|
||||
for (const locale of locales) {
|
||||
if (language.indexOf(locale) > -1) {
|
||||
Cookies.set('language', locale)
|
||||
return locale
|
||||
}
|
||||
}
|
||||
Cookies.set('language', 'zh-CN')
|
||||
return 'zh-CN'
|
||||
}
|
||||
|
||||
export default new VueI18n({
|
||||
// locale: Cookies.get('language') || 'zh-CN',
|
||||
locale: 'zh-CN', // 先默认中文
|
||||
locale: getLanguage(), // 先默认中文
|
||||
messages
|
||||
})
|
||||
|
||||
@ -1,6 +1,7 @@
|
||||
const t = {}
|
||||
|
||||
t.loading = '加载中...'
|
||||
t.createTime = '添加时间'
|
||||
|
||||
t.brand = {}
|
||||
t.brand.lg = '生产监控系统'
|
||||
|
||||
@ -1,18 +1,38 @@
|
||||
<template>
|
||||
<nav class="aui-navbar" :class="`aui-navbar--${$store.state.navbarLayoutType}`">
|
||||
<nav
|
||||
class="aui-navbar"
|
||||
:class="`aui-navbar--${$store.state.navbarLayoutType}`"
|
||||
>
|
||||
<div class="aui-navbar__header">
|
||||
<h1 class="aui-navbar__brand" @click="$router.push({ name: 'home' })">
|
||||
<a class="aui-navbar__brand-lg" href="javascript:;">{{ $t('brand.lg') }}</a>
|
||||
<a class="aui-navbar__brand-mini" href="javascript:;">{{ $t('brand.mini') }}</a>
|
||||
<a class="aui-navbar__brand-lg" href="javascript:;">{{
|
||||
$t('brand.lg')
|
||||
}}</a>
|
||||
<a class="aui-navbar__brand-mini" href="javascript:;">{{
|
||||
$t('brand.mini')
|
||||
}}</a>
|
||||
</h1>
|
||||
</div>
|
||||
<div class="aui-navbar__body">
|
||||
<el-menu class="aui-navbar__menu mr-auto" mode="horizontal">
|
||||
<el-menu-item index="1" @click="$store.state.sidebarFold = !$store.state.sidebarFold">
|
||||
<svg class="icon-svg aui-navbar__icon-menu aui-navbar__icon-menu--switch" aria-hidden="true"><use xlink:href="#icon-outdent"></use></svg>
|
||||
<el-menu-item
|
||||
index="1"
|
||||
@click="$store.state.sidebarFold = !$store.state.sidebarFold"
|
||||
>
|
||||
<svg
|
||||
class="icon-svg aui-navbar__icon-menu aui-navbar__icon-menu--switch"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<use xlink:href="#icon-outdent"></use>
|
||||
</svg>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="2" @click="refresh()">
|
||||
<svg class="icon-svg aui-navbar__icon-menu aui-navbar__icon-menu--refresh" aria-hidden="true"><use xlink:href="#icon-sync"></use></svg>
|
||||
<svg
|
||||
class="icon-svg aui-navbar__icon-menu aui-navbar__icon-menu--refresh"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<use xlink:href="#icon-sync"></use>
|
||||
</svg>
|
||||
</el-menu-item>
|
||||
</el-menu>
|
||||
<el-menu class="aui-navbar__menu" mode="horizontal">
|
||||
@ -26,8 +46,32 @@
|
||||
<svg class="icon-svg aui-navbar__icon-menu" aria-hidden="true"><use xlink:href="#gitee"></use></svg>
|
||||
</a>
|
||||
</el-menu-item> -->
|
||||
<el-menu-item index="3">
|
||||
<el-dropdown
|
||||
placement="bottom"
|
||||
:show-timeout="0"
|
||||
@command="handleCommand"
|
||||
>
|
||||
<span class="el-dropdown-link">
|
||||
<svg class="icon-svg aui-navbar__icon-menu" aria-hidden="true">
|
||||
<use xlink:href="#icon-earth"></use>
|
||||
</svg>
|
||||
<!-- <i class="el-icon-arrow-down el-icon--right"></i> -->
|
||||
</span>
|
||||
<el-dropdown-menu slot="dropdown">
|
||||
<el-dropdown-item :disabled="getLang() === 'zh-CN'" command="toCN"
|
||||
>中文</el-dropdown-item
|
||||
>
|
||||
<el-dropdown-item :disabled="getLang() === 'en'" command="toEN"
|
||||
>En</el-dropdown-item
|
||||
>
|
||||
</el-dropdown-menu>
|
||||
</el-dropdown>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="4" @click="fullscreenHandle()">
|
||||
<svg class="icon-svg aui-navbar__icon-menu" aria-hidden="true"><use xlink:href="#icon-fullscreen"></use></svg>
|
||||
<svg class="icon-svg aui-navbar__icon-menu" aria-hidden="true">
|
||||
<use xlink:href="#icon-fullscreen"></use>
|
||||
</svg>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="5" class="aui-navbar__avatar">
|
||||
<el-dropdown placement="bottom" :show-timeout="0">
|
||||
@ -37,18 +81,26 @@
|
||||
<i class="el-icon-arrow-down"></i>
|
||||
</span>
|
||||
<el-dropdown-menu slot="dropdown">
|
||||
<el-dropdown-item @click.native="updatePasswordHandle()">{{ $t('updatePassword.title') }}</el-dropdown-item>
|
||||
<el-dropdown-item @click.native="logoutHandle()">{{ $t('logout') }}</el-dropdown-item>
|
||||
<el-dropdown-item @click.native="updatePasswordHandle()">{{
|
||||
$t('updatePassword.title')
|
||||
}}</el-dropdown-item>
|
||||
<el-dropdown-item @click.native="logoutHandle()">{{
|
||||
$t('logout')
|
||||
}}</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</el-dropdown>
|
||||
</el-menu-item>
|
||||
</el-menu>
|
||||
</div>
|
||||
<!-- 弹窗, 修改密码 -->
|
||||
<update-password v-if="updatePasswordVisible" ref="updatePassword"></update-password>
|
||||
<update-password
|
||||
v-if="updatePasswordVisible"
|
||||
ref="updatePassword"
|
||||
></update-password>
|
||||
</nav>
|
||||
</template>
|
||||
<script>
|
||||
import Cookies from 'js-cookie'
|
||||
import screenfull from 'screenfull'
|
||||
import UpdatePassword from './main-navbar-update-password'
|
||||
import { clearLoginInfo } from '@/utils'
|
||||
@ -64,6 +116,24 @@ export default {
|
||||
UpdatePassword
|
||||
},
|
||||
methods: {
|
||||
// 获取当前语言环境
|
||||
getLang() {
|
||||
return Cookies.get('language')
|
||||
},
|
||||
// 切换语言环境
|
||||
handleCommand(command) {
|
||||
// 切换语言选项时，可能需要手动刷新页面
|
||||
switch (command) {
|
||||
case 'toCN':
|
||||
this.$root.$i18n.locale = 'zh-CN'
|
||||
break
|
||||
case 'toEN':
|
||||
console.log('root', this.$root.$i18n.locale)
|
||||
this.$root.$i18n.locale = 'en'
|
||||
location.reload()
|
||||
break
|
||||
}
|
||||
},
|
||||
// 全屏
|
||||
fullscreenHandle() {
|
||||
if (!screenfull.enabled) {
|
||||
@ -84,11 +154,15 @@ export default {
|
||||
},
|
||||
// 退出
|
||||
logoutHandle() {
|
||||
this.$confirm(this.$t('prompt.info', { handle: this.$t('logout') }), this.$t('prompt.title'), {
|
||||
confirmButtonText: this.$t('confirm'),
|
||||
cancelButtonText: this.$t('cancel'),
|
||||
type: 'warning'
|
||||
})
|
||||
this.$confirm(
|
||||
this.$t('prompt.info', { handle: this.$t('logout') }),
|
||||
this.$t('prompt.title'),
|
||||
{
|
||||
confirmButtonText: this.$t('confirm'),
|
||||
cancelButtonText: this.$t('cancel'),
|
||||
type: 'warning'
|
||||
}
|
||||
)
|
||||
.then(() => {
|
||||
this.$http
|
||||
.post(this.$http.adornUrl('/logout'))
|
||||
|
||||
@ -1,17 +1,36 @@
|
||||
<template>
|
||||
<div class="mod-config">
|
||||
<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
|
||||
<el-form
|
||||
:inline="true"
|
||||
:model="dataForm"
|
||||
@keyup.enter.native="getDataList()"
|
||||
>
|
||||
<el-form-item>
|
||||
<el-input v-model="dataForm.key" placeholder="设备名称/设备编码" clearable></el-input>
|
||||
<el-input
|
||||
v-model="dataForm.key"
|
||||
placeholder="设备名称/设备编码"
|
||||
clearable
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button @click="getDataList()">查询</el-button>
|
||||
<el-button v-if="$hasPermission('monitoring:equipment:save')" type="primary" @click="addOrUpdateHandle()">新增</el-button>
|
||||
<el-button @click="getDataList()">{{ $t('search') }}</el-button>
|
||||
<el-button
|
||||
v-if="$hasPermission('monitoring:equipment:save')"
|
||||
type="primary"
|
||||
@click="addOrUpdateHandle()"
|
||||
>{{ $t('add') }}</el-button
|
||||
>
|
||||
<el-button @click="exportHandle()">导出</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<base-table :data="dataList" :table-head-configs="tableConfigs" :max-height="500" @operate-event="handleOperations" @refreshDataList="getDataList" />
|
||||
<base-table
|
||||
:data="dataList"
|
||||
:table-head-configs="tableConfigs"
|
||||
:max-height="500"
|
||||
@operate-event="handleOperations"
|
||||
@refreshDataList="getDataList"
|
||||
/>
|
||||
<el-pagination
|
||||
@size-change="sizeChangeHandle"
|
||||
@current-change="currentChangeHandle"
|
||||
@ -22,11 +41,18 @@
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
></el-pagination>
|
||||
<!-- 弹窗, 新增 / 修改 -->
|
||||
<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" :configs="addOrUpdateConfigs" @refreshDataList="getDataList" @destory-dialog="addOrUpdateVisible = false" />
|
||||
<add-or-update
|
||||
v-if="addOrUpdateVisible"
|
||||
ref="addOrUpdate"
|
||||
:configs="addOrUpdateConfigs"
|
||||
@refreshDataList="getDataList"
|
||||
@destory-dialog="addOrUpdateVisible = false"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import i18n from '@/i18n'
|
||||
import AddOrUpdate from '@/components/base-dialog/addOrUpdate'
|
||||
// import AddOrUpdate from './equipment-add-or-update'
|
||||
import BaseTable from '@/components/base-table'
|
||||
@ -45,15 +71,31 @@ const tableConfigs = [
|
||||
// }
|
||||
// }
|
||||
},
|
||||
{ prop: 'createTime', name: '添加时间', filter: val => moment(val).format('YYYY-MM-DD HH:mm:ss') },
|
||||
{
|
||||
prop: 'createTime',
|
||||
name: i18n.t('createTime'),
|
||||
filter: val => moment(val).format('YYYY-MM-DD HH:mm:ss')
|
||||
},
|
||||
{ prop: 'name', name: '设备名称' },
|
||||
{ prop: 'code', name: '设备编码' },
|
||||
{ prop: 'equipmentTypeName', name: '设备类型' },
|
||||
{ prop: 'groupName', name: '设备分组' },
|
||||
{ prop: 'enName', name: '英文名称' },
|
||||
{ prop: 'abbr', name: '缩写' },
|
||||
{ prop: 'details', name: '详情', subcomponent: TableTextComponent, actionName: 'view-detail' },
|
||||
{ prop: 'operations', name: '操作', fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
|
||||
{
|
||||
prop: 'details',
|
||||
name: '详情',
|
||||
subcomponent: TableTextComponent,
|
||||
actionName: 'view-detail'
|
||||
},
|
||||
{
|
||||
prop: 'operations',
|
||||
name: '操作',
|
||||
fixed: 'right',
|
||||
width: 180,
|
||||
subcomponent: TableOperateComponent,
|
||||
options: ['edit', 'delete']
|
||||
}
|
||||
]
|
||||
|
||||
const addOrUpdateConfigs = {
|
||||
@ -64,8 +106,20 @@ const addOrUpdateConfigs = {
|
||||
{ name: 'code', label: '设备编码' },
|
||||
{ name: 'enName', label: '英文名称' },
|
||||
{ name: 'abbr', label: '缩写' },
|
||||
{ name: 'equipmentTypeId', label: '设备类型', required: true, type: 'select', options: [] },
|
||||
{ name: 'groupId', label: '设备分组', required: true, type: 'select', options: [] },
|
||||
{
|
||||
name: 'equipmentTypeId',
|
||||
label: '设备类型',
|
||||
required: true,
|
||||
type: 'select',
|
||||
options: []
|
||||
},
|
||||
{
|
||||
name: 'groupId',
|
||||
label: '设备分组',
|
||||
required: true,
|
||||
type: 'select',
|
||||
options: []
|
||||
},
|
||||
{
|
||||
name: 'productionTime',
|
||||
label: '生产日期',
|
||||
@ -92,8 +146,31 @@ const addOrUpdateConfigs = {
|
||||
}
|
||||
}
|
||||
},
|
||||
{ name: 'tvalue', label: '设备TT值', required: true, rules: [{ type: 'number', message: '请输入正确的浮点值', trigger: 'blur', transform: val => Number(val) }] },
|
||||
{ name: 'processingTime', label: '单件产品加工时间(秒)', rules: [{ type: 'number', message: '请输入正确的数值', trigger: 'blur', transform: val => Number(val) }] },
|
||||
{
|
||||
name: 'tvalue',
|
||||
label: '设备TT值',
|
||||
required: true,
|
||||
rules: [
|
||||
{
|
||||
type: 'number',
|
||||
message: '请输入正确的浮点值',
|
||||
trigger: 'blur',
|
||||
transform: val => Number(val)
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'processingTime',
|
||||
label: '单件产品加工时间(秒)',
|
||||
rules: [
|
||||
{
|
||||
type: 'number',
|
||||
message: '请输入正确的数值',
|
||||
trigger: 'blur',
|
||||
transform: val => Number(val)
|
||||
}
|
||||
]
|
||||
},
|
||||
{ name: 'manufacturer', label: '制造商' },
|
||||
{ name: 'spec', label: '设备规格' },
|
||||
{
|
||||
@ -163,17 +240,42 @@ const addOrUpdateConfigs = {
|
||||
{ prop: 'createTime', name: '创建时间' },
|
||||
{ prop: 'attrName', name: '属性名称', formField: true },
|
||||
{ prop: 'attrValue', name: '属性值', formField: true },
|
||||
{ prop: 'operations', name: '操作', fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
|
||||
{
|
||||
prop: 'operations',
|
||||
name: '操作',
|
||||
fixed: 'right',
|
||||
width: 180,
|
||||
subcomponent: TableOperateComponent,
|
||||
options: ['edit', 'delete']
|
||||
}
|
||||
]
|
||||
},
|
||||
operations: [
|
||||
{ name: 'cancel', showAlways: true },
|
||||
{ name: 'save', url: '/monitoring/equipment', permission: '', showOnEdit: false },
|
||||
{ name: 'update', url: '/monitoring/equipment', permission: '', showOnEdit: true }
|
||||
{
|
||||
name: 'save',
|
||||
url: '/monitoring/equipment',
|
||||
permission: '',
|
||||
showOnEdit: false
|
||||
},
|
||||
{
|
||||
name: 'update',
|
||||
url: '/monitoring/equipment',
|
||||
permission: '',
|
||||
showOnEdit: true
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
const i18nLocal = {
|
||||
messages: {
|
||||
'en': { search: 'Search', add: 'Add', createTime: 'create time' },
|
||||
'zh-CN': { search: '查询', add: '新建', createTime: '创建时间' }
|
||||
}
|
||||
}
|
||||
|
||||
export default {
|
||||
i18n: i18nLocal,
|
||||
data() {
|
||||
return {
|
||||
tableConfigs,
|
||||
@ -212,8 +314,14 @@ export default {
|
||||
// key: this.dataForm.key
|
||||
})
|
||||
}).then(({ data }) => {
|
||||
const eqTypeConfig = this.addOrUpdateConfigs.fields.find(item => item.name === 'equipmentTypeId')
|
||||
eqTypeConfig.options = data.data?.list?.map(item => ({ value: item.id, label: item.name })) || []
|
||||
const eqTypeConfig = this.addOrUpdateConfigs.fields.find(
|
||||
item => item.name === 'equipmentTypeId'
|
||||
)
|
||||
eqTypeConfig.options =
|
||||
data.data?.list?.map(item => ({
|
||||
value: item.id,
|
||||
label: item.name
|
||||
})) || []
|
||||
})
|
||||
},
|
||||
// 获取设备分组列表
|
||||
@ -227,8 +335,14 @@ export default {
|
||||
// key: this.dataForm.key
|
||||
})
|
||||
}).then(({ data }) => {
|
||||
const groupConfig = this.addOrUpdateConfigs.fields.find(item => item.name === 'groupId')
|
||||
groupConfig.options = data.data?.list?.map(item => ({ value: item.id, label: item.name })) || []
|
||||
const groupConfig = this.addOrUpdateConfigs.fields.find(
|
||||
item => item.name === 'groupId'
|
||||
)
|
||||
groupConfig.options =
|
||||
data.data?.list?.map(item => ({
|
||||
value: item.id,
|
||||
label: item.name
|
||||
})) || []
|
||||
})
|
||||
},
|
||||
// 获取数据列表
|
||||
@ -289,13 +403,19 @@ export default {
|
||||
},
|
||||
exportHandle() {
|
||||
// this.$http.get(this.$http.adornUrl('/monitoring/equipment/export')).then(({ data: res }) => {
|
||||
this.$http({ url: this.$http.adornUrl('/monitoring/equipment/export'), method: 'get', responseType: 'blob' }).then(res => {
|
||||
this.$http({
|
||||
url: this.$http.adornUrl('/monitoring/equipment/export'),
|
||||
method: 'get',
|
||||
responseType: 'blob'
|
||||
}).then(res => {
|
||||
let fileName = 'equipment-list.xls'
|
||||
if (res.headers['content-disposition']) {
|
||||
const contentDisposition = res.headers['content-disposition']
|
||||
fileName = contentDisposition.slice(contentDisposition.indexOf('filename=') + 9)
|
||||
fileName = contentDisposition.slice(
|
||||
contentDisposition.indexOf('filename=') + 9
|
||||
)
|
||||
}
|
||||
|
||||
|
||||
fileName = decodeURIComponent(fileName)
|
||||
|
||||
const blob = new Blob([res.data])
|
||||
@ -335,11 +455,15 @@ export default {
|
||||
: this.dataListSelections.map(item => {
|
||||
return item.id
|
||||
})
|
||||
this.$confirm(`确定对[id=${ids.join(',')}]进行[${id ? '删除' : '批量删除'}]操作?`, '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
this.$confirm(
|
||||
`确定对[id=${ids.join(',')}]进行[${id ? '删除' : '批量删除'}]操作?`,
|
||||
'提示',
|
||||
{
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}
|
||||
).then(() => {
|
||||
this.$http({
|
||||
url: this.$http.adornUrl('/monitoring/equipment'),
|
||||
method: 'delete',
|
||||
|
||||
Loading…
Reference in New Issue
Block a user