feat(测试计划): 高级筛选-计划详情页-缺陷
This commit is contained in:
teukkk
Craftsman
parent
5f0415e1c1
commit
772cd67117
|
|
@ -1,21 +1,30 @@
|
|||
<template>
|
||||
<div class="p-[16px]">
|
||||
<div class="mb-[16px] flex items-center justify-between">
|
||||
<div
|
||||
>{{ t('testPlan.bugManagement.bug') }}
|
||||
<span class="text-[var(--color-text-4)]">({{ addCommasToNumber(count) }})</span>
|
||||
</div>
|
||||
<a-input-search
|
||||
v-model:model-value="keyword"
|
||||
:placeholder="t('common.searchByIdName')"
|
||||
allow-clear
|
||||
class="w-[240px]"
|
||||
@search="getFetch"
|
||||
@press-enter="getFetch"
|
||||
@clear="getFetch"
|
||||
/>
|
||||
</div>
|
||||
<MsBaseTable ref="tableRef" v-bind="propsRes" v-on="propsEvent">
|
||||
<MsAdvanceFilter
|
||||
ref="msAdvanceFilterRef"
|
||||
v-model:keyword="keyword"
|
||||
:view-type="ViewTypeEnum.PLAN_BUG"
|
||||
:filter-config-list="filterConfigList"
|
||||
:custom-fields-config-list="searchCustomFields"
|
||||
:search-placeholder="t('common.searchByIdName')"
|
||||
@keyword-search="getFetch()"
|
||||
@adv-search="handleAdvSearch"
|
||||
@refresh="getFetch()"
|
||||
>
|
||||
<template #left>
|
||||
<div
|
||||
>{{ t('testPlan.bugManagement.bug') }}
|
||||
<span class="text-[var(--color-text-4)]">({{ addCommasToNumber(count) }})</span>
|
||||
</div>
|
||||
</template>
|
||||
</MsAdvanceFilter>
|
||||
<MsBaseTable
|
||||
ref="tableRef"
|
||||
class="mt-[16px]"
|
||||
:not-show-table-filter="isAdvancedSearchMode"
|
||||
v-bind="propsRes"
|
||||
v-on="propsEvent"
|
||||
>
|
||||
<template v-if="props.canEdit" #num="{ record }">
|
||||
<MsButton type="text" @click="handleShowDetail(record.id)">{{ record.num }}</MsButton>
|
||||
</template>
|
||||
|
|
@ -40,6 +49,8 @@
|
|||
import { ref } from 'vue';
|
||||
import { useRoute } from 'vue-router';
|
||||
|
||||
import { getFilterCustomFields, MsAdvanceFilter } from '@/components/pure/ms-advance-filter';
|
||||
import { FilterFormItem, FilterResult } from '@/components/pure/ms-advance-filter/type';
|
||||
import MsButton from '@/components/pure/ms-button/index.vue';
|
||||
import MsBaseTable from '@/components/pure/ms-table/base-table.vue';
|
||||
import type { MsTableColumn } from '@/components/pure/ms-table/type';
|
||||
|
|
@ -48,13 +59,18 @@
|
|||
import BugDetailDrawer from '@/views/bug-management/components/bug-detail-drawer.vue';
|
||||
import BugNamePopover from '@/views/case-management/caseManagementFeature/components/tabContent/tabBug/bugNamePopover.vue';
|
||||
|
||||
import { getCustomOptionHeader, getPlatform } from '@/api/modules/bug-management';
|
||||
import { getCustomFieldHeader, getCustomOptionHeader, getPlatform } from '@/api/modules/bug-management';
|
||||
import { getPlatformOptions } from '@/api/modules/project-management/menuManagement';
|
||||
import { planDetailBugPage } from '@/api/modules/test-plan/testPlan';
|
||||
import { useI18n } from '@/hooks/useI18n';
|
||||
import useAppStore from '@/store/modules/app';
|
||||
import { addCommasToNumber } from '@/utils';
|
||||
import { hasAnyPermission } from '@/utils/permission';
|
||||
|
||||
import { BugEditCustomField, BugOptionItem } from '@/models/bug-management';
|
||||
import { PoolOption } from '@/models/projectManagement/menuManagement';
|
||||
import { FilterType, ViewTypeEnum } from '@/enums/advancedFilterEnum';
|
||||
import { MenuEnum } from '@/enums/commonEnum';
|
||||
import { TableKeyEnum } from '@/enums/tableEnum';
|
||||
|
||||
import { makeColumns } from '@/views/case-management/caseManagementFeature/components/utils';
|
||||
|
|
@ -70,6 +86,7 @@
|
|||
const route = useRoute();
|
||||
const appStore = useAppStore();
|
||||
|
||||
const projectId = computed(() => appStore.currentProjectId);
|
||||
const keyword = ref<string>('');
|
||||
const planId = ref(route.query.id as string);
|
||||
|
||||
|
|
@ -138,13 +155,16 @@
|
|||
showDrag: true,
|
||||
},
|
||||
]);
|
||||
const { propsRes, propsEvent, loadList, setLoadListParams } = useTable(planDetailBugPage, {
|
||||
columns: columns.value,
|
||||
tableKey: TableKeyEnum.TEST_PLAN_DETAIL_BUG_TABLE,
|
||||
scroll: { x: '100%' },
|
||||
showSelectorAll: false,
|
||||
heightUsed: 340,
|
||||
});
|
||||
const { propsRes, propsEvent, viewId, advanceFilter, setAdvanceFilter, loadList, setLoadListParams } = useTable(
|
||||
planDetailBugPage,
|
||||
{
|
||||
columns: columns.value,
|
||||
tableKey: TableKeyEnum.TEST_PLAN_DETAIL_BUG_TABLE,
|
||||
scroll: { x: '100%' },
|
||||
showSelectorAll: false,
|
||||
heightUsed: 340,
|
||||
}
|
||||
);
|
||||
|
||||
const count = computed(() => {
|
||||
return propsRes.value.msPagination?.total || 0;
|
||||
|
|
@ -155,14 +175,125 @@
|
|||
planId: planId.value,
|
||||
keyword: keyword.value,
|
||||
projectId: appStore.currentProjectId,
|
||||
viewId: viewId.value,
|
||||
combineSearch: advanceFilter,
|
||||
});
|
||||
loadList();
|
||||
}
|
||||
|
||||
const msAdvanceFilterRef = ref<InstanceType<typeof MsAdvanceFilter>>();
|
||||
const isAdvancedSearchMode = computed(() => msAdvanceFilterRef.value?.isAdvancedSearchMode);
|
||||
|
||||
// 获取自定义字段
|
||||
const searchCustomFields = ref<FilterFormItem[]>([]);
|
||||
const getCustomFieldColumns = async () => {
|
||||
const res = await getCustomFieldHeader(projectId.value);
|
||||
searchCustomFields.value = getFilterCustomFields(
|
||||
res.filter((item: BugEditCustomField) => item.fieldId !== 'title')
|
||||
);
|
||||
};
|
||||
|
||||
const statusOption = ref<BugOptionItem[]>([]);
|
||||
|
||||
const platformOption = ref<PoolOption[]>([]);
|
||||
const initPlatformOption = async () => {
|
||||
try {
|
||||
const res = await getPlatformOptions(appStore.currentOrgId, MenuEnum.bugManagement);
|
||||
platformOption.value = [...res, { id: 'Local', name: 'Local' }];
|
||||
} catch (error) {
|
||||
// eslint-disable-next-line no-console
|
||||
console.log(error);
|
||||
}
|
||||
};
|
||||
|
||||
const filterConfigList = computed<FilterFormItem[]>(() => [
|
||||
{
|
||||
title: 'bugManagement.ID',
|
||||
dataIndex: 'num',
|
||||
type: FilterType.INPUT,
|
||||
},
|
||||
{
|
||||
title: 'bugManagement.bugName',
|
||||
dataIndex: 'title',
|
||||
type: FilterType.INPUT,
|
||||
},
|
||||
{
|
||||
title: 'bugManagement.belongPlatform',
|
||||
dataIndex: 'platform',
|
||||
type: FilterType.SELECT,
|
||||
selectProps: {
|
||||
multiple: true,
|
||||
labelKey: 'name',
|
||||
valueKey: 'id',
|
||||
options: platformOption.value,
|
||||
},
|
||||
},
|
||||
{
|
||||
title: 'caseManagement.featureCase.defectState',
|
||||
dataIndex: 'status',
|
||||
type: FilterType.SELECT,
|
||||
selectProps: {
|
||||
multiple: true,
|
||||
labelKey: 'text',
|
||||
options: statusOption.value,
|
||||
},
|
||||
},
|
||||
{
|
||||
title: 'bugManagement.numberOfCase',
|
||||
dataIndex: 'relationCaseCount',
|
||||
type: FilterType.NUMBER,
|
||||
numberProps: {
|
||||
min: 0,
|
||||
precision: 0,
|
||||
},
|
||||
},
|
||||
{
|
||||
title: 'bugManagement.handleMan',
|
||||
dataIndex: 'handleUser',
|
||||
type: FilterType.MEMBER,
|
||||
},
|
||||
{
|
||||
title: 'common.tag',
|
||||
dataIndex: 'tags',
|
||||
type: FilterType.TAGS_INPUT,
|
||||
numberProps: {
|
||||
min: 0,
|
||||
precision: 0,
|
||||
},
|
||||
},
|
||||
{
|
||||
title: 'common.creator',
|
||||
dataIndex: 'createUser',
|
||||
type: FilterType.MEMBER,
|
||||
},
|
||||
{
|
||||
title: 'common.createTime',
|
||||
dataIndex: 'createTime',
|
||||
type: FilterType.DATE_PICKER,
|
||||
},
|
||||
{
|
||||
title: 'apiScenario.table.columns.updateUser',
|
||||
dataIndex: 'updateUser',
|
||||
type: FilterType.MEMBER,
|
||||
},
|
||||
{
|
||||
title: 'common.updateTime',
|
||||
dataIndex: 'updateTime',
|
||||
type: FilterType.DATE_PICKER,
|
||||
},
|
||||
]);
|
||||
// 高级检索
|
||||
const handleAdvSearch = (filter: FilterResult, id: string) => {
|
||||
keyword.value = '';
|
||||
setAdvanceFilter(filter, id);
|
||||
getFetch(); // 基础筛选都清空
|
||||
};
|
||||
|
||||
const tableRef = ref<InstanceType<typeof MsBaseTable>>();
|
||||
async function initFilterOptions() {
|
||||
if (hasAnyPermission(['PROJECT_BUG:READ'])) {
|
||||
const res = await getCustomOptionHeader(appStore.currentProjectId);
|
||||
statusOption.value = res.statusOption;
|
||||
const optionsMap: Record<string, any> = {
|
||||
status: res.statusOption,
|
||||
};
|
||||
|
|
@ -191,6 +322,8 @@
|
|||
onBeforeMount(() => {
|
||||
initFilterOptions();
|
||||
getFetch();
|
||||
getCustomFieldColumns();
|
||||
initPlatformOption();
|
||||
setCurrentPlatform();
|
||||
});
|
||||
</script>
|
||||
|
|
|
|||
Loading…
Reference in New Issue