黄兆尉andCursor
c5d5f7a726
下线运营总览幽灵页，补 ExpandKeysForScope / PlatformToMonitor，同步导航与角色配置 UI。 Co-authored-by: Cursor <cursoragent@cursor.com>
44 lines
1.5 KiB
Vue
44 lines
1.5 KiB
Vue
<template>
|
||
<template v-if="visibility === 'interactive'">
|
||
<slot />
|
||
</template>
|
||
<div v-else-if="visibility === 'readonly'" class="pg-readonly" :title="`${widgetId} 当前为只读`">
|
||
<slot />
|
||
<div class="pg-mask" />
|
||
</div>
|
||
<el-empty v-else class="pg-hidden">
|
||
<template #description>
|
||
<p class="pg-hidden-title">当前账号无权查看此功能</p>
|
||
<p class="pg-hidden-hint">控件：{{ widgetId }}。请在「权限与角色」中为该账号开放对应页面后重新登录。</p>
|
||
</template>
|
||
</el-empty>
|
||
</template>
|
||
|
||
<script setup lang="ts">
|
||
import { computed } from 'vue'
|
||
import { useRoute } from 'vue-router'
|
||
import { useAuthStore } from '@/stores/auth'
|
||
|
||
const props = defineProps<{ widgetId: string }>()
|
||
const auth = useAuthStore()
|
||
const route = useRoute()
|
||
|
||
/** 页面已授权则具备该页管理能力，不再被 ConfigCenter 等控件 hidden 整页挡住。 */
|
||
const visibility = computed(() => {
|
||
const name = typeof route.name === 'string' ? route.name : ''
|
||
if (name && auth.hasPage(name)) return 'interactive' as const
|
||
return auth.widgetOf(props.widgetId)
|
||
})
|
||
</script>
|
||
|
||
<style scoped>
|
||
.pg-readonly { position: relative; }
|
||
.pg-mask {
|
||
position: absolute; inset: 0; background: rgba(255, 255, 255, 0.3);
|
||
pointer-events: all; cursor: not-allowed;
|
||
}
|
||
.pg-hidden { padding: 48px 16px; }
|
||
.pg-hidden-title { margin: 0 0 6px; font-size: 14px; color: var(--mg-text-light, #fff); }
|
||
.pg-hidden-hint { margin: 0; font-size: 12px; color: var(--mg-text-muted, rgba(255,255,255,.65)); }
|
||
</style>
|