Skip to content

GitLab

S
Starter Web Vue
Commit 8a614ced authored by shuiluo's avatar shuiluo
Browse files
Options

feat: 国际化完善

parent 9ddea3b7
Hide whitespace changes
Inline Side-by-side
Showing with 135 additions and 92 deletions
src/components/table/index.js 0 → 100644
View file @ 8a614ced
import Wraper from './wraper.vue';
import Table from './table.vue';
import MoreItem from './more_item.vue';
export const WraperMixins = {
props: { hidden: Function, row: Object, type: String, refresh: Function },
components: { Wraper },
data() {
return {
form: {},
};
},
};
export { Wraper, Table, MoreItem };
src/components/table/index.vue
View file @ 8a614ced
<template>
<div>
<my-card v-if="$scopedSlots.search">
<a-form-model :model="queryForm" layout="horizontal">
<a-row :gutter="16">
<slot name="search" :query="queryForm" />
</a-row>
</a-form-model>
<div class="tw-flex">
<slot name="search" :query="queryForm" />
</div>
<div class="tw-text-right tw-mt-2">
<a-space>
<a-button @click="reset">重置</a-button>
<a-button type="primary" @click="getData">查询</a-button>
<a-button @click="reset">{{ $t('table.reset') }}</a-button>
<a-button type="primary" @click="getData">{{ $t('table.search') }}</a-button>
</a-space>
</div>
</my-card>
......@@ -18,14 +16,14 @@
<my-card :class="$scopedSlots.search ? 'tw-mt-3' : ''">
<a-space class="tw-mb-2.5">
<a-button v-if="addBtn" type="primary" key="add" v-bind="addBtn.options" @click="add">
{{ addBtn.text || '新建' }}
{{ addBtn.text || $t('table.add') }}
</a-button>
<slot name="buttons" />
</a-space>
<div class="tw-mb-2">
<a-alert
v-if="selectedRowKeys.length"
:message="`已选择${selectedRowKeys.length}项`"
:message="$t('table.hasSelectedSome', { num: selectedRowKeys.length })"
type="success"
closable
:after-close="handleClose"
......@@ -64,8 +62,10 @@
<template v-if="!noFooter">
<a-divider />
<a-space class="tw-justify-end">
<a-button @click="addVisible = false">取消</a-button>
<a-button type="primary" @click="submit" :loading="submitLoading"> 确认 </a-button>
<a-button @click="addVisible = false">{{ $t('table.cancel') }}</a-button>
<a-button type="primary" @click="submit" :loading="submitLoading">
{{ $t('table.confirm') }}
</a-button>
</a-space>
</template>
</a-drawer>
......@@ -188,7 +188,7 @@ export default {
this.addVisible = true;
this.type = 0;
this.noFooter = false;
this.title = '新增';
this.title = this.$t('table.add');
},
addDrawerClose() {
this.addVisible = false;
......@@ -206,13 +206,13 @@ export default {
},
show({ type, title, noFooter } = {}) {
if (type === 0) {
this.title = '新增';
this.title = this.$t('table.add');
}
if (type === 1) {
this.title = '编辑';
this.title = this.$t('table.edit');
}
if (type === 2) {
this.title = '查看';
this.title = this.$t('table.view');
}
if (title) {
this.title = title;
......
src/components/table/table.vue
View file @ 8a614ced
......@@ -18,7 +18,6 @@
<a-button @click="reset">{{ $t('table.reset') }}</a-button>
<a-button type="primary" @click="resetGetData">{{ $t('table.search') }}</a-button>
</a-space>
</div>
</my-card>
......@@ -113,7 +112,6 @@ export default {
},
data() {
const newBtn = this.addBtn ? (typeof this.addBtn === 'object' ? this.addBtn : {}) : this.addBtn;
return {
initQuery: {
...initQuery,
......
src/local/index.js
View file @ 8a614ced
import selectLang from './select';
import TableLang from './table';
import UserLang from './user';
import tableLang from './table';
import userLang from './user';
import systemLang from './system';
const zh_CN = {};
const en_US = {};
......@@ -14,7 +15,8 @@ function formatLang(langObject) {
}
formatLang(selectLang);
formatLang(TableLang);
formatLang(UserLang);
formatLang(tableLang);
formatLang(userLang);
formatLang(systemLang);
export { en_US, zh_CN };
src/local/system.js 0 → 100644
View file @ 8a614ced
export default {
'system.jobName': ['任务名称', 'Job Name'],
'system.jobName.add': ['请输入@:system.jobName', 'Please Input @:system.jobName'],
'system.department': ['所属部门', 'Department'],
'system.userTitleName': ['用户职称', 'User Title Name'],
};
src/local/table.js
View file @ 8a614ced
......@@ -27,5 +27,10 @@ export default {
'table.confirm': ['确认', 'Confirm'],
'table.cancel': ['取消', 'Cancel'],
'table.delete': ['删除', 'Delete'],
'table.confirmDelete': ['确认是否删除', 'Confirm To Delete']
'table.confirmDelete': ['确认是否删除', 'Confirm To Delete'],
'table.describe': ['描述', 'Describe'],
'table.describe.add': ['请输入描述信息', 'Please Input @:table.describe'],
'table.confirmReset': ['确认是否重置', 'Confirm Reset'],
'table.hasSelectedSome': ['已选择{num}项', '{num} have been selected'],
'table.view': ['查看', 'View'],
};
src/local/user.js
View file @ 8a614ced
......@@ -24,4 +24,9 @@ export default {
'user.twoInconsistent': ['两次密码不一致', 'The two passwords are inconsistent'],
'user.modifiedSuccessfully': ['修改成功', 'Modified successfully'],
'user.serverException': ['服务器异常', 'Server exception'],
'user.isLocked': ['是否锁定', 'Is Locked'],
'user.deblocking': ['解锁', 'Deblocking'],
'user.confirmUnlock': ['确认是否解锁', 'Confirm Whether To Unlock'],
'user.locking': ['锁定', 'Locking'],
'user.confirmLocked': ['确认是否锁定', 'Confirm Locked'],
};
src/pages/system/organization/jobsmanagement/Jobs.vue
View file @ 8a614ced
<template>
<my-table url="/api/v1/jobs" rowKey="jobId" :addBtn="addBtn" ref="table" noPage>
<template #drawer>
<Form ref="form" />
<Table url="/api/v1/jobs" rowKey="jobId" addBtn ref="table" :drawerWidth="600" noPage :buttons="buttons">
<template #drawer="drawer">
<Form v-bind="drawer" />
</template>
<!-- <template #search="{ query }">
<a-form-model-item label="名称">
<a-input v-model="query.jobName" />
</a-form-model-item>
</template> -->
<a-table-column title="名称" data-index="jobName" />
<a-table-column title="描述" data-index="jobDescription" />
<a-table-column title="操作">
<template #default="row">
<a @click="() => view(row, 1)">编辑</a>
<a-divider type="vertical" />
<PopconfirmDelete :url="`/api/v1/jobs/${row.jobId}`" :cb="refreshTable" />
</template>
</a-table-column>
</my-table>
<a-table-column :title="$t('system.jobName')" data-index="jobName" />
<a-table-column :title="$t('table.describe')" data-index="jobDescription" />
</Table>
</template>
<script>
import Form from './form.vue';
import PopconfirmDelete from '@/components/popconfirm_delete/index.vue';
import { Table } from '@/components/table';
export default {
components: { Form, PopconfirmDelete },
data() {
return {
addBtn: { width: 600, onOk: () => this.$refs['form']?.submit() },
};
components: { Form, Table },
computed: {
buttons() {
return [
{ label: this.$t('table.edit'), click: this.edit },
{
type: 'confirm',
url: (row) => `/api/v1/jobs/${row.jobId}`,
after: this.refreshTable,
},
];
},
},
methods: {
refreshTable() {
this.$refs['table']?.getData();
},
view(data, type) {
this.$refs['table']?.show({ type });
this.$nextTick(() => {
this.$refs['form'].setData({ ...data }, type);
});
edit(row) {
this.$refs.table.show({ row, title: this.$t('table.edit'), type: 'edit' });
},
},
};
......
src/pages/system/organization/jobsmanagement/form.vue
View file @ 8a614ced
<template>
<a-form-model layout="vertical" :model="form" :rules="rules" ref="DrawerForm">
<a-form-model-item label="名称" prop="jobName">
<a-input v-model="form.jobName" :disabled="isView" />
</a-form-model-item>
<a-form-model-item label="描述" prop="jobDescription">
<a-textarea v-model="form.jobDescription" :disabled="isView" :rows="4" />
</a-form-model-item>
</a-form-model>
<Wraper :hidden="hidden" :refresh="refresh" :onOk="submit">
<a-form-model layout="vertical" :model="form" :rules="rules" ref="form">
<a-form-model-item :label="$t('system.jobName')" prop="jobName">
<a-input v-model="form.jobName" />
</a-form-model-item>
<a-form-model-item :label="$t('table.describe')" prop="jobDescription">
<a-textarea v-model="form.jobDescription" :rows="4" />
</a-form-model-item>
</a-form-model>
</Wraper>
</template>
<script>
import JobsApi from '@/api/organization';
import FormMixin from '@/components/FormMixin';
import { WraperMixins } from '@/components/table';
export default {
mixins: [FormMixin],
mixins: [WraperMixins],
data() {
return {
rules: {
jobName: [{ required: true, message: 'Please select Activity zone', trigger: 'change' }],
jobName: [{ required: true, message: this.$t('system.jobName.add'), trigger: 'change' }],
jobDescription: [
{ required: true, message: 'Please select Activity zone', trigger: 'change' },
{ required: true, message: this.$t('table.describe.add'), trigger: 'change' },
],
},
};
},
methods: {
add() {
return JobsApi.addJobs({ ...this.form });
mounted() {
if (this.row) {
this.form = { ...this.row };
}
},
computed: {
isEdit() {
return this.type === 'edit';
},
edit() {
return JobsApi.updateJobs({ ...this.form });
isAdd() {
return this.type === null;
},
},
methods: {
async submit() {
await this.$refs.form.validate();
if (this.isAdd) return JobsApi.addJobs({ ...this.form });
if (this.isEdit) return JobsApi.updateJobs({ ...this.form });
},
},
};
......
src/pages/system/organization/usermanagement/User.vue
View file @ 8a614ced
<template>
<my-table url="/api/v1/users" rowKey="userId" ref="table">
<template #search="{ query }">
<my-form-item label="归属部门">
<MoreItem :label="$t('system.department')">
<OrganizationTree v-model="query.orgId" />
</my-form-item>
<my-form-item label="账号">
<a-input placeholder="Basic usage" v-model="query.loginId" />
</my-form-item>
</MoreItem>
<MoreItem :label="$t('user.account')">
<a-input :placeholder="$t('input.placeholder')" v-model="query.loginId" />
</MoreItem>
</template>
<template #buttons>
<a-button type="primary" @click="() => view()">新增</a-button>
<a-button type="primary" @click="() => view()">{{ $t('table.add') }}</a-button>
</template>
<a-table-column title="账号" data-index="loginId" />
<a-table-column title="姓名" data-index="userName" />
<a-table-column title="职称" data-index="userTitleName" />
<a-table-column title="移动电话" data-index="mobilePhone" />
<a-table-column title="固定电话" data-index="fixedPhone" />
<a-table-column title="电子邮箱" data-index="userEmail" />
<a-table-column title="是否锁定" data-index="isLockedName" />
<a-table-column title="操作">
<a-table-column :title="$t('user.account')" data-index="loginId" />
<a-table-column :title="$t('user.name')" data-index="userName" />
<a-table-column :title="$t('system.userTitleName')" data-index="userTitleName" />
<a-table-column :title="$t('user.mobilePhone')" data-index="mobilePhone" />
<a-table-column :title="$t('user.fixedPhone')" data-index="fixedPhone" />
<a-table-column :title="$t('user.email')" data-index="userEmail" />
<a-table-column :title="$t('user.isLocked')" data-index="isLockedName" />
<a-table-column :title="$t('table.operation')">
<template #default="row">
<ActionButton :buttons="buttons" :row="row" />
</template>
......@@ -36,14 +36,15 @@ import ActionButton from '@/components/action_button/index.vue';
import { formatObj } from '@/utils';
import Form from './form.vue';
import OrganizationTree from '../components/OrganizationTree.vue';
import { MoreItem } from '@/components/table';
export default {
components: { Form, OrganizationTree, ActionButton },
components: { Form, OrganizationTree, ActionButton, MoreItem },
data() {
return {
buttons: [
{
label: '编辑',
label: this.$t('table.edit'),
click: (row) => {
this.view(row, 1);
},
......@@ -58,8 +59,8 @@ export default {
},
{
type: 'confirm',
label: '重置',
title: '确认是否重置?',
label: this.$t('table.reset'),
title: this.$t('table.confirmReset'),
url: (row) => {
return {
url: `/api/v1/users/${row.userId}/resetting`,
......@@ -70,8 +71,8 @@ export default {
},
{
type: 'confirm',
label: '解锁',
title: '确认是否解锁?',
label: this.$t('user.deblocking'),
title: this.$t('user.confirmUnlock'),
url: (row) => {
return {
url: `/api/v1/users/${row.userId}/unlocking`,
......@@ -85,8 +86,8 @@ export default {
},
{
type: 'confirm',
label: '锁定',
title: '确认是否锁定?',
label: this.$t('user.locking'),
title: this.$t('user.confirmLocked'),
url: (row) => {
return {
url: `/api/v1/users/${row.userId}/locking`,
......
src/router/config.js
View file @ 8a614ced
......@@ -154,7 +154,7 @@ const hasAuthorityRoutes = [
component: RouterView,
children: [
{
path: 'job',
path: 'jobs',
name: '岗位管理',
component: () =>
import('@/pages/system/organization/jobsmanagement/Jobs.vue'),
......@@ -166,7 +166,7 @@ const hasAuthorityRoutes = [
import('@/pages/system/organization/usermanagement/User.vue'),
},
{
path: 'org',
path: 'manager',
name: '机构管理',
component: () => import('@/pages/system/organization/orgmanagement/Org.vue'),
},
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment