XCKJ
/
irc_web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

管理后台角色添加国际化

uat_us
wangxiaoshuang 2024-07-08 13:55:05 +08:00
parent 17c796bd53
commit 49a93d0188
2 changed files with 147 additions and 94 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/main.js
View File

@ -381,7 +381,7 @@ async function VueInit() {
zzSessionStorage.removeItem('isLock') zzSessionStorage.removeItem('isLock')
router.push("/login") router.push("/login")
}).then(() => { }).then(() => {
_vm.$alert(lang === 'zh' ? '由于您长时间未操作，为保护您的数据安全已强制将您下线，如果需要继续操作请重新登陆！' : 'No operation for a long time non-operation, you have been forced logout to protect data security. If continue to operate, please login again!', { _vm.$alert(lang === 'zh' ? '由于您长时间未操作，为保护您的数据安全已强制将您下线，如果需要继续操作请重新登录！' : 'No operation for a long time non-operation, you have been forced logout to protect data security. If continue to operate, please login again!', {
type: 'warning', type: 'warning',
}) })
}) })

239
src/views/system/role/components/RoleForm.vue
View File

@ -16,13 +16,17 @@
<el-form-item label="Shortname: " prop="UserTypeShortName"> <el-form-item label="Shortname: " prop="UserTypeShortName">
<el-input v-model="form.UserTypeShortName" /> <el-input v-model="form.UserTypeShortName" />
</el-form-item> </el-form-item>
<el-form-item label="是否内部角色: " prop="IsInternal"> <el-form-item
:label="$t('system:role:form:isInternal')"
prop="IsInternal"
>
<el-radio-group v-model="form.IsInternal"> <el-radio-group v-model="form.IsInternal">
<el-radio <el-radio
v-for="item of $d.YesOrNo" v-for="item of $d.YesOrNo"
:key="`IsInternal${item.value}`" :key="`IsInternal${item.value}`"
:label="item.value" :label="item.value"
>{{ item.label }}</el-radio> >{{ item.label }}</el-radio
>
</el-radio-group> </el-radio-group>
</el-form-item> </el-form-item>
@ -38,7 +42,11 @@
</el-form-item> </el-form-item>
<el-form-item label="Order: "> <el-form-item label="Order: ">
<el-input-number v-model="form.Order" controls-position="right" :min="0" /> <el-input-number
v-model="form.Order"
controls-position="right"
:min="0"
/>
</el-form-item> </el-form-item>
<el-form-item label="PermissionStr: " prop="PermissionStr"> <el-form-item label="PermissionStr: " prop="PermissionStr">
<el-input v-model="form.PermissionStr" /> <el-input v-model="form.PermissionStr" />
@ -58,9 +66,23 @@
<el-input v-model="form.Description" type="textarea" :rows="5" /> <el-input v-model="form.Description" type="textarea" :rows="5" />
</el-form-item> </el-form-item>
<el-form-item label="role: "> <el-form-item label="role: ">
<el-checkbox v-model="menuExpand" @change="handleCheckedTreeExpand($event)">展开/折叠</el-checkbox> <el-checkbox
<el-checkbox v-model="menuNodeAll" @change="handleCheckedTreeNodeAll($event)">全选/全不选</el-checkbox> v-model="menuExpand"
<el-checkbox v-model="form.menuCheckStrictly" @change="handleCheckedTreeConnect($event)">父子联动</el-checkbox> @change="handleCheckedTreeExpand($event)"
>{{ $t("system:role:form:checkbox:menuExpand") }}</el-checkbox
>
<el-checkbox
v-model="menuNodeAll"
@change="handleCheckedTreeNodeAll($event)"
>{{ $t("system:role:form:checkbox:menuNodeAll") }}</el-checkbox
>
<el-checkbox
v-model="form.menuCheckStrictly"
@change="handleCheckedTreeConnect($event)"
>{{
$t("system:role:form:checkbox:menuCheckStrictly")
}}</el-checkbox
>
<el-tree <el-tree
ref="menu" ref="menu"
class="tree-border" class="tree-border"
@ -76,155 +98,186 @@
</el-form> </el-form>
</template> </template>
<template slot="dialog-footer"> <template slot="dialog-footer">
<el-button :disabled="btnLoading" size="small" type="primary" @click="model_cfg.visible = false">Cancel <el-button
:disabled="btnLoading"
size="small"
type="primary"
@click="model_cfg.visible = false"
>Cancel
</el-button> </el-button>
<el-button size="small" type="primary" :loading="btnLoading" @click="handleSave">Save</el-button> <el-button
size="small"
type="primary"
:loading="btnLoading"
@click="handleSave"
>Save</el-button
>
</template> </template>
</base-model> </base-model>
</template> </template>
<script> <script>
import { addOrUpdateUserType } from '@/api/admin' import { addOrUpdateUserType } from "@/api/admin";
// import { addOrUpdateUserType } from '@/api/system/role' // import { addOrUpdateUserType } from '@/api/system/role'
// import { getMenuList } from '@/api/system/menu' // import { getMenuList } from '@/api/system/menu'
import { getMenuList } from '@/api/system/menu' import { getMenuList } from "@/api/system/menu";
import { model_cfg } from '../role' import { model_cfg } from "../role";
import BaseModel from '@/components/BaseModel' import BaseModel from "@/components/BaseModel";
export default { export default {
components: { BaseModel }, components: { BaseModel },
dicts: ['UserTypeGroup'], dicts: ["UserTypeGroup"],
props: { props: {
data: { data: {
type: Object, type: Object,
default() { default() {
return { return {
Id: '', Id: "",
UserTypeName: '', UserTypeName: "",
IsInternal: true, IsInternal: true,
UserTypeShortName: '', UserTypeShortName: "",
Order: '', Order: "",
Description: '', Description: "",
PermissionStr: '', PermissionStr: "",
UserTypeEnum: null UserTypeEnum: null,
} };
} },
} },
}, },
data() { data() {
return { return {
menuExpand: false, menuExpand: false,
menuNodeAll: false, menuNodeAll: false,
userTypeGroupOptions: [{ value: 1, label: 'Trial' }, { value: 2, label: 'Reviewer' }, { value: 3, label: 'Other' }], userTypeGroupOptions: [
{ value: 1, label: "Trial" },
{ value: 2, label: "Reviewer" },
{ value: 3, label: "Other" },
],
model_cfg, model_cfg,
defaultProps: { defaultProps: {
children: 'Children', children: "Children",
label: 'MenuName' label: "MenuName",
}, },
form: { form: {
Id: '', Id: "",
UserType: '', UserType: "",
IsInternal: true, IsInternal: true,
UserTypeShortName: '', UserTypeShortName: "",
Type: null, Type: null,
Description: '', Description: "",
UserTypeGroupIdList: [], UserTypeGroupIdList: [],
menuCheckStrictly: true menuCheckStrictly: true,
}, },
rules: { rules: {
UserTypeName: [{ required: true, message: 'Please specify', trigger: 'blur' }, { UserTypeName: [
max: 50, { required: true, message: "Please specify", trigger: "blur" },
message: 'The maximum length is 50' {
}], max: 50,
UserTypeShortName: [{ required: true, message: 'Please specify', trigger: 'blur' }, { message: "The maximum length is 50",
max: 50, },
message: 'The maximum length is 50', ],
trigger: 'blur' UserTypeShortName: [
}], { required: true, message: "Please specify", trigger: "blur" },
Description: [{ max: 500, message: 'The maximum length is 500' }], {
UserTypeGroupIdList: [{ required: true, message: 'Please specify', trigger: 'blur' }], max: 50,
UserTypeEnum: [{ required: true, message: 'Please select', trigger: 'blur' }] message: "The maximum length is 50",
trigger: "blur",
},
],
Description: [{ max: 500, message: "The maximum length is 500" }],
UserTypeGroupIdList: [
{ required: true, message: "Please specify", trigger: "blur" },
],
UserTypeEnum: [
{ required: true, message: "Please select", trigger: "blur" },
],
}, },
menuOptions: [], menuOptions: [],
btnLoading: false btnLoading: false,
} };
}, },
mounted() { mounted() {
this.getMenuList() this.getMenuList();
if (Object.keys(this.data).length && this.data.Id) { if (Object.keys(this.data).length && this.data.Id) {
this.form = { ...this.data } this.form = { ...this.data };
} }
}, },
methods: { methods: {
handleCheckedTreeConnect(value) { handleCheckedTreeConnect(value) {
this.form.menuCheckStrictly = !!value this.form.menuCheckStrictly = !!value;
}, },
getMenuAllCheckedKeys() { getMenuAllCheckedKeys() {
// 目前被选中的菜单节点 // 目前被选中的菜单节点
const checkedKeys = this.$refs.menu.getCheckedKeys() const checkedKeys = this.$refs.menu.getCheckedKeys();
// 半选中的菜单节点 // 半选中的菜单节点
const halfCheckedKeys = this.$refs.menu.getHalfCheckedKeys() const halfCheckedKeys = this.$refs.menu.getHalfCheckedKeys();
checkedKeys.unshift.apply(checkedKeys, halfCheckedKeys) checkedKeys.unshift.apply(checkedKeys, halfCheckedKeys);
return checkedKeys return checkedKeys;
}, },
handleCheckedTreeExpand(value) { handleCheckedTreeExpand(value) {
const treeList = this.menuOptions const treeList = this.menuOptions;
for (let i = 0; i < treeList.length; i++) { for (let i = 0; i < treeList.length; i++) {
this.$refs.menu.store.nodesMap[treeList[i].MenuId].expanded = value this.$refs.menu.store.nodesMap[treeList[i].MenuId].expanded = value;
} }
}, },
handleCheckedTreeNodeAll(value, type) { handleCheckedTreeNodeAll(value, type) {
this.$refs.menu.setCheckedNodes(value ? this.menuOptions : []) this.$refs.menu.setCheckedNodes(value ? this.menuOptions : []);
}, },
toTree(arr, ParentId) { toTree(arr, ParentId) {
function loop(ParentId) { function loop(ParentId) {
const res = [] const res = [];
for (let i = 0; i < arr.length; i++) { for (let i = 0; i < arr.length; i++) {
const item = arr[i] const item = arr[i];
item.hasChildren = false item.hasChildren = false;
if (item.ParentId !== ParentId) { if (item.ParentId !== ParentId) {
continue continue;
} }
item.Children = loop(item.MenuId) item.Children = loop(item.MenuId);
res.push(item) res.push(item);
} }
return res return res;
} }
return loop(ParentId) return loop(ParentId);
}, },
getMenuList() { getMenuList() {
getMenuList({}).then(res => { getMenuList({})
const menu = this.toTree(res.Result, '00000000-0000-0000-0000-000000000000') .then((res) => {
this.menuOptions = menu const menu = this.toTree(
console.log(this.menuOptions) res.Result,
this.$nextTick(() => { "00000000-0000-0000-0000-000000000000"
this.form.MenuIds.forEach(v => { );
this.$refs.menu.setChecked(v, true, false) this.menuOptions = menu;
}) console.log(this.menuOptions);
this.$nextTick(() => {
this.form.MenuIds.forEach((v) => {
this.$refs.menu.setChecked(v, true, false);
});
});
}) })
}).catch(function() { .catch(function () {});
})
}, },
handleSave() { handleSave() {
this.$refs.roleForm.validate(valid => { this.$refs.roleForm.validate((valid) => {
if (!valid) return if (!valid) return;
this.btnLoading = true this.btnLoading = true;
this.model_cfg.showClose = false this.model_cfg.showClose = false;
this.form.MenuIds = this.getMenuAllCheckedKeys() this.form.MenuIds = this.getMenuAllCheckedKeys();
console.log(this.form.MenuIds) console.log(this.form.MenuIds);
addOrUpdateUserType(this.form).then(res => { addOrUpdateUserType(this.form)
this.btnLoading = false .then((res) => {
this.$refs['roleForm'].resetFields() this.btnLoading = false;
this.$emit('close') this.$refs["roleForm"].resetFields();
this.model_cfg.showClose = true this.$emit("close");
this.$message.success('Saved successfully!') this.model_cfg.showClose = true;
}).catch(() => { this.$message.success("Saved successfully!");
this.btnLoading = false })
this.model_cfg.showClose = true .catch(() => {
}) this.btnLoading = false;
}) this.model_cfg.showClose = true;
} });
} });
} },
},
};
</script> </script>