@epxing/business 0.0.0-stage → 5.3.0-beta.1

package/src/components/right/SystemList.vue

@@ -0,0 +1,848 @@
+<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" :key="operate.text">
+          <el-button size="default" :type="operate.ui" @click="$handler(operate, null)">{{operate.text}}</el-button>
+        </template>
+      </div>
+      <el-input @change="getData(1)" 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 v-slot="scope">
+                {{scope.row.entityName}}（{{scope.row.entityCode}}）
+            </template>
+        </el-table-column>
+        <!-- <el-table-column
+            label="对象编号">
+            <template v-slot="scope">
+
+            </template>
+        </el-table-column> -->
+        <el-table-column
+            label="功能权限">
+            <template v-slot="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)">
+                <el-popover
+                  placement="top-start"
+                  title=""
+                  :style="{ maxWidth: '200px' }"
+                  trigger="hover"
+                >
+                  <div :style="{ display: 'inline-block', maxWidth: '300px' }">{{api.apiName.replace(/,/g, '、')}}</div>
+                  <template v-slot:reference><span :style="{marginRight: '8px', cursor: 'pointer'}"  >{{ api.apiLabel }}</span></template>
+              </el-popover>
+              </el-checkbox>
+            </template>
+        </el-table-column>
+        <el-table-column
+            label="数据权限">
+            <template v-slot="scope"><div class="right-item">
+              <div>
+                <template v-if="scope.row.dataScopes && scope.row.dataScopes['1']">
+                  <!-- 是否相等 -->
+                  <template v-if="isSameDataRight(scope.row)">
+                  <!-- 获取第一个 -->
+                    {{ getRightText(scope.row.dataScopes['1'])  }}
+                  </template>
+                  <template v-else>
+                    <!-- 循环 -->
+                    <p v-for="(item, key) in scope.row.dataScopes" :key="item.id" class="right-item__sub"><font class="right-item__title">{{ key==='1'? '新增':key==='2'? '查询' : key==='3'? '删除': '修改' }}：</font> {{getRightText(item)}}</p>
+                  </template>
+                </template>
+                <template v-else>/</template>
+              </div>
+              <i class="el-icon-setting" @click="editDataScope(scope)"></i>
+            </div></template>
+        </el-table-column>
+        <el-table-column
+            label="字段权限">
+            <template v-slot="scope"><div class="right-item">
+              <div>
+                <template v-if="scope.row.fieldScopes && scope.row.fieldScopes['1']">
+                  <!-- 是否相等 -->
+                  <template v-if="isSameFieldRight(scope.row)">
+                  <!-- 获取第一个 -->
+                    {{ getRightText(scope.row.fieldScopes['1'])  }}
+                  </template>
+                  <template v-else>
+                    <!-- 循环 -->
+                    <p v-for="(item, key) in scope.row.fieldScopes" :key="item.id" class="right-item__sub"><font class="right-item__title">{{ key==='1'? '查看':'编辑' }}：</font>{{getRightFieldText(item)}}</p>
+                  </template>
+                </template>
+                <template v-else>/</template>
+              </div>
+              <i class="el-icon-setting" @click="editFieldScope(scope.row)"></i>
+            </div></template>
+        </el-table-column>
+        <!-- <el-table-column
+            label="操作"
+            width="150">
+            <template v-slot="scope">
+              <div class="column-operates">
+                <el-button type="primary" link @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>
+    <!-- 编辑字段弹窗 -->
+    <el-dialog width="800px" v-model="editFieldDialog" destroy-on-close title="编辑字段权限">
+      <div class="scope-form">
+        <div class="scope-form__item">
+          <label for="">对象名称：</label>
+          <span>{{editFieldScopeForm.entityName}}</span>
+        </div>
+      </div>
+
+      <el-table class="scope-table" height="500px" border :data="allFields">
+         <el-table-column
+            width="80px"
+            :label="this.$t('numerical order')"
+            type="index"
+          >
+        </el-table-column>
+        <el-table-column label="字段名称" >
+          <template v-slot="scope">
+            {{scope.row.attriLabel}}
+          </template>
+        </el-table-column>
+        <el-table-column label="查看">
+          <template v-slot:header>
+            <span class="scope-table__title">查看</span>
+            <el-checkbox ref="detailSelectAll" :value="detailSelectAll" @change="v=>changeSelectAll(v, '1')">
+              <span></span>
+            </el-checkbox>
+          </template>
+          <template v-slot="scope">
+           <el-checkbox :label="scope.row.attribute.id" :value="detailSelection.includes(scope.row.attribute.id)" @change="changeSelect(scope.row, '1')">
+             <span></span>
+           </el-checkbox>
+          </template>
+        </el-table-column>
+        <el-table-column label="编辑">
+          <template v-slot:header>
+            <span class="scope-table__title">编辑</span>
+            <el-checkbox  ref="editSelectAll" :value="editSelectAll" @change="v=>changeSelectAll(v, '2')">
+              <span></span>
+            </el-checkbox>
+          </template>
+          <template v-slot="scope">
+           <el-checkbox :label="scope.row.attribute.id" :value="editSelection.includes(scope.row.attribute.id)" @change="changeSelect(scope.row, '2')">
+             <span></span>
+           </el-checkbox>
+          </template>
+        </el-table-column>
+      </el-table>
+      <template v-slot:footer><div class="dialog-footer">
+        <el-button @click="editFieldDialog = false">取 消</el-button>
+        <el-button type="primary" @click="submitFieldScope">确 定</el-button>
+      </div></template>
+    </el-dialog>
+    <!-- 编辑数据权限弹窗 -->
+    <el-dialog width="800px" v-model="editDataDialog" title="编辑数据权限">
+      <div class="scope-form">
+        <div class="scope-form__item">
+          <label for="">对象名称：</label>
+          <span>{{editDataScopeForm.entityName}}</span>
+        </div>
+      </div>
+      <div class="scope-form__item">
+        <label for="">配置方式：</label>
+        <el-radio-group class="scope-radio__group" v-model="dataConfigWay">
+          <el-radio label="1" value="1">统一设置</el-radio>
+          <el-radio label="2" value="2">单个设置</el-radio>
+        </el-radio-group>
+      </div>
+      <div class="scope-form__item" v-show="dataConfigWay==='1'">
+        <label for="">统一配置方式：</label>
+        <el-radio-group class="scope-radio__group" v-model="dataAllConfigWay">
+          <el-radio label="1" value="1">默认</el-radio>
+          <el-radio label="7" value="7">高级设置</el-radio>
+        </el-radio-group>
+      </div>
+      <epx-form-scope v-if="dataConfigWay==='1' && dataAllConfigWay==='7'" v-model="dataAllConfig" :metaId="editDataScopeForm.entityId" :fieldConfigs="{state: 'EDIT'}" />
+      <el-table class="scope-table" border :data="editDataScopeList">
+        <el-table-column label="数据操作" width="100px">
+          <template v-slot="scope">
+            {{scope.row.data.API_TYPE==='1' ? '新增':scope.row.data.API_TYPE==='2' ? '查询':scope.row.data.API_TYPE==='3' ? '删除': '修改'}}
+          </template>
+        </el-table-column>
+        <el-table-column label="权限范围">
+          <template v-slot="scope">
+            <template v-if="dataConfigWay==='1'">
+              {{ getRightText(scope.row) }}
+            </template>
+            <template v-else>
+              <el-radio-group class="scope-radio__group"  v-model="scope.row.data.TYPE">
+                <el-radio label="1" value="1">默认</el-radio>
+                <el-radio label="7" value="7">高级设置</el-radio>
+              </el-radio-group>
+              <epx-form-scope v-if="scope.row.data.TYPE==='7'" v-model="scope.row.data.DATA_SCOPE" :metaId="scope.row.data.ENTITY" :fieldConfigs="{state: 'EDIT'}" />
+            </template>
+          </template>
+        </el-table-column>
+      </el-table>
+      <template v-slot:footer><div class="dialog-footer">
+        <el-button @click="editDataDialog = false">取 消</el-button>
+        <el-button type="primary" @click="submitDataScope">确 定</el-button>
+      </div></template>
+    </el-dialog>
+  </div>
+</template>
+<script>
+import List from '@epxing/components/src/entity-list'
+export default {
+  name: 'epx-right-system-list',
+  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
+    },
+    isSameDataRight () {
+      return data => {
+        const dataScopes = data.dataScopes
+        if (!dataScopes || !dataScopes['1'] || !dataScopes['1'].data) return true
+        const initData = dataScopes['1'].data
+        return Object.values(dataScopes).every(item => item.data && item.data.TYPE === initData.TYPE && item.data.DATA_SCOPE === initData.DATA_SCOPE)
+      }
+    },
+    getRightText () {
+      return data => {
+        if (!data || !data.data) return ''
+        const { TYPE, DATA_SCOPE } = data.data
+        if (TYPE === '7') {
+          if (DATA_SCOPE) {
+            let text = ''
+            const scope = JSON.parse(DATA_SCOPE)
+            scope.scopeParams.map((item, index) => (
+              text += (item.text || '') + (index === scope.scopeParams.length - 1 ? '' : item.link === 'or' ? ' 或者 ' : ' 并且 ')
+            ))
+            return text
+          }
+          return '默认（全部）'
+        } else if (TYPE === '1') {
+          return '默认（全部）'
+        } else {
+          return this.dataScopeTypeMap[TYPE]
+        }
+      }
+    },
+    isSameFieldRight () {
+      return data => {
+        const fieldScopes = data.fieldScopes
+        if (!fieldScopes || !fieldScopes['1'] || !fieldScopes['1'].data) return true
+        const initData = fieldScopes['1'].data
+        return Object.values(fieldScopes).every(item => item.data && item.data.TYPE === initData.TYPE && item.data.FIELD_SCOPE === initData.FIELD_SCOPE)
+      }
+    },
+    getRightFieldText () {
+      return data => {
+        if (!data || !data.data) return ''
+        const { TYPE, 'FIELD_SCOPE#': fieldNames } = data.data
+        if (TYPE === '1') {
+          return '全部'
+        } else {
+          return fieldNames
+        }
+      }
+    },
+    detailSelectAll () {
+      return this.detailSelection.length === this.allFields.length
+    },
+    editSelectAll () {
+      return this.editSelection.length === this.allFields.length
+    }
+  },
+  data () {
+    return {
+      tableData: [],
+      searchText: '',
+      selectionList: [],
+      editFieldScopeForm: {},
+      editFieldDialog: false,
+      allFields: [],
+      detailSelection: [],
+      editSelection: [],
+      editDataDialog: false,
+      editDataScopeForm: {},
+      editDataScopeList: [],
+      dataConfigWay: '2',
+      dataAllConfigWay: '1',
+      dataAllConfig: null
+    }
+  },
+  watch: {
+    detailSelectAll (v) {
+      const input = this.$refs.detailSelectAll.$el.querySelector('.el-checkbox__input')
+      if (input) {
+        if (v) {
+          input.className += ' is-checked'
+        } else {
+          input.className = 'el-checkbox__input'
+        }
+      }
+    },
+    editSelectAll (v) {
+      const input = this.$refs.editSelectAll.$el.querySelector('.el-checkbox__input')
+      if (input) {
+        if (v) {
+          input.className += ' is-checked'
+        } else {
+          input.className = 'el-checkbox__input'
+        }
+      }
+    },
+    dataConfigWay (v) {
+      if (v === '1') {
+        const editDataScopeList = this.$_.cloneDeep(this.editDataScopeList)
+        editDataScopeList.forEach(item => {
+          item.data.TYPE = this.dataAllConfigWay
+          item.data.DATA_SCOPE = this.dataAllConfig ? JSON.stringify(this.dataAllConfig) : ''
+        })
+        this.editDataScopeList = editDataScopeList
+      }
+    },
+    dataAllConfigWay (v) {
+      const editDataScopeList = this.$_.cloneDeep(this.editDataScopeList)
+      editDataScopeList.forEach(item => {
+        item.data.TYPE = this.dataAllConfigWay
+        item.data.DATA_SCOPE = this.dataAllConfig ? JSON.stringify(this.dataAllConfig) : ''
+      })
+      this.editDataScopeList = editDataScopeList
+    },
+    dataAllConfig () {
+      const editDataScopeList = this.$_.cloneDeep(this.editDataScopeList)
+      editDataScopeList.forEach(item => {
+        item.data.TYPE = this.dataAllConfigWay
+        item.data.DATA_SCOPE = this.dataAllConfig
+      })
+      this.editDataScopeList = editDataScopeList
+    }
+  },
+  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)
+      const rowApis = row.apis || []
+      if (index !== -1) {
+        // 删除所有的接口
+        this.selectionList = [...new Set([...this.selectionList, ...rowApis])]
+      } else {
+        rowApis.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 entityApis = row.apis || []
+      // 如果全选了，或者全取消  取消勾选
+      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-system-add-no-api',
+        metaId: 'FM_ENTITY_RIGHT_SYSTEM',
+        openType: '2',
+        systemId: this.$query.id,
+        systemType: this.$query.systemType
+      })
+    },
+    // 启用
+    // column删除
+    deleteAuthorizationRole (row) {
+      const id = (row.apis || []).map(item => item.apiSystemId).join(',')
+      this.$confirm(this.$t('Confirm the deletion') + '？')
+        .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 apiSystemIds = this.selectionList.map(item => item.apiSystemId).join(',')
+      this.$confirm(this.$t('Confirm the deletion') + '？')
+        .then(() => {
+          this.$http.removeMulti({
+            entityId: 'FM_ENTITY_RIGHT_SYSTEM',
+            ids: apiSystemIds
+          })
+            .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: this.$t('Confirm the deletion') + '？',
+          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: this.$t('Confirm the deletion') + '？',
+          successMsg: '删除成功',
+          params: {
+            ids: `#[${this.$metaKey}]`
+          }
+        }
+      ]
+      if (!operates) {
+        this.configs.operates = defaultOperates
+      }
+      if (!columnOperates) {
+        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) {
+        const apisLength = (row.apis || []).length
+        if (row.merge && apisLength > 0) {
+          return {
+            rowspan: apisLength,
+            colspan: 1
+          }
+        } else if (row.merge && apisLength === 0) {
+          return {
+            rowspan: 1,
+            colspan: 1
+          }
+        } else {
+          return {
+            rowspan: 0,
+            colspan: 0
+          }
+        }
+      }
+    },
+    getData (current, cb) {
+      // eslint-disable-next-line camelcase
+      let { queryParams = {}, pageFlag, orderFields, order_field: orderField = [], order_mode: orderMode = [], limit } = this.$configs
+      const params = {
+        action: 'getSystemRightManagement',
+        systemId: this.$query.id,
+        entityId: this.$metaId,
+        searchText: this.searchText
+      }
+      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 || this.tableData.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
+        })
+    },
+    editFieldScope (scope) {
+      this.editFieldScopeForm = {
+        ...scope.fieldScopes
+      }
+      this.$store.dispatch({
+        type: 'ADD_META',
+        metaId: scope.entityId
+      })
+        .then(meta => {
+          this.allFields = meta.getAllFieldConfigs()
+          this.editFieldDialog = true
+          const fieldScopes = scope.fieldScopes || {}
+          const detailData = fieldScopes['1']?.data || {}
+          const editData = fieldScopes['2']?.data || {}
+          if (detailData.TYPE === '1') {
+            this.detailSelection = this.allFields.map(item => item.attribute.id)
+          } else {
+            const selects = detailData.FIELD_SCOPE ? detailData.FIELD_SCOPE.split(',') : []
+            this.detailSelection = selects
+          }
+          if (editData.TYPE === '1') {
+            this.editSelection = this.allFields.map(item => item.attribute.id)
+          } else {
+            const selects = editData.FIELD_SCOPE ? editData.FIELD_SCOPE.split(',') : []
+            this.editSelection = selects
+          }
+        })
+    },
+    changeSelect (row, type) {
+      if (type === '1') {
+        const index = this.detailSelection.findIndex(item => item === row.attribute.id)
+        if (index !== -1) {
+          this.detailSelection.splice(index, 1)
+        } else {
+          this.detailSelection.push(row.attribute.id)
+        }
+      } else {
+        const index = this.editSelection.findIndex(item => item === row.attribute.id)
+        if (index !== -1) {
+          this.editSelection.splice(index, 1)
+        } else {
+          this.editSelection.push(row.attribute.id)
+        }
+      }
+    },
+    changeSelectAll (v, type) {
+      if (type === '1') {
+        if (!this.detailSelectAll) {
+          this.detailSelection = this.allFields.map(item => item.attribute.id)
+        } else {
+          this.detailSelection = []
+        }
+      } else {
+        if (!this.editSelectAll) {
+          this.editSelection = this.allFields.map(item => item.attribute.id)
+        } else {
+          this.editSelection = []
+        }
+      }
+    },
+    submitFieldScope () {
+      const entityList = Object.keys(this.editFieldScopeForm).filter(item => item === '1' || item === '2').map(item => {
+        const data = this.editFieldScopeForm[item].data
+        const fieldList = item === '1' ? this.detailSelection : this.editSelection
+        const filterFieldList = fieldList.filter(item => this.allFields.find(field => field.attribute.id === item))
+        const type = filterFieldList.length === this.allFields.length ? '1' : '2'
+        return {
+          ID: data.ID,
+          TYPE: type,
+          FIELD_SCOPE: type === '1' ? '' : filterFieldList.join(',')
+        }
+      })
+      this.$http.save({
+        action: 'setRoleFieldScope',
+        entityId: 'FM_ROLE_FIELDSCOPE',
+        entityList: entityList
+      })
+        .then(data => {
+          this.$message.success('修改成功')
+          this.editFieldDialog = false
+          this.allFields = []
+          this.editFieldScopeForm = {}
+          this.getData()
+        })
+        .catch(err => {
+          this.$message.error(err.message)
+        })
+    },
+    getDataScopeType () {
+      this.$store.dispatch({
+        type: 'ADD_LIST',
+        key: 'FM_DATASCOPE_TYPE'
+      })
+        .then(data => {
+          this.dataScopeTypeList = data
+          const dataScopeTypeMap = {}
+          data.forEach(item => {
+            dataScopeTypeMap[item.code] = item.name
+          })
+          this.dataScopeTypeMap = dataScopeTypeMap
+        })
+    },
+    editDataScope (scope, system) {
+      this.editDataDialog = true
+      this.editDataSystem = this.$query.id
+      this.editDataScopeForm = { ...scope.row }
+      const dataScopes = scope.row.dataScopes || {}
+      this.editDataScopeList = Object.keys(dataScopes).filter(item => item === '1' || item === '2' || item === '3' || item === '4').map(item => dataScopes[item])
+      // 获取是否相同
+      const isSame = this.isSameDataRight(scope.row)
+      if (isSame && this.editDataScopeList.length) {
+        this.dataConfigWay = '1'
+        if (this.editDataScopeList[0].data.TYPE === '1') {
+          this.dataAllConfigWay = '1'
+        } else {
+          this.dataAllConfigWay = '7'
+          this.dataAllConfig = this.editDataScopeList[0].data.DATA_SCOPE
+        }
+      } else {
+        this.dataConfigWay = '2'
+      }
+    },
+    submitDataScope () {
+      this.$http.save({
+        action: 'setSystemDataScope',
+        entityId: 'FM_SYSTEM_DATASCOPE',
+        entityList: this.editDataScopeList.map(item => ({
+          ID: item.data.ID,
+          TYPE: !item.data.DATA_SCOPE ? '1' : item.data.TYPE,
+          DATA_SCOPE: item.data.DATA_SCOPE
+        }))
+      })
+        .then(data => {
+          this.$message.success('修改成功')
+          this.editDataDialog = false
+          this.editDataScopeList = []
+          this.editDataScopeForm = {}
+          this.getData()
+        })
+        .catch(err => {
+          this.$message.error(err.message)
+        })
+    }
+  },
+  created () {
+    this.getDataScopeType()
+  }
+}
+</script>
+
+<style scoped lang="scss">
+.container {
+  height: 100%;
+  background: var(--epx-bg-card);
+  padding: 10px;
+}
+.list-operates {
+  padding: 6px 0 16px;
+  display: flex;
+  justify-content: space-between;
+}
+
+.list-table {
+
+    :deep(.el-table__row.hover-row>td) {
+      background: none
+    }
+
+  .el-icon-setting {
+    color: var(--epx-text-secondary);
+    margin-left: 10px;
+  }
+}
+.pagination {
+  padding-top: 10px;
+}
+.right-item {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  >i {
+    cursor: pointer;
+    &:hover {
+      @include font_color_primary;
+    }
+  }
+}
+.scope-form__item {
+  margin: 12px 0;
+}
+.right-item__title {
+  font-weight: bold;
+}
+.right-item__sub {
+  margin: 8px 0;
+}
+.scope-table__title {
+  margin-right: 6px;
+}
+</style>