feat(功能用例): 用例评审脑图查看-评审历史-评审状态下拉

This commit is contained in:
teukkk 2024-07-04 20:41:03 +08:00 committed by Craftsman
parent 4c39528cf0
commit 3cd5432c18
2 changed files with 48 additions and 8 deletions

View File

@ -50,13 +50,32 @@
:active-case="activeCaseInfo" :active-case="activeCaseInfo"
/> />
<div v-else class="pl-[16px]"> <div v-else class="pl-[16px]">
<div v-if="props.reviewPassRule === 'MULTIPLE'" class="mb-[8px] flex justify-between"> <div v-if="props.reviewPassRule === 'MULTIPLE'" class="mb-[8px] flex items-center justify-between">
<div class="text-[12px]"> <div class="text-[12px]">
<span class="text-[var(--color-text-4)]">{{ t('caseManagement.caseReview.progress') }}</span> <span class="text-[var(--color-text-4)]">{{ t('caseManagement.caseReview.progress') }}</span>
{{ props.reviewProgress }} {{ props.reviewProgress }}
</div> </div>
<!-- TODO 总结果 hover展示单个 --> <a-trigger v-model:popup-visible="statusVisible" trigger="click" position="br" :popup-translate="[0, 4]">
<ReviewResult :status="activeCaseInfo.reviewStatus" /> <div
:class="`flex cursor-pointer items-center rounded p-[4px] hover:bg-[var(--color-text-n9)]
${statusVisible ? 'bg-[var(--color-text-n9)]' : ''} `"
>
<ReviewResult :status="activeCaseInfo.reviewStatus" class="text-[12px]" :icon-size="12" />
<MsIcon type="icon-icon_expand-down_filled" size="12" class="ml-[4px] text-[var(--color-text-4)]" />
</div>
<template #content>
<div
class="trigger-content rounded-[var(--border-radius-medium)] bg-white p-[6px] shadow-[0_-1px_4px_rgba(2,2,2,0.1)]"
>
<div v-for="item in reviewUserStatusList" :key="item.id" class="my-[4px] flex justify-between">
<div class="one-line-text max-w-[80px]">
{{ item.userName }}
</div>
<ReviewResult :status="item.status" class="text-[12px]" :icon-size="12" />
</div>
</div>
</template>
</a-trigger>
</div> </div>
<ReviewCommentList <ReviewCommentList
:review-comment-list="reviewHistoryList" :review-comment-list="reviewHistoryList"
@ -414,10 +433,20 @@
// //
const reviewHistoryList = ref<ReviewHistoryItem[]>([]); const reviewHistoryList = ref<ReviewHistoryItem[]>([]);
const reviewUserStatusList = ref<ReviewHistoryItem[]>([]); //
const statusVisible = ref(false);
async function initReviewHistoryList(data: MinderJsonNodeData) { async function initReviewHistoryList(data: MinderJsonNodeData) {
try { try {
const res = await getCaseReviewHistoryList(route.query.id as string, data?.caseId || activeCaseInfo.value.caseId); const res = await getCaseReviewHistoryList(route.query.id as string, data?.caseId || activeCaseInfo.value.caseId);
reviewHistoryList.value = res; reviewHistoryList.value = res;
reviewUserStatusList.value = [];
const userNamesSet = new Set();
reviewHistoryList.value.forEach((reviewItem) => {
if (!userNamesSet.has(reviewItem.userName)) {
reviewUserStatusList.value.push(reviewItem);
userNamesSet.add(reviewItem.userName);
}
});
} catch (error) { } catch (error) {
// eslint-disable-next-line no-console // eslint-disable-next-line no-console
console.log(error); console.log(error);
@ -539,4 +568,9 @@
:deep(.comment-list-item-name) { :deep(.comment-list-item-name) {
max-width: 200px; max-width: 200px;
} }
.trigger-content {
max-height: 192px;
@apply overflow-y-auto overflow-x-hidden;
.ms-scroll-bar();
}
</style> </style>

View File

@ -3,7 +3,7 @@
<MsIcon <MsIcon
:type="resultMap[props.status]?.icon || ''" :type="resultMap[props.status]?.icon || ''"
class="mr-[4px]" class="mr-[4px]"
:size="16" :size="props.iconSize"
:style="{ color: resultMap[props.status]?.color }" :style="{ color: resultMap[props.status]?.color }"
></MsIcon> ></MsIcon>
{{ t(resultMap[props.status]?.label) }} {{ t(resultMap[props.status]?.label) }}
@ -20,10 +20,16 @@
const { t } = useI18n(); const { t } = useI18n();
const props = defineProps<{ const props = withDefaults(
defineProps<{
status?: ReviewResult; status?: ReviewResult;
isPart?: boolean; // true'UNDER_REVIEWED''' isPart?: boolean; // true'UNDER_REVIEWED'''
}>(); iconSize?: number;
}>(),
{
iconSize: 16,
}
);
const resultMap = computed(() => const resultMap = computed(() =>
props.isPart props.isPart