feat: 基础部分的国际化
This commit is contained in:
@@ -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()
|
||||
|
||||
Reference in New Issue
Block a user