feat: 分组管理增加跨页全选功能 --story=118110616

bcs-services/bcs-bscp/ui/src/api/client.ts

@@ -160,8 +160,8 @@ export const getClientCommonlyUsedNameCheck = (bizId: string, appId: number, nam
  * @param ids 客户端ID
  * @returns
  */
-export const retryClients = (bizId: string, appId: number, ids: number[]) =>
-  http.post(`/config/biz/${bizId}/apps/${appId}/clients/retry`, { client_ids: ids, all: false });
+export const retryClients = (bizId: string, appId: number, ids: number[], exclusion_operation: boolean) =>
+  http.post(`/config/biz/${bizId}/apps/${appId}/clients/retry`, { client_ids: ids, all: false, exclusion_operation });
 
 /**
  *  获取集群列表

bcs-services/bcs-bscp/ui/src/api/config.ts

@@ -415,10 +415,20 @@ export const updateBoundTemplateVersion = (
  * @returns
  */
 export const deleteBoundPkg = (bizId: string, appId: number, bindingId: number, template_set_ids: number[]) =>
-  http.delete(`/config/biz/${bizId}/apps/${appId}/template_bindings/${bindingId}/template_sets`, {
+  http.delete(`/config/biz/${bizId}/apps/${appId}/template_bindings/${bindingId}/template_set`, {
     params: { template_set_ids: template_set_ids.join(',') },
   });
 
+/**
+ * 删除服务下绑定的模板套餐
+ * @param bizId 业务ID
+ * @param appId 应用ID
+ * @param id 配置ID
+ * @returns
+ */
+export const deleteCurrBoundPkg = (bizId: string, appId: number, id: number) =>
+  http.delete(`/config/biz/${bizId}/apps/${appId}/template_set/${id}`);
+
 /**
  * 导入非模板配置文件压缩包
  * @param biz_id 业务ID

bcs-services/bcs-bscp/ui/src/api/script.ts

@@ -61,10 +61,13 @@ export const deleteScript = (biz_id: string, id: number) =>
  * 批量删除脚本
  * @param biz_id 空间ID
  * @param ids 脚本ID列表
+ * @param exclusion_operation 是否跨页
  * @returns
  */
-export const batchDeleteScript = (biz_id: string, ids: number[]) =>
-  http.post(`/config/biz/${biz_id}/hooks/batch_delete`, { force: true, ids }).then((res) => res.data);
+export const batchDeleteScript = (biz_id: string, ids: number[], exclusion_operation: boolean) =>
+  http
+    .post(`/config/biz/${biz_id}/hooks/batch_delete`, { force: false, ids, exclusion_operation })
+    .then((res) => res.data);
 
 /**
  * 获取脚本标签列表

bcs-services/bcs-bscp/ui/src/api/template.ts

@@ -300,11 +300,7 @@ export const downloadTemplateContent = (biz_id: string, templateSpaceId: number,
  * @param signature 文件内容的SHA256值
  * @returns
  */
-export const getTemplateUploadFileIsExist = (
-  bizId: string,
-  templateSpaceId: number,
-  signature: string,
-) =>
+export const getTemplateUploadFileIsExist = (bizId: string, templateSpaceId: number, signature: string) =>
   http
     .get(`/biz/${bizId}/content/metadata`, {
       headers: {
@@ -319,11 +315,17 @@ export const getTemplateUploadFileIsExist = (
  * @param biz_id 业务ID
  * @param template_space_id 空间ID
  * @param template_ids 模板ID列表
+ * @param exclusion_operation 是否跨页全选
  * @returns
  */
-export const deleteTemplate = (biz_id: string, template_space_id: number, template_ids: number[]) =>
+export const deleteTemplate = (
+  biz_id: string,
+  template_space_id: number,
+  template_ids: number[],
+  exclusion_operation: boolean,
+) =>
   http.delete(`/config/biz/${biz_id}/template_spaces/${template_space_id}/templates`, {
-    params: { template_ids: template_ids.join(',') },
+    params: { template_ids: template_ids.join(','), exclusion_operation },
   });
 
 /**
@@ -341,37 +343,57 @@ export const getTemplatesDetailByIds = (biz_id: string, ids: number[]) =>
  * @param template_space_id 空间ID
  * @param template_id 模板ID
  * @param template_set_ids 模板套餐列表
+ * @param exclusion_operation 是否跨页全选
+ * @param template_set_id 正在操作的套餐id，全部套餐和未指定套餐传0
+ * @param no_set_specified 是否未指定套餐
  * @returns
  */
 export const addTemplateToPackage = (
   biz_id: string,
   template_space_id: number,
   template_ids: number[],
   template_set_ids: number[],
+  exclusion_operation: boolean,
+  template_set_id: number | string,
+  no_set_specified: boolean,
 ) =>
-  http.post(`/config/biz/${biz_id}/template_spaces/${template_space_id}/templates/add_to_template_sets`, {
-    template_ids,
-    template_set_ids,
-  });
+  http.post(
+    `/config/biz/${biz_id}/template_spaces/${template_space_id}/template_set/${template_set_id}/templates/add_to_template_sets`,
+    {
+      template_set_ids,
+      template_ids,
+      exclusion_operation,
+      no_set_specified,
+    },
+  );
 
 /**
  * 将模版移出套餐(多个模板移出多个套餐)
  * @param biz_id 业务ID
  * @param template_space_id 空间ID
  * @param template_id 模板ID
  * @param template_set_ids 模板套餐列表
+ * @param exclusion_operation 是否跨页全选
+ * @param template_set_id 正在操作的套餐id，全部套餐和未指定套餐传0
+ * @param no_set_specified 是否未指定套餐
  * @returns
  */
 export const moveOutTemplateFromPackage = (
   biz_id: string,
   template_space_id: number,
   template_ids: number[],
   template_set_ids: number[],
+  exclusion_operation: boolean,
+  template_set_id: number | string,
 ) =>
-  http.post(`/config/biz/${biz_id}/template_spaces/${template_space_id}/templates/delete_from_template_sets`, {
-    template_ids,
-    template_set_ids,
-  });
+  http.post(
+    `/config/biz/${biz_id}/template_spaces/${template_space_id}/template_set/${template_set_id}/templates/delete_from_template_sets`,
+    {
+      template_ids,
+      template_set_ids,
+      exclusion_operation,
+    },
+  );
 
 /**
  * 查询单个模板被套餐引用详情
@@ -699,10 +721,16 @@ export const importTemplateBatchAdd = (
  * @param biz_id 业务ID
  * @param template_space_id 空间id
  * @param configData 配置列表
+ * @param exclusion_operation // 是否跨页
+ * @param template_set_id // 正在操作的套餐id，全部套餐和未指定传0
+ * @param no_set_specified // 是否未指定套餐
  * @returns
  */
 export const batchEditTemplatePermission = (biz_id: string, query: any) =>
-  http.post(`/config/biz/${biz_id}/templates/batch_update_templates_permissions`, query);
+  http.post(
+    `/config/biz/${biz_id}/template_spaces/${query.template_space_id}/template_set/${query.template_set_id}/templates/batch_update_templates_permissions`,
+    query,
+  );
 
 /**
  * 获取配置模板配置项元信息

bcs-services/bcs-bscp/ui/src/api/variable.ts

@@ -46,9 +46,10 @@ export const deleteVariable = (biz_id: string, template_variable_id: number) =>
  * 批量删除变量
  * @param bizId 业务ID
  * @param ids 变量ID列表
+ * @param exclusion_operation 是否跨页
  */
-export const batchDeleteVariable = (biz_id: string, ids: number[]) =>
-  http.post(`/config/biz/${biz_id}/template_variables/batch_delete`, { ids });
+export const batchDeleteVariable = (biz_id: string, ids: number[], exclusion_operation: boolean) =>
+  http.post(`/config/biz/${biz_id}/template_variables/batch_delete`, { ids, exclusion_operation });
 
 /**
  * 获取未命名版本服务变量列表

bcs-services/bcs-bscp/ui/src/components/across-check-table-tip.vue

@@ -0,0 +1,89 @@
+<template>
+  <div v-show="selectType !== CheckType.Uncheck" class="selections-style">
+    {{ t('已选择', { count: isFullDataMode ? selectionsLength : showSelectedLength }) }},
+    <span
+      class="checked-em"
+      v-show="(isFullDataMode ? selectionsLength : showSelectedLength) < dataLength"
+      @click="selectTypeChange">
+      {{ t('选择所有', { count: dataLength }) }}
+    </span>
+    <span
+      class="checked-em"
+      v-show="(isFullDataMode ? selectionsLength : showSelectedLength) === dataLength"
+      @click="clearSelection">
+      {{ t('取消选择所有数据') }}
+    </span>
+  </div>
+</template>
+<script lang="ts" setup>
+  import { computed } from 'vue';
+  import CheckType from '../../types/across-checked';
+  import { useI18n } from 'vue-i18n';
+
+  const { t } = useI18n();
+
+  const props = withDefaults(
+    defineProps<{
+      dataLength: number;
+      selectionsLength: number;
+      isFullDataMode: boolean;
+      selectType: number;
+      crossPageSelect: boolean;
+      handleSelectTypeChange: Function;
+      handleClearSelection: Function;
+    }>(),
+    {
+      dataLength: 0,
+      selectionsLength: 0,
+      isFullDataMode: false,
+      selectType: CheckType.Uncheck,
+      crossPageSelect: true,
+      handleSelectTypeChange: () => {},
+      handleClearSelection: () => {},
+    },
+  );
+  // 已选择数据长度展示
+  const showSelectedLength = computed(() => {
+    const { selectType, selectionsLength, dataLength } = props;
+    return [CheckType.HalfChecked, CheckType.Checked].includes(selectType)
+      ? selectionsLength
+      : dataLength - selectionsLength;
+  });
+
+  // 根据是否提供全选/跨页全选功能，判断当前页全选/跨页全选
+  const selectTypeChange = () => {
+    if (props.crossPageSelect) {
+      // 跨页全选
+      props.handleSelectTypeChange(CheckType.AcrossChecked);
+    } else {
+      // 当前页全选
+      props.handleSelectTypeChange(CheckType.Checked);
+    }
+  };
+  const clearSelection = () => {
+    props.handleClearSelection();
+  };
+</script>
+<style lang="scss" scoped>
+  .selections-style {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    height: 30px;
+    font-size: 12px;
+    color: #63656e;
+    background: #ebecf0;
+    .checked-number {
+      padding: 0 5px;
+      font-weight: 700;
+    }
+    .checked-em {
+      margin-left: 5px;
+      color: #3a84ff;
+      cursor: pointer;
+      &:hover {
+        color: #699df4;
+      }
+    }
+  }
+</style>