app/javascript/packs/components/grep_pattern.js
/* global _ */
"use strict";
import "lodash/lodash";
const GrepPattern = {
template: "#vue-grep-pattern",
props: [
"containerType", // and/or
"grepType", // regexp/exclude
"index", // the index of and/or
"subIndex", // the index of regexp/exclude
],
data: function() {
return {
key: null,
pattern: null,
};
},
filters: {
humanize: function(value) {
return _.capitalize(value.replace(/_/g, " "));
}
},
methods: {
add: function(event) {
this.$emit("add-grep-pattern", this.grepType, this.subIndex);
},
remove: function(event) {
this.$emit("remove-grep-pattern", this.grepType, this.subIndex);
},
labelId: function(name, index, subIndex) {
return `label_${this.inputId(name, index, subIndex)}`;
},
inputId: function(name, index, subIndex) {
return `setting_${this.containerType}_${index}_${this.grepType}_${subIndex}__${name}`;
},
inputName: function(name, index, subIndex) {
return `setting[${this.containerType}[${index}]][${this.grepType}[${subIndex}]][${name}]`;
}
}
};
export { GrepPattern as default };