mirror of
https://github.com/n8n-io/n8n.git
synced 2025-03-05 20:50:17 -08:00
✨ Added node credentials type proxy. Changed node credentials input order.
This commit is contained in:
parent
f8e992c453
commit
2808ee962d
|
@ -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);
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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);
|
||||
|
|
Loading…
Reference in a new issue