fix(项目管理): 修复环境管理相关bug

frontend/src/components/pure/ms-form-create/form-create.ts

@@ -68,9 +68,10 @@ export const MEMBER = {
   value: '',
   options: [],
   props: {
-    multiple: false,
+    'multiple': false,
     // 'placeholder': t('formCreate.PleaseSelect'),
-    modelValue: '',
+    'modelValue': '',
+    'allow-clear': true,
   },
 };
 
@@ -81,10 +82,11 @@ export const MULTIPLE_MEMBER = {
   value: [],
   options: [],
   props: {
-    multiple: true,
+    'multiple': true,
     // 'placeholder': t('formCreate.PleaseSelect'),
-    options: [],
+    'options': [],
-    modelValue: [],
+    'modelValue': [],
+    'allow-clear': true,
   },
 };
 

frontend/src/components/pure/ms-form-create/searchSelect.vue

@@ -4,6 +4,7 @@
       v-model:model-value="selectValue"
       :placeholder="t(props.placeholder || 'common.pleaseSelect')"
       allow-search
+      allow-clear
       :multiple="props.multiple"
       @search="searchHandler"
     >

frontend/src/store/modules/setting/useProjectEnvStore.ts

@@ -55,6 +55,14 @@ const envParamsDefaultConfig: EnvConfig = {
   },
 };
 
+const defaultAllParams = {
+  projectId: '',
+  globalParams: {
+    headers: [],
+    commonVariables: [],
+  },
+};
+
 const useProjectEnvStore = defineStore(
   'projectEnv',
   () => {
@@ -75,7 +83,9 @@ const useProjectEnvStore = defineStore(
       description: '',
       config: cloneDeep(envParamsDefaultConfig),
     });
-    const allParamDetailInfo = ref<GlobalParams>(); // 全局参数详情
+    const allParamDetailInfo = ref<GlobalParams>(defaultAllParams); // 全局参数详情
+
+    const backupAllParamDetailInfo = ref<GlobalParams>(defaultAllParams);
     const httpNoWarning = ref(true);
     const getHttpNoWarning = computed(() => httpNoWarning.value);
 
@@ -112,7 +122,11 @@ const useProjectEnvStore = defineStore(
             config: cloneDeep(envParamsDefaultConfig),
           };
         } else if (id === ALL_PARAM) {
-          allParamDetailInfo.value = await getGlobalParamDetail(appStore.currentProjectId);
+          const res = await getGlobalParamDetail(appStore.currentProjectId);
+          allParamDetailInfo.value = cloneDeep(res || defaultAllParams);
+          nextTick(() => {
+            backupAllParamDetailInfo.value = cloneDeep(allParamDetailInfo.value);
+          });
         } else if (id !== ALL_PARAM && id) {
           const tmpObj = await getDetailEnv(id);
           currentEnvDetailInfo.value = { ...tmpObj };
@@ -187,6 +201,7 @@ const useProjectEnvStore = defineStore(
       setCurrentGroupId,
       setHttpNoWarning,
       setAllParamDetailInfo,
+      backupAllParamDetailInfo,
       initEnvDetail,
       initContentTabList,
       getContentTabList,

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

@@ -185,7 +185,7 @@ export default {
   'apiTestDebug.importByCURLTip': '支持快速导入 Chrome、Charles 或 Fiddler 等工具中的抓包数据',
   'apiTestDebug.noPluginTip': '该插件已卸载，无法查看插件详情',
   'apiTestDebug.noPlugin': '插件已卸载',
-  'apiTestDebug.unsavedLeave': '有标签页的内容未保存，离开后后未保存的内容将丢失，确定要离开吗？',
+  'apiTestDebug.unsavedLeave': '有标签页的内容未保存，离开后未保存的内容将丢失，确定要离开吗？',
   'apiTestDebug.testSuccess': '测试成功',
   'apiTestDebug.searchByDataBaseName': '按数据源名称搜索',
   'apiTestDebug.regexMatchRules': '表达式匹配规则',

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

@@ -28,7 +28,7 @@
             </a-checkbox>
           </a-checkbox-group>
         </div>
-        <div v-if="props.mode === 'remote'" class="min-h-[100px] w-[200px] p-4">
+        <div v-if="props.mode === 'remote'" class="w-[200px] p-4 pb-0">
           <MsUserSelector
             v-model="innerStatusFilters"
             :load-option-params="props.loadOptionParams"

frontend/src/views/project-management/environmental/components/AllParamBox.vue

@@ -19,6 +19,7 @@
 
 <script lang="ts" setup>
   import { Message } from '@arco-design/web-vue';
+  import { cloneDeep } from 'lodash-es';
 
   import RequestHeader from './requestHeader/index.vue';
 
@@ -34,7 +35,6 @@
   const appStore = useAppStore();
 
   const activeKey = ref('requestHeader');
-  const headerParams = ref<EnvConfigItem[]>([]);
   const GlobalVariable = ref<EnvConfigItem[]>([]);
   const { t } = useI18n();
   const { setIsSave } = useLeaveUnSaveTip();
@@ -54,25 +54,35 @@
     },
   ];
 
-  function initEnvDetail() {
+  const headerParams = computed({
-    projectEnvStore.initEnvDetail().then(() => {
+    get() {
-      headerParams.value = projectEnvStore.allParamDetailInfo?.globalParams.headers || [];
+      return projectEnvStore.allParamDetailInfo?.globalParams.headers || [];
-      GlobalVariable.value = projectEnvStore.allParamDetailInfo?.globalParams.commonVariables || [];
+    },
+    set(val) {
+      projectEnvStore.allParamDetailInfo.globalParams.headers = val;
+    },
   });
+
+  function initEnvDetail() {
+    projectEnvStore.initEnvDetail();
+    headerParams.value = projectEnvStore.allParamDetailInfo.globalParams.headers || [];
   }
 
   function change() {
     canSave.value = true;
+    projectEnvStore.allParamDetailInfo.globalParams.headers = cloneDeep(headerParams.value);
     setIsSave(false);
   }
+
   const handleSave = async () => {
     try {
       loading.value = true;
+      const headerParamsFilter = headerParams.value.filter((item) => item.key);
       const params = {
         id: projectEnvStore.allParamDetailInfo?.id,
         projectId: appStore.currentProjectId,
         globalParams: {
-          headers: headerParams.value,
+          headers: headerParamsFilter,
           commonVariables: GlobalVariable.value.map((item) => {
             return {
               key: item.key,

frontend/src/views/project-management/environmental/components/envParams/preAndPost.vue

@@ -5,7 +5,13 @@
     </a-tabs>
     <a-divider margin="0"></a-divider>
     <div v-if="activeTab === 'scenarioProcessorConfig'" class="h-[calc(100vh - 100px)] mt-4">
-      <a-alert class="mb-4" closable> {{ t('project.environmental.sceneAlertDesc') }} </a-alert>
+      <a-alert class="mb-4" closable>
+        {{
+          props.activeType === EnvTabTypeEnum.ENVIRONMENT_PRE
+            ? t('project.environmental.scenePreAlertDesc')
+            : t('project.environmental.scenePostAlertDesc')
+        }}
+      </a-alert>
       <a-scrollbar
         :style="{
           overflow: 'auto',
@@ -27,7 +33,13 @@
       </a-scrollbar>
     </div>
     <div v-if="activeTab === 'requestProcessorConfig'" class="mt-4 h-full">
-      <a-alert class="mb-4" closable> {{ t('project.environmental.requestAlertDesc') }} </a-alert>
+      <a-alert class="mb-4" closable>
+        {{
+          props.activeType === EnvTabTypeEnum.ENVIRONMENT_PRE
+            ? t('project.environmental.requestPreAlertDesc')
+            : t('project.environmental.requestPostAlertDesc')
+        }}
+      </a-alert>
       <PreTab
         v-if="props.activeType === EnvTabTypeEnum.ENVIRONMENT_PRE"
         :show-associated-scene="showAssociatedScene"

frontend/src/views/project-management/environmental/index.vue

@@ -646,7 +646,11 @@
         store.setCurrentId(id);
         return;
       }
-      if (isEqual(store.currentEnvDetailInfo, store.backupEnvDetailInfo)) {
+      const isChangeEnvValue =
+        store.currentId === ALL_PARAM
+          ? isEqual(store.allParamDetailInfo, store.backupAllParamDetailInfo)
+          : isEqual(store.currentEnvDetailInfo, store.backupEnvDetailInfo);
+      if (isChangeEnvValue) {
         store.setCurrentId(id);
       } else {
         // 如果有未保存的tab则提示用户

frontend/src/views/project-management/environmental/locale/en-US.ts

@@ -31,10 +31,14 @@ export default {
   'project.environmental.TCP': 'TCP',
   'project.environmental.pre': 'Pre',
   'project.environmental.post': 'Post',
-  'project.environmental.sceneAlertDesc':
+  'project.environmental.scenePreAlertDesc':
     'Perform this operation once before scenario execution, such as obtaining a token and scenario initialization',
-  'project.environmental.requestAlertDesc':
+  'project.environmental.scenePostAlertDesc':
+    'Perform this operation once after scenario execution, such as obtaining a token and scenario initialization',
+  'project.environmental.requestPreAlertDesc':
     'Each API step is executed once before execution, such as request content encryption',
+  'project.environmental.requestPostAlertDesc':
+    'Each API step is executed once after execution, such as request content encryption',
   'project.environmental.host': 'Host',
   'project.environmental.assert': 'Assertion',
   'project.environmental.displaySetting': 'Display Setting',

frontend/src/views/project-management/environmental/locale/zh-CN.ts

@@ -38,8 +38,10 @@ export default {
   'project.environmental.database': '数据库',
   'project.environmental.pre': '前置',
   'project.environmental.post': '后置',
-  'project.environmental.sceneAlertDesc': '场景执行前执行一次，如token获取及场景初始化',
+  'project.environmental.scenePreAlertDesc': '场景执行前执行一次，如token获取及场景初始化',
-  'project.environmental.requestAlertDesc': '每一个API步骤执行前均执行一次，如请求内容加密',
+  'project.environmental.scenePostAlertDesc': '场景执行后执行一次，如token获取及场景初始化',
+  'project.environmental.requestPreAlertDesc': '每一个API步骤执行前均执行一次，如请求内容加密',
+  'project.environmental.requestPostAlertDesc': '每一个API步骤执行后均执行一次，如请求内容加密',
   'project.environmental.host': '域名',
   'project.environmental.assert': '断言',
   'project.environmental.displaySetting': '显示设置',

frontend/src/views/setting/organization/template/components/addTemplate.vue

@@ -375,7 +375,7 @@
   }
 
   function changeHandler(value: string, api: any) {
-    api.validateField(value);
+    api?.validateField(value);
   }
 
   // 保存回调
@@ -539,7 +539,10 @@
   const confirmHandler = (dataList: DefinedFieldItem[]) => {
     const selectFieldIds = selectData.value.map((e) => e.id);
     const newData = dataList.filter((item) => !selectFieldIds.includes(item.id));
-    selectData.value = [...selectData.value, ...newData];
+    const newIds = dataList.map((item) => item.id);
+    // @desc 原先已经选择过的选项value值不能再次添加的时候置空
+    const selectDataValue = selectData.value.filter((item) => newIds.includes(item.id));
+    selectData.value = [...selectDataValue, ...newData];
   };
 
   function changeState(value: boolean | (string | number | boolean)[], formItem) {