refactor(首页): 展示模块跟随菜单权限自动隐藏

gaoluyang

17 小时以前 8a2832d02126f33596c125c855d7effe96d69da1

 src/views/dashboard/analytics/modules/quick-actions.vue

@@ -1,5 +1,9 @@
<script lang="ts" setup>
import { computed } from 'vue';

import { IconifyIcon } from '@vben/icons';

import { useHomeAccess } from '#/utils/use-home-access';

defineOptions({ name: 'DashboardQuickActions' });

@@ -15,19 +19,25 @@
  shadow: string;
}

const { canSeeMenu } = useHomeAccess();

const actions: QuickAction[] = [
  { title: '质检管理', icon: 'lucide:clipboard-check', route: 'MesQcRecord', gradient: 'from-orange-500 to-amber-500', shadow: 'shadow-orange-500/15' },
  { title: '质检管理', icon: 'lucide:clipboard-check', route: 'MesQcIqc', gradient: 'from-orange-500 to-amber-500', shadow: 'shadow-orange-500/15' },
  { title: '设备点检', icon: 'lucide:settings', route: 'MesDvMachinery', gradient: 'from-violet-500 to-purple-500', shadow: 'shadow-violet-500/15' },
  { title: '物料库存', icon: 'lucide:package-search', route: 'WlsMaterialStock', gradient: 'from-indigo-500 to-blue-500', shadow: 'shadow-indigo-500/15' },
  { title: '物料库存', icon: 'lucide:package-search', route: 'MesWmMaterialStock', gradient: 'from-indigo-500 to-blue-500', shadow: 'shadow-indigo-500/15' },
];

const accessibleActions = computed(() =>
  actions.filter((action) => canSeeMenu(action.route)),
);
</script>

<template>
  <div class="glass-card rounded-2xl p-5">
  <div v-if="accessibleActions.length > 0" class="glass-card rounded-2xl p-5">
    <h3 class="mb-4 text-sm font-semibold text-gray-800 dark:text-gray-100">快捷操作</h3>
    <div class="grid grid-cols-4 gap-3 sm:grid-cols-8">
      <div
        v-for="action in actions"
        v-for="action in accessibleActions"
        :key="action.route"
        class="group flex cursor-pointer flex-col items-center gap-2 rounded-xl p-3 transition-all duration-300 hover:-translate-y-1"
        @click="emit('navigate', action.route)"