|
@@ -1,18 +1,27 @@
|
|
<template>
|
|
<template>
|
|
<div class="p-4">
|
|
<div class="p-4">
|
|
-
|
|
|
|
- <a-row :class="['p-4', `${prefixCls}--box`]" type="flex" :gutter="10">
|
|
|
|
|
|
+ <a-row :class="['p-4', `${prefixCls}--box`]" type="flex" :gutter="10">
|
|
<a-col :xl="12" :lg="24" :md="24" style="margin-bottom: 10px">
|
|
<a-col :xl="12" :lg="24" :md="24" style="margin-bottom: 10px">
|
|
<div style="height: 100%" :class="[`${prefixCls}`]">
|
|
<div style="height: 100%" :class="[`${prefixCls}`]">
|
|
<a-tabs @change="handleTabChange">
|
|
<a-tabs @change="handleTabChange">
|
|
- <a-tab-pane tab="角色授权" key="role-info" style="position: relative">
|
|
|
|
|
|
+ <a-tab-pane tab="角色授权" key="role-info" style="position: relative">
|
|
<div style="padding: 20px">
|
|
<div style="padding: 20px">
|
|
- <PermissionLeftTable :clickParam="clickParam" @update:clickParam="selectIdUpdate" :appList="appList" @update:appList="appListUpdated" />
|
|
|
|
|
|
+ <PermissionLeftTable
|
|
|
|
+ :clickParam="clickParam"
|
|
|
|
+ @update:clickParam="selectIdUpdate"
|
|
|
|
+ :appList="appList"
|
|
|
|
+ @update:appList="appListUpdated"
|
|
|
|
+ />
|
|
</div>
|
|
</div>
|
|
</a-tab-pane>
|
|
</a-tab-pane>
|
|
<a-tab-pane tab="用户授权" key="user-info">
|
|
<a-tab-pane tab="用户授权" key="user-info">
|
|
<div style="padding: 20px">
|
|
<div style="padding: 20px">
|
|
- <PermissionLeftTable :clickParam="clickParam" @update:clickParam="selectIdUpdate" :appList="appList" @update:appList="appListUpdated"/>
|
|
|
|
|
|
+ <PermissionLeftTable
|
|
|
|
+ :clickParam="clickParam"
|
|
|
|
+ @update:clickParam="selectIdUpdate"
|
|
|
|
+ :appList="appList"
|
|
|
|
+ @update:appList="appListUpdated"
|
|
|
|
+ />
|
|
</div>
|
|
</div>
|
|
</a-tab-pane>
|
|
</a-tab-pane>
|
|
</a-tabs>
|
|
</a-tabs>
|
|
@@ -21,19 +30,16 @@
|
|
<a-col :xl="12" :lg="24" :md="24" style="margin-bottom: 10px">
|
|
<a-col :xl="12" :lg="24" :md="24" style="margin-bottom: 10px">
|
|
<div style="height: 100%" :class="[`${prefixCls}`]">
|
|
<div style="height: 100%" :class="[`${prefixCls}`]">
|
|
<div style="padding: 20px">
|
|
<div style="padding: 20px">
|
|
- <AppPermissionTree :clickParam="clickParam" :appList="appList"/>
|
|
|
|
|
|
+ <AppPermissionTree :clickParam="clickParam" :appList="appList" />
|
|
</div>
|
|
</div>
|
|
-
|
|
|
|
</div>
|
|
</div>
|
|
</a-col>
|
|
</a-col>
|
|
</a-row>
|
|
</a-row>
|
|
-
|
|
|
|
-
|
|
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</template>
|
|
|
|
|
|
<script lang="ts" setup name="system-menu-permission">
|
|
<script lang="ts" setup name="system-menu-permission">
|
|
-import { provide, reactive, ref, watch, nextTick, onMounted,onBeforeMount } from 'vue';
|
|
|
|
|
|
+import { provide, reactive, ref, watch, nextTick, onMounted, onBeforeMount } from 'vue';
|
|
import type { SelectProps } from 'ant-design-vue';
|
|
import type { SelectProps } from 'ant-design-vue';
|
|
import { useDesign } from '/@/hooks/web/useDesign';
|
|
import { useDesign } from '/@/hooks/web/useDesign';
|
|
import { appList as getAppList } from '../menu/menu.api';
|
|
import { appList as getAppList } from '../menu/menu.api';
|
|
@@ -42,17 +48,16 @@ import PermissionLeftTable from '../components/PermissionLeftTable.vue';
|
|
|
|
|
|
const { prefixCls } = useDesign('menu-manage');
|
|
const { prefixCls } = useDesign('menu-manage');
|
|
provide('prefixCls', prefixCls);
|
|
provide('prefixCls', prefixCls);
|
|
-// const appList = ref([]);
|
|
|
|
const appList = ref<SelectProps['options']>([]);
|
|
const appList = ref<SelectProps['options']>([]);
|
|
|
|
|
|
//当前选中的条件信息
|
|
//当前选中的条件信息
|
|
-const clickParam = reactive({ appId: '0', tabType: 'role', selectId: '' });
|
|
|
|
|
|
+const clickParam = reactive({ appId: '', tabType: 'role', selectId: '' });
|
|
|
|
|
|
const selectIdUpdate = (newClickParam) => {
|
|
const selectIdUpdate = (newClickParam) => {
|
|
clickParam.selectId = newClickParam.selectId;
|
|
clickParam.selectId = newClickParam.selectId;
|
|
};
|
|
};
|
|
const appListUpdated = (newAppList) => {
|
|
const appListUpdated = (newAppList) => {
|
|
- appList.value = newAppList
|
|
|
|
|
|
+ appList.value = newAppList;
|
|
};
|
|
};
|
|
//切换页签清空树选中
|
|
//切换页签清空树选中
|
|
const handleTabChange = (key: string) => {
|
|
const handleTabChange = (key: string) => {
|
|
@@ -61,30 +66,34 @@ const handleTabChange = (key: string) => {
|
|
} else if (key === 'user-info') {
|
|
} else if (key === 'user-info') {
|
|
clickParam.tabType = 'user'; // 用户授权对应的 tabType
|
|
clickParam.tabType = 'user'; // 用户授权对应的 tabType
|
|
}
|
|
}
|
|
- clickParam.selectId = ''
|
|
|
|
|
|
+ clickParam.selectId = '';
|
|
console.log('切换页签app-----' + clickParam.appId);
|
|
console.log('切换页签app-----' + clickParam.appId);
|
|
};
|
|
};
|
|
|
|
|
|
-// onMounted( async() => {
|
|
|
|
-// await nextTick();
|
|
|
|
-// console.log('appList-----3', appList.value);
|
|
|
|
-// });
|
|
|
|
onBeforeMount(async () => {
|
|
onBeforeMount(async () => {
|
|
- console.log('appList-----1', appList.value);
|
|
|
|
loadApp();
|
|
loadApp();
|
|
});
|
|
});
|
|
async function loadApp() {
|
|
async function loadApp() {
|
|
- const apps = await getAppList();
|
|
|
|
- const appOptions = apps.map(app => {
|
|
|
|
- return {
|
|
|
|
- value: app.id,
|
|
|
|
- label: app.name
|
|
|
|
|
|
+ const apps = await getAppList();
|
|
|
|
+ if (!apps) {
|
|
|
|
+ appList.value = undefined;
|
|
|
|
+ return;
|
|
|
|
+ }
|
|
|
|
+ const appOptions = apps.map((app) => {
|
|
|
|
+ return {
|
|
|
|
+ value: app.id,
|
|
|
|
+ label: app.name,
|
|
};
|
|
};
|
|
-});
|
|
|
|
|
|
+ });
|
|
|
|
+ const hasJCPT = appOptions.some((option) => option.value === '0');
|
|
|
|
+ if (hasJCPT) {
|
|
|
|
+ clickParam.appId = '0';
|
|
|
|
+ } else {
|
|
|
|
+ clickParam.appId = appOptions[0].value;
|
|
|
|
+ }
|
|
|
|
|
|
-appList.value = appOptions;
|
|
|
|
-console.log('appList-----' ,appList.value);
|
|
|
|
-await nextTick();
|
|
|
|
|
|
+ appList.value = appOptions;
|
|
|
|
+ await nextTick();
|
|
}
|
|
}
|
|
</script>
|
|
</script>
|
|
|
|
|