HOS基础开发平台

# 权限控制

# 表单权限

# 配置方法

通过自定义指令 v-has-permi配置表单项权限,此自定义指令接收四个参数：

  • key：权限标识，可以为数组
  • formRule：表单验证规则对象
  • elModel：表单项的字段名称
  • status：当前页面的状态：undefind/add/edit/view
  1. 普通表单：
 <hos-form :model="ruleForm">
      <hos-form-item 
       v-has-permi="{key:'base:activity:add:name'}" label="活动名称" prop="name">
        <hos-input v-model="ruleForm.name"></hos-input>
      </hos-form-item>
 </hos-form>

其中 base:activity:add:name为对应表单项的权限字段。

  1. 有验证规则的表单(即有 :rules="rules")
 <hos-form :model="ruleForm" :rules="rules" >
      <hos-form-item 
       v-has-permi="{key:'base:activity:add:name',formRule:rules,elModel: 'name'}" 
      label="活动名称" prop="name">
        <hos-input v-model="ruleForm.name"></hos-input>
      </hos-form-item>
 </hos-form>

其中 base:activity:add:name为对应表单项的权限字段，formRule为表单的验证规则对象，elModel为对应表单项的验证字段

  1. 表单项受多个权限字段控制
 <hos-form :model="ruleForm" :rules="rules" >
      <hos-form-item v-has-permi="{key:['base:activity:add:date1','base:activity:add:date2'],formRule:rules,elModel: ['date1','date2']}" label="活动时间">
        <hos-col :span="11">
          <hos-form-item v-has-permi="{key:'base:activity:add:date1',formRule:rules,elModel: 'date1'}"  prop="date1">
            <hos-date-picker type="date" placeholder="选择日期" v-model="ruleForm.date1" style="width: 100%;"></hos-date-picker>
          </hos-form-item>
        </hos-col>
        <hos-col class="line" :span="2">-</hos-col>
        <hos-col :span="11">
          <hos-form-item v-has-permi="{key:'base:activity:add:date2',formRule:rules,elModel: 'date2'}" prop="date2">
            <hos-time-picker placeholder="选择时间" v-model="ruleForm.date2" style="width: 100%;"></hos-time-picker>
          </hos-form-item>
        </hos-col>
      </hos-form-item>
 </hos-form>

当受多个权限字段控制时，key为所有控制此表单项的权限字段组成的数组，formRule依旧为表单验证规则对象，elModel为对应验证规则组成的数组。

  1. 控制输入框只读，通过调用 $m.isDisabled(key,status)方法,此方法接收两个参数:
  • key: 权限标识
  • status: 当前页面的状态：undefind/add/edit/view
 <hos-input :disabled="$m.isDisabled('base:activity:add:name')" v-model="ruleForm.name"></hos-input>

# 列表列权限

# 配置方法

列表过滤列,在created方法里调用 <code>this.$m.colAuthFilter </code>，列中加权限标识permiKey。如下：

mounted调用：

 mounted(); {
    this.cols = this.$m.colAuthFilter(this.cols)
  },

 [
        {
          label: "姓名",
          prop: "name",
          align: 'center',
          permiKey:'base:staff:list:name'

        }
]

base:staff:list:name 为列对应的权限字段

← 路由/菜单 →