fix(用例管理): 尝试开发环境tab切换问题修复
This commit is contained in:
parent
b7825b65ac
commit
bd24fbf7b4
|
@ -1,4 +1,4 @@
|
|||
export default {
|
||||
'formCreate.PleaseEnter': 'Please enter',
|
||||
'formCreate.PleaseEnter': 'Default value',
|
||||
'formCreate.PleaseSelect': 'Please select',
|
||||
};
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
export default {
|
||||
'formCreate.PleaseEnter': '请输入',
|
||||
'formCreate.PleaseEnter': '默认值',
|
||||
'formCreate.PleaseSelect': '请选择',
|
||||
};
|
||||
|
|
|
@ -92,7 +92,7 @@
|
|||
height: 'calc(100% - 86px)',
|
||||
}"
|
||||
>
|
||||
<!-- <MsSplitBox
|
||||
<MsSplitBox
|
||||
ref="wrapperRef"
|
||||
class="h-[calc(100% - 78px)]"
|
||||
expand-direction="right"
|
||||
|
@ -100,101 +100,119 @@
|
|||
:min="0.7"
|
||||
:size="900"
|
||||
>
|
||||
<template #first> -->
|
||||
<div class="leftWrapper">
|
||||
<div class="header h-[50px]">
|
||||
<a-menu mode="horizontal" :default-selected-keys="[activeTab || 'detail']" @menu-item-click="clickMenu">
|
||||
<a-menu-item key="detail">{{ t('caseManagement.featureCase.detail') }} </a-menu-item>
|
||||
<a-menu-item v-for="tab of tabSetting" :key="tab.key">
|
||||
<div class="flex items-center">
|
||||
<span>{{ t(tab.title) }}</span>
|
||||
<a-badge
|
||||
class="ml-1"
|
||||
:class="activeTab === tab.key ? 'active' : ''"
|
||||
:text="getTotal(tab.total)"
|
||||
/> </div
|
||||
></a-menu-item>
|
||||
<a-menu-item key="setting">
|
||||
<span @click="showMenuSetting">{{
|
||||
t('caseManagement.featureCase.detailDisplaySetting')
|
||||
}}</span></a-menu-item
|
||||
>
|
||||
</a-menu>
|
||||
</div>
|
||||
<div class="leftContent mt-4 px-4">
|
||||
<TabDetail
|
||||
v-if="activeTab === 'detail'"
|
||||
ref="tabDetailRef"
|
||||
:form="detailInfo"
|
||||
:allow-edit="true"
|
||||
:form-rules="formItem"
|
||||
@update-success="updateSuccess"
|
||||
/>
|
||||
<TabDemand v-else-if="activeTab === 'requirement'" :case-id="props.detailId" />
|
||||
<TabCaseTable v-else-if="activeTab === 'case'" :case-id="props.detailId" />
|
||||
<TabDefect v-else-if="activeTab === 'bug'" :case-id="props.detailId" />
|
||||
<TabDependency v-else-if="activeTab === 'dependency'" :case-id="props.detailId" />
|
||||
<TabCaseReview v-else-if="activeTab === 'caseReview'" :case-id="props.detailId" />
|
||||
<TabTestPlan v-else-if="activeTab === 'testPlan'" />
|
||||
<TabComment v-else-if="activeTab === 'comments'" ref="commentRef" :case-id="props.detailId" />
|
||||
<TabChangeHistory v-else-if="activeTab === 'changeHistory'" :case-id="props.detailId" />
|
||||
</div>
|
||||
</div>
|
||||
<!-- </template> -->
|
||||
<!-- <template #second> -->
|
||||
<div class="rightWrapper p-[24px]">
|
||||
<div class="mb-4 font-medium">{{ t('caseManagement.featureCase.basicInfo') }}</div>
|
||||
<div class="baseItem">
|
||||
<span class="label"> {{ t('caseManagement.featureCase.tableColumnModule') }}</span>
|
||||
<span class="w-[calc(100%-36%)]">
|
||||
<a-tree-select
|
||||
v-model="detailInfo.moduleId"
|
||||
:data="caseTree"
|
||||
<template #first>
|
||||
<div class="leftWrapper">
|
||||
<div class="header h-[50px]">
|
||||
<a-menu mode="horizontal" :default-selected-keys="[activeTab || 'detail']" @menu-item-click="clickMenu">
|
||||
<a-menu-item key="detail">{{ t('caseManagement.featureCase.detail') }} </a-menu-item>
|
||||
<a-menu-item v-for="tab of tabSetting" :key="tab.key">
|
||||
<div class="flex items-center">
|
||||
<span>{{ t(tab.title) }}</span>
|
||||
<a-badge
|
||||
class="ml-1"
|
||||
:class="activeTab === tab.key ? 'active' : ''"
|
||||
:text="getTotal(tab.total)"
|
||||
/> </div
|
||||
></a-menu-item>
|
||||
<a-menu-item key="setting">
|
||||
<span @click="showMenuSetting">{{
|
||||
t('caseManagement.featureCase.detailDisplaySetting')
|
||||
}}</span></a-menu-item
|
||||
>
|
||||
</a-menu>
|
||||
</div>
|
||||
<div class="leftContent mt-4 px-4">
|
||||
<template v-if="activeTab === 'detail'">
|
||||
<TabDetail
|
||||
ref="tabDetailRef"
|
||||
:form="detailInfo"
|
||||
:allow-edit="true"
|
||||
:form-rules="formItem"
|
||||
:active-tab="activeTab"
|
||||
@update-success="updateSuccess"
|
||||
/>
|
||||
</template>
|
||||
<template v-if="activeTab === 'requirement'">
|
||||
<TabDemand :active-tab="activeTab" :case-id="props.detailId" />
|
||||
</template>
|
||||
<template v-if="activeTab === 'case'">
|
||||
<TabCaseTable :active-tab="activeTab" :case-id="props.detailId" />
|
||||
</template>
|
||||
<template v-if="activeTab === 'bug'">
|
||||
<TabDefect :active-tab="activeTab" :case-id="props.detailId" />
|
||||
</template>
|
||||
<template v-if="activeTab === 'dependency'">
|
||||
<TabDependency :active-tab="activeTab" :case-id="props.detailId" />
|
||||
</template>
|
||||
<template v-if="activeTab === 'caseReview'">
|
||||
<TabCaseReview :active-tab="activeTab" :case-id="props.detailId" />
|
||||
</template>
|
||||
<template v-if="activeTab === 'testPlan'">
|
||||
<TabTestPlan :active-tab="activeTab" />
|
||||
</template>
|
||||
<template v-if="activeTab === 'comments'">
|
||||
<TabComment ref="commentRef" :active-tab="activeTab" :case-id="props.detailId" />
|
||||
</template>
|
||||
<template v-if="activeTab === 'changeHistory'">
|
||||
<TabChangeHistory :active-tab="activeTab" :case-id="props.detailId" />
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<template #second>
|
||||
<div class="rightWrapper p-[24px]">
|
||||
<div class="mb-4 font-medium">{{ t('caseManagement.featureCase.basicInfo') }}</div>
|
||||
<div class="baseItem">
|
||||
<span class="label"> {{ t('caseManagement.featureCase.tableColumnModule') }}</span>
|
||||
<span class="w-[calc(100%-36%)]">
|
||||
<a-tree-select
|
||||
v-model="detailInfo.moduleId"
|
||||
:data="caseTree"
|
||||
class="w-full"
|
||||
:allow-search="true"
|
||||
:field-names="{
|
||||
title: 'name',
|
||||
key: 'id',
|
||||
children: 'children',
|
||||
}"
|
||||
:tree-props="{
|
||||
virtualListProps: {
|
||||
height: 200,
|
||||
},
|
||||
}"
|
||||
@change="handleChangeModule"
|
||||
></a-tree-select>
|
||||
</span>
|
||||
</div>
|
||||
<!-- 自定义字段开始 -->
|
||||
<MsFormCreate
|
||||
v-if="formRules.length"
|
||||
ref="formCreateRef"
|
||||
v-model:api="fApi"
|
||||
v-model:form-item="formItem"
|
||||
:form-rule="formRules"
|
||||
class="w-full"
|
||||
:allow-search="true"
|
||||
:field-names="{
|
||||
title: 'name',
|
||||
key: 'id',
|
||||
children: 'children',
|
||||
}"
|
||||
:tree-props="{
|
||||
virtualListProps: {
|
||||
height: 200,
|
||||
},
|
||||
}"
|
||||
@change="handleChangeModule"
|
||||
></a-tree-select>
|
||||
</span>
|
||||
</div>
|
||||
<!-- 自定义字段开始 -->
|
||||
<MsFormCreate
|
||||
v-if="formRules.length"
|
||||
ref="formCreateRef"
|
||||
v-model:api="fApi"
|
||||
v-model:form-item="formItem"
|
||||
:form-rule="formRules"
|
||||
class="w-full"
|
||||
:option="options"
|
||||
@change="changeHandler"
|
||||
/>
|
||||
<!-- 自定义字段结束 -->
|
||||
<div class="baseItem">
|
||||
<span class="label"> {{ t('caseManagement.featureCase.tableColumnCreateUser') }}</span>
|
||||
<span>{{ detailInfo?.createUserName }}</span>
|
||||
</div>
|
||||
<div class="baseItem">
|
||||
<span class="label"> {{ t('caseManagement.featureCase.tableColumnCreateTime') }}</span>
|
||||
<span>{{ dayjs(detailInfo?.createTime).format('YYYY-MM-DD HH:mm:ss') }}</span>
|
||||
</div>
|
||||
<div class="baseItem">
|
||||
<span class="label"> {{ t('caseManagement.featureCase.tableColumnCreateTime') }}</span>
|
||||
<span>
|
||||
<MsTag v-for="item of detailInfo.tags" :key="item"> {{ item }} </MsTag>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<!-- </template> -->
|
||||
<!-- </MsSplitBox> -->
|
||||
:option="options"
|
||||
@change="changeHandler"
|
||||
/>
|
||||
<!-- 自定义字段结束 -->
|
||||
<div class="baseItem">
|
||||
<span class="label"> {{ t('caseManagement.featureCase.tableColumnCreateUser') }}</span>
|
||||
<span>{{ detailInfo?.createUserName }}</span>
|
||||
</div>
|
||||
<div class="baseItem">
|
||||
<span class="label"> {{ t('caseManagement.featureCase.tableColumnCreateTime') }}</span>
|
||||
<span>{{ dayjs(detailInfo?.createTime).format('YYYY-MM-DD HH:mm:ss') }}</span>
|
||||
</div>
|
||||
<div class="baseItem">
|
||||
<span class="label"> {{ t('caseManagement.featureCase.tableColumnCreateTime') }}</span>
|
||||
<span>
|
||||
<MsTag v-for="item of detailInfo.tags" :key="item"> {{ item }} </MsTag>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</MsSplitBox>
|
||||
<inputComment
|
||||
v-model:content="content"
|
||||
v-model:notice-user-ids="noticeUserIds"
|
||||
|
@ -280,7 +298,6 @@
|
|||
}>();
|
||||
|
||||
const emit = defineEmits(['update:visible', 'success']);
|
||||
|
||||
const userId = computed(() => userStore.userInfo.id);
|
||||
const appStore = useAppStore();
|
||||
|
||||
|
@ -608,6 +625,7 @@
|
|||
}
|
||||
}
|
||||
);
|
||||
provide('activeTab', activeTab.value);
|
||||
|
||||
onMounted(() => {
|
||||
settingDrawerRef.value.getTabModule();
|
||||
|
|
|
@ -465,18 +465,21 @@
|
|||
'slotName': 'num',
|
||||
'dataIndex': 'num',
|
||||
'width': 200,
|
||||
'showInTable': true,
|
||||
'sortable': {
|
||||
sortDirections: ['ascend', 'descend'],
|
||||
sorter: true,
|
||||
},
|
||||
'filter-icon-align-left': true,
|
||||
'showTooltip': true,
|
||||
'ellipsis': true,
|
||||
'showDrag': false,
|
||||
},
|
||||
{
|
||||
title: 'caseManagement.featureCase.tableColumnName',
|
||||
slotName: 'name',
|
||||
dataIndex: 'name',
|
||||
showInTable: true,
|
||||
showTooltip: true,
|
||||
width: 300,
|
||||
editType: hasAnyPermission(['FUNCTIONAL_CASE:READ+UPDATE']) ? ColumnEditTypeEnum.INPUT : undefined,
|
||||
|
@ -484,6 +487,7 @@
|
|||
sortDirections: ['ascend', 'descend'],
|
||||
sorter: true,
|
||||
},
|
||||
ellipsis: true,
|
||||
showDrag: false,
|
||||
},
|
||||
{
|
||||
|
@ -787,7 +791,7 @@
|
|||
}
|
||||
}
|
||||
const initDefaultFields = ref<CustomAttributes[]>([]);
|
||||
// let fullColumns: MsTableColumn = []; // 全量列表
|
||||
let fullColumns: MsTableColumn = []; // 全量列表
|
||||
|
||||
const { propsRes, propsEvent, loadList, setLoadListParams, resetSelector, setKeyword, setAdvanceFilter } = useTable(
|
||||
getCaseList,
|
||||
|
@ -1179,7 +1183,6 @@
|
|||
// 处理自定义字段列
|
||||
let customFieldsColumns: Record<string, any>[] = [];
|
||||
const tableRef = ref<InstanceType<typeof MsBaseTable> | null>(null);
|
||||
const fullColumns = ref<MsTableColumn>([]);
|
||||
|
||||
// 处理自定义字段展示
|
||||
async function getDefaultFields() {
|
||||
|
@ -1201,12 +1204,12 @@
|
|||
|
||||
caseLevelFields.value = result.customFields.find((item: any) => item.internal && item.fieldName === '用例等级');
|
||||
caseFilters.value = caseLevelFields.value.options.map((item: any) => item.value);
|
||||
fullColumns.value = [
|
||||
fullColumns = [
|
||||
...columns.slice(0, columns.length - 1),
|
||||
...customFieldsColumns,
|
||||
...columns.slice(columns.length - 1, columns.length),
|
||||
];
|
||||
await tableStore.initColumn(TableKeyEnum.CASE_MANAGEMENT_TABLE, fullColumns.value, 'drawer');
|
||||
await tableStore.initColumn(TableKeyEnum.CASE_MANAGEMENT_TABLE, fullColumns, 'drawer');
|
||||
}
|
||||
|
||||
// 如果是用例等级
|
||||
|
|
|
@ -128,6 +128,7 @@
|
|||
|
||||
const props = defineProps<{
|
||||
caseId: string;
|
||||
activeTab: string;
|
||||
}>();
|
||||
|
||||
const showType = ref('link');
|
||||
|
|
|
@ -97,7 +97,11 @@
|
|||
const { t } = useI18n();
|
||||
|
||||
const currentProjectId = computed(() => appStore.currentProjectId);
|
||||
|
||||
const activeTab = inject<string>('activeTab');
|
||||
const newActive = computed(() => {
|
||||
return activeTab;
|
||||
});
|
||||
console.log(newActive.value);
|
||||
const props = defineProps<{
|
||||
caseId: string; // 用例id
|
||||
}>();
|
||||
|
|
|
@ -52,6 +52,7 @@
|
|||
|
||||
const props = defineProps<{
|
||||
caseId: string; // 用例id
|
||||
activeTab: string;
|
||||
}>();
|
||||
|
||||
const keyword = ref<string>('');
|
||||
|
|
|
@ -101,6 +101,7 @@
|
|||
|
||||
const props = defineProps<{
|
||||
caseId: string;
|
||||
activeTab: string;
|
||||
}>();
|
||||
|
||||
const columns: MsTableColumn = [
|
||||
|
|
|
@ -52,6 +52,7 @@
|
|||
|
||||
const props = defineProps<{
|
||||
caseId: string;
|
||||
activeTab: string;
|
||||
}>();
|
||||
|
||||
const activeComment = ref('caseComment');
|
||||
|
|
|
@ -107,9 +107,9 @@
|
|||
const appStore = useAppStore();
|
||||
|
||||
const currentProjectId = computed(() => appStore.currentProjectId);
|
||||
|
||||
const props = defineProps<{
|
||||
caseId: string;
|
||||
activeTab: string;
|
||||
}>();
|
||||
|
||||
const keyword = ref<string>('');
|
||||
|
|
|
@ -94,6 +94,7 @@
|
|||
const keyword = ref<string>('');
|
||||
const props = defineProps<{
|
||||
caseId: string;
|
||||
activeTab: string;
|
||||
}>();
|
||||
|
||||
const columns: MsTableColumn = [
|
||||
|
|
|
@ -304,6 +304,7 @@
|
|||
form: DetailCase;
|
||||
allowEdit?: boolean; // 是否允许编辑
|
||||
formRules?: FormRuleItem[]; // 编辑表单
|
||||
activeTab?: string;
|
||||
}>(),
|
||||
{
|
||||
allowEdit: true, // 是否允许编辑
|
||||
|
|
|
@ -19,7 +19,6 @@
|
|||
asterisk-position="end"
|
||||
:hide-label="true"
|
||||
hide-asterisk
|
||||
:rules="[{ required: true, message: t('system.orgTemplate.templateNameRules') }]"
|
||||
content-class="contentClass"
|
||||
class="mb-0 max-w-[710px]"
|
||||
>
|
||||
|
@ -28,7 +27,9 @@
|
|||
:placeholder="t('system.orgTemplate.templateNamePlaceholder')"
|
||||
:max-length="255"
|
||||
class="max-w-[732px]"
|
||||
:error="isError"
|
||||
:disabled="templateForm?.internal"
|
||||
@input="inputHandler"
|
||||
></a-input>
|
||||
</a-form-item>
|
||||
<span v-else class="font-medium text-[var(--color-text-1)] underline">{{ templateForm.name }}</span>
|
||||
|
@ -67,7 +68,7 @@
|
|||
v-model="formItem.required"
|
||||
class="mr-1"
|
||||
@change="(value) => changeState(value, formItem)"
|
||||
>{{ t('ms.assertion.mustInclude') }}</a-checkbox
|
||||
>{{ t('system.orgTemplate.required') }}</a-checkbox
|
||||
>
|
||||
</span>
|
||||
<div class="actionList">
|
||||
|
@ -330,12 +331,24 @@
|
|||
function resetForm() {
|
||||
templateForm.value = { ...initTemplateForm };
|
||||
}
|
||||
const isError = ref(false);
|
||||
|
||||
function inputHandler(value: string) {
|
||||
if (value.trim().length === 0) {
|
||||
isError.value = true;
|
||||
}
|
||||
isError.value = false;
|
||||
}
|
||||
// 保存回调
|
||||
async function save() {
|
||||
try {
|
||||
loading.value = true;
|
||||
const params = getTemplateParams();
|
||||
if (!templateForm.value.name) {
|
||||
isError.value = true;
|
||||
Message.error(t('system.orgTemplate.templateNamePlaceholder'));
|
||||
return;
|
||||
}
|
||||
if (isEdit.value && route.params.mode !== 'copy') {
|
||||
await templateApiMaps[props.mode].update(params);
|
||||
Message.success(t('system.orgTemplate.updateSuccess'));
|
||||
|
@ -416,7 +429,7 @@
|
|||
title.value = t('system.orgTemplate.createTemplateType', {
|
||||
type: getTemplateName('organization', route.query.type as string),
|
||||
});
|
||||
templateForm.value.name = title.value;
|
||||
// templateForm.value.name = title.value;
|
||||
}
|
||||
});
|
||||
|
||||
|
@ -680,29 +693,29 @@
|
|||
:deep(.selfClass) {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
:deep(.contentClass > .arco-input-wrapper) {
|
||||
border-color: transparent;
|
||||
&:hover {
|
||||
border-color: var(--color-text-input-border);
|
||||
}
|
||||
&:hover > .arco-input {
|
||||
font-weight: normal;
|
||||
text-decoration: none;
|
||||
color: var(--color-text-1);
|
||||
}
|
||||
& > .arco-input {
|
||||
font-weight: 500;
|
||||
text-decoration: underline;
|
||||
color: var(--color-text-1);
|
||||
}
|
||||
}
|
||||
:deep(.contentClass > .arco-input-focus) {
|
||||
border-color: rgb(var(--primary-5));
|
||||
& > .arco-input {
|
||||
font-weight: normal;
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
// :deep(.contentClass > .arco-input-wrapper) {
|
||||
// border-color: transparent;
|
||||
// &:hover {
|
||||
// border-color: var(--color-text-input-border);
|
||||
// }
|
||||
// &:hover > .arco-input {
|
||||
// font-weight: normal;
|
||||
// text-decoration: none;
|
||||
// color: var(--color-text-1);
|
||||
// }
|
||||
// & > .arco-input {
|
||||
// font-weight: 500;
|
||||
// text-decoration: underline;
|
||||
// color: var(--color-text-1);
|
||||
// }
|
||||
// }
|
||||
// :deep(.contentClass > .arco-input-focus) {
|
||||
// border-color: rgb(var(--primary-5));
|
||||
// & > .arco-input {
|
||||
// font-weight: normal;
|
||||
// text-decoration: none;
|
||||
// }
|
||||
// }
|
||||
.ghost {
|
||||
border: 1px solid rgba(var(--primary-5));
|
||||
background-color: var(--color-text-n9);
|
||||
|
|
|
@ -20,7 +20,12 @@
|
|||
</a-alert>
|
||||
<div class="mb-4 flex items-center justify-between">
|
||||
<span v-if="isEnabledTemplate" class="font-medium">{{ t('system.orgTemplate.fieldList') }}</span>
|
||||
<a-button v-permission="props.createPermission" type="primary" :disabled="isDisabled" @click="fieldHandler">
|
||||
<a-button
|
||||
v-if="!isEnabledTemplate && hasAnyPermission(props.createPermission)"
|
||||
type="primary"
|
||||
:disabled="isDisabled"
|
||||
@click="fieldHandler"
|
||||
>
|
||||
{{ t('system.orgTemplate.addField') }}
|
||||
</a-button>
|
||||
<a-input-search
|
||||
|
|
|
@ -67,7 +67,7 @@ export default {
|
|||
'system.orgTemplate.columnTemplateName': '模板名称',
|
||||
'system.orgTemplate.copy': '复制',
|
||||
'system.orgTemplate.defaultValue': '默认值',
|
||||
'system.orgTemplate.required': '是否必填',
|
||||
'system.orgTemplate.required': '必填',
|
||||
'system.orgTemplate.enableTemplateTip': '已启用项目模板,组织模板不可操作',
|
||||
'system.orgTemplate.templateList': ' {type}列表',
|
||||
'system.orgTemplate.createTemplate': '创建模板',
|
||||
|
|
Loading…
Reference in New Issue