feat: 基础部分的国际化

This commit is contained in:
2024-04-01 10:33:53 +08:00
parent 620dba9b38
commit 7fed531835
34 changed files with 981 additions and 280 deletions

View File

@@ -8,7 +8,7 @@
v-model="query.name"
clearable
size="mini"
placeholder="输入部门名称搜索"
:placeholder="$t('Dept.search.input_name')"
style="width: 200px;"
class="filter-item"
@keyup.enter.native="crud.toQuery"
@@ -17,7 +17,7 @@
v-model="query.is_used"
clearable
size="mini"
placeholder="状态"
:placeholder="$t('Dept.table.is_used')"
class="filter-item"
style="width: 90px"
@change="crud.toQuery"
@@ -34,16 +34,16 @@
:before-close="crud.cancelCU"
:visible.sync="crud.status.cu > 0"
:title="crud.status.title"
width="500px"
:width="computedLabelWidth"
>
<el-form ref="form" inline :model="form" :rules="rules" size="mini" label-width="80px">
<el-form-item label="部门编码" prop="code">
<el-form ref="form" inline :model="form" :rules="rules" size="mini" :label-width="computedFormLabelWidth">
<el-form-item :label="$t('Dept.dialog.code')" prop="code">
<el-input v-model="form.code" :disabled="crud.status.edit" style="width: 370px;" />
</el-form-item>
<el-form-item label="部门名称" prop="name">
<el-form-item :label="$t('Dept.dialog.name')" prop="name">
<el-input v-model="form.name" style="width: 370px;" />
</el-form-item>
<el-form-item label="部门排序" prop="dept_sort">
<el-form-item :label="$t('Dept.dialog.dept_sort')" prop="dept_sort">
<el-input-number
v-model.number="form.dept_sort"
:min="0"
@@ -52,45 +52,42 @@
style="width: 370px;"
/>
</el-form-item>
<el-form-item label="外部标识" prop="ext_id">
<el-input v-model="form.ext_id" style="width: 370px;" />
</el-form-item>
<el-form-item label="顶级部门">
<el-form-item :label="$t('Dept.dialog.isTop')">
<el-radio-group v-model="form.isTop" style="width: 140px">
<el-radio label="1"></el-radio>
<el-radio label="0"></el-radio>
<el-radio label="1">{{ $t('common.Yes') }}</el-radio>
<el-radio label="0">{{ $t('common.No') }}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="状态" prop="is_used">
<el-form-item :label="$t('Dept.table.is_used')" prop="is_used">
<el-switch
v-model="form.is_used"
active-color="#409EFF"
inactive-color="#F56C6C"
active-value = 'true'
inactive-valu='false'
active-value="true"
inactive-valu="false"
/>
</el-form-item>
<el-form-item v-if="form.isTop === '0'" style="margin-bottom: 0;" label="上级部门" prop="pid">
<el-form-item v-if="form.isTop === '0'" style="margin-bottom: 0;" :label="$t('Dept.dialog.pid')" prop="pid">
<treeselect
v-model="form.pid"
:load-options="loadDepts"
:options="depts"
style="width: 370px;"
:normalizer="normalizer"
placeholder="选择部门类目"
:placeholder="$t('Dept.dialog.select_dep')"
/>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="text" @click="crud.cancelCU">取消</el-button>
<el-button :loading="crud.status.cu === 2" type="primary" @click="crud.submitCU">确认</el-button>
<el-button type="text" @click="crud.cancelCU">{{ $t('common.Cancel') }}</el-button>
<el-button :loading="crud.status.cu === 2" type="primary" @click="crud.submitCU">{{ $t('common.Confirm') }}</el-button>
</div>
</el-dialog>
<!--表格渲染 :load="getDeptDatas" 点击事件 row-key需要指定唯一的数据id-->
<el-table
ref="table"
v-loading="crud.loading"
:default-sort = "{prop: 'dept_sort', order: 'ascending'}"
:default-sort="{prop: 'dept_sort', order: 'ascending'}"
lazy
:load="getDeptDatas"
:tree-props="{children: 'children', hasChildren: 'has_children'}"
@@ -102,9 +99,9 @@
>
<el-table-column :selectable="checkboxT" type="selection" width="55" />
<!-- <el-table-column label="编码" prop="code" />-->
<el-table-column label="名称" prop="name" />
<el-table-column label="排序" prop="dept_sort" />
<el-table-column label="状态" align="center" prop="is_used">
<el-table-column :label="$t('Dept.table.name')" prop="name" />
<el-table-column :label="$t('Dept.table.dept_sort')" prop="dept_sort" />
<el-table-column :label="$t('Dept.table.is_used')" align="center" prop="is_used">
<template slot-scope="scope">
<el-switch
v-model="scope.row.is_used"
@@ -115,10 +112,10 @@
/>
</template>
</el-table-column>
<el-table-column prop="create_time" label="创建日期" />
<el-table-column prop="create_time" :label="$t('Dept.table.create_time')" />
<el-table-column
v-permission="['admin','dept:edit','dept:del']"
label="操作"
:label="$t('common.Operate')"
width="130px"
align="center"
fixed="right"
@@ -128,7 +125,7 @@
:data="scope.row"
:permission="permission"
:disabled-dle="scope.row.id === 1"
msg="确定删除吗,如果存在下级节点则一并删除此操作不能撤销"
:msg="$t('Dept.msg.tip1')"
/>
</template>
</el-table-column>
@@ -144,6 +141,7 @@ import CRUD, { crud, form, header, presenter } from '@crud/crud'
import rrOperation from '@crud/RR.operation'
import crudOperation from '@crud/CRUD.operation'
import udOperation from '@crud/UD.operation'
import i18n from '@/i18n'
const defaultForm = {
code: null,
@@ -159,7 +157,7 @@ export default {
name: 'Dept',
components: { Treeselect, crudOperation, rrOperation, udOperation },
cruds() {
return CRUD({ title: '部门', idField: 'dept_id', url: 'api/dept/vo', crudMethod: { ...crudDept }})
return CRUD({ title: i18n.t('Dept.title'), idField: 'dept_id', url: 'api/dept/vo', crudMethod: { ...crudDept }})
},
mixins: [presenter(), header(), form(defaultForm), crud()],
// 设置数据字典
@@ -169,10 +167,10 @@ export default {
depts: [],
rules: {
name: [
{ required: true, message: '请输入名称', trigger: 'blur' }
{ required: true, message: i18n.t('Dept.rules.r1'), trigger: 'blur' }
],
dept_sort: [
{ required: true, message: '请输入序号', trigger: 'blur', type: 'number' }
{ required: true, message: i18n.t('Dept.rules.r2'), trigger: 'blur', type: 'number' }
]
},
permission: {
@@ -181,11 +179,33 @@ export default {
del: ['admin', 'dept:del']
},
enabledTypeOptions: [
{ key: true, display_name: '启用' },
{ key: false, display_name: '禁用' }
{ key: true, display_name: i18n.t('Dept.dialog.start') },
{ key: false, display_name: i18n.t('Dept.dialog.ban') }
]
}
},
computed: {
computedLabelWidth() {
const item = localStorage.getItem('lang')
if (item === 'en') {
return `580px`
}
if (item === 'in') {
return `620px`
}
return `500px`
},
computedFormLabelWidth() {
const item = localStorage.getItem('lang')
if (item === 'en') {
return `140px`
}
if (item === 'in') {
return `190px`
}
return `80px`
}
},
methods: {
getDeptDatas(tree, treeNode, resolve) {
const params = { pid: tree.dept_id }
@@ -254,7 +274,7 @@ export default {
[CRUD.HOOK.afterValidateCU]() {
if (this.form.isTop !== '1' && this.form.pid == null) {
this.$message({
message: '上级部门不能为空',
message: i18n.t('Dept.msg.tip2'),
type: 'warning'
})
return false
@@ -266,15 +286,16 @@ export default {
},
// 改变状态
changeEnabled(data, val) {
const satus = this.enabledTypeOptions.find(item => { return item.key == data.is_used })
debugger
this.$confirm('此操作将 "' + satus.display_name + '" ' + data.name + '部门, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
const satus = this.enabledTypeOptions.find(item => {
return item.key == data.is_used
})
this.$confirm(i18n.t('Dept.msg.tip3.1') + ' "' + satus.display_name + '" ' + data.name + i18n.t('Dept.msg.tip3.2'), i18n.t('common.Tips'), {
confirmButtonText: i18n.t('common.Confirm'),
cancelButtonText: i18n.t('common.Cancel'),
type: 'warning'
}).then(() => {
crudDept.edit(data).then(res => {
this.crud.notify(satus.display_name + '成功', CRUD.NOTIFICATION_TYPE.SUCCESS)
this.crud.notify(satus.display_name + i18n.t('common.Success'), CRUD.NOTIFICATION_TYPE.SUCCESS)
})
}).catch(() => {
data.is_used = !data.is_used

View File

@@ -1,7 +1,7 @@
<template>
<div>
<div v-if="query.code === ''">
<div class="my-code">点击字典查看详情</div>
<div class="my-code">{{ $t('Dict.detail.see_title') }}</div>
</div>
<div v-else>
<!--工具栏-->
@@ -12,7 +12,7 @@
v-model="query.label"
clearable
size="mini"
placeholder="输入字典标签查询"
:placeholder="$t('Dict.detail.input_tip')"
style="width: 200px;"
class="filter-item"
@keyup.enter.native="toQuery"
@@ -27,37 +27,40 @@
:before-close="crud.cancelCU"
:visible="crud.status.cu > 0"
:title="crud.status.title"
width="500px"
:width="computedLabelWidth"
>
<el-form ref="form" :model="form" :rules="rules" size="mini" label-width="80px">
<el-form-item label="字典标签" prop="label">
<el-input v-model="form.label" style="width: 370px;" />
<el-form ref="form" :model="form" :rules="rules" size="mini" :label-width="computedFormLabelWidth">
<el-form-item :label="$t('Dict.detail.table.label')" prop="label">
<el-input v-model="form.label" style="width: 240px;" />
</el-form-item>
<el-form-item label="字典值" prop="value">
<el-input v-model="form.value" style="width: 370px;" />
<el-form-item :label="$t('Dict.detail.table.value')" prop="value">
<el-input v-model="form.value" style="width: 240px;" />
</el-form-item>
<el-form-item label="排序" prop="dict_sort">
<el-form-item :label="$t('Dict.detail.table.sort')" prop="dict_sort">
<el-input-number
v-model.number="form.dict_sort"
:min="0"
:max="999"
controls-position="right"
style="width: 370px;"
style="width: 240px;"
/>
</el-form-item>
<el-form-item label="参数1" prop="para1">
<el-input v-model="form.para1" style="width: 370px;" />
<el-form-item :label="$t('Dict.detail.table.param1')" prop="para1">
<el-input v-model="form.para1" style="width: 240px;" />
</el-form-item>
<el-form-item label="参数2" prop="para2">
<el-input v-model="form.para2" style="width: 370px;" />
<el-form-item :label="$t('Dict.detail.table.param2')" prop="para2">
<el-input v-model="form.para2" style="width: 240px;" />
</el-form-item>
<el-form-item label="参数3" prop="para3">
<el-input v-model="form.para3" style="width: 370px;" />
<el-form-item :label="$t('Dict.detail.table.param3')" prop="para3">
<el-input v-model="form.para3" style="width: 240px;" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="text" @click="crud.cancelCU">取消</el-button>
<el-button :loading="crud.status.cu === 2" type="primary" @click="crud.submitCU">确认</el-button>
<el-button type="text" @click="crud.cancelCU">{{ $t('common.Cancel') }}</el-button>
<el-button :loading="crud.status.cu === 2" type="primary" @click="crud.submitCU">{{
$t('common.Confirm')
}}
</el-button>
</div>
</el-dialog>
<!--表格渲染-->
@@ -69,20 +72,51 @@
style="width: 100%;"
@selection-change="crud.selectionChangeHandler"
>
<el-table-column label="所属字典" min-width="150" show-overflow-tooltip>
<el-table-column :label="$t('Dict.detail.table.code')" min-width="150" show-overflow-tooltip>
{{ query.code }}
</el-table-column>
<el-table-column prop="label" label="字典标签" align="center" width="120" show-overflow-tooltip />
<el-table-column prop="value" label="字典值" align="center" width="60" />
<el-table-column prop="dict_sort" label="排序" align="center" width="65" />
<el-table-column prop="para1" label="参数1" align="center" width="65" />
<el-table-column prop="para2" label="参数2" align="center" width="65" />
<el-table-column prop="para3" label="参数3" align="center" width="65" />
<el-table-column
prop="label"
:label="$t('Dict.detail.table.label')"
align="center"
:min-width="flexWidth('label',crud.data,$t('Dict.detail.table.label'))"
show-overflow-tooltip
/>
<el-table-column
prop="value"
:label="$t('Dict.detail.table.value')"
:min-width="flexWidth('value',crud.data,$t('Dict.detail.table.value'))"
align="center"
/>
<el-table-column
prop="dict_sort"
:label="$t('Dict.detail.table.sort')"
:min-width="flexWidth('dict_sort',crud.data,$t('Dict.detail.table.sort'))"
align="center"
/>
<el-table-column
prop="para1"
:label="$t('Dict.detail.table.param1')"
:min-width="flexWidth('para1',crud.data,$t('Dict.detail.table.param1'))"
align="center"
/>
<el-table-column
prop="para2"
:label="$t('Dict.detail.table.param2')"
:min-width="flexWidth('para2',crud.data,$t('Dict.detail.table.param2'))"
align="center"
/>
<el-table-column
prop="para3"
:label="$t('Dict.detail.table.param3')"
:min-width="flexWidth('para3',crud.data,$t('Dict.detail.table.param3'))"
align="center"
/>
<el-table-column
v-permission="['admin','dict:edit','dict:del']"
label="操作"
:label="$t('common.Operate')"
align="center"
width="115px"
width="165px"
fixed="right"
>
<template slot-scope="scope">
@@ -105,15 +139,32 @@ import CRUD, { form, header, presenter } from '@crud/crud'
import pagination from '@crud/Pagination'
import rrOperation from '@crud/RR.operation'
import udOperation from '@crud/UD.operation'
import i18n from '@/i18n'
const defaultForm = { dict_id: null, name: null, label: null, value: null, dict_sort: null, dictType: null, para1: null, para2: null, para3: null, createId: null, createName: null, createTime: null, updateId: null, updateName: null, updateTime: null }
const defaultForm = {
dict_id: null,
name: null,
label: null,
value: null,
dict_sort: null,
dictType: null,
para1: null,
para2: null,
para3: null,
createId: null,
createName: null,
createTime: null,
updateId: null,
updateName: null,
updateTime: null
}
export default {
components: { pagination, rrOperation, udOperation },
cruds() {
return [
CRUD({
title: '字典详情',
title: i18n.t('Dict.table.dict_detail'),
url: 'api/dict/dictDetail',
query: { code: '' },
idField: 'dict_id',
@@ -140,13 +191,13 @@ export default {
dict_id: null,
rules: {
label: [
{ required: true, message: '请输入字典标签', trigger: 'blur' }
{ required: true, message: i18n.t('Dict.detail.rules.r1'), trigger: 'blur' }
],
value: [
{ required: true, message: '请输入字典值', trigger: 'blur' }
{ required: true, message: i18n.t('Dict.detail.rules.r2'), trigger: 'blur' }
],
dict_sort: [
{ required: true, message: '请输入序号', trigger: 'blur', type: 'number' }
{ required: true, message: i18n.t('Dict.detail.rules.r3'), trigger: 'blur', type: 'number' }
]
},
permission: {
@@ -155,6 +206,22 @@ export default {
del: ['admin', 'dict:del']
}
}
},
computed: {
computedLabelWidth() {
const item = localStorage.getItem('lang')
if (item === 'en') {
return `450px`
}
return `420px`
},
computedFormLabelWidth() {
const item = localStorage.getItem('lang')
if (item === 'en') {
return `140px`
}
return `100px`
}
}
}
</script>

View File

@@ -7,19 +7,19 @@
:before-close="crud.cancelCU"
:visible="crud.status.cu > 0"
:title="crud.status.title"
width="500px"
:width="computedLabelWidth"
>
<el-form ref="form" :model="form" :rules="rules" size="mini" label-width="80px">
<el-form-item label="字典编码" prop="code">
<el-input v-model="form.code" style="width: 370px;" />
<el-form ref="form" :model="form" :rules="rules" size="mini" :label-width="computedFormLabelWidth">
<el-form-item :label="$t('Dict.table.dict_code')" prop="code">
<el-input v-model="form.code" style="width: 240px;" />
</el-form-item>
<el-form-item label="名称">
<el-input v-model="form.name" style="width: 370px;" />
<el-form-item :label="$t('Dict.table.dict_name')">
<el-input v-model="form.name" style="width: 240px;" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="text" @click="crud.cancelCU">取消</el-button>
<el-button :loading="crud.status.cu === 2" type="primary" @click="crud.submitCU">确认</el-button>
<el-button type="text" @click="crud.cancelCU">{{ $t('common.Cancel') }}</el-button>
<el-button :loading="crud.status.cu === 2" type="primary" @click="crud.submitCU">{{ $t('common.Confirm') }}</el-button>
</div>
</el-dialog>
<!-- 字典列表 -->
@@ -34,7 +34,7 @@
v-model="query.blurry"
clearable
size="mini"
placeholder="输入名称或者描述搜索"
:placeholder="$t('Dict.placeholder.blurry')"
style="width: 200px;"
class="filter-item"
@keyup.enter.native="crud.toQuery"
@@ -54,12 +54,11 @@
@current-change="handleCurrentChange"
>
<el-table-column type="selection" width="55" />
<el-table-column show-overflow-tooltip prop="code" label="编码" />
<el-table-column show-overflow-tooltip prop="name" label="名称" />
<el-table-column show-overflow-tooltip prop="code" :label="$t('Dict.table.code')" />
<el-table-column show-overflow-tooltip prop="name" :label="$t('Dict.table.name')" />
<el-table-column
v-permission="['admin','dict:edit','dict:del']"
label="操作"
width="130px"
:label="$t('common.Operate')"
align="center"
fixed="right"
>
@@ -79,7 +78,7 @@
<el-col :xs="11" :sm="11" :md="11" :lg="11" :xl="11">
<el-card class="box-card">
<div slot="header" class="clearfix">
<span>字典详情</span>
<span>{{ $t('Dict.table.dict_detail') }}</span>
<el-button
v-if="checkPermission(['admin','dict:add']) && this.$refs.dictDetail && this.$refs.dictDetail.query.code"
class="filter-item"
@@ -88,7 +87,7 @@
type="primary"
icon="el-icon-plus"
@click="$refs.dictDetail && $refs.dictDetail.crud.toAdd()"
>新增
>{{ $t('common.Create') }}
</el-button>
</div>
<dictDetail ref="dictDetail" :permission="permission" />
@@ -108,6 +107,7 @@ import crudOperation from '@crud/CRUD.operation'
import pagination from '@crud/Pagination'
import rrOperation from '@crud/RR.operation'
import udOperation from '@crud/UD.operation'
import i18n from '@/i18n'
const defaultForm = {
dict_id: null,
@@ -127,7 +127,7 @@ export default {
components: { crudOperation, pagination, rrOperation, udOperation, dictDetail },
cruds() {
return [
CRUD({ title: '字典', url: 'api/dict', idField: 'dict_id', crudMethod: { ...crudDict }})
CRUD({ title: i18n.t('Dict.title'), url: 'api/dict', idField: 'dict_id', crudMethod: { ...crudDict }})
]
},
mixins: [presenter(), header(), form(defaultForm)],
@@ -139,7 +139,7 @@ export default {
],
rules: {
code: [
{ required: true, message: '请输入编码', trigger: 'blur' }
{ required: true, message: i18n.t('Dict.rules.r1'), trigger: 'blur' }
]
},
permission: {
@@ -149,6 +149,22 @@ export default {
}
}
},
computed: {
computedLabelWidth() {
const item = localStorage.getItem('lang')
if (item === 'zh') {
return `380px`
}
return `450px`
},
computedFormLabelWidth() {
const item = localStorage.getItem('lang')
if (item === 'zh') {
return `80px`
}
return `160px`
}
},
methods: {
checkPermission,
// 获取数据前设置好接口地址

View File

@@ -36,9 +36,9 @@
:before-close="crud.cancelCU"
:visible.sync="crud.status.cu > 0"
:title="crud.status.title"
width="650px"
:width="computedLabelWidth"
>
<el-form ref="form" :inline="true" :model="form" :rules="rules" size="mini" label-width="100px">
<el-form ref="form" :inline="true" :model="form" :rules="rules" size="mini" :label-width="computedFormLabelWidth">
<el-form-item :label="$t('menu.dialog.menu_type')" prop="type">
<el-radio-group v-model="form.type" size="mini">
<el-radio-button label="1">{{ $t('menu.dialog.system') }}</el-radio-button>
@@ -69,20 +69,20 @@
</el-form-item>
<el-form-item v-show="form.type.toString() !== '2' && form.type.toString() !== '1'" :label="$t('menu.dialog.menu_chain')" prop="iframe">
<el-radio-group v-model="form.iframe" size="mini">
<el-radio-button label="true"></el-radio-button>
<el-radio-button label="false"></el-radio-button>
<el-radio-button label="true">{{ $t('common.Yes') }}</el-radio-button>
<el-radio-button label="false">{{ $t('common.No') }}</el-radio-button>
</el-radio-group>
</el-form-item>
<el-form-item v-show="form.type.toString() === '2'" :label="$t('menu.dialog.menu_cache')" prop="cache">
<el-radio-group v-model="form.cache" size="mini">
<el-radio-button label="true"></el-radio-button>
<el-radio-button label="false"></el-radio-button>
<el-radio-button label="true">{{ $t('common.Yes') }}</el-radio-button>
<el-radio-button label="false">{{ $t('common.No') }}</el-radio-button>
</el-radio-group>
</el-form-item>
<el-form-item v-show="form.type.toString() !== '2' && form.type.toString() !== '1' " :label="$t('menu.dialog.menu_visible')" prop="hidden">
<el-radio-group v-model="form.hidden" size="mini">
<el-radio-button label="false"></el-radio-button>
<el-radio-button label="true"></el-radio-button>
<el-radio-button label="false">{{ $t('common.Yes') }}</el-radio-button>
<el-radio-button label="true">{{ $t('common.No') }}</el-radio-button>
</el-radio-group>
</el-form-item>
<el-form-item v-if="form.type.toString() !== '2'" :label="$t('menu.dialog.default_title')" prop="title">
@@ -190,20 +190,20 @@
<el-table-column prop="component" :label="$t('menu.table.path')" min-width="120" />
<el-table-column prop="iframe" :label="$t('menu.table.outside_chain')" :formatter="crud.formatIsOrNot" :min-width="flexWidth('iframe',crud.data,$t('menu.table.outside_chain'))">
<template slot-scope="scope">
<span v-if="scope.row.iframe">YES</span>
<span v-else>NO</span>
<span v-if="scope.row.iframe">{{ $t('common.Yes') }}</span>
<span v-else>{{ $t('common.No') }}</span>
</template>
</el-table-column>
<el-table-column prop="cache" :label="$t('menu.table.cache')" :formatter="crud.formatIsOrNot" :min-width="flexWidth('cache',crud.data,$t('menu.table.cache'))">
<template slot-scope="scope">
<span v-if="scope.row.cache">YES</span>
<span v-else>NO</span>
<span v-if="scope.row.cache">{{ $t('common.Yes') }}</span>
<span v-else>{{ $t('common.No') }}</span>
</template>
</el-table-column>
<el-table-column prop="hidden" :label="$t('menu.table.visible')" :formatter="crud.formatIsOrNot" :min-width="flexWidth('hidden',crud.data,$t('menu.table.visible'))">
<template slot-scope="scope">
<span v-if="scope.row.hidden">NO</span>
<span v-else>YES</span>
<span v-if="scope.row.hidden">{{ $t('common.No') }}</span>
<span v-else>{{ $t('common.Yes') }}</span>
</template>
</el-table-column>
<el-table-column prop="create_time" :label="$t('menu.table.create_time')" :min-width="flexWidth('create_time',crud.data,$t('menu.table.create_time'))" />
@@ -299,6 +299,28 @@ export default {
}
}
},
computed: {
computedLabelWidth() {
const item = localStorage.getItem('lang')
if (item === 'en') {
return `800px`
}
if (item === 'in') {
return `800px`
}
return `650px`
},
computedFormLabelWidth() {
const item = localStorage.getItem('lang')
if (item === 'en') {
return `140px`
}
if (item === 'in') {
return `150px`
}
return `100px`
}
},
methods: {
normalizer(node) {
return {

View File

@@ -8,7 +8,7 @@
v-model="query.job_name"
clearable
size="mini"
placeholder="输入任务名称搜索"
:placeholder="$t('Scheduling.placeholder.search')"
style="width: 200px;"
class="filter-item"
@keyup.enter.native="toQuery"
@@ -24,7 +24,8 @@
type="info"
icon="el-icon-tickets"
@click="doLog"
>日志
>
{{ $t('Scheduling.placeholder.log') }}
</el-button>
</crudOperation>
<Log ref="log" />
@@ -36,60 +37,67 @@
:visible.sync="crud.status.cu > 0"
:title="crud.status.title"
append-to-body
width="730px"
:width="computedLabelWidth"
>
<el-form ref="form" :inline="true" :model="form" :rules="rules" size="mini" label-width="100px">
<el-form-item label="任务名称" prop="job_name">
<el-form
ref="form"
:inline="true"
:model="form"
:rules="rules"
size="mini"
:label-width="computedFormLabelWidth"
>
<el-form-item :label="$t('Scheduling.table.job_name')" prop="job_name">
<el-input v-model="form.job_name" style="width: 220px;" />
</el-form-item>
<el-form-item label="任务描述" prop="description">
<el-form-item :label="$t('Scheduling.table.description')" prop="description">
<el-input v-model="form.description" style="width: 220px;" />
</el-form-item>
<el-form-item label="Bean名称" prop="bean_name">
<el-form-item :label="$t('Scheduling.table.bean_name')" prop="bean_name">
<el-input v-model="form.bean_name" style="width: 220px;" />
</el-form-item>
<el-form-item label="执行方法" prop="method_name">
<el-form-item :label="$t('Scheduling.table.method_name')" prop="method_name">
<el-input v-model="form.method_name" style="width: 220px;" />
</el-form-item>
<el-form-item label="Cron表达式" prop="cron_expression">
<el-form-item :label="$t('Scheduling.table.cron_expression')" prop="cron_expression">
<!-- <el-input v-model="form.cron_expression" style="width: 220px;" />-->
<el-input v-model="form.cron_expression" placeholder="请输入CRON 表达式" style="width: 220px;">
<el-input v-model="form.cron_expression" :placeholder="$t('Scheduling.placeholder.cron_expression')" style="width: 220px;">
<template slot="append">
<el-button type="primary" @click="handleShowCron">
生成表达式
{{ $t('Scheduling.placeholder.build_corn') }}
<i class="el-icon-time el-icon--right" />
</el-button>
</template>
</el-input>
</el-form-item>
<el-form-item label="子任务ID">
<el-input v-model="form.sub_task" placeholder="多个用逗号隔开按顺序执行" style="width: 220px;" />
<el-form-item :label="$t('Scheduling.dialog.sub_task')">
<el-input v-model="form.sub_task" :placeholder="$t('Scheduling.dialog.p1')" style="width: 220px;" />
</el-form-item>
<el-form-item label="任务负责人" prop="person_in_charge">
<el-form-item :label="$t('Scheduling.dialog.person_in_charge')" prop="person_in_charge">
<el-input v-model="form.person_in_charge" style="width: 220px;" />
</el-form-item>
<el-form-item label="告警邮箱" prop="email">
<el-input v-model="form.email" placeholder="多个邮箱用逗号隔开" style="width: 220px;" />
<el-form-item :label="$t('Scheduling.dialog.email')" prop="email">
<el-input v-model="form.email" :placeholder="$t('Scheduling.dialog.p2')" style="width: 220px;" />
</el-form-item>
<el-form-item label="失败后暂停">
<el-form-item :label="$t('Scheduling.dialog.pause_after_failure')">
<el-radio-group v-model="form.pause_after_failure" style="width: 220px">
<el-radio :label="true"></el-radio>
<el-radio :label="false"></el-radio>
<el-radio :label="true">{{ $t('common.Yes') }}</el-radio>
<el-radio :label="false">{{ $t('common.No') }}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="任务状态">
<el-form-item :label="$t('Scheduling.dialog.is_pause')">
<el-radio-group v-model="form.is_pause" style="width: 220px">
<el-radio :label="false">启用</el-radio>
<el-radio :label="true">暂停</el-radio>
<el-radio :label="false">{{ $t('Scheduling.dialog.start') }}</el-radio>
<el-radio :label="true">{{ $t('Scheduling.dialog.stop') }}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="参数内容">
<el-form-item :label="$t('Scheduling.dialog.params')">
<el-input v-model="form.params" style="width: 556px;" rows="4" type="textarea" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="text" @click="crud.cancelCU">取消</el-button>
<el-button :loading="crud.status.cu === 2" type="primary" @click="crud.submitCU">确认</el-button>
<el-button type="text" @click="crud.cancelCU">{{ $t('common.Cancel') }}</el-button>
<el-button :loading="crud.status.cu === 2" type="primary" @click="crud.submitCU">{{ $t('common.Confirm') }}</el-button>
</div>
</el-dialog>
<!--表格渲染-->
@@ -101,35 +109,35 @@
@selection-change="crud.selectionChangeHandler"
>
<el-table-column :selectable="checkboxT" type="selection" width="55" />
<el-table-column show-overflow-tooltip prop="job_id" label="任务ID" />
<el-table-column show-overflow-tooltip prop="job_name" label="任务名称" min-width="120" />
<el-table-column show-overflow-tooltip prop="bean_name" label="Bean名称" />
<el-table-column show-overflow-tooltip prop="method_name" label="执行方法" />
<el-table-column show-overflow-tooltip prop="params" label="参数" />
<el-table-column show-overflow-tooltip prop="job_id" :label="$t('Scheduling.table.job_id')" />
<el-table-column show-overflow-tooltip prop="job_name" :label="$t('Scheduling.table.job_name')" min-width="120" />
<el-table-column show-overflow-tooltip prop="bean_name" :label="$t('Scheduling.table.bean_name')" />
<el-table-column show-overflow-tooltip prop="method_name" :label="$t('Scheduling.table.method_name')" />
<el-table-column show-overflow-tooltip prop="params" :label="$t('Scheduling.table.params')" />
<el-table-column
show-overflow-tooltip
prop="cron_expression"
label="cron表达式"
:label="$t('Scheduling.table.cron_expression')"
min-width="100"
show-tooltip-when-overflow
/>
<el-table-column show-overflow-tooltip prop="is_pause" width="90px" label="状态">
<el-table-column show-overflow-tooltip prop="is_pause" width="90px" :label="$t('Scheduling.table.is_pause')">
<template slot-scope="scope">
<el-tag :type="scope.row.is_pause ? 'warning' : 'success'">{{
scope.row.is_pause ? '已暂停' : '运行中'
scope.row.is_pause ? $t('Scheduling.table.is_pause_ok') : $t('Scheduling.table.is_pause_no')
}}
</el-tag>
</template>
</el-table-column>
<el-table-column show-overflow-tooltip prop="description" width="150px" label="描述" />
<el-table-column show-overflow-tooltip prop="create_time" width="136px" label="创建日期">
<el-table-column show-overflow-tooltip prop="description" width="150px" :label="$t('Scheduling.table.description')" />
<el-table-column show-overflow-tooltip prop="create_time" width="150px" :label="$t('Scheduling.table.create_time')">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.create_time) }}</span>
</template>
</el-table-column>
<el-table-column
v-permission="['admin','timing:edit','timing:del']"
label="操作"
:label="$t('common.Operate')"
width="170px"
align="center"
fixed="right"
@@ -141,7 +149,8 @@
style="margin-right: 3px;"
type="text"
@click="crud.toEdit(scope.row)"
>编辑
>
{{ $t('common.Editors') }}
</el-button>
<el-button
v-permission="['admin','timing:edit']"
@@ -149,16 +158,17 @@
type="text"
size="mini"
@click="execute(scope.row.job_id)"
>执行
>
{{ $t('Scheduling.table.execute') }}
</el-button>
<el-button
v-permission="['admin','timing:edit']"
style="margin-left: 3px"
type="text"
size="mini"
@click="updateStatus(scope.row.job_id,scope.row.is_pause ? '恢复' : '暂停')"
@click="updateStatus(scope.row.job_id,scope.row.is_pause ? $t('Scheduling.table.recover') : $t('Scheduling.table.pause'))"
>
{{ scope.row.is_pause ? '恢复' : '暂停' }}
{{ scope.row.is_pause ? $t('Scheduling.table.recover') : $t('Scheduling.table.pause') }}
</el-button>
<el-popover
:ref="scope.row.job_id"
@@ -166,20 +176,25 @@
placement="top"
width="200"
>
<p>确定停止并删除该任务吗?</p>
<p>{{ $t('Scheduling.msg.tip1') }}</p>
<div style="text-align: right; margin: 0">
<el-button size="mini" type="text" @click="$refs[scope.row.job_id].doClose()">取消</el-button>
<el-button :loading="delLoading" type="primary" size="mini" @click="delMethod(scope.row.job_id)">确定
<el-button size="mini" type="text" @click="$refs[scope.row.job_id].doClose()">
{{ $t('common.Cancel') }}
</el-button>
<el-button :loading="delLoading" type="primary" size="mini" @click="delMethod(scope.row.job_id)">
{{ $t('common.Confirm') }}
</el-button>
</div>
<el-button slot="reference" type="text" size="mini">删除</el-button>
<el-button slot="reference" type="text" size="mini">
{{ $t('common.Delete') }}
</el-button>
</el-popover>
</template>
</el-table-column>
</el-table>
<!--分页组件-->
<pagination />
<el-dialog title="Cron表达式生成器" :visible.sync="openCron" append-to-body class="scrollbar" destroy-on-close>
<el-dialog :title="$t('Scheduling.table.openCron')" :visible.sync="openCron" append-to-body class="scrollbar" destroy-on-close>
<crontab :expression="expression" @hide="openCron=false" @fill="crontabFill" />
</el-dialog>
</div>
@@ -193,6 +208,7 @@ import rrOperation from '@crud/RR.operation'
import crudOperation from '@crud/CRUD.operation'
import pagination from '@crud/Pagination'
import Crontab from './components/crontab'
import i18n from '@/i18n'
const defaultForm = {
job_id: null,
@@ -212,7 +228,7 @@ export default {
name: 'Timing',
components: { Log, pagination, crudOperation, rrOperation, Crontab },
cruds() {
return CRUD({ title: '定时任务', idField: 'job_id', url: 'api/jobs', crudMethod: { ...crudJob }})
return CRUD({ title: i18n.t('Scheduling.title'), idField: 'job_id', url: 'api/jobs', crudMethod: { ...crudJob }})
},
mixins: [presenter(), header(), form(defaultForm), crud()],
data() {
@@ -225,22 +241,22 @@ export default {
},
rules: {
job_name: [
{ required: true, message: '请输入任务名称', trigger: 'blur' }
{ required: true, message: i18n.t('Scheduling.rules.r1'), trigger: 'blur' }
],
description: [
{ required: true, message: '请输入任务描述', trigger: 'blur' }
{ required: true, message: i18n.t('Scheduling.rules.r2'), trigger: 'blur' }
],
bean_name: [
{ required: true, message: '请输入Bean名称', trigger: 'blur' }
{ required: true, message: i18n.t('Scheduling.rules.r3'), trigger: 'blur' }
],
method_name: [
{ required: true, message: '请输入方法名称', trigger: 'blur' }
{ required: true, message: i18n.t('Scheduling.rules.r4'), trigger: 'blur' }
],
cron_expression: [
{ required: true, message: '请输入Cron表达式', trigger: 'blur' }
{ required: true, message: i18n.t('Scheduling.rules.r5'), trigger: 'blur' }
],
person_in_charge: [
{ required: true, message: '请输入负责人名称', trigger: 'blur' }
{ required: true, message: i18n.t('Scheduling.rules.r6'), trigger: 'blur' }
]
},
// 是否显示Cron表达式弹出层
@@ -249,6 +265,28 @@ export default {
expression: ''
}
},
computed: {
computedLabelWidth() {
const item = localStorage.getItem('lang')
if (item === 'en') {
return `800px`
}
if (item === 'in') {
return `860px`
}
return `730px`
},
computedFormLabelWidth() {
const item = localStorage.getItem('lang')
if (item === 'en') {
return `140px`
}
if (item === 'in') {
return `170px`
}
return `100px`
}
},
methods: {
// 执行
execute(id) {

View File

@@ -1,39 +1,45 @@
<template>
<el-dialog :visible.sync="dialog" append-to-body title="执行日志" width="88%">
<el-dialog :visible.sync="dialog" append-to-body :title="$t('Scheduling.log.dialog_title')" width="88%">
<!-- 搜索 -->
<div class="head-container">
<el-input v-model="query.job_name" clearable size="mini" placeholder="输入任务名称搜索" style="width: 200px;" class="filter-item" @keyup.enter.native="toQuery" />
<el-input v-model="query.job_name" clearable size="mini" :placeholder="$t('Scheduling.placeholder.search')" style="width: 200px;" class="filter-item" @keyup.enter.native="toQuery" />
<date-range-picker v-model="query.create_time" class="date-item" />
<el-select v-model="query.is_success" placeholder="日志状态" clearable size="mini" class="filter-item" style="width: 110px" @change="toQuery">
<el-select v-model="query.is_success" :placeholder="$t('Scheduling.log.log_status')" clearable size="mini" class="filter-item" style="width: 110px" @change="toQuery">
<el-option v-for="item in enabledTypeOptions" :key="item.key" :label="item.displayName" :value="item.key" />
</el-select>
<el-button class="filter-item" size="mini" type="success" icon="el-icon-search" @click="toQuery">搜索</el-button>
<el-button class="filter-item" size="mini" type="success" icon="el-icon-search" @click="toQuery">
{{ $t('Scheduling.log.search') }}
</el-button>
</div>
<!--表格渲染-->
<el-table v-loading="loading" :data="data" style="width: 100%;margin-top: -10px;">
<el-table-column show-overflow-tooltip prop="job_name" label="任务名称" />
<el-table-column show-overflow-tooltip prop="bean_name" label="Bean名称" />
<el-table-column show-overflow-tooltip prop="method_name" label="执行方法" />
<el-table-column show-overflow-tooltip prop="params" width="120px" label="参数" />
<el-table-column show-overflow-tooltip prop="cron_expression" label="cron表达式" />
<el-table-column prop="create_time" label="异常详情" width="110px">
<el-table-column show-overflow-tooltip prop="job_name" :label="$t('Scheduling.table.job_name')" />
<el-table-column show-overflow-tooltip prop="bean_name" :label="$t('Scheduling.table.bean_name')" />
<el-table-column show-overflow-tooltip prop="method_name" :label="$t('Scheduling.table.method_name')" />
<el-table-column show-overflow-tooltip prop="params" width="120px" :label="$t('Scheduling.table.params')" />
<el-table-column show-overflow-tooltip prop="cron_expression" :label="$t('Scheduling.table.cron_expression')" />
<el-table-column prop="description" :label="$t('Scheduling.log.description')" width="110px">
<template slot-scope="scope">
<el-button v-show="scope.row.exception_detail" size="mini" type="text" @click="info(scope.row.exception_detail)">查看详情</el-button>
<el-button v-show="scope.row.exception_detail" size="mini" type="text" @click="info(scope.row.exception_detail)">
{{ $t('Scheduling.log.see_description') }}
</el-button>
</template>
</el-table-column>
<el-table-column show-overflow-tooltip align="center" prop="time" width="100px" label="耗时(毫秒)" />
<el-table-column align="center" prop="is_success" width="80px" label="状态">
<el-table-column show-overflow-tooltip align="center" prop="time" width="100px" :label="$t('Scheduling.log.elapsed')" />
<el-table-column align="center" prop="is_success" width="80px" :label="$t('Scheduling.table.is_pause')">
<template slot-scope="scope">
<el-tag :type="scope.row.is_success ? 'success' : 'danger'">{{ scope.row.is_success ? '成功' : '失败' }}</el-tag>
<el-tag :type="scope.row.is_success ? 'success' : 'danger'">
{{ scope.row.is_success ? $t('Scheduling.log.success') : $t('Scheduling.log.fail') }}
</el-tag>
</template>
</el-table-column>
<el-table-column min-width="100" show-overflow-tooltip prop="create_time" label="创建日期">
<el-table-column min-width="100" show-overflow-tooltip prop="create_time" :label="$t('Scheduling.table.create_time')">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.create_time) }}</span>
</template>
</el-table-column>
</el-table>
<el-dialog :visible.sync="errorDialog" append-to-body title="异常详情" width="85%">
<el-dialog :visible.sync="errorDialog" append-to-body :title="$t('Scheduling.log.description')" width="85%">
<pre v-highlightjs="errorInfo"><code class="java" /></pre>
</el-dialog>
<!--分页组件-->
@@ -52,16 +58,17 @@
<script>
import crud from '@/mixins/crud'
import DateRangePicker from '@/components/DateRangePicker'
import i18n from '@/i18n'
export default {
components: { DateRangePicker },
mixins: [crud],
data() {
return {
title: '任务日志',
title: i18n.t('Scheduling.log.title'),
errorInfo: '', errorDialog: false,
enabledTypeOptions: [
{ key: '1', displayName: '成功' },
{ key: '0', displayName: '失败' }
{ key: '1', displayName: i18n.t('Scheduling.log.success') },
{ key: '0', displayName: i18n.t('Scheduling.log.fail') }
]
}
},

View File

@@ -8,7 +8,7 @@
v-model="deptName"
clearable
size="mini"
placeholder="请输入部门名称"
:placeholder="$t('User.placeholder.dep_tip')"
prefix-icon="el-icon-search"
class="filter-item"
@input="getDeptDatas"
@@ -30,7 +30,7 @@
v-model="query.blurry"
clearable
size="mini"
placeholder="输入账号或者名称"
:placeholder="$t('User.placeholder.blu_tip')"
style="width: 200px;"
class="filter-item"
@keyup.enter.native="crud.toQuery"
@@ -39,7 +39,7 @@
v-model="query.is_used"
clearable
size="mini"
placeholder="状态"
:placeholder="$t('User.table.enabled')"
class="filter-item"
style="width: 90px"
@change="crud.toQuery"
@@ -62,23 +62,23 @@
:before-close="crud.cancelCU"
:visible.sync="crud.status.cu > 0"
:title="crud.status.title"
width="700px"
:width="computedLabelWidth"
>
<el-form ref="form" :inline="true" :model="form" :rules="rules" size="mini" label-width="100px">
<el-form-item label="用户名" prop="username">
<el-form ref="form" :inline="true" :model="form" :rules="rules" size="mini" :label-width="computedFormLabelWidth" style="border: 1px solid #cfe0df;margin-top: 10px;padding-top: 10px;">
<el-form-item :label="$t('User.table.user_name')" prop="username">
<el-input v-model="form.username" style="width: 200px;" />
</el-form-item>
<el-form-item label="电话" prop="phone">
<el-form-item :label="$t('User.table.phone')" prop="phone">
<el-input v-model.number="form.phone" style="width: 200px;" />
</el-form-item>
<el-form-item label="姓名" prop="preson_name">
<el-form-item :label="$t('User.table.person_name')" prop="preson_name">
<el-input v-model="form.person_name" style="width: 200px;" />
</el-form-item>
<el-form-item label="邮箱" prop="email">
<el-form-item :label="$t('User.table.email')" prop="email">
<el-input v-model="form.email" style="width: 200px;" />
</el-form-item>
<br v-if="!crud.status.edit">
<el-form-item v-if="crud.status.add" label="部门" prop="depts" :rules="[{ required: true, message: '请选择部门', trigger: 'change' }]">
<el-form-item v-if="crud.status.add" :label="$t('User.table.depts')" prop="depts" :rules="[{ required: true, message: '请选择部门', trigger: 'change' }]">
<treeselect
v-model="form.depts"
:load-options="loadDepts"
@@ -87,20 +87,20 @@
:multiple="true"
:flat="true"
:normalizer="normalizer"
placeholder="选择部门类目"
:placeholder="$t('User.placeholder.dep_select_tip')"
/>
</el-form-item>
<br v-if="!crud.status.add">
<el-form-item v-if="crud.status.add" label="密码" prop="password">
<el-form-item v-if="crud.status.add" :label="$t('User.dialog.password')" prop="password">
<el-input v-model="form.password" style="width: 200px;" show-password auto-complete="new-password" />
</el-form-item>
<el-form-item label="性别">
<el-form-item :label="$t('User.table.gender')">
<el-radio-group v-model="form.gender" style="width: 178px">
<el-radio label=""></el-radio>
<el-radio label=""></el-radio>
<el-radio label="1">{{ $t('User.dialog.sex_male') }}</el-radio>
<el-radio label="2">{{ $t('User.dialog.sex_female') }}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="状态" prop="is_uesd">
<el-form-item :label="$t('User.table.enabled')" prop="is_uesd">
<el-switch
v-model="form.is_used"
active-color="#409EFF"
@@ -108,14 +108,14 @@
/>
</el-form-item>
<br v-if="!crud.status.edit">
<el-form-item v-if="crud.status.add" style="margin-bottom: 0;" label="角色" prop="roles">
<el-form-item v-if="crud.status.add" style="margin-bottom: 0;" :label="$t('User.dialog.role')" prop="roles">
<el-select
v-model="roleDatas"
style="width: 512px"
multiple
active-value="1"
inactive-value="0"
placeholder="请选择"
:placeholder="$t('common.Please_select')"
@remove-tag="deleteTag"
@change="changeRole"
>
@@ -130,8 +130,8 @@
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="text" @click="crud.cancelCU">取消</el-button>
<el-button :loading="crud.status.cu === 2" type="primary" @click="crud.submitCU">确认</el-button>
<el-button type="text" @click="crud.cancelCU">{{ $t('common.Cancel') }}</el-button>
<el-button :loading="crud.status.cu === 2" type="primary" @click="crud.submitCU">{{ $t('common.Confirm') }}</el-button>
</div>
</el-dialog>
<!--表格渲染-->
@@ -143,50 +143,54 @@
@selection-change="crud.selectionChangeHandler"
>
<el-table-column :selectable="checkboxT" type="selection" width="55" />
<el-table-column prop="username" label="用户名" :min-width="flexWidth('username',crud.data,'用户名')" />
<el-table-column prop="username" :label="$t('User.table.user_name')" :min-width="flexWidth('username',crud.data,$t('User.table.user_name'))" />
<el-table-column
prop="person_name"
label="姓名"
:min-width="flexWidth('person_name',crud.data,'姓名')"
:label="$t('User.table.person_name')"
:min-width="flexWidth('person_name',crud.data,$t('User.table.person_name'))"
/>
<el-table-column prop="gender" label="性别" :min-width="flexWidth('gender',crud.data,'性别')" />
<el-table-column prop="phone" label="电话" :min-width="flexWidth('phone',crud.data,'电话')" />
<el-table-column prop="email" label="邮箱" :min-width="flexWidth('email',crud.data,'邮箱')" />
<el-table-column show-overflow-tooltip prop="depts" label="部门" :min-width="flexWidth('depts',crud.data,'邮箱')">
<el-table-column prop="gender" :label="$t('User.table.gender')" :min-width="flexWidth('gender',crud.data,$t('User.table.gender'))">
<template slot-scope="scope">
{{ scope.row.gender === '1' ? $t('User.dialog.sex_male') : $t('User.dialog.sex_female') }}
</template>
</el-table-column>
<el-table-column prop="phone" :label="$t('User.table.phone')" :min-width="flexWidth('phone',crud.data,$t('User.table.phone'))" />
<el-table-column prop="email" :label="$t('User.table.email')" :min-width="flexWidth('email',crud.data,$t('User.table.email'))" />
<el-table-column show-overflow-tooltip prop="depts" :label="$t('User.table.depts')" :min-width="flexWidth('depts',crud.data,$t('User.table.depts'))">
<template slot-scope="scope">
<span v-for="(item, index) in scope.row.depts" :key="index">
{{ item.name }}<span v-if="index !== scope.row.depts.length - 1">、</span>
</span>
</template>
</el-table-column>
<el-table-column label="状态" align="center" prop="enabled">
<el-table-column :label="$t('User.table.enabled')" align="center" prop="enabled">
<template slot-scope="scope">
<span :style="{'color': caseStatusColorFilter(scope.row.is_used)}">{{ enabledTypeOptions.find(item => {return item.key == scope.row.is_used}).display_name }}</span>
</template>
</el-table-column>
<el-table-column prop="create_time" label="创建日期" :min-width="flexWidth('create_time',crud.data,'创建日期')" />
<el-table-column prop="create_time" :label="$t('User.table.create_time')" :min-width="flexWidth('create_time',crud.data,$t('User.table.create_time'))" />
<el-table-column
label="操作"
:label="$t('common.Operate')"
fixed="right"
align="center"
width="200"
>
<template slot-scope="scope">
<el-button size="mini" type="text" icon="el-icon-edit" @click="crud.toEdit(scope.row)">修改</el-button>
<el-button size="mini" type="text" icon="el-icon-delete" @click="handdeleted(scope.row)">删除</el-button>
<el-button size="mini" type="text" icon="el-icon-edit" @click="crud.toEdit(scope.row)">{{ $t('common.Update') }}</el-button>
<el-button size="mini" type="text" icon="el-icon-delete" @click="handdeleted(scope.row)">{{ $t('common.Delete') }}</el-button>
<el-dropdown v-hasPermi="['system:user:resetPwd', 'system:user:edit']" size="mini">
<el-button size="mini" type="text" icon="el-icon-d-arrow-right">更多</el-button>
<el-button size="mini" type="text" icon="el-icon-d-arrow-right">{{ $t('common.More') }}</el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item icon="el-icon-refresh-right"><span @click="resetPassword(scope.row)">重置密码</span></el-dropdown-item>
<el-dropdown-item icon="el-icon-refresh-right"><span @click="resetPassword(scope.row)">{{ $t('User.table.reset_pwd') }}</span></el-dropdown-item>
<el-dropdown-item icon="el-icon-key">
<span @click="openDeptDrawer(scope.row)">部门权限</span>
<span @click="openDeptDrawer(scope.row)">{{ $t('User.table.dept_reg') }}</span>
</el-dropdown-item>
<el-dropdown-item icon="el-icon-key">
<span @click="openDataDialog(scope.row)">数据权限</span>
<span @click="openDataDialog(scope.row)">{{ $t('User.table.data_reg') }}</span>
</el-dropdown-item>
<el-dropdown-item icon="el-icon-lock"><span @click="changeEnabled(scope.row)">{{ enabledTypeOptions.find(item => {return item.key !== scope.row.is_used}).display_name }}账号</span></el-dropdown-item>
<el-dropdown-item icon="el-icon-lock"><span @click="changeEnabled(scope.row)">{{ enabledTypeOptions.find(item => {return item.key !== scope.row.is_used}).display_name }}{{ $t('User.table.account') }}</span></el-dropdown-item>
<el-dropdown-item icon="el-icon-circle-check">
<span @click="openRoleDrawer(scope.row)">分配角色</span>
<span @click="openRoleDrawer(scope.row)">{{ $t('User.table.assign_roles') }}</span>
</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
@@ -306,14 +310,14 @@
:data="dataPermissions"
style="width: 100%; max-height: 500px"
>
<el-table-column prop="permission_scope_type" label="权限类型" min-width="100" show-overflow-tooltip>
<el-table-column prop="permission_scope_type" :label="$t('User.table.permission_scope_type')" min-width="100" show-overflow-tooltip>
<template slot-scope="scope">
{{ dict.label.permission_scope_type[scope.row.permission_scope_type] }}
</template>
</el-table-column>
<el-table-column prop="permissionName" label="权限范围" min-width="100" show-overflow-tooltip />
<el-table-column prop="deptName" label="部门名称" min-width="100" show-overflow-tooltip />
<el-table-column prop="person_name" label="用户名称" min-width="100" show-overflow-tooltip />
<el-table-column prop="permissionName" :label="$t('User.table.permissionName')" min-width="100" show-overflow-tooltip />
<el-table-column prop="deptName" :label="$t('User.table.deptName')" min-width="100" show-overflow-tooltip />
<el-table-column prop="person_name" :label="$t('User.table.person_name')" min-width="100" show-overflow-tooltip />
</el-table>
</el-dialog>
<relevance-user-dialog :dialog-show.sync="relevanceUser" :is-single="false" :users="userIds" @selectUsers="selectUsers" />
@@ -336,6 +340,7 @@ import { mapGetters } from 'vuex'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
import RelevanceUserDialog from '@/views/system/user/dialog/relevanceUserDialog'
import RelevanceDeptDialog from '@/views/system/user/dialog/relevanceDeptDialog'
import i18n from '@/i18n'
let userRoles = []
const defaultForm = {
@@ -343,7 +348,7 @@ const defaultForm = {
depts: [],
username: null,
person_name: null,
gender: '',
gender: '1',
email: null,
is_used: true,
roles: [],
@@ -354,7 +359,7 @@ export default {
name: 'User',
components: { RelevanceDeptDialog, RelevanceUserDialog, Treeselect, crudOperation, rrOperation, udOperation, pagination },
cruds() {
return CRUD({ title: '用户', idField: 'user_id', url: 'api/users', crudMethod: { ...crudUser }})
return CRUD({ title: i18n.t('User.title'), idField: 'user_id', url: 'api/users', crudMethod: { ...crudUser }})
},
mixins: [presenter(), header(), form(defaultForm), crud()],
// 数据字典
@@ -372,8 +377,8 @@ export default {
del: ['admin', 'user:del']
},
enabledTypeOptions: [
{ key: true, display_name: '激活' },
{ key: false, display_name: '锁定' }
{ key: true, display_name: i18n.t('User.table.activate') },
{ key: false, display_name: i18n.t('User.table.locked') }
],
rules: {
username: [
@@ -410,7 +415,21 @@ export default {
computed: {
...mapGetters([
'user'
])
]),
computedLabelWidth() {
const item = localStorage.getItem('lang')
if (item === 'zh') {
return `650px`
}
return `720px`
},
computedFormLabelWidth() {
const item = localStorage.getItem('lang')
if (item === 'zh') {
return `80px`
}
return `120px`
}
},
beforeMount() {
this.deptTree()