admin/n8n-enterprise-unlocked
1
0
Fork 0
mirror of https://github.com/Abdulazizzn/n8n-enterprise-unlocked.git synced 2025-12-17 10:02:05 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: Update mapping pill for table/json views (#4965)

Browse Source 
* feat: standarize mapping pill

* test: update test
This commit is contained in:
Mutasem Aldmour
2022-12-20 09:39:38 +01:00
committed by GitHub
parent 90bfdfd577
commit 343f53bf53
6 changed files with 72 additions and 121 deletions
Download Patch File Download Diff File Expand all files Collapse all files

48
packages/editor-ui/src/components/RunDataTable.vue
View File

@@ -40,15 +40,7 @@
@dragend="(column) => onDragEnd(column, 'column')"
>
<template #preview="{ canDrop }">
<div
:class="[$style.dragPill, canDrop ? $style.droppablePill : $style.defaultPill]"
>
{{
$locale.baseText('dataMapping.mapKeyToField', {
interpolate: { name: shorten(column, 16, 2) },
})
}}
</div>
<MappingPill :html="shorten(column, 16, 2)" :can-drop="canDrop" />
</template>
<template #default="{ isDragging }">
<div
@@ -105,18 +97,7 @@
ref="draggable"
>
<template #preview="{ canDrop, el }">
<div :class="[$style.dragPill, canDrop ? $style.droppablePill : $style.defaultPill]">
{{
$locale.baseText(
tableData.data.length > 1
? 'dataMapping.mapAllKeysToField'
: 'dataMapping.mapKeyToField',
{
interpolate: { name: shorten(getPathNameFromTarget(el) || '', 16, 2) },
},
)
}}
</div>
<MappingPill :html="shorten(getPathNameFromTarget(el) || '', 16, 2)" :can-drop="canDrop" />
</template>
<template>
<tr
@@ -185,12 +166,13 @@ import { externalHooks } from '@/mixins/externalHooks';
import { mapStores } from 'pinia';
import { useWorkflowsStore } from '@/stores/workflows';
import { useNDVStore } from '@/stores/ndv';
import MappingPill from './MappingPill.vue';
const MAX_COLUMNS_LIMIT = 40;
export default mixins(externalHooks).extend({
name: 'run-data-table',
components: { Draggable },
components: { Draggable, MappingPill },
props: {
node: {
type: Object as PropType<INodeUi>,
@@ -665,28 +647,6 @@ export default mixins(externalHooks).extend({
margin-left: var(--spacing-2xs);
}
.dragPill {
display: flex;
height: 24px;
align-items: center;
padding: 0 var(--spacing-4xs);
color: var(--color-text-xlight);
font-weight: var(--font-weight-bold);
font-size: var(--font-size-2xs);
border-radius: var(--border-radius-base);
white-space: nowrap;
}
.droppablePill {
background-color: var(--color-success);
}
.defaultPill {
background-color: var(--color-primary);
transform: translate(-50%, -100%);
box-shadow: 0px 2px 6px rgba(68, 28, 23, 0.2);
}
.dataKey {
color: var(--color-text-dark);
line-height: 1.7;