fix: 工况弹出层最大高度
This commit is contained in:
@@ -25,7 +25,12 @@
|
||||
<OverflowTooltip :content="selectedTemplates[0].templateName" max-width="120px" />
|
||||
</template>
|
||||
<template v-else-if="selectedTemplates.length >= 2">
|
||||
<el-popover placement="bottom" trigger="hover" :width="220">
|
||||
<el-popover
|
||||
placement="bottom"
|
||||
trigger="hover"
|
||||
:width="400"
|
||||
popper-class="flow-template-select-popover"
|
||||
>
|
||||
<template #reference>
|
||||
<span class="link-text">
|
||||
{{ $t('工况库.关联N个流程模版', { count: selectedTemplates.length }) }}
|
||||
@@ -33,7 +38,7 @@
|
||||
</template>
|
||||
<div class="template-list">
|
||||
<div v-for="item in selectedTemplates" :key="item.uuid" class="template-item">
|
||||
<el-icon class="view" @click="previewFlow(item.uuid)">
|
||||
<el-icon class="view" :title="$t('通用.预览')" @click="previewFlow(item.uuid)">
|
||||
<View />
|
||||
</el-icon>
|
||||
<OverflowTooltip :content="item.templateName" class="item-name" />
|
||||
@@ -163,14 +168,24 @@ const previewFlow = (uuid: string) => {
|
||||
}
|
||||
|
||||
.template-list {
|
||||
max-height: 400px;
|
||||
overflow-y: auto;
|
||||
|
||||
.template-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 4px 0;
|
||||
padding: 8px 0;
|
||||
border-bottom: 1px solid var(--el-border-color-lighter);
|
||||
|
||||
&:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.item-name {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.view {
|
||||
flex-shrink: 0;
|
||||
cursor: pointer;
|
||||
@@ -180,3 +195,10 @@ const previewFlow = (uuid: string) => {
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<style lang="scss">
|
||||
.flow-template-select-popover {
|
||||
max-height: 450px;
|
||||
overflow: hidden;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -23,7 +23,12 @@
|
||||
<OverflowTooltip :content="displayNames[0]" max-width="120px" />
|
||||
</template>
|
||||
<template v-else-if="displayNames.length >= 2">
|
||||
<el-popover placement="bottom" trigger="hover" :width="220">
|
||||
<el-popover
|
||||
placement="bottom"
|
||||
trigger="hover"
|
||||
:width="400"
|
||||
popper-class="knowledge-select-popover"
|
||||
>
|
||||
<template #reference>
|
||||
<span class="link-text">
|
||||
{{ $t('工况库.关联N个执行规范', { count: displayNames.length }) }}
|
||||
@@ -31,7 +36,11 @@
|
||||
</template>
|
||||
<div class="template-list">
|
||||
<div v-for="(name, index) in displayNames" :key="index" class="template-item">
|
||||
<el-icon class="view" @click="previewFileFun(currentFileIds[index])">
|
||||
<el-icon
|
||||
class="view"
|
||||
:title="$t('通用.预览')"
|
||||
@click="previewFileFun(currentFileIds[index])"
|
||||
>
|
||||
<View />
|
||||
</el-icon>
|
||||
<OverflowTooltip :content="name" class="item-name" />
|
||||
@@ -298,6 +307,10 @@ onMounted(() => {});
|
||||
.tree-case-knowledge-select-full-width.el-cascader {
|
||||
width: 100%;
|
||||
}
|
||||
.knowledge-select-popover {
|
||||
max-height: 450px;
|
||||
overflow: hidden;
|
||||
}
|
||||
</style>
|
||||
|
||||
<style scoped lang="scss">
|
||||
@@ -328,14 +341,24 @@ onMounted(() => {});
|
||||
}
|
||||
|
||||
.template-list {
|
||||
max-height: 400px;
|
||||
overflow-y: auto;
|
||||
|
||||
.template-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 4px 0;
|
||||
padding: 8px 0;
|
||||
border-bottom: 1px solid var(--el-border-color-lighter);
|
||||
|
||||
&:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.item-name {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.view {
|
||||
flex-shrink: 0;
|
||||
cursor: pointer;
|
||||
|
||||
@@ -34,18 +34,25 @@
|
||||
</span>
|
||||
</template>
|
||||
<template v-else-if="totalTaskCount >= 2">
|
||||
<el-popover placement="bottom" trigger="hover" :width="280">
|
||||
<el-popover
|
||||
placement="bottom"
|
||||
trigger="hover"
|
||||
:width="400"
|
||||
popper-class="pool-task-popover"
|
||||
>
|
||||
<template #reference>
|
||||
<span class="link-text">{{ $t('工况库.关联N个工况', { count: totalTaskCount }) }}</span>
|
||||
</template>
|
||||
<div class="pool-list">
|
||||
<div v-for="(pool, index) in modelValue" :key="index" class="pool-item">
|
||||
<span class="pool-name"
|
||||
>{{ pool.simulationPoolName }}_{{ pool.simulationPoolVersion }}</span
|
||||
>
|
||||
<span v-if="pool.taskBaseInfoList?.length" class="task-list">
|
||||
({{ pool.taskBaseInfoList.map((t) => t.taskName).join(', ') }})
|
||||
</span>
|
||||
<div class="pool-header">
|
||||
<span class="pool-name"
|
||||
>{{ pool.simulationPoolName }}_{{ pool.simulationPoolVersion }}</span
|
||||
>
|
||||
</div>
|
||||
<div v-if="pool.taskBaseInfoList?.length" class="task-list">
|
||||
{{ pool.taskBaseInfoList.map((t) => t.taskName).join(', ') }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-popover>
|
||||
@@ -249,15 +256,42 @@ const removeTagFun = () => {
|
||||
}
|
||||
|
||||
.pool-list {
|
||||
max-height: 400px;
|
||||
overflow-y: auto;
|
||||
|
||||
.pool-item {
|
||||
padding: 4px 0;
|
||||
.pool-name {
|
||||
font-weight: bold;
|
||||
padding: 8px 0;
|
||||
border-bottom: 1px solid var(--el-border-color-lighter);
|
||||
|
||||
&:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.pool-header {
|
||||
margin-bottom: 4px;
|
||||
|
||||
.pool-name {
|
||||
font-weight: bold;
|
||||
color: var(--el-text-color-primary);
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
.task-list {
|
||||
color: #595959;
|
||||
font-size: var(--font-size-text-small);
|
||||
color: var(--el-text-color-secondary);
|
||||
font-size: 12px;
|
||||
line-height: 1.5;
|
||||
word-break: break-all;
|
||||
white-space: normal;
|
||||
padding-left: 8px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<style lang="scss">
|
||||
.pool-task-popover {
|
||||
max-height: 450px;
|
||||
overflow: hidden;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -304,7 +304,9 @@ const validateFun = (): boolean => {
|
||||
ElMessage.warning(t('工况库.名称不能为空'));
|
||||
return false;
|
||||
}
|
||||
const emptyCodeNodes = visibleData.filter((n: any) => n.nodeType === NODE_TYPE.TASK && !n.nodeCode);
|
||||
const emptyCodeNodes = visibleData.filter(
|
||||
(n: any) => n.nodeType === NODE_TYPE.TASK && !n.nodeCode
|
||||
);
|
||||
if (emptyCodeNodes.length > 0) {
|
||||
const names = emptyCodeNodes.map((n: any) => n.nodeName).join(', ');
|
||||
ElMessage.warning(t('工况库.编号不能为空', { names }));
|
||||
|
||||
Reference in New Issue
Block a user