fix(data-process): 限制结果提示浮层尺寸
This commit is contained in:
@@ -43,6 +43,11 @@ const restoringResultId = ref<string | number | null>(null)
|
||||
const publishDialogVisible = ref(false)
|
||||
const publishing = ref(false)
|
||||
const configExpanded = ref(false)
|
||||
const resultCellTooltipOptions = {
|
||||
popperClass: 'data-process-result-tooltip',
|
||||
placement: 'top',
|
||||
showAfter: 300,
|
||||
} as const
|
||||
let resultFilterTimer: ReturnType<typeof setTimeout> | null = null
|
||||
|
||||
const editForm = reactive({ instruction: '', input: '', output: '' })
|
||||
@@ -656,7 +661,13 @@ onBeforeUnmount(() => {
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<el-table v-if="results.length" :data="results" row-key="id" table-layout="fixed">
|
||||
<el-table
|
||||
v-if="results.length"
|
||||
:data="results"
|
||||
:tooltip-options="resultCellTooltipOptions"
|
||||
row-key="id"
|
||||
table-layout="fixed"
|
||||
>
|
||||
<el-table-column type="index" label="#" width="56" align="center" />
|
||||
<el-table-column label="指令" min-width="190" show-overflow-tooltip prop="instruction" />
|
||||
<el-table-column label="输入" min-width="160" show-overflow-tooltip prop="input" />
|
||||
@@ -858,6 +869,17 @@ onBeforeUnmount(() => {
|
||||
.result-filters :deep(.el-select) { width: 120px; }
|
||||
.result-section :deep(.el-table) { border-radius: 0; }
|
||||
|
||||
:global(.data-process-result-tooltip) {
|
||||
box-sizing: border-box;
|
||||
max-width: min(520px, calc(100vw - 32px));
|
||||
max-height: 240px;
|
||||
overflow-y: auto;
|
||||
white-space: pre-wrap;
|
||||
overflow-wrap: anywhere;
|
||||
word-break: break-word;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
.result-empty, .not-found-state {
|
||||
min-height: 220px; display: flex; flex-direction: column; align-items: center; justify-content: center; color: #94a3b8;
|
||||
> i { margin-bottom: 12px; color: var(--el-color-primary-light-5); font-size: 30px; }
|
||||
|
||||
Reference in New Issue
Block a user