opt_web/src/components/PermissionButton/index.vue

<script lang="ts" setup>
/**
 * @Name: index.vue
 * @Description: 权限按钮
 * @Author: Cheney
 */
import { ButtonProps } from 'element-plus';
import { BtnPermissionStore } from '/@/plugin/permission/store.permission';

const { data } = BtnPermissionStore();

const attrs = useAttrs() as any;

const props = defineProps<Partial<Omit<ButtonProps, ''>>>();

function hasPermission(permissions: string | string[]): boolean {
  if (typeof permissions === 'string') {
    return data.includes(permissions);
  } else if (Array.isArray(permissions)) {
    return permissions.every(permission => data.includes(permission));
  }
  return false;
}
</script>

<template>
  <div>
    <el-button v-if="attrs.permissions ? hasPermission(attrs.permissions) : true"
               v-bind="props">
      <slot></slot>
    </el-button>
  </div>
</template>

<style scoped>

</style>