fix(功能用例): 修改table过滤交互条件和去掉多余的执行结果
This commit is contained in:
parent
c4ffa6fa3a
commit
2139a1de23
|
@ -67,10 +67,7 @@
|
||||||
:filterable="item.filterable"
|
:filterable="item.filterable"
|
||||||
:cell-class="item.cellClass"
|
:cell-class="item.cellClass"
|
||||||
:header-cell-class="`${
|
:header-cell-class="`${
|
||||||
item.headerCellClass ||
|
item.headerCellClass || (item.filterConfig && hasSelectedFilter(item)) ? 'header-cell-filter' : ''
|
||||||
(item.filterConfig && isHighlightFilterBackground && activeDataIndex === item.dataIndex)
|
|
||||||
? 'header-cell-filter'
|
|
||||||
: ''
|
|
||||||
}`"
|
}`"
|
||||||
:body-cell-class="item.bodyCellClass"
|
:body-cell-class="item.bodyCellClass"
|
||||||
:summary-cell-class="item.summaryCellClass"
|
:summary-cell-class="item.summaryCellClass"
|
||||||
|
@ -109,9 +106,8 @@
|
||||||
:options="item.filterConfig.options"
|
:options="item.filterConfig.options"
|
||||||
:data-index="item.dataIndex"
|
:data-index="item.dataIndex"
|
||||||
v-bind="item.filterConfig"
|
v-bind="item.filterConfig"
|
||||||
|
:filter="filter"
|
||||||
@handle-confirm="(v) => handleFilterConfirm(v, item.dataIndex as string, item.isCustomParam || false)"
|
@handle-confirm="(v) => handleFilterConfirm(v, item.dataIndex as string, item.isCustomParam || false)"
|
||||||
@show="showFilter(true, item.dataIndex)"
|
|
||||||
@hide="showFilter(false, item.dataIndex)"
|
|
||||||
>
|
>
|
||||||
<template #item="{ filterItem }">
|
<template #item="{ filterItem }">
|
||||||
<slot :name="item.filterConfig.filterSlotName" :filter-content="filterItem"> </slot>
|
<slot :name="item.filterConfig.filterSlotName" :filter-content="filterItem"> </slot>
|
||||||
|
@ -304,6 +300,7 @@
|
||||||
BatchActionQueryParams,
|
BatchActionQueryParams,
|
||||||
MsPaginationI,
|
MsPaginationI,
|
||||||
MsTableColumn,
|
MsTableColumn,
|
||||||
|
MsTableColumnData,
|
||||||
MsTableDataItem,
|
MsTableDataItem,
|
||||||
MsTableProps,
|
MsTableProps,
|
||||||
} from './type';
|
} from './type';
|
||||||
|
@ -640,11 +637,13 @@
|
||||||
columnSelectorVisible.value = true;
|
columnSelectorVisible.value = true;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const filter = ref<Record<string, any>>({});
|
||||||
const handleFilterConfirm = (
|
const handleFilterConfirm = (
|
||||||
value: string[] | (string | number)[] | undefined,
|
value: string[] | (string | number)[] | undefined,
|
||||||
dataIndex: string,
|
dataIndex: string,
|
||||||
isCustomParam: boolean
|
isCustomParam: boolean
|
||||||
) => {
|
) => {
|
||||||
|
filter.value[dataIndex] = value;
|
||||||
emit('filterChange', dataIndex, value, isCustomParam);
|
emit('filterChange', dataIndex, value, isCustomParam);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -653,11 +652,11 @@
|
||||||
batchLeft.value = getBatchLeft();
|
batchLeft.value = getBatchLeft();
|
||||||
});
|
});
|
||||||
|
|
||||||
const isHighlightFilterBackground = ref<boolean>(false);
|
function hasSelectedFilter(item: MsTableColumnData) {
|
||||||
const activeDataIndex = ref<string | undefined>('');
|
if (item.filterConfig && item.dataIndex) {
|
||||||
function showFilter(visible: boolean, dataIndex: string | undefined) {
|
return (filter.value[item.dataIndex] || []).length > 0;
|
||||||
activeDataIndex.value = dataIndex;
|
}
|
||||||
isHighlightFilterBackground.value = visible;
|
return false;
|
||||||
}
|
}
|
||||||
|
|
||||||
watch(
|
watch(
|
||||||
|
|
|
@ -4,7 +4,7 @@
|
||||||
<svg-icon
|
<svg-icon
|
||||||
width="16px"
|
width="16px"
|
||||||
height="16px"
|
height="16px"
|
||||||
:name="visible ? 'filter-icon-color' : 'filter-icon'"
|
:name="isHighlight ? 'filter-icon-color' : 'filter-icon'"
|
||||||
class="text-[12px] font-medium"
|
class="text-[12px] font-medium"
|
||||||
/>
|
/>
|
||||||
</span>
|
</span>
|
||||||
|
@ -95,6 +95,8 @@
|
||||||
remoteMethod?: FilterRemoteMethodsEnum; // 加载选项方法
|
remoteMethod?: FilterRemoteMethodsEnum; // 加载选项方法
|
||||||
loadOptionParams?: Record<string, any>; // 请求下拉的参数
|
loadOptionParams?: Record<string, any>; // 请求下拉的参数
|
||||||
placeholderText?: string;
|
placeholderText?: string;
|
||||||
|
dataIndex?: string | undefined;
|
||||||
|
filter: Record<string, any>;
|
||||||
}>(),
|
}>(),
|
||||||
{
|
{
|
||||||
mode: 'static',
|
mode: 'static',
|
||||||
|
@ -150,6 +152,13 @@
|
||||||
loading.value = false;
|
loading.value = false;
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const isHighlight = computed(() => {
|
||||||
|
if (props.filter && props.dataIndex) {
|
||||||
|
return (props.filter[props.dataIndex] || []).length > 0;
|
||||||
|
}
|
||||||
|
return false;
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="less">
|
<style scoped lang="less">
|
||||||
|
|
|
@ -2,25 +2,6 @@ import { BatchApiParams } from '../common';
|
||||||
|
|
||||||
export type planStatusType = 'PREPARED' | 'UNDERWAY' | 'COMPLETED' | 'ARCHIVED';
|
export type planStatusType = 'PREPARED' | 'UNDERWAY' | 'COMPLETED' | 'ARCHIVED';
|
||||||
|
|
||||||
// 计划分页
|
|
||||||
export interface TestPlanItem {
|
|
||||||
id?: string;
|
|
||||||
projectId: string;
|
|
||||||
num: number;
|
|
||||||
name: string;
|
|
||||||
status: planStatusType;
|
|
||||||
type: string;
|
|
||||||
tags: string[];
|
|
||||||
schedule: string; // 是否定时
|
|
||||||
createUser: string;
|
|
||||||
createTime: string;
|
|
||||||
moduleName: string;
|
|
||||||
moduleId: string;
|
|
||||||
children: TestPlanItem[];
|
|
||||||
childrenCount: number;
|
|
||||||
groupId: string;
|
|
||||||
}
|
|
||||||
|
|
||||||
export interface AssociateFunctionalCaseItem {
|
export interface AssociateFunctionalCaseItem {
|
||||||
testPlanId: string;
|
testPlanId: string;
|
||||||
testPlanNum: number;
|
testPlanNum: number;
|
||||||
|
@ -62,6 +43,7 @@ export interface AddTestPlanParams {
|
||||||
groupOption?: boolean;
|
groupOption?: boolean;
|
||||||
cycle?: number[];
|
cycle?: number[];
|
||||||
projectId?: string;
|
projectId?: string;
|
||||||
|
testPlanId?: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
// TODO: 对照后端字段
|
// TODO: 对照后端字段
|
||||||
|
@ -80,6 +62,26 @@ export interface TestPlanDetail extends AddTestPlanParams {
|
||||||
underReviewedCount: number;
|
underReviewedCount: number;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 计划分页
|
||||||
|
export interface TestPlanItem {
|
||||||
|
id?: string;
|
||||||
|
projectId: string;
|
||||||
|
num: number;
|
||||||
|
name: string;
|
||||||
|
status: planStatusType;
|
||||||
|
type: string;
|
||||||
|
tags: string[];
|
||||||
|
schedule: string; // 是否定时
|
||||||
|
createUser: string;
|
||||||
|
createTime: string;
|
||||||
|
moduleName: string;
|
||||||
|
moduleId: string;
|
||||||
|
children: TestPlanItem[];
|
||||||
|
childrenCount: number;
|
||||||
|
groupId: string;
|
||||||
|
}
|
||||||
|
export type TestPlanItemType = TestPlanItem & TestPlanDetail;
|
||||||
|
|
||||||
export interface SwitchListModel {
|
export interface SwitchListModel {
|
||||||
key: 'repeatCase' | 'automaticStatusUpdate' | 'testPlanning';
|
key: 'repeatCase' | 'automaticStatusUpdate' | 'testPlanning';
|
||||||
label: string;
|
label: string;
|
||||||
|
@ -114,4 +116,10 @@ export interface PlanDetailBugItem {
|
||||||
createTime: number;
|
createTime: number;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 关注
|
||||||
|
export interface FollowPlanParams {
|
||||||
|
userId: string; // 用户id
|
||||||
|
testPlanId: string;
|
||||||
|
}
|
||||||
|
|
||||||
export default {};
|
export default {};
|
||||||
|
|
|
@ -77,7 +77,7 @@
|
||||||
</template>
|
</template>
|
||||||
<!-- 执行结果 -->
|
<!-- 执行结果 -->
|
||||||
<template #[FilterSlotNameEnum.CASE_MANAGEMENT_EXECUTE_RESULT]="{ filterContent }">
|
<template #[FilterSlotNameEnum.CASE_MANAGEMENT_EXECUTE_RESULT]="{ filterContent }">
|
||||||
<ExecuteStatusTag :status="filterContent.value" />
|
<ExecuteStatusTag :execute-result="filterContent.value" />
|
||||||
</template>
|
</template>
|
||||||
<!-- 评审结果 -->
|
<!-- 评审结果 -->
|
||||||
<template #[FilterSlotNameEnum.CASE_MANAGEMENT_REVIEW_RESULT]="{ filterContent }">
|
<template #[FilterSlotNameEnum.CASE_MANAGEMENT_REVIEW_RESULT]="{ filterContent }">
|
||||||
|
@ -97,7 +97,7 @@
|
||||||
<span>{{ statusIconMap[record.reviewStatus]?.statusText || '' }} </span>
|
<span>{{ statusIconMap[record.reviewStatus]?.statusText || '' }} </span>
|
||||||
</template>
|
</template>
|
||||||
<template #lastExecuteResult="{ record }">
|
<template #lastExecuteResult="{ record }">
|
||||||
<executeResult :execute-result="record.lastExecuteResult" />
|
<ExecuteStatusTag :execute-result="record.lastExecuteResult" />
|
||||||
</template>
|
</template>
|
||||||
<template #moduleId="{ record }">
|
<template #moduleId="{ record }">
|
||||||
<a-tree-select
|
<a-tree-select
|
||||||
|
@ -299,11 +299,10 @@
|
||||||
import MsTableMoreAction from '@/components/pure/ms-table-more-action/index.vue';
|
import MsTableMoreAction from '@/components/pure/ms-table-more-action/index.vue';
|
||||||
import { ActionsItem } from '@/components/pure/ms-table-more-action/types';
|
import { ActionsItem } from '@/components/pure/ms-table-more-action/types';
|
||||||
import caseLevel from '@/components/business/ms-case-associate/caseLevel.vue';
|
import caseLevel from '@/components/business/ms-case-associate/caseLevel.vue';
|
||||||
import executeResult from '@/components/business/ms-case-associate/executeResult.vue';
|
import ExecuteStatusTag from '@/components/business/ms-case-associate/executeResult.vue';
|
||||||
import BatchEditModal from './batchEditModal.vue';
|
import BatchEditModal from './batchEditModal.vue';
|
||||||
import CaseDetailDrawer from './caseDetailDrawer.vue';
|
import CaseDetailDrawer from './caseDetailDrawer.vue';
|
||||||
import FeatureCaseTree from './caseTree.vue';
|
import FeatureCaseTree from './caseTree.vue';
|
||||||
import ExecuteStatusTag from './excuteStatusTag.vue';
|
|
||||||
import ExportExcelDrawer from './exportExcelDrawer.vue';
|
import ExportExcelDrawer from './exportExcelDrawer.vue';
|
||||||
import AddDemandModal from './tabContent/tabDemand/addDemandModal.vue';
|
import AddDemandModal from './tabContent/tabDemand/addDemandModal.vue';
|
||||||
import ThirdDemandDrawer from './tabContent/tabDemand/thirdDemandDrawer.vue';
|
import ThirdDemandDrawer from './tabContent/tabDemand/thirdDemandDrawer.vue';
|
||||||
|
|
|
@ -1,62 +0,0 @@
|
||||||
<template>
|
|
||||||
<div class="flex items-center justify-start">
|
|
||||||
<MsIcon
|
|
||||||
:type="executionResultMap[props.status]?.icon || ''"
|
|
||||||
class="mr-1"
|
|
||||||
:class="[executionResultMap[props.status].color]"
|
|
||||||
></MsIcon>
|
|
||||||
<span>{{ executionResultMap[props.status]?.statusText || '' }} </span>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup lang="ts">
|
|
||||||
/**
|
|
||||||
* @desc 功能用例的执行结果状态
|
|
||||||
*/
|
|
||||||
import { ref } from 'vue';
|
|
||||||
|
|
||||||
import { useI18n } from '@/hooks/useI18n';
|
|
||||||
|
|
||||||
import { StatusType } from '@/enums/caseEnum';
|
|
||||||
|
|
||||||
const { t } = useI18n();
|
|
||||||
|
|
||||||
const props = defineProps<{
|
|
||||||
status: StatusType;
|
|
||||||
}>();
|
|
||||||
|
|
||||||
const executionResultMap: Record<string, any> = {
|
|
||||||
UN_EXECUTED: {
|
|
||||||
key: 'UN_EXECUTED',
|
|
||||||
icon: StatusType.UN_EXECUTED,
|
|
||||||
statusText: t('caseManagement.featureCase.nonExecution'),
|
|
||||||
color: 'text-[var(--color-text-brand)]',
|
|
||||||
},
|
|
||||||
PASSED: {
|
|
||||||
key: 'PASSED',
|
|
||||||
icon: StatusType.PASSED,
|
|
||||||
statusText: t('caseManagement.featureCase.passed'),
|
|
||||||
color: '',
|
|
||||||
},
|
|
||||||
/* SKIPPED: {
|
|
||||||
key: 'SKIPPED',
|
|
||||||
icon: StatusType.SKIPPED,
|
|
||||||
statusText: t('caseManagement.featureCase.skip'),
|
|
||||||
color: 'text-[rgb(var(--link-6))]',
|
|
||||||
}, */
|
|
||||||
BLOCKED: {
|
|
||||||
key: 'BLOCKED',
|
|
||||||
icon: StatusType.BLOCKED,
|
|
||||||
statusText: t('caseManagement.featureCase.chokeUp'),
|
|
||||||
color: 'text-[rgb(var(--warning-6))]',
|
|
||||||
},
|
|
||||||
FAILED: {
|
|
||||||
key: 'FAILED',
|
|
||||||
icon: StatusType.FAILED,
|
|
||||||
statusText: t('caseManagement.featureCase.failure'),
|
|
||||||
color: '',
|
|
||||||
},
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style scoped lang="less"></style>
|
|
|
@ -112,7 +112,7 @@
|
||||||
</template>
|
</template>
|
||||||
<!-- 执行结果 -->
|
<!-- 执行结果 -->
|
||||||
<template #[FilterSlotNameEnum.CASE_MANAGEMENT_EXECUTE_RESULT]="{ filterContent }">
|
<template #[FilterSlotNameEnum.CASE_MANAGEMENT_EXECUTE_RESULT]="{ filterContent }">
|
||||||
<ExecuteStatusTag :status="filterContent.value" />
|
<ExecuteStatusTag :execute-result="filterContent.value" />
|
||||||
</template>
|
</template>
|
||||||
<!-- 评审结果 -->
|
<!-- 评审结果 -->
|
||||||
<template #[FilterSlotNameEnum.CASE_MANAGEMENT_REVIEW_RESULT]="{ filterContent }">
|
<template #[FilterSlotNameEnum.CASE_MANAGEMENT_REVIEW_RESULT]="{ filterContent }">
|
||||||
|
@ -200,10 +200,10 @@
|
||||||
import type { BatchActionParams, BatchActionQueryParams, MsTableColumn } from '@/components/pure/ms-table/type';
|
import type { BatchActionParams, BatchActionQueryParams, MsTableColumn } from '@/components/pure/ms-table/type';
|
||||||
import useTable from '@/components/pure/ms-table/useTable';
|
import useTable from '@/components/pure/ms-table/useTable';
|
||||||
import caseLevel from '@/components/business/ms-case-associate/caseLevel.vue';
|
import caseLevel from '@/components/business/ms-case-associate/caseLevel.vue';
|
||||||
|
import ExecuteStatusTag from '@/components/business/ms-case-associate/executeResult.vue';
|
||||||
import type { CaseLevel } from '@/components/business/ms-case-associate/types';
|
import type { CaseLevel } from '@/components/business/ms-case-associate/types';
|
||||||
import MsTree from '@/components/business/ms-tree/index.vue';
|
import MsTree from '@/components/business/ms-tree/index.vue';
|
||||||
import type { MsTreeNodeData } from '@/components/business/ms-tree/types';
|
import type { MsTreeNodeData } from '@/components/business/ms-tree/types';
|
||||||
import ExecuteStatusTag from './excuteStatusTag.vue';
|
|
||||||
|
|
||||||
import {
|
import {
|
||||||
batchDeleteRecycleCase,
|
batchDeleteRecycleCase,
|
||||||
|
|
Loading…
Reference in New Issue