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

gaoluyang

2 天以前 8151c3253dc287a79914bc08414af17dfb380c96

 src/views/dashboard/analytics/modules/kpi-cards.vue

@@ -8,11 +8,11 @@

import { Col, Row } from 'ant-design-vue';

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

defineOptions({ name: 'DashboardKpiCards' });

const { canNavigate } = useHomeAccess();
const { canSeeMenu } = useHomeAccess();

const props = defineProps<{
  summary: MesHomeApi.Summary;
@@ -63,14 +63,14 @@
<template>
  <Row :gutter="16">
    <!-- 生产订单 -->
    <Col :lg="6" :md="12" :sm="12" :xl="6" :xs="24" class="mb-4">
    <Col v-if="canSeeMenu('MesProWorkOrder')" :lg="6" :md="12" :sm="12" :xl="6" :xs="24" class="mb-4">
      <div
        class="glass-tilt group overflow-hidden rounded-2xl border-0"
        :class="{ 'cursor-pointer': canNavigate('MesProWorkOrder') }"
        :class="{ 'cursor-pointer': canSeeMenu('MesProWorkOrder') }"
        :style="tiltStyle('order')"
        @mousemove="(e: MouseEvent) => onMouseMove(e, 'order')"
        @mouseleave="onMouseLeave('order')"
        @click="canNavigate('MesProWorkOrder') && emit('navigate', 'MesProWorkOrder')"
        @click="canSeeMenu('MesProWorkOrder') && emit('navigate', 'MesProWorkOrder')"
      >
        <div class="relative z-10 flex items-center gap-4 p-5">
          <div class="flex size-12 flex-shrink-0 items-center justify-center rounded-xl bg-gradient-to-br from-blue-500 to-cyan-400 shadow-lg shadow-blue-500/25 transition-transform duration-300 group-hover:scale-110">
@@ -95,14 +95,14 @@
    </Col>

    <!-- 今日产量 -->
    <Col :lg="6" :md="12" :sm="12" :xl="6" :xs="24" class="mb-4">
    <Col v-if="canSeeMenu('MesProFeedback')" :lg="6" :md="12" :sm="12" :xl="6" :xs="24" class="mb-4">
      <div
        class="glass-tilt group overflow-hidden rounded-2xl border-0"
        :class="{ 'cursor-pointer': canNavigate('MesProFeedback') }"
        :class="{ 'cursor-pointer': canSeeMenu('MesProFeedback') }"
        :style="tiltStyle('output')"
        @mousemove="(e: MouseEvent) => onMouseMove(e, 'output')"
        @mouseleave="onMouseLeave('output')"
        @click="canNavigate('MesProFeedback') && emit('navigate', 'MesProFeedback')"
        @click="canSeeMenu('MesProFeedback') && emit('navigate', 'MesProFeedback')"
      >
        <div class="relative z-10 flex items-center gap-4 p-5">
          <div class="flex size-12 flex-shrink-0 items-center justify-center rounded-xl bg-gradient-to-br from-emerald-500 to-green-400 shadow-lg shadow-emerald-500/25 transition-transform duration-300 group-hover:scale-110">
@@ -127,14 +127,14 @@
    </Col>

    <!-- 质量合格率 -->
    <Col :lg="6" :md="12" :sm="12" :xl="6" :xs="24" class="mb-4">
    <Col v-if="canSeeMenu('MesProFeedback')" :lg="6" :md="12" :sm="12" :xl="6" :xs="24" class="mb-4">
      <div
        class="glass-tilt group overflow-hidden rounded-2xl border-0"
        :class="{ 'cursor-pointer': canNavigate('MesQcRecord') }"
        :class="{ 'cursor-pointer': canSeeMenu('MesProFeedback') }"
        :style="tiltStyle('quality')"
        @mousemove="(e: MouseEvent) => onMouseMove(e, 'quality')"
        @mouseleave="onMouseLeave('quality')"
        @click="canNavigate('MesQcRecord') && emit('navigate', 'MesQcRecord')"
        @click="canSeeMenu('MesProFeedback') && emit('navigate', 'MesProFeedback')"
      >
        <div class="relative z-10 flex items-center gap-4 p-5">
          <div class="flex size-12 flex-shrink-0 items-center justify-center rounded-xl bg-gradient-to-br from-orange-500 to-amber-400 shadow-lg shadow-orange-500/25 transition-transform duration-300 group-hover:scale-110">
@@ -161,14 +161,14 @@
    </Col>

    <!-- 设备运行率 -->
    <Col :lg="6" :md="12" :sm="12" :xl="6" :xs="24" class="mb-4">
    <Col v-if="canSeeMenu('MesDvMachinery')" :lg="6" :md="12" :sm="12" :xl="6" :xs="24" class="mb-4">
      <div
        class="glass-tilt group overflow-hidden rounded-2xl border-0"
        :class="{ 'cursor-pointer': canNavigate('MesDvMachinery') }"
        :class="{ 'cursor-pointer': canSeeMenu('MesDvMachinery') }"
        :style="tiltStyle('equip')"
        @mousemove="(e: MouseEvent) => onMouseMove(e, 'equip')"
        @mouseleave="onMouseLeave('equip')"
        @click="canNavigate('MesDvMachinery') && emit('navigate', 'MesDvMachinery')"
        @click="canSeeMenu('MesDvMachinery') && emit('navigate', 'MesDvMachinery')"
      >
        <div class="relative z-10 flex items-center gap-4 p-5">
          <div class="flex size-12 flex-shrink-0 items-center justify-center rounded-xl bg-gradient-to-br from-violet-500 to-purple-400 shadow-lg shadow-violet-500/25 transition-transform duration-300 group-hover:scale-110">