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

src/mixins/ConfigurableTableMixin.js

@@ -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: {
     /**

src/mixins/JeroListMixin.js

@@ -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 () {

src/utils/hasPermission.js

@@ -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

src/views/businessSupport/DataCenter.vue

@@ -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"
+                <a v-for="(operation, index) in operationList.slice(0, operateMaxNum)" :key="index" class="text-operation"
-                   v-has="'externalReport:download'"
+                   @click="operationClick(record)">{{operation.text}}</a>
-                   @click="download(record)">{{$t('download')}}</a>
+<!--                authmanage &&-->
-                <a class="text-operation"
+                <a-divider v-if="operationList.length >= operateMaxNum" type="vertical"/>
-                   v-has="'externalReport:edit'"
+                <a-dropdown v-if="operationList.length >= operateMaxNum">
-                   @click="handleEdit(record)" v-if='authmanage'>{{$t('edit')}}</a>
+                  <a class="ant-dropdown-link">{{ $t('more') }} <a-icon type="down"/></a>
-                <a class="text-operation"
+                  <a-menu slot="overlay">
-                   v-has="'externalReport:delete'"
+                    <a-menu-item v-for="(operation, index) in operationList.slice(operateMaxNum)" :key="index">
-                   @click="batchDel(record)" v-if='authmanage'>{{$t('delete')}}</a>
+<!--                      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',  //导入文件类型

src/views/documentManage/DocumentLibrary.vue

@@ -47,24 +47,45 @@
         :pagination="ipagination"
         :scroll="{x: '100%'}"
         @change="tableOnChange">
-
+        <!--   在混入里已经过滤过没有权限的按钮了  -->
-        <template slot="operation" slot-scope="{text, record}">
+        <template v-slot:operation="{text, record}">
-          <a v-for="(operation, index) in operationList" :key="index" @click="operationClick(operation,record)">
+          <a v-for="(operation, index) in operationList.slice(0, operateMaxNum)" :key="index" @click="operationClick(operation,record)">
-            <!--            v-has="operation.has"-->
+            <template v-if="operation.text === $t('docLibrary.cancelCollection')">
-            <span v-if="operation.text === $t('docLibrary.cancelCollection')" class="text">
               {{ !record.collectFlag || record.collectFlag === '0' ? $t('docLibrary.collection') : $t('docLibrary.cancelCollection')
               }}
-            </span>
+            </template>
-            <!--            v-has="operation.has"-->
+            <template v-else-if="operation.text === $t('docLibrary.cancelSubscribe')">
-            <span v-else-if="operation.text === $t('docLibrary.cancelSubscribe')" class="text">
               {{ !record.subscribeFlag || record.subscribeFlag === '0' ? $t('docLibrary.subscribe') : $t('docLibrary.cancelSubscribe')
               }}
-            </span>
+            </template>
-            <!--            v-has="operation.has"-->
+            <template v-else>
-            <span v-else class="text">
               {{ 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>
 
         <!--        详情-->

src/views/documentTool/DocumentComparison.vue

@@ -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" @click="comparisonResultsClick(record)">{{$t('docTool.comparison.comparisonResults')}}</a>
-           <a class="text-operation"
+
-              v-if="record.createBy === userInfoQuery.username || administrators"
+          <a-divider type="vertical" v-if="record.createBy === userInfoQuery.username || administrators" />
-              @click="subscribe(record)">
+
-            {{!record.releaseState || record.releaseState === 'draft' ? $t('release') :$t('withdraw')}}
+          <a-dropdown v-if="record.createBy === userInfoQuery.username || administrators">
-           </a>
+            <a class="ant-dropdown-link">
-          <a class="text-operation"
+              {{ $t('more') }} <a-icon type="down"/>
-             v-if="(record.createBy === userInfoQuery.username || administrators) && record.releaseState === 'draft'"
+            </a>
-             @click="edit(record)">{{$t('edit')}}</a>
+            <a-menu slot="overlay">
-          <a class="text-operation"
+              <a-menu-item>
-             v-if="(record.createBy === userInfoQuery.username || administrators) && record.releaseState === 'draft'"
+                <a v-if="record.createBy === userInfoQuery.username || administrators" @click="subscribe(record)">
-             @click="deleteData(record)">{{$t('delete')}}</a>
+                  {{!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' }

src/views/documentTool/DocumentSplit.vue

@@ -32,13 +32,23 @@
         :scroll="{x: '100%'}"
         @change="tableOnChange">
 
-        <template slot="operation" slot-scope="{text, record}">
+        <template v-slot:operation="{text, record}">
-          <a v-for="(operation, index) in operationList" :key="index" @click="operationClick(operation,record)">
+          <a v-for="(operation, index) in operationList.slice(0, operateMaxNum)" :key="index" @click="operationClick(operation,record)">
-            <!--            v-has="operation.has"-->
+            {{ operation.text }}
-            <span class="text">
-              {{ operation.text }}
-            </span>
           </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', // 表格头部字段
+        // tableHeader: '/split/sarFileSplitInfo/getHeader', // 表格头部字段
-        searchList: 'split/sarFileSplitInfo/queryCondition', // 搜索字段
+        searchList: '/split/sarFileSplitInfo/queryCondition', // 搜索字段
-        list: 'split/sarFileSplitInfo/page', // 表格数据
+        // list: '/split/sarFileSplitInfo/page', // 表格数据
         deleteBatch: '', // 批量删除
         deleteUrl: '',
         backDocument: '' // 回传至文档库
       },
+      dataSource: [
+        { id: 1 }
+      ],
       showAction: true,
       flag: '3'
     }