feat：用户个人视角权限管理优化 #11138

# Reviewed, transaction id: 26767
TencentBlueKing · Dec 13, 2024 · 9446227 · 9446227
1 parent 22c1e4f
commit 9446227
Show file tree

Hide file tree

Showing 9 changed files with 208 additions and 155 deletions.
diff --git a/...ops-manage/src/components/user-group/components/children/permission-manage/manage-all.vue b/...ops-manage/src/components/user-group/components/children/permission-manage/manage-all.vue
@@ -647,7 +647,7 @@ async function batchOperator (flag) {
 
     const res = await http.batchOperateCheck(projectId.value, batchOperateTypes[flag], params);
     checkData.value = res;
-    invalidAuthorizationCount.value = res.invalidPipelineAuthorizationCount + res.invalidRepositoryAuthorizationCount
+    invalidAuthorizationCount.value = res.invalidPipelineAuthorizationCount + res.invalidRepositoryAuthorizationCount + res.uniqueManagerCount
     loadingMap[flag].value = false;
 
     sliderTitle.value = t(batchTitle[flag]);

diff --git a/src/frontend/devops-permission/src/components/permission-aside.vue b/src/frontend/devops-permission/src/components/permission-aside.vue
@@ -6,38 +6,48 @@ const { t } = useI18n();
 const router = useRouter();
 const route = useRoute();
 
-const menuList = [
-  {
-    name: t('我的权限'),
-    code: 'my-permission',
-    icon: 'permission-icon-wodequanxian',
-  },
-  {
-    name: t('我的申请'),
-    code: 'my-apply',
-    icon: 'permission-icon-wodeshenqing',
-  },
-  {
-    name: t('我的审批'),
-    code: 'my-approval',
-    icon: 'permission-icon-wodeshenpi',
-  },
-  {
-    name: t('申请权限'),
-    code: 'apply',
-    icon: 'permission-icon-quanxianshenqing',
-  },
-  {
-    name: t('我的交接'),
-    code: 'my-handover',
-    icon: 'permission-icon-handover'
+const menuGroups = [
+{
+    theme: t('个人事务'),
+    items: [
+      {
+        name: t('我的权限'),
+        code: 'my-permission',
+        icon: 'permission-icon-wodequanxian',
+      },
+      {
+        name: t('我的申请'),
+        code: 'my-apply',
+        icon: 'permission-icon-wodeshenqing',
+      },
+      {
+        name: t('我的审批'),
+        code: 'my-approval',
+        icon: 'permission-icon-wodeshenpi',
+      },
+      {
+        name: t('申请权限'),
+        code: 'apply',
+        icon: 'permission-icon-quanxianshenqing',
+      },
+      {
+        name: t('我的交接'),
+        code: 'my-handover',
+        icon: 'permission-icon-handover'
+      }
+    ]
   },
   {
-    name: t('我的项目'),
-    code: 'my-project',
-    icon: 'permission-icon-wodexiangmu',
+    theme: t('管理事务'),
+    items: [
+      {
+        name: t('我的项目'),
+        code: 'my-project',
+        icon: 'permission-icon-wodexiangmu',
+      }
+    ]
   }
-];
+]
 
 const handleChangeMenu = (menu: any) => {
   router.push({
@@ -50,24 +60,30 @@ const handleChangeMenu = (menu: any) => {
   <article class="permission-aside">
     <section class="menu-list">
       <div
-        v-for="(menu, index) in menuList"
-        :key="index"
-        @click="handleChangeMenu(menu)"
-        :class="{
-          'menu-item': true,
-          'active': route.name === menu.code
-        }"
+        v-for="(group, groupIndex) in menuGroups"
+        :key="groupIndex"
       >
-        <bk-badge
-          position="top-right"
-          theme="danger"
-          dot
-          :visible="true"
-          style="margin: 0 18px 0 25px"
+        <div class="menu-theme">{{ group.theme }}</div>
+        <div
+          v-for="(menu, index) in group.items"
+          :key="index"
+          @click="handleChangeMenu(menu)"
+          :class="{
+            'menu-item': true,
+            'active': route.name === menu.code
+          }"
         >
-          <i class="permission-icon" :class="menu.icon"></i>
-        </bk-badge>
-        <span>{{ menu.name }}</span>
+          <bk-badge
+            position="top-right"
+            theme="danger"
+            dot
+            :visible="true"
+            style="margin: 0 18px 0 25px"
+          >
+            <i class="permission-icon" :class="menu.icon"></i>
+          </bk-badge>
+          <span>{{ menu.name }}</span>
+        </div>
       </div>
     </section>
 
@@ -100,5 +116,12 @@ const handleChangeMenu = (menu: any) => {
       color: #3A84FF;
       background-color: #E1ECFF;
     }
+    .menu-theme {
+      width: 240px;
+      height: 40px;
+      line-height: 40px;
+      color: #979BA5;
+      margin: 0 18px 0 25px;
+    }
   }
 </style>
diff --git a/src/frontend/devops-permission/src/components/permission-manage/tab-table.vue b/src/frontend/devops-permission/src/components/permission-manage/tab-table.vue
@@ -13,20 +13,21 @@
       selection-key="resourceCode"
       :checked="selectedResourceCode"
       :scroll-loading="scrollLoading"
+      :is-row-select-enable="disabledRowSelect"
       @select-all="handleSelectAll"
       @selection-change="handleSelectionChange"
       @page-limit-change="pageLimitChange"
       @page-value-change="pageValueChange"
     >
       <template #prepend>
         <div v-if="isCurrentAll" class="prepend">
-          {{t('已选择全量数据X条', [groupTotal])}}
+          {{t('已选择全量数据')}}
           <span class="prepend-line">|</span>
           <span @click="handleClear">{{t("清除选择")}}</span>
         </div>
         <div v-else-if="isShowOperation && selectedData[resourceType]?.length" class="prepend">
           {{t('已选择X条数据，', [selectedData[resourceType].length])}}
-          <span @click="handleSelectAllData">{{ t('选择全量数据X条', [groupTotal]) }}</span>
+          <span @click="handleSelectAllData">{{ t('选择全量数据') }}</span>
           <span class="prepend-line">|</span>
           <span @click="handleClear">{{t("清除选择")}}</span>
         </div>
@@ -69,6 +70,11 @@
           {{ row.joinedType === "DIRECT" ? t('直接加入') : t('组织加入') }}
         </template>
       </bk-table-column>
+      <bk-table-column :label="t('状态')" prop="beingHandedOver" v-if="isShowOperation">
+        <template #default="{row}">
+          {{ row.beingHandedOver ? t('移交中') : '' }}
+        </template>
+      </bk-table-column>
       <bk-table-column :label="t('操作')" v-if="isShowOperation" :show-overflow-tooltip="false">
         <template #default="{row, index}">
           <div>
@@ -93,7 +99,7 @@
                 class="operation-btn"
                 disabled
                 v-bk-tooltips="{
-                  content: t('通过用户组获得权限，请到用户组里移出用户'),
+                  content: t('通过用户组获得权限，请到用户组里退出用户'),
                   placement: 'top'
                 }"
               >
@@ -107,7 +113,7 @@
                 @click="handleRenewal(row)"
                 :disabled="row.removeMemberButtonControl === 'DEPARTMENT'"
                 v-bk-tooltips="{
-                  content: t('通过组织加入的 不允许 续期/移出/移交'),
+                  content: t('通过组织加入的 不允许 续期/退出/移交'),
                   disabled: row.removeMemberButtonControl !== 'DEPARTMENT'
                 }"
               >
@@ -120,7 +126,7 @@
                 @click="handleHandOver(row, index)"
                 :disabled="row.isExpired || row.removeMemberButtonControl === 'DEPARTMENT' || row.beingHandedOver "
                 v-bk-tooltips="{
-                  content: row.isExpired ? t('已过期，无需移交') : row.removeMemberButtonControl === 'DEPARTMENT' ? t('通过组织加入的 不允许 续期/移出/移交') : row.beingHandedOver ? t('等待审核中') : '',
+                  content: row.isExpired ? t('已过期，无需移交') : row.removeMemberButtonControl === 'DEPARTMENT' ? t('通过组织加入的 不允许 续期/退出/移交') : row.beingHandedOver ? t('等待审核中') : '',
                   disabled: !row.isExpired && row.removeMemberButtonControl !== 'DEPARTMENT' && !row.beingHandedOver
                 }"
               >
@@ -133,11 +139,11 @@
               :disabled="row.removeMemberButtonControl != 'OTHER' || row.beingHandedOver"
               @click="handleRemove(row, index)"
               v-bk-tooltips="{
-                content: TOOLTIPS_CONTENT[row.removeMemberButtonControl] || t('等待审核中, 不能移出'),
+                content: TOOLTIPS_CONTENT[row.removeMemberButtonControl] || t('等待审核中, 不能退出'),
                 disabled: row.removeMemberButtonControl === 'OTHER' && !row.beingHandedOver
               }"
             >
-              {{t("移出")}}
+              {{t("退出")}}
             </bk-button>
           </div>
         </template>
@@ -200,13 +206,12 @@ const curSelectedData = ref([]);
 const isCurrentAll = ref(false);
 const selectedResourceCode = computed(() => isCurrentAll.value ? tableList.value.map(i => i.resourceCode) : curSelectedData.value.map(i => i.resourceCode));
 const resourceType = computed(() => props.resourceType);
-const groupTotal = computed(() => props.groupTotal);
 const remainingCount = computed(()=> props.groupTotal - props.data.length);
 const TOOLTIPS_CONTENT = {
-  UNIQUE_MANAGER: t('唯一管理员，不可移出。请添加新的管理员后再移出'),
-  UNIQUE_OWNER: t('唯一拥有者，不可移出。请添加新的拥有者后再移出'),
-  TEMPLATE: t('通过用户组加入，不可直接移出。如需调整，请编辑用户组'),
-  DEPARTMENT: t('通过组织加入的 不允许 续期/移出/移交')
+  UNIQUE_MANAGER: t('唯一管理员，不可退出。请添加新的管理员后再退出'),
+  UNIQUE_OWNER: t('唯一拥有者，不可退出。请添加新的拥有者后再退出'),
+  TEMPLATE: t('通过用户组加入，不可直接退出。如需调整，请编辑用户组'),
+  DEPARTMENT: t('通过组织加入的 不允许 续期/退出/移交')
 }
 const projectId = computed(() => route.params?.projectCode || route.query?.projectCode);
 const tableList = computed(() => props.data.map(item => ({
@@ -243,9 +248,9 @@ function getUnableMessage(row) {
       }
     case 'handover':
       if (row.removeMemberButtonControl === 'TEMPLATE') {
-        return t('通过用户组获得权限，请到用户组里移出用户');
+        return t('通过用户组获得权限，请到用户组里退出用户');
       } else if (row.removeMemberButtonControl === 'DEPARTMENT') {
-        return t('通过组织加入的 不允许 续期/移出/移交');
+        return t('通过组织加入的 不允许 续期/退出/移交');
       }  else if (row.isExpired) {
         return t('已过期，无需移交')
       }
@@ -256,13 +261,17 @@ function getUnableMessage(row) {
       return '';
   }
 }
+function disabledRowSelect({ row }) {
+  return !row.beingHandedOver
+}
 /**
  * 当前页全选事件
  */
 function handleSelectAll({checked}) {
   if (checked) {
-    emit('getSelectList', tableList.value, resourceType.value);
-    curSelectedData.value = tableList.value;
+    const selectionList = refTable.value.getSelection();
+    emit('getSelectList', selectionList, resourceType.value);
+    curSelectedData.value = selectionList;
     isCurrentAll.value = false;
   } else {
     handleClear()
@@ -282,7 +291,7 @@ function handleSelectionChange() {
  */
 function handleSelectAllData() {
   const selectLength = refTable.value.getSelection().length
-  if (selectLength != props.data.length) {
+  if (selectLength != props.data.length && curSelectedData.value.length !== tableList.value.filter(i => !i.beingHandedOver).length) {
     refTable.value.toggleAllSelection();
   }
   emit('handleSelectAllData', resourceType.value)
@@ -311,7 +320,7 @@ function handleHandOver(row, index) {
   emit('handleHandOver', row, resourceType.value, index);
 }
 /**
- * 移出按钮点击
+ * 退出按钮点击
  * @param row 行数据
  */
 function handleRemove(row, index) {

diff --git a/src/frontend/devops-permission/src/http/api.ts b/src/frontend/devops-permission/src/http/api.ts
@@ -169,7 +169,7 @@ export default {
     return fetch.post(`${apiPerfix}/auth/handover/listGroupsOfHandover`, params);
   },
   /**
-   * 获取移交移出时的单条数据
+   * 获取移交退出时的单条数据
    */
   getMemberGroupDetails(projectId: string, resourceType: string, groupId: number, memberId: string) {
     return fetch.get(`${apiPerfix}/auth/resource/group/${projectId}/${resourceType}/${groupId}/getMemberGroupDetails?memberId=${memberId}`);
@@ -187,7 +187,7 @@ export default {
     return fetch.post(`${apiPerfix}/auth/handover/handleHanoverApplication`, params);
   },
   /**
-  * 单条移出
+  * 单条退出
   */
   getIsDirectRemove(projectId: string, groupId: number, params: any) {
     return fetch.DELETE(`${apiPerfix}/auth/resource/member/${projectId}/single/${groupId}/${OPERATE_CHANNEL}/remove`, params);

diff --git a/src/frontend/devops-permission/src/store/userGroupTable.ts b/src/frontend/devops-permission/src/store/userGroupTable.ts
@@ -253,7 +253,7 @@ export default defineStore('userGroupTable', () => {
     isShowHandover.value = true;
   }
   /**
-   * 移出按钮点击
+   * 退出按钮点击
    * @param row 行数据
    */
   function handleRemove(row: GroupTableType, resourceType: string, index: number) {
@@ -380,7 +380,7 @@ export default defineStore('userGroupTable', () => {
     let item = sourceList.value.find((item: SourceType) => item.resourceType == resourceType);
     if (item) {
       item.isAll = true;
-      selectedData[resourceType] = item.tableData
+      selectedData[resourceType] = item.tableData.filter(i => !i.beingHandedOver)
     }
   }
   /**

diff --git a/src/frontend/devops-permission/src/utils/constants.js b/src/frontend/devops-permission/src/utils/constants.js
@@ -12,7 +12,7 @@ export const batchOperateTypes = {
 
 export const batchMassageText = {
   handover: '用户组权限已移交',
-  remove: '用户组已移出',
+  remove: '用户组已退出',
 }
 
 export const btnTexts = {
@@ -27,5 +27,5 @@ export const batchTitle = {
 export const unableText = {
   renewal: '无法续期',
   handover: '无法移交',
-  remove: '无法移出',
+  remove: '无法退出',
 }