【update】角色列表权限控制，部分按钮仅对超级用户开放，隐藏角色设置中的统计页面权限

src/views/platform/org/role/edit.vue

@@ -1,62 +1,62 @@
 <template>
-  <el-dialog
-    :title="title"
-    :visible.sync="dialogVisible"
-    :close-on-click-modal="false"
-    :close-on-press-escape="false"
-    class="ibps-dialog-80"
-    top="5vh"
-    append-to-body
-    @open="getFormData"
-    @close="closeDialog"
-  >
-    <el-form
-      ref="roleForm"
-      v-loading="dialogLoading"
-      :element-loading-text="$t('common.loading')"
-      :model="role"
-      :rules="rules"
-      :label-width="formLabelWidth"
-      @submit.native.prevent
+    <el-dialog
+        :title="title"
+        :visible.sync="dialogVisible"
+        :close-on-click-modal="false"
+        :close-on-press-escape="false"
+        class="ibps-dialog-80"
+        top="5vh"
+        append-to-body
+        @open="getFormData"
+        @close="closeDialog"
     >
-      <el-form-item label="角色名称:" prop="name">
-        <el-input v-if="!readonly" v-model="role.name" v-pinyin="{vm:role,key:'roleAlias'}" />
-        <span v-else>{{ role.name }}</span>
-      </el-form-item>
-      <el-form-item label="角色别名:" prop="roleAlias">
-        <el-input v-if="!readonly" v-model="role.roleAlias" :disabled="formId!==''" />
-        <span v-else>{{ role.roleAlias }}</span>
-      </el-form-item>
-      <el-form-item label="所属子系统:" prop="subSystemId">
-        <el-select v-if="!readonly" v-model="role.subSystemId" placeholder="请选择" style="width:100%;">
-          <el-option
-            v-for="option in subSystemList"
-            :key="option.id"
-            :label="option.name"
-            :value="option.id"
-          />
-        </el-select>
-        <span v-else>{{ role.subSystemId|optionsFilter(subSystemList,'name','id','所有系统') }} </span>
-      </el-form-item>
+        <el-form
+            ref="roleForm"
+            v-loading="dialogLoading"
+            :element-loading-text="$t('common.loading')"
+            :model="role"
+            :rules="rules"
+            :label-width="formLabelWidth"
+            @submit.native.prevent
+        >
+            <el-form-item label="角色名称:" prop="name">
+                <el-input v-if="!readonly" v-model="role.name" v-pinyin="{vm:role,key:'roleAlias'}" />
+                <span v-else>{{ role.name }}</span>
+            </el-form-item>
+            <el-form-item label="角色别名:" prop="roleAlias">
+                <el-input v-if="!readonly" v-model="role.roleAlias" :disabled="formId!==''" />
+                <span v-else>{{ role.roleAlias }}</span>
+            </el-form-item>
+            <el-form-item label="所属子系统:" prop="subSystemId">
+                <el-select v-if="!readonly" v-model="role.subSystemId" placeholder="请选择" style="width:100%;">
+                    <el-option
+                        v-for="option in subSystemList"
+                        :key="option.id"
+                        :label="option.name"
+                        :value="option.id"
+                    />
+                </el-select>
+                <span v-else>{{ role.subSystemId|optionsFilter(subSystemList,'name','id','所有系统') }} </span>
+            </el-form-item>
 
-      <el-form-item label="描述:" prop="roleNote">
-        <el-input v-if="!readonly" v-model="role.roleNote" :rows="4" type="textarea" />
-        <pre v-else class="ibps-m-0">{{ role.roleNote }}</pre>
-      </el-form-item>
+            <el-form-item label="描述:" prop="roleNote">
+                <el-input v-if="!readonly" v-model="role.roleNote" :rows="4" type="textarea" />
+                <pre v-else class="ibps-m-0">{{ role.roleNote }}</pre>
+            </el-form-item>
 
-      <el-form-item label="统计页面权限:" prop="roleType">
-        <el-radio v-model="role.roleType" label="主任">主任(全中心)</el-radio>
-        <el-radio v-model="role.roleType" label="负责人">负责人</el-radio>
-        <el-radio v-model="role.roleType" label="普通员工">普通员工</el-radio>
-      </el-form-item>
-    </el-form>
-    <div slot="footer" class="el-dialog--center">
-      <ibps-toolbar
-        :actions="toolbars"
-        @action-event="handleActionEvent"
-      />
-    </div>
-  </el-dialog>
+            <!-- <el-form-item label="统计页面权限:" prop="roleType">
+                <el-radio v-model="role.roleType" label="主任">主任(全中心)</el-radio>
+                <el-radio v-model="role.roleType" label="负责人">负责人</el-radio>
+                <el-radio v-model="role.roleType" label="普通员工">普通员工</el-radio>
+            </el-form-item> -->
+        </el-form>
+        <div slot="footer" class="el-dialog--center">
+            <ibps-toolbar
+                :actions="toolbars"
+                @action-event="handleActionEvent"
+            />
+        </div>
+    </el-dialog>
 </template>
 
 <script>
@@ -67,158 +67,158 @@ import ActionUtils from '@/utils/action'
 import { validateKey, validateEmpty } from '@/utils/validate'
 
 export default {
-  props: {
-    visible: {
-      type: Boolean,
-      default: false
+    props: {
+        visible: {
+            type: Boolean,
+            default: false
+        },
+        readonly: {
+            type: Boolean,
+            default: false
+        },
+        id: String,
+        title: String
     },
-    readonly: {
-      type: Boolean,
-      default: false
-    },
-    id: String,
-    title: String
-  },
-  data() {
-    return {
-      formName: 'roleForm',
-      formLabelWidth: '120px',
-      dialogVisible: this.dialogVisible,
-      dialogLoading: false,
-      subSystemList: [],
-      defaultForm: {},
-      role: {
-        name: '',
-        roleAlias: '',
-        subSystemId: '',
-        roleNote: '',
-        roleType:'普通员工'
-      },
-      rules: {
-        name: [{ required: true, message: this.$t('validate.required') },
-          { validator: validateEmpty, trigger: 'blur' },
-          { min: 1, max: 64, message: '长度不能超过64个字符', trigger: 'blur' }],
-        roleAlias: [{ required: true, validator: validateKey },
-          { min: 1, max: 64, message: '长度不能超过64个字符', trigger: 'blur' }],
-        subSystemId: [{ required: true, message: this.$t('validate.required'), trigger: 'change' }]
-      },
-      toolbars: [
-        { key: 'save', hidden: () => { return this.readonly } },
-        { key: 'cancel' }
-      ]
-    }
-  },
-  computed: {
-    formId() {
-      return this.id
-    }
-  },
-  watch: {
-    visible: {
-      handler: function(val, oldVal) {
-        this.dialogVisible = this.visible
-      },
-      immediate: true
-    },
-    role: {
-      handler: function(val, oldVal) {
-        var pattern = /\s/
-        if (pattern.test(val.name)) {
-          if (pattern.test(val.roleAlias)) {
-            val.roleAlias = ''
-          }
+    data () {
+        return {
+            formName: 'roleForm',
+            formLabelWidth: '120px',
+            dialogVisible: this.dialogVisible,
+            dialogLoading: false,
+            subSystemList: [],
+            defaultForm: {},
+            role: {
+                name: '',
+                roleAlias: '',
+                subSystemId: '',
+                roleNote: '',
+                roleType: '普通员工'
+            },
+            rules: {
+                name: [{ required: true, message: this.$t('validate.required') },
+                    { validator: validateEmpty, trigger: 'blur' },
+                    { min: 1, max: 64, message: '长度不能超过64个字符', trigger: 'blur' }],
+                roleAlias: [{ required: true, validator: validateKey },
+                    { min: 1, max: 64, message: '长度不能超过64个字符', trigger: 'blur' }],
+                subSystemId: [{ required: true, message: this.$t('validate.required'), trigger: 'change' }]
+            },
+            toolbars: [
+                { key: 'save', hidden: () => { return this.readonly } },
+                { key: 'cancel' }
+            ]
         }
-      },
-      deep: true
-    }
-  },
-  created() {
-    this.defaultForm = JSON.parse(JSON.stringify(this.role))
-  },
-  methods: {
-    handleActionEvent({ key }) {
-      switch (key) {
-        case 'save':
-          this.handleSave()
-          break
-        case 'cancel':
-          this.closeDialog()
-          break
-        default:
-          break
-      }
     },
-    loadSubSystemData() {
-      findAllSubsystem().then(response => {
-        this.subSystemList = response.data
-        if (this.$utils.isEmpty(this.formId) &&
-          this.$utils.isNotEmpty(this.subSystemList)) {
-          this.role.subSystemId = this.subSystemList[0].id
+    computed: {
+        formId () {
+            return this.id
         }
-      })
     },
-    // 保存数据
-    handleSave() {
-      this.$refs[this.formName].validate(valid => {
-        if (valid) {
-          this.saveData()
-        } else {
-          ActionUtils.saveErrorMessage()
+    watch: {
+        visible: {
+            handler: function (val, oldVal) {
+                this.dialogVisible = this.visible
+            },
+            immediate: true
+        },
+        role: {
+            handler: function (val, oldVal) {
+                var pattern = /\s/
+                if (pattern.test(val.name)) {
+                    if (pattern.test(val.roleAlias)) {
+                        val.roleAlias = ''
+                    }
+                }
+            },
+            deep: true
         }
-      })
     },
-    // 提交保存数据
-    saveData() {
-      save(this.role).then(response => {
-        this.$emit('callback', this)
-        ActionUtils.saveSuccessMessage(response.message, (rtn) => {
-          if (this.$utils.isEmpty(this.formId)) {
-            this.$refs[this.formName].resetFields()
-          }
-          if (rtn) {
-            this.closeDialog()
-          }
-        })
-      }).catch((err) => {
-        console.error(err)
-      })
-    },
-    // 关闭当前窗口
-    closeDialog() {
-      this.$emit('close', false)
-      this.$refs[this.formName].resetFields()
-    },
-    /**
-     * 表单验证
-     */
-    formValidate() {
-      if (this.readonly) return
-      this.$nextTick(() => {
-        this.$refs[this.formName].validate(() => {})
-      })
+    created () {
+        this.defaultForm = JSON.parse(JSON.stringify(this.role))
     },
-    /**
-     * 获取表单数据
-     */
-    getFormData() {
-      this.loadSubSystemData()
-      if (this.$utils.isEmpty(this.formId)) {
-        // 重置表单
-        this.role = JSON.parse(JSON.stringify(this.defaultForm))
-        this.formValidate()
-        return
-      }
-      this.dialogLoading = true
-      get({
-        roleId: this.formId
-      }).then(response => {
-        this.role = response.data
-        this.role.subSystemId = response.variables.systemId
-        this.dialogLoading = false
-      }).catch(() => {
-        this.dialogLoading = false
-      })
+    methods: {
+        handleActionEvent ({ key }) {
+            switch (key) {
+                case 'save':
+                    this.handleSave()
+                    break
+                case 'cancel':
+                    this.closeDialog()
+                    break
+                default:
+                    break
+            }
+        },
+        loadSubSystemData () {
+            findAllSubsystem().then(response => {
+                this.subSystemList = response.data
+                if (this.$utils.isEmpty(this.formId) &&
+          this.$utils.isNotEmpty(this.subSystemList)) {
+                    this.role.subSystemId = this.subSystemList[0].id
+                }
+            })
+        },
+        // 保存数据
+        handleSave () {
+            this.$refs[this.formName].validate(valid => {
+                if (valid) {
+                    this.saveData()
+                } else {
+                    ActionUtils.saveErrorMessage()
+                }
+            })
+        },
+        // 提交保存数据
+        saveData () {
+            save(this.role).then(response => {
+                this.$emit('callback', this)
+                ActionUtils.saveSuccessMessage(response.message, (rtn) => {
+                    if (this.$utils.isEmpty(this.formId)) {
+                        this.$refs[this.formName].resetFields()
+                    }
+                    if (rtn) {
+                        this.closeDialog()
+                    }
+                })
+            }).catch((err) => {
+                console.error(err)
+            })
+        },
+        // 关闭当前窗口
+        closeDialog () {
+            this.$emit('close', false)
+            this.$refs[this.formName].resetFields()
+        },
+        /**
+         * 表单验证
+         */
+        formValidate () {
+            if (this.readonly) return
+            this.$nextTick(() => {
+                this.$refs[this.formName].validate(() => {})
+            })
+        },
+        /**
+         * 获取表单数据
+         */
+        getFormData () {
+            this.loadSubSystemData()
+            if (this.$utils.isEmpty(this.formId)) {
+                // 重置表单
+                this.role = JSON.parse(JSON.stringify(this.defaultForm))
+                this.formValidate()
+                return
+            }
+            this.dialogLoading = true
+            get({
+                roleId: this.formId
+            }).then(response => {
+                this.role = response.data
+                this.role.subSystemId = response.variables.systemId
+                this.dialogLoading = false
+            }).catch(() => {
+                this.dialogLoading = false
+            })
+        }
     }
-  }
 }
 </script>

src/views/platform/org/role/list.vue

@@ -80,6 +80,7 @@ export default {
     },
     mixins: [FixHeight],
     data () {
+        const { isSuper = false } = this.$store.getters
         return {
             dialogFormVisible: false, // 弹窗
             editId: '', // 编辑dialog需要使用
@@ -109,7 +110,10 @@ export default {
                     }, {
                         key: 'edit'
                     }, {
-                        key: 'remove'
+                        key: 'remove',
+                        hidden () {
+                            return !isSuper
+                        }
                     }
                 ],
                 searchForm: {
@@ -137,7 +141,10 @@ export default {
                     actions: [{
                         key: 'copy',
                         label: '复制',
-                        icon: 'ibps-icon-copy'
+                        icon: 'ibps-icon-copy',
+                        hidden () {
+                            return !isSuper
+                        }
                     }, {
                         key: 'userList',
                         label: '人员列表',
@@ -149,13 +156,22 @@ export default {
                     }, {
                         key: 'appAssignResource',
                         label: 'App资源分配',
-                        icon: 'ibps-icon-dashboard'
+                        icon: 'ibps-icon-dashboard',
+                        hidden () {
+                            return !isSuper
+                        }
                     }, {
                         key: 'authApiGrant',
                         label: '接口授权',
-                        icon: 'ibps-icon-ticket'
+                        icon: 'ibps-icon-ticket',
+                        hidden () {
+                            return !isSuper
+                        }
                     }, {
-                        key: 'remove'
+                        key: 'remove',
+                        hidden () {
+                            return !isSuper
+                        }
                     }, {
                         key: 'detail'
                     }, {