feat: 批量编辑支持清空已有标签调整联调

frontend/src/enums/commonEnum.ts

@@ -34,3 +34,9 @@ export enum ShapeFlags {
   COMPONENT_SHOULD_KEEP_ALIVE = 256,
   COMPONENT_KEPT_ALIVE = 512,
 }
+
+export enum TagUpdateTypeEnum {
+  UPDATE = 'UPDATE',
+  APPEND = 'APPEND',
+  CLEAR = 'CLEAR',
+}

frontend/src/locale/en-US/common.ts

@@ -209,4 +209,6 @@ export default {
   'common.copySuccessToClipboard': 'Copied to clipboard',
   'common.casePriority': 'Case Priority',
   'common.currentUser': 'Current user',
+  'common.type': 'Type',
+  'common.batchUpdate': 'Updated to',
 };

frontend/src/locale/zh-CN/common.ts

@@ -209,4 +209,6 @@ export default {
   'common.copySuccessToClipboard': '已复制到剪切板',
   'common.casePriority': '用例等级',
   'common.currentUser': '当前用户',
+  'common.type': '类型',
+  'common.batchUpdate': '更新为',
 };

frontend/src/models/apiTest/management.ts

@@ -199,6 +199,7 @@ export interface ApiDefinitionBatchUpdateParams extends ApiDefinitionBatchParams
   versionId?: string;
   tags?: string[];
   customField?: Record<string, any>;
+  clear?: boolean; // 是否清空标签
 }
 // 批量移动定义参数
 export interface ApiDefinitionBatchMoveParams extends ApiDefinitionBatchParams {
@@ -355,6 +356,7 @@ export interface ApiCaseBatchEditParams extends ApiCaseBatchParams {
   environmentId?: string;
   type: string;
   append?: boolean;
+  clear?: boolean;
 }
 // 添加用例参数
 export interface AddApiCaseParams extends ExecuteRequestParams {

frontend/src/models/apiTest/mock.ts

@@ -92,4 +92,5 @@ export interface BatchEditMockParams extends BatchApiParams {
   append: boolean; // 是否追加
   enable: boolean; // 是否启用
   protocols: string[]; // 协议集合
+  clear?: boolean; // 是否清空标签
 }

frontend/src/views/api-test/management/components/management/api/apiTable.vue

@@ -136,8 +136,20 @@
       </a-form-item>
       <a-form-item
         v-if="batchForm.attr === 'tags'"
+        :class="`${selectedTagType === TagUpdateTypeEnum.CLEAR ? 'mb-0' : 'mb-[16px]'}`"
+        field="type"
+        :label="t('common.type')"
+      >
+        <a-radio-group v-model:model-value="selectedTagType" size="small">
+          <a-radio :value="TagUpdateTypeEnum.UPDATE"> {{ t('common.update') }}</a-radio>
+          <a-radio :value="TagUpdateTypeEnum.APPEND"> {{ t('caseManagement.featureCase.appendTag') }}</a-radio>
+          <a-radio :value="TagUpdateTypeEnum.CLEAR">{{ t('common.clear') }}</a-radio>
+        </a-radio-group>
+      </a-form-item>
+      <a-form-item
+        v-if="batchForm.attr === 'tags' && selectedTagType !== TagUpdateTypeEnum.CLEAR"
         field="values"
-        :label="t('apiTestManagement.batchUpdate')"
+        :label="t('common.batchUpdate')"
         :validate-trigger="['blur', 'input']"
         :rules="[{ required: true, message: t('common.inputPleaseEnterTags') }]"
         asterisk-position="end"
@@ -155,9 +167,9 @@
         <div class="text-[12px] leading-[20px] text-[var(--color-text-4)]">{{ t('ms.tagsInput.tagLimitTip') }}</div>
       </a-form-item>
       <a-form-item
-        v-else
+        v-if="batchForm.attr !== 'tags' && selectedTagType !== TagUpdateTypeEnum.CLEAR"
         field="value"
-        :label="t('apiTestManagement.batchUpdate')"
+        :label="t('common.batchUpdate')"
         :rules="[{ required: true, message: t('apiTestManagement.valueRequired') }]"
         asterisk-position="end"
         class="mb-0"
@@ -176,26 +188,7 @@
       </a-form-item>
     </a-form>
     <template #footer>
-      <div class="flex" :class="[batchForm.attr === 'tags' ? 'justify-between' : 'justify-end']">
+      <div class="flex justify-end">
-        <div
-          v-if="batchForm.attr === 'tags'"
-          class="flex flex-row items-center justify-center"
-          style="padding-top: 10px"
-        >
-          <a-switch v-model="batchForm.append" class="mr-1" size="small" type="line" />
-          <span class="flex items-center">
-            <span class="mr-1">{{ t('caseManagement.featureCase.appendTag') }}</span>
-            <span class="mt-[2px]">
-              <a-tooltip>
-                <IconQuestionCircle class="h-[16px] w-[16px] text-[rgb(var(--primary-5))]" />
-                <template #content>
-                  <div>{{ t('caseManagement.featureCase.enableTags') }}</div>
-                  <div>{{ t('caseManagement.featureCase.closeTags') }}</div>
-                </template>
-              </a-tooltip>
-            </span>
-          </span>
-        </div>
         <div class="flex justify-end">
           <a-button type="secondary" :disabled="batchUpdateLoading" @click="cancelBatch">
             {{ t('common.cancel') }}
@@ -335,6 +328,7 @@
   import { FilterType, ViewTypeEnum } from '@/enums/advancedFilterEnum';
   import { RequestDefinitionStatus, RequestExportFormat, RequestMethods } from '@/enums/apiEnum';
   import { CacheTabTypeEnum } from '@/enums/cacheTabEnum';
+  import { TagUpdateTypeEnum } from '@/enums/commonEnum';
   import { TableKeyEnum } from '@/enums/tableEnum';
   import { FilterRemoteMethodsEnum, FilterSlotNameEnum } from '@/enums/tableFilterEnum';
 
@@ -558,6 +552,7 @@
       width: operationWidth(215, hasOperationPermission.value ? 200 : 50),
     },
   ];
+  const selectedTagType = ref<TagUpdateTypeEnum>(TagUpdateTypeEnum.UPDATE);
 
   function initFilterColumn() {
     columns = columns.map((item) => {
@@ -998,7 +993,8 @@
             excludeIds: batchParams.value?.excludeIds || [],
             ...batchConditionParams,
             type: batchForm.value.attr,
-            append: batchForm.value.append,
+            append: selectedTagType.value === TagUpdateTypeEnum.APPEND,
+            clear: selectedTagType.value === TagUpdateTypeEnum.CLEAR,
             [batchForm.value.attr]: batchForm.value.attr === 'tags' ? batchForm.value.values : batchForm.value.value,
           });
           Message.success(t('common.updateSuccess'));

frontend/src/views/api-test/management/components/management/case/caseTable.vue

@@ -209,10 +209,22 @@
       </a-form-item>
       <a-form-item
         v-if="batchForm.attr === 'tags'"
+        :class="`${selectedTagType === TagUpdateTypeEnum.CLEAR ? 'mb-0' : 'mb-[16px]'}`"
+        field="type"
+        :label="t('common.type')"
+      >
+        <a-radio-group v-model:model-value="selectedTagType" size="small">
+          <a-radio :value="TagUpdateTypeEnum.UPDATE"> {{ t('common.update') }}</a-radio>
+          <a-radio :value="TagUpdateTypeEnum.APPEND"> {{ t('caseManagement.featureCase.appendTag') }}</a-radio>
+          <a-radio :value="TagUpdateTypeEnum.CLEAR">{{ t('common.clear') }}</a-radio>
+        </a-radio-group>
+      </a-form-item>
+      <a-form-item
+        v-if="batchForm.attr === 'tags' && selectedTagType !== TagUpdateTypeEnum.CLEAR"
         field="values"
-        :label="t('apiTestManagement.batchUpdate')"
+        :label="t('common.batchUpdate')"
         :validate-trigger="['blur', 'input']"
-        :rules="[{ required: true, message: t('common.inputPleaseEnterTags') }]"
+        :rules="[{ required: false, message: t('common.inputPleaseEnterTags') }]"
         asterisk-position="end"
         class="mb-0"
         required
@@ -228,9 +240,9 @@
         <div class="text-[12px] leading-[20px] text-[var(--color-text-4)]">{{ t('ms.tagsInput.tagLimitTip') }}</div>
       </a-form-item>
       <a-form-item
-        v-else
+        v-if="batchForm.attr !== 'tags'"
         field="value"
-        :label="t('apiTestManagement.batchUpdate')"
+        :label="t('common.batchUpdate')"
         :rules="[{ required: true, message: t('apiTestManagement.valueRequired') }]"
         asterisk-position="end"
         class="mb-0"
@@ -243,26 +255,7 @@
       </a-form-item>
     </a-form>
     <template #footer>
-      <div class="flex" :class="[batchForm.attr === 'tags' ? 'justify-between' : 'justify-end']">
+      <div class="flex justify-end">
-        <div
-          v-if="batchForm.attr === 'tags'"
-          class="flex flex-row items-center justify-center"
-          style="padding-top: 10px"
-        >
-          <a-switch v-model="batchForm.append" class="mr-1" size="small" type="line" />
-          <span class="flex items-center">
-            <span class="mr-1">{{ t('caseManagement.featureCase.appendTag') }}</span>
-            <span class="mt-[2px]">
-              <a-tooltip>
-                <IconQuestionCircle class="h-[16px] w-[16px] text-[rgb(var(--primary-5))]" />
-                <template #content>
-                  <div>{{ t('caseManagement.featureCase.enableTags') }}</div>
-                  <div>{{ t('caseManagement.featureCase.closeTags') }}</div>
-                </template>
-              </a-tooltip>
-            </span>
-          </span>
-        </div>
         <div class="flex justify-end">
           <a-button type="secondary" :disabled="batchEditLoading" @click="cancelBatchEdit">
             {{ t('common.cancel') }}
@@ -370,6 +363,7 @@
   import { DragSortParams } from '@/models/common';
   import { RequestCaseStatus } from '@/enums/apiEnum';
   import { CacheTabTypeEnum } from '@/enums/cacheTabEnum';
+  import { TagUpdateTypeEnum } from '@/enums/commonEnum';
   import { ReportEnum, ReportStatus } from '@/enums/reportEnum';
   import { TableKeyEnum } from '@/enums/tableEnum';
   import { FilterRemoteMethodsEnum, FilterSlotNameEnum } from '@/enums/tableFilterEnum';
@@ -855,6 +849,8 @@
       append: false,
     };
   }
+  const selectedTagType = ref<TagUpdateTypeEnum>(TagUpdateTypeEnum.UPDATE);
+
   function handleBatchEditCase() {
     batchFormRef.value?.validate(async (errors) => {
       if (!errors) {
@@ -867,7 +863,8 @@
             excludeIds: batchParams.value?.excludeIds || [],
             ...batchConditionParams,
             type: batchForm.value.attr.charAt(0).toUpperCase() + batchForm.value.attr.slice(1), // 首字母大写
-            append: batchForm.value.append,
+            append: selectedTagType.value === TagUpdateTypeEnum.APPEND,
+            clear: selectedTagType.value === TagUpdateTypeEnum.CLEAR,
             [batchForm.value.attr]: batchForm.value.attr === 'tags' ? batchForm.value.values : batchForm.value.value,
           });
           Message.success(t('common.updateSuccess'));

frontend/src/views/api-test/management/components/management/mock/mockTable.vue

@@ -122,8 +122,20 @@
       </a-form-item>
       <a-form-item
         v-if="batchForm.attr === 'Tags'"
+        :class="`${selectedTagType === TagUpdateTypeEnum.CLEAR ? 'mb-0' : 'mb-[16px]'}`"
+        field="type"
+        :label="t('common.type')"
+      >
+        <a-radio-group v-model:model-value="selectedTagType" size="small">
+          <a-radio :value="TagUpdateTypeEnum.UPDATE"> {{ t('common.update') }}</a-radio>
+          <a-radio :value="TagUpdateTypeEnum.APPEND"> {{ t('caseManagement.featureCase.appendTag') }}</a-radio>
+          <a-radio :value="TagUpdateTypeEnum.CLEAR">{{ t('common.clear') }}</a-radio>
+        </a-radio-group>
+      </a-form-item>
+      <a-form-item
+        v-if="batchForm.attr === 'Tags' && selectedTagType !== TagUpdateTypeEnum.CLEAR"
         field="values"
-        :label="t('apiTestManagement.batchUpdate')"
+        :label="t('common.batchUpdate')"
         :validate-trigger="['blur', 'input']"
         :rules="[{ required: true, message: t('common.inputPleaseEnterTags') }]"
         asterisk-position="end"
@@ -141,9 +153,9 @@
         <div class="text-[12px] leading-[20px] text-[var(--color-text-4)]">{{ t('ms.tagsInput.tagLimitTip') }}</div>
       </a-form-item>
       <a-form-item
-        v-else
+        v-if="batchForm.attr !== 'Tags'"
         field="value"
-        :label="t('apiTestManagement.batchUpdate')"
+        :label="t('common.batchUpdate')"
         :rules="[{ required: true, message: t('apiTestManagement.valueRequired') }]"
         asterisk-position="end"
         class="mb-0"
@@ -159,26 +171,7 @@
       </a-form-item>
     </a-form>
     <template #footer>
-      <div class="flex" :class="[batchForm.attr === 'Tags' ? 'justify-between' : 'justify-end']">
+      <div class="flex justify-end">
-        <div
-          v-if="batchForm.attr === 'Tags'"
-          class="flex flex-row items-center justify-center"
-          style="padding-top: 10px"
-        >
-          <a-switch v-model="batchForm.append" class="mr-1" size="small" type="line" />
-          <span class="flex items-center">
-            <span class="mr-1">{{ t('caseManagement.featureCase.appendTag') }}</span>
-            <span class="mt-[2px]">
-              <a-tooltip>
-                <IconQuestionCircle class="h-[16px] w-[16px] text-[rgb(var(--primary-5))]" />
-                <template #content>
-                  <div>{{ t('caseManagement.featureCase.enableTags') }}</div>
-                  <div>{{ t('caseManagement.featureCase.closeTags') }}</div>
-                </template>
-              </a-tooltip>
-            </span>
-          </span>
-        </div>
         <div class="flex justify-end">
           <a-button type="secondary" :disabled="batchUpdateLoading" @click="cancelBatch">
             {{ t('common.cancel') }}
@@ -238,6 +231,7 @@
   import { MockDetail } from '@/models/apiTest/mock';
   import { RequestComposition } from '@/enums/apiEnum';
   import { CacheTabTypeEnum } from '@/enums/cacheTabEnum';
+  import { TagUpdateTypeEnum } from '@/enums/commonEnum';
   import { TableKeyEnum } from '@/enums/tableEnum';
 
   defineOptions({
@@ -568,6 +562,7 @@
 
   const showBatchModal = ref(false);
   const batchUpdateLoading = ref(false);
+
   const batchFormRef = ref<FormInstance>();
   const batchForm = ref({
     attr: 'Status' as 'Status' | 'Tags',
@@ -596,6 +591,7 @@
       append: false,
     };
   }
+  const selectedTagType = ref<TagUpdateTypeEnum>(TagUpdateTypeEnum.UPDATE);
 
   function batchUpdate() {
     batchFormRef.value?.validate(async (errors) => {
@@ -612,10 +608,11 @@
             projectId: appStore.currentProjectId,
             moduleIds: await getModuleIds(),
             type: batchForm.value.attr,
-            append: batchForm.value.append,
+            append: selectedTagType.value === TagUpdateTypeEnum.APPEND,
             tags: batchForm.value.attr === 'Tags' ? batchForm.value.values : [],
             enable: batchForm.value.attr === 'Status' ? batchForm.value.value : false,
             protocols: props.selectedProtocols,
+            clear: selectedTagType.value === TagUpdateTypeEnum.CLEAR,
           });
           Message.success(t('common.updateSuccess'));
           cancelBatch();

frontend/src/views/api-test/management/locale/en-US.ts

@@ -57,7 +57,6 @@ export default {
   'apiTestManagement.batchModalSubTitle': '(Selected {count} APIs)',
   'apiTestManagement.chooseAttr': 'Choose Attribute',
   'apiTestManagement.attrRequired': 'Attribute cannot be empty',
-  'apiTestManagement.batchUpdate': 'Batch Update to',
   'apiTestManagement.valueRequired': 'Value cannot be empty',
   'apiTestManagement.envRequired': 'Environment value cannot be empty',
   'apiTestManagement.reportNameRequired': 'Report name cannot be empty',

frontend/src/views/api-test/management/locale/zh-CN.ts

@@ -56,7 +56,6 @@ export default {
   'apiTestManagement.batchModalSubTitle': '（已选 {count} 个接口）',
   'apiTestManagement.chooseAttr': '选择属性',
   'apiTestManagement.attrRequired': '属性不能为空',
-  'apiTestManagement.batchUpdate': '批量更新为',
   'apiTestManagement.valueRequired': '属性值不能为空',
   'apiTestManagement.envRequired': '环境值不能为空',
   'apiTestManagement.reportNameRequired': '报告名称不能为空',

frontend/src/views/api-test/scenario/components/scenarioTable.vue

@@ -336,8 +336,20 @@
       </a-form-item>
       <a-form-item
         v-if="batchForm.attr === 'Tags'"
+        :class="`${selectedTagType === TagUpdateTypeEnum.CLEAR ? 'mb-0' : 'mb-[16px]'}`"
+        field="type"
+        :label="t('common.type')"
+      >
+        <a-radio-group v-model:model-value="selectedTagType" size="small">
+          <a-radio :value="TagUpdateTypeEnum.UPDATE"> {{ t('common.update') }}</a-radio>
+          <a-radio :value="TagUpdateTypeEnum.APPEND"> {{ t('caseManagement.featureCase.appendTag') }}</a-radio>
+          <a-radio :value="TagUpdateTypeEnum.CLEAR">{{ t('common.clear') }}</a-radio>
+        </a-radio-group>
+      </a-form-item>
+      <a-form-item
+        v-if="batchForm.attr === 'Tags' && selectedTagType !== TagUpdateTypeEnum.CLEAR"
         field="values"
-        :label="t('api_scenario.table.batchUpdate')"
+        :label="t('common.batchUpdate')"
         :validate-trigger="['blur', 'input']"
         :rules="[{ required: true, message: t('common.inputPleaseEnterTags') }]"
         asterisk-position="end"
@@ -357,7 +369,7 @@
       <a-form-item
         v-else-if="batchForm.attr === 'Priority'"
         field="value"
-        :label="t('api_scenario.table.batchUpdate')"
+        :label="t('common.batchUpdate')"
         :rules="[{ required: true, message: t('api_scenario.table.valueRequired') }]"
         asterisk-position="end"
         class="mb-0"
@@ -371,7 +383,7 @@
       <a-form-item
         v-else-if="batchForm.attr === 'Environment'"
         field="value"
-        :label="t('api_scenario.table.batchUpdate')"
+        :label="t('common.batchUpdate')"
         :rules="[{ required: true, message: t('api_scenario.table.valueRequired') }]"
         asterisk-position="end"
         class="mb-0"
@@ -383,9 +395,9 @@
         </a-select>
       </a-form-item>
       <a-form-item
-        v-else
+        v-else-if="batchForm.attr !== 'Tags'"
         field="value"
-        :label="t('api_scenario.table.batchUpdate')"
+        :label="t('common.batchUpdate')"
         :rules="[{ required: true, message: t('api_scenario.table.valueRequired') }]"
         asterisk-position="end"
         class="mb-0"
@@ -398,26 +410,7 @@
       </a-form-item>
     </a-form>
     <template #footer>
-      <div class="flex" :class="[batchForm.attr === 'Tags' ? 'justify-between' : 'justify-end']">
+      <div class="flex justify-end">
-        <div
-          v-if="batchForm.attr === 'Tags'"
-          class="flex flex-row items-center justify-center"
-          style="padding-top: 10px"
-        >
-          <a-switch v-model="batchForm.append" class="mr-1" size="small" type="line" />
-          <span class="flex items-center">
-            <span class="mr-1">{{ t('caseManagement.featureCase.appendTag') }}</span>
-            <span class="mt-[2px]">
-              <a-tooltip>
-                <IconQuestionCircle class="h-[16px] w-[16px] text-[rgb(var(--primary-5))]" />
-                <template #content>
-                  <div>{{ t('caseManagement.featureCase.enableTags') }}</div>
-                  <div>{{ t('caseManagement.featureCase.closeTags') }}</div>
-                </template>
-              </a-tooltip>
-            </span>
-          </span>
-        </div>
         <div class="flex justify-end">
           <a-button type="secondary" :disabled="batchUpdateLoading" @click="cancelBatch">
             {{ t('common.cancel') }}
@@ -429,7 +422,6 @@
       </div>
     </template>
   </a-modal>
-  <!--  </MsDialog>-->
   <a-modal
     v-model:visible="moveModalVisible"
     title-align="start"
@@ -543,6 +535,7 @@
   import { ResourcePoolItem } from '@/models/setting/resourcePool';
   import { ApiScenarioStatus } from '@/enums/apiEnum';
   import { CacheTabTypeEnum } from '@/enums/cacheTabEnum';
+  import { TagUpdateTypeEnum } from '@/enums/commonEnum';
   import { ReportEnum, ReportStatus } from '@/enums/reportEnum';
   import { TableKeyEnum } from '@/enums/tableEnum';
   import { FilterRemoteMethodsEnum, FilterSlotNameEnum } from '@/enums/tableFilterEnum';
@@ -1146,6 +1139,7 @@
 
   const showBatchModal = ref(false);
   const batchUpdateLoading = ref(false);
+  const selectedTagType = ref<TagUpdateTypeEnum>(TagUpdateTypeEnum.UPDATE);
 
   const batchFormRef = ref<FormInstance>();
 
@@ -1227,9 +1221,10 @@
             priority: '',
             status: '',
             tags: [],
-            append: batchForm.value.append,
+            append: selectedTagType.value === TagUpdateTypeEnum.APPEND,
             grouped: false,
             envId: '',
+            clear: selectedTagType.value === TagUpdateTypeEnum.CLEAR,
           };
 
           if (batchForm.value.attr === 'Priority') {

frontend/src/views/api-test/scenario/locale/en-US.ts

@@ -60,7 +60,6 @@ export default {
   'api_scenario.table.batchModalSubTitle': '(Selected {count} scenarios)',
   'api_scenario.table.chooseAttr': 'Choose Attribute',
   'api_scenario.table.attrRequired': 'Attribute cannot be empty',
-  'api_scenario.table.batchUpdate': 'Batch Update to',
   'api_scenario.table.valueRequired': 'Attribute value cannot be empty',
   'api_scenario.table.deleteScenarioTipTitle': 'Confirm Delete {name}?',
   'api_scenario.table.batchDeleteScenarioTip': 'Confirm delete {count} selected scenarios?',

frontend/src/views/api-test/scenario/locale/zh-CN.ts

@@ -70,7 +70,6 @@ export default {
   'api_scenario.table.batchModalSubTitle': '（已选 {count} 条场景）',
   'api_scenario.table.chooseAttr': '选择属性',
   'api_scenario.table.attrRequired': '属性不能为空',
-  'api_scenario.table.batchUpdate': '批量更新为',
   'api_scenario.table.valueRequired': '属性值不能为空',
   'api_scenario.table.deleteScenarioTipTitle': '确认删除 {name} 吗？',
   'api_scenario.table.batchDeleteScenarioTip': '确认删除已选中的 {count} 条场景吗？',

frontend/src/views/bug-management/components/batchEditModal.vue

@@ -24,7 +24,7 @@
         >
           <a-select
             v-model:model-value="form.attribute"
-            :place-holder="t('common.pleaseSelect')"
+            :placeholder="t('common.pleaseSelect')"
             @change="handleAttributeChange"
           >
             <a-optgroup :label="t('bugManagement.batchUpdate.systemFiled')">
@@ -52,6 +52,7 @@
               v-model:model-value="form.inputValue"
               :place-holder="t('common.pleaseSelect')"
               :disabled="!form.attribute"
+              :placeholder="t('common.pleaseSelect')"
             >
               <a-option v-for="item in customFiledOption" :key="item.value" :value="item.value">
                 {{ item.text }}
@@ -59,6 +60,31 @@
             </a-select>
           </template>
         </a-form-item>
+        <div v-else-if="valueMode === 'tags'">
+          <a-form-item class="mb-[16px]" field="type" :label="t('common.type')">
+            <a-radio-group v-model:model-value="selectedTagType" size="small">
+              <a-radio :value="TagUpdateTypeEnum.UPDATE"> {{ t('common.update') }}</a-radio>
+              <a-radio :value="TagUpdateTypeEnum.APPEND"> {{ t('caseManagement.featureCase.appendTag') }}</a-radio>
+              <a-radio :value="TagUpdateTypeEnum.CLEAR">{{ t('common.clear') }}</a-radio>
+            </a-radio-group>
+          </a-form-item>
+          <a-form-item
+            v-if="valueMode === 'tags' && selectedTagType !== TagUpdateTypeEnum.CLEAR"
+            field="value"
+            :validate-trigger="['blur', 'input']"
+            :label="t('common.batchUpdate')"
+            asterisk-position="end"
+            :rules="[{ required: true, message: t('common.inputPleaseEnterTags') }]"
+          >
+            <MsTagsInput
+              v-model:modelValue="form.value"
+              allow-clear
+              empty-priority-highest
+              :disabled="!form.attribute"
+            />
+            <div class="text-[12px] leading-[20px] text-[var(--color-text-4)]">{{ t('ms.tagsInput.tagLimitTip') }}</div>
+          </a-form-item>
+        </div>
         <a-form-item
           v-else
           field="value"
@@ -67,11 +93,7 @@
           :validate-trigger="['blur', 'input']"
           :rules="[{ required: true, message: t('common.inputPleaseEnterTags') }]"
         >
-          <template v-if="valueMode === 'tags'">
+          <template v-if="valueMode === 'user_selector'">
-            <MsTagsInput v-model:modelValue="form.value" empty-priority-highest :disabled="!form.attribute" />
-            <div class="text-[12px] leading-[20px] text-[var(--color-text-4)]">{{ t('ms.tagsInput.tagLimitTip') }}</div>
-          </template>
-          <template v-else-if="valueMode === 'user_selector'">
             <MsUserSelector
               v-model:model-value="form.value"
               :type="UserRequestTypeEnum.PROJECT_PERMISSION_MEMBER"
@@ -90,31 +112,15 @@
       </a-form>
     </div>
     <template #footer>
-      <div class="flex flex-row items-center justify-between">
+      <div class="flex flex-row items-center justify-end">
-        <div>
+        <div class="flex flex-row gap-[8px]">
-          <div v-if="showAppend" class="flex flex-row items-center gap-[4px]">
+          <a-button type="secondary" :loading="loading" @click="handleCancel">
-            <a-switch v-model:model-value="form.append" size="small" type="line" />
-            <span class="text-[var(--color-text-1)]">{{ t('bugManagement.batchUpdate.appendLabel') }}</span>
-            <a-tooltip position="top">
-              <template #content>
-                <div>{{ t('bugManagement.batchUpdate.openAppend') }}</div>
-                <div>{{ t('bugManagement.batchUpdate.closeAppend') }}</div>
-              </template>
-              <MsIcon
-                type="icon-icon-maybe_outlined"
-                class="text-[var(--color-text-4)] hover:text-[rgb(var(--primary-5))]"
-              />
-            </a-tooltip>
-          </div>
-        </div>
-        <div class="flex flex-row gap-[8px]"
-          ><a-button type="secondary" :loading="loading" @click="handleCancel">
             {{ t('common.cancel') }}
           </a-button>
           <a-button type="primary" :loading="loading" @click="handleConfirm">
             {{ t('common.update') }}
-          </a-button></div
+          </a-button>
-        >
+        </div>
       </div>
     </template>
   </a-modal>
@@ -136,6 +142,7 @@
   import type { BugBatchUpdateFiledType } from '@/models/bug-management';
   import { BugBatchUpdateFiledForm, BugEditCustomField } from '@/models/bug-management';
   import { SelectValue } from '@/models/projectManagement/menuManagement';
+  import { TagUpdateTypeEnum } from '@/enums/commonEnum';
 
   const { t } = useI18n();
   const props = defineProps<{
@@ -185,6 +192,7 @@
     form.value = [];
     form.inputValue = '';
     form.append = false;
+    valueMode.value = 'single_select';
   };
 
   const handleCancel = () => {
@@ -222,6 +230,7 @@
       }
     }
   };
+  const selectedTagType = ref<TagUpdateTypeEnum>(TagUpdateTypeEnum.UPDATE);
 
   const handleConfirm = () => {
     formRef.value?.validate(async (errors: undefined | Record<string, ValidatedError>) => {
@@ -232,7 +241,8 @@
             ...props.selectParam,
             projectId: appStore.currentProjectId,
             [form.attribute]: form.value || form.inputValue,
-            append: form.append,
+            append: selectedTagType.value === TagUpdateTypeEnum.APPEND,
+            clear: selectedTagType.value === TagUpdateTypeEnum.CLEAR,
           };
           await updateBatchBug(tmpObj);
           Message.success(t('common.updateSuccess'));

frontend/src/views/case-management/caseManagementFeature/components/batchEditModal.vue

@@ -7,12 +7,6 @@
     :confirm="confirmHandler"
     :close="closeHandler"
     unmount-on-close
-    :switch-props="{
-      switchName: t('caseManagement.featureCase.appendTag'),
-      switchTooltip: t('caseManagement.featureCase.enableTags'),
-      showSwitch: form.selectedAttrsId === 'systemTags' ? true : false,
-      enable: form.append,
-    }"
   >
     <div class="form">
       <a-form ref="formRef" :model="form" layout="vertical">
@@ -31,9 +25,21 @@
         </a-form-item>
         <a-form-item
           v-if="form.selectedAttrsId === 'systemTags'"
+          class="mb-[16px]"
+          field="type"
+          :label="t('common.type')"
+        >
+          <a-radio-group v-model:model-value="selectedTagType" size="small">
+            <a-radio :value="TagUpdateTypeEnum.UPDATE"> {{ t('common.update') }}</a-radio>
+            <a-radio :value="TagUpdateTypeEnum.APPEND"> {{ t('caseManagement.featureCase.appendTag') }}</a-radio>
+            <a-radio :value="TagUpdateTypeEnum.CLEAR">{{ t('common.clear') }}</a-radio>
+          </a-radio-group>
+        </a-form-item>
+        <a-form-item
+          v-if="form.selectedAttrsId === 'systemTags' && selectedTagType !== TagUpdateTypeEnum.CLEAR"
           field="tags"
           :validate-trigger="['blur', 'input']"
-          :label="t('caseManagement.featureCase.batchUpdate')"
+          :label="t('common.batchUpdate')"
           asterisk-position="end"
           :rules="[{ required: true, message: t('common.inputPleaseEnterTags') }]"
         >
@@ -42,7 +48,7 @@
         </a-form-item>
 
         <MsFormCreate
-          v-else
+          v-if="form.selectedAttrsId !== 'systemTags' && selectedTagType !== TagUpdateTypeEnum.CLEAR"
           ref="formCreateRef"
           v-model:api="fApi"
           v-model:form-item="formItem"
@@ -69,6 +75,7 @@
 
   import type { CustomAttributes } from '@/models/caseManagement/featureCase';
   import { TableQueryParams } from '@/models/common';
+  import { TagUpdateTypeEnum } from '@/enums/commonEnum';
 
   import Message from '@arco-design/web-vue/es/message';
 
@@ -98,11 +105,12 @@
   const form = ref({ ...initForm });
 
   const formRef = ref<FormInstance | null>(null);
+  const selectedTagType = ref<TagUpdateTypeEnum>(TagUpdateTypeEnum.UPDATE);
 
   const initDefaultForm: FormItem = {
     type: 'SELECT',
     name: 'name',
-    label: 'caseManagement.featureCase.batchUpdate',
+    label: 'common.batchUpdate',
     value: '',
     options: [],
     props: {
@@ -151,7 +159,7 @@
         return {
           type: val,
           name: item.fieldId,
-          label: 'caseManagement.featureCase.batchUpdate',
+          label: 'common.batchUpdate',
           value: formValue,
           options: item.options,
           props: {
@@ -173,7 +181,7 @@
     form.value.tags = [];
   }
 
-  async function confirmHandler(enable: boolean | undefined) {
+  async function confirmHandler() {
     await formRef.value?.validate().then(async (error) => {
       if (!error) {
         try {
@@ -191,13 +199,14 @@
             selectAll: !!selectAll,
             excludeIds: excludeIds || [],
             projectId: currentProjectId.value,
-            append: enable as boolean,
+            append: selectedTagType.value === TagUpdateTypeEnum.APPEND,
             tags: form.value.tags,
             moduleIds: props.activeFolder === 'all' ? [] : [props.activeFolder, ...props.offspringIds],
             customField: form.value.selectedAttrsId === 'systemTags' ? {} : customField,
             condition: {
               ...props.condition,
             },
+            clear: selectedTagType.value === TagUpdateTypeEnum.CLEAR,
           };
           await batchEditAttrs(params);
           Message.success(t('caseManagement.featureCase.editSuccess'));

frontend/src/views/case-management/caseManagementFeature/locale/en-US.ts

@@ -83,11 +83,10 @@ export default {
   'caseManagement.featureCase.tags': 'Tags',
   'caseManagement.featureCase.enableTags': `On: adds a label`,
   'caseManagement.featureCase.closeTags': 'Off: overwrites an existing label',
-  'caseManagement.featureCase.appendTag': 'appendTag',
+  'caseManagement.featureCase.appendTag': 'append',
   'caseManagement.featureCase.batchEdit': 'Batch editing ({number} use cases selected)',
   'caseManagement.featureCase.selectAttrs': 'select attributes',
   'caseManagement.featureCase.selectAttrsNotNull': 'Attributes not be null',
-  'caseManagement.featureCase.batchUpdate': 'Batch update to',
   'caseManagement.featureCase.batchDelete': 'Are you sure to delete the use case {number} ?',
   'caseManagement.featureCase.batchDeleteCompleted': 'Are you sure to completed delete the use case {number} ?',
   'caseManagement.featureCase.batchMoveTitle': 'Batch Move',

frontend/src/views/case-management/caseManagementFeature/locale/zh-CN.ts

@@ -83,11 +83,10 @@ export default {
   'caseManagement.featureCase.tags': '标签',
   'caseManagement.featureCase.enableTags': '开启：新增标签',
   'caseManagement.featureCase.closeTags': '关闭：覆盖原有标签',
-  'caseManagement.featureCase.appendTag': '追加标签',
+  'caseManagement.featureCase.appendTag': '追加',
   'caseManagement.featureCase.batchEdit': '批量编辑 (已选 { number } 条用例)',
   'caseManagement.featureCase.selectAttrs': '选择属性',
   'caseManagement.featureCase.selectAttrsNotNull': '属性不能为空',
-  'caseManagement.featureCase.batchUpdate': '批量更新为',
   'caseManagement.featureCase.batchDelete': '确认删除 {number} 条用例吗？',
   'caseManagement.featureCase.batchDeleteCompleted': '确认彻底删除 {number} 条用例吗？',
   'caseManagement.featureCase.batchMoveTitle': '批量移动',

frontend/src/views/test-plan/testPlan/components/batchEditModal.vue

@@ -25,8 +25,20 @@
       </a-form-item>
       <a-form-item
         v-if="form.selectedAttrsId === 'tags'"
+        :class="`${selectedTagType === TagUpdateTypeEnum.CLEAR ? 'mb-0' : 'mb-[16px]'}`"
+        field="type"
+        :label="t('common.type')"
+      >
+        <a-radio-group v-model:model-value="selectedTagType" size="small">
+          <a-radio :value="TagUpdateTypeEnum.UPDATE"> {{ t('common.update') }}</a-radio>
+          <a-radio :value="TagUpdateTypeEnum.APPEND"> {{ t('caseManagement.featureCase.appendTag') }}</a-radio>
+          <a-radio :value="TagUpdateTypeEnum.CLEAR">{{ t('common.clear') }}</a-radio>
+        </a-radio-group>
+      </a-form-item>
+      <a-form-item
+        v-if="form.selectedAttrsId === 'tags' && selectedTagType !== TagUpdateTypeEnum.CLEAR"
         field="tags"
-        :label="t('apiTestManagement.batchUpdate')"
+        :label="t('common.batchUpdate')"
         :rules="[{ required: true, message: t('common.inputPleaseEnterTags') }]"
         asterisk-position="end"
         :validate-trigger="['blur', 'input']"
@@ -37,9 +49,9 @@
         <div class="text-[12px] leading-[20px] text-[var(--color-text-4)]">{{ t('ms.tagsInput.tagLimitTip') }}</div>
       </a-form-item>
       <a-form-item
-        v-else
+        v-if="form.selectedAttrsId !== 'tags'"
         field="value"
-        :label="t('apiTestManagement.batchUpdate')"
+        :label="t('common.batchUpdate')"
         :rules="[{ required: true, message: t('apiTestManagement.valueRequired') }]"
         asterisk-position="end"
         class="mb-0"
@@ -53,26 +65,7 @@
     </a-form>
 
     <template #footer>
-      <div class="flex" :class="[form.selectedAttrsId === 'tags' ? 'justify-between' : 'justify-end']">
+      <div class="flex justify-end">
-        <div
-          v-if="form.selectedAttrsId === 'tags'"
-          class="flex flex-row items-center justify-center"
-          style="padding-top: 10px"
-        >
-          <a-switch v-model="form.append" class="mr-1" size="small" type="line" />
-          <span class="flex items-center">
-            <span class="mr-1">{{ t('caseManagement.featureCase.appendTag') }}</span>
-            <span class="mt-[2px]">
-              <a-tooltip>
-                <IconQuestionCircle class="h-[16px] w-[16px] text-[rgb(var(--primary-5))]" />
-                <template #content>
-                  <div>{{ t('caseManagement.featureCase.enableTags') }}</div>
-                  <div>{{ t('caseManagement.featureCase.closeTags') }}</div>
-                </template>
-              </a-tooltip>
-            </span>
-          </span>
-        </div>
         <div class="flex justify-end">
           <a-button type="secondary" :disabled="batchEditLoading" @click="closeHandler">
             {{ t('common.cancel') }}
@@ -99,6 +92,7 @@
   import useAppStore from '@/store/modules/app';
 
   import { TableQueryParams } from '@/models/common';
+  import { TagUpdateTypeEnum } from '@/enums/commonEnum';
   import { testPlanTypeEnum } from '@/enums/testPlanEnum';
 
   import Message from '@arco-design/web-vue/es/message';
@@ -149,6 +143,8 @@
   }
 
   const batchEditLoading = ref(false);
+  const selectedTagType = ref<TagUpdateTypeEnum>(TagUpdateTypeEnum.UPDATE);
+
   function confirmHandler() {
     formRef.value?.validate(async (errors) => {
       if (!errors) {
@@ -165,8 +161,10 @@
               ...props.condition,
             },
             ...form.value,
+            append: selectedTagType.value === TagUpdateTypeEnum.APPEND,
             type: props.showType,
             editColumn: 'TAGS',
+            clear: selectedTagType.value === TagUpdateTypeEnum.CLEAR,
           };
           await batchEditTestPlan(params);
           Message.success(t('caseManagement.featureCase.editSuccess'));