[update] 修改操作列只显示一个按钮,其他显示在更多

This commit is contained in:
lideqin
2023-08-23 18:28:36 +08:00
parent 083bcaf0a2
commit a8f350e6d7
7 changed files with 227 additions and 62 deletions
+8 -1
View File
@@ -2,6 +2,7 @@
* 表头通过标签管理配置的模块的表格数据的混入
*/
import { getAction, postAction } from '@api/manage'
import { isHasPermission } from '../utils/hasPermission'
// 模拟接口返回的表头数据
const TempApiReturnColumns = [
@@ -49,6 +50,7 @@ export const ConfigurableTableMixin = {
orderBy: '1',
orderByField: '',
getTableHeaderData: null, // 获取表头数据的方法
operateMaxNum: 1,
// 操作列的column
operateColumn: {
title: this.$t('operation'),
@@ -57,12 +59,17 @@ export const ConfigurableTableMixin = {
scopedSlots: { customRender: 'operation' }
},
type: '', // 这个字段不知道什么含义
filters: {} // 固定的搜索条件
filters: {}, // 固定的搜索条件
needFilterTableBtn: true // 是否需要过滤没有权限的按钮
}
},
mounted () {
this.getTableHeader()
this.loadData()
// 过滤没有权限的按钮
if (this.needFilterTableBtn) {
this.operationList = this.operationList.filter(item => isHasPermission(item.has))
}
},
methods: {
/**
+10 -1
View File
@@ -8,6 +8,7 @@ import { downFile, getAction, getFileAccessHttpUrl, postAction } from '@/api/man
import Vue from 'vue'
import { ACCESS_TOKEN, TENANT_ID } from '@/store/mutation-types'
import store from '@/store'
import { isHasPermission } from '../utils/hasPermission'
// 导入的加载提示
let importModalLoading
@@ -51,7 +52,9 @@ export const JeroListMixin = {
/* 高级查询条件 */
superQueryParams: '',
/** 高级查询拼接方式 */
superQueryMatchType: 'and'
superQueryMatchType: 'and',
operateMaxNum: 1, // 表格操作列最多显示的按钮,其他显示在更多中
needFilterTableBtn: true // 是否需要过滤表格操作列没有权限的按钮
}
},
created () {
@@ -61,6 +64,12 @@ export const JeroListMixin = {
this.initDictConfig()
}
},
mounted () {
// 过滤表格操作列没有权限的按钮
if (this.needFilterTableBtn) {
this.operationList = this.operationList.filter(item => isHasPermission(item.has))
}
},
computed: {
// token header
tokenHeader () {
+66
View File
@@ -127,4 +127,70 @@ export function filterGlobalPermission (el, binding) {
}
}
/**
* 根据授权标识是否拥有该权限,用于tab页签的权限
*/
export function isHasPermission (permissionIdentifier) {
const permissionList = []
const allPermissionList = []
// let authList = Vue.ls.get(USER_AUTH);
const authList = JSON.parse(sessionStorage.getItem(USER_AUTH) || '[]')
for (const auth of authList) {
if (auth.type + '' !== '2') {
permissionList.push(auth)
}
}
// console.log("页面权限--Global--",sessionStorage.getItem(SYS_BUTTON_AUTH));
const allAuthList = JSON.parse(sessionStorage.getItem(SYS_BUTTON_AUTH) || '[]')
for (const gauth of allAuthList) {
if (gauth.type + '' !== '2') {
allPermissionList.push(gauth)
}
}
// 设置全局配置是否有命中
let invalidFlag = false// 无效命中
if (allPermissionList && allPermissionList.length > 0) {
for (const itemG of allPermissionList) {
if (permissionIdentifier === itemG.action) {
if (itemG.status + '' === '0') {
invalidFlag = true
break
}
}
}
}
if (invalidFlag) {
return
}
if (permissionList === null || permissionList === '' || permissionList === undefined || permissionList.length <= 0) {
return false
}
const permissions = []
for (const item of permissionList) {
// 权限策略1显示2禁用
if (item.type + '' !== '2') {
// update--begin--autor:wangshuai-----date:20200729------for:按钮权限,授权标识的提示信息是多个用逗号分隔逻辑处理 gitee#I1OUGU-------
if (item.action) {
if (item.action.includes(',')) {
const split = item.action.split(',')
for (let i = 0; i < split.length; i++) {
if (!split[i] || split[i].length === 0) {
continue
}
permissions.push(split[i])
}
} else {
permissions.push(item.action)
}
}
// update--end--autor:wangshuai-----date:20200729------for:按钮权限,授权标识的提示信息是多个用逗号分隔逻辑处理 gitee#I1OUGU------
}
}
if (!permissions.includes(permissionIdentifier)) {
return false
}
return true
}
export default hasPermission
+59 -12
View File
@@ -130,16 +130,44 @@
<template v-slot:fileName="{text}" :title="text">
{{ text }}
</template>
<!-- v-has="'externalReport:download'"-->
<!-- v-has="'externalReport:edit'"-->
<!-- v-has="'externalReport:delete'"-->
<!-- v-if="authmanage"-->
<!-- <template v-slot:operation="{text, record}">-->
<!-- <a class="text-operation"-->
<!-- @click="download(record)">{{$t('download')}}</a>-->
<!-- <a-divider type="vertical"/>-->
<!-- <a-dropdown v-if="authmanage">-->
<!-- <a class="ant-dropdown-link">-->
<!-- {{ $t('more') }} <a-icon type="down"/>-->
<!-- </a>-->
<!-- <a-menu slot="overlay">-->
<!-- <a-menu-item>-->
<!-- <a class="text-operation"-->
<!-- @click="handleEdit(record)">{{$t('edit')}}</a>-->
<!-- </a-menu-item>-->
<!-- <a-menu-item>-->
<!-- <a class="text-operation"-->
<!-- @click="batchDel(record)">{{$t('delete')}}</a>-->
<!-- </a-menu-item>-->
<!-- </a-menu>-->
<!-- </a-dropdown>-->
<!-- </template>-->
<template v-slot:operation="{text, record}">
<a class="text-operation"
v-has="'externalReport:download'"
@click="download(record)">{{$t('download')}}</a>
<a class="text-operation"
v-has="'externalReport:edit'"
@click="handleEdit(record)" v-if='authmanage'>{{$t('edit')}}</a>
<a class="text-operation"
v-has="'externalReport:delete'"
@click="batchDel(record)" v-if='authmanage'>{{$t('delete')}}</a>
<a v-for="(operation, index) in operationList.slice(0, operateMaxNum)" :key="index" class="text-operation"
@click="operationClick(record)">{{operation.text}}</a>
<!-- authmanage &&-->
<a-divider v-if="operationList.length >= operateMaxNum" type="vertical"/>
<a-dropdown v-if="operationList.length >= operateMaxNum">
<a class="ant-dropdown-link">{{ $t('more') }} <a-icon type="down"/></a>
<a-menu slot="overlay">
<a-menu-item v-for="(operation, index) in operationList.slice(operateMaxNum)" :key="index">
<!-- v-if="authmanage"-->
<a class="text-operation" @click="operationClick(record)">{{operation.text}}</a>
</a-menu-item>
</a-menu>
</a-dropdown>
</template>
</j-table>
</div>
@@ -172,12 +200,31 @@ export default {
mixins: [JeroListMixin],
data () {
return {
operationList: [
{
text: this.$t('download'),
clickEvent: 'download',
has: 'externalReport:download'
},
{
text: this.$t('edit'),
clickEvent: 'handleEdit',
has: 'externalReport:edit'
},
{
text: this.$t('delete'),
clickEvent: 'batchDel',
has: 'externalReport:delete'
}
],
labelCol: { span: 6 },
wrapperCol: { span: 16 },
disabled: false,
manager: false, // 是否有树右键菜单
addSub: true,
dataSource: [],
dataSource: [
{ id: 1 }
],
expandedKeys: [],
searchValue: '',
autoExpandParent: true,
@@ -225,7 +272,7 @@ export default {
},
{
title: this.$t('operation'),
align: 'left',
align: 'center',
fixed: 'right',
ellipsis: true,
width: 240,
@@ -233,7 +280,7 @@ export default {
}
],
url: {
list: 'com.jero.modules.extRepo/extRepoData/page',
list: '/extRepo/extRepoData/page',
getSysCategoryTree: '/sys/category/getSysCategoryTree'
},
// upAccept:'.zip', //导入文件类型
+33 -12
View File
@@ -47,24 +47,45 @@
:pagination="ipagination"
:scroll="{x: '100%'}"
@change="tableOnChange">
<template slot="operation" slot-scope="{text, record}">
<a v-for="(operation, index) in operationList" :key="index" @click="operationClick(operation,record)">
<!-- v-has="operation.has"-->
<span v-if="operation.text === $t('docLibrary.cancelCollection')" class="text">
<!-- 在混入里已经过滤过没有权限的按钮了 -->
<template v-slot:operation="{text, record}">
<a v-for="(operation, index) in operationList.slice(0, operateMaxNum)" :key="index" @click="operationClick(operation,record)">
<template v-if="operation.text === $t('docLibrary.cancelCollection')">
{{ !record.collectFlag || record.collectFlag === '0' ? $t('docLibrary.collection') : $t('docLibrary.cancelCollection')
}}
</span>
<!-- v-has="operation.has"-->
<span v-else-if="operation.text === $t('docLibrary.cancelSubscribe')" class="text">
</template>
<template v-else-if="operation.text === $t('docLibrary.cancelSubscribe')">
{{ !record.subscribeFlag || record.subscribeFlag === '0' ? $t('docLibrary.subscribe') : $t('docLibrary.cancelSubscribe')
}}
</span>
<!-- v-has="operation.has"-->
<span v-else class="text">
</template>
<template v-else>
{{ operation.text }}
</span>
</template>
</a>
<a-divider v-if="operationList.length >= operateMaxNum" type="vertical" />
<a-dropdown v-if="operationList.length >= operateMaxNum">
<a class="ant-dropdown-link">
{{ $t('more') }} <a-icon type="down"/>
</a>
<a-menu slot="overlay">
<a-menu-item v-for="(operation, index) in operationList.slice(operateMaxNum)" :key="index">
<a @click="operationClick(operation,record)">
<span v-if="operation.text === $t('docLibrary.cancelCollection')" class="text">
{{ !record.collectFlag || record.collectFlag === '0' ? $t('docLibrary.collection') : $t('docLibrary.cancelCollection')
}}
</span>
<span v-else-if="operation.text === $t('docLibrary.cancelSubscribe')" class="text">
{{ !record.subscribeFlag || record.subscribeFlag === '0' ? $t('docLibrary.subscribe') : $t('docLibrary.cancelSubscribe')
}}
</span>
<span v-else class="text">
{{ operation.text }}
</span>
</a>
</a-menu-item>
</a-menu>
</a-dropdown>
</template>
<!-- 详情-->
+29 -15
View File
@@ -54,23 +54,35 @@
:can-drag="true"
:loading="loading"
:pagination="ipagination"
:scroll="{x: '100%',y:'calc(100vh - 280px)'}"
:scroll="{x: '100%', y:'calc(100vh - 280px)'}"
:row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
@change="handleTableChange"
>
<template v-slot:operation="{text,record}">
<a class="text-operation" @click="comparisonResultsClick(record)">{{$t('docTool.comparison.comparisonResults')}}</a>
<a class="text-operation"
v-if="record.createBy === userInfoQuery.username || administrators"
@click="subscribe(record)">
{{!record.releaseState || record.releaseState === 'draft' ? $t('release') :$t('withdraw')}}
</a>
<a class="text-operation"
v-if="(record.createBy === userInfoQuery.username || administrators) && record.releaseState === 'draft'"
@click="edit(record)">{{$t('edit')}}</a>
<a class="text-operation"
v-if="(record.createBy === userInfoQuery.username || administrators) && record.releaseState === 'draft'"
@click="deleteData(record)">{{$t('delete')}}</a>
<a class="text-operation" @click="comparisonResultsClick(record)">{{$t('docTool.comparison.comparisonResults')}}</a>
<a-divider type="vertical" v-if="record.createBy === userInfoQuery.username || administrators" />
<a-dropdown v-if="record.createBy === userInfoQuery.username || administrators">
<a class="ant-dropdown-link">
{{ $t('more') }} <a-icon type="down"/>
</a>
<a-menu slot="overlay">
<a-menu-item>
<a v-if="record.createBy === userInfoQuery.username || administrators" @click="subscribe(record)">
{{!record.releaseState || record.releaseState === 'draft' ? $t('release') :$t('withdraw')}}
</a>
</a-menu-item>
<a-menu-item>
<a v-if="(record.createBy === userInfoQuery.username || administrators) && record.releaseState === 'draft'"
@click="edit(record)">{{$t('edit')}}</a>
</a-menu-item>
<a-menu-item>
<a v-if="(record.createBy === userInfoQuery.username || administrators) && record.releaseState === 'draft'"
@click="deleteData(record)">{{$t('delete')}}</a>
</a-menu-item>
</a-menu>
</a-dropdown>
</template>
<template v-slot:serialNumberRight="{text,record}">
<a @click="serialNumberRightClick(record)" :title="text">{{text}}</a>
@@ -102,7 +114,9 @@ export default {
deleteBatch: '/compare/sarFileCompareInfo/deleteBatch'
},
loading: false,
dataSource: [],
dataSource: [
{id: 1}
],
selectedRowKeys: [],
selectionRows: [],
downLoadFileUrl: window._CONFIG.domianPreviewURL + '/sys/common/download',
@@ -192,7 +206,7 @@ export default {
},
{
title: this.$t('operation'),
align: 'left',
align: 'center',
fixed: 'right',
width: 310,
scopedSlots: { customRender: 'operation' }
+22 -21
View File
@@ -32,13 +32,23 @@
:scroll="{x: '100%'}"
@change="tableOnChange">
<template slot="operation" slot-scope="{text, record}">
<a v-for="(operation, index) in operationList" :key="index" @click="operationClick(operation,record)">
<!-- v-has="operation.has"-->
<span class="text">
{{ operation.text }}
</span>
<template v-slot:operation="{text, record}">
<a v-for="(operation, index) in operationList.slice(0, operateMaxNum)" :key="index" @click="operationClick(operation,record)">
{{ operation.text }}
</a>
<a-divider v-if="operationList.length >= operateMaxNum" type="vertical" />
<a-dropdown v-if="operationList.length >= operateMaxNum">
<a class="ant-dropdown-link">
{{ $t('more') }} <a-icon type="down"/>
</a>
<a-menu slot="overlay">
<a-menu-item v-for="(operation, index) in operationList.slice(operateMaxNum)" :key="index">
<a @click="operationClick(operation,record)">
{{ operation.text }}
</a>
</a-menu-item>
</a-menu>
</a-dropdown>
</template>
<!-- 详情-->
@@ -49,19 +59,7 @@
<div class="table-text" v-else>{{ global.emptyLine }}</div>
</a-tooltip>
</template>
</j-table>
<!-- <table-data-->
<!-- :url="url"-->
<!-- :flag="'3'"-->
<!-- :operationList="operationList"-->
<!-- showAction-->
<!-- ref="tableData"-->
<!-- @onSelectChange="onSelectChange"-->
<!-- @backDocument="backDocument"-->
<!-- @deleteDetail="deleteDetail"-->
<!-- @detailClick="detailClick"-->
<!-- ></table-data>-->
</div>
<split-text ref="splitText" @visible="splitTextVisible"></split-text>
<import-result ref="importResult" @visible="importResultVisible"></import-result>
@@ -103,13 +101,16 @@ export default {
}
],
url: {
tableHeader: 'split/sarFileSplitInfo/getHeader', // 表格头部字段
searchList: 'split/sarFileSplitInfo/queryCondition', // 搜索字段
list: 'split/sarFileSplitInfo/page', // 表格数据
// tableHeader: '/split/sarFileSplitInfo/getHeader', // 表格头部字段
searchList: '/split/sarFileSplitInfo/queryCondition', // 搜索字段
// list: '/split/sarFileSplitInfo/page', // 表格数据
deleteBatch: '', // 批量删除
deleteUrl: '',
backDocument: '' // 回传至文档库
},
dataSource: [
{ id: 1 }
],
showAction: true,
flag: '3'
}