公司前后端分离框架权限控制各形式说明

一般开发的系统中包含下面三种权限控制方式，使用权限控制前需导入权限资源且定义permission变量，如下例子：

import * as permission from '../../../../utils/permission'
export default {
  data() {
    return {
      permission: permission
    }
  }
}

1. 组件及标签的现实与隐藏控制。

<i-button size="small" icon="" v-auth="permission.ZNSW_SUB" @click="openAddModel">新增</i-button>

2.列表中操作按钮通过定义指令控制按钮的显示与隐藏。

{
            title: '操作',
            align: 'center',
            width: 130,
            fixed: "right",
            render: (h, params) => {
              return h('div', [
                h('a', {
                  style: {
                    marginRight: "10px"
                  },
                  on: {
                    click: () => {
                      this.$refs.editRef.loadData(params.row.id);
                      this.editModel = true;
                    }
                  },
                  directives: [
                    {
                      name: "auth",
                      value: this.permission.ZNSW_SUB
                    }
                  ]
                }, '修改'),
                h('a', {
                  style: {
                    marginRight: "10px"
                  },
                  on: {
                    click: () => {
                      this.deleteModal = true;
                      this.deleteModel = 0;
                      this.rowIndex = params.index
                    }
                  },
                  directives: [
                    {
                      name: "auth",
                      value: this.permission.ZNSW_SUB
                    }
                  ]
                }, "删除"),
                h('a', {
                  style: {},
                  on: {
                    click: () => {
                      this.$refs.viewRef.loadData(params.row.id);
                      this.detailModal = !this.detailModal
                    }
                  }
                }, '详情'),
              ])
            }
          },

3.具体方法中可以直接通过判断实现。

if (Vue.auth(this, permission.FILE_DIR_OPTION)|| Vue.auth(this, permission.FOLDER_CREATE)) {
}

中宁水务项目定义权限资源有：
export const ZNSW_TEAM = 'znsw:team' 班组操作权限
export const ZNSW_SUB = 'znsw:sub' 子公司操作权限
可以根据实际情况把除检查外的其他录入模块进行权限控制，班组无权限录入与修改，只有子公司有录入权限。实际情况只需配置子公司权限，班组不予分配也就看不到，不用做各种情况判断，可参照教育培训修改。