test-version22
/
MeterSphere
mirror of https://gitee.com/fit2cloud-feizhiyun/MeterSphere.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

feat(接口测试): 增加接口测试回收站的表格筛选和模块树统计的联动

This commit is contained in:
Jianguo-Genius 2024-04-19 16:45:34 +08:00 committed by 刘瑞斌
parent ce8d123e58
commit e31e890f7e
5 changed files with 121 additions and 63 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
backend/services/api-test/src/main/java/io/metersphere/api/service/definition/ApiDefinitionModuleService.java
View File

@ -76,6 +76,10 @@ public class ApiDefinitionModuleService extends ModuleTreeService {
public List<BaseTreeNode> getTreeOnlyIdsAndResourceCount(ApiModuleRequest request, List<ModuleCountDTO> moduleCountDTOList) {
//节点内容只有Id和parentId
//构建模块树，并计算每个节点下的所有数量（包含子节点）
request.setKeyword(null);
request.setModuleIds(null);
List<BaseTreeNode> fileModuleList = extApiDefinitionModuleMapper.selectIdAndParentIdByRequest(request);
return super.buildTreeAndCountResource(fileModuleList, moduleCountDTOList, true, Translator.get(UNPLANNED_API));
}
@ -225,7 +229,6 @@ public class ApiDefinitionModuleService extends ModuleTreeService {
* 查找当前项目下模块每个节点对应的资源统计
*/
public Map<String, Long> getModuleCountMap(ApiModuleRequest request, List<ModuleCountDTO> moduleCountDTOList) {
//构建模块树，并计算每个节点下的所有数量（包含子节点）
List<BaseTreeNode> treeNodeList = this.getTreeOnlyIdsAndResourceCount(request, moduleCountDTOList);
return super.getIdCountMapByBreadth(treeNodeList);
}

75
frontend/src/views/api-test/management/components/moduleTree.vue
View File

@ -206,6 +206,8 @@
import { mapTree } from '@/utils';
import { hasAllPermission, hasAnyPermission } from '@/utils/permission';
import { ApiDefinitionGetModuleParams } from '@/models/apiTest/management';
import { ApiScenarioGetModuleParams } from '@/models/apiTest/scenario';
import { ModuleTreeNode } from '@/models/common';
const props = withDefaults(
@ -363,6 +365,36 @@
const isExpandAll = ref(props.isExpandAll);
const rootModulesName = ref<string[]>([]); // 根模块名称列表
const isExpandApi = ref(false);
const lastModuleCountParam = ref<ApiDefinitionGetModuleParams>({
projectId: appStore.currentProjectId,
keyword: moduleKeyword.value,
protocol: moduleProtocol.value,
moduleIds: [],
});
async function initModuleCount(params: ApiDefinitionGetModuleParams) {
try {
lastModuleCountParam.value = params;
lastModuleCountParam.value.protocol = moduleProtocol.value;
let res;
if (props.trash) {
res = await getTrashModuleCount(params);
} else {
res = await getModuleCount(params);
}
modulesCount.value = res;
folderTree.value = mapTree<ModuleTreeNode>(folderTree.value, (node) => {
return {
...node,
count: res[node.id] || 0,
draggable: node.id !== 'root' && !(props.readOnly || props.isModal),
disabled: props.readOnly || props.isModal ? node.id === selectedKeys.value[0] : false,
};
});
} catch (error) {
// eslint-disable-next-line no-console
console.log(error);
}
}
/**
* 初始化模块树
@ -435,46 +467,14 @@
console.log(error);
} finally {
loading.value = false;
}
}
async function initModuleCount() {
try {
let res;
if (props.trash) {
res = await getTrashModuleCount({
keyword: moduleKeyword.value,
protocol: moduleProtocol.value,
projectId: appStore.currentProjectId,
moduleIds: [],
});
} else {
res = await getModuleCount({
keyword: moduleKeyword.value,
protocol: moduleProtocol.value,
projectId: appStore.currentProjectId,
moduleIds: [],
});
}
modulesCount.value = res;
folderTree.value = mapTree<ModuleTreeNode>(folderTree.value, (node) => {
return {
...node,
count: res[node.id] || 0,
draggable: node.id !== 'root' && !(props.readOnly || props.isModal),
disabled: props.readOnly || props.isModal ? node.id === selectedKeys.value[0] : false,
};
});
} catch (error) {
// eslint-disable-next-line no-console
console.log(error);
initModuleCount(lastModuleCountParam.value);
}
}
function handleProtocolChange() {
emit('changeProtocol', moduleProtocol.value);
lastModuleCountParam.value.protocol = moduleProtocol.value;
initModules();
initModuleCount();
}
watch(
@ -491,7 +491,6 @@
function changeApiExpand() {
isExpandApi.value = !isExpandApi.value;
initModules();
initModuleCount();
}
/**
@ -537,7 +536,6 @@
Message.success(t('apiTestDebug.deleteSuccess'));
emit('deleteNode', node.id, node.type === 'MODULE');
initModules();
initModuleCount();
} catch (error) {
// eslint-disable-next-line no-console
console.log(error);
@ -649,13 +647,11 @@
} finally {
loading.value = false;
await initModules();
initModuleCount();
}
}
function handleAddFinish() {
initModules();
initModuleCount();
}
function handleRenameFinish(newName: string, id: string) {
@ -673,16 +669,15 @@
onBeforeMount(() => {
initProtocolList();
initModules();
initModuleCount();
});
function refresh() {
initModules();
initModuleCount();
}
defineExpose({
refresh,
initModuleCount,
});
</script>

93
frontend/src/views/api-test/management/components/recycle/api/apiTable.vue
View File

@ -7,10 +7,10 @@
:placeholder="t('apiTestManagement.searchPlaceholder')"
allow-clear
class="mr-[8px] w-[240px]"
@search="loadApiList"
@press-enter="loadApiList"
@search="loadApiList(false)"
@press-enter="loadApiList(false)"
/>
<a-button type="outline" class="arco-btn-outline--secondary !p-[8px]" @click="loadApiList">
<a-button type="outline" class="arco-btn-outline--secondary !p-[8px]" @click="loadApiList(false)">
<template #icon>
<icon-refresh class="text-[var(--color-text-4)]" />
</template>
@ -150,7 +150,11 @@
import useAppStore from '@/store/modules/app';
import { characterLimit } from '@/utils';
import { ApiDefinitionDetail, BatchRecoverApiParams } from '@/models/apiTest/management';
import {
ApiDefinitionDetail,
ApiDefinitionGetModuleParams,
BatchRecoverApiParams,
} from '@/models/apiTest/management';
import { RequestDefinitionStatus, RequestMethods } from '@/enums/apiEnum';
import { TableKeyEnum } from '@/enums/tableEnum';
@ -169,7 +173,9 @@
const folderTreePathMap = inject('folderTreePathMap');
const keyword = ref('');
const refreshModuleTree: (() => Promise<any>) | undefined = inject('refreshModuleTree');
const refreshModuleTreeCount: ((data: ApiDefinitionGetModuleParams) => Promise<any>) | undefined =
inject('refreshModuleTreeCount');
const columns: MsTableColumn = [
{
title: 'ID',
@ -297,12 +303,26 @@
return [props.activeModule];
});
const tableQueryParams = ref<any>();
const tableStore = useTableStore();
async function getModuleIds() {
let queryModuleIds: string[] = [];
if (props.activeModule !== 'all') {
queryModuleIds = [props.activeModule];
const getAllChildren = await tableStore.getSubShow(TableKeyEnum.API_TEST);
if (getAllChildren) {
queryModuleIds = [props.activeModule, ...props.offspringIds];
}
}
return queryModuleIds;
}
function loadApiList() {
// hasRefreshTree:调用该方法前后有没有重新加载tree。 重新加载tree时会自动计算count。没有重新加载的话会手动处理
async function loadApiList(hasRefreshTree?: boolean) {
const queryModuleIds = await getModuleIds();
const params = {
keyword: keyword.value,
projectId: appStore.currentProjectId,
moduleIds: moduleIds.value,
moduleIds: props.activeModule === 'all' ? [] : queryModuleIds,
deleted: true,
protocol: props.protocol,
filter: {
@ -311,6 +331,20 @@
deleteUser: deleteUserFilters.value,
},
};
if (!hasRefreshTree && typeof refreshModuleTreeCount === 'function') {
refreshModuleTreeCount({
keyword: keyword.value,
filter: {
status: statusFilters.value,
method: methodFilters.value,
deleteUser: deleteUserFilters.value,
},
moduleIds: [],
protocol: props.protocol,
projectId: appStore.currentProjectId,
});
}
setLoadListParams(params);
loadList();
tableQueryParams.value = {
@ -324,7 +358,7 @@
() => props.activeModule,
() => {
resetSelector();
loadApiList();
loadApiList(false);
}
);
@ -332,13 +366,16 @@
() => props.protocol,
() => {
resetSelector();
loadApiList();
loadApiList(true);
if (typeof refreshModuleTree === 'function') {
refreshModuleTree();
}
}
);
function handleFilterHidden(val: boolean) {
if (!val) {
loadApiList();
loadApiList(false);
methodFilterVisible.value = false;
statusFilterVisible.value = false;
}
@ -347,17 +384,17 @@
function resetMethodFilter() {
methodFilters.value = [];
methodFilterVisible.value = false;
loadApiList();
loadApiList(false);
}
function resetStatusFilter() {
statusFilters.value = [];
statusFilterVisible.value = false;
loadApiList();
loadApiList(false);
}
onBeforeMount(() => {
loadApiList();
loadApiList(true);
});
const tableSelected = ref<(string | number)[]>([]);
@ -394,12 +431,13 @@
}
// 批量操作参数
function getBatchParams(): BatchRecoverApiParams {
async function getBatchParams(): Promise<BatchRecoverApiParams> {
const queryModuleIds = await getModuleIds();
return {
excludeIds: batchParams.value.excludeIds,
selectAll: batchParams.value.selectAll,
selectIds: batchParams.value.selectedIds as string[],
moduleIds: props.activeModule === 'all' ? [] : [props.activeModule],
moduleIds: props.activeModule === 'all' ? [] : queryModuleIds,
projectId: appStore.currentProjectId,
protocol: props.protocol,
condition: {
@ -416,10 +454,13 @@
// 批量恢复
async function batchRecover() {
try {
await batchRecoverDefinition(getBatchParams());
await batchRecoverDefinition(await getBatchParams());
Message.success(t('apiTestManagement.recycle.recoveredSuccessfully'));
resetSelector();
loadApiList();
loadApiList(true);
if (typeof refreshModuleTree === 'function') {
refreshModuleTree();
}
} catch (error) {
console.log(error);
}
@ -441,10 +482,13 @@
},
onBeforeOk: async () => {
try {
await batchCleanOutDefinition(getBatchParams());
await batchCleanOutDefinition(await getBatchParams());
Message.success(t('common.deleteSuccess'));
resetSelector();
loadApiList();
loadApiList(true);
if (typeof refreshModuleTree === 'function') {
refreshModuleTree();
}
} catch (error) {
console.log(error);
}
@ -488,7 +532,10 @@
await deleteRecycleApiList(record.id);
Message.success(t('common.deleteSuccess'));
resetSelector();
loadApiList();
loadApiList(true);
if (typeof refreshModuleTree === 'function') {
refreshModuleTree();
}
} catch (error) {
console.log(error);
}
@ -507,7 +554,10 @@
});
Message.success(t('apiTestManagement.recycle.recoveredSuccessfully'));
resetSelector();
loadApiList();
loadApiList(true);
if (typeof refreshModuleTree === 'function') {
refreshModuleTree();
}
} catch (error) {
console.log(error);
}
@ -517,7 +567,6 @@
loadApiList,
});
const tableStore = useTableStore();
await tableStore.initColumn(TableKeyEnum.API_TEST, columns, 'drawer', true);
</script>

6
frontend/src/views/api-test/management/index.vue
View File

@ -78,6 +78,7 @@
import { useI18n } from '@/hooks/useI18n';
import { ApiDefinitionGetModuleParams } from '@/models/apiTest/management';
import { ModuleTreeNode } from '@/models/common';
import { ApiTestRouteEnum } from '@/enums/routeEnum';
@ -131,6 +132,10 @@
moduleTreeRef.value?.refresh();
}
function refreshModuleTreeCount(params: ApiDefinitionGetModuleParams) {
moduleTreeRef.value?.initModuleCount(params);
}
function handleImportDone() {
refreshModuleTree();
managementRef.value?.refreshApiTable();
@ -175,6 +180,7 @@
/** 向子孙组件提供方法和值 */
provide('setActiveApi', setActiveApi);
provide('refreshModuleTree', refreshModuleTree);
provide('refreshModuleTreeCount', refreshModuleTreeCount);
provide('folderTreePathMap', folderTreePathMap.value);
</script>

5
frontend/src/views/api-test/management/recycle.vue
View File

@ -37,6 +37,7 @@
import moduleTree from './components/moduleTree.vue';
import management from './components/recycle/index.vue';
import { ApiDefinitionGetModuleParams } from '@/models/apiTest/management';
import { ModuleTreeNode } from '@/models/common';
const activeModule = ref<string>('all');
@ -66,9 +67,13 @@
function refreshModuleTree() {
moduleTreeRef.value?.refresh();
}
function refreshModuleTreeCount(params: ApiDefinitionGetModuleParams) {
moduleTreeRef.value?.initModuleCount(params);
}
/** 向子孙组件提供方法和值 */
provide('refreshModuleTree', refreshModuleTree);
provide('refreshModuleTreeCount', refreshModuleTreeCount);
provide('folderTreePathMap', folderTreePathMap.value);
</script>