@rzyuan/hrbac-share

Vue 3 + Element Plus HRBAC 分享抽屉。组件只负责通用分享交互，权限数据读写由业务应用通过 adapter 接入。

安装

npm install @rzyuan/hrbac-share

发布

npm run build
npm publish --access public

发布到公网 npm 前，请确认包内没有内部域名、接口路径、真实人员、空间或权限码。

使用

<template>
  <HrbacShareDrawer
    v-model="visible"
    :resource="{ id: repository.id, name: repository.name }"
    :adapter="adapter"
    resource-label="仓库"
    :readonly="!canManageShare"
    @saved="reload"
  />
</template>

<script setup lang="ts">
import { ref } from 'vue'
import {
  HrbacShareDrawer,
  type HrbacShareAdapter
} from '@rzyuan/hrbac-share'
import '@rzyuan/hrbac-share/style.css'

const visible = ref(false)

const adapter: HrbacShareAdapter = {
  listPermissions(resourceId) {
    return api.listPermissions(resourceId)
  },
  searchSubjects(query) {
    return api.searchShareSubjects(query)
  },
  grantPermission(payload) {
    return api.grantPermission(payload)
  },
  updatePermissionRole(payload) {
    return api.updatePermissionRole(payload)
  },
  revokePermission(payload) {
    return api.revokePermission(payload)
  },
  transferOwner(payload) {
    return api.transferOwner(payload)
  }
}
</script>

resource-label 用于配置当前分享对象的名称，例如代码管理传 仓库，镜像管理可传 镜像。未传时默认使用通用文案 资源。

Adapter 协议

interface HrbacShareAdapter {
  listPermissions(resourceId: string): Promise<HrbacSharePermission[]>
  searchSubjects(query: HrbacShareSubjectQuery): Promise<HrbacShareSubjectOption[]>
  grantPermission(payload: HrbacShareGrantPayload): Promise<void>
  updatePermissionRole(payload: HrbacShareUpdateRolePayload): Promise<void>
  revokePermission(payload: HrbacShareRevokePayload): Promise<void>
  transferOwner?(payload: HrbacShareTransferOwnerPayload): Promise<void>
}

设计边界

• 不包含业务 request、router、Pinia、资源 API。
• 不包含主应用或子应用的内部权限码。
• vue、element-plus 是 peer dependency，由使用方应用提供。
• 业务应用负责后端 HRBAC 表、角色规则和接口校验。