# 插件描述

扩展角色插件主要用于提供角色功能的应用将角色设置/查看功能呈现在平台的权限设置页面,让用户一体化的设置/查看平台和应用的角色,而不需要在多个页面来回切换。

# 插件规范

Interface Name Description
props role 角色基础信息,格式为{ id : '' , name : ''},角色 id 和 name 均不能为空,插件保存角色时使用
methods saveRole 保存角色的方法,入参为空,包括新建和编辑角色。 async 方法, 返回结果格式为 { code : 1 , errorMsg : ''} , code 是枚举值, 1 表示成功, 0 表示失败, errorMsg 表示失败原因。如果是插件前端填写数据问题,插件负责展示错误信息,不需要在 errorMsg 中传递,平台会提示统一信息 请检查 XXX 应用的角色配置。如果是平台传递的数据问题或者网络、数据库连接等其他接口本身返回的错误,在 errorMsg 中传递,由平台展示。

# 插件发布

在发布实现插件的应用时,在配置文件中增加以下配置(在 Engage Admin 系统操作完成):

  - target:
      # 目标应用 Id,固定为 platform
      application: platform 
      # 插件适配的类型
      type: extend-role
    # 配置页面的组件,格式为:<微前端名>.<组件名>
    widget-component: mfe-minisite.role-setting

# 扩展角色插件示例

<!-- 角色插件 -->
<template>
  <EBlock>
    <EFormItem label="选择数据" label-width="50">
      <EOptionGroup
        v-model="checkedAuthData"
        :options="dataList" multiple />
    </EFormItem>
  </EBlock>
</template>

<script>
import { requestApi } from '@/lib';

export default {
  name: 'ExtendRole',
  props: {
    role: Object,
  },
  data() {
    return {
      checkedAuthData: [],
      dataList: [
        { id: 1, name: '航线1' },
        { id: 1, name: '航线2' },
        { id: 1, name: '航线3' },
        { id: 1, name: '航线4' },
      ],
    };
  },
  async mounted() {
    // 根据角色id获取勾选的数据权限
    this.checkedAuthData = this.getAuthByRoleId(this.role.id);
  },
  methods: {
    // 根据id获取权限数据
    getAuthByRoleId(id) {
      const { role } = requestApi({ url: '/v1/role/query', body: { id } });
      return role.data;
    },
    // 保存角色
    async saveRole() {
      const role = { ...this.role, data: this.checkedAuthData };
      const result = await requestApi({ url: '/v1/role/save', body: role });
      return { code: result.code === 'success' ? 1 : 0, errorMsg: result.errorMsg };
    },
  },
};
</script>