Added node credentials type proxy. Changed node credentials input order.

This commit is contained in:
Alex Grozav 2022-04-26 17:16:16 +03:00 committed by Iván Ovejero
parent f8e992c453
commit 2808ee962d
3 changed files with 61 additions and 16 deletions

View file

@ -1,5 +1,5 @@
<template>
<div v-if="credentialTypesNodeDescriptionDisplayed.length" :class="$style.container">
<div v-if="credentialTypesNodeDescriptionDisplayed.length" :class="['node-credentials', $style.container]">
<div v-for="credentialTypeDescription in credentialTypesNodeDescriptionDisplayed" :key="credentialTypeDescription.name">
<n8n-input-label
:label="$locale.baseText(
@ -11,15 +11,20 @@
}
)"
:bold="false"
size="small"
:set="issues = getIssues(credentialTypeDescription.name)"
size="small"
>
<div v-if="isReadOnly">
<n8n-input disabled :value="selected && selected[credentialTypeDescription.name] && selected[credentialTypeDescription.name].name" size="small" />
<n8n-input
:value="selected && selected[credentialTypeDescription.name] && selected[credentialTypeDescription.name].name"
disabled
size="small"
/>
</div>
<div :class="issues.length ? $style.hasIssues : $style.input" v-else >
<div
v-else
:class="issues.length ? $style.hasIssues : $style.input"
>
<n8n-select :value="getSelectedId(credentialTypeDescription.name)" @change="(value) => onCredentialSelected(credentialTypeDescription.name, value)" :placeholder="$locale.baseText('nodeCredentials.selectCredential')" size="small">
<n8n-option
v-for="(item) in credentialOptions[credentialTypeDescription.name]"
@ -93,6 +98,13 @@ export default mixins(
...mapGetters('credentials', {
credentialOptions: 'allCredentialsByType',
}),
isProxyCredentialType(): boolean {
const proxyCredentialNodeTypes = ["n8n-nodes-base.httpRequest"];
return proxyCredentialNodeTypes.includes(this.node.type)
&& this.node.parameters.authenticateWith === 'nodeCredential'
&& this.node.parameters.nodeCredentialType;
},
credentialTypesNode (): string[] {
return this.credentialTypesNodeDescription
.map((credentialTypeDescription) => credentialTypeDescription.name);
@ -106,6 +118,10 @@ export default mixins(
credentialTypesNodeDescription (): INodeCredentialDescription[] {
const node = this.node as INodeUi;
if (this.isProxyCredentialType) {
return [this.$store.getters['credentials/getCredentialTypeByName'](this.node.parameters.nodeCredentialType)];
}
const activeNodeType = this.$store.getters.nodeType(node.type, node.typeVersion) as INodeTypeDescription | null;
if (activeNodeType && activeNodeType.credentials) {
return activeNodeType.credentials;
@ -295,7 +311,7 @@ export default mixins(
<style lang="scss" module>
.container {
margin: var(--spacing-xs) 0;
margin: 0;
> * {
margin-bottom: var(--spacing-xs);

View file

@ -23,12 +23,23 @@
</div>
<div class="node-parameters-wrapper" v-if="node && nodeValid">
<div v-show="openPanel === 'params'">
<node-credentials :node="node" @credentialSelected="credentialSelected"></node-credentials>
<node-webhooks :node="node" :nodeType="nodeType" />
<parameter-input-list :parameters="parametersNoneSetting" :hideDelete="true" :nodeValues="nodeValues" path="parameters" @valueChanged="valueChanged" />
<node-webhooks
:node="node"
:nodeType="nodeType"
/>
<parameter-input-list
:parameters="parametersNoneSetting"
:hideDelete="true"
:nodeValues="nodeValues" path="parameters" @valueChanged="valueChanged"
>
<node-credentials
:node="node"
@credentialSelected="credentialSelected"
/>
</parameter-input-list>
<div v-if="parametersNoneSetting.length === 0" class="no-parameters">
<n8n-text>
{{ $locale.baseText('nodeSettings.thisNodeDoesNotHaveAnyParameters') }}
{{ $locale.baseText('nodeSettings.thisNodeDoesNotHaveAnyParameters') }}
</n8n-text>
</div>
</div>

View file

@ -1,5 +1,6 @@
<template>
<div class="paramter-input-list-wrapper">
<div class="parameter-input-list-wrapper" :class="{ 'has-reordered-credentials-input': hasReorderedCredentialsInput }">
<slot />
<div v-for="parameter in filteredParameters" :key="parameter.name" :class="{indent}">
<div
v-if="multipleValues(parameter) === true && parameter.type !== 'fixedCollection'"
@ -84,6 +85,7 @@
<script lang="ts">
import {
INode,
INodeParameters,
INodeProperties,
NodeParameterValue,
@ -124,8 +126,10 @@ export default mixins(
filteredParameterNames (): string[] {
return this.filteredParameters.map(parameter => parameter.name);
},
node (): INodeUi {
return this.$store.getters.activeNode;
hasReorderedCredentialsInput(): boolean {
const node: INode = this.$store.getters.activeNode;
return ["n8n-nodes-base.httpRequest"].includes(node.type);
},
},
methods: {
@ -258,7 +262,21 @@ export default mixins(
</script>
<style lang="scss">
.paramter-input-list-wrapper {
.parameter-input-list-wrapper {
display: flex;
flex-direction: column;
padding-top: var(--spacing-xs);
&.has-reordered-credentials-input {
.node-credentials + div {
order: -2;
}
.node-credentials + div + div {
order: -1;
}
}
.delete-option {
display: none;
position: absolute;
@ -291,7 +309,7 @@ export default mixins(
.parameter-item {
position: relative;
margin: var(--spacing-xs) 0;
margin: 0 0 var(--spacing-xs);
>.delete-option {
top: var(--spacing-5xs);