添加护理单元菜单权限功能及员工权限功能
This commit is contained in:
parent
21b1e3de7b
commit
65c67cda69
|
|
@ -0,0 +1,144 @@
|
||||||
|
<template>
|
||||||
|
<BasicDrawer v-bind="$attrs" @register="registerDrawer" title="数据权限规则" :width="adaptiveWidth" :rootClassName="prefixCls">
|
||||||
|
<BasicTable @register="registerTable">
|
||||||
|
<template #tableTitle>
|
||||||
|
<a-button type="primary" @click="handleCreate"> 新增</a-button>
|
||||||
|
</template>
|
||||||
|
<template #action="{ record }">
|
||||||
|
<TableAction :actions="getTableAction(record)" />
|
||||||
|
</template>
|
||||||
|
</BasicTable>
|
||||||
|
</BasicDrawer>
|
||||||
|
<DataRuleModal @register="registerModal" @success="reload" :permissionId="permissionId" />
|
||||||
|
</template>
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import { ref, unref } from 'vue';
|
||||||
|
import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
|
||||||
|
import { BasicTable, useTable, TableAction } from '/@/components/Table';
|
||||||
|
import { useModal } from '/@/components/Modal';
|
||||||
|
import DataRuleModal from './DataRuleModal.vue';
|
||||||
|
import { dataRuleColumns, dataRuleSearchFormSchema } from './NuAppPermission.data';
|
||||||
|
import { dataRuleList, deleteRule } from './NuAppPermission.api';
|
||||||
|
import { ColEx } from '/@/components/Form/src/types';
|
||||||
|
import { useDrawerAdaptiveWidth } from '/@/hooks/jeecg/useAdaptiveWidth';
|
||||||
|
import { useDesign } from '/@/hooks/web/useDesign';
|
||||||
|
const permissionId = ref('');
|
||||||
|
const { adaptiveWidth } = useDrawerAdaptiveWidth();
|
||||||
|
const { prefixCls } = useDesign('sys-menu-dataRulelist');
|
||||||
|
//权限规则model
|
||||||
|
const [registerModal, { openModal }] = useModal();
|
||||||
|
const [registerDrawer] = useDrawerInner(async (data) => {
|
||||||
|
permissionId.value = data.id;
|
||||||
|
setProps({ searchInfo: { permissionId: unref(permissionId) } });
|
||||||
|
reload();
|
||||||
|
});
|
||||||
|
// 自适应列配置
|
||||||
|
const adaptiveColProps: Partial<ColEx> = {
|
||||||
|
xs: 24, // <576px
|
||||||
|
sm: 24, // ≥576px
|
||||||
|
md: 24, // ≥768px
|
||||||
|
lg: 12, // ≥992px
|
||||||
|
xl: 8, // ≥1200px
|
||||||
|
xxl: 8, // ≥1600px
|
||||||
|
};
|
||||||
|
const [registerTable, { reload, setProps }] = useTable({
|
||||||
|
api: dataRuleList,
|
||||||
|
columns: dataRuleColumns,
|
||||||
|
size: 'small',
|
||||||
|
formConfig: {
|
||||||
|
baseColProps: adaptiveColProps,
|
||||||
|
labelAlign: 'right',
|
||||||
|
labelCol: {
|
||||||
|
offset: 1,
|
||||||
|
xs: 24,
|
||||||
|
sm: 24,
|
||||||
|
md: 24,
|
||||||
|
lg: 8,
|
||||||
|
xl: 8,
|
||||||
|
xxl: 8,
|
||||||
|
},
|
||||||
|
wrapperCol: {},
|
||||||
|
schemas: dataRuleSearchFormSchema,
|
||||||
|
autoSubmitOnEnter: true,
|
||||||
|
},
|
||||||
|
striped: true,
|
||||||
|
useSearchForm: true,
|
||||||
|
bordered: true,
|
||||||
|
showIndexColumn: false,
|
||||||
|
showTableSetting: false,
|
||||||
|
canResize: false,
|
||||||
|
immediate: false,
|
||||||
|
actionColumn: {
|
||||||
|
width: 100,
|
||||||
|
title: '操作',
|
||||||
|
dataIndex: 'action',
|
||||||
|
slots: { customRender: 'action' },
|
||||||
|
fixed: undefined,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 新增
|
||||||
|
*/
|
||||||
|
function handleCreate() {
|
||||||
|
openModal(true, {
|
||||||
|
isUpdate: false,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 编辑
|
||||||
|
*/
|
||||||
|
function handleEdit(record) {
|
||||||
|
openModal(true, {
|
||||||
|
record,
|
||||||
|
isUpdate: true,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 删除
|
||||||
|
*/
|
||||||
|
async function handleDelete(record) {
|
||||||
|
await deleteRule({ id: record.id }, reload);
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 操作栏
|
||||||
|
*/
|
||||||
|
function getTableAction(record) {
|
||||||
|
return [
|
||||||
|
{
|
||||||
|
label: '编辑',
|
||||||
|
onClick: handleEdit.bind(null, record),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '删除',
|
||||||
|
popConfirm: {
|
||||||
|
title: '是否确认删除',
|
||||||
|
confirm: handleDelete.bind(null, record),
|
||||||
|
},
|
||||||
|
},
|
||||||
|
];
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style lang="less">
|
||||||
|
// -update-begin--author:liaozhiyang---date:20240702---for：【TV360X-1660】菜单管理-数据权限的查询和按钮没间隙
|
||||||
|
@prefix-cls: ~'@{namespace}-sys-menu-dataRulelist';
|
||||||
|
.@{prefix-cls} {
|
||||||
|
.jeecg-basic-table {
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
.btnArea {
|
||||||
|
.ant-btn {
|
||||||
|
&:last-child {
|
||||||
|
margin-right: 0;
|
||||||
|
}
|
||||||
|
&:first-child {
|
||||||
|
margin-left: 8px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// -update-end--author:liaozhiyang---date:20240702---for：【TV360X-1660】菜单管理-数据权限的查询和按钮没间隙
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,54 @@
|
||||||
|
<template>
|
||||||
|
<BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit" width="700px" destroyOnClose>
|
||||||
|
<BasicForm @register="registerForm" />
|
||||||
|
</BasicModal>
|
||||||
|
</template>
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import { ref, computed, unref } from 'vue';
|
||||||
|
import { BasicModal, useModalInner } from '/@/components/Modal';
|
||||||
|
import { BasicForm, useForm } from '/@/components/Form/index';
|
||||||
|
import { dataRuleFormSchema } from './NuAppPermission.data';
|
||||||
|
import { saveOrUpdateRule } from './NuAppPermission.api';
|
||||||
|
// 声明Emits
|
||||||
|
const emit = defineEmits(['success', 'register']);
|
||||||
|
const props = defineProps({ permissionId: String });
|
||||||
|
const isUpdate = ref(true);
|
||||||
|
//表单配置
|
||||||
|
const [registerForm, { resetFields, setFieldsValue, validate }] = useForm({
|
||||||
|
schemas: dataRuleFormSchema,
|
||||||
|
showActionButtonGroup: false,
|
||||||
|
});
|
||||||
|
//表单赋值
|
||||||
|
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
|
||||||
|
//重置表单
|
||||||
|
await resetFields();
|
||||||
|
setModalProps({ confirmLoading: false });
|
||||||
|
isUpdate.value = !!data?.isUpdate;
|
||||||
|
if (unref(isUpdate)) {
|
||||||
|
//表单赋值
|
||||||
|
await setFieldsValue({
|
||||||
|
...data.record,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
//设置标题
|
||||||
|
const getTitle = computed(() => (!unref(isUpdate) ? '新增规则' : '编辑规则'));
|
||||||
|
|
||||||
|
//表单提交事件
|
||||||
|
async function handleSubmit() {
|
||||||
|
try {
|
||||||
|
const values = await validate();
|
||||||
|
values.permissionId = props.permissionId;
|
||||||
|
setModalProps({ confirmLoading: true });
|
||||||
|
//提交表单
|
||||||
|
await saveOrUpdateRule(values, isUpdate.value);
|
||||||
|
//关闭弹窗
|
||||||
|
closeModal();
|
||||||
|
//刷新列表
|
||||||
|
emit('success');
|
||||||
|
} finally {
|
||||||
|
setModalProps({ confirmLoading: false });
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
@ -0,0 +1,141 @@
|
||||||
|
<template>
|
||||||
|
<BasicDrawer v-bind="$attrs" @register="registerDrawer" showFooter :width="adaptiveWidth" :title="getTitle" @ok="handleSubmit">
|
||||||
|
<BasicForm @register="registerForm" class="menuForm" />
|
||||||
|
</BasicDrawer>
|
||||||
|
</template>
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import { ref, computed, unref, useAttrs } from 'vue';
|
||||||
|
import { BasicForm, useForm } from '/@/components/Form/index';
|
||||||
|
import { formSchema, ComponentTypes } from './NuAppPermission.data';
|
||||||
|
import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
|
||||||
|
import { list, saveOrUpdateMenu } from './NuAppPermission.api';
|
||||||
|
import { useDrawerAdaptiveWidth } from '/@/hooks/jeecg/useAdaptiveWidth';
|
||||||
|
import { useI18n } from "/@/hooks/web/useI18n";
|
||||||
|
// 声明Emits
|
||||||
|
const emit = defineEmits(['success', 'register']);
|
||||||
|
const { adaptiveWidth } = useDrawerAdaptiveWidth();
|
||||||
|
const attrs = useAttrs();
|
||||||
|
const isUpdate = ref(true);
|
||||||
|
const menuType = ref(0);
|
||||||
|
const isButton = (type) => type === 2;
|
||||||
|
const [registerForm, { setProps, resetFields, setFieldsValue, updateSchema, validate, clearValidate }] = useForm({
|
||||||
|
labelCol: {
|
||||||
|
md: { span: 4 },
|
||||||
|
sm: { span: 6 },
|
||||||
|
},
|
||||||
|
wrapperCol: {
|
||||||
|
md: { span: 20 },
|
||||||
|
sm: { span: 18 },
|
||||||
|
},
|
||||||
|
schemas: formSchema,
|
||||||
|
showActionButtonGroup: false,
|
||||||
|
});
|
||||||
|
|
||||||
|
const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
|
||||||
|
await resetFields();
|
||||||
|
setDrawerProps({ confirmLoading: false });
|
||||||
|
isUpdate.value = !!data?.isUpdate;
|
||||||
|
menuType.value = data?.record?.menuType;
|
||||||
|
|
||||||
|
//获取下拉树信息
|
||||||
|
const treeData = await list();
|
||||||
|
updateSchema([
|
||||||
|
{
|
||||||
|
field: 'parentId',
|
||||||
|
// update-begin--author:liaozhiyang---date:20240306---for：【QQYUN-8379】菜单管理页菜单国际化
|
||||||
|
componentProps: { treeData: translateMenu(treeData, 'name') },
|
||||||
|
// update-end--author:liaozhiyang---date:20240306---for：【QQYUN-8379】菜单管理页菜单国际化
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'name',
|
||||||
|
label: isButton(unref(menuType)) ? '按钮/权限' : '菜单名称',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'url',
|
||||||
|
required: !isButton(unref(menuType)),
|
||||||
|
componentProps: {
|
||||||
|
onChange: (e) => onUrlChange(e.target.value),
|
||||||
|
},
|
||||||
|
},
|
||||||
|
]);
|
||||||
|
|
||||||
|
// 无论新增还是编辑，都可以设置表单值
|
||||||
|
if (typeof data.record === 'object') {
|
||||||
|
let values = { ...data.record };
|
||||||
|
setFieldsValue(values);
|
||||||
|
onUrlChange(values.url);
|
||||||
|
}
|
||||||
|
//按钮类型情况下，编辑时候清除一下地址的校验
|
||||||
|
if (menuType.value == 2) {
|
||||||
|
clearValidate();
|
||||||
|
}
|
||||||
|
//禁用表单
|
||||||
|
setProps({ disabled: !attrs.showFooter });
|
||||||
|
});
|
||||||
|
//获取弹窗标题
|
||||||
|
const getTitle = computed(() => (!unref(isUpdate) ? '新增菜单' : '编辑菜单'));
|
||||||
|
//提交事件
|
||||||
|
async function handleSubmit() {
|
||||||
|
try {
|
||||||
|
const values = await validate();
|
||||||
|
// iframe兼容
|
||||||
|
if (ComponentTypes.IFrame === values.component) {
|
||||||
|
values.component = values.frameSrc;
|
||||||
|
}
|
||||||
|
setDrawerProps({ confirmLoading: true });
|
||||||
|
//提交表单
|
||||||
|
await saveOrUpdateMenu(values, unref(isUpdate));
|
||||||
|
closeDrawer();
|
||||||
|
emit('success');
|
||||||
|
} finally {
|
||||||
|
setDrawerProps({ confirmLoading: false });
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/** url 变化时，动态设置组件名称placeholder */
|
||||||
|
function onUrlChange(url) {
|
||||||
|
let placeholder = '';
|
||||||
|
let httpUrl = url;
|
||||||
|
if (url != null && url != '') {
|
||||||
|
if (url.startsWith('/')) {
|
||||||
|
url = url.substring(1);
|
||||||
|
}
|
||||||
|
url = url.replaceAll('/', '-');
|
||||||
|
// 特殊标记
|
||||||
|
url = url.replaceAll(':', '@');
|
||||||
|
placeholder = `${url}`;
|
||||||
|
} else {
|
||||||
|
placeholder = '请输入组件名称';
|
||||||
|
}
|
||||||
|
updateSchema([{ field: 'componentName', componentProps: { placeholder } }]);
|
||||||
|
//update-begin---author:wangshuai ---date:20230204 for：[QQYUN-4058]菜单添加智能化处理------------
|
||||||
|
if (httpUrl != null && httpUrl != '') {
|
||||||
|
if (httpUrl.startsWith('http://') || httpUrl.startsWith('https://')) {
|
||||||
|
setFieldsValue({ component: httpUrl });
|
||||||
|
}
|
||||||
|
}
|
||||||
|
//update-end---author:wangshuai ---date:20230204 for：[QQYUN-4058]菜单添加智能化处理------------
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 2024-03-06
|
||||||
|
* liaozhiyang
|
||||||
|
* 翻译菜单名称
|
||||||
|
*/
|
||||||
|
function translateMenu(data, key) {
|
||||||
|
if (data?.length) {
|
||||||
|
const { t } = useI18n();
|
||||||
|
data.forEach((item) => {
|
||||||
|
if (item[key]) {
|
||||||
|
if (item[key].includes("t('") && t) {
|
||||||
|
item[key] = new Function('t', `return ${item[key]}`)(t);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if (item.children?.length) {
|
||||||
|
translateMenu(item.children, key);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
return data;
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
@ -0,0 +1,144 @@
|
||||||
|
import { defHttp } from '/@/utils/http/axios';
|
||||||
|
import { Modal } from 'ant-design-vue';
|
||||||
|
|
||||||
|
enum Api {
|
||||||
|
list = '/appConfig/nuAppPermission/list',
|
||||||
|
save = '/appConfig/nuAppPermission/add',
|
||||||
|
edit = '/appConfig/nuAppPermission/edit',
|
||||||
|
delete = '/appConfig/nuAppPermission/delete',
|
||||||
|
deleteBatch = '/appConfig/nuAppPermission/deleteBatch',
|
||||||
|
ruleList = '/appConfig/nuAppPermission/queryPermissionRule',
|
||||||
|
ruleSave = '/appConfig/nuAppPermission/addPermissionRule',
|
||||||
|
ruleEdit = '/appConfig/nuAppPermission/editPermissionRule',
|
||||||
|
ruleDelete = '/appConfig/nuAppPermission/deletePermissionRule',
|
||||||
|
checkPermDuplication = '/appConfig/nuAppPermission/checkPermDuplication',
|
||||||
|
isRoleExist = '/appConfig/nuAppPermission/checkRoleCode',
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 编码校验
|
||||||
|
* @param params
|
||||||
|
*/
|
||||||
|
// update-begin--author:liaozhiyang---date:20231215---for：【QQYUN-7415】表单调用接口进行校验的添加防抖
|
||||||
|
let timer;
|
||||||
|
export const isRoleExist = (params) => {
|
||||||
|
return new Promise((resolve, rejected) => {
|
||||||
|
clearTimeout(timer);
|
||||||
|
timer = setTimeout(() => {
|
||||||
|
defHttp
|
||||||
|
.get({ url: Api.isRoleExist, params }, { isTransformResponse: false })
|
||||||
|
.then((res) => {
|
||||||
|
resolve(res);
|
||||||
|
})
|
||||||
|
.catch((error) => {
|
||||||
|
rejected(error);
|
||||||
|
});
|
||||||
|
}, 500);
|
||||||
|
});
|
||||||
|
};
|
||||||
|
/**
|
||||||
|
* 列表接口
|
||||||
|
* @param params
|
||||||
|
*/
|
||||||
|
export const list = (params) => {
|
||||||
|
return defHttp.get({ url: Api.list, params });
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 删除菜单
|
||||||
|
*/
|
||||||
|
export const deleteMenu = (params, handleSuccess) => {
|
||||||
|
return defHttp.delete({ url: Api.delete, params }, { joinParamsToUrl: true }).then(() => {
|
||||||
|
handleSuccess();
|
||||||
|
});
|
||||||
|
};
|
||||||
|
/**
|
||||||
|
* 批量删除菜单
|
||||||
|
* @param params
|
||||||
|
*/
|
||||||
|
export const batchDeleteMenu = (params, handleSuccess) => {
|
||||||
|
Modal.confirm({
|
||||||
|
title: '确认删除',
|
||||||
|
content: '是否删除选中数据',
|
||||||
|
okText: '确认',
|
||||||
|
cancelText: '取消',
|
||||||
|
onOk: () => {
|
||||||
|
return defHttp.delete({ url: Api.deleteBatch, data: params }, { joinParamsToUrl: true }).then(() => {
|
||||||
|
handleSuccess();
|
||||||
|
});
|
||||||
|
},
|
||||||
|
});
|
||||||
|
};
|
||||||
|
/**
|
||||||
|
* 保存或者更新菜单
|
||||||
|
* @param params
|
||||||
|
*/
|
||||||
|
export const saveOrUpdateMenu = (params, isUpdate) => {
|
||||||
|
let url = isUpdate ? Api.edit : Api.save;
|
||||||
|
return defHttp.post({ url: url, params });
|
||||||
|
};
|
||||||
|
/**
|
||||||
|
* 菜单数据权限列表接口
|
||||||
|
* @param params
|
||||||
|
*/
|
||||||
|
export const dataRuleList = (params) => defHttp.get({ url: Api.ruleList, params });
|
||||||
|
/**
|
||||||
|
* 保存或者更新数据规则
|
||||||
|
* @param params
|
||||||
|
*/
|
||||||
|
export const saveOrUpdateRule = (params, isUpdate) => {
|
||||||
|
let url = isUpdate ? Api.ruleEdit : Api.ruleSave;
|
||||||
|
return defHttp.post({ url: url, params });
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 删除数据权限
|
||||||
|
*/
|
||||||
|
export const deleteRule = (params, handleSuccess) => {
|
||||||
|
return defHttp.delete({ url: Api.ruleDelete, params }, { joinParamsToUrl: true }).then(() => {
|
||||||
|
handleSuccess();
|
||||||
|
});
|
||||||
|
};
|
||||||
|
/**
|
||||||
|
* 根据code获取字典数值
|
||||||
|
* @param params
|
||||||
|
*/
|
||||||
|
export const ajaxGetDictItems = (params) => defHttp.get({ url: `/sys/dict/getDictItems/${params.code}` });
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 唯一校验
|
||||||
|
* @param params
|
||||||
|
*/
|
||||||
|
export const getCheckPermDuplication = (params) => defHttp.get({ url: Api.checkPermDuplication, params }, { isTransformResponse: false });
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 校验菜单是否存在
|
||||||
|
* @param model
|
||||||
|
* @param schema
|
||||||
|
* @param required
|
||||||
|
*/
|
||||||
|
export const checkPermDuplication=(model, schema, required?)=>{
|
||||||
|
return [
|
||||||
|
{
|
||||||
|
validator: (_, value) => {
|
||||||
|
if (!required) {
|
||||||
|
return Promise.resolve();
|
||||||
|
}
|
||||||
|
if (!value && required) {
|
||||||
|
return Promise.reject(`请输入${schema.label}`);
|
||||||
|
}
|
||||||
|
return new Promise<void>((resolve, reject) => {
|
||||||
|
getCheckPermDuplication({
|
||||||
|
id: model.id,
|
||||||
|
url:model.url,
|
||||||
|
alwaysShow:model.alwaysShow
|
||||||
|
}).then((res) => {
|
||||||
|
res.success ? resolve() : reject(res.message || '校验失败');
|
||||||
|
}).catch((err) => {
|
||||||
|
reject(err.message || '验证失败');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
];
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,307 @@
|
||||||
|
import { BasicColumn } from '/@/components/Table';
|
||||||
|
import { FormSchema } from '/@/components/Table';
|
||||||
|
import { ajaxGetDictItems ,checkPermDuplication,isRoleExist } from './NuAppPermission.api';
|
||||||
|
import { render } from '/@/utils/common/renderUtils';
|
||||||
|
|
||||||
|
const isDir = (type) => type === 0;
|
||||||
|
const isMenu = (type) => type === 1;
|
||||||
|
const isButton = (type) => type === 2;
|
||||||
|
|
||||||
|
// 定义可选择的组件类型
|
||||||
|
export enum ComponentTypes {
|
||||||
|
Default = 'layouts/default/index',
|
||||||
|
IFrame = 'sys/iframe/FrameBlank',
|
||||||
|
}
|
||||||
|
|
||||||
|
export const columns: BasicColumn[] = [
|
||||||
|
{
|
||||||
|
title: '菜单名称',
|
||||||
|
dataIndex: 'name',
|
||||||
|
width: 200,
|
||||||
|
align: 'left',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '菜单编码',
|
||||||
|
dataIndex: 'menuCode',
|
||||||
|
width: 200,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '菜单类型',
|
||||||
|
dataIndex: 'menuType',
|
||||||
|
width: 150,
|
||||||
|
customRender: ({ text }) => {
|
||||||
|
return render.renderDict(text, 'menu_type');
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '排序',
|
||||||
|
dataIndex: 'sortNo',
|
||||||
|
width: 50,
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
export const searchFormSchema: FormSchema[] = [
|
||||||
|
{
|
||||||
|
field: 'name',
|
||||||
|
label: '菜单名称',
|
||||||
|
component: 'Input',
|
||||||
|
colProps: { span: 8 },
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
export const formSchema: FormSchema[] = [
|
||||||
|
{
|
||||||
|
label: 'id',
|
||||||
|
field: 'id',
|
||||||
|
component: 'Input',
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'menuType',
|
||||||
|
label: '菜单类型',
|
||||||
|
component: 'RadioButtonGroup',
|
||||||
|
defaultValue: 0,
|
||||||
|
componentProps: ({ formActionType, formModel }) => {
|
||||||
|
return {
|
||||||
|
options: [
|
||||||
|
{ label: '一级菜单', value: 0 },
|
||||||
|
{ label: '子菜单', value: 1 },
|
||||||
|
{ label: '按钮/权限', value: 2 },
|
||||||
|
],
|
||||||
|
onChange: (e) => {
|
||||||
|
const { updateSchema, clearValidate } = formActionType;
|
||||||
|
const label = isButton(e) ? '按钮/权限' : '菜单名称';
|
||||||
|
//清除校验
|
||||||
|
// clearValidate();
|
||||||
|
updateSchema([
|
||||||
|
{
|
||||||
|
field: 'name',
|
||||||
|
label: label,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'url',
|
||||||
|
required: !isButton(e),
|
||||||
|
},
|
||||||
|
]);
|
||||||
|
//update-begin---author:wangshuai ---date:20220729 for：[VUEN-1834]只有一级菜单，才默认值，子菜单的时候，清空------------
|
||||||
|
// if (isMenu(e) && !formModel.id && (formModel.component=='layouts/default/index' || formModel.component=='layouts/RouteView')) {
|
||||||
|
// formModel.component = '';
|
||||||
|
// }
|
||||||
|
//update-end---author:wangshuai ---date:20220729 for：[VUEN-1834]只有一级菜单，才默认值，子菜单的时候，清空------------
|
||||||
|
},
|
||||||
|
};
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'name',
|
||||||
|
label: '菜单名称',
|
||||||
|
component: 'Input',
|
||||||
|
required: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'menuCode',
|
||||||
|
label: '菜单编码',
|
||||||
|
required: true,
|
||||||
|
component: 'Input',
|
||||||
|
dynamicDisabled: ({ values }) => {
|
||||||
|
return !!values.id;
|
||||||
|
},
|
||||||
|
dynamicRules: ({ values, model }) => {
|
||||||
|
console.log('values:', values);
|
||||||
|
return [
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
validator: (_, value) => {
|
||||||
|
if (!value) {
|
||||||
|
return Promise.reject('请输入菜单编码');
|
||||||
|
}
|
||||||
|
if (values) {
|
||||||
|
return new Promise((resolve, reject) => {
|
||||||
|
isRoleExist({ id: model.id, roleCode: value })
|
||||||
|
.then((res) => {
|
||||||
|
res.success ? resolve() : reject(res.message || '校验失败');
|
||||||
|
})
|
||||||
|
.catch((err) => {
|
||||||
|
reject(err.message || '验证失败');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
return Promise.resolve();
|
||||||
|
},
|
||||||
|
},
|
||||||
|
];
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'parentId',
|
||||||
|
label: '上级菜单',
|
||||||
|
component: 'TreeSelect',
|
||||||
|
required: true,
|
||||||
|
componentProps: {
|
||||||
|
//update-begin---author:wangshuai ---date:20230829 for：replaceFields已过期，使用fieldNames代替------------
|
||||||
|
fieldNames: {
|
||||||
|
label: 'name',
|
||||||
|
key: 'id',
|
||||||
|
value: 'id',
|
||||||
|
},
|
||||||
|
//update-end---author:wangshuai ---date:20230829 for：replaceFields已过期，使用fieldNames代替------------
|
||||||
|
dropdownStyle: {
|
||||||
|
maxHeight: '50vh',
|
||||||
|
},
|
||||||
|
getPopupContainer: (node) => node?.parentNode,
|
||||||
|
},
|
||||||
|
ifShow: ({ values }) => !isDir(values.menuType),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'status',
|
||||||
|
label: '状态',
|
||||||
|
component: 'RadioGroup',
|
||||||
|
defaultValue: '1',
|
||||||
|
componentProps: {
|
||||||
|
options: [
|
||||||
|
{ label: '有效', value: '1' },
|
||||||
|
{ label: '无效', value: '0' },
|
||||||
|
],
|
||||||
|
},
|
||||||
|
ifShow: ({ values }) => isButton(values.menuType),
|
||||||
|
},
|
||||||
|
// {
|
||||||
|
// field: 'icon',
|
||||||
|
// label: '菜单图标',
|
||||||
|
// component: 'IconPicker',
|
||||||
|
// ifShow: ({ values }) => !isButton(values.menuType),
|
||||||
|
// },
|
||||||
|
{
|
||||||
|
field: 'sortNo',
|
||||||
|
label: '排序',
|
||||||
|
component: 'InputNumber',
|
||||||
|
defaultValue: 1,
|
||||||
|
ifShow: ({ values }) => !isButton(values.menuType),
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
export const dataRuleColumns: BasicColumn[] = [
|
||||||
|
{
|
||||||
|
title: '规则名称',
|
||||||
|
dataIndex: 'ruleName',
|
||||||
|
width: 150,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '规则字段',
|
||||||
|
dataIndex: 'ruleColumn',
|
||||||
|
width: 100,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '规则值',
|
||||||
|
dataIndex: 'ruleValue',
|
||||||
|
width: 100,
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
export const dataRuleSearchFormSchema: FormSchema[] = [
|
||||||
|
{
|
||||||
|
field: 'ruleName',
|
||||||
|
label: '规则名称',
|
||||||
|
component: 'Input',
|
||||||
|
// colProps: { span: 6 },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'ruleValue',
|
||||||
|
label: '规则值',
|
||||||
|
component: 'Input',
|
||||||
|
// colProps: { span: 6 },
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
export const dataRuleFormSchema: FormSchema[] = [
|
||||||
|
{
|
||||||
|
label: 'id',
|
||||||
|
field: 'id',
|
||||||
|
component: 'Input',
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'ruleName',
|
||||||
|
label: '规则名称',
|
||||||
|
component: 'Input',
|
||||||
|
required: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'ruleColumn',
|
||||||
|
label: '规则字段',
|
||||||
|
component: 'Input',
|
||||||
|
ifShow: ({ values }) => {
|
||||||
|
const ruleConditions = Array.isArray(values.ruleConditions) ? values.ruleConditions[0] : values.ruleConditions;
|
||||||
|
return ruleConditions !== 'USE_SQL_RULES';
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'ruleConditions',
|
||||||
|
label: '条件规则',
|
||||||
|
required: true,
|
||||||
|
component: 'ApiSelect',
|
||||||
|
componentProps: {
|
||||||
|
api: ajaxGetDictItems,
|
||||||
|
params: { code: 'rule_conditions' },
|
||||||
|
labelField: 'text',
|
||||||
|
valueField: 'value',
|
||||||
|
getPopupContainer: (node) => document.body,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
// update-begin--author:liaozhiyang---date:20240724---for：【TV360X-1864】添加系统变量
|
||||||
|
{
|
||||||
|
field: 'ruleValue',
|
||||||
|
component: 'JInputSelect',
|
||||||
|
label: '规则值',
|
||||||
|
required: true,
|
||||||
|
componentProps: {
|
||||||
|
selectPlaceholder: '可选择系统变量',
|
||||||
|
inputPlaceholder: '请输入',
|
||||||
|
getPopupContainer: () => document.body,
|
||||||
|
selectWidth: '200px',
|
||||||
|
options: [
|
||||||
|
{
|
||||||
|
label: '登录用户账号',
|
||||||
|
value: '#{sys_user_code}',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '登录用户名称',
|
||||||
|
value: '#{sys_user_name}',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '当前日期',
|
||||||
|
value: '#{sys_date}',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '当前时间',
|
||||||
|
value: '#{sys_time}',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '登录用户部门',
|
||||||
|
value: '#{sys_org_code}',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '用户拥有部门',
|
||||||
|
value: '#{sys_multi_org_code}',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '登录用户租户',
|
||||||
|
value: '#{tenant_id}',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
// update-end--author:liaozhiyang---date:20240724---for：【TV360X-1864】添加系统变量
|
||||||
|
{
|
||||||
|
field: 'status',
|
||||||
|
label: '状态',
|
||||||
|
component: 'RadioButtonGroup',
|
||||||
|
defaultValue: '1',
|
||||||
|
componentProps: {
|
||||||
|
options: [
|
||||||
|
{ label: '无效', value: '0' },
|
||||||
|
{ label: '有效', value: '1' },
|
||||||
|
],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
@ -0,0 +1,265 @@
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<BasicTable @register="registerTable" :rowSelection="rowSelection">
|
||||||
|
<template #tableTitle>
|
||||||
|
<a-button type="primary" preIcon="ant-design:plus-outlined" @click="handleCreate"> 新增菜单</a-button>
|
||||||
|
|
||||||
|
<a-dropdown v-if="checkedKeys.length > 0">
|
||||||
|
<template #overlay>
|
||||||
|
<a-menu>
|
||||||
|
<a-menu-item key="1" @click="batchHandleDelete">
|
||||||
|
<Icon icon="ant-design:delete-outlined" />
|
||||||
|
删除
|
||||||
|
</a-menu-item>
|
||||||
|
</a-menu>
|
||||||
|
</template>
|
||||||
|
<a-button
|
||||||
|
>批量操作
|
||||||
|
<Icon icon="ant-design:down-outlined" />
|
||||||
|
</a-button>
|
||||||
|
</a-dropdown>
|
||||||
|
</template>
|
||||||
|
<template #action="{ record }">
|
||||||
|
<TableAction :actions="getTableAction(record)" />
|
||||||
|
</template>
|
||||||
|
</BasicTable>
|
||||||
|
<MenuDrawer @register="registerDrawer" @success="handleSuccess" :showFooter="showFooter" />
|
||||||
|
<DataRuleList @register="registerDrawer1" />
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script lang="ts" name="system-menu" setup>
|
||||||
|
import { nextTick, ref } from 'vue';
|
||||||
|
import { BasicTable, useTable, TableAction } from '/@/components/Table';
|
||||||
|
import { useListPage } from '/@/hooks/system/useListPage';
|
||||||
|
import { useDrawer } from '/@/components/Drawer';
|
||||||
|
import MenuDrawer from './MenuDrawer.vue';
|
||||||
|
import DataRuleList from './DataRuleList.vue';
|
||||||
|
import { columns,searchFormSchema } from './NuAppPermission.data';
|
||||||
|
import { list, deleteMenu, batchDeleteMenu } from './NuAppPermission.api';
|
||||||
|
import { useDefIndexStore } from "@/store/modules/defIndex";
|
||||||
|
import { useI18n } from "/@/hooks/web/useI18n";
|
||||||
|
|
||||||
|
const checkedKeys = ref<Array<string | number>>([]);
|
||||||
|
const showFooter = ref(true);
|
||||||
|
const [registerDrawer, { openDrawer }] = useDrawer();
|
||||||
|
const [registerDrawer1, { openDrawer: openDataRule }] = useDrawer();
|
||||||
|
const { t } = useI18n();
|
||||||
|
|
||||||
|
// 自定义菜单名称列渲染
|
||||||
|
columns[0].customRender = function ({text, record}) {
|
||||||
|
const isDefIndex = checkDefIndex(record)
|
||||||
|
if (isDefIndex) {
|
||||||
|
text += '（默认首页）'
|
||||||
|
}
|
||||||
|
// update-begin--author:liaozhiyang---date:20240306---for：【QQYUN-8379】菜单管理页菜单国际化
|
||||||
|
if (text.includes("t('") && t) {
|
||||||
|
return new Function('t', `return ${text}`)(t);
|
||||||
|
}
|
||||||
|
// update-end--author:liaozhiyang---date:20240306---for：【QQYUN-8379】菜单管理页菜单国际化
|
||||||
|
return text
|
||||||
|
}
|
||||||
|
|
||||||
|
// 列表页面公共参数、方法
|
||||||
|
const { prefixCls, tableContext } = useListPage({
|
||||||
|
tableProps: {
|
||||||
|
title: '菜单列表',
|
||||||
|
api: list,
|
||||||
|
columns: columns,
|
||||||
|
size: 'small',
|
||||||
|
pagination: false,
|
||||||
|
isTreeTable: true,
|
||||||
|
striped: true,
|
||||||
|
useSearchForm: true,
|
||||||
|
showTableSetting: true,
|
||||||
|
bordered: true,
|
||||||
|
showIndexColumn: false,
|
||||||
|
tableSetting: { fullScreen: true },
|
||||||
|
formConfig: {
|
||||||
|
// update-begin--author:liaozhiyang---date:20230803---for：【QQYUN-5873】查询区域lablel默认居左
|
||||||
|
labelWidth: 74,
|
||||||
|
rowProps: { gutter: 24 },
|
||||||
|
// update-end--author:liaozhiyang---date:20230803---for：【QQYUN-5873】查询区域lablel默认居左
|
||||||
|
schemas: searchFormSchema,
|
||||||
|
autoAdvancedCol: 4,
|
||||||
|
baseColProps: { xs: 24, sm: 12, md: 6, lg: 6, xl: 6, xxl: 6 },
|
||||||
|
actionColOptions: { xs: 24, sm: 12, md: 6, lg: 6, xl: 6, xxl: 6 },
|
||||||
|
},
|
||||||
|
actionColumn: {
|
||||||
|
width: 120,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
});
|
||||||
|
//注册table数据
|
||||||
|
const [registerTable, { reload, expandAll, collapseAll }] = tableContext;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 选择列配置
|
||||||
|
*/
|
||||||
|
const rowSelection = {
|
||||||
|
type: 'checkbox',
|
||||||
|
columnWidth: 30,
|
||||||
|
selectedRowKeys: checkedKeys,
|
||||||
|
onChange: onSelectChange,
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 选择事件
|
||||||
|
*/
|
||||||
|
function onSelectChange(selectedRowKeys: (string | number)[]) {
|
||||||
|
checkedKeys.value = selectedRowKeys;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 新增
|
||||||
|
*/
|
||||||
|
function handleCreate() {
|
||||||
|
showFooter.value = true;
|
||||||
|
openDrawer(true, {
|
||||||
|
isUpdate: false,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 编辑
|
||||||
|
*/
|
||||||
|
function handleEdit(record) {
|
||||||
|
showFooter.value = true;
|
||||||
|
openDrawer(true, {
|
||||||
|
record,
|
||||||
|
isUpdate: true,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 详情
|
||||||
|
*/
|
||||||
|
function handleDetail(record) {
|
||||||
|
showFooter.value = false;
|
||||||
|
openDrawer(true, {
|
||||||
|
record,
|
||||||
|
isUpdate: true,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 添加下级
|
||||||
|
*/
|
||||||
|
function handleAddSub(record) {
|
||||||
|
openDrawer(true, {
|
||||||
|
record: { parentId: record.id, menuType: 1 },
|
||||||
|
isUpdate: false,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 数据权限弹窗
|
||||||
|
*/
|
||||||
|
function handleDataRule(record) {
|
||||||
|
openDataRule(true, { id: record.id });
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 删除
|
||||||
|
*/
|
||||||
|
async function handleDelete(record) {
|
||||||
|
await deleteMenu({ id: record.id }, reload);
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 批量删除事件
|
||||||
|
*/
|
||||||
|
async function batchHandleDelete() {
|
||||||
|
await batchDeleteMenu({ ids: checkedKeys.value }, () => {
|
||||||
|
// -update-begin--author:liaozhiyang---date:20240702---for：【TV360X-1662】菜单管理、定时任务批量删除清空选中
|
||||||
|
reload();
|
||||||
|
checkedKeys.value = [];
|
||||||
|
// -update-end--author:liaozhiyang---date:20240702---for：【TV360X-1662】菜单管理、定时任务批量删除清空选中
|
||||||
|
});
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 成功回调
|
||||||
|
*/
|
||||||
|
function handleSuccess() {
|
||||||
|
reload();
|
||||||
|
reloadDefIndex();
|
||||||
|
}
|
||||||
|
|
||||||
|
function onFetchSuccess() {
|
||||||
|
// 演示默认展开所有表项
|
||||||
|
nextTick(expandAll);
|
||||||
|
}
|
||||||
|
|
||||||
|
// --------------- begin 默认首页配置 ------------
|
||||||
|
|
||||||
|
const defIndexStore = useDefIndexStore()
|
||||||
|
|
||||||
|
// 设置默认主页
|
||||||
|
async function handleSetDefIndex(record: Recordable) {
|
||||||
|
defIndexStore.update(record.url, record.component, record.route)
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 检查是否为默认主页
|
||||||
|
* @param record
|
||||||
|
*/
|
||||||
|
function checkDefIndex(record: Recordable) {
|
||||||
|
return defIndexStore.check(record.url)
|
||||||
|
}
|
||||||
|
|
||||||
|
// 重新加载默认首页配置
|
||||||
|
function reloadDefIndex() {
|
||||||
|
try {
|
||||||
|
defIndexStore.query();
|
||||||
|
} catch (e) {
|
||||||
|
console.error(e)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
reloadDefIndex()
|
||||||
|
|
||||||
|
// --------------- end 默认首页配置 ------------
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 操作栏
|
||||||
|
*/
|
||||||
|
function getTableAction(record) {
|
||||||
|
return [
|
||||||
|
{
|
||||||
|
label: '编辑',
|
||||||
|
onClick: handleEdit.bind(null, record),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '删除',
|
||||||
|
color: 'error',
|
||||||
|
popConfirm: {
|
||||||
|
title: '是否确认删除',
|
||||||
|
confirm: handleDelete.bind(null, record),
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '添加下级',
|
||||||
|
onClick: handleAddSub.bind(null, record),
|
||||||
|
},
|
||||||
|
];
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 下拉操作栏
|
||||||
|
*/
|
||||||
|
function getDropDownAction(record) {
|
||||||
|
return [
|
||||||
|
// {
|
||||||
|
// label: '详情',
|
||||||
|
// onClick: handleDetail.bind(null, record),
|
||||||
|
// },
|
||||||
|
{
|
||||||
|
label: '添加下级',
|
||||||
|
onClick: handleAddSub.bind(null, record),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '删除',
|
||||||
|
color: 'error',
|
||||||
|
popConfirm: {
|
||||||
|
title: '是否确认删除',
|
||||||
|
confirm: handleDelete.bind(null, record),
|
||||||
|
},
|
||||||
|
},
|
||||||
|
];
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
@ -0,0 +1,266 @@
|
||||||
|
<template>
|
||||||
|
<a-spin :spinning="confirmLoading">
|
||||||
|
<JFormContainer :disabled="disabled">
|
||||||
|
<template #detail>
|
||||||
|
<a-form ref="formRef" class="antd-modal-form" :labelCol="labelCol" :wrapperCol="wrapperCol" name="NuAppPermissionForm">
|
||||||
|
<a-row>
|
||||||
|
<a-col :span="24">
|
||||||
|
<a-form-item label="父id" v-bind="validateInfos.parentId" id="NuAppPermissionForm-parentId" name="parentId">
|
||||||
|
<a-input v-model:value="formData.parentId" placeholder="请输入父id" allow-clear ></a-input>
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="24">
|
||||||
|
<a-form-item label="菜单标题" v-bind="validateInfos.name" id="NuAppPermissionForm-name" name="name">
|
||||||
|
<a-input v-model:value="formData.name" placeholder="请输入菜单标题" allow-clear ></a-input>
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="24">
|
||||||
|
<a-form-item label="路径" v-bind="validateInfos.url" id="NuAppPermissionForm-url" name="url">
|
||||||
|
<a-input v-model:value="formData.url" placeholder="请输入路径" allow-clear ></a-input>
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="24">
|
||||||
|
<a-form-item label="组件" v-bind="validateInfos.component" id="NuAppPermissionForm-component" name="component">
|
||||||
|
<a-input v-model:value="formData.component" placeholder="请输入组件" allow-clear ></a-input>
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="24">
|
||||||
|
<a-form-item label="是否路由菜单: 0:不是 1:是（默认值1）" v-bind="validateInfos.isRoute" id="NuAppPermissionForm-isRoute" name="isRoute">
|
||||||
|
<a-input-number v-model:value="formData.isRoute" placeholder="请输入是否路由菜单: 0:不是 1:是（默认值1）" style="width: 100%" />
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="24">
|
||||||
|
<a-form-item label="组件名字" v-bind="validateInfos.componentName" id="NuAppPermissionForm-componentName" name="componentName">
|
||||||
|
<a-input v-model:value="formData.componentName" placeholder="请输入组件名字" allow-clear ></a-input>
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="24">
|
||||||
|
<a-form-item label="一级菜单跳转地址" v-bind="validateInfos.redirect" id="NuAppPermissionForm-redirect" name="redirect">
|
||||||
|
<a-input v-model:value="formData.redirect" placeholder="请输入一级菜单跳转地址" allow-clear ></a-input>
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="24">
|
||||||
|
<a-form-item label="菜单类型(0:一级菜单; 1:子菜单:2:按钮权限)" v-bind="validateInfos.menuType" id="NuAppPermissionForm-menuType" name="menuType">
|
||||||
|
<a-input-number v-model:value="formData.menuType" placeholder="请输入菜单类型(0:一级菜单; 1:子菜单:2:按钮权限)" style="width: 100%" />
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="24">
|
||||||
|
<a-form-item label="菜单权限编码" v-bind="validateInfos.perms" id="NuAppPermissionForm-perms" name="perms">
|
||||||
|
<a-input v-model:value="formData.perms" placeholder="请输入菜单权限编码" allow-clear ></a-input>
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="24">
|
||||||
|
<a-form-item label="权限策略1显示2禁用" v-bind="validateInfos.permsType" id="NuAppPermissionForm-permsType" name="permsType">
|
||||||
|
<a-input v-model:value="formData.permsType" placeholder="请输入权限策略1显示2禁用" allow-clear ></a-input>
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="24">
|
||||||
|
<a-form-item label="菜单排序" v-bind="validateInfos.sortNo" id="NuAppPermissionForm-sortNo" name="sortNo">
|
||||||
|
<a-input-number v-model:value="formData.sortNo" placeholder="请输入菜单排序" style="width: 100%" />
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="24">
|
||||||
|
<a-form-item label="聚合子路由: 1是0否" v-bind="validateInfos.alwaysShow" id="NuAppPermissionForm-alwaysShow" name="alwaysShow">
|
||||||
|
<a-input-number v-model:value="formData.alwaysShow" placeholder="请输入聚合子路由: 1是0否" style="width: 100%" />
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="24">
|
||||||
|
<a-form-item label="菜单图标" v-bind="validateInfos.icon" id="NuAppPermissionForm-icon" name="icon">
|
||||||
|
<a-input v-model:value="formData.icon" placeholder="请输入菜单图标" allow-clear ></a-input>
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="24">
|
||||||
|
<a-form-item label="是否叶子节点: 1是0否" v-bind="validateInfos.isLeaf" id="NuAppPermissionForm-isLeaf" name="isLeaf">
|
||||||
|
<a-input-number v-model:value="formData.isLeaf" placeholder="请输入是否叶子节点: 1是0否" style="width: 100%" />
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="24">
|
||||||
|
<a-form-item label="是否缓存该页面: 1:是 0:不是" v-bind="validateInfos.keepAlive" id="NuAppPermissionForm-keepAlive" name="keepAlive">
|
||||||
|
<a-input-number v-model:value="formData.keepAlive" placeholder="请输入是否缓存该页面: 1:是 0:不是" style="width: 100%" />
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="24">
|
||||||
|
<a-form-item label="是否隐藏路由: 0否,1是" v-bind="validateInfos.hidden" id="NuAppPermissionForm-hidden" name="hidden">
|
||||||
|
<a-input-number v-model:value="formData.hidden" placeholder="请输入是否隐藏路由: 0否,1是" style="width: 100%" />
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="24">
|
||||||
|
<a-form-item label="是否隐藏tab: 0否,1是" v-bind="validateInfos.hideTab" id="NuAppPermissionForm-hideTab" name="hideTab">
|
||||||
|
<a-input-number v-model:value="formData.hideTab" placeholder="请输入是否隐藏tab: 0否,1是" style="width: 100%" />
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="24">
|
||||||
|
<a-form-item label="描述" v-bind="validateInfos.description" id="NuAppPermissionForm-description" name="description">
|
||||||
|
<a-input v-model:value="formData.description" placeholder="请输入描述" allow-clear ></a-input>
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="24">
|
||||||
|
<a-form-item label="是否添加数据权限1是0否" v-bind="validateInfos.ruleFlag" id="NuAppPermissionForm-ruleFlag" name="ruleFlag">
|
||||||
|
<a-input-number v-model:value="formData.ruleFlag" placeholder="请输入是否添加数据权限1是0否" style="width: 100%" />
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="24">
|
||||||
|
<a-form-item label="按钮权限状态(0无效1有效)" v-bind="validateInfos.status" id="NuAppPermissionForm-status" name="status">
|
||||||
|
<a-input v-model:value="formData.status" placeholder="请输入按钮权限状态(0无效1有效)" allow-clear ></a-input>
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="24">
|
||||||
|
<a-form-item label="外链菜单打开方式 0/内部打开 1/外部打开" v-bind="validateInfos.internalOrExternal" id="NuAppPermissionForm-internalOrExternal" name="internalOrExternal">
|
||||||
|
<a-input-number v-model:value="formData.internalOrExternal" placeholder="请输入外链菜单打开方式 0/内部打开 1/外部打开" style="width: 100%" />
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
</a-row>
|
||||||
|
</a-form>
|
||||||
|
</template>
|
||||||
|
</JFormContainer>
|
||||||
|
</a-spin>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import { ref, reactive, defineExpose, nextTick, defineProps, computed, onMounted } from 'vue';
|
||||||
|
import { defHttp } from '/@/utils/http/axios';
|
||||||
|
import { useMessage } from '/@/hooks/web/useMessage';
|
||||||
|
import { getValueType } from '/@/utils';
|
||||||
|
import { saveOrUpdate } from '../NuAppPermission.api';
|
||||||
|
import { Form } from 'ant-design-vue';
|
||||||
|
import JFormContainer from '/@/components/Form/src/container/JFormContainer.vue';
|
||||||
|
const props = defineProps({
|
||||||
|
formDisabled: { type: Boolean, default: false },
|
||||||
|
formData: { type: Object, default: () => ({})},
|
||||||
|
formBpm: { type: Boolean, default: true }
|
||||||
|
});
|
||||||
|
const formRef = ref();
|
||||||
|
const useForm = Form.useForm;
|
||||||
|
const emit = defineEmits(['register', 'ok']);
|
||||||
|
const formData = reactive<Record<string, any>>({
|
||||||
|
id: '',
|
||||||
|
parentId: '',
|
||||||
|
name: '',
|
||||||
|
url: '',
|
||||||
|
component: '',
|
||||||
|
isRoute: undefined,
|
||||||
|
componentName: '',
|
||||||
|
redirect: '',
|
||||||
|
menuType: undefined,
|
||||||
|
perms: '',
|
||||||
|
permsType: '',
|
||||||
|
sortNo: undefined,
|
||||||
|
alwaysShow: undefined,
|
||||||
|
icon: '',
|
||||||
|
isLeaf: undefined,
|
||||||
|
keepAlive: undefined,
|
||||||
|
hidden: undefined,
|
||||||
|
hideTab: undefined,
|
||||||
|
description: '',
|
||||||
|
delFlag: undefined,
|
||||||
|
ruleFlag: undefined,
|
||||||
|
status: '',
|
||||||
|
internalOrExternal: undefined,
|
||||||
|
});
|
||||||
|
const { createMessage } = useMessage();
|
||||||
|
const labelCol = ref<any>({ xs: { span: 24 }, sm: { span: 5 } });
|
||||||
|
const wrapperCol = ref<any>({ xs: { span: 24 }, sm: { span: 16 } });
|
||||||
|
const confirmLoading = ref<boolean>(false);
|
||||||
|
//表单验证
|
||||||
|
const validatorRules = reactive({
|
||||||
|
});
|
||||||
|
const { resetFields, validate, validateInfos } = useForm(formData, validatorRules, { immediate: false });
|
||||||
|
|
||||||
|
// 表单禁用
|
||||||
|
const disabled = computed(()=>{
|
||||||
|
if(props.formBpm === true){
|
||||||
|
if(props.formData.disabled === false){
|
||||||
|
return false;
|
||||||
|
}else{
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return props.formDisabled;
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 新增
|
||||||
|
*/
|
||||||
|
function add() {
|
||||||
|
edit({});
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 编辑
|
||||||
|
*/
|
||||||
|
function edit(record) {
|
||||||
|
nextTick(() => {
|
||||||
|
resetFields();
|
||||||
|
const tmpData = {};
|
||||||
|
Object.keys(formData).forEach((key) => {
|
||||||
|
if(record.hasOwnProperty(key)){
|
||||||
|
tmpData[key] = record[key]
|
||||||
|
}
|
||||||
|
})
|
||||||
|
//赋值
|
||||||
|
Object.assign(formData, tmpData);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 提交数据
|
||||||
|
*/
|
||||||
|
async function submitForm() {
|
||||||
|
try {
|
||||||
|
// 触发表单验证
|
||||||
|
await validate();
|
||||||
|
} catch ({ errorFields }) {
|
||||||
|
if (errorFields) {
|
||||||
|
const firstField = errorFields[0];
|
||||||
|
if (firstField) {
|
||||||
|
formRef.value.scrollToField(firstField.name, { behavior: 'smooth', block: 'center' });
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return Promise.reject(errorFields);
|
||||||
|
}
|
||||||
|
confirmLoading.value = true;
|
||||||
|
const isUpdate = ref<boolean>(false);
|
||||||
|
//时间格式化
|
||||||
|
let model = formData;
|
||||||
|
if (model.id) {
|
||||||
|
isUpdate.value = true;
|
||||||
|
}
|
||||||
|
//循环数据
|
||||||
|
for (let data in model) {
|
||||||
|
//如果该数据是数组并且是字符串类型
|
||||||
|
if (model[data] instanceof Array) {
|
||||||
|
let valueType = getValueType(formRef.value.getProps, data);
|
||||||
|
//如果是字符串类型的需要变成以逗号分割的字符串
|
||||||
|
if (valueType === 'string') {
|
||||||
|
model[data] = model[data].join(',');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
await saveOrUpdate(model, isUpdate.value)
|
||||||
|
.then((res) => {
|
||||||
|
if (res.success) {
|
||||||
|
createMessage.success(res.message);
|
||||||
|
emit('ok');
|
||||||
|
} else {
|
||||||
|
createMessage.warning(res.message);
|
||||||
|
}
|
||||||
|
})
|
||||||
|
.finally(() => {
|
||||||
|
confirmLoading.value = false;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
defineExpose({
|
||||||
|
add,
|
||||||
|
edit,
|
||||||
|
submitForm,
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.antd-modal-form {
|
||||||
|
padding: 14px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,77 @@
|
||||||
|
<template>
|
||||||
|
<j-modal :title="title" :width="width" :visible="visible" @ok="handleOk" :okButtonProps="{ class: { 'jee-hidden': disableSubmit } }" @cancel="handleCancel" cancelText="关闭">
|
||||||
|
<NuAppPermissionForm ref="registerForm" @ok="submitCallback" :formDisabled="disableSubmit" :formBpm="false"></NuAppPermissionForm>
|
||||||
|
</j-modal>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import { ref, nextTick, defineExpose } from 'vue';
|
||||||
|
import NuAppPermissionForm from './NuAppPermissionForm.vue'
|
||||||
|
import JModal from '/@/components/Modal/src/JModal/JModal.vue';
|
||||||
|
|
||||||
|
const title = ref<string>('');
|
||||||
|
const width = ref<number>(800);
|
||||||
|
const visible = ref<boolean>(false);
|
||||||
|
const disableSubmit = ref<boolean>(false);
|
||||||
|
const registerForm = ref();
|
||||||
|
const emit = defineEmits(['register', 'success']);
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 新增
|
||||||
|
*/
|
||||||
|
function add() {
|
||||||
|
title.value = '新增';
|
||||||
|
visible.value = true;
|
||||||
|
nextTick(() => {
|
||||||
|
registerForm.value.add();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 编辑
|
||||||
|
* @param record
|
||||||
|
*/
|
||||||
|
function edit(record) {
|
||||||
|
title.value = disableSubmit.value ? '详情' : '编辑';
|
||||||
|
visible.value = true;
|
||||||
|
nextTick(() => {
|
||||||
|
registerForm.value.edit(record);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 确定按钮点击事件
|
||||||
|
*/
|
||||||
|
function handleOk() {
|
||||||
|
registerForm.value.submitForm();
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* form保存回调事件
|
||||||
|
*/
|
||||||
|
function submitCallback() {
|
||||||
|
handleCancel();
|
||||||
|
emit('success');
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 取消按钮回调事件
|
||||||
|
*/
|
||||||
|
function handleCancel() {
|
||||||
|
visible.value = false;
|
||||||
|
}
|
||||||
|
|
||||||
|
defineExpose({
|
||||||
|
add,
|
||||||
|
edit,
|
||||||
|
disableSubmit,
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="less">
|
||||||
|
/**隐藏样式-modal确定按钮 */
|
||||||
|
.jee-hidden {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<style lang="less" scoped></style>
|
||||||
|
|
@ -0,0 +1,85 @@
|
||||||
|
<template>
|
||||||
|
<BasicDrawer v-bind="$attrs" @register="registerDrawer" title="数据规则配置" width="450px" destroyOnClose>
|
||||||
|
<a-tabs defaultActiveKey="1">
|
||||||
|
<a-tab-pane tab="数据规则" key="1">
|
||||||
|
<a-checkbox-group v-model:value="dataRuleChecked" v-if="dataRuleList.length > 0">
|
||||||
|
<a-row>
|
||||||
|
<a-col :span="24" v-for="(item, index) in dataRuleList" :key="'dr' + index">
|
||||||
|
<a-checkbox :value="item.id">{{ item.ruleName }}</a-checkbox>
|
||||||
|
</a-col>
|
||||||
|
|
||||||
|
<a-col :span="24">
|
||||||
|
<div style="width: 100%; margin-top: 15px">
|
||||||
|
<a-button @click="saveDataRuleForRole" type="primary" size="small"> <Icon icon="ant-design:save-outlined"></Icon>点击保存</a-button>
|
||||||
|
</div>
|
||||||
|
</a-col>
|
||||||
|
</a-row>
|
||||||
|
</a-checkbox-group>
|
||||||
|
<div v-else><h3>无配置信息!</h3></div>
|
||||||
|
</a-tab-pane>
|
||||||
|
</a-tabs>
|
||||||
|
</BasicDrawer>
|
||||||
|
</template>
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import { ref, unref } from 'vue';
|
||||||
|
import { BasicDrawer, useDrawerInner } from '/src/components/Drawer';
|
||||||
|
import { useMessage } from '/src/hooks/web/useMessage';
|
||||||
|
import { queryDataRule, saveDataRule } from '../NuAppRole.api';
|
||||||
|
// 声明Emits
|
||||||
|
const emit = defineEmits(['success', 'register']);
|
||||||
|
const { createMessage } = useMessage();
|
||||||
|
// 声明数据
|
||||||
|
const functionId = ref('');
|
||||||
|
const roleId = ref('');
|
||||||
|
const dataRuleList = ref([]);
|
||||||
|
const dataRuleChecked = ref([]);
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 数据
|
||||||
|
*/
|
||||||
|
const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
|
||||||
|
await reset();
|
||||||
|
setDrawerProps({ confirmLoading: false });
|
||||||
|
//权限的id
|
||||||
|
functionId.value = data.functionId;
|
||||||
|
//角色的id
|
||||||
|
roleId.value = data.roleId;
|
||||||
|
//查询数据
|
||||||
|
const res = await queryDataRule({ functionId: unref(functionId), roleId: unref(roleId) });
|
||||||
|
if (res.success) {
|
||||||
|
dataRuleList.value = res.result.datarule;
|
||||||
|
if (res.result.drChecked) {
|
||||||
|
dataRuleChecked.value = res.result.drChecked.split(',');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 重置
|
||||||
|
*/
|
||||||
|
function reset() {
|
||||||
|
functionId.value = '';
|
||||||
|
roleId.value = '';
|
||||||
|
dataRuleList.value = [];
|
||||||
|
dataRuleChecked.value = [];
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 提交
|
||||||
|
*/
|
||||||
|
async function saveDataRuleForRole() {
|
||||||
|
if (!unref(dataRuleChecked) || unref(dataRuleChecked).length == 0) {
|
||||||
|
createMessage.warning('请注意，现未勾选任何数据权限!');
|
||||||
|
}
|
||||||
|
let params = {
|
||||||
|
permissionId: unref(functionId),
|
||||||
|
roleId: unref(roleId),
|
||||||
|
dataRuleIds: unref(dataRuleChecked).join(','),
|
||||||
|
};
|
||||||
|
await saveDataRule(params);
|
||||||
|
//关闭弹窗
|
||||||
|
closeDrawer();
|
||||||
|
//刷新列表
|
||||||
|
emit('success');
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
@ -0,0 +1,18 @@
|
||||||
|
<template>
|
||||||
|
<BasicDrawer v-bind="$attrs" @register="registerDrawer" title="角色详情" width="500px" destroyOnClose>
|
||||||
|
<Description :column="1" :data="roleData" :schema="formDescSchema" />
|
||||||
|
</BasicDrawer>
|
||||||
|
</template>
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import { ref, useAttrs } from 'vue';
|
||||||
|
import { BasicDrawer, useDrawerInner } from '/src/components/Drawer';
|
||||||
|
import { formDescSchema } from '../NuAppRole.data';
|
||||||
|
import { Description, useDescription } from '/@/components/Description/index';
|
||||||
|
const emit = defineEmits(['register']);
|
||||||
|
const attrs = useAttrs();
|
||||||
|
const roleData = ref({});
|
||||||
|
const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
|
||||||
|
setDrawerProps({ confirmLoading: false });
|
||||||
|
roleData.value = data.record;
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
@ -0,0 +1,53 @@
|
||||||
|
<template>
|
||||||
|
<BasicDrawer v-bind="$attrs" @register="registerDrawer" :title="getTitle" width="500px" @ok="handleSubmit" destroyOnClose>
|
||||||
|
<BasicForm @register="registerForm" />
|
||||||
|
</BasicDrawer>
|
||||||
|
</template>
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import { ref, computed, unref, useAttrs } from 'vue';
|
||||||
|
import { BasicForm, useForm } from '/src/components/Form';
|
||||||
|
import { BasicDrawer, useDrawerInner } from '/src/components/Drawer';
|
||||||
|
import { BasicTree, TreeItem } from '/src/components/Tree';
|
||||||
|
import { formSchema } from '../NuAppRole.data';
|
||||||
|
import { saveOrUpdateRole } from '../NuAppRole.api';
|
||||||
|
// 声明Emits
|
||||||
|
const emit = defineEmits(['success', 'register']);
|
||||||
|
const attrs = useAttrs();
|
||||||
|
const isUpdate = ref(true);
|
||||||
|
const [registerForm, { setProps, resetFields, setFieldsValue, validate }] = useForm({
|
||||||
|
labelWidth: 90,
|
||||||
|
schemas: formSchema,
|
||||||
|
showActionButtonGroup: false,
|
||||||
|
});
|
||||||
|
const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
|
||||||
|
resetFields();
|
||||||
|
isUpdate.value = !!data?.isUpdate;
|
||||||
|
setDrawerProps({ confirmLoading: false });
|
||||||
|
if (unref(isUpdate)) {
|
||||||
|
setFieldsValue({
|
||||||
|
...data.record,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
//禁用表单
|
||||||
|
setProps({ disabled: !attrs.showFooter });
|
||||||
|
});
|
||||||
|
/**
|
||||||
|
* 标题
|
||||||
|
*/
|
||||||
|
const getTitle = computed(() => (!unref(isUpdate) ? '新增角色' : '编辑角色'));
|
||||||
|
/**
|
||||||
|
* 提交
|
||||||
|
*/
|
||||||
|
async function handleSubmit() {
|
||||||
|
try {
|
||||||
|
const values = await validate();
|
||||||
|
setDrawerProps({ confirmLoading: true });
|
||||||
|
//提交表单
|
||||||
|
await saveOrUpdateRole(values, isUpdate.value);
|
||||||
|
closeDrawer();
|
||||||
|
emit('success');
|
||||||
|
} finally {
|
||||||
|
setDrawerProps({ confirmLoading: false });
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
@ -0,0 +1,55 @@
|
||||||
|
<template>
|
||||||
|
<BasicModal v-bind="$attrs" @register="registerModal" title="首页配置" @ok="handleSubmit" width="40%">
|
||||||
|
<BasicForm @register="registerForm" />
|
||||||
|
</BasicModal>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import { ref, computed, unref } from 'vue';
|
||||||
|
import { BasicModal, useModalInner } from '/@/components/Modal';
|
||||||
|
import { BasicForm, useForm } from '/@/components/Form/index';
|
||||||
|
import { roleIndexFormSchema } from '../NuAppRole.data';
|
||||||
|
import { saveOrUpdateRoleIndex, queryIndexByCode } from '../NuAppRole.api';
|
||||||
|
// Emits声明
|
||||||
|
const emit = defineEmits(['register', 'success']);
|
||||||
|
const isUpdate = ref(true);
|
||||||
|
//表单配置
|
||||||
|
const [registerForm, { resetFields, setFieldsValue, validate }] = useForm({
|
||||||
|
labelWidth: 150,
|
||||||
|
schemas: roleIndexFormSchema,
|
||||||
|
showActionButtonGroup: false,
|
||||||
|
});
|
||||||
|
//表单赋值
|
||||||
|
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
|
||||||
|
//重置表单
|
||||||
|
await resetFields();
|
||||||
|
setModalProps({ confirmLoading: false });
|
||||||
|
setFieldsValue({ roleCode: data.roleCode });
|
||||||
|
let res = await queryIndexByCode({ roleCode: data.roleCode });
|
||||||
|
isUpdate.value = !!res.result?.id;
|
||||||
|
if (unref(isUpdate)) {
|
||||||
|
//表单赋值
|
||||||
|
await setFieldsValue({
|
||||||
|
...res.result,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
//表单提交事件
|
||||||
|
async function handleSubmit(v) {
|
||||||
|
try {
|
||||||
|
let values = await validate();
|
||||||
|
setModalProps({ confirmLoading: true });
|
||||||
|
//提交表单
|
||||||
|
await saveOrUpdateRoleIndex(values, isUpdate.value);
|
||||||
|
//关闭弹窗
|
||||||
|
closeModal();
|
||||||
|
//刷新列表
|
||||||
|
emit('success', { isUpdate: isUpdate.value, values });
|
||||||
|
} finally {
|
||||||
|
setModalProps({ confirmLoading: false });
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="less" scoped></style>
|
||||||
|
|
@ -0,0 +1,304 @@
|
||||||
|
<template>
|
||||||
|
<BasicDrawer v-bind="$attrs" @register="registerDrawer" width="650px" destroyOnClose showFooter>
|
||||||
|
<template #title>
|
||||||
|
角色权限配置
|
||||||
|
<a-dropdown>
|
||||||
|
<Icon icon="ant-design:more-outlined" class="more-icon" />
|
||||||
|
<template #overlay>
|
||||||
|
<a-menu @click="treeMenuClick">
|
||||||
|
<a-menu-item key="checkAll">选择全部</a-menu-item>
|
||||||
|
<a-menu-item key="cancelCheck">取消选择</a-menu-item>
|
||||||
|
<div class="line"></div>
|
||||||
|
<a-menu-item key="openAll">展开全部</a-menu-item>
|
||||||
|
<a-menu-item key="closeAll">折叠全部</a-menu-item>
|
||||||
|
<div class="line"></div>
|
||||||
|
<a-menu-item key="relation">层级关联</a-menu-item>
|
||||||
|
<a-menu-item key="standAlone">层级独立</a-menu-item>
|
||||||
|
</a-menu>
|
||||||
|
</template>
|
||||||
|
</a-dropdown>
|
||||||
|
</template>
|
||||||
|
<BasicTree
|
||||||
|
ref="treeRef"
|
||||||
|
checkable
|
||||||
|
:treeData="treeData"
|
||||||
|
:checkedKeys="checkedKeys"
|
||||||
|
:expandedKeys="expandedKeys"
|
||||||
|
:selectedKeys="selectedKeys"
|
||||||
|
:clickRowToExpand="false"
|
||||||
|
:checkStrictly="true"
|
||||||
|
title="所拥有的的权限"
|
||||||
|
@check="onCheck"
|
||||||
|
@select="onTreeNodeSelect"
|
||||||
|
>
|
||||||
|
<template #title="{ slotTitle, ruleFlag }">
|
||||||
|
{{ slotTitle }}
|
||||||
|
<Icon v-if="ruleFlag" icon="ant-design:align-left-outlined" style="margin-left: 5px; color: red"></Icon>
|
||||||
|
</template>
|
||||||
|
</BasicTree>
|
||||||
|
<!--右下角按钮-->
|
||||||
|
<template #footer>
|
||||||
|
<!-- <PopConfirmButton title="确定放弃编辑？" @confirm="closeDrawer" okText="确定" cancelText="取消"></PopConfirmButton> -->
|
||||||
|
<a-button @click="closeDrawer">取消</a-button>
|
||||||
|
<a-button @click="handleSubmit(false)" type="primary" :loading="loading" ghost style="margin-right: 0.8rem">仅保存</a-button>
|
||||||
|
<a-button @click="handleSubmit(true)" type="primary" :loading="loading">保存并关闭</a-button>
|
||||||
|
</template>
|
||||||
|
<RoleDataRuleDrawer @register="registerDrawer1" />
|
||||||
|
</BasicDrawer>
|
||||||
|
</template>
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import { ref, computed, unref, onMounted } from 'vue';
|
||||||
|
import { BasicDrawer, useDrawer, useDrawerInner } from '/@/components/Drawer';
|
||||||
|
import { BasicTree, TreeItem } from '/@/components/Tree';
|
||||||
|
import { PopConfirmButton } from '/@/components/Button';
|
||||||
|
import RoleDataRuleDrawer from './RoleDataRuleDrawer.vue';
|
||||||
|
import { queryTreeListForRole, queryRolePermission, saveRolePermission } from '../NuAppRole.api';
|
||||||
|
import { useI18n } from "/@/hooks/web/useI18n";
|
||||||
|
import { ROLE_AUTH_CONFIG_KEY } from '/@/enums/cacheEnum';
|
||||||
|
const emit = defineEmits(['register']);
|
||||||
|
//树的信息
|
||||||
|
const treeData = ref<TreeItem[]>([]);
|
||||||
|
//树的全部节点信息
|
||||||
|
const allTreeKeys = ref([]);
|
||||||
|
//树的选择节点信息
|
||||||
|
const checkedKeys = ref<any>([]);
|
||||||
|
const defaultCheckedKeys = ref([]);
|
||||||
|
//树的选中的节点信息
|
||||||
|
const selectedKeys = ref([]);
|
||||||
|
const roleId = ref('');
|
||||||
|
//树的实例
|
||||||
|
const treeRef = ref(null);
|
||||||
|
const loading = ref(false);
|
||||||
|
|
||||||
|
//展开折叠的key
|
||||||
|
const expandedKeys = ref<any>([]);
|
||||||
|
//父子节点选中状态是否关联 true不关联，false关联
|
||||||
|
const checkStrictly = ref<boolean>(false);
|
||||||
|
const [registerDrawer1, { openDrawer: openDataRuleDrawer }] = useDrawer();
|
||||||
|
const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
|
||||||
|
await reset();
|
||||||
|
setDrawerProps({ confirmLoading: false, loading: true });
|
||||||
|
roleId.value = data.roleId;
|
||||||
|
//初始化数据
|
||||||
|
const roleResult = await queryTreeListForRole();
|
||||||
|
// update-begin--author:liaozhiyang---date:20240228---for：【QQYUN-8355】角色权限配置的菜单翻译
|
||||||
|
treeData.value = translateTitle(roleResult.treeList);
|
||||||
|
// update-end--author:liaozhiyang---date:20240228---for：【QQYUN-8355】角色权限配置的菜单翻译
|
||||||
|
allTreeKeys.value = roleResult.ids;
|
||||||
|
// update-begin--author:liaozhiyang---date:20240531---for：【TV360X-590】角色授权弹窗操作缓存
|
||||||
|
const localData = localStorage.getItem(ROLE_AUTH_CONFIG_KEY);
|
||||||
|
if (localData) {
|
||||||
|
const obj = JSON.parse(localData);
|
||||||
|
obj.level && treeMenuClick({ key: obj.level });
|
||||||
|
obj.expand && treeMenuClick({ key: obj.expand });
|
||||||
|
} else {
|
||||||
|
expandedKeys.value = roleResult.ids;
|
||||||
|
}
|
||||||
|
// update-end--author:liaozhiyang---date:20240531---for：【TV360X-590】角色授权弹窗操作缓存
|
||||||
|
//初始化角色菜单数据
|
||||||
|
const permResult = await queryRolePermission({ roleId: unref(roleId) });
|
||||||
|
checkedKeys.value = permResult;
|
||||||
|
defaultCheckedKeys.value = permResult;
|
||||||
|
setDrawerProps({ loading: false });
|
||||||
|
});
|
||||||
|
/**
|
||||||
|
* 2024-02-28
|
||||||
|
* liaozhiyang
|
||||||
|
* 翻译菜单名称
|
||||||
|
*/
|
||||||
|
function translateTitle(data) {
|
||||||
|
if (data?.length) {
|
||||||
|
data.forEach((item) => {
|
||||||
|
if (item.slotTitle) {
|
||||||
|
const { t } = useI18n();
|
||||||
|
if (item.slotTitle.includes("t('") && t) {
|
||||||
|
item.slotTitle = new Function('t', `return ${item.slotTitle}`)(t);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if (item.children?.length) {
|
||||||
|
translateTitle(item.children);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
return data;
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 点击选中
|
||||||
|
* 2024-04-26
|
||||||
|
* liaozhiyang
|
||||||
|
*/
|
||||||
|
function onCheck(o, e) {
|
||||||
|
// checkStrictly: true=>层级独立，false=>层级关联.
|
||||||
|
if (checkStrictly.value) {
|
||||||
|
checkedKeys.value = o.checked ? o.checked : o;
|
||||||
|
} else {
|
||||||
|
const keys = getNodeAllKey(e.node, 'children', 'key');
|
||||||
|
if (e.checked) {
|
||||||
|
// 反复操作下可能会有重复的keys，得用new Set去重下
|
||||||
|
checkedKeys.value = [...new Set([...checkedKeys.value, ...keys])];
|
||||||
|
} else {
|
||||||
|
const result = removeMatchingItems(checkedKeys.value, keys);
|
||||||
|
checkedKeys.value = result;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 2024-04-26
|
||||||
|
* liaozhiyang
|
||||||
|
* 删除相匹配数组的项
|
||||||
|
*/
|
||||||
|
function removeMatchingItems(arr1, arr2) {
|
||||||
|
// 使用哈希表记录 arr2 中的元素
|
||||||
|
const hashTable = {};
|
||||||
|
for (const item of arr2) {
|
||||||
|
hashTable[item] = true;
|
||||||
|
}
|
||||||
|
// 使用 filter 方法遍历第一个数组，过滤出不在哈希表中存在的项
|
||||||
|
return arr1.filter((item) => !hashTable[item]);
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 2024-04-26
|
||||||
|
* liaozhiyang
|
||||||
|
* 获取当前节点及以下所有子孙级的key
|
||||||
|
*/
|
||||||
|
function getNodeAllKey(node: any, children: any, key: string) {
|
||||||
|
const result: any = [];
|
||||||
|
result.push(node[key]);
|
||||||
|
const recursion = (data) => {
|
||||||
|
data.forEach((item: any) => {
|
||||||
|
result.push(item[key]);
|
||||||
|
if (item[children]?.length) {
|
||||||
|
recursion(item[children]);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
};
|
||||||
|
node[children]?.length && recursion(node[children]);
|
||||||
|
return result;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 选中节点，打开数据权限抽屉
|
||||||
|
*/
|
||||||
|
function onTreeNodeSelect(key) {
|
||||||
|
if (key && key.length > 0) {
|
||||||
|
selectedKeys.value = key;
|
||||||
|
}
|
||||||
|
openDataRuleDrawer(true, { functionId: unref(selectedKeys)[0], roleId: unref(roleId) });
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 数据重置
|
||||||
|
*/
|
||||||
|
function reset() {
|
||||||
|
treeData.value = [];
|
||||||
|
allTreeKeys.value = [];
|
||||||
|
checkedKeys.value = [];
|
||||||
|
defaultCheckedKeys.value = [];
|
||||||
|
selectedKeys.value = [];
|
||||||
|
roleId.value = '';
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 获取tree实例
|
||||||
|
*/
|
||||||
|
function getTree() {
|
||||||
|
const tree = unref(treeRef);
|
||||||
|
if (!tree) {
|
||||||
|
throw new Error('tree is null!');
|
||||||
|
}
|
||||||
|
return tree;
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 提交
|
||||||
|
*/
|
||||||
|
async function handleSubmit(exit) {
|
||||||
|
let params = {
|
||||||
|
roleId: unref(roleId),
|
||||||
|
permissionIds: unref(getTree().getCheckedKeys()).join(','),
|
||||||
|
lastpermissionIds: unref(defaultCheckedKeys).join(','),
|
||||||
|
};
|
||||||
|
//update-begin-author:taoyan date:2023-2-11 for: issues/352 VUE角色授权重复保存
|
||||||
|
if(loading.value===false){
|
||||||
|
await doSave(params)
|
||||||
|
}else{
|
||||||
|
console.log('请等待上次执行完毕!');
|
||||||
|
}
|
||||||
|
if(exit){
|
||||||
|
// 如果关闭
|
||||||
|
closeDrawer();
|
||||||
|
}else{
|
||||||
|
// 没有关闭需要重新获取选中数据
|
||||||
|
const permResult = await queryRolePermission({ roleId: unref(roleId) });
|
||||||
|
defaultCheckedKeys.value = permResult;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// VUE角色授权重复保存 #352
|
||||||
|
async function doSave(params) {
|
||||||
|
loading.value = true;
|
||||||
|
await saveRolePermission(params);
|
||||||
|
setTimeout(()=>{
|
||||||
|
loading.value = false;
|
||||||
|
}, 500)
|
||||||
|
}
|
||||||
|
//update-end-author:taoyan date:2023-2-11 for: issues/352 VUE角色授权重复保存
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 树菜单选择
|
||||||
|
* @param key
|
||||||
|
*/
|
||||||
|
function treeMenuClick({ key }) {
|
||||||
|
if (key === 'checkAll') {
|
||||||
|
checkedKeys.value = allTreeKeys.value;
|
||||||
|
} else if (key === 'cancelCheck') {
|
||||||
|
checkedKeys.value = [];
|
||||||
|
} else if (key === 'openAll') {
|
||||||
|
expandedKeys.value = allTreeKeys.value;
|
||||||
|
saveLocalOperation('expand', 'openAll');
|
||||||
|
} else if (key === 'closeAll') {
|
||||||
|
expandedKeys.value = [];
|
||||||
|
saveLocalOperation('expand', 'closeAll');
|
||||||
|
} else if (key === 'relation') {
|
||||||
|
checkStrictly.value = false;
|
||||||
|
saveLocalOperation('level', 'relation');
|
||||||
|
} else {
|
||||||
|
checkStrictly.value = true;
|
||||||
|
saveLocalOperation('level', 'standAlone');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 2024-05-31
|
||||||
|
* liaozhiyang
|
||||||
|
* 【TV360X-590】角色授权弹窗操作缓存
|
||||||
|
* */
|
||||||
|
const saveLocalOperation = (key, value) => {
|
||||||
|
const localData = localStorage.getItem(ROLE_AUTH_CONFIG_KEY);
|
||||||
|
const obj = localData ? JSON.parse(localData) : {};
|
||||||
|
obj[key] = value;
|
||||||
|
localStorage.setItem(ROLE_AUTH_CONFIG_KEY, JSON.stringify(obj))
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="less" scoped>
|
||||||
|
/** 固定操作按钮 */
|
||||||
|
.jeecg-basic-tree {
|
||||||
|
position: absolute;
|
||||||
|
width: 618px;
|
||||||
|
}
|
||||||
|
//update-begin---author:wangshuai ---date:20230202 for：抽屉弹窗标题图标下拉样式------------
|
||||||
|
.line {
|
||||||
|
height: 1px;
|
||||||
|
width: 100%;
|
||||||
|
border-bottom: 1px solid #f0f0f0;
|
||||||
|
}
|
||||||
|
.more-icon {
|
||||||
|
font-size: 20px !important;
|
||||||
|
color: black;
|
||||||
|
display: inline-flex;
|
||||||
|
float: right;
|
||||||
|
margin-right: 2px;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
:deep(.jeecg-tree-header) {
|
||||||
|
border-bottom: none;
|
||||||
|
}
|
||||||
|
//update-end---author:wangshuai ---date:20230202 for：抽屉弹窗标题图标下拉样式------------
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,200 @@
|
||||||
|
<template>
|
||||||
|
<BasicDrawer @register="registerBaseDrawer" title="角色用户" width="800" destroyOnClose>
|
||||||
|
<BasicTable @register="registerTable" :rowSelection="rowSelection">
|
||||||
|
<template #tableTitle>
|
||||||
|
<a-button type="primary" @click="handleCreate" v-if="!disableUserEdit"> 新增用户</a-button>
|
||||||
|
<a-button type="primary" @click="handleSelect"> 已有用户</a-button>
|
||||||
|
|
||||||
|
<a-dropdown v-if="checkedKeys.length > 0">
|
||||||
|
<template #overlay>
|
||||||
|
<a-menu>
|
||||||
|
<a-menu-item key="1" @click="batchHandleDelete">
|
||||||
|
<Icon icon="bx:bx-unlink"></Icon>
|
||||||
|
取消关联
|
||||||
|
</a-menu-item>
|
||||||
|
</a-menu>
|
||||||
|
</template>
|
||||||
|
<a-button
|
||||||
|
>批量操作
|
||||||
|
<Icon icon="ant-design:down-outlined"></Icon>
|
||||||
|
</a-button>
|
||||||
|
</a-dropdown>
|
||||||
|
</template>
|
||||||
|
<template #action="{ record }">
|
||||||
|
<TableAction :actions="getTableAction(record)" />
|
||||||
|
</template>
|
||||||
|
</BasicTable>
|
||||||
|
<!--用户操作抽屉-->
|
||||||
|
<UserDrawer @register="registerDrawer" @success="handleSuccess" />
|
||||||
|
<!--用户选择弹窗-->
|
||||||
|
<UseSelectModal @register="registerModal" @select="selectOk" />
|
||||||
|
</BasicDrawer>
|
||||||
|
</template>
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import { ref, watch, unref } from 'vue';
|
||||||
|
import { BasicTable, useTable, TableAction } from '/src/components/Table';
|
||||||
|
import { BasicDrawer, useDrawer, useDrawerInner } from '/src/components/Drawer';
|
||||||
|
import { useModal } from '/src/components/Modal';
|
||||||
|
import UserDrawer from '/@/views/system/user/UserDrawer.vue';
|
||||||
|
import UseSelectModal from './UseSelectModal.vue';
|
||||||
|
import { userList, deleteUserRole, batchDeleteUserRole, addUserRole } from '../NuAppRole.api';
|
||||||
|
import { userColumns, searchUserFormSchema } from '../NuAppRole.data';
|
||||||
|
import { getUserRoles } from '/@/views/system/user/user.api';
|
||||||
|
|
||||||
|
const emit = defineEmits(['register', 'hideUserList']);
|
||||||
|
const props = defineProps({
|
||||||
|
disableUserEdit: {type:Boolean,default:false}
|
||||||
|
})
|
||||||
|
|
||||||
|
const checkedKeys = ref<Array<string | number>>([]);
|
||||||
|
const roleId = ref('');
|
||||||
|
const [registerBaseDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
|
||||||
|
roleId.value = data.id;
|
||||||
|
setProps({ searchInfo: { roleId: data.id } });
|
||||||
|
reload();
|
||||||
|
});
|
||||||
|
//注册drawer
|
||||||
|
const [registerDrawer, { openDrawer }] = useDrawer();
|
||||||
|
//注册drawer
|
||||||
|
const [registerModal, { openModal }] = useModal();
|
||||||
|
const [registerTable, { reload, updateTableDataRecord, setProps }] = useTable({
|
||||||
|
title: '用户列表',
|
||||||
|
api: userList,
|
||||||
|
columns: userColumns,
|
||||||
|
formConfig: {
|
||||||
|
//update-begin---author:wangshuai ---date:20230703 for：【QQYUN-5685】3、租户角色下,查询居左显示
|
||||||
|
labelWidth: 60,
|
||||||
|
//update-end---author:wangshuai ---date:20230703 for：【QQYUN-5685】3、租户角色下,查询居左显示
|
||||||
|
schemas: searchUserFormSchema,
|
||||||
|
autoSubmitOnEnter: true,
|
||||||
|
},
|
||||||
|
striped: true,
|
||||||
|
useSearchForm: true,
|
||||||
|
showTableSetting: true,
|
||||||
|
clickToRowSelect: false,
|
||||||
|
bordered: true,
|
||||||
|
showIndexColumn: false,
|
||||||
|
// 【issues/1064】列设置的 cacheKey
|
||||||
|
tableSetting: { fullScreen: true, cacheKey: 'role_user_table' },
|
||||||
|
canResize: false,
|
||||||
|
rowKey: 'id',
|
||||||
|
actionColumn: {
|
||||||
|
width: 180,
|
||||||
|
title: '操作',
|
||||||
|
dataIndex: 'action',
|
||||||
|
slots: { customRender: 'action' },
|
||||||
|
fixed: undefined,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 选择列配置
|
||||||
|
*/
|
||||||
|
const rowSelection = {
|
||||||
|
type: 'checkbox',
|
||||||
|
columnWidth: 50,
|
||||||
|
selectedRowKeys: checkedKeys,
|
||||||
|
onChange: onSelectChange,
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 选择事件
|
||||||
|
*/
|
||||||
|
function onSelectChange(selectedRowKeys: (string | number)[], selectionRows) {
|
||||||
|
checkedKeys.value = selectedRowKeys;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 新增
|
||||||
|
*/
|
||||||
|
function handleCreate() {
|
||||||
|
openDrawer(true, {
|
||||||
|
isUpdate: false,
|
||||||
|
selectedroles: [roleId.value],
|
||||||
|
isRole: true,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 编辑
|
||||||
|
*/
|
||||||
|
async function handleEdit(record: Recordable) {
|
||||||
|
try {
|
||||||
|
const userRoles = await getUserRoles({ userid: record.id });
|
||||||
|
if (userRoles && userRoles.length > 0) {
|
||||||
|
record.selectedroles = userRoles;
|
||||||
|
}
|
||||||
|
} catch (e) {
|
||||||
|
console.log(e);
|
||||||
|
}
|
||||||
|
openDrawer(true, {
|
||||||
|
record,
|
||||||
|
isUpdate: true,
|
||||||
|
isRole: true,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 删除事件
|
||||||
|
*/
|
||||||
|
async function handleDelete(record) {
|
||||||
|
await deleteUserRole({ userId: record.id, roleId: roleId.value }, reload);
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 批量删除事件
|
||||||
|
*/
|
||||||
|
async function batchHandleDelete() {
|
||||||
|
await batchDeleteUserRole({ userIds: checkedKeys.value.join(','), roleId: roleId.value }, () => {
|
||||||
|
// update-begin--author:liaozhiyang---date:20240701---for：【TV360X-1655】批量取消关联之后清空选中记录
|
||||||
|
reload();
|
||||||
|
checkedKeys.value = [];
|
||||||
|
// update-end--author:liaozhiyang---date:20240701---for：【TV360X-1655】批量取消关联之后清空选中记录
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 成功回调
|
||||||
|
*/
|
||||||
|
function handleSuccess({ isUpdate, values }) {
|
||||||
|
isUpdate ? updateTableDataRecord(values.id, values) : reload();
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 选择已有用户
|
||||||
|
*/
|
||||||
|
function handleSelect() {
|
||||||
|
openModal(true);
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 添加已有用户
|
||||||
|
*/
|
||||||
|
async function selectOk(val) {
|
||||||
|
await addUserRole({ roleId: roleId.value, userIdList: val }, reload);
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 操作栏
|
||||||
|
*/
|
||||||
|
function getTableAction(record) {
|
||||||
|
return [
|
||||||
|
{
|
||||||
|
label: '编辑',
|
||||||
|
onClick: handleEdit.bind(null, record),
|
||||||
|
ifShow: () => !props.disableUserEdit,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '取消关联',
|
||||||
|
popConfirm: {
|
||||||
|
title: '是否确认取消关联',
|
||||||
|
confirm: handleDelete.bind(null, record),
|
||||||
|
},
|
||||||
|
},
|
||||||
|
];
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
/*update-begin---author:wangshuai ---date:20230703 for：【QQYUN-5685】3、租户角色下,查询居左显示*/
|
||||||
|
:deep(.ant-form-item-control-input-content){
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
/*update-end---author:wangshuai ---date:20230703 for：【QQYUN-5685】3、租户角色下,查询居左显示*/
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,67 @@
|
||||||
|
<template>
|
||||||
|
<BasicModal v-bind="$attrs" @register="registerModal" title="用户选择列表" width="1000px" @ok="handleSubmit" destroyOnClose @openChange="handleOpenChange">
|
||||||
|
<BasicTable @register="registerTable" :rowSelection="rowSelection" />
|
||||||
|
</BasicModal>
|
||||||
|
</template>
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import { ref, unref, toRaw } from 'vue';
|
||||||
|
import { BasicModal, useModalInner } from '/src/components/Modal';
|
||||||
|
import { BasicTable, useTable, TableAction } from '/src/components/Table';
|
||||||
|
import { userColumns, searchUserFormSchema } from '../NuAppRole.data';
|
||||||
|
import { list } from '/@/views/system/user/user.api';
|
||||||
|
// 声明Emits
|
||||||
|
const emit = defineEmits(['select', 'register']);
|
||||||
|
const checkedKeys = ref<Array<string | number>>([]);
|
||||||
|
const [registerModal, { setModalProps, closeModal }] = useModalInner();
|
||||||
|
//注册table数据
|
||||||
|
const [registerTable, { reload }] = useTable({
|
||||||
|
api: list,
|
||||||
|
rowKey: 'id',
|
||||||
|
columns: userColumns,
|
||||||
|
formConfig: {
|
||||||
|
labelWidth: 60,
|
||||||
|
schemas: searchUserFormSchema,
|
||||||
|
baseRowStyle: { maxHeight: '20px' },
|
||||||
|
autoSubmitOnEnter: true,
|
||||||
|
},
|
||||||
|
striped: true,
|
||||||
|
useSearchForm: true,
|
||||||
|
showTableSetting: false,
|
||||||
|
bordered: true,
|
||||||
|
showIndexColumn: false,
|
||||||
|
canResize: false,
|
||||||
|
});
|
||||||
|
/**
|
||||||
|
* 选择列配置
|
||||||
|
*/
|
||||||
|
const rowSelection = {
|
||||||
|
type: 'checkbox',
|
||||||
|
columnWidth: 50,
|
||||||
|
selectedRowKeys: checkedKeys,
|
||||||
|
onChange: onSelectChange,
|
||||||
|
};
|
||||||
|
/**
|
||||||
|
* 选择事件
|
||||||
|
*/
|
||||||
|
function onSelectChange(selectedRowKeys: (string | number)[]) {
|
||||||
|
checkedKeys.value = selectedRowKeys;
|
||||||
|
}
|
||||||
|
|
||||||
|
const handleOpenChange = (visible) => {
|
||||||
|
// -update-begin--author:liaozhiyang---date:20240702---for：【TV360X-1679】系统角色-角色用户再次打开弹窗重置之前选中的状态
|
||||||
|
if (visible) {
|
||||||
|
checkedKeys.value = [];
|
||||||
|
}
|
||||||
|
// -update-end--author:liaozhiyang---date:20240702---for：【TV360X-1679】系统角色-角色用户再次打开弹窗重置之前选中的状态
|
||||||
|
};
|
||||||
|
|
||||||
|
//提交事件
|
||||||
|
function handleSubmit() {
|
||||||
|
setModalProps({ confirmLoading: true });
|
||||||
|
//关闭弹窗
|
||||||
|
closeModal();
|
||||||
|
//刷新列表
|
||||||
|
emit('select', toRaw(unref(checkedKeys)));
|
||||||
|
setModalProps({ confirmLoading: false });
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
@ -17,6 +17,10 @@ enum Api {
|
||||||
checkTags='/bizEmployeesInfo/nuBizEmployeesServcieTags/add',
|
checkTags='/bizEmployeesInfo/nuBizEmployeesServcieTags/add',
|
||||||
removeTags = '/bizEmployeesInfo/nuBizEmployeesServcieTags/delete',
|
removeTags = '/bizEmployeesInfo/nuBizEmployeesServcieTags/delete',
|
||||||
getEmployessServiceTags = '/services/serviceTag/serviceTag/getEmployessServiceTags',
|
getEmployessServiceTags = '/services/serviceTag/serviceTag/getEmployessServiceTags',
|
||||||
|
queryTreeListForRole = '/employessPermission/nuAppEmployessPermission/queryTreeList',
|
||||||
|
queryRolePermission = '/employessPermission/nuAppEmployessPermission/queryEmployessPermission',
|
||||||
|
saveRolePermission = '/employessPermission/nuAppEmployessPermission/saveRolePermission',
|
||||||
|
queryDataRule = '/employessPermission/nuAppEmployessPermission/queryDataRule',
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -90,4 +94,27 @@ export const checkTags = (params) => {
|
||||||
export const removeTags = (params) => {
|
export const removeTags = (params) => {
|
||||||
let url = Api.removeTags;
|
let url = Api.removeTags;
|
||||||
return defHttp.delete({ url: url, params }, {joinParamsToUrl: true});
|
return defHttp.delete({ url: url, params }, {joinParamsToUrl: true});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 根据角色查询树信息
|
||||||
|
*/
|
||||||
|
export const queryTreeListForRole = () => defHttp.get({ url: Api.queryTreeListForRole });
|
||||||
|
/**
|
||||||
|
* 查询角色权限
|
||||||
|
*/
|
||||||
|
export const queryRolePermission = (params) => defHttp.get({ url: Api.queryRolePermission, params });
|
||||||
|
/**
|
||||||
|
* 保存角色权限
|
||||||
|
*/
|
||||||
|
export const saveRolePermission = (params) => defHttp.post({ url: Api.saveRolePermission, params });
|
||||||
|
/**
|
||||||
|
* 查询角色数据规则
|
||||||
|
*/
|
||||||
|
export const queryDataRule = (params) =>
|
||||||
|
defHttp.get({ url: `${Api.queryDataRule}/${params.functionId}/${params.roleId}` }, { isTransformResponse: false });
|
||||||
|
/**
|
||||||
|
* 保存角色数据规则
|
||||||
|
*/
|
||||||
|
export const saveDataRule = (params) => defHttp.post({ url: Api.queryDataRule, params });
|
||||||
|
|
@ -98,6 +98,7 @@
|
||||||
<a-menu-item @click="handleEdit(item)">编辑</a-menu-item>
|
<a-menu-item @click="handleEdit(item)">编辑</a-menu-item>
|
||||||
<a-menu-item @click="handleFwbq(item)">服务标签</a-menu-item>
|
<a-menu-item @click="handleFwbq(item)">服务标签</a-menu-item>
|
||||||
<a-menu-item @click="handleFpzh(item)">分配账号</a-menu-item>
|
<a-menu-item @click="handleFpzh(item)">分配账号</a-menu-item>
|
||||||
|
<a-menu-item @click="handlePerssion(item)">分配角色</a-menu-item>
|
||||||
</a-menu>
|
</a-menu>
|
||||||
</template>
|
</template>
|
||||||
</a-dropdown>
|
</a-dropdown>
|
||||||
|
|
@ -125,6 +126,8 @@
|
||||||
<EmployeesServiceTagModal ref="registerServiceTagModal" @success="handleSuccess"></EmployeesServiceTagModal>
|
<EmployeesServiceTagModal ref="registerServiceTagModal" @success="handleSuccess"></EmployeesServiceTagModal>
|
||||||
<!--用户抽屉-->
|
<!--用户抽屉-->
|
||||||
<UserDrawer @register="registerDrawer" @success="handleSuccess" />
|
<UserDrawer @register="registerDrawer" @success="handleSuccess" />
|
||||||
|
<!--角色菜单授权抽屉-->
|
||||||
|
<RolePermissionDrawer @register="rolePermissionDrawer" />
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|
@ -141,8 +144,10 @@ import { Pagination } from 'ant-design-vue';
|
||||||
import { useDrawer } from '/@/components/Drawer';
|
import { useDrawer } from '/@/components/Drawer';
|
||||||
import UserDrawer from '/@/views/system/user/UserDrawer.vue';
|
import UserDrawer from '/@/views/system/user/UserDrawer.vue';
|
||||||
import JInput from "/@/components/Form/src/jeecg/components/JInput.vue";
|
import JInput from "/@/components/Form/src/jeecg/components/JInput.vue";
|
||||||
|
import RolePermissionDrawer from './components/RolePermissionDrawer.vue';
|
||||||
|
|
||||||
|
|
||||||
|
const [rolePermissionDrawer, { openDrawer: openRolePermissionDrawer }] = useDrawer();
|
||||||
const APagination = Pagination;
|
const APagination = Pagination;
|
||||||
//注册drawer
|
//注册drawer
|
||||||
const [registerDrawer, { openDrawer }] = useDrawer();
|
const [registerDrawer, { openDrawer }] = useDrawer();
|
||||||
|
|
@ -167,6 +172,13 @@ const wrapperCol = reactive({
|
||||||
sm: 20,
|
sm: 20,
|
||||||
});
|
});
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 角色授权弹窗
|
||||||
|
*/
|
||||||
|
function handlePerssion(record) {
|
||||||
|
console.log("🚀 ~ handlePerssion ~ record:", record.id)
|
||||||
|
openRolePermissionDrawer(true, { roleId: record.id });
|
||||||
|
}
|
||||||
//当没有员工头像时，默认展示企业logo
|
//当没有员工头像时，默认展示企业logo
|
||||||
function handleHeadPath(headPath) {
|
function handleHeadPath(headPath) {
|
||||||
console.log('headPath--->', headPath);
|
console.log('headPath--->', headPath);
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,301 @@
|
||||||
|
<template>
|
||||||
|
<BasicDrawer v-bind="$attrs" @register="registerDrawer" width="650px" destroyOnClose showFooter>
|
||||||
|
<template #title>
|
||||||
|
角色权限配置
|
||||||
|
<a-dropdown>
|
||||||
|
<Icon icon="ant-design:more-outlined" class="more-icon" />
|
||||||
|
<template #overlay>
|
||||||
|
<a-menu @click="treeMenuClick">
|
||||||
|
<a-menu-item key="checkAll">选择全部</a-menu-item>
|
||||||
|
<a-menu-item key="cancelCheck">取消选择</a-menu-item>
|
||||||
|
<div class="line"></div>
|
||||||
|
<a-menu-item key="openAll">展开全部</a-menu-item>
|
||||||
|
<a-menu-item key="closeAll">折叠全部</a-menu-item>
|
||||||
|
<div class="line"></div>
|
||||||
|
<a-menu-item key="relation">层级关联</a-menu-item>
|
||||||
|
<a-menu-item key="standAlone">层级独立</a-menu-item>
|
||||||
|
</a-menu>
|
||||||
|
</template>
|
||||||
|
</a-dropdown>
|
||||||
|
</template>
|
||||||
|
<BasicTree
|
||||||
|
ref="treeRef"
|
||||||
|
checkable
|
||||||
|
:treeData="treeData"
|
||||||
|
:checkedKeys="checkedKeys"
|
||||||
|
:expandedKeys="expandedKeys"
|
||||||
|
:selectedKeys="selectedKeys"
|
||||||
|
:clickRowToExpand="false"
|
||||||
|
:checkStrictly="true"
|
||||||
|
title="所拥有的的权限"
|
||||||
|
@check="onCheck"
|
||||||
|
@select="onTreeNodeSelect"
|
||||||
|
>
|
||||||
|
<template #title="{ slotTitle, ruleFlag }">
|
||||||
|
{{ slotTitle }}
|
||||||
|
<Icon v-if="ruleFlag" icon="ant-design:align-left-outlined" style="margin-left: 5px; color: red"></Icon>
|
||||||
|
</template>
|
||||||
|
</BasicTree>
|
||||||
|
<!--右下角按钮-->
|
||||||
|
<template #footer>
|
||||||
|
<!-- <PopConfirmButton title="确定放弃编辑？" @confirm="closeDrawer" okText="确定" cancelText="取消"></PopConfirmButton> -->
|
||||||
|
<a-button @click="closeDrawer">取消</a-button>
|
||||||
|
<a-button @click="handleSubmit(false)" type="primary" :loading="loading" ghost style="margin-right: 0.8rem">仅保存</a-button>
|
||||||
|
<a-button @click="handleSubmit(true)" type="primary" :loading="loading">保存并关闭</a-button>
|
||||||
|
</template>
|
||||||
|
</BasicDrawer>
|
||||||
|
</template>
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import { ref, computed, unref, onMounted } from 'vue';
|
||||||
|
import { BasicDrawer, useDrawer, useDrawerInner } from '/@/components/Drawer';
|
||||||
|
import { BasicTree, TreeItem } from '/@/components/Tree';
|
||||||
|
import { PopConfirmButton } from '/@/components/Button';
|
||||||
|
import { queryTreeListForRole, queryRolePermission, saveRolePermission } from '../BizEmployeesInfo.api';
|
||||||
|
import { useI18n } from "/@/hooks/web/useI18n";
|
||||||
|
import { ROLE_AUTH_CONFIG_KEY } from '/@/enums/cacheEnum';
|
||||||
|
const emit = defineEmits(['register']);
|
||||||
|
//树的信息
|
||||||
|
const treeData = ref<TreeItem[]>([]);
|
||||||
|
//树的全部节点信息
|
||||||
|
const allTreeKeys = ref([]);
|
||||||
|
//树的选择节点信息
|
||||||
|
const checkedKeys = ref<any>([]);
|
||||||
|
const defaultCheckedKeys = ref([]);
|
||||||
|
//树的选中的节点信息
|
||||||
|
const selectedKeys = ref([]);
|
||||||
|
const roleId = ref('');
|
||||||
|
//树的实例
|
||||||
|
const treeRef = ref(null);
|
||||||
|
const loading = ref(false);
|
||||||
|
|
||||||
|
//展开折叠的key
|
||||||
|
const expandedKeys = ref<any>([]);
|
||||||
|
//父子节点选中状态是否关联 true不关联，false关联
|
||||||
|
const checkStrictly = ref<boolean>(false);
|
||||||
|
const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
|
||||||
|
await reset();
|
||||||
|
setDrawerProps({ confirmLoading: false, loading: true });
|
||||||
|
roleId.value = data.roleId;
|
||||||
|
//初始化数据
|
||||||
|
const roleResult = await queryTreeListForRole();
|
||||||
|
// update-begin--author:liaozhiyang---date:20240228---for：【QQYUN-8355】角色权限配置的菜单翻译
|
||||||
|
treeData.value = translateTitle(roleResult.treeList);
|
||||||
|
// update-end--author:liaozhiyang---date:20240228---for：【QQYUN-8355】角色权限配置的菜单翻译
|
||||||
|
allTreeKeys.value = roleResult.ids;
|
||||||
|
// update-begin--author:liaozhiyang---date:20240531---for：【TV360X-590】角色授权弹窗操作缓存
|
||||||
|
const localData = localStorage.getItem(ROLE_AUTH_CONFIG_KEY);
|
||||||
|
if (localData) {
|
||||||
|
const obj = JSON.parse(localData);
|
||||||
|
obj.level && treeMenuClick({ key: obj.level });
|
||||||
|
obj.expand && treeMenuClick({ key: obj.expand });
|
||||||
|
} else {
|
||||||
|
expandedKeys.value = roleResult.ids;
|
||||||
|
}
|
||||||
|
// update-end--author:liaozhiyang---date:20240531---for：【TV360X-590】角色授权弹窗操作缓存
|
||||||
|
//初始化角色菜单数据
|
||||||
|
const permResult = await queryRolePermission({ employessId: unref(roleId) });
|
||||||
|
checkedKeys.value = permResult;
|
||||||
|
defaultCheckedKeys.value = permResult;
|
||||||
|
setDrawerProps({ loading: false });
|
||||||
|
});
|
||||||
|
/**
|
||||||
|
* 2024-02-28
|
||||||
|
* liaozhiyang
|
||||||
|
* 翻译菜单名称
|
||||||
|
*/
|
||||||
|
function translateTitle(data) {
|
||||||
|
if (data?.length) {
|
||||||
|
data.forEach((item) => {
|
||||||
|
if (item.slotTitle) {
|
||||||
|
const { t } = useI18n();
|
||||||
|
if (item.slotTitle.includes("t('") && t) {
|
||||||
|
item.slotTitle = new Function('t', `return ${item.slotTitle}`)(t);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if (item.children?.length) {
|
||||||
|
translateTitle(item.children);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
return data;
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 点击选中
|
||||||
|
* 2024-04-26
|
||||||
|
* liaozhiyang
|
||||||
|
*/
|
||||||
|
function onCheck(o, e) {
|
||||||
|
// checkStrictly: true=>层级独立，false=>层级关联.
|
||||||
|
if (checkStrictly.value) {
|
||||||
|
checkedKeys.value = o.checked ? o.checked : o;
|
||||||
|
} else {
|
||||||
|
const keys = getNodeAllKey(e.node, 'children', 'key');
|
||||||
|
if (e.checked) {
|
||||||
|
// 反复操作下可能会有重复的keys，得用new Set去重下
|
||||||
|
checkedKeys.value = [...new Set([...checkedKeys.value, ...keys])];
|
||||||
|
} else {
|
||||||
|
const result = removeMatchingItems(checkedKeys.value, keys);
|
||||||
|
checkedKeys.value = result;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 2024-04-26
|
||||||
|
* liaozhiyang
|
||||||
|
* 删除相匹配数组的项
|
||||||
|
*/
|
||||||
|
function removeMatchingItems(arr1, arr2) {
|
||||||
|
// 使用哈希表记录 arr2 中的元素
|
||||||
|
const hashTable = {};
|
||||||
|
for (const item of arr2) {
|
||||||
|
hashTable[item] = true;
|
||||||
|
}
|
||||||
|
// 使用 filter 方法遍历第一个数组，过滤出不在哈希表中存在的项
|
||||||
|
return arr1.filter((item) => !hashTable[item]);
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 2024-04-26
|
||||||
|
* liaozhiyang
|
||||||
|
* 获取当前节点及以下所有子孙级的key
|
||||||
|
*/
|
||||||
|
function getNodeAllKey(node: any, children: any, key: string) {
|
||||||
|
const result: any = [];
|
||||||
|
result.push(node[key]);
|
||||||
|
const recursion = (data) => {
|
||||||
|
data.forEach((item: any) => {
|
||||||
|
result.push(item[key]);
|
||||||
|
if (item[children]?.length) {
|
||||||
|
recursion(item[children]);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
};
|
||||||
|
node[children]?.length && recursion(node[children]);
|
||||||
|
return result;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 选中节点，打开数据权限抽屉
|
||||||
|
*/
|
||||||
|
function onTreeNodeSelect(key) {
|
||||||
|
if (key && key.length > 0) {
|
||||||
|
selectedKeys.value = key;
|
||||||
|
}
|
||||||
|
// openDataRuleDrawer(true, { functionId: unref(selectedKeys)[0], roleId: unref(roleId) });
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 数据重置
|
||||||
|
*/
|
||||||
|
function reset() {
|
||||||
|
treeData.value = [];
|
||||||
|
allTreeKeys.value = [];
|
||||||
|
checkedKeys.value = [];
|
||||||
|
defaultCheckedKeys.value = [];
|
||||||
|
selectedKeys.value = [];
|
||||||
|
roleId.value = '';
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 获取tree实例
|
||||||
|
*/
|
||||||
|
function getTree() {
|
||||||
|
const tree = unref(treeRef);
|
||||||
|
if (!tree) {
|
||||||
|
throw new Error('tree is null!');
|
||||||
|
}
|
||||||
|
return tree;
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 提交
|
||||||
|
*/
|
||||||
|
async function handleSubmit(exit) {
|
||||||
|
let params = {
|
||||||
|
roleId: unref(roleId),
|
||||||
|
permissionIds: unref(getTree().getCheckedKeys()).join(','),
|
||||||
|
lastpermissionIds: unref(defaultCheckedKeys).join(','),
|
||||||
|
};
|
||||||
|
//update-begin-author:taoyan date:2023-2-11 for: issues/352 VUE角色授权重复保存
|
||||||
|
if(loading.value===false){
|
||||||
|
await doSave(params)
|
||||||
|
}else{
|
||||||
|
console.log('请等待上次执行完毕!');
|
||||||
|
}
|
||||||
|
if(exit){
|
||||||
|
// 如果关闭
|
||||||
|
closeDrawer();
|
||||||
|
}else{
|
||||||
|
// 没有关闭需要重新获取选中数据
|
||||||
|
const permResult = await queryRolePermission({ employessId: unref(roleId) });
|
||||||
|
defaultCheckedKeys.value = permResult;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// VUE角色授权重复保存 #352
|
||||||
|
async function doSave(params) {
|
||||||
|
loading.value = true;
|
||||||
|
await saveRolePermission(params);
|
||||||
|
setTimeout(()=>{
|
||||||
|
loading.value = false;
|
||||||
|
}, 500)
|
||||||
|
}
|
||||||
|
//update-end-author:taoyan date:2023-2-11 for: issues/352 VUE角色授权重复保存
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 树菜单选择
|
||||||
|
* @param key
|
||||||
|
*/
|
||||||
|
function treeMenuClick({ key }) {
|
||||||
|
if (key === 'checkAll') {
|
||||||
|
checkedKeys.value = allTreeKeys.value;
|
||||||
|
} else if (key === 'cancelCheck') {
|
||||||
|
checkedKeys.value = [];
|
||||||
|
} else if (key === 'openAll') {
|
||||||
|
expandedKeys.value = allTreeKeys.value;
|
||||||
|
saveLocalOperation('expand', 'openAll');
|
||||||
|
} else if (key === 'closeAll') {
|
||||||
|
expandedKeys.value = [];
|
||||||
|
saveLocalOperation('expand', 'closeAll');
|
||||||
|
} else if (key === 'relation') {
|
||||||
|
checkStrictly.value = false;
|
||||||
|
saveLocalOperation('level', 'relation');
|
||||||
|
} else {
|
||||||
|
checkStrictly.value = true;
|
||||||
|
saveLocalOperation('level', 'standAlone');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 2024-05-31
|
||||||
|
* liaozhiyang
|
||||||
|
* 【TV360X-590】角色授权弹窗操作缓存
|
||||||
|
* */
|
||||||
|
const saveLocalOperation = (key, value) => {
|
||||||
|
const localData = localStorage.getItem(ROLE_AUTH_CONFIG_KEY);
|
||||||
|
const obj = localData ? JSON.parse(localData) : {};
|
||||||
|
obj[key] = value;
|
||||||
|
localStorage.setItem(ROLE_AUTH_CONFIG_KEY, JSON.stringify(obj))
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="less" scoped>
|
||||||
|
/** 固定操作按钮 */
|
||||||
|
.jeecg-basic-tree {
|
||||||
|
position: absolute;
|
||||||
|
width: 618px;
|
||||||
|
}
|
||||||
|
//update-begin---author:wangshuai ---date:20230202 for：抽屉弹窗标题图标下拉样式------------
|
||||||
|
.line {
|
||||||
|
height: 1px;
|
||||||
|
width: 100%;
|
||||||
|
border-bottom: 1px solid #f0f0f0;
|
||||||
|
}
|
||||||
|
.more-icon {
|
||||||
|
font-size: 20px !important;
|
||||||
|
color: black;
|
||||||
|
display: inline-flex;
|
||||||
|
float: right;
|
||||||
|
margin-right: 2px;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
:deep(.jeecg-tree-header) {
|
||||||
|
border-bottom: none;
|
||||||
|
}
|
||||||
|
//update-end---author:wangshuai ---date:20230202 for：抽屉弹窗标题图标下拉样式------------
|
||||||
|
</style>
|
||||||
|
|
@ -8,6 +8,10 @@ enum Api {
|
||||||
importExcel = '/nuBaseInfo/nuBaseInfo/importExcel',
|
importExcel = '/nuBaseInfo/nuBaseInfo/importExcel',
|
||||||
exportXls = '/nuBaseInfo/nuBaseInfo/exportXls',
|
exportXls = '/nuBaseInfo/nuBaseInfo/exportXls',
|
||||||
qyList = '/nuBaseInfo/nuBaseInfo/qyList',
|
qyList = '/nuBaseInfo/nuBaseInfo/qyList',
|
||||||
|
queryTreeListForRole = '/nuidPermission/nuAppNuidPermission/queryTreeList',
|
||||||
|
queryRolePermission = '/nuidPermission/nuAppNuidPermission/queryNuidPermission',
|
||||||
|
saveRolePermission = '/nuidPermission/nuAppNuidPermission/saveRolePermission',
|
||||||
|
queryDataRule = '/nuidPermission/nuAppNuidPermission/queryDataRule',
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|
@ -37,3 +41,26 @@ export const saveOrUpdate = (params, isUpdate) => {
|
||||||
let url = isUpdate ? Api.edit : Api.save;
|
let url = isUpdate ? Api.edit : Api.save;
|
||||||
return defHttp.post({ url: url, params }, { isTransformResponse: false });
|
return defHttp.post({ url: url, params }, { isTransformResponse: false });
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 根据角色查询树信息
|
||||||
|
*/
|
||||||
|
export const queryTreeListForRole = () => defHttp.get({ url: Api.queryTreeListForRole });
|
||||||
|
/**
|
||||||
|
* 查询角色权限
|
||||||
|
*/
|
||||||
|
export const queryRolePermission = (params) => defHttp.get({ url: Api.queryRolePermission, params });
|
||||||
|
/**
|
||||||
|
* 保存角色权限
|
||||||
|
*/
|
||||||
|
export const saveRolePermission = (params) => defHttp.post({ url: Api.saveRolePermission, params });
|
||||||
|
/**
|
||||||
|
* 查询角色数据规则
|
||||||
|
*/
|
||||||
|
export const queryDataRule = (params) =>
|
||||||
|
defHttp.get({ url: `${Api.queryDataRule}/${params.functionId}/${params.roleId}` }, { isTransformResponse: false });
|
||||||
|
/**
|
||||||
|
* 保存角色数据规则
|
||||||
|
*/
|
||||||
|
export const saveDataRule = (params) => defHttp.post({ url: Api.queryDataRule, params });
|
||||||
|
|
@ -81,6 +81,7 @@
|
||||||
</template>
|
</template>
|
||||||
<a-button type="dashed" size="small" style="margin-left:10px">二维码</a-button>
|
<a-button type="dashed" size="small" style="margin-left:10px">二维码</a-button>
|
||||||
</a-popover>
|
</a-popover>
|
||||||
|
<a-button type="dashed" size="small" @click="handlePerssion(item)" style="margin-left:10px" >外挂</a-button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div style="float:right;margin-top: 20px;">
|
<div style="float:right;margin-top: 20px;">
|
||||||
|
|
@ -99,6 +100,8 @@
|
||||||
<NuBaseInfoModal ref="registerModal" @success="handleSuccess"></NuBaseInfoModal>
|
<NuBaseInfoModal ref="registerModal" @success="handleSuccess"></NuBaseInfoModal>
|
||||||
<BaseWlsbListModal ref="wlsbModal" ></BaseWlsbListModal>
|
<BaseWlsbListModal ref="wlsbModal" ></BaseWlsbListModal>
|
||||||
<CameraPreviewModal ref="previewModal"></CameraPreviewModal>
|
<CameraPreviewModal ref="previewModal"></CameraPreviewModal>
|
||||||
|
<!--角色菜单授权抽屉-->
|
||||||
|
<RolePermissionDrawer @register="rolePermissionDrawer" />
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|
@ -119,6 +122,11 @@ import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectT
|
||||||
import { useMessage } from '/@/hooks/web/useMessage';
|
import { useMessage } from '/@/hooks/web/useMessage';
|
||||||
import QRCodeWithLogo from './EwmImage.vue';
|
import QRCodeWithLogo from './EwmImage.vue';
|
||||||
import { defHttp } from '/@/utils/http/axios';
|
import { defHttp } from '/@/utils/http/axios';
|
||||||
|
import { useDrawer } from '/@/components/Drawer';
|
||||||
|
import RolePermissionDrawer from './components/RolePermissionDrawer.vue';
|
||||||
|
|
||||||
|
|
||||||
|
const [rolePermissionDrawer, { openDrawer: openRolePermissionDrawer }] = useDrawer();
|
||||||
|
|
||||||
const logoUrl = 'https://www.focusnu.com/devops/resource/img/logo.png'; // 替换为你的 Logo URL
|
const logoUrl = 'https://www.focusnu.com/devops/resource/img/logo.png'; // 替换为你的 Logo URL
|
||||||
|
|
||||||
|
|
@ -143,6 +151,13 @@ const { createMessage } = useMessage();
|
||||||
sm: 18,
|
sm: 18,
|
||||||
});
|
});
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 角色授权弹窗
|
||||||
|
*/
|
||||||
|
function handlePerssion(record) {
|
||||||
|
console.log("🚀 ~ handlePerssion ~ record:", record.nuId)
|
||||||
|
openRolePermissionDrawer(true, { roleId: record.nuId });
|
||||||
|
}
|
||||||
//查看物联设备
|
//查看物联设备
|
||||||
function handleWlsb(record) {
|
function handleWlsb(record) {
|
||||||
wlsbModal.value.disableSubmit = true;
|
wlsbModal.value.disableSubmit = true;
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,301 @@
|
||||||
|
<template>
|
||||||
|
<BasicDrawer v-bind="$attrs" @register="registerDrawer" width="650px" destroyOnClose showFooter>
|
||||||
|
<template #title>
|
||||||
|
角色权限配置
|
||||||
|
<a-dropdown>
|
||||||
|
<Icon icon="ant-design:more-outlined" class="more-icon" />
|
||||||
|
<template #overlay>
|
||||||
|
<a-menu @click="treeMenuClick">
|
||||||
|
<a-menu-item key="checkAll">选择全部</a-menu-item>
|
||||||
|
<a-menu-item key="cancelCheck">取消选择</a-menu-item>
|
||||||
|
<div class="line"></div>
|
||||||
|
<a-menu-item key="openAll">展开全部</a-menu-item>
|
||||||
|
<a-menu-item key="closeAll">折叠全部</a-menu-item>
|
||||||
|
<div class="line"></div>
|
||||||
|
<a-menu-item key="relation">层级关联</a-menu-item>
|
||||||
|
<a-menu-item key="standAlone">层级独立</a-menu-item>
|
||||||
|
</a-menu>
|
||||||
|
</template>
|
||||||
|
</a-dropdown>
|
||||||
|
</template>
|
||||||
|
<BasicTree
|
||||||
|
ref="treeRef"
|
||||||
|
checkable
|
||||||
|
:treeData="treeData"
|
||||||
|
:checkedKeys="checkedKeys"
|
||||||
|
:expandedKeys="expandedKeys"
|
||||||
|
:selectedKeys="selectedKeys"
|
||||||
|
:clickRowToExpand="false"
|
||||||
|
:checkStrictly="true"
|
||||||
|
title="所拥有的的权限"
|
||||||
|
@check="onCheck"
|
||||||
|
@select="onTreeNodeSelect"
|
||||||
|
>
|
||||||
|
<template #title="{ slotTitle, ruleFlag }">
|
||||||
|
{{ slotTitle }}
|
||||||
|
<Icon v-if="ruleFlag" icon="ant-design:align-left-outlined" style="margin-left: 5px; color: red"></Icon>
|
||||||
|
</template>
|
||||||
|
</BasicTree>
|
||||||
|
<!--右下角按钮-->
|
||||||
|
<template #footer>
|
||||||
|
<!-- <PopConfirmButton title="确定放弃编辑？" @confirm="closeDrawer" okText="确定" cancelText="取消"></PopConfirmButton> -->
|
||||||
|
<a-button @click="closeDrawer">取消</a-button>
|
||||||
|
<a-button @click="handleSubmit(false)" type="primary" :loading="loading" ghost style="margin-right: 0.8rem">仅保存</a-button>
|
||||||
|
<a-button @click="handleSubmit(true)" type="primary" :loading="loading">保存并关闭</a-button>
|
||||||
|
</template>
|
||||||
|
</BasicDrawer>
|
||||||
|
</template>
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import { ref, computed, unref, onMounted } from 'vue';
|
||||||
|
import { BasicDrawer, useDrawer, useDrawerInner } from '/@/components/Drawer';
|
||||||
|
import { BasicTree, TreeItem } from '/@/components/Tree';
|
||||||
|
import { PopConfirmButton } from '/@/components/Button';
|
||||||
|
import { queryTreeListForRole, queryRolePermission, saveRolePermission } from '../NuBaseInfo.api';
|
||||||
|
import { useI18n } from "/@/hooks/web/useI18n";
|
||||||
|
import { ROLE_AUTH_CONFIG_KEY } from '/@/enums/cacheEnum';
|
||||||
|
const emit = defineEmits(['register']);
|
||||||
|
//树的信息
|
||||||
|
const treeData = ref<TreeItem[]>([]);
|
||||||
|
//树的全部节点信息
|
||||||
|
const allTreeKeys = ref([]);
|
||||||
|
//树的选择节点信息
|
||||||
|
const checkedKeys = ref<any>([]);
|
||||||
|
const defaultCheckedKeys = ref([]);
|
||||||
|
//树的选中的节点信息
|
||||||
|
const selectedKeys = ref([]);
|
||||||
|
const roleId = ref('');
|
||||||
|
//树的实例
|
||||||
|
const treeRef = ref(null);
|
||||||
|
const loading = ref(false);
|
||||||
|
|
||||||
|
//展开折叠的key
|
||||||
|
const expandedKeys = ref<any>([]);
|
||||||
|
//父子节点选中状态是否关联 true不关联，false关联
|
||||||
|
const checkStrictly = ref<boolean>(false);
|
||||||
|
const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
|
||||||
|
await reset();
|
||||||
|
setDrawerProps({ confirmLoading: false, loading: true });
|
||||||
|
roleId.value = data.roleId;
|
||||||
|
//初始化数据
|
||||||
|
const roleResult = await queryTreeListForRole();
|
||||||
|
// update-begin--author:liaozhiyang---date:20240228---for：【QQYUN-8355】角色权限配置的菜单翻译
|
||||||
|
treeData.value = translateTitle(roleResult.treeList);
|
||||||
|
// update-end--author:liaozhiyang---date:20240228---for：【QQYUN-8355】角色权限配置的菜单翻译
|
||||||
|
allTreeKeys.value = roleResult.ids;
|
||||||
|
// update-begin--author:liaozhiyang---date:20240531---for：【TV360X-590】角色授权弹窗操作缓存
|
||||||
|
const localData = localStorage.getItem(ROLE_AUTH_CONFIG_KEY);
|
||||||
|
if (localData) {
|
||||||
|
const obj = JSON.parse(localData);
|
||||||
|
obj.level && treeMenuClick({ key: obj.level });
|
||||||
|
obj.expand && treeMenuClick({ key: obj.expand });
|
||||||
|
} else {
|
||||||
|
expandedKeys.value = roleResult.ids;
|
||||||
|
}
|
||||||
|
// update-end--author:liaozhiyang---date:20240531---for：【TV360X-590】角色授权弹窗操作缓存
|
||||||
|
//初始化角色菜单数据
|
||||||
|
const permResult = await queryRolePermission({ nuId: unref(roleId) });
|
||||||
|
checkedKeys.value = permResult;
|
||||||
|
defaultCheckedKeys.value = permResult;
|
||||||
|
setDrawerProps({ loading: false });
|
||||||
|
});
|
||||||
|
/**
|
||||||
|
* 2024-02-28
|
||||||
|
* liaozhiyang
|
||||||
|
* 翻译菜单名称
|
||||||
|
*/
|
||||||
|
function translateTitle(data) {
|
||||||
|
if (data?.length) {
|
||||||
|
data.forEach((item) => {
|
||||||
|
if (item.slotTitle) {
|
||||||
|
const { t } = useI18n();
|
||||||
|
if (item.slotTitle.includes("t('") && t) {
|
||||||
|
item.slotTitle = new Function('t', `return ${item.slotTitle}`)(t);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if (item.children?.length) {
|
||||||
|
translateTitle(item.children);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
return data;
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 点击选中
|
||||||
|
* 2024-04-26
|
||||||
|
* liaozhiyang
|
||||||
|
*/
|
||||||
|
function onCheck(o, e) {
|
||||||
|
// checkStrictly: true=>层级独立，false=>层级关联.
|
||||||
|
if (checkStrictly.value) {
|
||||||
|
checkedKeys.value = o.checked ? o.checked : o;
|
||||||
|
} else {
|
||||||
|
const keys = getNodeAllKey(e.node, 'children', 'key');
|
||||||
|
if (e.checked) {
|
||||||
|
// 反复操作下可能会有重复的keys，得用new Set去重下
|
||||||
|
checkedKeys.value = [...new Set([...checkedKeys.value, ...keys])];
|
||||||
|
} else {
|
||||||
|
const result = removeMatchingItems(checkedKeys.value, keys);
|
||||||
|
checkedKeys.value = result;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 2024-04-26
|
||||||
|
* liaozhiyang
|
||||||
|
* 删除相匹配数组的项
|
||||||
|
*/
|
||||||
|
function removeMatchingItems(arr1, arr2) {
|
||||||
|
// 使用哈希表记录 arr2 中的元素
|
||||||
|
const hashTable = {};
|
||||||
|
for (const item of arr2) {
|
||||||
|
hashTable[item] = true;
|
||||||
|
}
|
||||||
|
// 使用 filter 方法遍历第一个数组，过滤出不在哈希表中存在的项
|
||||||
|
return arr1.filter((item) => !hashTable[item]);
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 2024-04-26
|
||||||
|
* liaozhiyang
|
||||||
|
* 获取当前节点及以下所有子孙级的key
|
||||||
|
*/
|
||||||
|
function getNodeAllKey(node: any, children: any, key: string) {
|
||||||
|
const result: any = [];
|
||||||
|
result.push(node[key]);
|
||||||
|
const recursion = (data) => {
|
||||||
|
data.forEach((item: any) => {
|
||||||
|
result.push(item[key]);
|
||||||
|
if (item[children]?.length) {
|
||||||
|
recursion(item[children]);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
};
|
||||||
|
node[children]?.length && recursion(node[children]);
|
||||||
|
return result;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 选中节点，打开数据权限抽屉
|
||||||
|
*/
|
||||||
|
function onTreeNodeSelect(key) {
|
||||||
|
if (key && key.length > 0) {
|
||||||
|
selectedKeys.value = key;
|
||||||
|
}
|
||||||
|
// openDataRuleDrawer(true, { functionId: unref(selectedKeys)[0], roleId: unref(roleId) });
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 数据重置
|
||||||
|
*/
|
||||||
|
function reset() {
|
||||||
|
treeData.value = [];
|
||||||
|
allTreeKeys.value = [];
|
||||||
|
checkedKeys.value = [];
|
||||||
|
defaultCheckedKeys.value = [];
|
||||||
|
selectedKeys.value = [];
|
||||||
|
roleId.value = '';
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 获取tree实例
|
||||||
|
*/
|
||||||
|
function getTree() {
|
||||||
|
const tree = unref(treeRef);
|
||||||
|
if (!tree) {
|
||||||
|
throw new Error('tree is null!');
|
||||||
|
}
|
||||||
|
return tree;
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 提交
|
||||||
|
*/
|
||||||
|
async function handleSubmit(exit) {
|
||||||
|
let params = {
|
||||||
|
roleId: unref(roleId),
|
||||||
|
permissionIds: unref(getTree().getCheckedKeys()).join(','),
|
||||||
|
lastpermissionIds: unref(defaultCheckedKeys).join(','),
|
||||||
|
};
|
||||||
|
//update-begin-author:taoyan date:2023-2-11 for: issues/352 VUE角色授权重复保存
|
||||||
|
if(loading.value===false){
|
||||||
|
await doSave(params)
|
||||||
|
}else{
|
||||||
|
console.log('请等待上次执行完毕!');
|
||||||
|
}
|
||||||
|
if(exit){
|
||||||
|
// 如果关闭
|
||||||
|
closeDrawer();
|
||||||
|
}else{
|
||||||
|
// 没有关闭需要重新获取选中数据
|
||||||
|
const permResult = await queryRolePermission({ nuId: unref(roleId) });
|
||||||
|
defaultCheckedKeys.value = permResult;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// VUE角色授权重复保存 #352
|
||||||
|
async function doSave(params) {
|
||||||
|
loading.value = true;
|
||||||
|
await saveRolePermission(params);
|
||||||
|
setTimeout(()=>{
|
||||||
|
loading.value = false;
|
||||||
|
}, 500)
|
||||||
|
}
|
||||||
|
//update-end-author:taoyan date:2023-2-11 for: issues/352 VUE角色授权重复保存
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 树菜单选择
|
||||||
|
* @param key
|
||||||
|
*/
|
||||||
|
function treeMenuClick({ key }) {
|
||||||
|
if (key === 'checkAll') {
|
||||||
|
checkedKeys.value = allTreeKeys.value;
|
||||||
|
} else if (key === 'cancelCheck') {
|
||||||
|
checkedKeys.value = [];
|
||||||
|
} else if (key === 'openAll') {
|
||||||
|
expandedKeys.value = allTreeKeys.value;
|
||||||
|
saveLocalOperation('expand', 'openAll');
|
||||||
|
} else if (key === 'closeAll') {
|
||||||
|
expandedKeys.value = [];
|
||||||
|
saveLocalOperation('expand', 'closeAll');
|
||||||
|
} else if (key === 'relation') {
|
||||||
|
checkStrictly.value = false;
|
||||||
|
saveLocalOperation('level', 'relation');
|
||||||
|
} else {
|
||||||
|
checkStrictly.value = true;
|
||||||
|
saveLocalOperation('level', 'standAlone');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 2024-05-31
|
||||||
|
* liaozhiyang
|
||||||
|
* 【TV360X-590】角色授权弹窗操作缓存
|
||||||
|
* */
|
||||||
|
const saveLocalOperation = (key, value) => {
|
||||||
|
const localData = localStorage.getItem(ROLE_AUTH_CONFIG_KEY);
|
||||||
|
const obj = localData ? JSON.parse(localData) : {};
|
||||||
|
obj[key] = value;
|
||||||
|
localStorage.setItem(ROLE_AUTH_CONFIG_KEY, JSON.stringify(obj))
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="less" scoped>
|
||||||
|
/** 固定操作按钮 */
|
||||||
|
.jeecg-basic-tree {
|
||||||
|
position: absolute;
|
||||||
|
width: 618px;
|
||||||
|
}
|
||||||
|
//update-begin---author:wangshuai ---date:20230202 for：抽屉弹窗标题图标下拉样式------------
|
||||||
|
.line {
|
||||||
|
height: 1px;
|
||||||
|
width: 100%;
|
||||||
|
border-bottom: 1px solid #f0f0f0;
|
||||||
|
}
|
||||||
|
.more-icon {
|
||||||
|
font-size: 20px !important;
|
||||||
|
color: black;
|
||||||
|
display: inline-flex;
|
||||||
|
float: right;
|
||||||
|
margin-right: 2px;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
:deep(.jeecg-tree-header) {
|
||||||
|
border-bottom: none;
|
||||||
|
}
|
||||||
|
//update-end---author:wangshuai ---date:20230202 for：抽屉弹窗标题图标下拉样式------------
|
||||||
|
</style>
|
||||||
Loading…
Reference in New Issue