1
1
import { defineComponent } from 'vue'
2
2
import FtInput from '../ft-input/ft-input.vue'
3
+ import { showToast } from '../../helpers/utils'
3
4
4
5
export default defineComponent ( {
5
6
name : 'FtInputTags' ,
6
7
components : {
7
8
'ft-input' : FtInput ,
8
9
} ,
9
10
props : {
11
+ areChannelTags : {
12
+ type : Boolean ,
13
+ default : false
14
+ } ,
10
15
disabled : {
11
16
type : Boolean ,
12
17
default : false
@@ -23,6 +28,10 @@ export default defineComponent({
23
28
type : String ,
24
29
required : true
25
30
} ,
31
+ minInputLength : {
32
+ type : Number ,
33
+ default : 1
34
+ } ,
26
35
showActionButton : {
27
36
type : Boolean ,
28
37
default : true
@@ -47,6 +56,30 @@ export default defineComponent({
47
56
emits : [ 'invalid-name' , 'error-find-tag-info' , 'change' , 'already-exists' ] ,
48
57
methods : {
49
58
updateTags : async function ( text , _e ) {
59
+ if ( this . areChannelTags ) {
60
+ await this . updateChannelTags ( text , _e )
61
+ return
62
+ }
63
+ // add tag and update tag list
64
+ const trimmedText = text . trim ( )
65
+
66
+ if ( this . minInputLength > trimmedText . length ) {
67
+ showToast ( this . $tc ( 'Trimmed input must be at least N characters long' , this . minInputLength , { length : this . minInputLength } ) )
68
+ return
69
+ }
70
+
71
+ if ( this . tagList . includes ( trimmedText ) ) {
72
+ showToast ( this . $t ( 'Tag already exists' , { tagName : trimmedText } ) )
73
+ return
74
+ }
75
+
76
+ const newList = this . tagList . slice ( 0 )
77
+ newList . push ( trimmedText )
78
+ this . $emit ( 'change' , newList )
79
+ // clear input box
80
+ this . $refs . tagNameInput . handleClearTextClick ( )
81
+ } ,
82
+ updateChannelTags : async function ( text , _e ) {
50
83
// get text without spaces after last '/' in url, if any
51
84
const name = text . split ( '/' ) . pop ( ) . trim ( )
52
85
@@ -74,6 +107,20 @@ export default defineComponent({
74
107
this . $refs . tagNameInput . handleClearTextClick ( )
75
108
} ,
76
109
removeTag : function ( tag ) {
110
+ if ( this . areChannelTags ) {
111
+ this . removeChannelTag ( tag )
112
+ return
113
+ }
114
+ // Remove tag from list
115
+ const tagName = tag . trim ( )
116
+ if ( this . tagList . includes ( tagName ) ) {
117
+ const newList = this . tagList . slice ( 0 )
118
+ const index = newList . indexOf ( tagName )
119
+ newList . splice ( index , 1 )
120
+ this . $emit ( 'change' , newList )
121
+ }
122
+ } ,
123
+ removeChannelTag : function ( tag ) {
77
124
// Remove tag from list
78
125
if ( this . tagList . some ( ( tmpTag ) => tmpTag . name === tag . name ) ) {
79
126
const newList = this . tagList . filter ( ( tmpTag ) => tmpTag . name !== tag . name )
0 commit comments