epx-frame 3.5.0-shpgy.1

package/src/frame/components/authorization/PermissRoleAuthorization.vue

@@ -0,0 +1,583 @@
+<template>
+    <div class="container">
+        <div class="list-operates" >
+          <div class="button-group" v-if="$configs.operateFlag && checkRightOperates.length > 0 ">
+            <template v-for="operate in operates">
+              <el-button size="medium" :key="operate.text" :type="buttonUi(operate.ui)" @click="$handler(operate, null)">{{operate.text}}</el-button>
+            </template>
+          </div>
+          <el-input @change="getData(null)" style="width:200px" clearable v-model="searchText" placeholder="请输入对象编号、对象名称"></el-input>
+        </div>
+        <el-table
+            ref="multipleTable"
+            class="list-table no-border"
+            :data="tableData"
+            height="calc(100% - 128px)"
+            rowKey="entityId"
+            @select="selectionChange"
+            @select-all="selectionAll"
+            border
+            >
+            <el-table-column
+              type="selection"
+              width="55"
+              :reserve-selection="true"
+            >
+            </el-table-column>
+            <el-table-column
+                label="对象名称">
+                <template slot-scope="scope">
+                    {{scope.row.entityName}}（{{scope.row.entityCode}}）
+                </template>
+            </el-table-column>
+            <!-- <el-table-column
+                label="对象编号">
+                <template slot-scope="scope">
+
+                </template>
+            </el-table-column> -->
+            <el-table-column
+                label="权限名称">
+                <template slot-scope="scope">
+                  <el-checkbox v-for="api in scope.row.apis" :key="api.apiId" :value="!!selectionList.find(item=>item.apiId===api.apiId)" :label="api.apiId" @change="checkApi( scope.row, api)">{{api.apiLabel}}</el-checkbox>
+                </template>
+            </el-table-column>
+            <el-table-column
+                label="操作"
+                width="150">
+                <template slot-scope="scope">
+                  <div class="column-operates">
+                    <!-- <el-button type="text" @click="settingDataScope(null,scope.row)">范围设置</el-button> -->
+                    <el-button type="text" @click="deleteAuthorizationRole(scope.row)">删除</el-button>
+                  </div>
+                </template>
+            </el-table-column>
+        </el-table>
+        <div class="pagination">
+         <el-pagination
+                  v-loading="loading"
+                  :currentPage="currentPage"
+                  :pageSizes="[5, 10, 15, 20, 30, 50, 100, 200]"
+                  :pageSize="pageSize"
+                  layout="prev, pager, next, jumper, sizes,total"
+                  :total="total"
+                  @size-change="sizeChange"
+                  @current-change="currentChange"
+                >
+        </el-pagination>
+        </div>
+    </div>
+</template>
+<script>
+import List from '@/frame/packages/entity-list'
+export default {
+  name: 'epx-permiss-role-authorization',
+  pageSize: 10,
+  operateEllipsis: 6,
+  extends: List,
+  computed: {
+    dataScope () {
+      return (scope) => {
+        if (scope) {
+          return JSON.parse(scope).scopeText
+        } else {
+          return '/'
+        }
+      }
+    },
+    fieldScope () {
+      return (scope) => {
+        if (scope) {
+          return JSON.parse(scope).fieldNames
+        } else {
+          return '/'
+        }
+      }
+    },
+    selection () {
+      return this.selectionList
+    }
+  },
+  data () {
+    return {
+      tableData: [],
+      searchText: '',
+      selectionList: []
+    }
+  },
+  methods: {
+    search (scopeParams) {
+      if (scopeParams) {
+        this.searchScopeParams = scopeParams
+      }
+    },
+    selectionAll (selection) {
+      if (selection.length === 0) {
+        this.selectionList = []
+      } else {
+        this.selectionList = [...this.tableData]
+      }
+    },
+    selectionChange (selection, row) {
+      const index = selection.findIndex(item => item.entityId === row.entityId)
+      if (index !== -1) {
+        // 删除所有的接口
+        this.selectionList = [...new Set([...this.selectionList, ...row.apis])]
+      } else {
+        row.apis.forEach(api => {
+          const apiIndex = this.selectionList.findIndex(item => item.apiId === api.apiId)
+          if (apiIndex !== -1) this.selectionList.splice(apiIndex, 1)
+        })
+      }
+
+      // 获取对象
+      // this.selection = [...selection]
+      // 选中对象下所有接口
+    },
+    checkApi (row, api) {
+      const index = this.selectionList.findIndex(item => item.apiId === api.apiId)
+      const { apis: entityApis } = row
+      // 如果全选了，或者全取消  取消勾选
+      if (index !== -1) {
+        this.selectionList.splice(index, 1)
+        const flag = entityApis.some(api => !this.selectionList.find(item => item.apiId === api.apiId))
+        if (flag) this.$refs.multipleTable.toggleRowSelection(row, false)
+      } else {
+        this.selectionList.push(api)
+        const flag = entityApis.every(api => this.selectionList.find(item => item.apiId === api.apiId))
+        if (flag) {
+          this.$refs.multipleTable.toggleRowSelection(row, true)
+        }
+      }
+    },
+    // 添加操作接口
+    addApi () {
+      this.$createPage({
+        title: '添加操作权限',
+        component: 'authorization-add-no-api',
+        metaId: this.$metaId,
+        openType: '2',
+        roleId: this.$query.roleId,
+        systemId: this.$query.systemId,
+        systemType: this.$query.systemType
+      })
+    },
+    // 启用
+    startApi () {
+      if (this.selectionList.length === 0) {
+        this.$message.error('请至少选择一个记录')
+        return
+      }
+      const apiRoleIds = this.selectionList.map(item => item.apiRoleId).join(',')
+      const apiAuthStatus = this.selectionList.map(item => item.apiAuthStatus).join(',')
+      if (apiAuthStatus.indexOf('disable') === -1) {
+        this.$message.error('接口已经为全部启用状态')
+        return
+      }
+      this.$confirm('确定启用', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        this.$http.$post({
+          action: 'setRoleApiStatus',
+          entityId: this.$metaId,
+          ids: apiRoleIds,
+          status: 'enable'
+        }).then(() => {
+          this.$refs.multipleTable.clearSelection()
+          this.selectionList = []
+          this.getData()
+          this.$message({
+            type: 'success',
+            message: '操作成功!'
+          })
+        })
+      })
+    },
+    // startApi () {
+    //   if (this.selection.length > 1) {
+    //     this.$message.error('请不要选择多个记录')
+    //     return
+    //   }
+    //   if (this.selection.length === 0) {
+    //     this.$message.error('请选择一个记录')
+    //     return
+    //   }
+    //   const item = this.selection[0]
+    //   if (item.apiAuthStatus === 'enable') {
+    //     this.$message.error('该接口已经启用')
+    //     return
+    //   }
+    //   this.$confirm('确定启用', {
+    //     confirmButtonText: '确定',
+    //     cancelButtonText: '取消',
+    //     type: 'warning'
+    //   }).then(() => {
+    //     this.$http.update({
+    //       entityId: this.$metaId,
+    //       'bean.ID': item.apiRoleId,
+    //       'bean.STATUS': 'enable'
+    //     }).then(() => {
+    //       item.apiAuthStatus = 'enable'
+    //       this.selection.splice(0, 1, item)
+    //       this.getData()
+    //       this.$message({
+    //         type: 'success',
+    //         message: '操作成功!'
+    //       })
+    //     })
+    //   })
+    // },
+    // 停用
+    stopApi () {
+      if (this.selectionList.length === 0) {
+        this.$message.error('请至少选择一个记录')
+        return
+      }
+      const apiRoleIds = this.selectionList.map(item => item.apiRoleId).join(',')
+      const apiAuthStatus = this.selectionList.map(item => item.apiAuthStatus).join(',')
+      if (apiAuthStatus.indexOf('enable') === -1) {
+        this.$message.error('接口已经为全部停用状态')
+        return
+      }
+      this.$confirm('确定停用', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        this.$http.$post({
+          action: 'setRoleApiStatus',
+          entityId: this.$metaId,
+          ids: apiRoleIds,
+          status: 'disable'
+        }).then(() => {
+          this.$refs.multipleTable.clearSelection()
+          this.selectionList = []
+          this.getData()
+          this.$message({
+            type: 'success',
+            message: '操作成功!'
+          })
+        })
+      })
+    },
+    // stopApi () {
+    //   if (this.selection.length > 1) {
+    //     this.$message.error('请不要选择多个记录')
+    //     return
+    //   }
+    //   if (this.selection.length === 0) {
+    //     this.$message.error('请选择一个记录')
+    //     return
+    //   }
+    //   const item = this.selection[0]
+    //   if (item.apiAuthStatus === 'disable') {
+    //     this.$message.error('该接口已经停用')
+    //     return
+    //   }
+    //   this.$confirm('确定停用', {
+    //     confirmButtonText: '确定',
+    //     cancelButtonText: '取消',
+    //     type: 'warning'
+    //   }).then(() => {
+    //     this.$http.update({
+    //       entityId: this.$metaId,
+    //       'bean.ID': item.apiRoleId,
+    //       'bean.STATUS': 'disable'
+    //     }).then(() => {
+    //       item.apiAuthStatus = 'disable'
+    //       this.selection.splice(0, 1, item)
+    //       this.getData()
+    //       this.$message({
+    //         type: 'success',
+    //         message: '操作成功!'
+    //       })
+    //     })
+    //   })
+    // },
+    // 设置数据范围
+    settingDataScope (config, item) {
+      if (!item) {
+        if (this.selectionList.length > 1) {
+          this.$message.error('请不要选择多个记录')
+          return
+        }
+        if (this.selectionList.length === 0) {
+          this.$message.error('请选择一个记录')
+          return
+        }
+        item = this.selectionList[0]
+      }
+      this.$createPage({
+        title: '设置数据范围',
+        component: 'add-role-scope',
+        // metaId: 'FM_ENTITY_RIGHT_ROLE',
+        metaId: this.$metaId,
+        entityId: item.entityId,
+        openType: '2',
+        comType: 'role',
+        id: item.apiRoleId
+      })
+    },
+    // column删除
+    deleteAuthorizationRole (row) {
+      const id = row.apis.map(item => item.apiRoleId).join(',')
+      this.$confirm('确认删除？')
+        .then(() => {
+          this.$http.removeMulti({
+            entityId: this.$metaId,
+            ids: id
+          })
+            .then(() => {
+              this.$message.success('删除成功')
+              this.$refs.multipleTable.clearSelection()
+              this.selectionList = []
+              this.getData()
+            })
+            .catch(err => {
+              this.$message.error(err.message || '删除失败')
+            })
+        })
+        .catch(() => {})
+    },
+    deleteRoleApis () {
+      if (this.selectionList.length === 0) {
+        this.$message.error('请至少选择一个记录')
+        return
+      }
+      const apiRoleIds = this.selectionList.map(item => item.apiRoleId).join(',')
+      this.$confirm('确认删除？')
+        .then(() => {
+          this.$http.removeMulti({
+            entityId: this.$metaId,
+            ids: apiRoleIds
+          })
+            .then(() => {
+              this.$message.success('删除成功')
+              this.$refs.multipleTable.clearSelection()
+              this.selectionList = []
+              this.getData()
+            })
+            .catch(err => {
+              this.$message.error(err.message || '删除失败')
+            })
+        })
+        .catch(() => {})
+    },
+    // 设置字段范围
+    settingFieldScope () {
+      // console.log(this.selection)
+    },
+    getDefaultOperates () {
+      const { editPage, operates, columnOperates } = this.$configs
+      const defaultOperates = [
+        {
+          text: '添加操作接口',
+          handler: 'addApi',
+          ui: 'primary'
+        },
+        // {
+        //   text: '启用',
+        //   handler: 'startApi'
+        // },
+        // {
+        //   text: '停用',
+        //   handler: 'stopApi'
+        // },
+        // {
+        //   text: '设置数据范围',
+        //   handler: 'settingDataScope'
+        // },
+        // {
+        //   text: '设置字段范围',
+        //   handler: 'settingFieldScope'
+        // },
+        {
+          text: '删除',
+          handler: 'deleteRoleApis',
+          action: 'removeMulti',
+          num: 'n',
+          confirmMsg: '确认删除？',
+          successMsg: '删除成功',
+          params: {
+            ids: `#[${this.$metaKey}]`
+          }
+        }
+      ]
+
+      const defaultColumnOperates = [
+        {
+          text: '编辑',
+          handler: 'goPage',
+          num: 1,
+          component: editPage,
+          openMode: '3',
+          params: {
+            callback: '$[getData]'
+          }
+        },
+        {
+          text: '删除',
+          handler: 'commonAction',
+          action: 'removeMulti',
+          num: 'n',
+          confirmMsg: '确认删除？',
+          successMsg: '删除成功',
+          params: {
+            ids: `#[${this.$metaKey}]`
+          }
+        }
+      ]
+      if (!operates) {
+        this.$set(this.$configs, 'operates', defaultOperates)
+      }
+      if (!columnOperates) {
+        this.$set(this.$configs, 'columnOperates', defaultColumnOperates)
+      }
+    },
+    addAuthorization (row) {
+      if (row.apiId) {
+        this.$createPage({
+          flag: 'v_entity_api_authorization',
+          metaId: 'FM_ENTITY_RIGHT',
+          id: row.apiId,
+          pageType: 'DETAIL',
+          entityId: row.entityId
+        })
+      } else {
+        this.$message.error('该对象下没有接口')
+      }
+    },
+    // 合并行
+    objectSpanMethod ({ row, column, rowIndex, columnIndex }) {
+      if (columnIndex <= 1) {
+        if (row.merge && row.apis.length > 0) {
+          return {
+            rowspan: row.apis.length,
+            colspan: 1
+          }
+        } else if (row.merge && row.apis.length === 0) {
+          return {
+            rowspan: 1,
+            colspan: 1
+          }
+        } else {
+          return {
+            rowspan: 0,
+            colspan: 0
+          }
+        }
+      }
+    },
+    // tableRowClassName ({ row, rowIndex }) {
+    //   console.log(rowIndex)
+    //   if (rowIndex % 2 === 0) {
+    //     return 'even-row'
+    //   } else {
+    //     return ''
+    //   }
+    // },
+    getData (current, cb) {
+      // eslint-disable-next-line camelcase
+      let { queryParams = {}, pageFlag, orderFields, order_field: orderField = [], order_mode: orderMode = [], limit } = this.$configs
+      //   const fields = this.listFields.map(item => (item.attriName || item))
+      const params = {
+        action: 'getRoleLocalApiManagement',
+        roleId: this.$query.roleId,
+        entityId: this.$metaId,
+        searchText: this.searchText
+      }
+      if (this.$query.systemType === 'others') {
+        params.action = 'getRoleDesignatedSystemApiManagement'
+        params.systemId = this.$query.systemId
+      }
+      //   if (fields.length > 0) {
+      //     params.columnFieldNames = fields.join('#,') + '#'
+      //   }
+      const functionField = this.listFields.filter(item => {
+        return item.function
+      })
+      let functionList = []
+      if (functionField.length > 0) {
+        functionList = functionField.map(item => ({ dataIndex: item.attriName, function: item.function }))
+        params.fieldFunctions = JSON.stringify(functionList)
+      }
+      if (pageFlag) {
+        params.page = current || this.currentPage
+        params.limit = this.pageSize
+      }
+      if (limit) {
+        params.limit = limit
+      }
+      if (this.scopeParams) {
+        params.scopeParams = JSON.stringify(this.scopeParams)
+      }
+      if (orderFields && orderFields.length > 0) {
+        orderField = orderFields.map(item => item.attriName || item)
+        orderMode = orderFields.map(item => item.sort || 'asc')
+      }
+      if (this.loading) return
+      this.loading = true
+
+      this.$http.list({
+        ...params,
+        ...this.$formatParams(queryParams),
+        ...this.queryParams,
+        ...this.sortParams,
+        order_field: orderField.join(','),
+        order_mode: orderMode.join(',')
+      })
+        .then(data => {
+          this.initData = true
+          this.loading = false
+          if (current) this.currentPage = current
+          // this.data = data.entitys ? [...data.entitys] : []
+          this.tableData = data.entitys
+          // this.data.forEach(element => {
+          //   if (element.apis.length > 0) {
+          //     element.apis.forEach((item, index) => {
+          //       this.tableData.push({ ...item, ...element, merge: index === 0 })
+          //     })
+          //   } else {
+          //     this.tableData.push({ ...element, merge: true })
+          //   }
+          // })
+          this.total = data.total || data.entitys.length
+          this.$bus.emit('refreshCount', { total: this.total, index: this.$query.componentIndex })
+          if (cb) cb(this.data)
+          this.$dispatchPage('listData', [{ total: this.total, entitys: this.data }])
+          this.$emit('listData', { total: this.total, entitys: this.data })
+          if (this.afterData) this.afterData(this.data)
+        })
+        .catch(() => {
+          this.loading = false
+        })
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+.container {
+  height: 100%;
+}
+.list-operates {
+  padding: 16px 0;
+  display: flex;
+  justify-content: space-between;
+}
+.button-group {
+  margin-left: 10px;
+}
+.list-table {
+  &::v-deep {
+    .el-table__row.hover-row>td {
+      background: none
+    }
+  }
+}
+.pagination {
+  padding-top: 10px;
+}
+</style>

package/src/frame/components/authorization/PermissRoleTabs.vue

@@ -0,0 +1,117 @@
+<template>
+  <el-tabs :style="$component.style" class="tabs" v-model="activeName">
+    <el-tab-pane v-for="(component,index) in components" :key="component.systemId" :label="component.systemName+'('+component.count+')'" :name="component.systemId" lazy >
+      <epx-page
+       ref="page"
+       :inline="true"
+       component="permiss-role-authorization"
+       metaId="FM_ENTITY_RIGHT_ROLE"
+       :current-query="{
+         systemId:component.systemId,
+         systemName:component.systemName,
+         systemType:component.systemId===SYSTEM?'self':'others',
+         roleId:roleId,
+         componentIndex:index
+       }"
+       ></epx-page>
+       <!-- :metaId="$metaId" -->
+    </el-tab-pane>
+  </el-tabs>
+</template>
+
+<script>
+import component from '@/utils/mixins/component'
+export default {
+  name: 'epx-permiss-role-tabs',
+  mixins: [component],
+  items: [],
+  style: {
+    'margin-bottom': '0'
+  },
+  data () {
+    return {
+      activeName: '',
+      counts: {},
+      components: [],
+      roleId: ''
+    }
+  },
+  methods: {
+    getRoleSystem () {
+      this.$http.list({
+        action: 'getTargetSystem',
+        entityId: 'FM_ENTITY_RIGHT_SYSTEM',
+        systemId: this.SYSTEM
+      })
+        .then(data => {
+          const components = data.systems
+          components.unshift({ systemId: this.SYSTEM, systemName: '本系统' })
+          this.components = components
+          components.forEach((tab, index) => {
+            this.getCount(tab, index)
+          })
+          this.activeName = components[0].systemId
+        })
+    },
+    getCount (tab, index) {
+      const params = {
+        entityId: 'FM_ENTITY_RIGHT_ROLE'
+      }
+      if (tab.systemId === this.SYSTEM) {
+        params.action = 'getCount'
+        params['scope.ROLE'] = this.roleId
+        params['scope.IS_LOCAL'] = '1'
+      } else {
+        params.action = 'getDesignatedSystemCount'
+        params.systemId = tab.systemId
+        params['scope.ROLE'] = this.roleId
+      }
+      this.$http.getCount(params)
+        .then(data => {
+          this.components.splice(index, 1, { ...tab, count: data.total || 0 })
+        })
+    }
+  },
+  created () {
+    this.roleId = this.$query.id
+    this.getRoleSystem()
+  },
+  mounted () {
+    this.$bus.on('refreshCount', data => {
+      const index = data.index
+      const total = data.total
+      const tab = this.components[index]
+      this.components.splice(index, 1, { ...tab, count: total || 0 })
+    })
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.tabs {
+    box-sizing: border-box;
+    padding: 16px;
+      background: #fff;
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+  &::v-deep {
+    .el-tabs__header {
+      background: #fff;
+      margin: 0;
+    }
+    .el-tabs__content {
+      flex: 1;
+      overflow: hidden;
+    }
+    .el-tab-pane {
+      height: 100%;
+      overflow: auto;
+    }
+     .el-tabs__item.is-bottom:nth-child(2), .el-tabs__item.is-top:nth-child(2),  .el-tabs__item.is-bottom:nth-child(2), .el-tabs__item.is-top:nth-child(2) {
+      padding: 0 20px;
+    }
+  }
+}
+
+</style>