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