mirror of
https://github.com/n8n-io/n8n.git
synced 2025-01-11 21:07:28 -08:00
add hover behavior
This commit is contained in:
parent
a80a56021c
commit
b483c40e3b
|
@ -123,6 +123,18 @@ function isHoveringRow(row: number): boolean {
|
|||
return pairedItemMappings.value[itemNodeId].has(hoveringItemId);
|
||||
}
|
||||
|
||||
function showExecutionLink(index: number) {
|
||||
if (index === activeRow.value) {
|
||||
return true;
|
||||
}
|
||||
|
||||
if (activeRow.value === null) {
|
||||
return index === 0;
|
||||
}
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
function onMouseEnterCell(e: MouseEvent) {
|
||||
const target = e.target;
|
||||
if (target && props.mappingEnabled) {
|
||||
|
@ -442,8 +454,8 @@ watch(focusedMappableInput, (curr) => {
|
|||
<table v-else :class="$style.table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>
|
||||
<!-- column for item index and execution link -->
|
||||
<th v-if="tableData.metadata.hasExecutionIds" :class="$style.executionLinkRowHeader">
|
||||
<!-- column for execution link -->
|
||||
</th>
|
||||
<th v-for="(column, i) in tableData.columns || []" :key="column">
|
||||
<N8nTooltip placement="bottom-start" :disabled="!mappingEnabled" :show-after="1000">
|
||||
|
@ -532,13 +544,20 @@ watch(focusedMappableInput, (curr) => {
|
|||
:class="{ [$style.hoveringRow]: isHoveringRow(index1) }"
|
||||
:data-test-id="isHoveringRow(index1) ? 'hovering-item' : undefined"
|
||||
>
|
||||
<td v-if="tableData.metadata.hasExecutionIds">
|
||||
<td
|
||||
v-if="tableData.metadata.hasExecutionIds"
|
||||
:data-row="index1"
|
||||
:class="$style.executionLinkCell"
|
||||
@mouseenter="onMouseEnterCell"
|
||||
@mouseleave="onMouseLeaveCell"
|
||||
>
|
||||
<N8nIconButton
|
||||
v-if="tableData.metadata.data[index1]"
|
||||
v-show="showExecutionLink(index1)"
|
||||
type="secondary"
|
||||
icon="external-link-alt"
|
||||
data-test-id="debug-sub-execution"
|
||||
size="small"
|
||||
size="mini"
|
||||
@click="openExecution(tableData.metadata.data[index1])"
|
||||
/>
|
||||
</td>
|
||||
|
@ -776,4 +795,12 @@ watch(focusedMappableInput, (curr) => {
|
|||
.warningTooltip {
|
||||
color: var(--color-warning);
|
||||
}
|
||||
|
||||
.executionLinkCell {
|
||||
padding: var(--spacing-3xs) !important;
|
||||
}
|
||||
|
||||
.executionLinkRowHeader {
|
||||
width: var(--spacing-m);
|
||||
}
|
||||
</style>
|
||||
|
|
Loading…
Reference in a new issue