From 76f8c3715070157b8333dbbbbb83f14a0586062f Mon Sep 17 00:00:00 2001 From: Kenji Okimoto Date: Fri, 28 Sep 2018 09:53:42 +0900 Subject: [PATCH 01/18] Add label parameter to owner plugins Signed-off-by: Kenji Okimoto --- app/models/concerns/fluentd/setting/plugin.rb | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/app/models/concerns/fluentd/setting/plugin.rb b/app/models/concerns/fluentd/setting/plugin.rb index e46b0a8..c7ee47d 100644 --- a/app/models/concerns/fluentd/setting/plugin.rb +++ b/app/models/concerns/fluentd/setting/plugin.rb @@ -18,7 +18,6 @@ class Fluentd include Fluentd::Setting::PluginConfig include Fluentd::Setting::SectionParser include Fluentd::Setting::PluginParameter - include Fluentd::Setting::Label included do cattr_accessor :plugin_type, :plugin_name, :config_definition @@ -33,6 +32,10 @@ class Fluentd include Fluentd::Setting::Pattern end + if ["input", "filter", "output"].include?(type) + include Fluentd::Setting::Label + end + self.load_plugin_config do |_name, params| params.each do |param_name, definition| if definition[:section] From 39f80f08d5c9942b37101cef55980448d166b9eb Mon Sep 17 00:00:00 2001 From: Kenji Okimoto Date: Fri, 28 Sep 2018 10:48:40 +0900 Subject: [PATCH 02/18] Suppress JavaScript warnings Signed-off-by: Kenji Okimoto --- app/javascript/packs/config_field.js | 6 ++++-- app/javascript/packs/in_tail_parse.js | 8 +++++--- 2 files changed, 9 insertions(+), 5 deletions(-) diff --git a/app/javascript/packs/config_field.js b/app/javascript/packs/config_field.js index b747f32..ab33aff 100644 --- a/app/javascript/packs/config_field.js +++ b/app/javascript/packs/config_field.js @@ -45,8 +45,10 @@ const ConfigField = { } this.$nextTick(() => { console.log("config-field updated"); - $("[data-toggle=tooltip]").tooltip("dispose"); - $("[data-toggle=tooltip]").tooltip("enable"); + if ($("[data-toggle=tooltip]").tooltip) { + $("[data-toggle=tooltip]").tooltip("dispose"); + $("[data-toggle=tooltip]").tooltip("enable"); + } }); }, diff --git a/app/javascript/packs/in_tail_parse.js b/app/javascript/packs/in_tail_parse.js index b503cd5..c1a05d0 100644 --- a/app/javascript/packs/in_tail_parse.js +++ b/app/javascript/packs/in_tail_parse.js @@ -41,11 +41,13 @@ $(document).ready(() => { }, mounted: function() { this.parse = {}; - this.$on("hook:updated", () => { - this.$nextTick(() => { + }, + updated: function() { + this.$nextTick(() => { + if ($("[data-toggle=tooltip]").tooltip) { $("[data-toggle=tooltip]").tooltip("dispose"); $("[data-toggle=tooltip]").tooltip("enable"); - }); + } }); }, methods: { From 2a990fb1ad2a0e0be2c5c14bd0a6607d34de9f12 Mon Sep 17 00:00:00 2001 From: Kenji Okimoto Date: Fri, 28 Sep 2018 10:49:22 +0900 Subject: [PATCH 03/18] Add Fluentd::Setting::ParserAdvancedOptions Signed-off-by: Kenji Okimoto --- .../setting/parser_advanced_options.rb | 27 +++++++++++++++++++ app/models/concerns/fluentd/setting/plugin.rb | 4 +++ 2 files changed, 31 insertions(+) create mode 100644 app/models/concerns/fluentd/setting/parser_advanced_options.rb diff --git a/app/models/concerns/fluentd/setting/parser_advanced_options.rb b/app/models/concerns/fluentd/setting/parser_advanced_options.rb new file mode 100644 index 0000000..e1d229a --- /dev/null +++ b/app/models/concerns/fluentd/setting/parser_advanced_options.rb @@ -0,0 +1,27 @@ +class Fluentd + module Setting + module ParserAdvancedOptions + extend ActiveSupport::Concern + + def advanced_options + [ + :types, + :null_value_pattern, + :null_empty_string, + :estimate_current_event, + :time_key, + :time_type, + :time_format, + :keep_time_key, + :utc, + ] + end + + def hidden_options + [ + :localtime + ] + end + end + end +end diff --git a/app/models/concerns/fluentd/setting/plugin.rb b/app/models/concerns/fluentd/setting/plugin.rb index c7ee47d..190c784 100644 --- a/app/models/concerns/fluentd/setting/plugin.rb +++ b/app/models/concerns/fluentd/setting/plugin.rb @@ -36,6 +36,10 @@ class Fluentd include Fluentd::Setting::Label end + if ["parser"].include?(type) + include Fluentd::Setting::ParserAdvancedOptions + end + self.load_plugin_config do |_name, params| params.each do |param_name, definition| if definition[:section] From dbc4ef2071866bc51f7aa70991d63344724c7ef7 Mon Sep 17 00:00:00 2001 From: Kenji Okimoto Date: Fri, 28 Sep 2018 11:34:12 +0900 Subject: [PATCH 04/18] Add Fluentd::Setting::FormatterAdvancedOptions Signed-off-by: Kenji Okimoto --- .../setting/formatter_advanced_options.rb | 22 +++++++++++++++++++ app/models/concerns/fluentd/setting/plugin.rb | 4 ++++ 2 files changed, 26 insertions(+) create mode 100644 app/models/concerns/fluentd/setting/formatter_advanced_options.rb diff --git a/app/models/concerns/fluentd/setting/formatter_advanced_options.rb b/app/models/concerns/fluentd/setting/formatter_advanced_options.rb new file mode 100644 index 0000000..f43d01f --- /dev/null +++ b/app/models/concerns/fluentd/setting/formatter_advanced_options.rb @@ -0,0 +1,22 @@ +class Fluentd + module Setting + module FormatterAdvancedOptions + extend ActiveSupport::Concern + + def advanced_options + [ + :time_type, + :time_format, + :timezone, + :utc, + ] + end + + def hidden_options + [ + :localtime + ] + end + end + end +end diff --git a/app/models/concerns/fluentd/setting/plugin.rb b/app/models/concerns/fluentd/setting/plugin.rb index 190c784..a670464 100644 --- a/app/models/concerns/fluentd/setting/plugin.rb +++ b/app/models/concerns/fluentd/setting/plugin.rb @@ -40,6 +40,10 @@ class Fluentd include Fluentd::Setting::ParserAdvancedOptions end + if ["formatter"].include?(type) + include Fluentd::Setting::FormatterAdvancedOptions + end + self.load_plugin_config do |_name, params| params.each do |param_name, definition| if definition[:section] From fee08df5fa8d960f43d2408c00bbb183e1655448 Mon Sep 17 00:00:00 2001 From: Kenji Okimoto Date: Fri, 28 Sep 2018 11:58:15 +0900 Subject: [PATCH 05/18] Display advanced options on owned plugins' form Signed-off-by: Kenji Okimoto --- app/javascript/packs/owned_plugin_form.js | 1 + .../shared/vue/_owned_plugin_form.html.haml | 16 ++++++++++++++-- 2 files changed, 15 insertions(+), 2 deletions(-) diff --git a/app/javascript/packs/owned_plugin_form.js b/app/javascript/packs/owned_plugin_form.js index b064651..6ae1bea 100644 --- a/app/javascript/packs/owned_plugin_form.js +++ b/app/javascript/packs/owned_plugin_form.js @@ -90,6 +90,7 @@ const OwnedPluginForm = { } }).then((data) => { this.commonOptions = data.commonOptions; + this.advancedOptions = data.advancedOptions; let foundExpression = false; let foundTimeFormat = false; _.each(this.commonOptions, (option) => { diff --git a/app/views/shared/vue/_owned_plugin_form.html.haml b/app/views/shared/vue/_owned_plugin_form.html.haml index d47bb11..4a9c005 100644 --- a/app/views/shared/vue/_owned_plugin_form.html.haml +++ b/app/views/shared/vue/_owned_plugin_form.html.haml @@ -19,10 +19,22 @@ "v-bind:plugin-type" => "pluginType", "v-bind:common-options" => "commonOptions", "v-on:change-formats" => "onChangeFormats"} - %template(v-else){"v-for" => "option in commonOptions"} - %config-field{"v-bind:plugin-type" => "pluginType", + %template(v-else) + %config-field{"v-for" => "option in commonOptions", + "v-bind:key" => "option.name", + "v-bind:plugin-type" => "pluginType", "v-bind:option" => "option", "v-bind:initial-expression" => "expression", "v-bind:initial-time-format" => "timeFormat", "v-bind:initial-text-value" => "initialParams[option.name]", "v-on:change-parse-config" => "onChangeParseConfig"} + %template{"v-if" => '!_.isEmpty(advancedOptions)'} + .card.card-body.bg-light + %h4{"data-toggle" => "collapse", "href" => "#owned-plugin-advanced-setting"} + = icon('fa-caret-down') + = t('terms.advanced_setting') + #owned-plugin-advanced-setting.collapse + %config-field{"v-for" => "option in advancedOptions", + "v-bind:key" => "option.name", + "v-bind:plugin-type" => "pluginType", + "v-bind:option" => "option"} From 19bd3d06c17f8047707dfec5f1e0adc3213f2b76 Mon Sep 17 00:00:00 2001 From: Kenji Okimoto Date: Fri, 28 Sep 2018 11:59:23 +0900 Subject: [PATCH 06/18] Add parser_plugin_form component This is copied from owned_plugin_form. Signed-off-by: Kenji Okimoto --- app/javascript/packs/in_tail_parse.js | 4 +- app/javascript/packs/parser_plugin_form.js | 147 ++++++++++++++++++ app/javascript/packs/plugin_setting.js | 4 +- app/views/shared/settings/_form.html.haml | 13 +- app/views/shared/vue/_in_tail_parse.html.haml | 4 +- .../shared/vue/_parser_plugin_form.html.haml | 40 +++++ 6 files changed, 201 insertions(+), 11 deletions(-) create mode 100644 app/javascript/packs/parser_plugin_form.js create mode 100644 app/views/shared/vue/_parser_plugin_form.html.haml diff --git a/app/javascript/packs/in_tail_parse.js b/app/javascript/packs/in_tail_parse.js index c1a05d0..7995f90 100644 --- a/app/javascript/packs/in_tail_parse.js +++ b/app/javascript/packs/in_tail_parse.js @@ -3,13 +3,13 @@ import "lodash/lodash"; import "popper.js/dist/popper"; import "bootstrap/dist/js/bootstrap"; -import OwnedPluginForm from "./owned_plugin_form"; +import ParserPluginForm from "./parser_plugin_form"; $(document).ready(() => { new Vue({ el: "#in-tail-parse", components: { - "owned-plugin-form": OwnedPluginForm + "parser-plugin-form": ParserPluginForm }, data: function() { return { diff --git a/app/javascript/packs/parser_plugin_form.js b/app/javascript/packs/parser_plugin_form.js new file mode 100644 index 0000000..075fb5f --- /dev/null +++ b/app/javascript/packs/parser_plugin_form.js @@ -0,0 +1,147 @@ +/* global _ */ +"use strict"; + +import "lodash/lodash"; +import ParserMultilineForm from "./parser_multiline_form"; +import ConfigField from "./config_field"; + +const ParserPluginForm = { + template: "#vue-parser-plugin-form", + components: { + "parser-multiline-form": ParserMultilineForm, + "config-field": ConfigField + }, + props: [ + "id", + "optionsJson", + "initialPluginName", + "initialParamsJson", + "pluginType", + "pluginLabel" + ], + data: () => { + return { + pluginName: "", + options: [], + initialParams: {}, + commonOptions: [], + advancedOptions: [], + expression: null, + timeFormat: null, + unwatchExpression: null, + unwatchTimeFormat: null + }; + }, + + computed: { + token: function() { + return Rails.csrfToken(); + } + }, + + mounted: function() { + this.options = JSON.parse(this.optionsJson); + this.initialParams = JSON.parse(this.initialParamsJson || "{}"); + this.pluginName = this.initialPluginName; + this.$once("data-loaded", () => { + this.updateSection(); + }); + this.$emit("data-loaded"); + }, + + updated: function() { + this.$nextTick(() => { + if ($("[data-toggle=tooltip]").tooltip) { + $("[data-toggle=tooltip]").tooltip("dispose"); + $("[data-toggle=tooltip]").tooltip("enable"); + } + }); + }, + + methods: { + onChange: function() { + this.updateSection(); + if (this.pluginType === "parse") { + this.$emit("change-plugin-name", this.pluginName); + } + }, + + onChangeFormats: function(data) { + console.log("parserPluginForm:onChangeFormats", data); + this.$emit("change-formats", data); + }, + + onChangeParseConfig: function(data) { + console.log("parserPluginForm:onChangeParseConfig", data); + this.expression = data.expression; + this.timeFormat = data.timeFormat; + }, + + updateSection: function() { + $.ajax({ + method: "GET", + url: `${relativeUrlRoot}/api/config_definitions`, + headers: { + "X-CSRF-Token": this.token + }, + data: { + type: this.pluginType, + name: this.pluginName + } + }).then((data) => { + this.commonOptions = data.commonOptions; + this.advancedOptions = data.advancedOptions; + let foundExpression = false; + let foundTimeFormat = false; + _.each(this.commonOptions, (option) => { + if (option.name === "expression") { + foundExpression = true; + this.expression = option.default; + this.unwatchExpression = this.$watch("expression", (newValue, oldValue) => { + console.log(newValue); + this.$emit("change-parse-config", { + "expression": this.expression, + "time_format": this.timeFormat + }); + }); + } + if (option.name === "time_format") { + foundTimeFormat = true; + this.timeFormat = option.default; + console.log(this.timeFormat); + this.unwatchTimeFormat = this.$watch("timeFormat", (newValue, oldValue) => { + console.log({"watch time_format": newValue}); + this.$emit("change-parse-config", { + "expression": this.expression, + "time_format": this.timeFormat + }); + }); + } + + if (!foundExpression && this.unwatchExpression) { + this.expression = null; + this.unwatchExpression(); + this.unwatchExpression = null; + } + if (!foundTimeFormat && this.unwatchTimeFormat) { + this.timeFormat = null; + this.unwatchTimeFormat(); + this.unwatchTimeFormat = null; + } + }); + }); + }, + + selectId: function(pluginType) { + return `setting_${pluginType}_type`; + }, + selectClass: function(pluginType) { + return `${pluginType} form-control`; + }, + selectName: function(pluginType) { + return `setting[${pluginType}_type]`; + } + } +}; + +export { ParserPluginForm as default }; diff --git a/app/javascript/packs/plugin_setting.js b/app/javascript/packs/plugin_setting.js index 266830d..65333c8 100644 --- a/app/javascript/packs/plugin_setting.js +++ b/app/javascript/packs/plugin_setting.js @@ -3,12 +3,14 @@ import "lodash/lodash"; import "popper.js/dist/popper"; import "bootstrap/dist/js/bootstrap"; import OwnedPluginForm from "./owned_plugin_form"; +import ParserPluginForm from "./parser_plugin_form"; window.addEventListener("load", () => { new Vue({ el: "#plugin-setting", components: { - "owned-plugin-form": OwnedPluginForm + "owned-plugin-form": OwnedPluginForm, + "parser-plugin-form": ParserPluginForm }, data: () => { return {}; diff --git a/app/views/shared/settings/_form.html.haml b/app/views/shared/settings/_form.html.haml index 25647e2..385bf41 100644 --- a/app/views/shared/settings/_form.html.haml +++ b/app/views/shared/settings/_form.html.haml @@ -1,5 +1,6 @@ = render "shared/setting_errors" = render "shared/vue/owned_plugin_form" += render "shared/vue/parser_plugin_form" = javascript_pack_tag("plugin_setting") @@ -26,12 +27,12 @@ "v-bind:plugin-label" => "'Storage'"} - if setting.have_parse_section? - %owned-plugin-form{"v-bind:id" => "'parse-section'", - "v-bind:options-json" => "'#{Fluent::Plugin::PARSER_REGISTRY.map.keys.to_json}'", - "v-bind:initial-plugin-name" => "'#{setting.parse_type}'", - "v-bind:initial-params-json" => "'#{setting.class.initial_params[:parse]["0"].to_json}'", - "v-bind:plugin-type" => "'parse'", - "v-bind:plugin-label" => "'Parse'"} + %parser-plugin-form{"v-bind:id" => "'parse-section'", + "v-bind:options-json" => "'#{Fluent::Plugin::PARSER_REGISTRY.map.keys.to_json}'", + "v-bind:initial-plugin-name" => "'#{setting.parse_type}'", + "v-bind:initial-params-json" => "'#{setting.class.initial_params[:parse]["0"].to_json}'", + "v-bind:plugin-type" => "'parse'", + "v-bind:plugin-label" => "'Parse'"} - if setting.have_format_section? %owned-plugin-form{"v-bind:id" => "'format-section'", diff --git a/app/views/shared/vue/_in_tail_parse.html.haml b/app/views/shared/vue/_in_tail_parse.html.haml index 81fe0a6..b8287e3 100644 --- a/app/views/shared/vue/_in_tail_parse.html.haml +++ b/app/views/shared/vue/_in_tail_parse.html.haml @@ -1,9 +1,9 @@ - add_javascript_pack_tag("in_tail_parse") -= render "shared/vue/owned_plugin_form" += render "shared/vue/parser_plugin_form" #in-tail-parse{"path" => setting.path} - %owned-plugin-form{"v-bind:id" => "'parse-section'", + %parser-plugin-form{"v-bind:id" => "'parse-section'", "v-bind:options-json" => "'#{Fluent::Plugin::PARSER_REGISTRY.map.keys.to_json}'", "v-bind:initial-plugin-name" => "'#{setting.parse_type || setting.guess_parse_type}'", "v-bind:plugin-type" => "'parse'", diff --git a/app/views/shared/vue/_parser_plugin_form.html.haml b/app/views/shared/vue/_parser_plugin_form.html.haml new file mode 100644 index 0000000..d374034 --- /dev/null +++ b/app/views/shared/vue/_parser_plugin_form.html.haml @@ -0,0 +1,40 @@ += render "shared/vue/parser_multiline_form" += render "shared/vue/config_field" + +%script{type: "text/x-template", id: "vue-parser-plugin-form"} + .form-group.card.bg-light.mb-3{"v-bind:id" => "id"} + .card-body + %label{"v-bind:for" => "selectId(pluginType)"} + {{ pluginLabel }} + %select{"v-bind:id" => "selectId(pluginType)", + "v-bind:class" => "selectClass(pluginType)", + "v-bind:name" => "selectName(pluginType)", + "v-model" => "pluginName", + "v-on:change" => "onChange"} + %option{"v-for" => "option in options", + "v-bind:value" => "option", + "v-bind:selected" => "pluginName===option"} + {{ option }} + %parser-multiline-form{"v-if" => 'pluginName==="multiline"', + "v-bind:plugin-type" => "pluginType", + "v-bind:common-options" => "commonOptions", + "v-on:change-formats" => "onChangeFormats"} + %template(v-else) + %config-field{"v-for" => "option in commonOptions", + "v-bind:key" => "option.name", + "v-bind:plugin-type" => "pluginType", + "v-bind:option" => "option", + "v-bind:initial-expression" => "expression", + "v-bind:initial-time-format" => "timeFormat", + "v-bind:initial-text-value" => "initialParams[option.name]", + "v-on:change-parse-config" => "onChangeParseConfig"} + %template{"v-if" => '!_.isEmpty(advancedOptions)'} + .card.card-body.bg-light + %h4{"data-toggle" => "collapse", "href" => "#owned-plugin-advanced-setting"} + = icon('fa-caret-down') + = t('terms.advanced_setting') + #owned-plugin-advanced-setting.collapse + %config-field{"v-for" => "option in advancedOptions", + "v-bind:key" => "option.name", + "v-bind:plugin-type" => "pluginType", + "v-bind:option" => "option"} From eb414cb9bb1bc85e6ad6f698330d24a9732ddc1a Mon Sep 17 00:00:00 2001 From: Kenji Okimoto Date: Fri, 28 Sep 2018 12:08:57 +0900 Subject: [PATCH 07/18] Remove parser_plugin_form specific code from owned_plugin_form Signed-off-by: Kenji Okimoto --- app/javascript/packs/owned_plugin_form.js | 50 ------------------- .../shared/vue/_owned_plugin_form.html.haml | 39 ++++++--------- 2 files changed, 15 insertions(+), 74 deletions(-) diff --git a/app/javascript/packs/owned_plugin_form.js b/app/javascript/packs/owned_plugin_form.js index 6ae1bea..17a0efa 100644 --- a/app/javascript/packs/owned_plugin_form.js +++ b/app/javascript/packs/owned_plugin_form.js @@ -2,13 +2,11 @@ "use strict"; import "lodash/lodash"; -import ParserMultilineForm from "./parser_multiline_form"; import ConfigField from "./config_field"; const OwnedPluginForm = { template: "#vue-owned-plugin-form", components: { - "parser-multiline-form": ParserMultilineForm, "config-field": ConfigField }, props: [ @@ -26,10 +24,6 @@ const OwnedPluginForm = { initialParams: {}, commonOptions: [], advancedOptions: [], - expression: null, - timeFormat: null, - unwatchExpression: null, - unwatchTimeFormat: null }; }, @@ -71,12 +65,6 @@ const OwnedPluginForm = { this.$emit("change-formats", data); }, - onChangeParseConfig: function(data) { - console.log("ownedPluginForm:onChangeParseConfig", data); - this.expression = data.expression; - this.timeFormat = data.timeFormat; - }, - updateSection: function() { $.ajax({ method: "GET", @@ -91,44 +79,6 @@ const OwnedPluginForm = { }).then((data) => { this.commonOptions = data.commonOptions; this.advancedOptions = data.advancedOptions; - let foundExpression = false; - let foundTimeFormat = false; - _.each(this.commonOptions, (option) => { - if (option.name === "expression") { - foundExpression = true; - this.expression = option.default; - this.unwatchExpression = this.$watch("expression", (newValue, oldValue) => { - console.log(newValue); - this.$emit("change-parse-config", { - "expression": this.expression, - "time_format": this.timeFormat - }); - }); - } - if (option.name === "time_format") { - foundTimeFormat = true; - this.timeFormat = option.default; - console.log(this.timeFormat); - this.unwatchTimeFormat = this.$watch("timeFormat", (newValue, oldValue) => { - console.log({"watch time_format": newValue}); - this.$emit("change-parse-config", { - "expression": this.expression, - "time_format": this.timeFormat - }); - }); - } - - if (!foundExpression && this.unwatchExpression) { - this.expression = null; - this.unwatchExpression(); - this.unwatchExpression = null; - } - if (!foundTimeFormat && this.unwatchTimeFormat) { - this.timeFormat = null; - this.unwatchTimeFormat(); - this.unwatchTimeFormat = null; - } - }); }); }, diff --git a/app/views/shared/vue/_owned_plugin_form.html.haml b/app/views/shared/vue/_owned_plugin_form.html.haml index 4a9c005..2bcaab6 100644 --- a/app/views/shared/vue/_owned_plugin_form.html.haml +++ b/app/views/shared/vue/_owned_plugin_form.html.haml @@ -1,4 +1,3 @@ -= render "shared/vue/parser_multiline_form" = render "shared/vue/config_field" %script{type: "text/x-template", id: "vue-owned-plugin-form"} @@ -15,26 +14,18 @@ "v-bind:value" => "option", "v-bind:selected" => "pluginName===option"} {{ option }} - %parser-multiline-form{"v-if" => 'pluginName==="multiline"', - "v-bind:plugin-type" => "pluginType", - "v-bind:common-options" => "commonOptions", - "v-on:change-formats" => "onChangeFormats"} - %template(v-else) - %config-field{"v-for" => "option in commonOptions", - "v-bind:key" => "option.name", - "v-bind:plugin-type" => "pluginType", - "v-bind:option" => "option", - "v-bind:initial-expression" => "expression", - "v-bind:initial-time-format" => "timeFormat", - "v-bind:initial-text-value" => "initialParams[option.name]", - "v-on:change-parse-config" => "onChangeParseConfig"} - %template{"v-if" => '!_.isEmpty(advancedOptions)'} - .card.card-body.bg-light - %h4{"data-toggle" => "collapse", "href" => "#owned-plugin-advanced-setting"} - = icon('fa-caret-down') - = t('terms.advanced_setting') - #owned-plugin-advanced-setting.collapse - %config-field{"v-for" => "option in advancedOptions", - "v-bind:key" => "option.name", - "v-bind:plugin-type" => "pluginType", - "v-bind:option" => "option"} + + %config-field{"v-for" => "option in commonOptions", + "v-bind:key" => "option.name", + "v-bind:plugin-type" => "pluginType", + "v-bind:option" => "option"} + %template{"v-if" => '!_.isEmpty(advancedOptions)'} + .card.card-body.bg-light + %h4{"data-toggle" => "collapse", "href" => "#owned-plugin-advanced-setting"} + = icon('fa-caret-down') + = t('terms.advanced_setting') + #owned-plugin-advanced-setting.collapse + %config-field{"v-for" => "option in advancedOptions", + "v-bind:key" => "option.name", + "v-bind:plugin-type" => "pluginType", + "v-bind:option" => "option"} From c2789e4433d12450c8d714522d980a7d4fa18d9f Mon Sep 17 00:00:00 2001 From: Kenji Okimoto Date: Tue, 2 Oct 2018 17:00:24 +0900 Subject: [PATCH 08/18] Indent Signed-off-by: Kenji Okimoto --- app/views/shared/vue/_in_tail_parse.html.haml | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/app/views/shared/vue/_in_tail_parse.html.haml b/app/views/shared/vue/_in_tail_parse.html.haml index b8287e3..231df99 100644 --- a/app/views/shared/vue/_in_tail_parse.html.haml +++ b/app/views/shared/vue/_in_tail_parse.html.haml @@ -4,13 +4,13 @@ #in-tail-parse{"path" => setting.path} %parser-plugin-form{"v-bind:id" => "'parse-section'", - "v-bind:options-json" => "'#{Fluent::Plugin::PARSER_REGISTRY.map.keys.to_json}'", - "v-bind:initial-plugin-name" => "'#{setting.parse_type || setting.guess_parse_type}'", - "v-bind:plugin-type" => "'parse'", - "v-bind:plugin-label" => "'Parse'", - "v-on:change-parse-config" => "onChangeParseConfig", - "v-on:change-plugin-name" => "onChangePluginName", - "v-on:change-formats" => "onChangeFormats"} + "v-bind:options-json" => "'#{Fluent::Plugin::PARSER_REGISTRY.map.keys.to_json}'", + "v-bind:initial-plugin-name" => "'#{setting.parse_type || setting.guess_parse_type}'", + "v-bind:plugin-type" => "'parse'", + "v-bind:plugin-label" => "'Parse'", + "v-on:change-parse-config" => "onChangeParseConfig", + "v-on:change-plugin-name" => "onChangePluginName", + "v-on:change-formats" => "onChangeFormats"} .card.mb-3 %pre{"class" => "card-body", "v-html" => "highlightedLines"} From c7af576b7261bf2b6b9696bf98f1ade06576c0a6 Mon Sep 17 00:00:00 2001 From: Kenji Okimoto Date: Tue, 2 Oct 2018 17:01:29 +0900 Subject: [PATCH 09/18] Organize options Signed-off-by: Kenji Okimoto --- app/models/fluentd/setting/buffer_file.rb | 4 ++++ app/models/fluentd/setting/buffer_memory.rb | 4 ++++ app/models/fluentd/setting/parser_ltsv.rb | 2 +- app/models/fluentd/setting/parser_regexp.rb | 4 ++-- app/models/fluentd/setting/parser_syslog.rb | 10 ++-------- 5 files changed, 13 insertions(+), 11 deletions(-) diff --git a/app/models/fluentd/setting/buffer_file.rb b/app/models/fluentd/setting/buffer_file.rb index 6be83f0..9dbc060 100644 --- a/app/models/fluentd/setting/buffer_file.rb +++ b/app/models/fluentd/setting/buffer_file.rb @@ -18,6 +18,10 @@ class Fluentd :dir_permission ] end + + def advanced_options + [] + end end end end diff --git a/app/models/fluentd/setting/buffer_memory.rb b/app/models/fluentd/setting/buffer_memory.rb index 9abe3a9..e92d9e0 100644 --- a/app/models/fluentd/setting/buffer_memory.rb +++ b/app/models/fluentd/setting/buffer_memory.rb @@ -12,6 +12,10 @@ class Fluentd def common_options [] end + + def advanced_options + [] + end end end end diff --git a/app/models/fluentd/setting/parser_ltsv.rb b/app/models/fluentd/setting/parser_ltsv.rb index b4cc829..0f8ba68 100644 --- a/app/models/fluentd/setting/parser_ltsv.rb +++ b/app/models/fluentd/setting/parser_ltsv.rb @@ -21,7 +21,7 @@ class Fluentd end def advanced_options - [ + super + [ :delimiter_pattern ] end diff --git a/app/models/fluentd/setting/parser_regexp.rb b/app/models/fluentd/setting/parser_regexp.rb index b1b9f23..66ecf32 100644 --- a/app/models/fluentd/setting/parser_regexp.rb +++ b/app/models/fluentd/setting/parser_regexp.rb @@ -16,9 +16,9 @@ class Fluentd end def hidden_options - [ + super + [ :ignorecase, - :multiline + :multiline, ] end end diff --git a/app/models/fluentd/setting/parser_syslog.rb b/app/models/fluentd/setting/parser_syslog.rb index d3f9eee..756f003 100644 --- a/app/models/fluentd/setting/parser_syslog.rb +++ b/app/models/fluentd/setting/parser_syslog.rb @@ -12,16 +12,10 @@ class Fluentd end def common_options - [ - :time_format, - :with_priority, - ] - end - - def advanced_options [ :message_format, - :rfc5424_time_format + :rfc5424_time_format, + :with_priority, ] end end From c4f3de1d37cfe8a460d67679f8dff8479607b33d Mon Sep 17 00:00:00 2001 From: Kenji Okimoto Date: Tue, 2 Oct 2018 17:02:04 +0900 Subject: [PATCH 10/18] Add Vuex Signed-off-by: Kenji Okimoto --- app/javascript/packs/application.js | 2 ++ package.json | 3 ++- yarn.lock | 4 ++++ 3 files changed, 8 insertions(+), 1 deletion(-) diff --git a/app/javascript/packs/application.js b/app/javascript/packs/application.js index 54d0196..6df7d10 100644 --- a/app/javascript/packs/application.js +++ b/app/javascript/packs/application.js @@ -26,12 +26,14 @@ import "startbootstrap-sb-admin/js/sb-admin"; import "startbootstrap-sb-admin/js/sb-admin-datatables"; import Vue from "vue/dist/vue.esm"; +import Vuex from "vuex/dist/vuex.esm"; Vue.filter("to_json", function (value) { return JSON.stringify(value); }); window.Vue = Vue; +window.Vuex = Vuex; import "../stylesheets/application.scss"; diff --git a/package.json b/package.json index 874568d..23b7409 100644 --- a/package.json +++ b/package.json @@ -15,7 +15,8 @@ "startbootstrap-sb-admin": "^4.0.0", "vue": "^2.5.16", "vue-loader": "14.2.2", - "vue-template-compiler": "^2.5.16" + "vue-template-compiler": "^2.5.16", + "vuex": "^3.0.1" }, "devDependencies": { "eslint": "^5.1.0", diff --git a/yarn.lock b/yarn.lock index f8617fc..975b471 100644 --- a/yarn.lock +++ b/yarn.lock @@ -6414,6 +6414,10 @@ vue@^2.5.16: version "2.5.16" resolved "https://registry.yarnpkg.com/vue/-/vue-2.5.16.tgz#07edb75e8412aaeed871ebafa99f4672584a0085" +vuex@^3.0.1: + version "3.0.1" + resolved "https://registry.yarnpkg.com/vuex/-/vuex-3.0.1.tgz#e761352ebe0af537d4bb755a9b9dc4be3df7efd2" + watchpack@^1.4.0: version "1.6.0" resolved "https://registry.yarnpkg.com/watchpack/-/watchpack-1.6.0.tgz#4bc12c2ebe8aa277a71f1d3f14d685c7b446cd00" From 9964bff971545711df6fefc0c9473b290732bedf Mon Sep 17 00:00:00 2001 From: Kenji Okimoto Date: Tue, 2 Oct 2018 17:39:45 +0900 Subject: [PATCH 11/18] Add Vuex store Signed-off-by: Kenji Okimoto --- app/javascript/packs/store/index.js | 20 +++++ .../packs/store/modules/parser_params.js | 83 +++++++++++++++++++ 2 files changed, 103 insertions(+) create mode 100644 app/javascript/packs/store/index.js create mode 100644 app/javascript/packs/store/modules/parser_params.js diff --git a/app/javascript/packs/store/index.js b/app/javascript/packs/store/index.js new file mode 100644 index 0000000..7cd970f --- /dev/null +++ b/app/javascript/packs/store/index.js @@ -0,0 +1,20 @@ +import Vue from "vue/dist/vue.esm"; +import Vuex from "vuex/dist/vuex.esm"; +import { createNamespaceHelpers } from "vuex/dist/vuex.esm"; +import createLogger from "vuex/dist/logger"; + +Vue.use(Vuex); + +const debug = process.env.NODE_ENV !== 'production'; + +import parserParams from "./modules/parser_params"; + +const store = new Vuex.Store({ + modules: { + parserParams, + }, + strict: debug, + plugins: debug ? [createLogger()] : [] +}); + +export { store as default }; diff --git a/app/javascript/packs/store/modules/parser_params.js b/app/javascript/packs/store/modules/parser_params.js new file mode 100644 index 0000000..83d7158 --- /dev/null +++ b/app/javascript/packs/store/modules/parser_params.js @@ -0,0 +1,83 @@ +"user strict"; + +const state = { + type: null, + expression: null, + timeFormat: null, + messageFormat: null, + rfc5424TimeFormat: null, + withPriority: null, +}; + +const getters = { + toParams: (state) => { + return { + expression: state.expression, + timeFormat: state.timeFormat, + messageFormat: state.messageFormat, + rfc5424TimeFormat: state.rfc5424TimeFormat, + withPriority: state.withPriority + }; + }, + pluginName: (state) => { + return state.type; + } +}; + +const actions = { + updateType({ commit, state }, event) { + commit("setType", event.target.value); + commit("clearParams"); + }, + updateExpression({ commit, state }, event) { + commit("setExpression", event.target.value); + }, + updateTimeFormat({ commit, state }, event) { + commit("setTimeFormat", event.target.value); + }, + updateMessageFormat({ commit, state }, event) { + commit("setMessageFormat", event.target.value); + }, + updateRfc5424TimeFormat({ commit, state }, event) { + commit("setRfc5424TimeFormat", event.target.value); + }, + updateWithPriority({ commit, state }, event) { + commit("setWithPriority", event.target.value); + } +}; + +const mutations = { + setType(state, value) { + state.type = value; + }, + setExpression(state, value) { + state.expression = value; + }, + setTimeFormat(state, value) { + state.timeFormat = value; + }, + setMessageFormat(state, value) { + state.messageFormat = value; + }, + setRfc5424TimeFormat(state, value) { + state.rfc5424TimeFormat = value; + }, + setWithPriority(state, value) { + state.withPriority = value; + }, + clearParams(state) { + state.expression = null; + state.timeFormat = null; + state.messageFormat = null; + state.rfc5424TimeFormat = null; + state.withPriority = null; + } +}; + +export default { + namespaced: true, + state, + getters, + actions, + mutations +}; From cf0e589bf847e3c1d54de0acd795bcaf7be7b82f Mon Sep 17 00:00:00 2001 From: Kenji Okimoto Date: Tue, 2 Oct 2018 17:40:03 +0900 Subject: [PATCH 12/18] Use Vuex.Store to share parser plugin parameters Signed-off-by: Kenji Okimoto --- app/javascript/packs/config_field.js | 65 ++++++++++++------- app/javascript/packs/in_tail_parse.js | 18 +++-- app/javascript/packs/parser_plugin_form.js | 13 ++-- app/views/shared/vue/_config_field.html.haml | 28 +++----- .../shared/vue/_parser_plugin_form.html.haml | 14 ++-- 5 files changed, 77 insertions(+), 61 deletions(-) diff --git a/app/javascript/packs/config_field.js b/app/javascript/packs/config_field.js index ab33aff..a0e6da6 100644 --- a/app/javascript/packs/config_field.js +++ b/app/javascript/packs/config_field.js @@ -1,21 +1,20 @@ /* global _ */ "use strict"; import "lodash/lodash"; +import store from "./store"; const ConfigField = { template: "#vue-config-field", props: [ "pluginType", "option", - "initialExpression", - "initialTimeFormat", "initialTextValue", ], data: function() { return { - expression: null, - timeFormat: null, + selectedValue: null, + checkboxValue: null, textValue: null, }; }, @@ -27,13 +26,29 @@ const ConfigField = { }, mounted: function() { - if (this.option.name === "expression") { - this.expression = this.initialExpression; - } else if (this.option.name === "time_format") { - this.timeFormat = this.initialTimeFormat; + if (this.option.type === "enum") { + this.selectedValue = this.option.default; + } else if (this.option.type === "bool") { + this.checkboxValue = this.option.default; } else { this.textValue = this.initialTextValue || this.option.default; } + + if (this.option.name === "message_format") { + store.commit("parserParams/setMessageFormat", this.selectedValue); + } + if (this.option.name === "rfc5424_time_format") { + store.commit("parserParams/setRfc5424TimeFormat", this.textValue); + } + if (this.option.name === "with_priority") { + store.commit("parserParams/setWithPriority", this.checkboxValue); + } + if (this.option.name === "expression") { + store.commit("parserParams/Expression", this.textValue); + } + if (this.option.name === "timeFormat") { + store.commit("parserParams/timeFormat", this.textValue); + } }, updated: function() { @@ -52,22 +67,26 @@ const ConfigField = { }); }, - watch: { - "expression": function(_newValue, _oldValue) { - this.$emit("change-parse-config", { - "expression": this.expression, - "timeFormat": this.timeFormat - }); - }, - "timeFormat": function(_newValue, _oldValue) { - this.$emit("change-parse-config", { - "expression": this.expression, - "timeFormat": this.timeFormat - }); - } - }, - methods: { + onChange: function(event) { + console.log("onChange", this.option.name, event.target.value); + if (this.option.name === "message_format") { + store.dispatch("parserParams/updateMessageFormat", event); + } + if (this.option.name === "rfc5424_time_format") { + store.dispatch("parserParams/updateRfc5424TimeFormat", event); + } + if (this.option.name === "with_priority") { + store.dispatch("parserParams/updateWithPriority", event); + } + if (this.option.name === "expression") { + store.dispatch("parserParams/updateExpression", event); + } + if (this.option.name === "timeFormat") { + store.dispatch("parserParams/updateTimeFormat", event); + } + this.$emit("change-parse-config", {}); + }, inputId: function(pluginType, option) { if (pluginType === "output") { return `setting_${option.name}`; diff --git a/app/javascript/packs/in_tail_parse.js b/app/javascript/packs/in_tail_parse.js index 7995f90..fd00827 100644 --- a/app/javascript/packs/in_tail_parse.js +++ b/app/javascript/packs/in_tail_parse.js @@ -4,13 +4,20 @@ import "lodash/lodash"; import "popper.js/dist/popper"; import "bootstrap/dist/js/bootstrap"; import ParserPluginForm from "./parser_plugin_form"; +import store from "./store"; $(document).ready(() => { new Vue({ el: "#in-tail-parse", + store, components: { "parser-plugin-form": ParserPluginForm }, + props: [ + "initialPluginName", + "pluginType", + "pluginLabel", + ], data: function() { return { "path": "", @@ -53,16 +60,17 @@ $(document).ready(() => { methods: { onChangePluginName: function(name) { console.log("#in-tail-parse onChangePluginName", name); + console.log("#in-tail-parse onChangePluginName store", this.$store); this.parseType = name; this.parse = {}; // clear parser plugin configuration }, onChangeParseConfig: function(data) { - console.log("#in-tail-parse onChangeParseConfig", data); - _.merge(this.parse, data); + console.log("#in-tail-parse onChangeParseConfig", store.getters["parserParams/toParams"]); + _.merge(this.parse, store.getters["parserParams/toParams"]); this.preview(); }, onChangeFormats: function(data) { - console.log("in_tail_parse:onChangeFormats", data); + console.log("#in_tail_parse onChangeFormats", data); _.merge(this.parse, data); this.preview(); }, @@ -128,7 +136,7 @@ $(document).ready(() => { if (this.previewAjax && this.previewAjax.state() === "pending") { this.previewAjax.abort(); } - + const parseType = store.getters["parserParams/pluginName"]; this.previewAjax = $.ajax({ method: "POST", url: `${relativeUrlRoot}/api/regexp_preview`, @@ -136,7 +144,7 @@ $(document).ready(() => { "X-CSRF-Token": this.token }, data: { - parse_type: _.isEmpty(this.parseType) ? "regexp" : this.parseType, + parse_type: _.isEmpty(parseType) ? "regexp" : parseType, file: this.path, plugin_config: this.parse } diff --git a/app/javascript/packs/parser_plugin_form.js b/app/javascript/packs/parser_plugin_form.js index 075fb5f..0a1bd6a 100644 --- a/app/javascript/packs/parser_plugin_form.js +++ b/app/javascript/packs/parser_plugin_form.js @@ -4,6 +4,7 @@ import "lodash/lodash"; import ParserMultilineForm from "./parser_multiline_form"; import ConfigField from "./config_field"; +import store from "./store"; const ParserPluginForm = { template: "#vue-parser-plugin-form", @@ -43,6 +44,7 @@ const ParserPluginForm = { this.options = JSON.parse(this.optionsJson); this.initialParams = JSON.parse(this.initialParamsJson || "{}"); this.pluginName = this.initialPluginName; + store.commit("parserParams/setType", this.initialPluginName); this.$once("data-loaded", () => { this.updateSection(); }); @@ -59,11 +61,9 @@ const ParserPluginForm = { }, methods: { - onChange: function() { + onChange: function(event) { + store.dispatch("parserParams/updateType", event); this.updateSection(); - if (this.pluginType === "parse") { - this.$emit("change-plugin-name", this.pluginName); - } }, onChangeFormats: function(data) { @@ -72,9 +72,8 @@ const ParserPluginForm = { }, onChangeParseConfig: function(data) { - console.log("parserPluginForm:onChangeParseConfig", data); - this.expression = data.expression; - this.timeFormat = data.timeFormat; + console.log("parserPluginForm:onChangeParseConfig"); + this.$emit("change-parse-config", {}); }, updateSection: function() { diff --git a/app/views/shared/vue/_config_field.html.haml b/app/views/shared/vue/_config_field.html.haml index c07c6b8..0c958c4 100644 --- a/app/views/shared/vue/_config_field.html.haml +++ b/app/views/shared/vue/_config_field.html.haml @@ -8,6 +8,8 @@ {{ option.name | humanize }} %select{"v-bind:id" => "inputId(pluginType, option)", "v-bind:name" => "inputName(pluginType, option)", + "v-model.lazy" => "selectedValue", + "v-on:change" => "onChange", "class" => "form-control"} %option{"v-for" => "item in option.list", "v-bind:value" => "item", @@ -17,6 +19,8 @@ %input{"v-bind:id" => "inputId(pluginType, option)", "v-bind:name" => "inputName(pluginType, option)", "v-bind:checked" => "checked(option.default)", + "v-model.lazy" => "checkboxValue", + "v-on:change" => "onChange", "type" => "checkbox"} %label{"v-bind:for" => "inputId(pluginType, option)", "data-toggle" => "tooltip", @@ -29,21 +33,9 @@ "data-placement" => "right", "v-bind:title" => "option.desc"} {{ option.name | humanize }} - %template{"v-if" => 'option.name === "expression"'} - %input{"v-bind:id" => "inputId(pluginType, option)", - "v-bind:name" => "inputName(pluginType, option)", - "v-model.lazy" => "expression", - "type" => "text", - "class" => "form-control"} - %template{"v-else-if" => 'option.name === "time_format"'} - %input{"v-bind:id" => "inputId(pluginType, option)", - "v-bind:name" => "inputName(pluginType, option)", - "v-model.lazy" => "timeFormat", - "type" => "text", - "class" => "form-control"} - %template(v-else) - %input{"v-bind:id" => "inputId(pluginType, option)", - "v-bind:name" => "inputName(pluginType, option)", - "v-model.lazy" => "textValue", - "type" => "text", - "class" => "form-control"} + %input{"v-bind:id" => "inputId(pluginType, option)", + "v-bind:name" => "inputName(pluginType, option)", + "v-model.lazy" => "textValue", + "v-on:change" => "onChange", + "type" => "text", + "class" => "form-control"} diff --git a/app/views/shared/vue/_parser_plugin_form.html.haml b/app/views/shared/vue/_parser_plugin_form.html.haml index d374034..f121ac9 100644 --- a/app/views/shared/vue/_parser_plugin_form.html.haml +++ b/app/views/shared/vue/_parser_plugin_form.html.haml @@ -20,14 +20,12 @@ "v-bind:common-options" => "commonOptions", "v-on:change-formats" => "onChangeFormats"} %template(v-else) - %config-field{"v-for" => "option in commonOptions", - "v-bind:key" => "option.name", - "v-bind:plugin-type" => "pluginType", - "v-bind:option" => "option", - "v-bind:initial-expression" => "expression", - "v-bind:initial-time-format" => "timeFormat", - "v-bind:initial-text-value" => "initialParams[option.name]", - "v-on:change-parse-config" => "onChangeParseConfig"} + %template{"v-for" => "option in commonOptions"} + %config-field{"v-bind:key" => "option.name", + "v-bind:plugin-type" => "pluginType", + "v-bind:option" => "option", + "v-bind:initial-text-value" => "initialParams[option.name]", + "v-on:change-parse-config" => "onChangeParseConfig"} %template{"v-if" => '!_.isEmpty(advancedOptions)'} .card.card-body.bg-light %h4{"data-toggle" => "collapse", "href" => "#owned-plugin-advanced-setting"} From 8b4829d7b30c7eae50132f7e2fbb83c3fa0a227a Mon Sep 17 00:00:00 2001 From: Kenji Okimoto Date: Tue, 2 Oct 2018 18:00:19 +0900 Subject: [PATCH 13/18] Use snake case instead of camel case Signed-off-by: Kenji Okimoto --- app/javascript/packs/store/modules/parser_params.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/app/javascript/packs/store/modules/parser_params.js b/app/javascript/packs/store/modules/parser_params.js index 83d7158..6ced895 100644 --- a/app/javascript/packs/store/modules/parser_params.js +++ b/app/javascript/packs/store/modules/parser_params.js @@ -13,10 +13,10 @@ const getters = { toParams: (state) => { return { expression: state.expression, - timeFormat: state.timeFormat, - messageFormat: state.messageFormat, - rfc5424TimeFormat: state.rfc5424TimeFormat, - withPriority: state.withPriority + time_format: state.timeFormat, + message_format: state.messageFormat, + rfc5424_time_format: state.rfc5424TimeFormat, + with_priority: state.withPriority }; }, pluginName: (state) => { From e9598a6110e03a9c763d9d3d67554a8c7ccf150e Mon Sep 17 00:00:00 2001 From: Kenji Okimoto Date: Wed, 3 Oct 2018 11:01:52 +0900 Subject: [PATCH 14/18] Handle non string value such as integer The parser plugin may convert type of field value to something. Signed-off-by: Kenji Okimoto --- lib/regexp_preview/multi_line.rb | 7 ++++--- lib/regexp_preview/single_line.rb | 7 ++++--- 2 files changed, 8 insertions(+), 6 deletions(-) diff --git a/lib/regexp_preview/multi_line.rb b/lib/regexp_preview/multi_line.rb index be30493..4405e7d 100644 --- a/lib/regexp_preview/multi_line.rb +++ b/lib/regexp_preview/multi_line.rb @@ -47,12 +47,13 @@ module RegexpPreview next unless record last_pos = 0 record.each do |key, value| - start = chunk.index(value, last_pos) - finish = start + value.bytesize + v = value.to_s + start = chunk.index(v, last_pos) + finish = start + v.bytesize last_pos = finish parsed[:matches] << { key: key, - matched: value, + matched: v, pos: [start, finish] } end diff --git a/lib/regexp_preview/single_line.rb b/lib/regexp_preview/single_line.rb index 6349aa6..f58bc5c 100644 --- a/lib/regexp_preview/single_line.rb +++ b/lib/regexp_preview/single_line.rb @@ -36,12 +36,13 @@ module RegexpPreview next unless record last_pos = 0 record.each do |key, value| - start = line.index(value, last_pos) - finish = start + value.bytesize + v = value.to_s + start = line.index(v, last_pos) + finish = start + v.bytesize last_pos = finish parsed[:matches] << { key: key, - matched: value, + matched: v, pos: [start, finish] } end From 832aeaea655a6d0ed4229c4ffa2a6c61148bb8ae Mon Sep 17 00:00:00 2001 From: Kenji Okimoto Date: Wed, 3 Oct 2018 11:03:00 +0900 Subject: [PATCH 15/18] Use true/false value for checkbox value Because Fluentd's config parser can handle "true/false" and "yes/no" only. Signed-off-by: Kenji Okimoto --- app/javascript/packs/store/modules/parser_params.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/javascript/packs/store/modules/parser_params.js b/app/javascript/packs/store/modules/parser_params.js index 6ced895..f3dd931 100644 --- a/app/javascript/packs/store/modules/parser_params.js +++ b/app/javascript/packs/store/modules/parser_params.js @@ -42,7 +42,7 @@ const actions = { commit("setRfc5424TimeFormat", event.target.value); }, updateWithPriority({ commit, state }, event) { - commit("setWithPriority", event.target.value); + commit("setWithPriority", event.target.checked); } }; From 8dcaef9834970ed423ef73eebd4e2e922525a476 Mon Sep 17 00:00:00 2001 From: Kenji Okimoto Date: Wed, 3 Oct 2018 11:38:55 +0900 Subject: [PATCH 16/18] Remove debug log Signed-off-by: Kenji Okimoto --- app/javascript/packs/in_tail_parse.js | 1 - 1 file changed, 1 deletion(-) diff --git a/app/javascript/packs/in_tail_parse.js b/app/javascript/packs/in_tail_parse.js index fd00827..ecf756c 100644 --- a/app/javascript/packs/in_tail_parse.js +++ b/app/javascript/packs/in_tail_parse.js @@ -60,7 +60,6 @@ $(document).ready(() => { methods: { onChangePluginName: function(name) { console.log("#in-tail-parse onChangePluginName", name); - console.log("#in-tail-parse onChangePluginName store", this.$store); this.parseType = name; this.parse = {}; // clear parser plugin configuration }, From c0c0b746248e55bf6903ec5a194785397bfb8e14 Mon Sep 17 00:00:00 2001 From: Kenji Okimoto Date: Wed, 3 Oct 2018 11:50:25 +0900 Subject: [PATCH 17/18] Preview at first Signed-off-by: Kenji Okimoto --- app/javascript/packs/in_tail_parse.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/app/javascript/packs/in_tail_parse.js b/app/javascript/packs/in_tail_parse.js index ecf756c..4faa45d 100644 --- a/app/javascript/packs/in_tail_parse.js +++ b/app/javascript/packs/in_tail_parse.js @@ -48,6 +48,8 @@ $(document).ready(() => { }, mounted: function() { this.parse = {}; + this.parseType = this.initialPluginName; + this.preview(); }, updated: function() { this.$nextTick(() => { @@ -133,7 +135,7 @@ $(document).ready(() => { preview: function() { console.log("preview!!!!"); if (this.previewAjax && this.previewAjax.state() === "pending") { - this.previewAjax.abort(); + this.previewAjax.abort && this.previewAjax.abort(); } const parseType = store.getters["parserParams/pluginName"]; this.previewAjax = $.ajax({ From 303ebed383b9b78a70ffd6dfd9168b2347d724c6 Mon Sep 17 00:00:00 2001 From: Kenji Okimoto Date: Wed, 3 Oct 2018 11:51:02 +0900 Subject: [PATCH 18/18] Preview on change plugin name Signed-off-by: Kenji Okimoto --- app/javascript/packs/in_tail_parse.js | 3 ++- app/javascript/packs/parser_plugin_form.js | 1 + 2 files changed, 3 insertions(+), 1 deletion(-) diff --git a/app/javascript/packs/in_tail_parse.js b/app/javascript/packs/in_tail_parse.js index 4faa45d..a9dbf2f 100644 --- a/app/javascript/packs/in_tail_parse.js +++ b/app/javascript/packs/in_tail_parse.js @@ -62,8 +62,9 @@ $(document).ready(() => { methods: { onChangePluginName: function(name) { console.log("#in-tail-parse onChangePluginName", name); - this.parseType = name; + this.updateHighlightedLines([]); this.parse = {}; // clear parser plugin configuration + this.onChangeParseConfig(); }, onChangeParseConfig: function(data) { console.log("#in-tail-parse onChangeParseConfig", store.getters["parserParams/toParams"]); diff --git a/app/javascript/packs/parser_plugin_form.js b/app/javascript/packs/parser_plugin_form.js index 0a1bd6a..70b7003 100644 --- a/app/javascript/packs/parser_plugin_form.js +++ b/app/javascript/packs/parser_plugin_form.js @@ -63,6 +63,7 @@ const ParserPluginForm = { methods: { onChange: function(event) { store.dispatch("parserParams/updateType", event); + this.$emit("change-plugin-name", event.target.value); this.updateSection(); },