:xap: Open tooltip links on new tab (#2106)

*  Create mixin

*  Implement mixin

* 🔥 Remove hardcoded attribute

* 🔨 Refactor mixin into helper

* 🔨 Refactor string replacement

* ✏️ Unrelated description fixes

*  Simplify helper import
This commit is contained in:
Iván Ovejero
2021-08-26 19:42:38 +02:00
committed by GitHub
parent 0f072f9b98
commit 176e475c8e
66 changed files with 119 additions and 104 deletions

View File

@@ -25,7 +25,7 @@
<el-col :span="6" class="parameter-name">
{{parameter.displayName}}:
<el-tooltip placement="top" class="parameter-info" v-if="parameter.description" effect="light">
<div slot="content" v-html="parameter.description"></div>
<div slot="content" v-html="addTargetBlank(parameter.description)"></div>
<font-awesome-icon icon="question-circle"/>
</el-tooltip>
</el-col>
@@ -146,6 +146,8 @@ import ParameterInput from '@/components/ParameterInput.vue';
import mixins from 'vue-typed-mixins';
import { addTargetBlank } from './helpers';
export default mixins(
copyPaste,
externalHooks,
@@ -266,6 +268,7 @@ export default mixins(
},
},
methods: {
addTargetBlank,
copyCallbackUrl (): void {
this.copyToClipboard(this.oAuthCallbackUrl);

View File

@@ -4,7 +4,7 @@
<div class="parameter-name">
{{parameter.displayName}}:
<el-tooltip class="parameter-info" placement="top" v-if="parameter.description" effect="light">
<div slot="content" v-html="parameter.description"></div>
<div slot="content" v-html="addTargetBlank(parameter.description)"></div>
<font-awesome-icon icon="question-circle" />
</el-tooltip>
</div>
@@ -48,6 +48,7 @@ import { get } from 'lodash';
import { genericHelpers } from '@/components/mixins/genericHelpers';
import mixins from 'vue-typed-mixins';
import { addTargetBlank } from './helpers';
export default mixins(genericHelpers)
.extend({
@@ -91,6 +92,7 @@ export default mixins(genericHelpers)
this.$emit('valueChanged', parameterData);
},
addTargetBlank,
deleteItem (index: number) {
const parameterData = {
name: this.getPath(index),

View File

@@ -3,7 +3,7 @@
<el-col :span="isMultiLineParameter ? 24 : 10" class="parameter-name" :class="{'multi-line': isMultiLineParameter}">
<span class="title" :title="parameter.displayName">{{parameter.displayName}}</span>:
<el-tooltip class="parameter-info" placement="top" v-if="parameter.description" effect="light">
<div slot="content" v-html="parameter.description"></div>
<div slot="content" v-html="addTargetBlank(parameter.description)"></div>
<font-awesome-icon icon="question-circle" />
</el-tooltip>
</el-col>
@@ -21,6 +21,7 @@ import {
} from '@/Interface';
import ParameterInput from '@/components/ParameterInput.vue';
import { addTargetBlank } from './helpers';
export default Vue
.extend({
@@ -51,6 +52,7 @@ export default Vue
'value',
],
methods: {
addTargetBlank,
getArgument (argumentName: string): string | number | boolean | undefined {
if (this.parameter.typeOptions === undefined) {
return undefined;

View File

@@ -31,7 +31,7 @@
</div>
{{parameter.displayName}}:
<el-tooltip placement="top" class="parameter-info" v-if="parameter.description" effect="light">
<div slot="content" v-html="parameter.description"></div>
<div slot="content" v-html="addTargetBlank(parameter.description)"></div>
<font-awesome-icon icon="question-circle"/>
</el-tooltip>
</div>
@@ -92,6 +92,8 @@ import { genericHelpers } from '@/components/mixins/genericHelpers';
import { workflowHelpers } from '@/components/mixins/workflowHelpers';
import ParameterInputFull from '@/components/ParameterInputFull.vue';
import { addTargetBlank } from './helpers';
import { get, set } from 'lodash';
import mixins from 'vue-typed-mixins';
@@ -121,6 +123,7 @@ export default mixins(
},
},
methods: {
addTargetBlank,
multipleValues (parameter: INodeProperties): boolean {
if (this.getArgument('multipleValues', parameter) === true) {
return true;

View File

@@ -0,0 +1,5 @@
export function addTargetBlank(html: string) {
return html.includes('href=')
? html.replace(/href=/g, 'target="_blank" href=')
: html;
}