feat(接口测试): csv部分页面

metersphere · May 11, 2024 · 472e7ae · 472e7ae
1 parent 1c1d52f
commit 472e7ae
Show file tree

Hide file tree

Showing 12 changed files with 354 additions and 52 deletions.
diff --git a/frontend/src/components/business/ms-add-attachment/index.vue b/frontend/src/components/business/ms-add-attachment/index.vue
@@ -403,7 +403,7 @@
   function handleOpenSaveAs(item: TagData) {
     inputFilesPopoverVisible.value = false;
     // 这里先判定 uid 是否存在，存在则是刚上传的文件；否则是已保存过后的详情文件
-    savingFile.value = fileList.value.find((file) => (file.uid || file[props.fields.id]) === item.value);
+    savingFile.value = fileList.value.find((file) => file.uid === item.value || file[props.fields.id] === item.value);
     saveFilePopoverVisible.value = true;
   }
 

diff --git a/frontend/src/components/business/ms-add-attachment/saveAsFilePopover.vue b/frontend/src/components/business/ms-add-attachment/saveAsFilePopover.vue
@@ -122,7 +122,7 @@
     (visible) => {
       if (visible) {
         initModuleOptions();
-        saveFileForm.value.name = props.savingFile?.name?.split('.').shift() || '';
+        saveFileForm.value.name = (props.savingFile?.name || props.savingFile?.fileName)?.split('.').shift() || '';
       }
     },
     {

diff --git a/frontend/src/components/pure/ms-form-table/index.vue b/frontend/src/components/pure/ms-form-table/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <a-form ref="formRef" :model="propsRes">
+  <a-form ref="formRef" :model="propsRes" layout="vertical">
     <MsBaseTable
       v-bind="propsRes"
       :hoverable="false"

diff --git a/frontend/src/views/api-test/components/config.ts b/frontend/src/views/api-test/components/config.ts
@@ -13,6 +13,7 @@ import {
   ResponseDefinition,
 } from '@/models/apiTest/common';
 import type { MockParams } from '@/models/apiTest/mock';
+import type { CsvVariable } from '@/models/apiTest/scenario';
 import {
   FullResponseAssertionType,
   RequestAssertionCondition,
@@ -242,16 +243,13 @@ export const regexDefaultParamItem = {
   moreSettingPopoverVisible: false,
 };
 // 响应断言类型映射
-export const responseAssertionTypeMap: Record<FullResponseAssertionType, string> = {
+export const responseAssertionTypeMap: Record<string, string> = {
   [FullResponseAssertionType.DOCUMENT]: 'apiTestManagement.document',
   [FullResponseAssertionType.RESPONSE_CODE]: 'apiTestManagement.responseCode',
   [FullResponseAssertionType.RESPONSE_HEADER]: 'apiTestManagement.responseHeader',
   [FullResponseAssertionType.RESPONSE_TIME]: 'apiTestManagement.responseTime',
   [FullResponseAssertionType.SCRIPT]: 'apiTestManagement.script',
   [FullResponseAssertionType.VARIABLE]: 'apiTestManagement.variable',
-  [FullResponseAssertionType.JSON_PATH]: 'jsonPath',
-  [FullResponseAssertionType.XPATH]: 'xPath',
-  [FullResponseAssertionType.REGEX]: 'apiTestManagement.regex',
 };
 // 提取类型选项
 export const extractTypeOptions = [
@@ -415,3 +413,32 @@ export const matchRuleOptions = [
 ];
 // mock 参数为文件类型的匹配规则选项
 export const mockFileMatchRules = ['EQUALS', 'NOT_EQUALS', 'IS_EMPTY', 'IS_NOT_EMPTY'];
+
+// 场景-常规参数默认值
+export const defaultNormalParamItem = {
+  key: '',
+  paramType: 'CONSTANT',
+  value: '',
+  description: '',
+  tags: [],
+  enable: true,
+};
+// 场景-csv参数默认值
+export const defaultCsvParamItem: CsvVariable = {
+  id: '',
+  fileId: '',
+  scenarioId: '',
+  name: '',
+  fileName: '',
+  scope: 'SCENARIO',
+  enable: true,
+  association: false,
+  encoding: 'UTF-8',
+  random: false,
+  variableNames: '',
+  ignoreFirstLine: false,
+  delimiter: ',',
+  allowQuotedData: false,
+  recycleOnEof: false,
+  stopThreadOnEof: false,
+};
diff --git a/frontend/src/views/api-test/components/paramTable.vue b/frontend/src/views/api-test/components/paramTable.vue
@@ -26,7 +26,13 @@
     <template #typeTitle="{ columnConfig }">
       <div class="flex items-center text-[var(--color-text-3)]">
         {{ t('apiTestDebug.paramType') }}
-        <a-tooltip :content="columnConfig.typeTitleTooltip" :disabled="!columnConfig.typeTitleTooltip" position="right">
+        <a-tooltip :disabled="!columnConfig.typeTitleTooltip" position="right">
+          <template #content>
+            <template v-if="Array.isArray(columnConfig.typeTitleTooltip)">
+              <div v-for="tip of columnConfig.typeTitleTooltip" :key="tip">{{ tip }}</div>
+            </template>
+            <div v-else>{{ columnConfig.typeTitleTooltip }}</div>
+          </template>
           <icon-question-circle
             class="ml-[4px] text-[var(--color-text-brand)] hover:text-[rgb(var(--primary-5))]"
             size="16"
@@ -184,6 +190,17 @@
     <template #expression="{ record, rowIndex, columnConfig }">
       <slot name="expression" :record="record" :row-index="rowIndex" :column-config="columnConfig"></slot>
     </template>
+    <!-- 作用域 -->
+    <template #scope="{ record, columnConfig, rowIndex }">
+      <a-select
+        v-model:model-value="record.scope"
+        :disabled="props.disabledExceptParam"
+        :options="columnConfig.typeOptions || []"
+        class="ms-form-table-input w-[180px]"
+        size="mini"
+        @change="() => addTableLine(rowIndex)"
+      />
+    </template>
     <!-- 参数值 -->
     <template #value="{ record, columnConfig, rowIndex }">
       <a-popover
@@ -238,6 +255,27 @@
         @apply="() => addTableLine(rowIndex, columnConfig.addLineDisabled)"
       />
     </template>
+    <!-- 文件 -->
+    <template #file="{ record, rowIndex }">
+      <MsAddAttachment
+        v-model:file-list="record.files"
+        :disabled="props.disabledParamValue"
+        :multiple="false"
+        mode="input"
+        :fields="{
+          id: 'fileId',
+          name: 'fileAlias',
+        }"
+        :file-save-as-source-id="props.fileSaveAsSourceId"
+        :file-save-as-api="props.fileSaveAsApi"
+        :file-module-options-api="props.fileModuleOptionsApi"
+        input-class="ms-form-table-input h-[24px]"
+        input-size="small"
+        tag-size="small"
+        @change="(files, file) => handleFileChange(files, record, rowIndex, file)"
+        @delete-file="() => emitChange('deleteFile')"
+      />
+    </template>
     <!-- 长度范围 -->
     <template #lengthRange="{ record, rowIndex }">
       <div class="flex items-center justify-between">
@@ -430,9 +468,20 @@
       />
       <div v-else class="text-[var(--color-text-1)]">{{ '-' }}</div>
     </template>
+    <!-- 单独启用/禁用列 -->
+    <template #enable="{ record, rowIndex }">
+      <a-switch
+        v-model="record.enable"
+        :disabled="props.disabledExceptParam"
+        size="small"
+        type="line"
+        class="ml-[8px]"
+        @change="() => addTableLine(rowIndex)"
+      />
+    </template>
     <!-- 操作 -->
     <template v-if="!props.disabledExceptParam" #operation="{ record, rowIndex, columnConfig }">
-      <div class="flex flex-row items-center" :class="{ 'justify-end': columnConfig.align === 'right' }">
+      <div class="flex w-full flex-row items-center" :class="{ 'justify-end': columnConfig.align === 'right' }">
         <a-switch
           v-if="columnConfig.hasDisable"
           v-model="record.enable"
@@ -573,7 +622,7 @@
     isNormal?: boolean; // 用于 value 列区分是普通输入框还是 MsParamsInput
     hasRequired?: boolean; // 用于 type 列区分是否有 required 星号
     typeOptions?: { label: string; value: string }[]; // 用于 type 列选择器选项
-    typeTitleTooltip?: string; // 用于 type 表头列展示的 tooltip
+    typeTitleTooltip?: string | string[]; // 用于 type 表头列展示的 tooltip
     hasDisable?: boolean; // 用于 operation 列区分是否有 enable 开关
     moreAction?: ActionsItem[]; // 用于 operation 列更多操作按钮配置
     format?: RequestBodyFormat; // 用于 operation 列区分是否有请求体格式选择器

diff --git a/frontend/src/views/api-test/components/requestComposition/response/result/assertionTable.vue b/frontend/src/views/api-test/components/requestComposition/response/result/assertionTable.vue
@@ -8,15 +8,20 @@
     >
       <template #assertionItem="{ record }">
         <div class="flex items-center gap-[4px]">
-          【{{ t(responseAssertionTypeMap[(record as ResponseAssertionTableItem).assertionType]) }}】
+          【{{
+            t(
+              responseAssertionTypeMap[(record as ResponseAssertionTableItem).assertionType] ||
+                'apiTestDebug.responseBody'
+            )
+          }}】
           {{ record.name }}
         </div>
       </template>
       <template #condition="{ record }">
         {{
           record.assertionType === FullResponseAssertionType.RESPONSE_TIME
             ? t('advanceFilter.operator.le')
-            : t(statusCodeOptions.find((item) => item.value === record.condition)?.label || '')
+            : t(statusCodeOptions.find((item) => item.value === record.condition)?.label || '-')
         }}
       </template>
       <template #status="{ record }">