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

fix(测试用例): 修复用例步骤描述文本选择与表单重叠覆盖

This commit is contained in:
xinxin.wu 2024-08-13 14:53:56 +08:00 committed by Craftsman
parent 595590b1b0
commit a9f6679319
5 changed files with 99 additions and 113 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
frontend/src/views/case-management/caseManagementFeature/components/caseDetailDrawer.vue
View File

@ -122,7 +122,7 @@
<template #default="{ detail, loading }">
<div ref="wrapperRef" class="bg-white">
<div class="header relative h-[48px] border-b pl-2">
<div class="max-w-[calc(100%-72px)]">
<div class="max-w-[calc(100%-100px)]">
<MsTab
v-model:active-key="activeTab"
:content-tab-list="tabSetting"
@ -683,6 +683,7 @@
right: 16px;
height: 48px;
line-height: 48px;
@apply bg-white;
}
:deep(.arco-menu-light) {
height: 50px;

50
frontend/src/views/case-management/caseManagementFeature/components/caseTemplateDetail.vue
View File

@ -24,42 +24,19 @@
:preview-url="`${PreviewEditorImageUrl}/${currentProjectId}`"
/>
</a-form-item>
<a-form-item
field="step"
:label="
form.caseEditType === 'STEP'
? t('system.orgTemplate.stepDescription')
: t('system.orgTemplate.textDescription')
"
class="relative"
>
<div class="absolute left-16 top-0">
<a-divider direction="vertical" />
<a-dropdown :popup-max-height="false" @select="handleSelectType">
<span class="changeType">{{ t('system.orgTemplate.changeType') }} <icon-down /></span>
<template #content>
<a-doption value="STEP" :class="getSelectTypeClass('STEP')">
{{ t('system.orgTemplate.stepDescription') }}</a-doption
>
<a-doption value="TEXT" :class="getSelectTypeClass('TEXT')">{{
t('system.orgTemplate.textDescription')
}}</a-doption>
</template>
</a-dropdown>
</div>
<!-- 步骤描述 -->
<div v-if="form.caseEditType === 'STEP'" class="w-full">
<AddStep v-model:step-list="stepData" :is-disabled="false" />
</div>
<!-- 文本描述 -->
<MsRichText
v-else
v-model:raw="form.textDescription"
v-model:filed-ids="textDescriptionFileIds"
:upload-image="handleUploadImage"
:preview-url="`${PreviewEditorImageUrl}/${currentProjectId}`"
/>
</a-form-item>
<StepDescription v-model:caseEditType="form.caseEditType" />
<div v-if="form.caseEditType === 'STEP'" class="mb-[20px] w-full">
<AddStep v-model:step-list="stepData" :is-disabled="false" />
</div>
<!-- 文本描述 -->
<MsRichText
v-else
v-model:raw="form.textDescription"
v-model:filed-ids="textDescriptionFileIds"
class="mb-[20px]"
:upload-image="handleUploadImage"
:preview-url="`${PreviewEditorImageUrl}/${currentProjectId}`"
/>
<a-form-item
v-if="form.caseEditType === 'TEXT'"
field="remark"
@ -269,6 +246,7 @@
import SaveAsFilePopover from '@/components/business/ms-add-attachment/saveAsFilePopover.vue';
import LinkFileDrawer from '@/components/business/ms-link-file/associatedFileDrawer.vue';
import AddStep from './addStep.vue';
import StepDescription from '@/views/case-management/caseManagementFeature/components/tabContent/stepDescription.vue';
import {
checkFileIsUpdateRequest,

49
frontend/src/views/case-management/caseManagementFeature/components/tabContent/stepDescription.vue Normal file
View File

@ -0,0 +1,49 @@
<template>
<div class="mb-[16px] flex items-center">
<div class="font-bold text-[var(--color-text-1)]">
{{
innerCaseEditType === 'STEP' ? t('system.orgTemplate.stepDescription') : t('system.orgTemplate.textDescription')
}}
</div>
<div v-if="!props.isTestPlan" class="font-normal">
<a-divider direction="vertical" />
<a-dropdown :popup-max-height="false" @select="handleSelectType">
<span class="changeType">{{ t('system.orgTemplate.changeType') }} <icon-down /></span>
<template #content>
<a-doption value="STEP" :class="getSelectTypeClass('STEP')">
{{ t('system.orgTemplate.stepDescription') }}
</a-doption>
<a-doption value="TEXT" :class="getSelectTypeClass('TEXT')">
{{ t('system.orgTemplate.textDescription') }}
</a-doption>
</template>
</a-dropdown>
</div>
</div>
</template>
<script setup lang="ts">
import { useI18n } from '@/hooks/useI18n';
const { t } = useI18n();
const props = defineProps<{
isTestPlan?: boolean;
}>();
const innerCaseEditType = defineModel<string>('caseEditType', {
required: true,
});
// 更改类型
const handleSelectType = (value: string | number | Record<string, any> | undefined) => {
innerCaseEditType.value = value as string;
};
// 获取类型样式
function getSelectTypeClass(type: string) {
return innerCaseEditType.value === type ? ['bg-[rgb(var(--primary-1))]', '!text-[rgb(var(--primary-5))]'] : [];
}
</script>
<style scoped></style>

73
frontend/src/views/case-management/caseManagementFeature/components/tabContent/tabDetail.vue
View File

@ -36,58 +36,34 @@
class="markdown-body list-item-css !break-words break-all"
></div>
</a-form-item>
<a-form-item
field="step"
:label="
detailForm.caseEditType === 'STEP'
? t('system.orgTemplate.stepDescription')
: t('system.orgTemplate.textDescription')
"
class="relative"
>
<div v-if="!props.isTestPlan" class="absolute left-16 top-0 font-normal">
<a-divider direction="vertical" />
<a-dropdown :popup-max-height="false" @select="handleSelectType">
<span class="changeType cursor-pointer text-[var(--color-text-3)]"
>{{ t('system.orgTemplate.changeType') }} <icon-down
/></span>
<template #content>
<a-doption value="STEP" :class="getSelectTypeClass('STEP')">
{{ t('system.orgTemplate.stepDescription') }}</a-doption
>
<a-doption value="TEXT" :class="getSelectTypeClass('TEXT')">{{
t('system.orgTemplate.textDescription')
}}</a-doption>
</template>
</a-dropdown>
</div>
<!-- 步骤描述 -->
<div v-if="detailForm.caseEditType === 'STEP'" class="w-full">
<AddStep
v-model:step-list="stepData"
:is-scroll-y="false"
:is-test-plan="props.isTestPlan"
:is-disabled-test-plan="props.isDisabledTestPlan"
:is-disabled="!isEditPreposition"
/>
</div>
<!-- 文本描述 -->
<MsRichText
v-if="detailForm.caseEditType === 'TEXT' && isEditPreposition"
v-model:raw="detailForm.textDescription"
v-model:filed-ids="textDescriptionFileIds"
:upload-image="handleUploadImage"
:preview-url="`${PreviewEditorImageUrl}/${currentProjectId}`"
<StepDescription v-model:caseEditType="detailForm.caseEditType" :is-test-plan="props.isTestPlan" />
<!-- 步骤描述 -->
<div v-if="detailForm.caseEditType === 'STEP'" class="mb-[20px] w-full">
<AddStep
v-model:step-list="stepData"
:is-scroll-y="false"
:is-test-plan="props.isTestPlan"
:is-disabled-test-plan="props.isDisabledTestPlan"
:is-disabled="!isEditPreposition"
/>
<div
v-if="detailForm.caseEditType === 'TEXT' && !isEditPreposition"
v-dompurify-html="detailForm.textDescription || '-'"
class="markdown-body !break-words break-all"
></div>
</a-form-item>
</div>
<!-- 文本描述 -->
<MsRichText
v-if="detailForm.caseEditType === 'TEXT' && isEditPreposition"
v-model:raw="detailForm.textDescription"
v-model:filed-ids="textDescriptionFileIds"
:upload-image="handleUploadImage"
:preview-url="`${PreviewEditorImageUrl}/${currentProjectId}`"
/>
<div
v-if="detailForm.caseEditType === 'TEXT' && !isEditPreposition"
v-dompurify-html="detailForm.textDescription || '-'"
class="markdown-body !break-words break-all"
></div>
<a-form-item
v-if="detailForm.caseEditType === 'TEXT'"
field="remark"
class="mt-[20px]"
:label="t('caseManagement.featureCase.expectedResult')"
>
<MsRichText
@ -263,6 +239,7 @@
import SaveAsFilePopover from '@/components/business/ms-add-attachment/saveAsFilePopover.vue';
import LinkFileDrawer from '@/components/business/ms-link-file/associatedFileDrawer.vue';
import AddStep from '../addStep.vue';
import StepDescription from '@/views/case-management/caseManagementFeature/components/tabContent/stepDescription.vue';
import {
checkFileIsUpdateRequest,

37
frontend/src/views/setting/organization/template/components/caseTemplateLeftContent.vue
View File

@ -24,41 +24,21 @@
:editable="!props.isDisabled"
/>
</a-form-item>
<a-form-item
field="step"
:label="
form.caseEditType === 'STEP' ? t('system.orgTemplate.stepDescription') : t('system.orgTemplate.textDescription')
"
class="relative"
>
<div class="absolute left-16 top-0">
<a-divider direction="vertical" />
<a-dropdown :popup-max-height="false" @select="handleSelectType">
<span class="changeType">{{ t('system.orgTemplate.changeType') }} <icon-down /></span>
<template #content>
<a-doption value="STEP" :class="getSelectTypeClass('STEP')">
{{ t('system.orgTemplate.stepDescription') }}</a-doption
>
<a-doption value="TEXT" :class="getSelectTypeClass('TEXT')">{{
t('system.orgTemplate.textDescription')
}}</a-doption>
</template>
</a-dropdown>
</div>
<!-- 步骤描述 -->
<div v-if="form.caseEditType === 'STEP'" class="w-full">
<AddStep v-model:step-list="stepData" :is-disabled="props.isDisabled" />
</div>
<!-- 文本描述 -->
<StepDescription v-model:caseEditType="form.caseEditType" />
<!-- 步骤描述 -->
<div v-if="form.caseEditType === 'STEP'" class="mb-[20px] w-full">
<AddStep v-model:step-list="stepData" :is-disabled="props.isDisabled" />
</div>
<!-- 文本描述 -->
<div v-else class="pb-[20px]">
<MsRichText
v-else
v-model:raw="form.textDescription"
v-model:filed-ids="textDescriptionFileIds"
:upload-image="handleUploadImage"
:preview-url="previewEditorImageUrl"
:editable="!props.isDisabled"
/>
</a-form-item>
</div>
<a-form-item
v-if="form.caseEditType === 'TEXT'"
field="remark"
@ -94,6 +74,7 @@
import MsRichText from '@/components/pure/ms-rich-text/MsRichText.vue';
import AddAttachment from '@/components/business/ms-add-attachment/index.vue';
import AddStep from '@/views/case-management/caseManagementFeature/components/addStep.vue';
import StepDescription from '@/views/case-management/caseManagementFeature/components/tabContent/stepDescription.vue';
import { editorUploadFile } from '@/api/modules/setting/template';
import { previewOrgImageUrl, previewProImageUrl } from '@/api/requrls/setting/template';