index.vue
2.1 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
<script setup lang="ts">
import { useRouteQuery } from '@vueuse/router';
import ConfigTable from '@/views/operation/broker/components/config-table.vue';
import UserTable from '@/views/operation/broker/components/user-table.vue';
import PushLevelTable from '@/views/operation/broker/components/push-level-table.vue';
import PushMatchTable from '@/views/operation/broker/components/push-match-table.vue';
import usePermission from '@/hooks/permission';
import { computed } from 'vue';
import { isArray } from '@/utils/is';
const checkPermission = (permission: string | string[]): boolean => {
permission = isArray(permission) ? permission.map((item) => `operation-broker-${item}`) : `operation-broker-${permission}`;
return usePermission().checkPermission(permission);
};
const hasPermission = computed(() => checkPermission(['user-config', 'push-config', 'level-record', 'confirm-record']));
const tabKeys = computed(() => {
const list = ['user-config', 'push-config', 'level-record', 'confirm-record'];
return list.filter((item) => checkPermission(item));
});
const tabKey = useRouteQuery('tabKey', tabKeys.value[0] || '');
</script>
<template>
<page-view has-bread has-card>
<a-tabs
v-if="hasPermission"
v-model:active-key="tabKey"
type="rounded"
size="small"
:animation="true"
:justify="true"
:header-padding="false"
:destroy-on-hide="false"
:lazy-load="true"
>
<a-tab-pane v-if="checkPermission('user-config')" key="user-config" title="经纪人配置">
<user-table />
</a-tab-pane>
<a-tab-pane v-if="checkPermission('push-config')" key="push-config" title="推送模版配置">
<config-table />
</a-tab-pane>
<a-tab-pane v-if="checkPermission('level-record')" key="level-record" title="等级通知日志">
<push-level-table />
</a-tab-pane>
<a-tab-pane v-if="checkPermission('confirm-record')" key="confirm-record" title="合作通知日志">
<push-match-table />
</a-tab-pane>
</a-tabs>
</page-view>
</template>
<style scoped lang="less"></style>