From 6ab3c13ba2a1f57e6ec6302130ae7d2d642598a2 Mon Sep 17 00:00:00 2001
From: nsano-rururu <nsano@ae.em-net.ne.jp>
Date: Tue, 9 Jan 2024 01:31:44 +0900
Subject: [PATCH] Bugfix etc

Fix generate_kibana_discover_url is false
Fix pagertree_proxy
Code modification for vue3 compatibility
axios 1.6.4 to 1.6.5
jsdom 23.0.1 to 23.2.0
add eslint-plugin-rulesdir
---
 .eslintrc.js                                  | 124 +++++++++++-
 eslint/rules/custom1.js                       |  49 +++++
 package-lock.json                             | 159 ++++++++++++---
 package.json                                  |   5 +-
 run_tests.sh                                  |  12 +-
 src/components/config/ConfigDescription.vue   |  10 +-
 .../config/ConfigKibanaDiscover.vue           |  12 +-
 .../config/ConfigLimitExcecution.vue          |   2 +-
 src/components/config/ConfigOwner.vue         |  10 +-
 src/components/config/ConfigPriority.vue      |  10 +-
 .../config/ConfigScanEntireTimeframe.vue      |   8 +-
 .../config/ConfigTimeWindowFeature.vue        |   2 +-
 .../config/alert/ConfigAlertAlerta.vue        |  48 ++---
 .../config/alert/ConfigAlertAlertmanager.vue  |  34 +---
 .../config/alert/ConfigAlertAmazonSes.vue     |  24 +--
 .../config/alert/ConfigAlertAmazonSns.vue     |  14 +-
 .../config/alert/ConfigAlertChatwork.vue      |  12 +-
 .../config/alert/ConfigAlertCommand.vue       |  26 +--
 .../config/alert/ConfigAlertDatadog.vue       |   6 +-
 .../config/alert/ConfigAlertDingtalk.vue      |  10 +-
 .../config/alert/ConfigAlertDiscord.vue       |  14 +-
 .../config/alert/ConfigAlertEmail.vue         |  34 ++--
 .../config/alert/ConfigAlertExotel.vue        |  12 +-
 .../config/alert/ConfigAlertGelf.vue          |  24 +--
 .../config/alert/ConfigAlertGitter.vue        |   8 +-
 .../config/alert/ConfigAlertGoogleChat.vue    |  14 +-
 .../config/alert/ConfigAlertHttpPost.vue      |  22 +-
 .../config/alert/ConfigAlertHttpPost2.vue     |  22 +-
 .../config/alert/ConfigAlertIris.vue          |  46 ++---
 .../config/alert/ConfigAlertJira.vue          |   8 +-
 .../config/alert/ConfigAlertLark.vue          |   2 +-
 .../config/alert/ConfigAlertLineNotify.vue    |   4 +-
 .../config/alert/ConfigAlertMattermost.vue    |  48 ++---
 .../config/alert/ConfigAlertMsTeams.vue       |  40 ++--
 .../config/alert/ConfigAlertOpsgenie.vue      |  18 +-
 .../config/alert/ConfigAlertPagerDuty.vue     |  30 ++-
 .../config/alert/ConfigAlertPagerTree.vue     |   8 +-
 .../config/alert/ConfigAlertRocketChat.vue    |  38 ++--
 .../config/alert/ConfigAlertServiceNow.vue    |  28 +--
 .../config/alert/ConfigAlertSlack.vue         |  68 +++----
 .../config/alert/ConfigAlertStomp.vue         |  12 +-
 .../config/alert/ConfigAlertSubjectBody.vue   |   2 +-
 .../config/alert/ConfigAlertTelegram.vue      |  14 +-
 .../config/alert/ConfigAlertTencentSms.vue    |  14 +-
 .../config/alert/ConfigAlertTheHive.vue       |  24 +--
 .../config/alert/ConfigAlertTwilio.vue        |  12 +-
 .../config/alert/ConfigAlertVictorOps.vue     |  14 +-
 .../config/alert/ConfigAlertZabbix.vue        |  18 +-
 src/main.js                                   | 189 +++++++++++++++++-
 src/store/config/alert.js                     |   2 +-
 src/store/config/index.js                     | 101 +++++-----
 tests/unit/mockData/alert/ruleDataIris002.js  |   1 -
 .../ConfigYamlScanEntireTimefame.spec.js      |   1 -
 .../unit/specs/alert/ConfigYamlAlerta.spec.js |   1 -
 .../specs/alert/ConfigYamlAlerta002.spec.js   |   1 -
 .../specs/alert/ConfigYamlAlertaOpt.spec.js   |   1 -
 .../alert/ConfigYamlAlertmanager.spec.js      |   1 -
 .../alert/ConfigYamlAlertmanager002.spec.js   |   1 -
 .../specs/alert/ConfigYamlChatwork.spec.js    |   1 -
 .../specs/alert/ConfigYamlCommand.spec.js     |   1 -
 .../specs/alert/ConfigYamlDataDatadog.spec.js |   1 -
 .../specs/alert/ConfigYamlDingtalk.spec.js    |   1 -
 .../specs/alert/ConfigYamlDingtalk002.spec.js |   1 -
 .../specs/alert/ConfigYamlDingtalk003.spec.js |   1 -
 .../specs/alert/ConfigYamlDingtalk004.spec.js |   1 -
 .../specs/alert/ConfigYamlDiscord.spec.js     |   1 -
 .../specs/alert/ConfigYamlDiscordOpt.spec.js  |   1 -
 .../unit/specs/alert/ConfigYamlEmail.spec.js  |   1 -
 .../specs/alert/ConfigYamlEmail002.spec.js    |   1 -
 .../unit/specs/alert/ConfigYamlExotel.spec.js |   1 -
 .../specs/alert/ConfigYamlGelf001.spec.js     |   1 -
 .../specs/alert/ConfigYamlGelf002.spec.js     |   1 -
 .../unit/specs/alert/ConfigYamlGitter.spec.js |   1 -
 .../specs/alert/ConfigYamlGitterOpt.spec.js   |   1 -
 .../specs/alert/ConfigYamlGoogleChat.spec.js  |   1 -
 .../alert/ConfigYamlGoogleChat002.spec.js     |   1 -
 .../specs/alert/ConfigYamlHttpPost.spec.js    |   1 -
 .../specs/alert/ConfigYamlHttpPost002.spec.js |   1 -
 .../specs/alert/ConfigYamlHttpPost2.spec.js   |   1 -
 .../alert/ConfigYamlHttpPost2Opt.spec.js      |   1 -
 .../specs/alert/ConfigYamlHttpPostOpt.spec.js |   1 -
 tests/unit/specs/alert/ConfigYamlIris.spec.js |   1 -
 .../specs/alert/ConfigYamlIris002.spec.js     |   1 -
 tests/unit/specs/alert/ConfigYamlJira.spec.js |   1 -
 tests/unit/specs/alert/ConfigYamlLark.spec.js |   1 -
 .../specs/alert/ConfigYamlLineNotify.spec.js  |   1 -
 .../specs/alert/ConfigYamlMattermost.spec.js  |   4 -
 .../specs/alert/ConfigYamlMsTeams.spec.js     |   3 -
 .../specs/alert/ConfigYamlOpsgenie.spec.js    |   1 -
 .../specs/alert/ConfigYamlOpsgenie002.spec.js |   1 -
 .../specs/alert/ConfigYamlOpsgenie003.spec.js |   1 -
 .../specs/alert/ConfigYamlOpsgenie004.spec.js |   1 -
 .../specs/alert/ConfigYamlOpsgenie005.spec.js |   1 -
 .../specs/alert/ConfigYamlOpsgenie006.spec.js |   1 -
 .../specs/alert/ConfigYamlPagerDuty.spec.js   |   1 -
 .../alert/ConfigYamlPagerDuty002.spec.js      |   1 -
 .../alert/ConfigYamlPagerDuty003.spec.js      |   1 -
 .../alert/ConfigYamlPagerDuty004.spec.js      |   1 -
 .../alert/ConfigYamlPagerDuty005.spec.js      |   1 -
 .../specs/alert/ConfigYamlPagerTree.spec.js   |   1 -
 .../specs/alert/ConfigYamlRocketChat.spec.js  |   4 -
 .../specs/alert/ConfigYamlServiceNow.spec.js  |   1 -
 tests/unit/specs/alert/ConfigYamlSes.spec.js  |   1 -
 .../specs/alert/ConfigYamlSesProfile.spec.js  |   1 -
 .../unit/specs/alert/ConfigYamlSlack.spec.js  |   5 -
 tests/unit/specs/alert/ConfigYamlSns.spec.js  |   1 -
 .../specs/alert/ConfigYamlSnsProfile.spec.js  |   1 -
 .../unit/specs/alert/ConfigYamlStomp.spec.js  |   1 -
 .../ConfigYamlStompModRequiredAndOpt.spec.js  |   1 -
 .../specs/alert/ConfigYamlTelegram001.spec.js |   1 -
 .../specs/alert/ConfigYamlTelegram002.spec.js |   1 -
 .../specs/alert/ConfigYamlTelegram003.spec.js |   1 -
 .../specs/alert/ConfigYamlTencentSms.spec.js  |   1 -
 .../alert/ConfigYamlTencentSmsOpt.spec.js     |   1 -
 .../specs/alert/ConfigYamlTheHive.spec.js     |   1 -
 .../specs/alert/ConfigYamlTheHiveOpt.spec.js  |   1 -
 .../alert/ConfigYamlTwilioCopilot.spec.js     |   1 -
 .../specs/alert/ConfigYamlTwilioSms.spec.js   |   1 -
 .../specs/alert/ConfigYamlVictorOps.spec.js   |   1 -
 .../alert/ConfigYamlVictorOpsOpt.spec.js      |   1 -
 .../unit/specs/alert/ConfigYamlZabbix.spec.js |   1 -
 .../ConfigYamlZabbixSenderHostPort.spec.js    |   1 -
 122 files changed, 875 insertions(+), 675 deletions(-)
 create mode 100644 eslint/rules/custom1.js

diff --git a/.eslintrc.js b/.eslintrc.js
index c2512681..aa69f097 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -1,11 +1,19 @@
+const rulesDirPlugin = require('eslint-plugin-rulesdir');
+
+rulesDirPlugin.RULES_DIR = 'eslint/rules';
+
 module.exports = {
   root: true,
   env: {
     node: true,
     mocha: true
   },
-  extends: ['plugin:vue/recommended', '@vue/eslint-config-airbnb'],
+  extends: ['plugin:vue/vue3-recommended', '@vue/eslint-config-airbnb'],
+  plugins: [
+    'rulesdir'
+  ],
   rules: {
+    'rulesdir/custom1': 'off',
     'vue/max-len': 'off',
     'import/no-unresolved': 'off',
     'vuejs-accessibility/rule-name': 'off',
@@ -62,10 +70,120 @@ module.exports = {
         singleline: 'never',
         multiline: 'never'
       }
-    ]
+    ],
+    'no-restricted-imports': [
+      'error',
+      {
+        'paths': [
+          {
+            'name': 'vue',
+            'importNames': ['default']
+          },
+        ],
+      },
+    ],
   },
   parserOptions: {
     parser: '@babel/eslint-parser',
     requireConfigFile: false
-  }
+  },
+  overrides: [
+    // TODO: Vue3 Support
+    {
+      files: [
+        '.eslintrc.js',
+      ],
+      rules: {
+        'quote-props': 'off',
+      },
+    },
+    // TODO: Vue3 Support
+    {
+      files: [
+        'src/App.vue',
+      ],
+      rules: {
+        'vue/v-on-event-hyphenation': 'off',
+      },
+    },
+    // TODO: Vue3 Support
+    {
+      files: [
+        'src/components/DateTime.vue',
+        'src/components/config/ConfigTest.vue',
+        'src/views/ConfigBuilder.vue',
+      ],
+      rules: {
+        'vue/no-deprecated-destroyed-lifecycle': 'off',
+      },
+    },
+    // TODO: Vue3 Support
+    {
+      files: [
+        'src/components/ElastalertTimePicker.vue',
+        'src/components/NavTree.vue',
+        'src/components/config/ConfigCondition.vue',
+        'src/components/config/ConfigKibanaDiscover.vue',
+        'src/components/config/ConfigQuery.vue',
+        'src/components/config/ConfigSettings.vue',
+        'src/components/config/alert/ConfigAlert.vue',
+        'src/components/config/alert/ConfigAlertAlerta.vue',
+        'src/components/config/alert/ConfigAlertCommand.vue',
+        'src/components/config/alert/ConfigAlertGoogleChat.vue',
+        'src/components/config/alert/ConfigAlertHttpPost.vue',
+        'src/components/config/alert/ConfigAlertHttpPost2.vue',
+        'src/components/config/alert/ConfigAlertMattermost.vue',
+        'src/components/config/alert/ConfigAlertMsTeams.vue',
+        'src/components/config/alert/ConfigAlertPagerDuty.vue',
+        'src/components/config/alert/ConfigAlertRocketChat.vue',
+        'src/components/config/alert/ConfigAlertSlack.vue',
+        'src/components/config/alert/ConfigAlertSubjectBody.vue',
+        'src/components/config/alert/ConfigAlertTencentSms.vue',
+        'src/components/config/alert/ConfigAlertTheHive.vue',
+        'src/views/RuleView.vue',
+        'src/views/TemplateView.vue'
+      ],
+      rules: {
+        'vue/no-deprecated-v-on-native-modifier': 'off',
+      },
+    },
+    // TODO: Vue3 Support
+    {
+      files: [
+        'src/components/ESChart.vue',
+        'src/contrib.js',
+        'src/main.js',
+        'src/registration.js',
+        'src/router.js',
+        'src/store/config/match.js',
+        'src/store/config/settings.js',
+        'src/store/configs.js',
+        'src/store/index.js',
+        'src/store/metadata.js'
+      ],
+      rules: {
+        'no-restricted-imports': 'off',
+      },
+    },
+    // TODO: Vue3 Support
+    {
+      files: [
+        'src/components/config/ConfigCondition.vue',
+        'src/views/RuleView.vue',
+        'src/views/TemplateView.vue'
+      ],
+      rules: {
+        'vue/no-deprecated-v-bind-sync': 'off',
+      },
+    },
+    // TODO: Vue3 Support
+    {
+      files: [
+        'src/views/ConfigBuilder.vue'
+      ],
+      rules: {
+        'vue/v-on-event-hyphenation': 'off',
+      },
+    },
+  ]
 };
diff --git a/eslint/rules/custom1.js b/eslint/rules/custom1.js
new file mode 100644
index 00000000..ec10d280
--- /dev/null
+++ b/eslint/rules/custom1.js
@@ -0,0 +1,49 @@
+'use strict'
+
+const utils = require('eslint-plugin-vue/lib/utils')
+
+module.exports = {
+  meta: {
+    type: 'problem',
+    docs: {
+      description:
+        'disallow using v-model for custom component is affected by a breaking change in Vue 3.',
+      categories: undefined,
+      url: 'https://v3-migration.vuejs.org/ja/breaking-changes/v-model.html',
+    },
+    fixable: null,
+    schema: [
+      {
+        type: 'object',
+        properties: {
+          ignoreComponentNames: {
+            type: 'array',
+          },
+        },
+      },
+    ],
+    messages: {
+      error:
+        'カスタムコンポーネントへのv-modelの使用は、Vue 3の破壊的変更の影響を受けるので使用しないでください。\nhttps://v3-migration.vuejs.org/ja/breaking-changes/v-model.html',
+    },
+  },
+  /** @param {RuleContext} context */
+  create(context) {
+    const ignoreComponentNames = context.options[0]?.ignoreComponentNames ?? []
+    return utils.defineTemplateBodyVisitor(context, {
+      "VAttribute[directive=true][key.name.name='model']"(node) {
+        const element = node.parent.parent
+        if (
+          utils.isCustomComponent(node.parent.parent) &&
+          !ignoreComponentNames.includes(element.name)
+        ) {
+          context.report({
+            node,
+            loc: node.loc,
+            messageId: 'error',
+          })
+        }
+      },
+    })
+  },
+}
\ No newline at end of file
diff --git a/package-lock.json b/package-lock.json
index e6fa1a38..15d53f21 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -17,7 +17,7 @@
         "@fortawesome/vue-fontawesome": "2.0.10",
         "@riophae/vue-treeselect": "0.4.0",
         "@vue-js-cron/light": "^1.0.5",
-        "axios": "1.6.4",
+        "axios": "1.6.5",
         "browser-bunyan": "1.8.0",
         "canvas": "^2.11.2",
         "change-case": "4.1.2",
@@ -75,8 +75,9 @@
         "eslint": "^8.56.0",
         "eslint-plugin-cypress": "^2.15.1",
         "eslint-plugin-import": "^2.29.1",
+        "eslint-plugin-rulesdir": "^0.2.2",
         "eslint-plugin-vue": "^9.19.2",
-        "jsdom": "23.0.1",
+        "jsdom": "23.2.0",
         "localstorage-polyfill": "1.0.1",
         "mutationobserver-simple-polyfill": "0.0.2",
         "nyc": "15.1.0",
@@ -119,6 +120,36 @@
         "node": ">=6.0.0"
       }
     },
+    "node_modules/@asamuzakjp/dom-selector": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/@asamuzakjp/dom-selector/-/dom-selector-2.0.1.tgz",
+      "integrity": "sha512-QJAJffmCiymkv6YyQ7voyQb5caCth6jzZsQncYCpHXrJ7RqdYG5y43+is8mnFcYubdOkr7cn1+na9BdFMxqw7w==",
+      "dev": true,
+      "dependencies": {
+        "bidi-js": "^1.0.3",
+        "css-tree": "^2.3.1",
+        "is-potential-custom-element-name": "^1.0.1"
+      }
+    },
+    "node_modules/@asamuzakjp/dom-selector/node_modules/css-tree": {
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/css-tree/-/css-tree-2.3.1.tgz",
+      "integrity": "sha512-6Fv1DV/TYw//QF5IzQdqsNDjx/wc8TrMBZsqjL9eW01tWb7R7k/mq+/VXfJCl7SoD5emsJop9cOByJZfs8hYIw==",
+      "dev": true,
+      "dependencies": {
+        "mdn-data": "2.0.30",
+        "source-map-js": "^1.0.1"
+      },
+      "engines": {
+        "node": "^10 || ^12.20.0 || ^14.13.0 || >=15.0.0"
+      }
+    },
+    "node_modules/@asamuzakjp/dom-selector/node_modules/mdn-data": {
+      "version": "2.0.30",
+      "resolved": "https://registry.npmjs.org/mdn-data/-/mdn-data-2.0.30.tgz",
+      "integrity": "sha512-GaqWWShW4kv/G9IEucWScBx9G1/vsFZZJUO+tD26M8J8z3Kw5RDQjaoZe03YAClgeS/SWPOcb4nkFBTEi5DUEA==",
+      "dev": true
+    },
     "node_modules/@babel/code-frame": {
       "version": "7.23.5",
       "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.23.5.tgz",
@@ -4666,9 +4697,9 @@
       }
     },
     "node_modules/axios": {
-      "version": "1.6.4",
-      "resolved": "https://registry.npmjs.org/axios/-/axios-1.6.4.tgz",
-      "integrity": "sha512-heJnIs6N4aa1eSthhN9M5ioILu8Wi8vmQW9iHQ9NUvfkJb0lEEDUiIdQNAuBtfUt3FxReaKdpQA5DbmMOqzF/A==",
+      "version": "1.6.5",
+      "resolved": "https://registry.npmjs.org/axios/-/axios-1.6.5.tgz",
+      "integrity": "sha512-Ii012v05KEVuUoFWmMW/UQv9aRIc3ZwkWDcM+h5Il8izZCtRVpDUfwpoFf7eOtajT3QiGR4yDUx7lPqHJULgbg==",
       "dependencies": {
         "follow-redirects": "^1.15.4",
         "form-data": "^4.0.0",
@@ -4907,6 +4938,15 @@
         "tweetnacl": "^0.14.3"
       }
     },
+    "node_modules/bidi-js": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/bidi-js/-/bidi-js-1.0.3.tgz",
+      "integrity": "sha512-RKshQI1R3YQ+n9YJz2QQ147P66ELpa1FQEg20Dk8oW9t2KgLbpDLLp9aGZ7y8WHSshDknG0bknqGw5/tyCs5tw==",
+      "dev": true,
+      "dependencies": {
+        "require-from-string": "^2.0.2"
+      }
+    },
     "node_modules/big.js": {
       "version": "5.2.2",
       "dev": true,
@@ -8406,6 +8446,15 @@
         "semver": "bin/semver.js"
       }
     },
+    "node_modules/eslint-plugin-rulesdir": {
+      "version": "0.2.2",
+      "resolved": "https://registry.npmjs.org/eslint-plugin-rulesdir/-/eslint-plugin-rulesdir-0.2.2.tgz",
+      "integrity": "sha512-qhBtmrWgehAIQeMDJ+Q+PnOz1DWUZMPeVrI0wE9NZtnpIMFUfh3aPKFYt2saeMSemZRrvUtjWfYwepsC8X+mjQ==",
+      "dev": true,
+      "engines": {
+        "node": ">=4.0.0"
+      }
+    },
     "node_modules/eslint-plugin-vue": {
       "version": "9.19.2",
       "resolved": "https://registry.npmjs.org/eslint-plugin-vue/-/eslint-plugin-vue-9.19.2.tgz",
@@ -11353,12 +11402,13 @@
       "dev": true
     },
     "node_modules/jsdom": {
-      "version": "23.0.1",
-      "resolved": "https://registry.npmjs.org/jsdom/-/jsdom-23.0.1.tgz",
-      "integrity": "sha512-2i27vgvlUsGEBO9+/kJQRbtqtm+191b5zAZrU/UezVmnC2dlDAFLgDYJvAEi94T4kjsRKkezEtLQTgsNEsW2lQ==",
+      "version": "23.2.0",
+      "resolved": "https://registry.npmjs.org/jsdom/-/jsdom-23.2.0.tgz",
+      "integrity": "sha512-L88oL7D/8ufIES+Zjz7v0aes+oBMh2Xnh3ygWvL0OaICOomKEPKuPnIfBJekiXr+BHbbMjrWn/xqrDQuxFTeyA==",
       "dev": true,
       "dependencies": {
-        "cssstyle": "^3.0.0",
+        "@asamuzakjp/dom-selector": "^2.0.1",
+        "cssstyle": "^4.0.1",
         "data-urls": "^5.0.0",
         "decimal.js": "^10.4.3",
         "form-data": "^4.0.0",
@@ -11366,7 +11416,6 @@
         "http-proxy-agent": "^7.0.0",
         "https-proxy-agent": "^7.0.2",
         "is-potential-custom-element-name": "^1.0.1",
-        "nwsapi": "^2.2.7",
         "parse5": "^7.1.2",
         "rrweb-cssom": "^0.6.0",
         "saxes": "^6.0.0",
@@ -11377,7 +11426,7 @@
         "whatwg-encoding": "^3.1.1",
         "whatwg-mimetype": "^4.0.0",
         "whatwg-url": "^14.0.0",
-        "ws": "^8.14.2",
+        "ws": "^8.16.0",
         "xml-name-validator": "^5.0.0"
       },
       "engines": {
@@ -11413,15 +11462,15 @@
       }
     },
     "node_modules/jsdom/node_modules/cssstyle": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/cssstyle/-/cssstyle-3.0.0.tgz",
-      "integrity": "sha512-N4u2ABATi3Qplzf0hWbVCdjenim8F3ojEXpBDF5hBpjzW182MjNGLqfmQ0SkSPeQ+V86ZXgeH8aXj6kayd4jgg==",
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/cssstyle/-/cssstyle-4.0.1.tgz",
+      "integrity": "sha512-8ZYiJ3A/3OkDd093CBT/0UKDWry7ak4BdPTFP2+QEP7cmhouyq/Up709ASSj2cK02BbZiMgk7kYjZNS4QP5qrQ==",
       "dev": true,
       "dependencies": {
         "rrweb-cssom": "^0.6.0"
       },
       "engines": {
-        "node": ">=14"
+        "node": ">=18"
       }
     },
     "node_modules/jsdom/node_modules/entities": {
@@ -11567,9 +11616,9 @@
       }
     },
     "node_modules/jsdom/node_modules/ws": {
-      "version": "8.15.0",
-      "resolved": "https://registry.npmjs.org/ws/-/ws-8.15.0.tgz",
-      "integrity": "sha512-H/Z3H55mrcrgjFwI+5jKavgXvwQLtfPCUEp6pi35VhoB0pfcHnSoyuTzkBEZpzq49g1193CUEwIvmsjcotenYw==",
+      "version": "8.16.0",
+      "resolved": "https://registry.npmjs.org/ws/-/ws-8.16.0.tgz",
+      "integrity": "sha512-HS0c//TP7Ina87TfiPUz1rQzMhHrl/SG2guqRcTOIUYD2q8uhUdNHZYJUaQ8aTGPzCh+c6oawMKW35nFl1dxyQ==",
       "dev": true,
       "engines": {
         "node": ">=10.0.0"
@@ -19494,6 +19543,35 @@
         "@jridgewell/trace-mapping": "^0.3.9"
       }
     },
+    "@asamuzakjp/dom-selector": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/@asamuzakjp/dom-selector/-/dom-selector-2.0.1.tgz",
+      "integrity": "sha512-QJAJffmCiymkv6YyQ7voyQb5caCth6jzZsQncYCpHXrJ7RqdYG5y43+is8mnFcYubdOkr7cn1+na9BdFMxqw7w==",
+      "dev": true,
+      "requires": {
+        "bidi-js": "^1.0.3",
+        "css-tree": "^2.3.1",
+        "is-potential-custom-element-name": "^1.0.1"
+      },
+      "dependencies": {
+        "css-tree": {
+          "version": "2.3.1",
+          "resolved": "https://registry.npmjs.org/css-tree/-/css-tree-2.3.1.tgz",
+          "integrity": "sha512-6Fv1DV/TYw//QF5IzQdqsNDjx/wc8TrMBZsqjL9eW01tWb7R7k/mq+/VXfJCl7SoD5emsJop9cOByJZfs8hYIw==",
+          "dev": true,
+          "requires": {
+            "mdn-data": "2.0.30",
+            "source-map-js": "^1.0.1"
+          }
+        },
+        "mdn-data": {
+          "version": "2.0.30",
+          "resolved": "https://registry.npmjs.org/mdn-data/-/mdn-data-2.0.30.tgz",
+          "integrity": "sha512-GaqWWShW4kv/G9IEucWScBx9G1/vsFZZJUO+tD26M8J8z3Kw5RDQjaoZe03YAClgeS/SWPOcb4nkFBTEi5DUEA==",
+          "dev": true
+        }
+      }
+    },
     "@babel/code-frame": {
       "version": "7.23.5",
       "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.23.5.tgz",
@@ -22855,9 +22933,9 @@
       "dev": true
     },
     "axios": {
-      "version": "1.6.4",
-      "resolved": "https://registry.npmjs.org/axios/-/axios-1.6.4.tgz",
-      "integrity": "sha512-heJnIs6N4aa1eSthhN9M5ioILu8Wi8vmQW9iHQ9NUvfkJb0lEEDUiIdQNAuBtfUt3FxReaKdpQA5DbmMOqzF/A==",
+      "version": "1.6.5",
+      "resolved": "https://registry.npmjs.org/axios/-/axios-1.6.5.tgz",
+      "integrity": "sha512-Ii012v05KEVuUoFWmMW/UQv9aRIc3ZwkWDcM+h5Il8izZCtRVpDUfwpoFf7eOtajT3QiGR4yDUx7lPqHJULgbg==",
       "requires": {
         "follow-redirects": "^1.15.4",
         "form-data": "^4.0.0",
@@ -23040,6 +23118,15 @@
         "tweetnacl": "^0.14.3"
       }
     },
+    "bidi-js": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/bidi-js/-/bidi-js-1.0.3.tgz",
+      "integrity": "sha512-RKshQI1R3YQ+n9YJz2QQ147P66ELpa1FQEg20Dk8oW9t2KgLbpDLLp9aGZ7y8WHSshDknG0bknqGw5/tyCs5tw==",
+      "dev": true,
+      "requires": {
+        "require-from-string": "^2.0.2"
+      }
+    },
     "big.js": {
       "version": "5.2.2",
       "dev": true
@@ -25791,6 +25878,12 @@
         }
       }
     },
+    "eslint-plugin-rulesdir": {
+      "version": "0.2.2",
+      "resolved": "https://registry.npmjs.org/eslint-plugin-rulesdir/-/eslint-plugin-rulesdir-0.2.2.tgz",
+      "integrity": "sha512-qhBtmrWgehAIQeMDJ+Q+PnOz1DWUZMPeVrI0wE9NZtnpIMFUfh3aPKFYt2saeMSemZRrvUtjWfYwepsC8X+mjQ==",
+      "dev": true
+    },
     "eslint-plugin-vue": {
       "version": "9.19.2",
       "resolved": "https://registry.npmjs.org/eslint-plugin-vue/-/eslint-plugin-vue-9.19.2.tgz",
@@ -27603,12 +27696,13 @@
       "dev": true
     },
     "jsdom": {
-      "version": "23.0.1",
-      "resolved": "https://registry.npmjs.org/jsdom/-/jsdom-23.0.1.tgz",
-      "integrity": "sha512-2i27vgvlUsGEBO9+/kJQRbtqtm+191b5zAZrU/UezVmnC2dlDAFLgDYJvAEi94T4kjsRKkezEtLQTgsNEsW2lQ==",
+      "version": "23.2.0",
+      "resolved": "https://registry.npmjs.org/jsdom/-/jsdom-23.2.0.tgz",
+      "integrity": "sha512-L88oL7D/8ufIES+Zjz7v0aes+oBMh2Xnh3ygWvL0OaICOomKEPKuPnIfBJekiXr+BHbbMjrWn/xqrDQuxFTeyA==",
       "dev": true,
       "requires": {
-        "cssstyle": "^3.0.0",
+        "@asamuzakjp/dom-selector": "^2.0.1",
+        "cssstyle": "^4.0.1",
         "data-urls": "^5.0.0",
         "decimal.js": "^10.4.3",
         "form-data": "^4.0.0",
@@ -27616,7 +27710,6 @@
         "http-proxy-agent": "^7.0.0",
         "https-proxy-agent": "^7.0.2",
         "is-potential-custom-element-name": "^1.0.1",
-        "nwsapi": "^2.2.7",
         "parse5": "^7.1.2",
         "rrweb-cssom": "^0.6.0",
         "saxes": "^6.0.0",
@@ -27627,7 +27720,7 @@
         "whatwg-encoding": "^3.1.1",
         "whatwg-mimetype": "^4.0.0",
         "whatwg-url": "^14.0.0",
-        "ws": "^8.14.2",
+        "ws": "^8.16.0",
         "xml-name-validator": "^5.0.0"
       },
       "dependencies": {
@@ -27641,9 +27734,9 @@
           }
         },
         "cssstyle": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/cssstyle/-/cssstyle-3.0.0.tgz",
-          "integrity": "sha512-N4u2ABATi3Qplzf0hWbVCdjenim8F3ojEXpBDF5hBpjzW182MjNGLqfmQ0SkSPeQ+V86ZXgeH8aXj6kayd4jgg==",
+          "version": "4.0.1",
+          "resolved": "https://registry.npmjs.org/cssstyle/-/cssstyle-4.0.1.tgz",
+          "integrity": "sha512-8ZYiJ3A/3OkDd093CBT/0UKDWry7ak4BdPTFP2+QEP7cmhouyq/Up709ASSj2cK02BbZiMgk7kYjZNS4QP5qrQ==",
           "dev": true,
           "requires": {
             "rrweb-cssom": "^0.6.0"
@@ -27752,9 +27845,9 @@
           }
         },
         "ws": {
-          "version": "8.15.0",
-          "resolved": "https://registry.npmjs.org/ws/-/ws-8.15.0.tgz",
-          "integrity": "sha512-H/Z3H55mrcrgjFwI+5jKavgXvwQLtfPCUEp6pi35VhoB0pfcHnSoyuTzkBEZpzq49g1193CUEwIvmsjcotenYw==",
+          "version": "8.16.0",
+          "resolved": "https://registry.npmjs.org/ws/-/ws-8.16.0.tgz",
+          "integrity": "sha512-HS0c//TP7Ina87TfiPUz1rQzMhHrl/SG2guqRcTOIUYD2q8uhUdNHZYJUaQ8aTGPzCh+c6oawMKW35nFl1dxyQ==",
           "dev": true,
           "requires": {}
         },
diff --git a/package.json b/package.json
index c2eefcbc..d6a3bee8 100644
--- a/package.json
+++ b/package.json
@@ -24,7 +24,7 @@
     "@fortawesome/vue-fontawesome": "2.0.10",
     "@riophae/vue-treeselect": "0.4.0",
     "@vue-js-cron/light": "^1.0.5",
-    "axios": "1.6.4",
+    "axios": "1.6.5",
     "browser-bunyan": "1.8.0",
     "canvas": "^2.11.2",
     "change-case": "4.1.2",
@@ -82,8 +82,9 @@
     "eslint": "^8.56.0",
     "eslint-plugin-cypress": "^2.15.1",
     "eslint-plugin-import": "^2.29.1",
+    "eslint-plugin-rulesdir": "^0.2.2",
     "eslint-plugin-vue": "^9.19.2",
-    "jsdom": "23.0.1",
+    "jsdom": "23.2.0",
     "localstorage-polyfill": "1.0.1",
     "mutationobserver-simple-polyfill": "0.0.2",
     "nyc": "15.1.0",
diff --git a/run_tests.sh b/run_tests.sh
index e8da042a..a6e26519 100755
--- a/run_tests.sh
+++ b/run_tests.sh
@@ -26,21 +26,20 @@
 ./node_modules/.bin/vue-cli-service test:unit tests/unit/specs/alert/ConfigYamlGitterOpt.spec.js &&
 ./node_modules/.bin/vue-cli-service test:unit tests/unit/specs/alert/ConfigYamlGoogleChat.spec.js &&
 ./node_modules/.bin/vue-cli-service test:unit tests/unit/specs/alert/ConfigYamlGoogleChat002.spec.js &&
-./node_modules/.bin/vue-cli-service test:unit tests/unit/specs/alert/ConfigYamlIris.spec.js &&
-./node_modules/.bin/vue-cli-service test:unit tests/unit/specs/alert/ConfigYamlIris002.spec.js &&
-./node_modules/.bin/vue-cli-service test:unit tests/unit/specs/alert/ConfigYamlJira.spec.js &&
-./node_modules/.bin/vue-cli-service test:unit tests/unit/specs/alert/ConfigYamlLark.spec.js &&
-./node_modules/.bin/vue-cli-service test:unit tests/unit/specs/alert/ConfigYamlLineNotify.spec.js &&
 ./node_modules/.bin/vue-cli-service test:unit tests/unit/specs/alert/ConfigYamlHttpPost.spec.js &&
 ./node_modules/.bin/vue-cli-service test:unit tests/unit/specs/alert/ConfigYamlHttpPost002.spec.js &&
 ./node_modules/.bin/vue-cli-service test:unit tests/unit/specs/alert/ConfigYamlHttpPostOpt.spec.js &&
 ./node_modules/.bin/vue-cli-service test:unit tests/unit/specs/alert/ConfigYamlHttpPost2.spec.js &&
 ./node_modules/.bin/vue-cli-service test:unit tests/unit/specs/alert/ConfigYamlHttpPost2Opt.spec.js &&
+./node_modules/.bin/vue-cli-service test:unit tests/unit/specs/alert/ConfigYamlIris.spec.js &&
+./node_modules/.bin/vue-cli-service test:unit tests/unit/specs/alert/ConfigYamlIris002.spec.js &&
+./node_modules/.bin/vue-cli-service test:unit tests/unit/specs/alert/ConfigYamlJira.spec.js &&
+./node_modules/.bin/vue-cli-service test:unit tests/unit/specs/alert/ConfigYamlLark.spec.js &&
+./node_modules/.bin/vue-cli-service test:unit tests/unit/specs/alert/ConfigYamlLineNotify.spec.js &&
 ./node_modules/.bin/vue-cli-service test:unit tests/unit/specs/alert/ConfigYamlMattermost.spec.js &&
 ./node_modules/.bin/vue-cli-service test:unit tests/unit/specs/alert/ConfigYamlMattermost002.spec.js &&
 ./node_modules/.bin/vue-cli-service test:unit tests/unit/specs/alert/ConfigYamlMsTeams.spec.js &&
 ./node_modules/.bin/vue-cli-service test:unit tests/unit/specs/alert/ConfigYamlMsTeamsOpt.spec.js &&
-./node_modules/.bin/vue-cli-service test:unit tests/unit/specs/alert/ConfigYamlPagerTree.spec.js &&
 ./node_modules/.bin/vue-cli-service test:unit tests/unit/specs/alert/ConfigYamlOpsgenie.spec.js &&
 ./node_modules/.bin/vue-cli-service test:unit tests/unit/specs/alert/ConfigYamlOpsgenie002.spec.js &&
 ./node_modules/.bin/vue-cli-service test:unit tests/unit/specs/alert/ConfigYamlOpsgenie003.spec.js &&
@@ -52,6 +51,7 @@
 ./node_modules/.bin/vue-cli-service test:unit tests/unit/specs/alert/ConfigYamlPagerDuty003.spec.js &&
 ./node_modules/.bin/vue-cli-service test:unit tests/unit/specs/alert/ConfigYamlPagerDuty004.spec.js &&
 ./node_modules/.bin/vue-cli-service test:unit tests/unit/specs/alert/ConfigYamlPagerDuty005.spec.js &&
+./node_modules/.bin/vue-cli-service test:unit tests/unit/specs/alert/ConfigYamlPagerTree.spec.js &&
 ./node_modules/.bin/vue-cli-service test:unit tests/unit/specs/alert/ConfigYamlRocketChat.spec.js &&
 ./node_modules/.bin/vue-cli-service test:unit tests/unit/specs/alert/ConfigYamlRocketChat002.spec.js &&
 ./node_modules/.bin/vue-cli-service test:unit tests/unit/specs/alert/ConfigYamlServiceNow.spec.js &&
diff --git a/src/components/config/ConfigDescription.vue b/src/components/config/ConfigDescription.vue
index 3d670c0a..9e9ad913 100644
--- a/src/components/config/ConfigDescription.vue
+++ b/src/components/config/ConfigDescription.vue
@@ -3,7 +3,7 @@
     <el-col :span="19">
       <el-form-item label="Description">
         <el-switch
-          v-model="useDescription"
+          :value="useDescription"
           :disabled="viewOnly"
           @change="changeUseDescription" />
         <label>
@@ -16,7 +16,7 @@
 
     <el-col v-if="useDescription" :span="19">
       <el-form-item label="Description" prop="configDescription" required>
-        <el-input id="configDescription" v-model="configDescription" :disabled="viewOnly" />
+        <el-input id="configDescription" :value="configDescription" :disabled="viewOnly" @input="configDescription = $event" />
       </el-form-item>
     </el-col>
   </el-row>
@@ -54,11 +54,7 @@ export default {
 
   methods: {
     changeUseDescription(val) {
-      if (val) {
-        this.useDescription = true;
-      } else {
-        this.useDescription = false;
-      }
+      this.useDescription = val;
     },
   }
 };
diff --git a/src/components/config/ConfigKibanaDiscover.vue b/src/components/config/ConfigKibanaDiscover.vue
index cd53c95d..40bc63f4 100644
--- a/src/components/config/ConfigKibanaDiscover.vue
+++ b/src/components/config/ConfigKibanaDiscover.vue
@@ -4,7 +4,7 @@
       <el-form-item label="Kibana Discover">
         <el-switch
           id="generateKibanaDiscoverUrl"
-          v-model="generateKibanaDiscoverUrl"
+          :value="generateKibanaDiscoverUrl"
           :disabled="viewOnly"
           @change="changeGenerateKibanaDiscoverUrl" />
         <label>Kibana Discover application.</label>
@@ -14,9 +14,10 @@
     <el-col v-if="generateKibanaDiscoverUrl" :span="6">
       <el-form-item label="APP URL" prop="kibanaDiscoverAppUrl" required>
         <el-input
-          v-model="kibanaDiscoverAppUrl"
+          :value="kibanaDiscoverAppUrl"
           :disabled="viewOnly"
-          placeholder="http://localhost:5601/app/discover#/" />
+          placeholder="http://localhost:5601/app/discover#/"
+          @input="kibanaDiscoverAppUrl = $event" />
         <label>The url of the Kibana Discover application used to generate the kibana_discover_url variable.</label>
       </el-form-item>
     </el-col>
@@ -41,8 +42,9 @@
     <el-col v-if="generateKibanaDiscoverUrl" :span="6">
       <el-form-item label="Index Pattern Id" prop="kibanaDiscoverIndexPatternId" required>
         <el-input
-          v-model="kibanaDiscoverIndexPatternId"
-          :disabled="viewOnly" />
+          :value="kibanaDiscoverIndexPatternId"
+          :disabled="viewOnly"
+          @input="kibanaDiscoverIndexPatternId = $event" />
         <label>The id of the index pattern to link to in the Kibana Discover application.</label>
       </el-form-item>
     </el-col>
diff --git a/src/components/config/ConfigLimitExcecution.vue b/src/components/config/ConfigLimitExcecution.vue
index 5c2b56df..73093555 100644
--- a/src/components/config/ConfigLimitExcecution.vue
+++ b/src/components/config/ConfigLimitExcecution.vue
@@ -4,7 +4,7 @@
       <el-form-item label="Limit Excecution">
         <el-switch
           id="enableLimitExcecution"
-          v-model="enableLimitExcecution"
+          :value="enableLimitExcecution"
           :disabled="viewOnly"
           @change="changeLimitExcecution" />
         <label>Limit Excecution Setting.</label>
diff --git a/src/components/config/ConfigOwner.vue b/src/components/config/ConfigOwner.vue
index 27d7a7d6..95232ec9 100644
--- a/src/components/config/ConfigOwner.vue
+++ b/src/components/config/ConfigOwner.vue
@@ -3,7 +3,7 @@
     <el-col :span="useOwner ? 6 : 19">
       <el-form-item label="Owner">
         <el-switch
-          v-model="useOwner"
+          :value="useOwner"
           :disabled="viewOnly"
           @change="changeOwner" />
         <label>
@@ -15,7 +15,7 @@
 
     <el-col v-if="useOwner" :span="6">
       <el-form-item label="Owner" prop="configOwner" required>
-        <el-input id="configOwner" v-model="configOwner" :disabled="viewOnly" />
+        <el-input id="configOwner" :value="configOwner" :disabled="viewOnly" @input="configOwner = $event" />
       </el-form-item>
     </el-col>
   </el-row>
@@ -57,11 +57,7 @@ export default {
 
   methods: {
     changeOwner(val) {
-      if (val) {
-        this.useOwner = true;
-      } else {
-        this.useOwner = false;
-      }
+      this.useOwner = val;
     },
   }
 };
diff --git a/src/components/config/ConfigPriority.vue b/src/components/config/ConfigPriority.vue
index 15921709..6eeb519a 100644
--- a/src/components/config/ConfigPriority.vue
+++ b/src/components/config/ConfigPriority.vue
@@ -3,7 +3,7 @@
     <el-col :span="usePriority ? 6 : 19">
       <el-form-item label="Priority">
         <el-switch
-          v-model="usePriority"
+          :value="usePriority"
           :disabled="viewOnly"
           @change="changePriority" />
         <label>
@@ -15,7 +15,7 @@
 
     <el-col v-if="usePriority" :span="6">
       <el-form-item label="Priority" prop="configPriority" required>
-        <el-input-number id="configPriority" v-model="configPriority" :disabled="viewOnly" />
+        <el-input-number id="configPriority" :value="configPriority" :disabled="viewOnly" @input="configPriority = $event" />
       </el-form-item>
     </el-col>
   </el-row>
@@ -57,11 +57,7 @@ export default {
 
   methods: {
     changePriority(val) {
-      if (val) {
-        this.usePriority = true;
-      } else {
-        this.usePriority = false;
-      }
+      this.usePriority = val;
     },
   }
 };
diff --git a/src/components/config/ConfigScanEntireTimeframe.vue b/src/components/config/ConfigScanEntireTimeframe.vue
index 8308f78b..2a140f02 100644
--- a/src/components/config/ConfigScanEntireTimeframe.vue
+++ b/src/components/config/ConfigScanEntireTimeframe.vue
@@ -4,7 +4,7 @@
       <el-form-item label="scan entire timeframe">
         <el-switch
           id="scanEntireTimeframe"
-          v-model="scanEntireTimeframe"
+          :value="scanEntireTimeframe"
           :disabled="viewOnly"
           @change="changeScanEntireTimeframe" />
         <label>
@@ -37,11 +37,7 @@ export default {
 
   methods: {
     changeScanEntireTimeframe(val) {
-      if (val) {
-        this.scanEntireTimeframe = true;
-      } else {
-        this.scanEntireTimeframe = false;
-      }
+      this.scanEntireTimeframe = val;
     }
   }
 };
diff --git a/src/components/config/ConfigTimeWindowFeature.vue b/src/components/config/ConfigTimeWindowFeature.vue
index a422c54b..a02d6d2b 100644
--- a/src/components/config/ConfigTimeWindowFeature.vue
+++ b/src/components/config/ConfigTimeWindowFeature.vue
@@ -3,7 +3,7 @@
     <el-col :span="useTimeWindow ? 6 : 19">
       <el-form-item label="Use Time Window">
         <el-switch
-          v-model="useTimeWindow"
+          :value="useTimeWindow"
           :disabled="viewOnly"
           @change="changeTimeWindow" />
         <label>
diff --git a/src/components/config/alert/ConfigAlertAlerta.vue b/src/components/config/alert/ConfigAlertAlerta.vue
index 668f15e4..37288b9a 100644
--- a/src/components/config/alert/ConfigAlertAlerta.vue
+++ b/src/components/config/alert/ConfigAlertAlerta.vue
@@ -1,12 +1,12 @@
 <template>
   <div>
     <el-form-item label="API URL" prop="alertaApiUrl">
-      <el-input id="alertaApiUrl" v-model="alertaApiUrl" :disabled="viewOnly" />
+      <el-input id="alertaApiUrl" :value="alertaApiUrl" :disabled="viewOnly" @input="alertaApiUrl = $event" />
       <label>API server URL.</label>
     </el-form-item>
 
     <el-form-item label="API Key" prop="alertaApiKey">
-      <el-input id="alertaApiKey" v-model="alertaApiKey" :disabled="viewOnly" />
+      <el-input id="alertaApiKey" :value="alertaApiKey" :disabled="viewOnly" @input="alertaApiKey = $event" />
       <label>
         This is the api key for alerta server, sent in an Authorization HTTP header.
         If not defined, no Authorization header is sent.
@@ -28,12 +28,12 @@
     </el-form-item>
 
     <el-form-item label="Resource" prop="alertaResource">
-      <el-input id="alertaResource" v-model="alertaResource" :disabled="viewOnly" />
+      <el-input id="alertaResource" :value="alertaResource" :disabled="viewOnly" @input="alertaResource = $event" />
       <label>If true and query_key is present, this will override alerta_resource field with the query_key value (Can be useful if query_key is a hostname).</label>
     </el-form-item>
 
     <el-form-item label="Text" prop="alertaText">
-      <el-input id="alertaText" v-model="alertaText" :disabled="viewOnly" />
+      <el-input id="alertaText" :value="alertaText" :disabled="viewOnly" @input="alertaText = $event" />
       <label>
         This is the api key for alerta server, sent in an Authorization HTTP header.
         If not defined, no Authorization header is sent.
@@ -41,12 +41,12 @@
     </el-form-item>
 
     <el-form-item label="Event" prop="alertaEvent">
-      <el-input id="alertaEvent" v-model="alertaEvent" :disabled="viewOnly" />
+      <el-input id="alertaEvent" :value="alertaEvent" :disabled="viewOnly" @input="alertaEvent = $event" />
       <label>Defaults to “elastalert”.</label>
     </el-form-item>
 
     <el-form-item label="Group" prop="alertaGroup">
-      <el-input id="alertaGroup" v-model="alertaGroup" :disabled="viewOnly" />
+      <el-input id="alertaGroup" :value="alertaGroup" :disabled="viewOnly" @input="alertaGroup = $event" />
       <label>Defaults to “”.</label>
     </el-form-item>
 
@@ -102,12 +102,12 @@
     </el-popover>
 
     <el-form-item label="Environment" prop="alertaEnvironment">
-      <el-input id="alertaEnvironment" v-model="alertaEnvironment" :disabled="viewOnly" />
+      <el-input id="alertaEnvironment" :value="alertaEnvironment" :disabled="viewOnly" @input="alertaEnvironment = $event" />
       <label>Defaults to “Production”.</label>
     </el-form-item>
 
     <el-form-item label="Timeout" prop="alertaTimeout">
-      <el-input-number id="alertaTimeout" v-model="alertaTimeout" :disabled="viewOnly" />
+      <el-input-number id="alertaTimeout" :value="alertaTimeout" :disabled="viewOnly" @input="alertaTimeout = $event" />
       <label>
         Defaults 84600 (1 Day).
       </label>
@@ -116,7 +116,7 @@
     <el-form-item label="Use Match Timestamp" prop="alertaUseMatchTimestamp">
       <el-switch
         id="alertaUseMatchTimestamp"
-        v-model="alertaUseMatchTimestamp"
+        :value="alertaUseMatchTimestamp"
         :disabled="viewOnly"
         @change="changeAlertaUseMatchTimestamp" />
     </el-form-item>
@@ -124,7 +124,7 @@
     <el-form-item label="Use Qk As Resource" prop="alertaUseQkAsResource">
       <el-switch
         id="alertaUseQkAsResource"
-        v-model="alertaUseQkAsResource"
+        :value="alertaUseQkAsResource"
         :disabled="viewOnly"
         @change="changeAlertaUseQkAsResource" />
     </el-form-item>
@@ -132,23 +132,23 @@
     <el-form-item label="Api Skip Ssl" prop="alertaApiSkipSsl">
       <el-switch
         id="alertaApiSkipSsl"
-        v-model="alertaApiSkipSsl"
+        :value="alertaApiSkipSsl"
         :disabled="viewOnly"
         @change="changeAlertaApiSkipSsl" />
     </el-form-item>
 
     <el-form-item label="Origin" prop="alertaOrigin">
-      <el-input id="alertaOrigin" v-model="alertaOrigin" :disabled="viewOnly" />
+      <el-input id="alertaOrigin" :value="alertaOrigin" :disabled="viewOnly" @input="alertaOrigin = $event" />
       <label>Defaults to “elastalert”.</label>
     </el-form-item>
 
     <el-form-item label="Value" prop="alertaValue">
-      <el-input id="alertaValue" v-model="alertaValue" :disabled="viewOnly" />
+      <el-input id="alertaValue" :value="alertaValue" :disabled="viewOnly" @input="alertaValue = $event" />
       <label>Defaults to “”.</label>
     </el-form-item>
 
     <el-form-item label="Type" prop="alertaType">
-      <el-input id="alertaType" v-model="alertaType" :disabled="viewOnly" />
+      <el-input id="alertaType" :value="alertaType" :disabled="viewOnly" @input="alertaType = $event" />
       <label>Defaults to “elastalert”.</label>
     </el-form-item>
 
@@ -835,32 +835,20 @@ export default {
     },
 
     changeAlertaUseMatchTimestamp(val) {
-      if (val) {
-        this.alertaUseMatchTimestamp = true;
-      } else {
-        this.alertaUseMatchTimestamp = false;
-      }
+      this.alertaUseMatchTimestamp = val;
     },
 
     changeAlertaUseQkAsResource(val) {
-      if (val) {
-        this.alertaUseQkAsResource = true;
-      } else {
-        this.alertaUseQkAsResource = false;
-      }
+      this.alertaUseQkAsResource = val;
     },
 
     changeAlertaApiSkipSsl(val) {
-      if (val) {
-        this.alertaApiSkipSsl = true;
-      } else {
-        this.alertaApiSkipSsl = false;
-      }
+      this.alertaApiSkipSsl = val;
     },
   }
 };
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 
 </style>
diff --git a/src/components/config/alert/ConfigAlertAlertmanager.vue b/src/components/config/alert/ConfigAlertAlertmanager.vue
index fd98239c..337801a2 100644
--- a/src/components/config/alert/ConfigAlertAlertmanager.vue
+++ b/src/components/config/alert/ConfigAlertAlertmanager.vue
@@ -3,7 +3,7 @@
     <!-- alertmanager_alert_subject_labelname -->
 
     <praeco-form-item label="alert_subject_labelname" prop="alertmanagerAlertSubjectLabelname">
-      <el-input id="alertmanagerAlertSubjectLabelname" v-model="alertmanagerAlertSubjectLabelname" :disabled="viewOnly" />
+      <el-input id="alertmanagerAlertSubjectLabelname" :value="alertmanagerAlertSubjectLabelname" :disabled="viewOnly" @input="alertmanagerAlertSubjectLabelname = $event" />
       <label>
         Rename the annotations label name for alert_subject.
         Default is summary.
@@ -13,7 +13,7 @@
     <!-- alertmanager_alert_text_labelname -->
 
     <praeco-form-item label="alert_text_labelname" prop="alertmanagerAlertTextLabelname">
-      <el-input id="alertmanagerAlertTextLabelname" v-model="alertmanagerAlertTextLabelname" :disabled="viewOnly" />
+      <el-input id="alertmanagerAlertTextLabelname" :value="alertmanagerAlertTextLabelname" :disabled="viewOnly" @input="alertmanagerAlertTextLabelname = $event" />
       <label>
         Rename the annotations label name for alert_text.
         Default is description.
@@ -25,7 +25,7 @@
     <praeco-form-item label="CA Certs" prop="alertmanagerCaCerts">
       <el-switch
         id="alertmanagerCaCerts"
-        v-model="alertmanagerCaCerts"
+        :value="alertmanagerCaCerts"
         :disabled="viewOnly"
         @change="changeAlertmanagerCaCerts" />
     </praeco-form-item>
@@ -35,7 +35,7 @@
     <praeco-form-item label="Ignore SSL Errors" prop="alertmanagerIgnoreSslErrors">
       <el-switch
         id="alertmanagerIgnoreSslErrors"
-        v-model="alertmanagerIgnoreSslErrors"
+        :value="alertmanagerIgnoreSslErrors"
         :disabled="viewOnly"
         @change="changeAlertmanagerIgnoreSslErrors" />
     </praeco-form-item>
@@ -43,7 +43,7 @@
     <!-- alertmanager_timeout -->
 
     <praeco-form-item label="Timeout" prop="alertmanagerTimeout">
-      <el-input-number id="alertmanagerTimeout" v-model="alertmanagerTimeout" :disabled="viewOnly" />
+      <el-input-number id="alertmanagerTimeout" :value="alertmanagerTimeout" :disabled="viewOnly" @input="alertmanagerTimeout = $event" />
       <label>
         You can specify a timeout value, in seconds, for making communicating with Alertmanager.
         The default is 10. If a timeout occurs, the alert will be retried next time ElastAlert 2 cycles.
@@ -53,7 +53,7 @@
     <!-- alertmanager_proxy -->
 
     <praeco-form-item label="Proxy" prop="alertmanagerProxy">
-      <el-input id="alertmanagerProxy" v-model="alertmanagerProxy" :disabled="viewOnly" />
+      <el-input id="alertmanagerProxy" :value="alertmanagerProxy" :disabled="viewOnly" @input="alertmanagerProxy = $event" />
       <label>
         By default ElastAlert 2 will not use a network proxy to send notifications to Alertmanager.
         Set this option using hostname:port if you need to use a proxy.
@@ -63,14 +63,14 @@
     <!-- alertmanager_basic_auth_login -->
 
     <praeco-form-item label="Proxy Login" prop="alertmanagerBasicAuthLogin">
-      <el-input id="alertmanagerBasicAuthLogin" v-model="alertmanagerBasicAuthLogin" :disabled="viewOnly" />
+      <el-input id="alertmanagerBasicAuthLogin" :value="alertmanagerBasicAuthLogin" :disabled="viewOnly" @input="alertmanagerBasicAuthLogin = $event" />
       <label>The Alertmanager proxy auth username.</label>
     </praeco-form-item>
 
     <!-- alertmanager_basic_auth_password -->
 
     <praeco-form-item label="Proxy Password" prop="alertmanagerBasicAuthPassword">
-      <el-input id="alertmanagerBasicAuthPassword" v-model="alertmanagerBasicAuthPassword" :disabled="viewOnly" />
+      <el-input id="alertmanagerBasicAuthPassword" :value="alertmanagerBasicAuthPassword" :disabled="viewOnly" @input="alertmanagerBasicAuthPassword = $event" />
       <label>The Alertmanager proxy auth password.</label>
     </praeco-form-item>
   </div>
@@ -184,27 +184,15 @@ export default {
 
   methods: {
     changeAlertmanagerIgnoreSslErrors(val) {
-      if (val) {
-        this.alertmanagerIgnoreSslErrors = true;
-      } else {
-        this.alertmanagerIgnoreSslErrors = false;
-      }
+      this.alertmanagerIgnoreSslErrors = val;
     },
 
     changeAlertmanagerAttachKibanaDiscoverUrl(val) {
-      if (val) {
-        this.alertmanagerAttachKibanaDiscoverUrl = true;
-      } else {
-        this.alertmanagerAttachKibanaDiscoverUrl = false;
-      }
+      this.alertmanagerAttachKibanaDiscoverUrl = val;
     },
 
     changeAlertmanagerCaCerts(val) {
-      if (val) {
-        this.alertmanagerCaCerts = true;
-      } else {
-        this.alertmanagerCaCerts = false;
-      }
+      this.alertmanagerCaCerts = val;
     }
   }
 };
diff --git a/src/components/config/alert/ConfigAlertAmazonSes.vue b/src/components/config/alert/ConfigAlertAmazonSes.vue
index effa34ca..cd5a00d4 100644
--- a/src/components/config/alert/ConfigAlertAmazonSes.vue
+++ b/src/components/config/alert/ConfigAlertAmazonSes.vue
@@ -9,21 +9,21 @@
 
     <div v-if="groupSes === 'notProfile'">
       <praeco-form-item label="SesAwsAccessKeyId" prop="sesAwsAccessKeyId" required>
-        <el-input id="sesAwsAccessKeyId" v-model="sesAwsAccessKeyId" :disabled="viewOnly" />
+        <el-input id="sesAwsAccessKeyId" :value="sesAwsAccessKeyId" :disabled="viewOnly" @input="sesAwsAccessKeyId = $event" />
         <label>An access key to connect to Amazon SES with.</label>
       </praeco-form-item>
       <praeco-form-item label="SesAwsSecretAccessKey" prop="sesAwsSecretAccessKey" required>
-        <el-input id="sesAwsSecretAccessKey" v-model="sesAwsSecretAccessKey" :disabled="viewOnly" />
+        <el-input id="sesAwsSecretAccessKey" :value="sesAwsSecretAccessKey" :disabled="viewOnly" @input="sesAwsSecretAccessKey = $event" />
         <label>The secret key associated with the access key.</label>
       </praeco-form-item>
       <praeco-form-item label="SesAwsRegion" prop="sesAwsRegion" required>
-        <el-input id="sesAwsRegion" v-model="sesAwsRegion" :disabled="viewOnly" />
+        <el-input id="sesAwsRegion" :value="sesAwsRegion" :disabled="viewOnly" @input="sesAwsRegion = $event" />
         <label>The AWS region in which the Amazon SES resource is located. For example, us-east-1</label>
       </praeco-form-item>
     </div>
     <div v-if="groupSes === 'profile'">
       <praeco-form-item label="SesAwsProfile" prop="sesAwsProfile" required>
-        <el-input id="sesAwsProfile" v-model="sesAwsProfile" :disabled="viewOnly" />
+        <el-input id="sesAwsProfile" :value="sesAwsProfile" :disabled="viewOnly" @input="sesAwsProfile = $event" />
         <label>The AWS profile to use. If none specified, the default will be used.</label>
       </praeco-form-item>
     </div>
@@ -33,7 +33,7 @@
       :value="sesFromAddr"
       label="From address"
       prop="sesFromAddr">
-      <el-input v-model="sesFromAddr" :disabled="viewOnly" />
+      <el-input :value="sesFromAddr" :disabled="viewOnly" @input="sesFromAddr = $event" />
       <label>
         This sets the From header in the email.
         By default, the from address is ElastAlert2@
@@ -46,7 +46,7 @@
       :value="sesEmailReplyTo"
       label="Reply to"
       prop="sesEmailReplyTo">
-      <el-input v-model="sesEmailReplyTo" :disabled="viewOnly" />
+      <el-input :value="sesEmailReplyTo" :disabled="viewOnly" @input="sesEmailReplyTo = $event" />
       <label>
         This sets the Reply-To header in the email.
         By default, the from address is ElastAlert2@ and the
@@ -55,26 +55,26 @@
     </praeco-form-item>
 
     <el-form-item label="To" prop="sesEmail" required>
-      <el-input v-model="sesEmail" :disabled="viewOnly" />
+      <el-input :value="sesEmail" :disabled="viewOnly" @input="sesEmail = $event" />
       <label>Comma separated list of email addresses</label>
     </el-form-item>
 
     <el-form-item v-if="!viewOnly || sesCc" label="CC" prop="sesCc">
-      <el-input v-model="sesCc" :disabled="viewOnly" />
+      <el-input :value="sesCc" :disabled="viewOnly" @input="sesCc = $event" />
       <label>Comma separated list of email addresses</label>
     </el-form-item>
 
     <el-form-item v-if="!viewOnly || sesBcc" label="BCC" prop="sesBcc">
-      <el-input v-model="sesBcc" :disabled="viewOnly" />
+      <el-input :value="sesBcc" :disabled="viewOnly" @input="sesBcc = $event" />
       <label>Comma separated list of email addresses</label>
     </el-form-item>
 
     <el-form-item label="Email From Field" prop="sesEmailFromField">
-      <el-input v-model="sesEmailFromField" :disabled="viewOnly" />
+      <el-input :value="sesEmailFromField" :disabled="viewOnly" @input="sesEmailFromField = $event" />
     </el-form-item>
 
     <el-form-item label="Email Add Domain" prop="sesEmailAddDomain">
-      <el-input v-model="sesEmailAddDomain" :disabled="viewOnly" />
+      <el-input :value="sesEmailAddDomain" :disabled="viewOnly" @input="sesEmailAddDomain = $event" />
     </el-form-item>
   </div>
 </template>
@@ -217,6 +217,6 @@ export default {
 };
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 
 </style>
diff --git a/src/components/config/alert/ConfigAlertAmazonSns.vue b/src/components/config/alert/ConfigAlertAmazonSns.vue
index 5de7b994..ea4ba624 100644
--- a/src/components/config/alert/ConfigAlertAmazonSns.vue
+++ b/src/components/config/alert/ConfigAlertAmazonSns.vue
@@ -9,29 +9,29 @@
 
     <div v-if="groupSns === 'notProfile'">
       <praeco-form-item label="TopicArn" prop="snsTopicArn" required>
-        <el-input id="snsTopicArn" v-model="snsTopicArn" :disabled="viewOnly" />
+        <el-input id="snsTopicArn" :value="snsTopicArn" :disabled="viewOnly" @input="snsTopicArn = $event" />
         <label>The SNS topic’s ARN. For example, arn:aws:sns:us-east-1:123456789:somesnstopic</label>
       </praeco-form-item>
       <praeco-form-item label="SnsAwsAccessKeyId" prop="snsAwsAccessKeyId" required>
-        <el-input id="snsAwsAccessKeyId" v-model="snsAwsAccessKeyId" :disabled="viewOnly" />
+        <el-input id="snsAwsAccessKeyId" :value="snsAwsAccessKeyId" :disabled="viewOnly" @input="snsAwsAccessKeyId = $event" />
         <label>An access key to connect to Amazon SNS with.</label>
       </praeco-form-item>
       <praeco-form-item label="SnsAwsSecretAccessKey" prop="snsAwsSecretAccessKey" required>
-        <el-input id="snsAwsSecretAccessKey" v-model="snsAwsSecretAccessKey" :disabled="viewOnly" />
+        <el-input id="snsAwsSecretAccessKey" :value="snsAwsSecretAccessKey" :disabled="viewOnly" @input="snsAwsSecretAccessKey = $event" />
         <label>The secret key associated with the access key.</label>
       </praeco-form-item>
       <praeco-form-item label="SnsAwsRegion" prop="snsAwsRegion" required>
-        <el-input id="snsAwsRegion" v-model="snsAwsRegion" :disabled="viewOnly" />
+        <el-input id="snsAwsRegion" :value="snsAwsRegion" :disabled="viewOnly" @input="snsAwsRegion = $event" />
         <label>The AWS region in which the Amazon SNS resource is located. For example, us-east-1</label>
       </praeco-form-item>
     </div>
     <div v-if="groupSns === 'profile'">
       <praeco-form-item label="TopicArn" prop="snsTopicArn" required>
-        <el-input id="snsTopicArn" v-model="snsTopicArn" :disabled="viewOnly" />
+        <el-input id="snsTopicArn" :value="snsTopicArn" :disabled="viewOnly" @input="snsTopicArn = $event" />
         <label>The Amazon SNS topic’s ARN. For example, arn:aws:sns:us-east-1:123456789:somesnstopic</label>
       </praeco-form-item>
       <praeco-form-item label="SnsAwsProfile" prop="snsAwsProfile" required>
-        <el-input id="snsAwsProfile" v-model="snsAwsProfile" :disabled="viewOnly" />
+        <el-input id="snsAwsProfile" :value="snsAwsProfile" :disabled="viewOnly" @input="snsAwsProfile = $event" />
         <label>The AWS profile to use. If none specified, the default will be used.</label>
       </praeco-form-item>
     </div>
@@ -126,6 +126,6 @@ export default {
 };
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 
 </style>
diff --git a/src/components/config/alert/ConfigAlertChatwork.vue b/src/components/config/alert/ConfigAlertChatwork.vue
index 79b02735..737b7410 100644
--- a/src/components/config/alert/ConfigAlertChatwork.vue
+++ b/src/components/config/alert/ConfigAlertChatwork.vue
@@ -1,12 +1,12 @@
 <template>
   <div>
     <praeco-form-item label="Api Key" prop="chatworkApikey" required>
-      <el-input id="chatworkApikey" v-model="chatworkApikey" :disabled="viewOnly" />
+      <el-input id="chatworkApikey" :value="chatworkApikey" :disabled="viewOnly" @input="chatworkApikey = $event" />
       <label>ChatWork API KEY.</label>
     </praeco-form-item>
 
     <praeco-form-item label="Room Id" prop="chatworkRoomId" required>
-      <el-input id="chatworkRoomId" v-model="chatworkRoomId" :disabled="viewOnly" />
+      <el-input id="chatworkRoomId" :value="chatworkRoomId" :disabled="viewOnly" @input="chatworkRoomId = $event" />
       <label>
         The ID of the room you are talking to in Chatwork.
         How to find the room ID is the part of the number after "rid" at the end of the URL of the browser.
@@ -14,7 +14,7 @@
     </praeco-form-item>
 
     <praeco-form-item label="Proxy" prop="chatworkProxy">
-      <el-input id="chatworkProxy" v-model="chatworkProxy" :disabled="viewOnly" />
+      <el-input id="chatworkProxy" :value="chatworkProxy" :disabled="viewOnly" @input="chatworkProxy = $event" />
       <label>
         By default ElastAlert 2 will not use a network proxy to send notifications to chatwork.
         Set this option using hostname:port if you need to use a proxy.
@@ -22,12 +22,12 @@
     </praeco-form-item>
 
     <praeco-form-item label="Proxy Login" prop="chatworkProxyLogin">
-      <el-input id="chatworkProxyLogin" v-model="chatworkProxyLogin" :disabled="viewOnly" />
+      <el-input id="chatworkProxyLogin" :value="chatworkProxyLogin" :disabled="viewOnly" @input="chatworkProxyLogin = $event" />
       <label>The chatwork proxy auth username.</label>
     </praeco-form-item>
 
     <praeco-form-item label="Proxy Password" prop="chatworkProxyPass">
-      <el-input id="chatworkProxyPass" v-model="chatworkProxyPass" :disabled="viewOnly" />
+      <el-input id="chatworkProxyPass" :value="chatworkProxyPass" :disabled="viewOnly" @input="chatworkProxyPass = $event" />
       <label>The chatwork proxy auth password.</label>
     </praeco-form-item>
   </div>
@@ -104,6 +104,6 @@ export default {
 };
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 
 </style>
diff --git a/src/components/config/alert/ConfigAlertCommand.vue b/src/components/config/alert/ConfigAlertCommand.vue
index e1369664..742552f6 100644
--- a/src/components/config/alert/ConfigAlertCommand.vue
+++ b/src/components/config/alert/ConfigAlertCommand.vue
@@ -54,7 +54,7 @@
     <el-form-item label="Pipe Match Json" prop="pipeMatchJson">
       <el-switch
         id="pipeMatchJson"
-        v-model="pipeMatchJson"
+        :value="pipeMatchJson"
         :disabled="viewOnly"
         @change="changePipeMatchJson" />
       <label>
@@ -66,7 +66,7 @@
     <el-form-item label="Pipe Alert Text" prop="pipeAlertText">
       <el-switch
         id="pipeAlertText"
-        v-model="pipeAlertText"
+        :value="pipeAlertText"
         :disabled="viewOnly"
         @change="changePipeAlertText" />
       <label>
@@ -79,7 +79,7 @@
     <el-form-item label="fail_on_non_zero_exit" prop="failOnNonZeroExit">
       <el-switch
         id="failOnNonZeroExit"
-        v-model="failOnNonZeroExit"
+        :value="failOnNonZeroExit"
         :disabled="viewOnly"
         @change="changeFailOnNonZeroExit" />
       <label>
@@ -154,27 +154,15 @@ export default {
 
   methods: {
     changePipeMatchJson(val) {
-      if (val) {
-        this.pipeMatchJson = true;
-      } else {
-        this.pipeMatchJson = false;
-      }
+      this.pipeMatchJson = val;
     },
 
     changePipeAlertText(val) {
-      if (val) {
-        this.pipeAlertText = true;
-      } else {
-        this.pipeAlertText = false;
-      }
+      this.pipeAlertText = val;
     },
 
     changeFailOnNonZeroExit(val) {
-      if (val) {
-        this.failOnNonZeroExit = true;
-      } else {
-        this.failOnNonZeroExit = false;
-      }
+      this.failOnNonZeroExit = val;
     },
 
     async validate() {
@@ -231,6 +219,6 @@ export default {
 };
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 
 </style>
diff --git a/src/components/config/alert/ConfigAlertDatadog.vue b/src/components/config/alert/ConfigAlertDatadog.vue
index b87d9b6c..0c9f691b 100644
--- a/src/components/config/alert/ConfigAlertDatadog.vue
+++ b/src/components/config/alert/ConfigAlertDatadog.vue
@@ -1,12 +1,12 @@
 <template>
   <div>
     <el-form-item label="API KEY" prop="datadogApiKey" required>
-      <el-input id="datadogApiKey" v-model="datadogApiKey" :disabled="viewOnly" />
+      <el-input id="datadogApiKey" :value="datadogApiKey" :disabled="viewOnly" @input="datadogApiKey = $event" />
       <label>Datadog API key.</label>
     </el-form-item>
 
     <el-form-item label="APP KEY" prop="datadogAppKey" required>
-      <el-input id="datadogAppKey" v-model="datadogAppKey" :disabled="viewOnly" />
+      <el-input id="datadogAppKey" :value="datadogAppKey" :disabled="viewOnly" @input="datadogAppKey = $event" />
       <label>Datadog application key.</label>
     </el-form-item>
   </div>
@@ -42,6 +42,6 @@ export default {
 };
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 
 </style>
diff --git a/src/components/config/alert/ConfigAlertDingtalk.vue b/src/components/config/alert/ConfigAlertDingtalk.vue
index d7714419..2041196e 100644
--- a/src/components/config/alert/ConfigAlertDingtalk.vue
+++ b/src/components/config/alert/ConfigAlertDingtalk.vue
@@ -18,7 +18,7 @@
     <!-- dingtalk_access_token -->
 
     <praeco-form-item label="Access Token" prop="dingtalkAccessToken">
-      <el-input id="dingtalkAccessToken" v-model="dingtalkAccessToken" :disabled="viewOnly" />
+      <el-input id="dingtalkAccessToken" :value="dingtalkAccessToken" :disabled="viewOnly" @input="dingtalkAccessToken = $event" />
       <label>
         Dingtalk access token.
       </label>
@@ -28,7 +28,7 @@
       <!-- dingtalk_single_title -->
 
       <praeco-form-item label="Single Title" prop="dingtalkSingleTitle" required>
-        <el-input id="dingtalkSingleTitle" v-model="dingtalkSingleTitle" :disabled="viewOnly" />
+        <el-input id="dingtalkSingleTitle" :value="dingtalkSingleTitle" :disabled="viewOnly" @input="dingtalkSingleTitle = $event" />
         <label>
           The title of a single button.
         </label>
@@ -37,7 +37,7 @@
       <!-- dingtalk_single_url -->
 
       <praeco-form-item label="Single URL" prop="dingtalkSingleUrl">
-        <el-input id="dingtalkSingleUrl" v-model="dingtalkSingleUrl" :disabled="viewOnly" />
+        <el-input id="dingtalkSingleUrl" :value="dingtalkSingleUrl" :disabled="viewOnly" @input="dingtalkSingleUrl = $event" />
         <label>
           Jump link for a single button.
         </label>
@@ -47,7 +47,7 @@
     <div v-if="groupDingtalk === 'action_card'">
       <!-- dingtalk_btn_orientation -->
       <praeco-form-item label="Msg Type" prop="dingtalkBtnOrientation" required>
-        <el-radio-group v-model="dingtalkBtnOrientation" :disabled="viewOnly">
+        <el-radio-group :value="dingtalkBtnOrientation" :disabled="viewOnly" @input="dingtalkBtnOrientation = $event">
           <el-radio id="dingtalkBtnOrientation0" label="0">
             Buttons are arranged vertically
           </el-radio><br>
@@ -130,6 +130,6 @@ export default {
 };
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 
 </style>
diff --git a/src/components/config/alert/ConfigAlertDiscord.vue b/src/components/config/alert/ConfigAlertDiscord.vue
index 4e91febe..496b676d 100644
--- a/src/components/config/alert/ConfigAlertDiscord.vue
+++ b/src/components/config/alert/ConfigAlertDiscord.vue
@@ -1,7 +1,7 @@
 <template>
   <div>
     <praeco-form-item label="WebhookURL" prop="discordWebhookUrl">
-      <el-input id="discordWebhookUrl" v-model="discordWebhookUrl" :disabled="viewOnly" />
+      <el-input id="discordWebhookUrl" :value="discordWebhookUrl" :disabled="viewOnly" @input="discordWebhookUrl = $event" />
       <label>The webhook URL.</label>
     </praeco-form-item>
 
@@ -26,12 +26,12 @@
     </div>
 
     <praeco-form-item label="Discord Embed Footer" prop="discordEmbedFooter">
-      <el-input id="discordEmbedFooter" v-model="discordEmbedFooter" :disabled="viewOnly" />
+      <el-input id="discordEmbedFooter" :value="discordEmbedFooter" :disabled="viewOnly" @input="discordEmbedFooter = $event" />
       <label>embed footer.</label>
     </praeco-form-item>
 
     <praeco-form-item label="Embed IconUrl" prop="discordEmbedIconUrl">
-      <el-input id="discordEmbedIconUrl" v-model="discordEmbedIconUrl" :disabled="viewOnly" />
+      <el-input id="discordEmbedIconUrl" :value="discordEmbedIconUrl" :disabled="viewOnly" @input="discordEmbedIconUrl = $event" />
       <label>
         You can provide icon_url to use custom image.
         Provide absolute address of the pciture.(exampmle : http://domain/picure.png)
@@ -39,7 +39,7 @@
     </praeco-form-item>
 
     <praeco-form-item label="Proxy" prop="discordProxy">
-      <el-input id="discordProxy" v-model="discordProxy" :disabled="viewOnly" />
+      <el-input id="discordProxy" :value="discordProxy" :disabled="viewOnly" @input="discordProxy = $event" />
       <label>
         By default ElastAlert 2 will not use a network proxy to send notifications to Discord.
         Set this option using hostname:port if you need to use a proxy.
@@ -47,12 +47,12 @@
     </praeco-form-item>
 
     <praeco-form-item label="Proxy Login" prop="discordProxyLogin">
-      <el-input id="discordProxyLogin" v-model="discordProxyLogin" :disabled="viewOnly" />
+      <el-input id="discordProxyLogin" :value="discordProxyLogin" :disabled="viewOnly" @input="discordProxyLogin = $event" />
       <label>The Discord proxy auth username.</label>
     </praeco-form-item>
 
     <praeco-form-item label="Proxy Password" prop="discordProxyPassword">
-      <el-input id="discordProxyPassword" v-model="discordProxyPassword" :disabled="viewOnly" />
+      <el-input id="discordProxyPassword" :value="discordProxyPassword" :disabled="viewOnly" @input="discordProxyPassword = $event" />
       <label>The Discord proxy auth password.</label>
     </praeco-form-item>
   </div>
@@ -172,7 +172,7 @@ export default {
 };
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 .disabled {
   .emoji-mart {
     height: auto !important;
diff --git a/src/components/config/alert/ConfigAlertEmail.vue b/src/components/config/alert/ConfigAlertEmail.vue
index 34f442b4..48550ab9 100644
--- a/src/components/config/alert/ConfigAlertEmail.vue
+++ b/src/components/config/alert/ConfigAlertEmail.vue
@@ -5,7 +5,7 @@
       :value="fromAddr"
       label="From address"
       prop="fromAddr">
-      <el-input v-model="fromAddr" :disabled="viewOnly" />
+      <el-input :value="fromAddr" :disabled="viewOnly" @input="fromAddr = $event" />
       <label>
         This sets the From header in the email.
         By default, the from address is ElastAlert2@
@@ -18,7 +18,7 @@
       :value="replyTo"
       label="Reply to"
       prop="replyTo">
-      <el-input v-model="replyTo" :disabled="viewOnly" />
+      <el-input :value="replyTo" :disabled="viewOnly" @input="replyTo = $event" />
       <label>
         This sets the Reply-To header in the email.
         By default, the from address is ElastAlert2@ and the
@@ -27,24 +27,24 @@
     </praeco-form-item>
 
     <el-form-item label="To" prop="email" required>
-      <el-input v-model="email" :disabled="viewOnly" />
+      <el-input :value="email" :disabled="viewOnly" @input="email = $event" />
       <label>Comma separated list of email addresses</label>
     </el-form-item>
 
     <el-form-item v-if="!viewOnly || cc" label="CC" prop="cc">
-      <el-input v-model="cc" :disabled="viewOnly" />
+      <el-input :value="cc" :disabled="viewOnly" @input="cc = $event" />
       <label>Comma separated list of email addresses</label>
     </el-form-item>
 
     <el-form-item v-if="!viewOnly || bcc" label="BCC" prop="bcc">
-      <el-input v-model="bcc" :disabled="viewOnly" />
+      <el-input :value="bcc" :disabled="viewOnly" @input="bcc = $event" />
       <label>Comma separated list of email addresses</label>
     </el-form-item>
 
     <el-form-item label="SMTP SSL" prop="smtpSsl">
       <el-switch
         id="smtpSsl"
-        v-model="smtpSsl"
+        :value="smtpSsl"
         :disabled="viewOnly"
         @change="changeSmtpSsl" />
       <label>
@@ -54,17 +54,17 @@
     </el-form-item>
 
     <el-form-item label="SMTP Host" prop="smtpHost">
-      <el-input v-model="smtpHost" :disabled="viewOnly" />
+      <el-input :value="smtpHost" :disabled="viewOnly" @input="smtpHost = $event" />
       <label>The SMTP host to use, defaults to localhost.</label>
     </el-form-item>
 
     <el-form-item label="SMTP Port" prop="smtpPort">
-      <el-input-number id="smtpPort" v-model="smtpPort" :disabled="viewOnly" />
+      <el-input-number id="smtpPort" :value="smtpPort" :disabled="viewOnly" @input="smtpPort = $event" />
       <label>The port to use. Default is 25.</label>
     </el-form-item>
 
     <el-form-item label="SMTP Auth File" prop="smtpAuthFile">
-      <el-input v-model="smtpAuthFile" :disabled="viewOnly" />
+      <el-input :value="smtpAuthFile" :disabled="viewOnly" @input="smtpAuthFile = $event" />
       <label>
         The path to a file which contains SMTP authentication credentials.
         The path can be either absolute or relative to the given rule.
@@ -74,21 +74,21 @@
     </el-form-item>
 
     <el-form-item label="SMTP Key File" prop="smtpKeyFile">
-      <el-input v-model="smtpKeyFile" :disabled="viewOnly" />
+      <el-input :value="smtpKeyFile" :disabled="viewOnly" @input="smtpKeyFile = $event" />
       <label>Connect the SMTP host using the given path to a TLS key file, default to None.</label>
     </el-form-item>
 
     <el-form-item label="SMTP Cert File" prop="smtpCertFile">
-      <el-input v-model="smtpCertFile" :disabled="viewOnly" />
+      <el-input :value="smtpCertFile" :disabled="viewOnly" @input="smtpCertFile = $event" />
       <label> Connect the SMTP host using the given path to a TLS certificate file, default to None.</label>
     </el-form-item>
 
     <el-form-item label="Email From Field" prop="emailFromField">
-      <el-input v-model="emailFromField" :disabled="viewOnly" />
+      <el-input :value="emailFromField" :disabled="viewOnly" @input="emailFromField = $event" />
     </el-form-item>
 
     <el-form-item label="Email Add Domain" prop="emailAddDomain">
-      <el-input v-model="emailAddDomain" :disabled="viewOnly" />
+      <el-input :value="emailAddDomain" :disabled="viewOnly" @input="emailAddDomain = $event" />
     </el-form-item>
   </div>
 </template>
@@ -285,16 +285,12 @@ export default {
 
   methods: {
     changeSmtpSsl(val) {
-      if (val) {
-        this.smtpSsl = true;
-      } else {
-        this.smtpSsl = false;
-      }
+      this.smtpSsl = val;
     }
   }
 };
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 
 </style>
diff --git a/src/components/config/alert/ConfigAlertExotel.vue b/src/components/config/alert/ConfigAlertExotel.vue
index 6621ac4e..1fe3e0be 100644
--- a/src/components/config/alert/ConfigAlertExotel.vue
+++ b/src/components/config/alert/ConfigAlertExotel.vue
@@ -1,27 +1,27 @@
 .<template>
   <div>
     <praeco-form-item label="Account Sid" prop="exotelAccountSid" required>
-      <el-input id="exotelAccountSid" v-model="exotelAccountSid" :disabled="viewOnly" />
+      <el-input id="exotelAccountSid" :value="exotelAccountSid" :disabled="viewOnly" @input="exotelAccountSid = $event" />
       <label>This is sid of your Exotel account.</label>
     </praeco-form-item>
 
     <praeco-form-item label="Auth Token" prop="exotelAuthToken" required>
-      <el-input id="exotelAuthToken" v-model="exotelAuthToken" :disabled="viewOnly" />
+      <el-input id="exotelAuthToken" :value="exotelAuthToken" :disabled="viewOnly" @input="exotelAuthToken = $event" />
       <label>Auth token assosiated with your Exotel account.</label>
     </praeco-form-item>
 
     <praeco-form-item label="Number" prop="exotelToNumber" required>
-      <el-input id="exotelToNumber" v-model="exotelToNumber" :disabled="viewOnly" />
+      <el-input id="exotelToNumber" :value="exotelToNumber" :disabled="viewOnly" @input="exotelToNumber = $event" />
       <label>The phone number where you would like send the notification.</label>
     </praeco-form-item>
 
     <praeco-form-item label="From Number" prop="exotelFromNumber" required>
-      <el-input id="exotelFromNumber" v-model="exotelFromNumber" :disabled="viewOnly" />
+      <el-input id="exotelFromNumber" :value="exotelFromNumber" :disabled="viewOnly" @input="exotelFromNumber = $event" />
       <label>Your exophone number from which message will be sent.</label>
     </praeco-form-item>
 
     <praeco-form-item label="Message Body" prop="exotelMessageBody">
-      <el-input id="exotelMessageBody" v-model="exotelMessageBody" :disabled="viewOnly" />
+      <el-input id="exotelMessageBody" :value="exotelMessageBody" :disabled="viewOnly" @input="exotelMessageBody = $event" />
       <label>Message you want to send in the sms, is you don’t specify this argument only the rule name is sent</label>
     </praeco-form-item>
   </div>
@@ -98,6 +98,6 @@ export default {
 };
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 
 </style>
diff --git a/src/components/config/alert/ConfigAlertGelf.vue b/src/components/config/alert/ConfigAlertGelf.vue
index b40483f0..79a771c9 100644
--- a/src/components/config/alert/ConfigAlertGelf.vue
+++ b/src/components/config/alert/ConfigAlertGelf.vue
@@ -1,7 +1,7 @@
 <template>
   <div>
     <praeco-form-item label="Type" prop="gelfType" required>
-      <el-radio-group v-model="gelfType" :disabled="viewOnly">
+      <el-radio-group :value="gelfType" :disabled="viewOnly" @input="gelfType = $event">
         <el-radio id="gelfTypeHttp" label="http" border>
           http
         </el-radio>
@@ -13,14 +13,14 @@
 
     <div v-if="gelfType === 'http'">
       <praeco-form-item label="EndPoint" prop="gelfEndpoint">
-        <el-input id="gelfEndpoint" v-model="gelfEndpoint" :disabled="viewOnly" />
+        <el-input id="gelfEndpoint" :value="gelfEndpoint" :disabled="viewOnly" @input="gelfEndpoint = $event" />
         <label>Link to GELF HTTP Input as an example: ‘http://example.com/gelf'</label>
       </praeco-form-item>
 
       <praeco-form-item label="Ignore SSL Errors" prop="gelfHttpIgnoreSslErrors">
         <el-switch
           id="gelfHttpIgnoreSslErrors"
-          v-model="gelfHttpIgnoreSslErrors"
+          :value="gelfHttpIgnoreSslErrors"
           :disabled="viewOnly"
           @change="changeGelfHttpIgnoreSslErrors" />
       </praeco-form-item>
@@ -28,28 +28,28 @@
 
     <div v-if="gelfType === 'tcp'">
       <praeco-form-item label="Host" prop="gelfHost" required>
-        <el-input id="gelfHost" v-model="gelfHost" :disabled="viewOnly" />
+        <el-input id="gelfHost" :value="gelfHost" :disabled="viewOnly" @input="gelfHost = $event" />
         <label>Graylog server address where Input launched.</label>
       </praeco-form-item>
 
       <praeco-form-item label="Port" prop="gelfPort" required>
-        <el-input-number id="gelfPort" v-model="gelfPort" :disabled="viewOnly" />
+        <el-input-number id="gelfPort" :value="gelfPort" :disabled="viewOnly" @input="gelfPort = $event" />
         <label>Port, specified for Input.</label>
       </praeco-form-item>
     </div>
 
     <praeco-form-item label="LogLevel" prop="gelfLogLevel">
-      <el-input-number id="gelfLogLevel" v-model="gelfLogLevel" :disabled="viewOnly" :min="0" :max="7" />
+      <el-input-number id="gelfLogLevel" :value="gelfLogLevel" :disabled="viewOnly" :min="0" :max="7" @input="gelfLogLevel = $event" />
       <label>Standard syslog severity levels. </label>
     </praeco-form-item>
 
     <praeco-form-item label="CaCert" prop="gelfCaCert">
-      <el-input id="gelfCaCert" v-model="gelfCaCert" :disabled="viewOnly" />
+      <el-input id="gelfCaCert" :value="gelfCaCert" :disabled="viewOnly" @input="gelfCaCert = $event" />
       <label>Path to custom CA certificate.</label>
     </praeco-form-item>
 
     <praeco-form-item label="TimeOut" prop="gelfTimeout">
-      <el-input-number id="gelfTimeout" v-model="gelfTimeout" :disabled="viewOnly" />
+      <el-input-number id="gelfTimeout" :value="gelfTimeout" :disabled="viewOnly" @input="gelfTimeout = $event" />
       <label>Custom timeout.</label>
     </praeco-form-item>
   </div>
@@ -157,15 +157,11 @@ export default {
   },
   methods: {
     changeGelfHttpIgnoreSslErrors(val) {
-      if (val) {
-        this.gelfHttpIgnoreSslErrors = true;
-      } else {
-        this.gelfHttpIgnoreSslErrors = false;
-      }
+      this.gelfHttpIgnoreSslErrors = val;
     },
   }
 };
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 </style>
diff --git a/src/components/config/alert/ConfigAlertGitter.vue b/src/components/config/alert/ConfigAlertGitter.vue
index d9926a58..85285e2b 100644
--- a/src/components/config/alert/ConfigAlertGitter.vue
+++ b/src/components/config/alert/ConfigAlertGitter.vue
@@ -1,7 +1,7 @@
 <template>
   <div>
     <praeco-form-item label="Webhook URL" prop="gitterWebhookUrl">
-      <el-input id="gitterWebhookUrl" v-model="gitterWebhookUrl" :disabled="viewOnly" />
+      <el-input id="gitterWebhookUrl" :value="gitterWebhookUrl" :disabled="viewOnly" @input="gitterWebhookUrl = $event" />
       <label>
         The webhook URL that includes your auth data and the ID of the channel (room) you want to post to.
         Go to the Integration Settings of the channel: (example  https://gitter.im/ORGA/CHANNEL#integrations ) ,
@@ -10,7 +10,7 @@
     </praeco-form-item>
 
     <praeco-form-item label="Message level" prop="gitterMsgLevel" required>
-      <el-radio-group v-model="gitterMsgLevel" :disabled="viewOnly">
+      <el-radio-group :value="gitterMsgLevel" :disabled="viewOnly" @input="gitterMsgLevel = $event">
         <el-radio id="gitterMsgLevelError" label="error" border class="gitter-error">
           Error
         </el-radio>
@@ -21,7 +21,7 @@
     </praeco-form-item>
 
     <praeco-form-item label="Proxy" prop="gitterProxy">
-      <el-input id="gitterProxy" v-model="gitterProxy" :disabled="viewOnly" />
+      <el-input id="gitterProxy" :value="gitterProxy" :disabled="viewOnly" @input="gitterProxy = $event" />
       <label>
         By default ElastAlert 2 will not use a network proxy to send notifications to Gitter.
         Set this option using hostname:port if you need to use a proxy.
@@ -71,7 +71,7 @@ export default {
 };
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 :not(.is-disabled) {
   &.gitter-error .el-radio__inner:hover {
     border-color: red;
diff --git a/src/components/config/alert/ConfigAlertGoogleChat.vue b/src/components/config/alert/ConfigAlertGoogleChat.vue
index e05f99c6..72d0c801 100644
--- a/src/components/config/alert/ConfigAlertGoogleChat.vue
+++ b/src/components/config/alert/ConfigAlertGoogleChat.vue
@@ -51,7 +51,7 @@
     </el-popover>
 
     <praeco-form-item label="GoogleChat Format" prop="googleChatFormat" required>
-      <el-radio-group v-model="googleChatFormat" :disabled="viewOnly">
+      <el-radio-group :value="googleChatFormat" :disabled="viewOnly" @input="googleChatFormat = $event">
         <el-radio id="googleChatFormatBasic" label="basic" border>
           basic
         </el-radio>
@@ -63,28 +63,28 @@
 
     <div v-if="googleChatFormat === 'card'">
       <praeco-form-item label="Header Title" prop="googleChatHeaderTitle">
-        <el-input id="googleChatHeaderTitle" v-model="googleChatHeaderTitle" :disabled="viewOnly" />
+        <el-input id="googleChatHeaderTitle" :value="googleChatHeaderTitle" :disabled="viewOnly" @input="googleChatHeaderTitle = $event" />
         <label>GoogleChat Header Title</label>
       </praeco-form-item>
 
       <praeco-form-item label="Header Subtitle" prop="googleChatHeaderSubtitle">
-        <el-input id="googleChatHeaderSubtitle" v-model="googleChatHeaderSubtitle" :disabled="viewOnly" />
+        <el-input id="googleChatHeaderSubtitle" :value="googleChatHeaderSubtitle" :disabled="viewOnly" @input="googleChatHeaderSubtitle = $event" />
         <label>Sets the text for the card header subtitle.</label>
       </praeco-form-item>
 
       <praeco-form-item label="Header Image" prop="googleChatHeaderImage">
-        <el-input id="googleChatHeaderImage" v-model="googleChatHeaderImage" :disabled="viewOnly" />
+        <el-input id="googleChatHeaderImage" :value="googleChatHeaderImage" :disabled="viewOnly" @input="googleChatHeaderImage = $event" />
         <label>URL for the card header icon.</label>
       </praeco-form-item>
 
       <praeco-form-item label="Footer Kibanalink" prop="googleFooterKibanalink">
-        <el-input id="googleFooterKibanalink" v-model="googleFooterKibanalink" :disabled="viewOnly" />
+        <el-input id="googleFooterKibanalink" :value="googleFooterKibanalink" :disabled="viewOnly" @input="googleFooterKibanalink = $event" />
         <label>URL to Kibana to include in the card footer.</label>
       </praeco-form-item>
     </div>
 
     <praeco-form-item label="Proxy" prop="googleChatProxy">
-      <el-input id="googleChatProxy" v-model="googleChatProxy" :disabled="viewOnly" />
+      <el-input id="googleChatProxy" :value="googleChatProxy" :disabled="viewOnly" @input="googleChatProxy = $event" />
       <label>
         By default ElastAlert 2 will not use a network proxy to send notifications to GoogleChat.
         Set this option using hostname:port if you need to use a proxy.
@@ -243,6 +243,6 @@ export default {
 };
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 
 </style>
diff --git a/src/components/config/alert/ConfigAlertHttpPost.vue b/src/components/config/alert/ConfigAlertHttpPost.vue
index 2f0c80e1..9ad73e18 100644
--- a/src/components/config/alert/ConfigAlertHttpPost.vue
+++ b/src/components/config/alert/ConfigAlertHttpPost.vue
@@ -53,7 +53,7 @@
     <el-form-item label="CA Certs" prop="httpPostCaCerts">
       <el-switch
         id="httpPostCaCerts"
-        v-model="httpPostCaCerts"
+        :value="httpPostCaCerts"
         :disabled="viewOnly"
         @change="changeHttpPostCaCerts" />
     </el-form-item>
@@ -61,13 +61,13 @@
     <el-form-item label="Ignore SSL Errors" prop="httpPostIgnoreSslErrors">
       <el-switch
         id="httpPostIgnoreSslErrors"
-        v-model="httpPostIgnoreSslErrors"
+        :value="httpPostIgnoreSslErrors"
         :disabled="viewOnly"
         @change="changeHttpPostIgnoreSslErrors" />
     </el-form-item>
 
     <el-form-item label="Timeout" prop="httpPostTimeout">
-      <el-input-number id="httpPostTimeout" v-model="httpPostTimeout" :disabled="viewOnly" />
+      <el-input-number id="httpPostTimeout" :value="httpPostTimeout" :disabled="viewOnly" @input="httpPostTimeout = $event" />
       <label>
         The timeout value, in seconds, for making the post.
         The default is 10.
@@ -76,7 +76,7 @@
     </el-form-item>
 
     <el-form-item label="Proxy" prop="httpPostProxy">
-      <el-input id="httpPostProxy" v-model="httpPostProxy" :disabled="viewOnly" />
+      <el-input id="httpPostProxy" :value="httpPostProxy" :disabled="viewOnly" @input="httpPostProxy = $event" />
       <label>URL of proxy, if required.</label>
     </el-form-item>
   </div>
@@ -206,23 +206,15 @@ export default {
     },
 
     changeHttpPostIgnoreSslErrors(val) {
-      if (val) {
-        this.httpPostIgnoreSslErrors = true;
-      } else {
-        this.httpPostIgnoreSslErrors = false;
-      }
+      this.httpPostIgnoreSslErrors = val;
     },
 
     changeHttpPostCaCerts(val) {
-      if (val) {
-        this.httpPostCaCerts = true;
-      } else {
-        this.httpPostCaCerts = false;
-      }
+      this.httpPostCaCerts = val;
     }
   }
 };
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 </style>
diff --git a/src/components/config/alert/ConfigAlertHttpPost2.vue b/src/components/config/alert/ConfigAlertHttpPost2.vue
index ef9d5fd8..e9e34b24 100644
--- a/src/components/config/alert/ConfigAlertHttpPost2.vue
+++ b/src/components/config/alert/ConfigAlertHttpPost2.vue
@@ -53,7 +53,7 @@
     <el-form-item label="CA Certs" prop="httpPost2CaCerts">
       <el-switch
         id="httpPost2CaCerts"
-        v-model="httpPost2CaCerts"
+        :value="httpPost2CaCerts"
         :disabled="viewOnly"
         @change="changeHttpPost2CaCerts" />
     </el-form-item>
@@ -61,13 +61,13 @@
     <el-form-item label="Ignore SSL Errors" prop="httpPost2IgnoreSslErrors">
       <el-switch
         id="httpPost2IgnoreSslErrors"
-        v-model="httpPost2IgnoreSslErrors"
+        :value="httpPost2IgnoreSslErrors"
         :disabled="viewOnly"
         @change="changeHttpPost2IgnoreSslErrors" />
     </el-form-item>
 
     <el-form-item label="Timeout" prop="httpPost2Timeout">
-      <el-input-number id="httpPost2Timeout" v-model="httpPost2Timeout" :disabled="viewOnly" />
+      <el-input-number id="httpPost2Timeout" :value="httpPost2Timeout" :disabled="viewOnly" @input="httpPost2Timeout = $event" />
       <label>
         The timeout value, in seconds, for making the post.
         The default is 10.
@@ -76,7 +76,7 @@
     </el-form-item>
 
     <el-form-item label="Proxy" prop="httpPost2Proxy">
-      <el-input id="httpPost2Proxy" v-model="httpPost2Proxy" :disabled="viewOnly" />
+      <el-input id="httpPost2Proxy" :value="httpPost2Proxy" :disabled="viewOnly" @input="httpPost2Proxy = $event" />
       <label>URL of proxy, if required.</label>
     </el-form-item>
   </div>
@@ -202,23 +202,15 @@ export default {
     },
 
     changeHttpPost2IgnoreSslErrors(val) {
-      if (val) {
-        this.httpPost2IgnoreSslErrors = true;
-      } else {
-        this.httpPost2IgnoreSslErrors = false;
-      }
+      this.httpPost2IgnoreSslErrors = val;
     },
 
     changeHttpPost2CaCerts(val) {
-      if (val) {
-        this.httpPost2CaCerts = true;
-      } else {
-        this.httpPost2CaCerts = false;
-      }
+      this.httpPost2CaCerts = val;
     }
   }
 };
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 </style>
diff --git a/src/components/config/alert/ConfigAlertIris.vue b/src/components/config/alert/ConfigAlertIris.vue
index 37e9506b..0308f28c 100644
--- a/src/components/config/alert/ConfigAlertIris.vue
+++ b/src/components/config/alert/ConfigAlertIris.vue
@@ -1,14 +1,14 @@
 <template>
   <div>
     <praeco-form-item label="Host" prop="irisHost" required>
-      <el-input id="irisHost" v-model="irisHost" :disabled="viewOnly" />
+      <el-input id="irisHost" :value="irisHost" :disabled="viewOnly" @input="irisHost = $event" />
       <label>
         Address of the Iris host. Exclude https:// For example: iris.example.com.
       </label>
     </praeco-form-item>
 
     <praeco-form-item label="irisApiToken" prop="irisApiToken" required>
-      <el-input id="irisApiToken" v-model="irisApiToken" :disabled="viewOnly" />
+      <el-input id="irisApiToken" :value="irisApiToken" :disabled="viewOnly" @input="irisApiToken = $event" />
       <label>
         The API key of the user you created, which will be used to initiate alerts and cases on behalf of this user.
       </label>
@@ -19,14 +19,14 @@
     <praeco-form-item label="CA Cert" prop="irisCaCert">
       <el-switch
         id="irisCaCert"
-        v-model="irisCaCert"
+        :value="irisCaCert"
         :disabled="viewOnly"
         @change="changeIrisCaCert" />
     </praeco-form-item>
     -->
 
     <praeco-form-item label="Customer Id" prop="irisCustomerId">
-      <el-input-number id="irisCustomerId" v-model="irisCustomerId" :disabled="viewOnly" />
+      <el-input-number id="irisCustomerId" :value="irisCustomerId" :disabled="viewOnly" @input="irisCustomerId = $event" />
       <label>
         This field represents the unique identifier of the customer for whom an incident/case will be created within the system.
         Configure and view the existing options in the section Advanced -> Customers of your IRIS instance.
@@ -37,13 +37,13 @@
     <praeco-form-item label="Ignore SSL Errors" prop="irisIgnoreSslErrors">
       <el-switch
         id="irisIgnoreSslErrors"
-        v-model="irisIgnoreSslErrors"
+        :value="irisIgnoreSslErrors"
         :disabled="viewOnly"
         @change="changeIrisIgnoreSslErrors" />
     </praeco-form-item>
 
     <praeco-form-item label="Description" prop="irisDescription">
-      <el-input id="irisDescription" v-model="irisDescription" :disabled="viewOnly" />
+      <el-input id="irisDescription" :value="irisDescription" :disabled="viewOnly" @input="irisDescription = $event" />
       <label>
         Description of the alert or case.
       </label>
@@ -52,13 +52,13 @@
     <praeco-form-item label="Overwrite Timestamp" prop="irisOverwriteTimestamp">
       <el-switch
         id="irisOverwriteTimestamp"
-        v-model="irisOverwriteTimestamp"
+        :value="irisOverwriteTimestamp"
         :disabled="viewOnly"
         @change="changeIrisOverwriteTimestamp" />
     </praeco-form-item>
 
     <praeco-form-item label="Type" prop="irisType">
-      <el-radio-group v-model="irisType" :disabled="viewOnly">
+      <el-radio-group :value="irisType" :disabled="viewOnly" @input="irisType = $event">
         <el-radio id="irisTypeAlert" label="alert" border>
           alert
         </el-radio>
@@ -70,42 +70,42 @@
     </praeco-form-item>
 
     <praeco-form-item label="Case template ID" prop="irisCaseTemplateId">
-      <el-input-number id="irisCaseTemplateId" v-model="irisCaseTemplateId" :disabled="viewOnly" />
+      <el-input-number id="irisCaseTemplateId" :value="irisCaseTemplateId" :disabled="viewOnly" @input="irisCaseTemplateId = $event" />
       <label>
         Case template ID, if you want to apply a pre-prepared template.
       </label>
     </praeco-form-item>
 
     <praeco-form-item label="Alert Note" prop="irisAlertNote">
-      <el-input id="irisAlertNote" v-model="irisAlertNote" :disabled="viewOnly" />
+      <el-input id="irisAlertNote" :value="irisAlertNote" :disabled="viewOnly" @input="irisAlertNote = $event" />
       <label>
         Note for the alert.
       </label>
     </praeco-form-item>
 
     <praeco-form-item label="Alert Tags" prop="irisAlertTags">
-      <el-input id="irisAlertTags" v-model="irisAlertTags" :disabled="viewOnly" />
+      <el-input id="irisAlertTags" :value="irisAlertTags" :disabled="viewOnly" @input="irisAlertTags = $event" />
       <label>
         List of tags.
       </label>
     </praeco-form-item>
 
     <praeco-form-item label="Alert Status Id" prop="irisAlertStatusId">
-      <el-input-number id="irisAlertStatusId" v-model="irisAlertStatusId" :disabled="viewOnly" :min="1" :max="7" />
+      <el-input-number id="irisAlertStatusId" :value="irisAlertStatusId" :disabled="viewOnly" :min="1" :max="7" @input="irisAlertStatusId = $event" />
       <label>
         The alert status of the alert, default value is 2. This parameter requires an integer input.
       </label>
     </praeco-form-item>
 
     <praeco-form-item label="Alert Source Link" prop="irisAlertSourceLink">
-      <el-input id="irisAlertSourceLink" v-model="irisAlertSourceLink" :disabled="viewOnly" />
+      <el-input id="irisAlertSourceLink" :value="irisAlertSourceLink" :disabled="viewOnly" @input="irisAlertSourceLink = $event" />
       <label>
         Your custom link, if needed.
       </label>
     </praeco-form-item>
 
     <praeco-form-item label="Alert Severity Id" prop="irisAlertSeverityId">
-      <el-input-number id="irisAlertSeverityId" v-model="irisAlertSeverityId" :disabled="viewOnly" :min="1" :max="6" />
+      <el-input-number id="irisAlertSeverityId" :value="irisAlertSeverityId" :disabled="viewOnly" :min="1" :max="6" @input="irisAlertSeverityId = $event" />
       <label>
         The severity level of the alert, default value is 1. This parameter requires an integer input.
       </label>
@@ -272,28 +272,16 @@ export default {
 
   methods: {
     changeIrisIgnoreSslErrors(val) {
-      if (val) {
-        this.irisIgnoreSslErrors = true;
-      } else {
-        this.irisIgnoreSslErrors = false;
-      }
+      this.irisIgnoreSslErrors = val;
     },
     /*
     TODO: Error saving config, are all fields filled out?
     changeIrisCaCert(val) {
-      if (val) {
-        this.irisCaCert = true;
-      } else {
-        this.irisCaCert = false;
-      }
+      this.irisCaCert = val;
     },
     */
     changeIrisOverwriteTimestamp(val) {
-      if (val) {
-        this.irisOverwriteTimestamp = true;
-      } else {
-        this.irisOverwriteTimestamp = false;
-      }
+      this.irisOverwriteTimestamp = val;
     }
   }
 };
diff --git a/src/components/config/alert/ConfigAlertJira.vue b/src/components/config/alert/ConfigAlertJira.vue
index 5564e36e..d6a85f7b 100644
--- a/src/components/config/alert/ConfigAlertJira.vue
+++ b/src/components/config/alert/ConfigAlertJira.vue
@@ -1,15 +1,15 @@
 <template>
   <div>
     <praeco-form-item label="Project" prop="jiraProject" required>
-      <el-input id="jiraProject" v-model="jiraProject" :disabled="viewOnly" />
+      <el-input id="jiraProject" :value="jiraProject" :disabled="viewOnly" @input="jiraProject = $event" />
       <label>Jira project</label>
     </praeco-form-item>
     <praeco-form-item label="Issue type" prop="jiraIssueType" required>
-      <el-input id="jiraIssueType" v-model="jiraIssueType" :disabled="viewOnly" />
+      <el-input id="jiraIssueType" :value="jiraIssueType" :disabled="viewOnly" @input="jiraIssueType = $event" />
       <label>Jira issue type (Bug, Integration Bug, etc...)</label>
     </praeco-form-item>
     <praeco-form-item label="Components" prop="jiraComponents">
-      <el-input id="jiraComponents" v-model="jiraComponents" :disabled="viewOnly" />
+      <el-input id="jiraComponents" :value="jiraComponents" :disabled="viewOnly" @input="jiraComponents = $event" />
       <label>Jira issue components</label>
     </praeco-form-item>
   </div>
@@ -63,6 +63,6 @@ export default {
 };
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 
 </style>
diff --git a/src/components/config/alert/ConfigAlertLark.vue b/src/components/config/alert/ConfigAlertLark.vue
index 66185b48..a6e45abf 100644
--- a/src/components/config/alert/ConfigAlertLark.vue
+++ b/src/components/config/alert/ConfigAlertLark.vue
@@ -1,7 +1,7 @@
 <template>
   <div>
     <praeco-form-item label="Bot Id" prop="larkBotId" required>
-      <el-input id="larkBotId" v-model="larkBotId" :disabled="viewOnly" />
+      <el-input id="larkBotId" :value="larkBotId" :disabled="viewOnly" @input="larkBotId = $event" />
       <label>Lark bot id.</label>
     </praeco-form-item>
   </div>
diff --git a/src/components/config/alert/ConfigAlertLineNotify.vue b/src/components/config/alert/ConfigAlertLineNotify.vue
index 56076170..7b7e6eaa 100644
--- a/src/components/config/alert/ConfigAlertLineNotify.vue
+++ b/src/components/config/alert/ConfigAlertLineNotify.vue
@@ -1,7 +1,7 @@
 <template>
   <div>
     <praeco-form-item label="Access Token" prop="linenotifyAccessToken" required>
-      <el-input id="linenotifyAccessToken" v-model="linenotifyAccessToken" :disabled="viewOnly" />
+      <el-input id="linenotifyAccessToken" :value="linenotifyAccessToken" :disabled="viewOnly" @input="linenotifyAccessToken = $event" />
       <label>The access token that you got from https://notify-bot.line.me/my/</label>
     </praeco-form-item>
   </div>
@@ -31,6 +31,6 @@ export default {
 };
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 
 </style>
diff --git a/src/components/config/alert/ConfigAlertMattermost.vue b/src/components/config/alert/ConfigAlertMattermost.vue
index 764342ca..a8bc8798 100644
--- a/src/components/config/alert/ConfigAlertMattermost.vue
+++ b/src/components/config/alert/ConfigAlertMattermost.vue
@@ -102,7 +102,7 @@
     </el-popover>
 
     <praeco-form-item label="Post as" prop="mattermostUsernameOverride" required>
-      <el-input id="mattermostUsernameOverride" v-model="mattermostUsernameOverride" :disabled="viewOnly" />
+      <el-input id="mattermostUsernameOverride" :value="mattermostUsernameOverride" :disabled="viewOnly" @input="mattermostUsernameOverride = $event" />
       <label>This is the username that will appear in Mattermost for the alert</label>
     </praeco-form-item>
 
@@ -127,7 +127,7 @@
     </div>
 
     <el-form-item label="Message color" prop="mattermostMsgColor" required>
-      <el-radio-group v-model="mattermostMsgColor" :disabled="viewOnly">
+      <el-radio-group :value="mattermostMsgColor" :disabled="viewOnly" @input="mattermostMsgColor = $event">
         <el-radio id="mattermostMsgColorDanger" label="danger" border class="mattermost-danger">
           Danger
         </el-radio>
@@ -143,13 +143,13 @@
     <el-form-item label="Ignore SSL Errors" prop="mattermostIgnoreSslErrors">
       <el-switch
         id="mattermostIgnoreSslErrors"
-        v-model="mattermostIgnoreSslErrors"
+        :value="mattermostIgnoreSslErrors"
         :disabled="viewOnly"
         @change="changeMattermostIgnoreSslErrors" />
     </el-form-item>
 
     <el-form-item label="Icon URL Override" prop="mattermostIconUrlOverride">
-      <el-input id="mattermostIconUrlOverride" v-model="mattermostIconUrlOverride" :disabled="viewOnly" />
+      <el-input id="mattermostIconUrlOverride" :value="mattermostIconUrlOverride" :disabled="viewOnly" @input="mattermostIconUrlOverride = $event" />
       <label>
         By default ElastAlert 2 will use the default webhook icon when posting to the channel.
         You can provide icon_url to use custom image.
@@ -158,12 +158,12 @@
     </el-form-item>
 
     <el-form-item label="Msg Pretext" prop="mattermostMsgPretext">
-      <el-input id="mattermostMsgPretext" v-model="mattermostMsgPretext" :disabled="viewOnly" />
+      <el-input id="mattermostMsgPretext" :value="mattermostMsgPretext" :disabled="viewOnly" @input="mattermostMsgPretext = $event" />
       <label>You can set the message attachment pretext using this option.</label>
     </el-form-item>
 
     <el-form-item label="Proxy" prop="mattermostProxy">
-      <el-input id="mattermostProxy" v-model="mattermostProxy" :disabled="viewOnly" />
+      <el-input id="mattermostProxy" :value="mattermostProxy" :disabled="viewOnly" @input="mattermostProxy = $event" />
       <label>
         By default ElastAlert 2 will not use a network proxy to send notifications to Mattermost.
         Set this option using hostname:port if you need to use a proxy.
@@ -171,54 +171,54 @@
     </el-form-item>
 
     <el-form-item label="Title" prop="mattermostTitle">
-      <el-input v-model="mattermostTitle" :disabled="viewOnly" />
+      <el-input :value="mattermostTitle" :disabled="viewOnly" @input="mattermostTitle = $event" />
       <label>Sets a title for the message, this shows up as a blue text at the start of the message.</label>
     </el-form-item>
 
     <el-form-item label="Title Link" prop="mattermostTitleLink">
-      <el-input v-model="mattermostTitleLink" :disabled="viewOnly" />
+      <el-input :value="mattermostTitleLink" :disabled="viewOnly" @input="mattermostTitleLink = $event" />
       <label>You can add a link in your Mattermost notification by setting this to a valid URL.</label>
     </el-form-item>
 
     <el-form-item label="Footer" prop="mattermostFooter">
-      <el-input v-model="mattermostFooter" :disabled="viewOnly" />
+      <el-input :value="mattermostFooter" :disabled="viewOnly" @input="mattermostFooter = $event" />
       <label>Add a static footer text for alert.</label>
     </el-form-item>
 
     <el-form-item label="Footer Icon" prop="mattermostFooterIcon">
-      <el-input v-model="mattermostFooterIcon" :disabled="viewOnly" />
+      <el-input :value="mattermostFooterIcon" :disabled="viewOnly" @input="mattermostFooterIcon = $event" />
       <label>A Public Url for a footer icon.</label>
     </el-form-item>
 
     <el-form-item label="Image URL" prop="mattermostImageUrl">
-      <el-input v-model="mattermostImageUrl" :disabled="viewOnly" />
+      <el-input :value="mattermostImageUrl" :disabled="viewOnly" @input="mattermostImageUrl = $event" />
       <label>An optional URL to an image file (GIF, JPEG, PNG, BMP, or SVG).</label>
     </el-form-item>
 
     <el-form-item label="Thumb URL" prop="mattermostThumbUrl">
-      <el-input v-model="mattermostThumbUrl" :disabled="viewOnly" />
+      <el-input :value="mattermostThumbUrl" :disabled="viewOnly" @input="mattermostThumbUrl = $event" />
       <label>An optional URL to an image file (GIF, JPEG, PNG, BMP, or SVG) that is displayed as thumbnail.</label>
     </el-form-item>
 
     <el-form-item label="Author Name" prop="mattermostAuthorName">
-      <el-input v-model="mattermostAuthorName" :disabled="viewOnly" />
+      <el-input :value="mattermostAuthorName" :disabled="viewOnly" @input="mattermostAuthorName = $event" />
       <label>An optional name used to identify the author.</label>
     </el-form-item>
 
     <el-form-item label="Author Link" prop="mattermostAuthorLink">
-      <el-input v-model="mattermostAuthorLink" :disabled="viewOnly" />
+      <el-input :value="mattermostAuthorLink" :disabled="viewOnly" @input="mattermostAuthorLink = $event" />
       <label>An optional URL used to hyperlink the author_name.</label>
     </el-form-item>
 
     <el-form-item label="Author Icon" prop="mattermostAuthorIcon">
-      <el-input v-model="mattermostAuthorIcon" :disabled="viewOnly" />
+      <el-input :value="mattermostAuthorIcon" :disabled="viewOnly" @input="mattermostAuthorIcon = $event" />
       <label>An optional URL used to display a 16x16 pixel icon beside the author_name.</label>
     </el-form-item>
 
     <el-form-item label="Attach Kibana Discover URL" prop="mattermostAttachKibanaDiscoverUrl">
       <el-switch
         id="mattermostAttachKibanaDiscoverUrl"
-        v-model="mattermostAttachKibanaDiscoverUrl"
+        :value="mattermostAttachKibanaDiscoverUrl"
         :disabled="viewOnly"
         @change="changeMattermostAttachKibanaDiscoverUrl" />
     </el-form-item>
@@ -230,7 +230,7 @@
     </el-form-item>
 
     <el-form-item label="Kibana Discover Title" prop="mattermostKibanaDiscoverTitle">
-      <el-input v-model="mattermostKibanaDiscoverTitle" :disabled="viewOnly" />
+      <el-input :value="mattermostKibanaDiscoverTitle" :disabled="viewOnly" @input="mattermostKibanaDiscoverTitle = $event" />
       <label>The title of the Kibana Discover url attachment.</label>
     </el-form-item>
   </div>
@@ -583,19 +583,11 @@ export default {
     },
 
     changeMattermostIgnoreSslErrors(val) {
-      if (val) {
-        this.mattermostIgnoreSslErrors = true;
-      } else {
-        this.mattermostIgnoreSslErrors = false;
-      }
+      this.mattermostIgnoreSslErrors = val;
     },
 
     changeMattermostAttachKibanaDiscoverUrl(val) {
-      if (val) {
-        this.mattermostAttachKibanaDiscoverUrl = true;
-      } else {
-        this.mattermostAttachKibanaDiscoverUrl = false;
-      }
+      this.mattermostAttachKibanaDiscoverUrl = val;
     },
 
     addMattermostEmoji(value) {
@@ -605,7 +597,7 @@ export default {
 };
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 .disabled {
   .emoji-mart {
     height: auto !important;
diff --git a/src/components/config/alert/ConfigAlertMsTeams.vue b/src/components/config/alert/ConfigAlertMsTeams.vue
index a9d59e0c..22b1bdc8 100644
--- a/src/components/config/alert/ConfigAlertMsTeams.vue
+++ b/src/components/config/alert/ConfigAlertMsTeams.vue
@@ -55,7 +55,7 @@
     </el-form-item>
 
     <el-form-item label="Alert Summary" prop="msTeamsAlertSummary" required>
-      <el-input v-model="msTeamsAlertSummary" :disabled="viewOnly" />
+      <el-input :value="msTeamsAlertSummary" :disabled="viewOnly" @input="msTeamsAlertSummary = $event" />
       <label>
         Summary should be configured according to MS documentation, although it seems not displayed by Teams currently.
       </label>
@@ -64,7 +64,7 @@
     <el-form-item label="Alert Fixed Width" prop="msTeamsAlertFixedWidth">
       <el-switch
         id="msTeamsAlertFixedWidth"
-        v-model="msTeamsAlertFixedWidth"
+        :value="msTeamsAlertFixedWidth"
         :disabled="viewOnly"
         @change="changemsTeamsAlertFixedWidth" />
       <label>
@@ -76,7 +76,7 @@
     </el-form-item>
 
     <el-form-item label="Proxy" prop="msTeamsProxy">
-      <el-input v-model="msTeamsProxy" :disabled="viewOnly" />
+      <el-input :value="msTeamsProxy" :disabled="viewOnly" @input="msTeamsProxy = $event" />
       <label>
         By default ElastAlert 2 will not use a network proxy to send notifications to MS Teams.
         Set this option using hostname:port if you need to use a proxy.
@@ -86,20 +86,20 @@
     <el-form-item label="Attach Kibana Discover URL" prop="msTeamsAttachKibanaDiscoverUrl">
       <el-switch
         id="msTeamsAttachKibanaDiscoverUrl"
-        v-model="msTeamsAttachKibanaDiscoverUrl"
+        :value="msTeamsAttachKibanaDiscoverUrl"
         :disabled="viewOnly"
         @change="changeMsTeamsAttachKibanaDiscoverUrl" />
     </el-form-item>
 
     <el-form-item label="Kibana Discover Title" prop="msTeamsKibanaDiscoverTitle">
-      <el-input v-model="msTeamsKibanaDiscoverTitle" :disabled="viewOnly" />
+      <el-input :value="msTeamsKibanaDiscoverTitle" :disabled="viewOnly" @input="msTeamsKibanaDiscoverTitle = $event" />
       <label>The title of the Kibana Discover url attachment.</label>
     </el-form-item>
 
     <el-form-item label="Ignore SSL Errors" prop="msTeamsIgnoreSslErrors">
       <el-switch
         id="msTeamsIgnoreSslErrors"
-        v-model="msTeamsIgnoreSslErrors"
+        :value="msTeamsIgnoreSslErrors"
         :disabled="viewOnly"
         @change="changeMsTeamsIgnoreSslErrors" />
     </el-form-item>
@@ -107,7 +107,7 @@
     <el-form-item label="CA Certs" prop="msTeamsCaCerts">
       <el-switch
         id="msTeamsCaCerts"
-        v-model="msTeamsCaCerts"
+        :value="msTeamsCaCerts"
         :disabled="viewOnly"
         @change="changeMsTeamsCaCerts" />
     </el-form-item>
@@ -268,39 +268,23 @@ export default {
     },
 
     changemsTeamsAlertFixedWidth(val) {
-      if (val) {
-        this.msTeamsAlertFixedWidth = true;
-      } else {
-        this.msTeamsAlertFixedWidth = false;
-      }
+      this.msTeamsAlertFixedWidth = val;
     },
 
     changeMsTeamsIgnoreSslErrors(val) {
-      if (val) {
-        this.msTeamsIgnoreSslErrors = true;
-      } else {
-        this.msTeamsIgnoreSslErrors = false;
-      }
+      this.msTeamsIgnoreSslErrors = val;
     },
 
     changeMsTeamsAttachKibanaDiscoverUrl(val) {
-      if (val) {
-        this.msTeamsAttachKibanaDiscoverUrl = true;
-      } else {
-        this.msTeamsAttachKibanaDiscoverUrl = false;
-      }
+      this.msTeamsAttachKibanaDiscoverUrl = val;
     },
 
     changeMsTeamsCaCerts(val) {
-      if (val) {
-        this.msTeamsCaCerts = true;
-      } else {
-        this.msTeamsCaCerts = false;
-      }
+      this.msTeamsCaCerts = val;
     }
   }
 };
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 </style>
diff --git a/src/components/config/alert/ConfigAlertOpsgenie.vue b/src/components/config/alert/ConfigAlertOpsgenie.vue
index 42b57f4b..036436b0 100644
--- a/src/components/config/alert/ConfigAlertOpsgenie.vue
+++ b/src/components/config/alert/ConfigAlertOpsgenie.vue
@@ -1,56 +1,56 @@
 <template>
   <div>
     <el-form-item label="opsgenie_key" prop="opsgenieKey" required>
-      <el-input v-model="opsgenieKey" :disabled="viewOnly" />
+      <el-input :value="opsgenieKey" :disabled="viewOnly" @input="opsgenieKey = $event" />
       <label>
         The randomly generated API Integration key created by OpsGenie.
       </label>
     </el-form-item>
 
     <el-form-item label="opsgenie_account" prop="opsgenieAccount">
-      <el-input v-model="opsgenieAccount" :disabled="viewOnly" />
+      <el-input :value="opsgenieAccount" :disabled="viewOnly" @input="opsgenieAccount = $event" />
       <label>
         The randomly generated API Integration key created by OpsGenie.
       </label>
     </el-form-item>
 
     <el-form-item label="opsgenie_message" prop="opsgenieMessage">
-      <el-input v-model="opsgenieMessage" :disabled="viewOnly" />
+      <el-input :value="opsgenieMessage" :disabled="viewOnly" @input="opsgenieMessage = $event" />
       <label>
         Set the OpsGenie message to something other than the rule name. The message can be formatted with fields from the first match e.g. “Error occurred for {app_name} at {timestamp}.”.
       </label>
     </el-form-item>
 
     <el-form-item label="opsgenie_subject" prop="opsgenieSubject">
-      <el-input v-model="opsgenieSubject" :disabled="viewOnly" />
+      <el-input :value="opsgenieSubject" :disabled="viewOnly" @input="opsgenieSubject = $event" />
       <label>
         A string used to create the title of the OpsGenie alert. Can use Python string formatting.
       </label>
     </el-form-item>
 
     <el-form-item label="opsgenie_alias" prop="opsgenieAlias">
-      <el-input v-model="opsgenieAlias" :disabled="viewOnly" />
+      <el-input :value="opsgenieAlias" :disabled="viewOnly" @input="opsgenieAlias = $event" />
       <label>
         Set the OpsGenie alias. The alias can be formatted with fields from the first match e.g “{app_name} error”.
       </label>
     </el-form-item>
 
     <el-form-item label="opsgenie_proxy" prop="opsgenieProxy">
-      <el-input v-model="opsgenieProxy" :disabled="viewOnly" />
+      <el-input :value="opsgenieProxy" :disabled="viewOnly" @input="opsgenieProxy = $event" />
       <label>
         By default ElastAlert 2 will not use a network proxy to send notifications to OpsGenie. Set this option using hostname:port if you need to use a proxy. only supports https.
       </label>
     </el-form-item>
 
     <el-form-item label="opsgenie_description" prop="opsgenieDescription">
-      <el-input v-model="opsgenieDescription" :disabled="viewOnly" />
+      <el-input :value="opsgenieDescription" :disabled="viewOnly" @input="opsgenieDescription = $event" />
       <label>
         Set the OpsGenie description to something other than the rule body. The message can be formatted with fields from the first match e.g. “Error occurred for {app_name} at {timestamp}.”.
       </label>
     </el-form-item>
 
     <el-form-item label="opsgenie_priority" prop="opsgeniePriority">
-      <el-radio-group v-model="opsgeniePriority" :disabled="viewOnly">
+      <el-radio-group :value="opsgeniePriority" :disabled="viewOnly" @input="opsgeniePriority = $event">
         <el-radio id="opsgeniePriorityP1" label="P1" border>
           P1
         </el-radio>
@@ -175,5 +175,5 @@ export default {
 };
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 </style>
diff --git a/src/components/config/alert/ConfigAlertPagerDuty.vue b/src/components/config/alert/ConfigAlertPagerDuty.vue
index d6d98e21..c8864a65 100644
--- a/src/components/config/alert/ConfigAlertPagerDuty.vue
+++ b/src/components/config/alert/ConfigAlertPagerDuty.vue
@@ -8,21 +8,21 @@
     </el-radio>
 
     <el-form-item label="Service Key" prop="pagerdutyServiceKey" required>
-      <el-input id="pagerdutyServiceKey" v-model="pagerdutyServiceKey" :disabled="viewOnly" />
+      <el-input id="pagerdutyServiceKey" :value="pagerdutyServiceKey" :disabled="viewOnly" @input="pagerdutyServiceKey = $event" />
       <label>
         Integration Key generated after creating a service with the ‘Use our API directly’ option at Integration Settingsl
       </label>
     </el-form-item>
 
     <el-form-item label="Client Name" prop="pagerdutyClientName" required>
-      <el-input id="pagerdutyClientName" v-model="pagerdutyClientName" :disabled="viewOnly" />
+      <el-input id="pagerdutyClientName" :value="pagerdutyClientName" :disabled="viewOnly" @input="pagerdutyClientName = $event" />
       <label>
         The name of the monitoring client that is triggering this event.
       </label>
     </el-form-item>
 
     <el-form-item label="Event Type" prop="pagerdutyEventType" required>
-      <el-radio-group v-model="pagerdutyEventType" :disabled="viewOnly">
+      <el-radio-group :value="pagerdutyEventType" :disabled="viewOnly" @input="pagerdutyEventType = $event">
         <el-radio id="pagerdutyEventTypeTrigger" label="trigger">
           Trigger
         </el-radio>
@@ -36,7 +36,7 @@
     </el-form-item>
 
     <el-form-item label="Incident Key" prop="pagerdutyIncidentKey">
-      <el-input id="pagerdutyIncidentKey" v-model="pagerdutyIncidentKey" :disabled="viewOnly" />
+      <el-input id="pagerdutyIncidentKey" :value="pagerdutyIncidentKey" :disabled="viewOnly" @input="pagerdutyIncidentKey = $event" />
       <label>
         If not set PagerDuty will trigger a new incident for each alert sent.
         If set to a unique string per rule PagerDuty will identify the incident that this event should be applied. If there’s no open (i.e. unresolved) incident with this key, a new one will be created.
@@ -96,7 +96,7 @@
     </el-popover>
 
     <el-form-item label="Proxy" prop="pagerdutyProxy">
-      <el-input id="pagerdutyProxy" v-model="pagerdutyProxy" :disabled="viewOnly" />
+      <el-input id="pagerdutyProxy" :value="pagerdutyProxy" :disabled="viewOnly" @input="pagerdutyProxy = $event" />
       <label>
         By default ElastAlert2 will not use a network proxy to send notifications to PagerDuty.
         Set this option using hostname:port if you need to use a proxy.
@@ -105,7 +105,7 @@
 
     <div v-if="groupPagerduty === 'v2'">
       <el-form-item label="Payload Class" prop="pagerdutyV2PayloadClass">
-        <el-input id="pagerdutyV2PayloadClass" v-model="pagerdutyV2PayloadClass" :disabled="viewOnly" />
+        <el-input id="pagerdutyV2PayloadClass" :value="pagerdutyV2PayloadClass" :disabled="viewOnly" @input="pagerdutyV2PayloadClass = $event" />
         <label>
           Sets the class of the payload. (the event type in PagerDuty)
         </label>
@@ -163,7 +163,7 @@
       </el-popover>
 
       <el-form-item label="Payload Component" prop="pagerdutyV2PayloadComponent">
-        <el-input id="pagerdutyV2PayloadComponent" v-model="pagerdutyV2PayloadComponent" :disabled="viewOnly" />
+        <el-input id="pagerdutyV2PayloadComponent" :value="pagerdutyV2PayloadComponent" :disabled="viewOnly" @input="pagerdutyV2PayloadComponent = $event" />
         <label>
           Sets the component of the payload. (what program/interface/etc the event came from)
         </label>
@@ -221,7 +221,7 @@
       </el-popover>
 
       <el-form-item label="Payload Group" prop="pagerdutyV2PayloadGroup">
-        <el-input id="pagerdutyV2PayloadGroup" v-model="pagerdutyV2PayloadGroup" :disabled="viewOnly" />
+        <el-input id="pagerdutyV2PayloadGroup" :value="pagerdutyV2PayloadGroup" :disabled="viewOnly" @input="pagerdutyV2PayloadGroup = $event" />
         <label>
           Sets the logical grouping (e.g. app-stack)
         </label>
@@ -279,7 +279,7 @@
       </el-popover>
 
       <el-form-item label="Severity" prop="pagerdutyV2PayloadSeverity">
-        <el-radio-group v-model="pagerdutyV2PayloadSeverity" :disabled="viewOnly">
+        <el-radio-group :value="pagerdutyV2PayloadSeverity" :disabled="viewOnly" @input="pagerdutyV2PayloadSeverity = $event">
           <el-radio id="pagerdutyV2PayloadSeverityCritical" label="critical">
             Critical
           </el-radio>
@@ -299,7 +299,7 @@
       </el-form-item>
 
       <el-form-item label="Payload Group" prop="pagerdutyV2PayloadSource">
-        <el-input id="pagerdutyV2PayloadSource" v-model="pagerdutyV2PayloadSource" :disabled="viewOnly" />
+        <el-input id="pagerdutyV2PayloadSource" :value="pagerdutyV2PayloadSource" :disabled="viewOnly" @input="pagerdutyV2PayloadSource = $event" />
         <label>
           Sets the source of the event, preferably the hostname or fqdn.
         </label>
@@ -359,7 +359,7 @@
       <el-form-item label="Payload include All Info" prop="pagerdutyV2PayloadIncludeAllInfo">
         <el-switch
           id="pagerdutyV2PayloadIncludeAllInfo"
-          v-model="pagerdutyV2PayloadIncludeAllInfo"
+          :value="pagerdutyV2PayloadIncludeAllInfo"
           :disabled="viewOnly"
           @change="changePagerdutyV2PayloadIncludeAllInfo" />
       </el-form-item>
@@ -810,15 +810,11 @@ export default {
     },
 
     changePagerdutyV2PayloadIncludeAllInfo(val) {
-      if (val) {
-        this.pagerdutyV2PayloadIncludeAllInfo = true;
-      } else {
-        this.pagerdutyV2PayloadIncludeAllInfo = false;
-      }
+      this.pagerdutyV2PayloadIncludeAllInfo = val;
     }
   }
 };
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 </style>
diff --git a/src/components/config/alert/ConfigAlertPagerTree.vue b/src/components/config/alert/ConfigAlertPagerTree.vue
index 96a2f17b..a937762a 100644
--- a/src/components/config/alert/ConfigAlertPagerTree.vue
+++ b/src/components/config/alert/ConfigAlertPagerTree.vue
@@ -1,12 +1,12 @@
 <template>
   <div>
     <praeco-form-item label="Integration URL" prop="pagertreeIntegrationUrl">
-      <el-input id="pagertreeIntegrationUrl" v-model="pagertreeIntegrationUrl" :disabled="viewOnly" />
+      <el-input id="pagertreeIntegrationUrl" :value="pagertreeIntegrationUrl" :disabled="viewOnly" @input="pagertreeIntegrationUrl = $event" />
       <label>URL generated by PagerTree for the integration.</label>
     </praeco-form-item>
 
     <praeco-form-item label="Proxy" prop="pagertreeProxy" required>
-      <el-input id="pagertreeProxy" v-model="pagertreeProxy" :disabled="viewOnly" />
+      <el-input id="pagertreeProxy" :value="pagertreeProxy" :disabled="viewOnly" @input="pagertreeProxy = $event" />
       <label>
         By default ElastAlert 2 will not use a network proxy to send notifications to PagerTree.
         Set this option using hostname:port if you need to use a proxy.
@@ -38,7 +38,7 @@ export default {
       },
       set(value) {
         this.$store.commit(
-          'config/alert/UPDATE_PAGERTREE_PAGERTREE_PROXY',
+          'config/alert/UPDATE_PAGERTREE_PROXY',
           value
         );
       }
@@ -50,5 +50,5 @@ export default {
 };
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 </style>
diff --git a/src/components/config/alert/ConfigAlertRocketChat.vue b/src/components/config/alert/ConfigAlertRocketChat.vue
index 7fc0483c..3c02bf6f 100644
--- a/src/components/config/alert/ConfigAlertRocketChat.vue
+++ b/src/components/config/alert/ConfigAlertRocketChat.vue
@@ -102,7 +102,7 @@
     </el-popover>
 
     <praeco-form-item label="Post as" prop="rocketChatUsernameOverride" required>
-      <el-input id="rocketChatUsernameOverride" v-model="rocketChatUsernameOverride" :disabled="viewOnly" />
+      <el-input id="rocketChatUsernameOverride" :value="rocketChatUsernameOverride" :disabled="viewOnly" @input="rocketChatUsernameOverride = $event" />
       <label>This is the username that will appear in Rocket.Chat for the alert</label>
     </praeco-form-item>
 
@@ -127,7 +127,7 @@
     </div>
 
     <el-form-item label="Message color" prop="rocketChatMsgColor" required>
-      <el-radio-group v-model="rocketChatMsgColor" :disabled="viewOnly">
+      <el-radio-group :value="rocketChatMsgColor" :disabled="viewOnly" @input="rocketChatMsgColor = $event">
         <el-radio id="rocketChatMsgColorDanger" label="danger" border class="rocketChat-danger">
           Danger
         </el-radio>
@@ -141,12 +141,12 @@
     </el-form-item>
 
     <el-form-item label="Text String" prop="rocketChatTextString">
-      <el-input id="rocketChatTextString" v-model="rocketChatTextString" :disabled="viewOnly" />
+      <el-input id="rocketChatTextString" :value="rocketChatTextString" :disabled="viewOnly" @input="rocketChatTextString = $event" />
       <label>Notification message you want to add.</label>
     </el-form-item>
 
     <el-form-item label="Proxy" prop="rocketChatProxy">
-      <el-input id="rocketChatProxy" v-model="rocketChatProxy" :disabled="viewOnly" />
+      <el-input id="rocketChatProxy" :value="rocketChatProxy" :disabled="viewOnly" @input="rocketChatProxy = $event" />
       <label>
         By default ElastAlert2 will not use a network proxy to send notifications to Rocket.Chat.
         Set this option using hostname:port if you need to use a proxy.
@@ -156,7 +156,7 @@
     <el-form-item label="Attach Kibana Discover URL" prop="rocketChatAttachKibanaDiscoverUrl">
       <el-switch
         id="rocketChatAttachKibanaDiscoverUrl"
-        v-model="rocketChatAttachKibanaDiscoverUrl"
+        :value="rocketChatAttachKibanaDiscoverUrl"
         :disabled="viewOnly"
         @change="changeRocketChatAttachKibanaDiscoverUrl" />
     </el-form-item>
@@ -168,14 +168,14 @@
     </el-form-item>
 
     <el-form-item label="Kibana Discover Title" prop="rocketChatKibanaDiscoverTitle">
-      <el-input v-model="rocketChatKibanaDiscoverTitle" :disabled="viewOnly" />
+      <el-input :value="rocketChatKibanaDiscoverTitle" :disabled="viewOnly" @input="rocketChatKibanaDiscoverTitle = $event" />
       <label>The title of the Kibana Discover url attachment.</label>
     </el-form-item>
 
     <el-form-item label="Ignore SSL Errors" prop="rocketChatIgnoreSslErrors">
       <el-switch
         id="rocketChatIgnoreSslErrors"
-        v-model="rocketChatIgnoreSslErrors"
+        :value="rocketChatIgnoreSslErrors"
         :disabled="viewOnly"
         @change="changeRocketChatIgnoreSslErrors" />
     </el-form-item>
@@ -183,13 +183,13 @@
     <el-form-item label="CA Certs" prop="rocketChatCaCerts">
       <el-switch
         id="rocketChatCaCerts"
-        v-model="rocketChatCaCerts"
+        :value="rocketChatCaCerts"
         :disabled="viewOnly"
         @change="changeRocketChatCaCerts" />
     </el-form-item>
 
     <el-form-item label="Timeout" prop="rocketChatTimeout">
-      <el-input-number id="rocketChatTimeout" v-model="rocketChatTimeout" :disabled="viewOnly" />
+      <el-input-number id="rocketChatTimeout" :value="rocketChatTimeout" :disabled="viewOnly" @input="rocketChatTimeout = $event" />
       <label>
         You can specify a timeout value, in seconds, for making communicating with Rocket.Chat.
         The default is 10. If a timeout occurs, the alert will be retried next time ElastAlert 2 cycles.
@@ -457,33 +457,21 @@ export default {
     },
 
     changeRocketChatIgnoreSslErrors(val) {
-      if (val) {
-        this.rocketChatIgnoreSslErrors = true;
-      } else {
-        this.rocketChatIgnoreSslErrors = false;
-      }
+      this.rocketChatIgnoreSslErrors = val;
     },
 
     changeRocketChatCaCerts(val) {
-      if (val) {
-        this.rocketChatCaCerts = true;
-      } else {
-        this.rocketChatCaCerts = false;
-      }
+      this.rocketChatCaCerts = val;
     },
 
     changeRocketChatAttachKibanaDiscoverUrl(val) {
-      if (val) {
-        this.rocketChatAttachKibanaDiscoverUrl = true;
-      } else {
-        this.rocketChatAttachKibanaDiscoverUrl = false;
-      }
+      this.rocketChatAttachKibanaDiscoverUrl = val;
     }
   }
 };
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 .disabled {
   .emoji-mart {
     height: auto !important;
diff --git a/src/components/config/alert/ConfigAlertServiceNow.vue b/src/components/config/alert/ConfigAlertServiceNow.vue
index ce80ddbe..8b212b5a 100644
--- a/src/components/config/alert/ConfigAlertServiceNow.vue
+++ b/src/components/config/alert/ConfigAlertServiceNow.vue
@@ -1,57 +1,57 @@
 .<template>
   <div>
     <praeco-form-item label="Username" prop="serviceNowUsername" required>
-      <el-input id="serviceNowUsername" v-model="serviceNowUsername" :disabled="viewOnly" />
+      <el-input id="serviceNowUsername" :value="serviceNowUsername" :disabled="viewOnly" @input="serviceNowUsername = $event" />
       <label>The ServiceNow Username to access the api.</label>
     </praeco-form-item>
 
     <praeco-form-item label="Password" prop="serviceNowPassword" required>
-      <el-input id="serviceNowPassword" v-model="serviceNowPassword" :disabled="viewOnly" />
+      <el-input id="serviceNowPassword" :value="serviceNowPassword" :disabled="viewOnly" @input="serviceNowPassword = $event" />
       <label>The ServiceNow password to access the api.</label>
     </praeco-form-item>
 
     <praeco-form-item label="REST URL" prop="servicenowRestUrl" required>
-      <el-input id="servicenowRestUrl" v-model="servicenowRestUrl" :disabled="viewOnly" />
+      <el-input id="servicenowRestUrl" :value="servicenowRestUrl" :disabled="viewOnly" @input="servicenowRestUrl = $event" />
       <label>The ServiceNow RestApi url.</label>
     </praeco-form-item>
 
     <praeco-form-item label="ShortDescription" prop="servicenowShortDescription" required>
-      <el-input id="servicenowShortDescription" v-model="servicenowShortDescription" :disabled="viewOnly" />
+      <el-input id="servicenowShortDescription" :value="servicenowShortDescription" :disabled="viewOnly" @input="servicenowShortDescription = $event" />
       <label>The ServiceNow password to access the api.</label>
     </praeco-form-item>
 
     <praeco-form-item label="Comments" prop="servicenowComments" required>
-      <el-input id="servicenowComments" v-model="servicenowComments" :disabled="viewOnly" />
+      <el-input id="servicenowComments" :value="servicenowComments" :disabled="viewOnly" @input="servicenowComments = $event" />
       <label>Comments to be attached to the incident, this is the equivilant of work notes.</label>
     </praeco-form-item>
 
     <praeco-form-item label="AssignmentGroup" prop="servicenowAssignmentGroup" required>
-      <el-input id="servicenowAssignmentGroup" v-model="servicenowAssignmentGroup" :disabled="viewOnly" />
+      <el-input id="servicenowAssignmentGroup" :value="servicenowAssignmentGroup" :disabled="viewOnly" @input="servicenowAssignmentGroup = $event" />
       <label>The group to assign the incident to.</label>
     </praeco-form-item>
 
     <praeco-form-item label="Category" prop="servicenowCategory" required>
-      <el-input id="servicenowCategory" v-model="servicenowCategory" :disabled="viewOnly" />
+      <el-input id="servicenowCategory" :value="servicenowCategory" :disabled="viewOnly" @input="servicenowCategory = $event" />
       <label>The category to attach the incident to, use an existing category.</label>
     </praeco-form-item>
 
     <praeco-form-item label="Subcategory" prop="servicenowSubcategory" required>
-      <el-input id="servicenowSubcategory" v-model="servicenowSubcategory" :disabled="viewOnly" />
+      <el-input id="servicenowSubcategory" :value="servicenowSubcategory" :disabled="viewOnly" @input="servicenowSubcategory = $event" />
       <label>The subcategory to attach the incident to, use an existing subcategory.</label>
     </praeco-form-item>
 
     <praeco-form-item label="CmdbCi" prop="servicenowCmdbCi" required>
-      <el-input id="servicenowCmdbCi" v-model="servicenowCmdbCi" :disabled="viewOnly" />
+      <el-input id="servicenowCmdbCi" :value="servicenowCmdbCi" :disabled="viewOnly" @input="servicenowCmdbCi = $event" />
       <label>The configuration item to attach the incident to.</label>
     </praeco-form-item>
 
     <praeco-form-item label="CallerId" prop="servicenowCallerId" required>
-      <el-input id="servicenowCallerId" v-model="servicenowCallerId" :disabled="viewOnly" />
+      <el-input id="servicenowCallerId" :value="servicenowCallerId" :disabled="viewOnly" @input="servicenowCallerId = $event" />
       <label>The caller id (email address) of the user that created the incident.</label>
     </praeco-form-item>
 
     <praeco-form-item label="Proxy" prop="servicenowProxy">
-      <el-input id="servicenowProxy" v-model="servicenowProxy" :disabled="viewOnly" />
+      <el-input id="servicenowProxy" :value="servicenowProxy" :disabled="viewOnly" @input="servicenowProxy = $event" />
       <label>
         By default ElastAlert 2 will not use a network proxy to send notifications to ServiceNow.
         Set this option using hostname:port if you need to use a proxy.
@@ -59,7 +59,7 @@
     </praeco-form-item>
 
     <praeco-form-item label="Impact" prop="servicenowImpact">
-      <el-input-number id="servicenowImpact" v-model="servicenowImpact" :disabled="viewOnly" :min="1" :max="3" />
+      <el-input-number id="servicenowImpact" :value="servicenowImpact" :disabled="viewOnly" :min="1" :max="3" @input="servicenowImpact = $event" />
       <label>
         An integer 1, 2, or 3 representing high, medium, and low respectively.
         This measures the effect of an incident on business processes.
@@ -67,7 +67,7 @@
     </praeco-form-item>
 
     <praeco-form-item label="Urgency" prop="servicenowUrgency">
-      <el-input-number id="servicenowUrgency" v-model="servicenowUrgency" :disabled="viewOnly" :min="1" :max="3" />
+      <el-input-number id="servicenowUrgency" :value="servicenowUrgency" :disabled="viewOnly" :min="1" :max="3" @input="servicenowUrgency = $event" />
       <label>
         An integer 1, 2, or 3 representing high, medium, and low respecitvely.
         This measures how long this incident can be delayed until there is a significant business impact.
@@ -243,5 +243,5 @@ export default {
 };
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 </style>
diff --git a/src/components/config/alert/ConfigAlertSlack.vue b/src/components/config/alert/ConfigAlertSlack.vue
index 8dcd96e0..c68b6aa5 100644
--- a/src/components/config/alert/ConfigAlertSlack.vue
+++ b/src/components/config/alert/ConfigAlertSlack.vue
@@ -102,7 +102,7 @@
     </el-popover>
 
     <praeco-form-item label="Post as" prop="slackUsernameOverride" required>
-      <el-input id="slackUsernameOverride" v-model="slackUsernameOverride" :disabled="viewOnly" />
+      <el-input id="slackUsernameOverride" :value="slackUsernameOverride" :disabled="viewOnly" @input="slackUsernameOverride = $event" />
       <label>This is the username that will appear in Slack for the alert</label>
     </praeco-form-item>
 
@@ -127,7 +127,7 @@
     </div>
 
     <el-form-item label="Message color" prop="slackMsgColor" required>
-      <el-radio-group v-model="slackMsgColor" :disabled="viewOnly">
+      <el-radio-group :value="slackMsgColor" :disabled="viewOnly" @input="slackMsgColor = $event">
         <el-radio id="slackMsgColorDanger" label="danger" border class="slack-danger">
           Danger
         </el-radio>
@@ -141,7 +141,7 @@
     </el-form-item>
 
     <el-form-item label="Parse Override" prop="slackParseOverride">
-      <el-radio-group v-model="slackParseOverride" :disabled="viewOnly">
+      <el-radio-group :value="slackParseOverride" :disabled="viewOnly" @input="slackParseOverride = $event">
         <el-radio id="slackParseOverrideNone" label="none" border>
           none
         </el-radio>
@@ -153,20 +153,20 @@
     </el-form-item>
 
     <el-form-item label="Text String" prop="slackTextString">
-      <el-input id="slackTextString" v-model="slackTextString" :disabled="viewOnly" />
+      <el-input id="slackTextString" :value="slackTextString" :disabled="viewOnly" @input="slackTextString = $event" />
       <label>Notification message you want to add.</label>
     </el-form-item>
 
     <el-form-item label="Ignore SSL Errors" prop="slackIgnoreSslErrors">
       <el-switch
         id="slackIgnoreSslErrors"
-        v-model="slackIgnoreSslErrors"
+        :value="slackIgnoreSslErrors"
         :disabled="viewOnly"
         @change="changeSlackIgnoreSslErrors" />
     </el-form-item>
 
     <el-form-item label="Icon URL Override" prop="slackIconUrlOverride">
-      <el-input id="slackIconUrlOverride" v-model="slackIconUrlOverride" :disabled="viewOnly" />
+      <el-input id="slackIconUrlOverride" :value="slackIconUrlOverride" :disabled="viewOnly" @input="slackIconUrlOverride = $event" />
       <label>
         By default ElastAlert 2 will use the default webhook icon when posting to the channel.
         You can provide icon_url to use custom image.
@@ -177,13 +177,13 @@
     <el-form-item label="CA Certs" prop="slackCaCerts">
       <el-switch
         id="slackCaCerts"
-        v-model="slackCaCerts"
+        :value="slackCaCerts"
         :disabled="viewOnly"
         @change="changeSlackCaCerts" />
     </el-form-item>
 
     <el-form-item label="Timeout" prop="slackTimeout">
-      <el-input-number id="slackTimeout" v-model="slackTimeout" :disabled="viewOnly" />
+      <el-input-number id="slackTimeout" :value="slackTimeout" :disabled="viewOnly" @input="slackTimeout = $event" />
       <label>
         You can specify a timeout value, in seconds, for making communicating with Slack.
         The default is 10. If a timeout occurs, the alert will be retried next time ElastAlert 2 cycles.
@@ -193,7 +193,7 @@
     <el-form-item label="Attach Kibana Discover URL" prop="slackAttachKibanaDiscoverUrl">
       <el-switch
         id="slackAttachKibanaDiscoverUrl"
-        v-model="slackAttachKibanaDiscoverUrl"
+        :value="slackAttachKibanaDiscoverUrl"
         :disabled="viewOnly"
         @change="changeSlackAttachKibanaDiscoverUrl" />
     </el-form-item>
@@ -205,12 +205,12 @@
     </el-form-item>
 
     <el-form-item label="Kibana Discover Title" prop="slackKibanaDiscoverTitle">
-      <el-input v-model="slackKibanaDiscoverTitle" :disabled="viewOnly" />
+      <el-input :value="slackKibanaDiscoverTitle" :disabled="viewOnly" @input="slackKibanaDiscoverTitle = $event" />
       <label>The title of the Kibana Discover url attachment.</label>
     </el-form-item>
 
     <el-form-item label="Proxy" prop="slackProxy">
-      <el-input id="slackProxy" v-model="slackProxy" :disabled="viewOnly" />
+      <el-input id="slackProxy" :value="slackProxy" :disabled="viewOnly" @input="slackProxy = $event" />
       <label>
         By default ElastAlert 2 will not use a network proxy to send notifications to Slack.
         Set this option using hostname:port if you need to use a proxy.
@@ -218,49 +218,49 @@
     </el-form-item>
 
     <el-form-item label="Footer" prop="slackFooter">
-      <el-input v-model="slackFooter" :disabled="viewOnly" />
+      <el-input :value="slackFooter" :disabled="viewOnly" @input="slackFooter = $event" />
       <label>Add a static footer text for alert.</label>
     </el-form-item>
 
     <el-form-item label="Footer Icon" prop="slackFooterIcon">
-      <el-input v-model="slackFooterIcon" :disabled="viewOnly" />
+      <el-input :value="slackFooterIcon" :disabled="viewOnly" @input="slackFooterIcon = $event" />
       <label>A Public Url for a footer icon.</label>
     </el-form-item>
 
     <el-form-item label="Image URL" prop="slackImageUrl">
-      <el-input v-model="slackImageUrl" :disabled="viewOnly" />
+      <el-input :value="slackImageUrl" :disabled="viewOnly" @input="slackImageUrl = $event" />
       <label>An optional URL to an image file (GIF, JPEG, PNG, BMP, or SVG).</label>
     </el-form-item>
 
     <el-form-item label="Thumb URL" prop="slackThumbUrl">
-      <el-input v-model="slackThumbUrl" :disabled="viewOnly" />
+      <el-input :value="slackThumbUrl" :disabled="viewOnly" @input="slackThumbUrl = $event" />
       <label>An optional URL to an image file (GIF, JPEG, PNG, BMP, or SVG) that is displayed as thumbnail.</label>
     </el-form-item>
 
     <el-form-item label="Author Name" prop="slackAuthorName">
-      <el-input v-model="slackAuthorName" :disabled="viewOnly" />
+      <el-input :value="slackAuthorName" :disabled="viewOnly" @input="slackAuthorName = $event" />
       <label>An optional name used to identify the author.</label>
     </el-form-item>
 
     <el-form-item label="Author Link" prop="slackAuthorLink">
-      <el-input v-model="slackAuthorLink" :disabled="viewOnly" />
+      <el-input :value="slackAuthorLink" :disabled="viewOnly" @input="slackAuthorLink = $event" />
       <label>An optional URL used to hyperlink the author_name.</label>
     </el-form-item>
 
     <el-form-item label="Author Icon" prop="slackAuthorIcon">
-      <el-input v-model="slackAuthorIcon" :disabled="viewOnly" />
+      <el-input :value="slackAuthorIcon" :disabled="viewOnly" @input="slackAuthorIcon = $event" />
       <label>An optional URL used to display a 16x16 pixel icon beside the author_name.</label>
     </el-form-item>
 
     <el-form-item label="Msg Pretext" prop="slackMsgPretext">
-      <el-input v-model="slackMsgPretext" :disabled="viewOnly" />
+      <el-input :value="slackMsgPretext" :disabled="viewOnly" @input="slackMsgPretext = $event" />
       <label>You can set the message attachment pretext using this option.</label>
     </el-form-item>
 
     <el-form-item label="Attach Jira Ticket URL" prop="slackAttachJiraTicketUrl">
       <el-switch
         id="slackAttachJiraTicketUrl"
-        v-model="slackAttachJiraTicketUrl"
+        :value="slackAttachJiraTicketUrl"
         :disabled="viewOnly"
         @change="changeSlackAttachKibanaDiscoverUrl" />
     </el-form-item>
@@ -272,7 +272,7 @@
     </el-form-item>
 
     <el-form-item label="Jira Ticket Title" prop="slackJiraTicketTitle">
-      <el-input v-model="slackJiraTicketTitle" :disabled="viewOnly" />
+      <el-input :value="slackJiraTicketTitle" :disabled="viewOnly" @input="slackJiraTicketTitle = $event" />
       <label>The title of the Jira Ticket url attachment.</label>
     </el-form-item>
   </div>
@@ -682,41 +682,25 @@ export default {
     },
 
     changeSlackIgnoreSslErrors(val) {
-      if (val) {
-        this.slackIgnoreSslErrors = true;
-      } else {
-        this.slackIgnoreSslErrors = false;
-      }
+      this.slackIgnoreSslErrors = val;
     },
 
     changeSlackAttachKibanaDiscoverUrl(val) {
-      if (val) {
-        this.slackAttachKibanaDiscoverUrl = true;
-      } else {
-        this.slackAttachKibanaDiscoverUrl = false;
-      }
+      this.slackAttachKibanaDiscoverUrl = val;
     },
 
     changeSlackCaCerts(val) {
-      if (val) {
-        this.slackCaCerts = true;
-      } else {
-        this.slackCaCerts = false;
-      }
+      this.slackCaCerts = val;
     },
 
     changeSlackAttachJiraTicketUrl(val) {
-      if (val) {
-        this.slackAttachJiraTicketUrl = true;
-      } else {
-        this.slackAttachJiraTicketUrl = false;
-      }
+      this.slackAttachJiraTicketUrl = val;
     }
   }
 };
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 .disabled {
   .emoji-mart {
     height: auto !important;
diff --git a/src/components/config/alert/ConfigAlertStomp.vue b/src/components/config/alert/ConfigAlertStomp.vue
index 4993d20d..73e0f687 100644
--- a/src/components/config/alert/ConfigAlertStomp.vue
+++ b/src/components/config/alert/ConfigAlertStomp.vue
@@ -1,27 +1,27 @@
 .<template>
   <div>
     <praeco-form-item label="Host Name" prop="stompHostname" required>
-      <el-input id="stompHostname" v-model="stompHostname" :disabled="viewOnly" />
+      <el-input id="stompHostname" :value="stompHostname" :disabled="viewOnly" @input="stompHostname = $event" />
       <label>The STOMP host to use, defaults to localhost.</label>
     </praeco-form-item>
 
     <praeco-form-item label="Host Port" prop="stompHostport" required>
-      <el-input id="stompHostport" v-model="stompHostport" :disabled="viewOnly" />
+      <el-input id="stompHostport" :value="stompHostport" :disabled="viewOnly" @input="stompHostport = $event" />
       <label>The STOMP port to use, defaults to 61613.</label>
     </praeco-form-item>
 
     <praeco-form-item label="Login" prop="stompLogin" required>
-      <el-input id="stompLogin" v-model="stompLogin" :disabled="viewOnly" />
+      <el-input id="stompLogin" :value="stompLogin" :disabled="viewOnly" @input="stompLogin = $event" />
       <label>The STOMP login to use, defaults to admin.</label>
     </praeco-form-item>
 
     <praeco-form-item label="Password" prop="stompPassword" required>
-      <el-input id="stompPassword" v-model="stompPassword" :disabled="viewOnly" />
+      <el-input id="stompPassword" :value="stompPassword" :disabled="viewOnly" @input="stompPassword = $event" />
       <label>The STOMP password to use, defaults to admin.</label>
     </praeco-form-item>
 
     <praeco-form-item label="Destination" prop="stompDestination">
-      <el-input id="stompDestination" v-model="stompDestination" :disabled="viewOnly" />
+      <el-input id="stompDestination" :value="stompDestination" :disabled="viewOnly" @input="stompDestination = $event" />
       <label>The STOMP destination to use, defaults to /queue/ALERT</label>
     </praeco-form-item>
   </div>
@@ -98,6 +98,6 @@ export default {
 };
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 
 </style>
diff --git a/src/components/config/alert/ConfigAlertSubjectBody.vue b/src/components/config/alert/ConfigAlertSubjectBody.vue
index f5f9f5de..e6537e42 100644
--- a/src/components/config/alert/ConfigAlertSubjectBody.vue
+++ b/src/components/config/alert/ConfigAlertSubjectBody.vue
@@ -419,7 +419,7 @@ export default {
 };
 </script>
 
-<style scoped>
+<style lang="scss" scoped>
 .atwho-wrap >>> .atwho-panel {
   position: initial;
 }
diff --git a/src/components/config/alert/ConfigAlertTelegram.vue b/src/components/config/alert/ConfigAlertTelegram.vue
index 6ff9ec89..a243ab40 100644
--- a/src/components/config/alert/ConfigAlertTelegram.vue
+++ b/src/components/config/alert/ConfigAlertTelegram.vue
@@ -1,7 +1,7 @@
 <template>
   <div>
     <praeco-form-item label="Room ID" prop="telegramRoomId" required>
-      <el-input id="telegramRoomId" v-model="telegramRoomId" :disabled="viewOnly" />
+      <el-input id="telegramRoomId" :value="telegramRoomId" :disabled="viewOnly" @input="telegramRoomId = $event" />
       <label>
         Unique identifier for the target chat or username of the
         target channel using telegram chat_id (in the format “-xxxxxxxx”)
@@ -9,7 +9,7 @@
     </praeco-form-item>
 
     <praeco-form-item label="Proxy" prop="telegramProxy">
-      <el-input id="telegramProxy" v-model="telegramProxy" :disabled="viewOnly" />
+      <el-input id="telegramProxy" :value="telegramProxy" :disabled="viewOnly" @input="telegramProxy = $event" />
       <label>
         By default ElastAlert 2 will not use a network proxy to send notifications to Telegram.
         Set this option using hostname:port if you need to use a proxy.
@@ -17,17 +17,17 @@
     </praeco-form-item>
 
     <praeco-form-item label="Proxy Login" prop="telegramProxyLogin">
-      <el-input id="telegramProxyLogin" v-model="telegramProxyLogin" :disabled="viewOnly" />
+      <el-input id="telegramProxyLogin" :value="telegramProxyLogin" :disabled="viewOnly" @input="telegramProxyLogin = $event" />
       <label>The Telegram proxy auth username.</label>
     </praeco-form-item>
 
     <praeco-form-item label="Proxy Password" prop="telegramProxyPass">
-      <el-input id="telegramProxyPass" v-model="telegramProxyPass" :disabled="viewOnly" />
+      <el-input id="telegramProxyPass" :value="telegramProxyPass" :disabled="viewOnly" @input="telegramProxyPass = $event" />
       <label>The Telegram proxy auth password.</label>
     </praeco-form-item>
 
     <praeco-form-item label="Parse Mode" prop="telegramParseMode" required>
-      <el-radio-group v-model="telegramParseMode" :disabled="viewOnly">
+      <el-radio-group :value="telegramParseMode" :disabled="viewOnly" @input="telegramParseMode = $event">
         <el-radio id="telegramParseModeMarkdown" label="markdown" border>
           markdown
         </el-radio>
@@ -41,7 +41,7 @@
     </praeco-form-item>
 
     <praeco-form-item label="Thread Id" prop="telegramThreadId">
-      <el-input-number id="telegramThreadId" v-model="telegramThreadId" :disabled="viewOnly" />
+      <el-input-number id="telegramThreadId" :value="telegramThreadId" :disabled="viewOnly" @input="telegramThreadId = $event" />
       <label>Unique identifier for the target thread of supergroup/forum using telegram message_thread_id.</label>
     </praeco-form-item>
   </div>
@@ -127,5 +127,5 @@ export default {
 };
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 </style>
diff --git a/src/components/config/alert/ConfigAlertTencentSms.vue b/src/components/config/alert/ConfigAlertTencentSms.vue
index 17fa9727..105fc608 100644
--- a/src/components/config/alert/ConfigAlertTencentSms.vue
+++ b/src/components/config/alert/ConfigAlertTencentSms.vue
@@ -1,12 +1,12 @@
 <template>
   <div>
     <praeco-form-item label="Secret ID" prop="tencentSmsSecretId" required>
-      <el-input id="tencentSmsSecretId" v-model="tencentSmsSecretId" :disabled="viewOnly" />
+      <el-input id="tencentSmsSecretId" :value="tencentSmsSecretId" :disabled="viewOnly" @input="tencentSmsSecretId = $event" />
       <label>is used to identify the API caller.</label>
     </praeco-form-item>
 
     <praeco-form-item label="Secret Key" prop="tencentSmsSecretKey" required>
-      <el-input id="tencentSmsSecretKey" v-model="tencentSmsSecretKey" :disabled="viewOnly" />
+      <el-input id="tencentSmsSecretKey" :value="tencentSmsSecretKey" :disabled="viewOnly" @input="tencentSmsSecretKey = $event" />
       <label>
         is used to encrypt the string to sign that can be verified on the server.
         You should keep it private and avoid disclosure.
@@ -14,7 +14,7 @@
     </praeco-form-item>
 
     <praeco-form-item label="Sdk Appid" prop="tencentSmsSdkAppid" required>
-      <el-input id="tencentSmsSdkAppid" v-model="tencentSmsSdkAppid" :disabled="viewOnly" />
+      <el-input id="tencentSmsSdkAppid" :value="tencentSmsSdkAppid" :disabled="viewOnly" @input="tencentSmsSdkAppid = $event" />
       <label>SMS application ID, which is the SdkAppId generated after an application is added in the SMS console.</label>
     </praeco-form-item>
 
@@ -71,7 +71,7 @@
     </el-popover>
 
     <praeco-form-item label="TemplateId" prop="tencentSmsTemplateId" required>
-      <el-input id="tencentSmsTemplateId" v-model="tencentSmsTemplateId" :disabled="viewOnly" />
+      <el-input id="tencentSmsTemplateId" :value="tencentSmsTemplateId" :disabled="viewOnly" @input="tencentSmsTemplateId = $event" />
       <label>
         Template ID.
         You must enter the ID of an approved template, which can be viewed in the SMS console.
@@ -79,7 +79,7 @@
     </praeco-form-item>
 
     <praeco-form-item label="Sign Name" prop="tencentSmsSignName">
-      <el-input id="tencentSmsSignName" v-model="tencentSmsSignName" :disabled="viewOnly" />
+      <el-input id="tencentSmsSignName" :value="tencentSmsSignName" :disabled="viewOnly" @input="tencentSmsSignName = $event" />
       <label>
         Content of the SMS signature, which should be encoded in UTF-8.
         You must enter an approved signature, such as Tencent Cloud.
@@ -88,7 +88,7 @@
     </praeco-form-item>
 
     <praeco-form-item label="Region" prop="tencentSmsRegion">
-      <el-input id="tencentSmsSdkAppid" v-model="tencentSmsRegion" :disabled="viewOnly" />
+      <el-input id="tencentSmsSdkAppid" :value="tencentSmsRegion" :disabled="viewOnly" @input="tencentSmsRegion = $event" />
       <label>Region parameter, which is used to identify the region(Mainland China or Global) to which the data you want to work with belongs.</label>
     </praeco-form-item>
 
@@ -356,5 +356,5 @@ export default {
 };
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 </style>
diff --git a/src/components/config/alert/ConfigAlertTheHive.vue b/src/components/config/alert/ConfigAlertTheHive.vue
index 0251507c..1e8bd874 100644
--- a/src/components/config/alert/ConfigAlertTheHive.vue
+++ b/src/components/config/alert/ConfigAlertTheHive.vue
@@ -1,27 +1,27 @@
 <template>
   <div>
     <praeco-form-item label="Hive Alert Config Title" prop="hiveAlertConfigTitle">
-      <el-input id="hiveAlertConfigTitle" v-model="hiveAlertConfigTitle" :disabled="viewOnly" />
+      <el-input id="hiveAlertConfigTitle" :value="hiveAlertConfigTitle" :disabled="viewOnly" @input="hiveAlertConfigTitle = $event" />
       <label>Alert's description.</label>
     </praeco-form-item>
 
     <praeco-form-item label="Hive Alert Config Type" prop="hiveAlertConfigType">
-      <el-input id="hiveAlertConfigType" v-model="hiveAlertConfigType" :disabled="viewOnly" />
+      <el-input id="hiveAlertConfigType" :value="hiveAlertConfigType" :disabled="viewOnly" @input="hiveAlertConfigType = $event" />
       <label>Alert's type.</label>
     </praeco-form-item>
 
     <praeco-form-item label="Hive Alert Config Source" prop="hiveAlertConfigSource">
-      <el-input id="hiveAlertConfigSource" v-model="hiveAlertConfigSource" :disabled="viewOnly" />
+      <el-input id="hiveAlertConfigSource" :value="hiveAlertConfigSource" :disabled="viewOnly" @input="hiveAlertConfigSource = $event" />
       <label>Alert's source.</label>
     </praeco-form-item>
 
     <praeco-form-item label="Hive Alert Config Description" prop="hiveAlertConfigDescription">
-      <el-input id="hiveAlertConfigDescription" v-model="hiveAlertConfigDescription" :disabled="viewOnly" />
+      <el-input id="hiveAlertConfigDescription" :value="hiveAlertConfigDescription" :disabled="viewOnly" @input="hiveAlertConfigDescription = $event" />
       <label>Alert's description.</label>
     </praeco-form-item>
 
     <praeco-form-item label="Hive Alert Config Severity" prop="hiveAlertConfigSeverity">
-      <el-input-number id="hiveAlertConfigSeverity" v-model.number="hiveAlertConfigSeverity" :min="1" :max="4" :disabled="viewOnly" />
+      <el-input-number id="hiveAlertConfigSeverity" :value="hiveAlertConfigSeverity" :min="1" :max="4" :disabled="viewOnly" @input="hiveAlertConfigSeverity = $event" />
       <label>Alert's severity: 1, 2, 3, 4 for LOW, MEDIUM, HIGH, CRTICAL.</label>
     </praeco-form-item>
 
@@ -77,12 +77,12 @@
     </el-popover>
 
     <praeco-form-item label="Hive Alert Config Tlp" prop="hiveAlertConfigTlp">
-      <el-input-number id="hiveAlertConfigTlp" v-model.number="hiveAlertConfigTlp" :min="0" :max="3" :disabled="viewOnly" />
+      <el-input-number id="hiveAlertConfigTlp" :value="hiveAlertConfigTlp" :min="0" :max="3" :disabled="viewOnly" @input="hiveAlertConfigTlp = $event" />
       <label>Alert's TLP: 0, 1, 2, 3 for WHITE, GREEN, AMBER, RED.</label>
     </praeco-form-item>
 
     <praeco-form-item label="Hive Alert Config Status" prop="hiveAlertConfigStatus">
-      <el-radio-group v-model="hiveAlertConfigStatus" :disabled="viewOnly">
+      <el-radio-group :value="hiveAlertConfigStatus" :disabled="viewOnly" @input="hiveAlertConfigStatus = $event">
         <el-radio id="hiveAlertConfigStatusWaiting" label="Waiting" border>
           Waiting
         </el-radio>
@@ -102,7 +102,7 @@
     <el-form-item label="Hive Alert Config Follow" prop="hiveAlertConfigFollow">
       <el-switch
         id="hiveAlertConfigFollow"
-        v-model="hiveAlertConfigFollow"
+        :value="hiveAlertConfigFollow"
         :disabled="viewOnly"
         @change="changeHiveAlertConfigFollow" />
     </el-form-item>
@@ -206,11 +206,7 @@ export default {
 
   methods: {
     changeHiveAlertConfigFollow(val) {
-      if (val) {
-        this.hiveAlertConfigFollow = true;
-      } else {
-        this.hiveAlertConfigFollow = false;
-      }
+      this.hiveAlertConfigFollow = val;
     },
 
     async validate() {
@@ -267,5 +263,5 @@ export default {
 };
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 </style>
diff --git a/src/components/config/alert/ConfigAlertTwilio.vue b/src/components/config/alert/ConfigAlertTwilio.vue
index d6564e51..5af5e0e6 100644
--- a/src/components/config/alert/ConfigAlertTwilio.vue
+++ b/src/components/config/alert/ConfigAlertTwilio.vue
@@ -8,30 +8,30 @@
     </el-radio>
 
     <praeco-form-item label="Twilio Account Sid" prop="twilioAccountSid" required>
-      <el-input id="twilioAccountSid" v-model="twilioAccountSid" :disabled="viewOnly" />
+      <el-input id="twilioAccountSid" :value="twilioAccountSid" :disabled="viewOnly" @input="twilioAccountSid = $event" />
       <label>This is sid of your twilio account.</label>
     </praeco-form-item>
 
     <praeco-form-item label="Twilio Auth Token" prop="twilioAuth" required>
-      <el-input id="twilioAuth" v-model="twilioAuth" :disabled="viewOnly" />
+      <el-input id="twilioAuth" :value="twilioAuth" :disabled="viewOnly" @input="twilioAuth = $event" />
       <label>Auth token assosiated with your twilio account.</label>
     </praeco-form-item>
 
     <praeco-form-item label="Twilio To Number" prop="twilioToNumber" required>
-      <el-input id="twilioToNumber" v-model="twilioToNumber" :disabled="viewOnly" />
+      <el-input id="twilioToNumber" :value="twilioToNumber" :disabled="viewOnly" @input="twilioToNumber = $event" />
       <label>The phone number where you would like send the notification. </label>
     </praeco-form-item>
 
     <div v-if="groupTwilio === 'sms'">
       <praeco-form-item label="Twilio From Number" prop="twilioFromNumber" required>
-        <el-input id="twilioFromNumber" v-model="twilioFromNumber" :disabled="viewOnly" />
+        <el-input id="twilioFromNumber" :value="twilioFromNumber" :disabled="viewOnly" @input="twilioFromNumber = $event" />
         <label>Your twilio phone number from which message will be sent. </label>
       </praeco-form-item>
     </div>
 
     <div v-if="groupTwilio === 'copilot'">
       <praeco-form-item label="Twilio Message Service Sid" prop="twilioMessageServiceSid" required>
-        <el-input id="twilioMessageServiceSid" v-model="twilioMessageServiceSid" :disabled="viewOnly" />
+        <el-input id="twilioMessageServiceSid" :value="twilioMessageServiceSid" :disabled="viewOnly" @input="twilioMessageServiceSid = $event" />
         <label>The SID of your twilio message service.</label>
       </praeco-form-item>
     </div>
@@ -123,5 +123,5 @@ export default {
 };
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 </style>
diff --git a/src/components/config/alert/ConfigAlertVictorOps.vue b/src/components/config/alert/ConfigAlertVictorOps.vue
index beee095e..e58287d1 100644
--- a/src/components/config/alert/ConfigAlertVictorOps.vue
+++ b/src/components/config/alert/ConfigAlertVictorOps.vue
@@ -1,17 +1,17 @@
 <template>
   <div>
     <praeco-form-item label="Api Key" prop="victoropsApiKey" required>
-      <el-input id="victoropsApiKey" v-model="victoropsApiKey" :disabled="viewOnly" />
+      <el-input id="victoropsApiKey" :value="victoropsApiKey" :disabled="viewOnly" @input="victoropsApiKey = $event" />
       <label>API key generated under the ‘REST Endpoint’ in the Integrations settings.</label>
     </praeco-form-item>
 
     <praeco-form-item label="Routing Key" prop="victoropsRoutingKey" required>
-      <el-input id="victoropsRoutingKey" v-model="victoropsRoutingKey" :disabled="viewOnly" />
+      <el-input id="victoropsRoutingKey" :value="victoropsRoutingKey" :disabled="viewOnly" @input="victoropsRoutingKey = $event" />
       <label>VictorOps routing key to route the alert to.</label>
     </praeco-form-item>
 
     <praeco-form-item label="Message Type" prop="victoropsMessageType" required>
-      <el-radio-group v-model="victoropsMessageType" :disabled="viewOnly">
+      <el-radio-group :value="victoropsMessageType" :disabled="viewOnly" @input="victoropsMessageType = $event">
         <el-radio id="victoropsMessageTypeInfo" label="INFO" border>
           INFO
         </el-radio>
@@ -35,7 +35,7 @@
     </praeco-form-item>
 
     <praeco-form-item label="Entity Id" prop="victoropsEntityId">
-      <el-input id="victoropsEntityId" v-model="victoropsEntityId" :disabled="viewOnly" />
+      <el-input id="victoropsEntityId" :value="victoropsEntityId" :disabled="viewOnly" @input="victoropsEntityId = $event" />
       <label>
         The identity of the incident used by VictorOps to correlate incidents throughout the alert lifecycle.
         If not defined, VictorOps will assign a random string to each alert.
@@ -44,12 +44,12 @@
     </praeco-form-item>
 
     <praeco-form-item label="Entity Display Name" prop="victoropsEntityDisplayName">
-      <el-input id="victoropsEntityDisplayName" v-model="victoropsEntityDisplayName" :disabled="viewOnly" />
+      <el-input id="victoropsEntityDisplayName" :value="victoropsEntityDisplayName" :disabled="viewOnly" @input="victoropsEntityDisplayName = $event" />
       <label>Human-readable name of alerting entity to summarize incidents without affecting the life-cycle workflow.</label>
     </praeco-form-item>
 
     <praeco-form-item label="Proxy" prop="victoropsProxy">
-      <el-input id="victoropsProxy" v-model="victoropsProxy" :disabled="viewOnly" />
+      <el-input id="victoropsProxy" :value="victoropsProxy" :disabled="viewOnly" @input="victoropsProxy = $event" />
       <label>
         By default ElastAlert 2 will not use a network proxy to send notifications to VictorOps.
         Set this option using hostname:port if you need to use a proxy.
@@ -141,5 +141,5 @@ export default {
 };
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 </style>
diff --git a/src/components/config/alert/ConfigAlertZabbix.vue b/src/components/config/alert/ConfigAlertZabbix.vue
index 81a81aed..d932d1e1 100644
--- a/src/components/config/alert/ConfigAlertZabbix.vue
+++ b/src/components/config/alert/ConfigAlertZabbix.vue
@@ -1,29 +1,29 @@
 <template>
   <div>
     <praeco-form-item label="Zbx Sender Host" prop="zbxSenderHost" required>
-      <el-input id="zbxSenderHost" v-model="zbxSenderHost" :disabled="viewOnly" />
+      <el-input id="zbxSenderHost" :value="zbxSenderHost" :disabled="viewOnly" @input="zbxSenderHost = $event" />
       <label>The address where zabbix server is running.</label>
     </praeco-form-item>
 
     <praeco-form-item label="Zbx Sender Port" prop="zbxSenderPort" required>
-      <el-input-number id="zbxSenderPort" v-model="zbxSenderPort" :disabled="viewOnly" />
+      <el-input-number id="zbxSenderPort" :value="zbxSenderPort" :disabled="viewOnly" @input="zbxSenderPort = $event" />
       <label>The port where zabbix server is listenning.</label>
     </praeco-form-item>
 
     <praeco-form-item label="ZbxHost" prop="zbxHost" required>
-      <el-input id="zbxHost" v-model="zbxHost" :disabled="viewOnly" />
+      <el-input id="zbxHost" :value="zbxHost" :disabled="viewOnly" @input="zbxHost = $event" />
       <label>This field setup the host in zabbix that receives the value sent by ElastAlert 2.</label>
     </praeco-form-item>
 
     <praeco-form-item label="ZbxKey" prop="zbxKey" required>
-      <el-input id="zbxKey" v-model="zbxKey" :disabled="viewOnly" />
+      <el-input id="zbxKey" :value="zbxKey" :disabled="viewOnly" @input="zbxKey = $event" />
       <label>This field setup the key in the host that receives the value sent by ElastAlert 2.</label>
     </praeco-form-item>
 
     <el-form-item label="Host From Field" prop="zbxHostFromField">
       <el-switch
         id="zbxHostFromField"
-        v-model="zbxHostFromField"
+        :value="zbxHostFromField"
         :disabled="viewOnly"
         @change="changeZbxHostFromField" />
     </el-form-item>
@@ -98,15 +98,11 @@ export default {
 
   methods: {
     changeZbxHostFromField(val) {
-      if (val) {
-        this.zbxHostFromField = true;
-      } else {
-        this.zbxHostFromField = false;
-      }
+      this.zbxHostFromField = val;
     }
   }
 };
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 </style>
diff --git a/src/main.js b/src/main.js
index f332c7b1..6829c7f5 100644
--- a/src/main.js
+++ b/src/main.js
@@ -1,12 +1,102 @@
 import Vue from 'vue';
-import { Notification } from 'element-ui';
+import ElementUI, { Notification } from 'element-ui';
 import axios from 'axios';
 import VueNativeSock from 'vue-native-websocket';
 import VueSplit from 'vue-split-panel';
-import '@/contrib.js';
-import '@/registration.js';
-import '@/lib/string.js';
+import VueJsonPretty from 'vue-json-pretty';
+import Prism from 'vue-prism-component';
+import Treeselect from '@riophae/vue-treeselect';
+import 'prismjs';
+import locale from 'element-ui/lib/locale/lang/en';
+import { library } from '@fortawesome/fontawesome-svg-core';
+import {
+  faBell,
+  faChevronDown,
+  faChevronUp,
+  faEllipsisH,
+  faEnvelope,
+  faGlobe,
+  faFile,
+  faFileAlt,
+  faFolder,
+  faFolderOpen,
+  faQuestionCircle,
+  faExclamationCircle
+} from '@fortawesome/free-solid-svg-icons';
+import {
+  faSlack, faMicrosoft, faGitter, faAws, faLine, faTelegram, faJira, faRocketchat
+} from '@fortawesome/free-brands-svg-icons';
+import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';
+import 'element-ui/lib/theme-chalk/index.css';
+import 'normalize.css';
+import 'prismjs/themes/prism.css';
+import 'prismjs/components/prism-yaml.min.js';
+import '@riophae/vue-treeselect/dist/vue-treeselect.css';
+
+import ECharts from 'vue-echarts';
+
 import cronLight from '@vue-js-cron/light';
+import Bulb from '@/components/Bulb';
+import DateTime from '@/components/DateTime';
+import DefinitionTable from '@/components/DefinitionTable';
+import ElastalertTimePicker from '@/components/ElastalertTimePicker';
+import ESChart from '@/components/ESChart';
+import EventTable from '@/components/EventTable';
+import ExpandableAlert from '@/components/ExpandableAlert';
+import FolderTree from '@/components/FolderTree';
+import NavTree from '@/components/NavTree';
+import PraecoFormItem from '@/components/PraecoFormItem';
+import TableRow from '@/components/TableRow';
+import ElastalertTimeView from '@/components/ElastalertTimeView';
+import ConfigQuery from '@/components/config/ConfigQuery.vue';
+import ConfigAggregation from '@/components/config/ConfigAggregation.vue';
+import ConfigAlert from '@/components/config/alert/ConfigAlert.vue';
+import ConfigAlertAlerta from '@/components/config/alert/ConfigAlertAlerta.vue';
+import ConfigAlertAlertmanager from '@/components/config/alert/ConfigAlertAlertmanager.vue';
+import ConfigAlertAmazonSes from '@/components/config/alert/ConfigAlertAmazonSes.vue';
+import ConfigAlertAmazonSns from '@/components/config/alert/ConfigAlertAmazonSns.vue';
+import ConfigAlertChatwork from '@/components/config/alert/ConfigAlertChatwork.vue';
+import ConfigAlertCommand from '@/components/config/alert/ConfigAlertCommand.vue';
+import ConfigAlertDatadog from '@/components/config/alert/ConfigAlertDatadog.vue';
+import ConfigAlertDingtalk from '@/components/config/alert/ConfigAlertDingtalk.vue';
+import ConfigAlertDiscord from '@/components/config/alert/ConfigAlertDiscord.vue';
+import ConfigAlertEmail from '@/components/config/alert/ConfigAlertEmail.vue';
+import ConfigAlertExotel from '@/components/config/alert/ConfigAlertExotel.vue';
+import ConfigAlertGelf from '@/components/config/alert/ConfigAlertGelf.vue';
+import ConfigAlertGitter from '@/components/config/alert/ConfigAlertGitter.vue';
+import ConfigAlertGoogleChat from '@/components/config/alert/ConfigAlertGoogleChat.vue';
+import ConfigAlertHttpPost from '@/components/config/alert/ConfigAlertHttpPost.vue';
+import ConfigAlertHttpPost2 from '@/components/config/alert/ConfigAlertHttpPost2.vue';
+import ConfigAlertIris from '@/components/config/alert/ConfigAlertIris.vue';
+import ConfigAlertJira from '@/components/config/alert/ConfigAlertJira.vue';
+import ConfigAlertLark from '@/components/config/alert/ConfigAlertLark.vue';
+import ConfigAlertLineNotify from '@/components/config/alert/ConfigAlertLineNotify.vue';
+import ConfigAlertMattermost from '@/components/config/alert/ConfigAlertMattermost.vue';
+import ConfigAlertMsTeams from '@/components/config/alert/ConfigAlertMsTeams.vue';
+import ConfigAlertPagerDuty from '@/components/config/alert/ConfigAlertPagerDuty.vue';
+import ConfigAlertPagerTree from '@/components/config/alert/ConfigAlertPagerTree.vue';
+import ConfigAlertRocketChat from '@/components/config/alert/ConfigAlertRocketChat.vue';
+import ConfigAlertServiceNow from '@/components/config/alert/ConfigAlertServiceNow.vue';
+import ConfigAlertSlack from '@/components/config/alert/ConfigAlertSlack.vue';
+import ConfigAlertStomp from '@/components/config/alert/ConfigAlertStomp.vue';
+import ConfigAlertTencentSms from '@/components/config/alert/ConfigAlertTencentSms.vue';
+import ConfigAlertTelegram from '@/components/config/alert/ConfigAlertTelegram.vue';
+import ConfigAlertTheHive from '@/components/config/alert/ConfigAlertTheHive.vue';
+import ConfigAlertTwilio from '@/components/config/alert/ConfigAlertTwilio.vue';
+import ConfigAlertOpsgenie from '@/components/config/alert/ConfigAlertOpsgenie.vue';
+import ConfigAlertVictorOps from '@/components/config/alert/ConfigAlertVictorOps.vue';
+import ConfigAlertZabbix from '@/components/config/alert/ConfigAlertZabbix.vue';
+import ConfigKibanaDiscover from '@/components/config/ConfigKibanaDiscover.vue';
+import ConfigTimeWindowFeature from '@/components/config/ConfigTimeWindowFeature.vue';
+import ConfigOwner from '@/components/config/ConfigOwner.vue';
+import ConfigPriority from '@/components/config/ConfigPriority.vue';
+import ConfigDescription from '@/components/config/ConfigDescription.vue';
+import ConfigSettings from '@/components/config/ConfigSettings.vue';
+import ConfigCondition from '@/components/config/ConfigCondition.vue';
+import ConfigScanEntireTimeframe from '@/components/config/ConfigScanEntireTimeframe.vue';
+import ConfigLimitExcecution from '@/components/config/ConfigLimitExcecution.vue';
+
+import '@/lib/string.js';
 import { initLogging, logger } from './lib/logger.js';
 import App from './App.vue';
 import router from './router';
@@ -21,9 +111,100 @@ import './style/element.scss';
 import './style/pop-trigger.scss';
 import '@vue-js-cron/light/dist/light.css';
 
+library.add(
+  faBell,
+  faFile,
+  faFileAlt,
+  faSlack,
+  faRocketchat,
+  faMicrosoft,
+  faGitter,
+  faAws,
+  faLine,
+  faTelegram,
+  faJira,
+  faGlobe,
+  faEnvelope,
+  faChevronUp,
+  faChevronDown,
+  faEllipsisH,
+  faFolder,
+  faFolderOpen,
+  faQuestionCircle,
+  faExclamationCircle
+);
+
 Vue.use(cronLight);
 Vue.use(VueSplit);
 
+Vue.use(ElementUI, { locale, size: 'mini' });
+
+Vue.component('VChart', ECharts);
+Vue.component('Icon', FontAwesomeIcon);
+Vue.component('VueJsonPretty', VueJsonPretty);
+Vue.component('Prism', Prism);
+Vue.component('Treeselect', Treeselect);
+
+Vue.component('Bulb', Bulb);
+Vue.component('DateTime', DateTime);
+Vue.component('ConfigQuery', ConfigQuery);
+Vue.component('ConfigAlert', ConfigAlert);
+Vue.component('ConfigAlertAlerta', ConfigAlertAlerta);
+Vue.component('ConfigAlertAlertmanager', ConfigAlertAlertmanager);
+Vue.component('ConfigAlertAmazonSes', ConfigAlertAmazonSes);
+Vue.component('ConfigAlertAmazonSns', ConfigAlertAmazonSns);
+Vue.component('ConfigAlertChatwork', ConfigAlertChatwork);
+Vue.component('ConfigAlertCommand', ConfigAlertCommand);
+Vue.component('ConfigAlertDatadog', ConfigAlertDatadog);
+Vue.component('ConfigAlertDingtalk', ConfigAlertDingtalk);
+Vue.component('ConfigAlertDiscord', ConfigAlertDiscord);
+Vue.component('ConfigAlertEmail', ConfigAlertEmail);
+Vue.component('ConfigAlertExotel', ConfigAlertExotel);
+Vue.component('ConfigAlertGelf', ConfigAlertGelf);
+Vue.component('ConfigAlertGitter', ConfigAlertGitter);
+Vue.component('ConfigAlertGoogleChat', ConfigAlertGoogleChat);
+Vue.component('ConfigAlertHttpPost', ConfigAlertHttpPost);
+Vue.component('ConfigAlertHttpPost2', ConfigAlertHttpPost2);
+Vue.component('ConfigAlertIris', ConfigAlertIris);
+Vue.component('ConfigAlertJira', ConfigAlertJira);
+Vue.component('ConfigAlertLark', ConfigAlertLark);
+Vue.component('ConfigAlertLineNotify', ConfigAlertLineNotify);
+Vue.component('ConfigAlertMattermost', ConfigAlertMattermost);
+Vue.component('ConfigAlertMsTeams', ConfigAlertMsTeams);
+Vue.component('ConfigAlertPagerDuty', ConfigAlertPagerDuty);
+Vue.component('ConfigAlertPagerTree', ConfigAlertPagerTree);
+Vue.component('ConfigAlertRocketChat', ConfigAlertRocketChat);
+Vue.component('ConfigAlertServiceNow', ConfigAlertServiceNow);
+Vue.component('ConfigAlertSlack', ConfigAlertSlack);
+Vue.component('ConfigAlertStomp', ConfigAlertStomp);
+Vue.component('ConfigAlertTencentSms', ConfigAlertTencentSms);
+Vue.component('ConfigAlertTelegram', ConfigAlertTelegram);
+Vue.component('ConfigAlertTheHive', ConfigAlertTheHive);
+Vue.component('ConfigAlertTwilio', ConfigAlertTwilio);
+Vue.component('ConfigAlertOpsgenie', ConfigAlertOpsgenie);
+Vue.component('ConfigAlertVictorOps', ConfigAlertVictorOps);
+Vue.component('ConfigAlertZabbix', ConfigAlertZabbix);
+Vue.component('ConfigAggregation', ConfigAggregation);
+Vue.component('ConfigSettings', ConfigSettings);
+Vue.component('ConfigKibanaDiscover', ConfigKibanaDiscover);
+Vue.component('ConfigTimeWindowFeature', ConfigTimeWindowFeature);
+Vue.component('ConfigOwner', ConfigOwner);
+Vue.component('ConfigPriority', ConfigPriority);
+Vue.component('ConfigDescription', ConfigDescription);
+Vue.component('ConfigCondition', ConfigCondition);
+Vue.component('ConfigScanEntireTimeframe', ConfigScanEntireTimeframe);
+Vue.component('ConfigLimitExcecution', ConfigLimitExcecution);
+Vue.component('DefinitionTable', DefinitionTable);
+Vue.component('ElastalertTimePicker', ElastalertTimePicker);
+Vue.component('ESChart', ESChart);
+Vue.component('EventTable', EventTable);
+Vue.component('ExpandableAlert', ExpandableAlert);
+Vue.component('FolderTree', FolderTree);
+Vue.component('NavTree', NavTree);
+Vue.component('PraecoFormItem', PraecoFormItem);
+Vue.component('TableRow', TableRow);
+Vue.component('ElastalertTimeView', ElastalertTimeView);
+
 Vue.config.productionTip = false;
 
 Vue.config.errorHandler = function(err, vm, info) {
diff --git a/src/store/config/alert.js b/src/store/config/alert.js
index 2373772b..3ca4f3c2 100644
--- a/src/store/config/alert.js
+++ b/src/store/config/alert.js
@@ -248,7 +248,7 @@ function initialState() {
 
     /* MS Teams */
     msTeamsWebhookUrl: [],
-    msTeamsThemeColor: '#ff0000',
+    msTeamsThemeColor: '',
     msTeamsAlertFixedWidth: false,
     msTeamsAlertSummary: 'ElastAlert Message',
     msTeamsProxy: '',
diff --git a/src/store/config/index.js b/src/store/config/index.js
index 973e192e..6abe26f4 100644
--- a/src/store/config/index.js
+++ b/src/store/config/index.js
@@ -1674,48 +1674,30 @@ export default {
 
       if (state.alert.generateKibanaDiscoverUrl) {
         config.generate_kibana_discover_url = state.alert.generateKibanaDiscoverUrl;
-      } else {
-        config.generate_kibana_discover_url = false;
 
-        if (state.alert.alert.includes('slack')) {
-          config.slack_attach_kibana_discover_url = false;
+        if (state.alert.kibanaDiscoverAppUrl) {
+          config.kibana_discover_app_url = state.alert.kibanaDiscoverAppUrl;
         }
 
-        if (state.alert.alert.includes('rocketchat')) {
-          config.rocket_chat_attach_kibana_discover_url = false;
+        if (state.alert.kibanaDiscoverVersion) {
+          config.kibana_discover_version = state.alert.kibanaDiscoverVersion;
         }
 
-        if (state.alert.alert.includes('mattermost')) {
-          config.mattermost_attach_kibana_discover_url = false;
+        if (state.alert.kibanaDiscoverIndexPatternId) {
+          config.kibana_discover_index_pattern_id = state.alert.kibanaDiscoverIndexPatternId;
         }
 
-        if (state.alert.alert.includes('ms_teams')) {
-          config.ms_teams_attach_kibana_discover_url = false;
+        if (state.alert.kibanaDiscoverColumns && state.alert.kibanaDiscoverColumns.length) {
+          config.kibana_discover_columns = state.alert.kibanaDiscoverColumns;
         }
-      }
-
-      if (state.alert.kibanaDiscoverAppUrl) {
-        config.kibana_discover_app_url = state.alert.kibanaDiscoverAppUrl;
-      }
-
-      if (state.alert.kibanaDiscoverVersion) {
-        config.kibana_discover_version = state.alert.kibanaDiscoverVersion;
-      }
 
-      if (state.alert.kibanaDiscoverIndexPatternId) {
-        config.kibana_discover_index_pattern_id = state.alert.kibanaDiscoverIndexPatternId;
-      }
-
-      if (state.alert.kibanaDiscoverColumns && state.alert.kibanaDiscoverColumns.length) {
-        config.kibana_discover_columns = state.alert.kibanaDiscoverColumns;
-      }
-
-      if (state.alert.kibanaDiscoverFromTimedelta) {
-        config.kibana_discover_from_timedelta = state.alert.kibanaDiscoverFromTimedelta;
-      }
+        if (state.alert.kibanaDiscoverFromTimedelta) {
+          config.kibana_discover_from_timedelta = state.alert.kibanaDiscoverFromTimedelta;
+        }
 
-      if (state.alert.kibanaDiscoverToTimedelta) {
-        config.kibana_discover_to_timedelta = state.alert.kibanaDiscoverToTimedelta;
+        if (state.alert.kibanaDiscoverToTimedelta) {
+          config.kibana_discover_to_timedelta = state.alert.kibanaDiscoverToTimedelta;
+        }
       }
 
       return config;
@@ -1844,14 +1826,16 @@ export default {
         config.slack_timeout = state.alert.slackTimeout;
       }
 
-      config.slack_attach_kibana_discover_url = state.alert.slackAttachKibanaDiscoverUrl;
+      if (state.alert.generateKibanaDiscoverUrl && state.alert.slackAttachKibanaDiscoverUrl) {
+        config.slack_attach_kibana_discover_url = state.alert.slackAttachKibanaDiscoverUrl;
 
-      if (state.alert.slackKibanaDiscoverColor) {
-        config.slack_kibana_discover_color = state.alert.slackKibanaDiscoverColor;
-      }
+        if (state.alert.slackKibanaDiscoverColor) {
+          config.slack_kibana_discover_color = state.alert.slackKibanaDiscoverColor;
+        }
 
-      if (state.alert.slackKibanaDiscoverTitle) {
-        config.slack_kibana_discover_title = state.alert.slackKibanaDiscoverTitle;
+        if (state.alert.slackKibanaDiscoverTitle) {
+          config.slack_kibana_discover_title = state.alert.slackKibanaDiscoverTitle;
+        }
       }
 
       if (state.alert.slackProxy) {
@@ -1890,8 +1874,9 @@ export default {
         config.slack_msg_pretext = state.alert.slackMsgPretext;
       }
 
-      config.slack_attach_jira_ticket_url = state.alert.slackAttachJiraTicketUrl;
-      if (config.slack_attach_jira_ticket_url) {
+      if (state.alert.slackAttachJiraTicketUrl) {
+        config.slack_attach_jira_ticket_url = state.alert.slackAttachJiraTicketUrl;
+
         if (state.alert.slackJiraTicketColor) {
           config.slack_jira_ticket_color = state.alert.slackJiraTicketColor;
         }
@@ -1935,10 +1920,12 @@ export default {
         config.ms_teams_ca_certs = state.alert.msTeamsCaCerts;
       }
 
-      config.ms_teams_attach_kibana_discover_url = state.alert.msTeamsAttachKibanaDiscoverUrl;
+      if (state.alert.generateKibanaDiscoverUrl && state.alert.msTeamsAttachKibanaDiscoverUrl) {
+        config.ms_teams_attach_kibana_discover_url = state.alert.msTeamsAttachKibanaDiscoverUrl;
 
-      if (state.alert.msTeamsKibanaDiscoverTitle) {
-        config.ms_teams_kibana_discover_title = state.alert.msTeamsKibanaDiscoverTitle;
+        if (state.alert.msTeamsKibanaDiscoverTitle) {
+          config.ms_teams_kibana_discover_title = state.alert.msTeamsKibanaDiscoverTitle;
+        }
       }
 
       return config;
@@ -2748,14 +2735,16 @@ export default {
         config.mattermost_author_icon = state.alert.mattermostAuthorIcon;
       }
 
-      config.mattermost_attach_kibana_discover_url = state.alert.mattermostAttachKibanaDiscoverUrl;
+      if (state.alert.generateKibanaDiscoverUrl && state.alert.mattermostAttachKibanaDiscoverUrl) {
+        config.mattermost_attach_kibana_discover_url = state.alert.mattermostAttachKibanaDiscoverUrl;
 
-      if (state.alert.mattermostKibanaDiscoverColor) {
-        config.mattermost_kibana_discover_color = state.alert.mattermostKibanaDiscoverColor;
-      }
+        if (state.alert.mattermostKibanaDiscoverColor) {
+          config.mattermost_kibana_discover_color = state.alert.mattermostKibanaDiscoverColor;
+        }
 
-      if (state.alert.mattermostKibanaDiscoverTitle) {
-        config.mattermost_kibana_discover_title = state.alert.mattermostKibanaDiscoverTitle;
+        if (state.alert.mattermostKibanaDiscoverTitle) {
+          config.mattermost_kibana_discover_title = state.alert.mattermostKibanaDiscoverTitle;
+        }
       }
 
       return config;
@@ -2792,14 +2781,16 @@ export default {
         config.rocket_chat_proxy = state.alert.rocketChatProxy;
       }
 
-      config.rocket_chat_attach_kibana_discover_url = state.alert.rocketChatAttachKibanaDiscoverUrl;
+      if (state.alert.generateKibanaDiscoverUrl && state.alert.rocketChatAttachKibanaDiscoverUrl) {
+        config.rocket_chat_attach_kibana_discover_url = state.alert.rocketChatAttachKibanaDiscoverUrl;
 
-      if (state.alert.rocketChatKibanaDiscoverColor) {
-        config.rocket_chat_kibana_discover_color = state.alert.rocketChatKibanaDiscoverColor;
-      }
+        if (state.alert.rocketChatKibanaDiscoverColor) {
+          config.rocket_chat_kibana_discover_color = state.alert.rocketChatKibanaDiscoverColor;
+        }
 
-      if (state.alert.rocketChatKibanaDiscoverTitle) {
-        config.rocket_chat_kibana_discover_title = state.alert.rocketChatKibanaDiscoverTitle;
+        if (state.alert.rocketChatKibanaDiscoverTitle) {
+          config.rocket_chat_kibana_discover_title = state.alert.rocketChatKibanaDiscoverTitle;
+        }
       }
 
       if (state.alert.rocketChatIgnoreSslErrors) {
diff --git a/tests/unit/mockData/alert/ruleDataIris002.js b/tests/unit/mockData/alert/ruleDataIris002.js
index b83df7c4..93ef9a8e 100644
--- a/tests/unit/mockData/alert/ruleDataIris002.js
+++ b/tests/unit/mockData/alert/ruleDataIris002.js
@@ -19,7 +19,6 @@ iris_alert_source_link: b
 iris_alert_status_id: 3
 iris_alert_tags: c
 iris_api_token: abcdefghijklmnopqrstuvwxyz
-iris_ca_cert: true
 iris_case_template_id: 5
 iris_customer_id: 4
 iris_description: d
diff --git a/tests/unit/specs/ConfigYamlScanEntireTimefame.spec.js b/tests/unit/specs/ConfigYamlScanEntireTimefame.spec.js
index dac4470e..9a701633 100644
--- a/tests/unit/specs/ConfigYamlScanEntireTimefame.spec.js
+++ b/tests/unit/specs/ConfigYamlScanEntireTimefame.spec.js
@@ -30,7 +30,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlAlerta.spec.js b/tests/unit/specs/alert/ConfigYamlAlerta.spec.js
index 83eae553..2ea2ab6b 100644
--- a/tests/unit/specs/alert/ConfigYamlAlerta.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlAlerta.spec.js
@@ -36,7 +36,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlAlerta002.spec.js b/tests/unit/specs/alert/ConfigYamlAlerta002.spec.js
index 19d62f8a..26fcd502 100644
--- a/tests/unit/specs/alert/ConfigYamlAlerta002.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlAlerta002.spec.js
@@ -48,7 +48,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlAlertaOpt.spec.js b/tests/unit/specs/alert/ConfigYamlAlertaOpt.spec.js
index dc6ba91e..00f1cc32 100644
--- a/tests/unit/specs/alert/ConfigYamlAlertaOpt.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlAlertaOpt.spec.js
@@ -37,7 +37,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlAlertmanager.spec.js b/tests/unit/specs/alert/ConfigYamlAlertmanager.spec.js
index 99c0d182..0ea6762e 100644
--- a/tests/unit/specs/alert/ConfigYamlAlertmanager.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlAlertmanager.spec.js
@@ -30,7 +30,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlAlertmanager002.spec.js b/tests/unit/specs/alert/ConfigYamlAlertmanager002.spec.js
index e349a421..189ab0f2 100644
--- a/tests/unit/specs/alert/ConfigYamlAlertmanager002.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlAlertmanager002.spec.js
@@ -30,7 +30,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlChatwork.spec.js b/tests/unit/specs/alert/ConfigYamlChatwork.spec.js
index 6270e47e..e65d3450 100644
--- a/tests/unit/specs/alert/ConfigYamlChatwork.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlChatwork.spec.js
@@ -28,7 +28,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlCommand.spec.js b/tests/unit/specs/alert/ConfigYamlCommand.spec.js
index 0f3993ae..94d865d9 100644
--- a/tests/unit/specs/alert/ConfigYamlCommand.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlCommand.spec.js
@@ -25,7 +25,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlDataDatadog.spec.js b/tests/unit/specs/alert/ConfigYamlDataDatadog.spec.js
index c01d6d18..9ae41430 100644
--- a/tests/unit/specs/alert/ConfigYamlDataDatadog.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlDataDatadog.spec.js
@@ -25,7 +25,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlDingtalk.spec.js b/tests/unit/specs/alert/ConfigYamlDingtalk.spec.js
index 08f5546a..a91a4ba3 100644
--- a/tests/unit/specs/alert/ConfigYamlDingtalk.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlDingtalk.spec.js
@@ -25,7 +25,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlDingtalk002.spec.js b/tests/unit/specs/alert/ConfigYamlDingtalk002.spec.js
index 8f1efb8e..9b4987c2 100644
--- a/tests/unit/specs/alert/ConfigYamlDingtalk002.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlDingtalk002.spec.js
@@ -27,7 +27,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlDingtalk003.spec.js b/tests/unit/specs/alert/ConfigYamlDingtalk003.spec.js
index 3269c976..882993cb 100644
--- a/tests/unit/specs/alert/ConfigYamlDingtalk003.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlDingtalk003.spec.js
@@ -27,7 +27,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlDingtalk004.spec.js b/tests/unit/specs/alert/ConfigYamlDingtalk004.spec.js
index d406bfcd..30407330 100644
--- a/tests/unit/specs/alert/ConfigYamlDingtalk004.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlDingtalk004.spec.js
@@ -26,7 +26,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlDiscord.spec.js b/tests/unit/specs/alert/ConfigYamlDiscord.spec.js
index e9e9b28f..7f03ebee 100644
--- a/tests/unit/specs/alert/ConfigYamlDiscord.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlDiscord.spec.js
@@ -30,7 +30,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlDiscordOpt.spec.js b/tests/unit/specs/alert/ConfigYamlDiscordOpt.spec.js
index 73a2864f..774ecd32 100644
--- a/tests/unit/specs/alert/ConfigYamlDiscordOpt.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlDiscordOpt.spec.js
@@ -30,7 +30,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlEmail.spec.js b/tests/unit/specs/alert/ConfigYamlEmail.spec.js
index 5d6a3ed0..f2bf8a79 100644
--- a/tests/unit/specs/alert/ConfigYamlEmail.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlEmail.spec.js
@@ -33,7 +33,6 @@ filter:
       query_string:
         query: "@timestamp:*"
 from_addr: "abc"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlEmail002.spec.js b/tests/unit/specs/alert/ConfigYamlEmail002.spec.js
index 25429965..91b59f72 100644
--- a/tests/unit/specs/alert/ConfigYamlEmail002.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlEmail002.spec.js
@@ -36,7 +36,6 @@ filter:
       query_string:
         query: "@timestamp:*"
 from_addr: "abc"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlExotel.spec.js b/tests/unit/specs/alert/ConfigYamlExotel.spec.js
index 52a7691a..3575f6fc 100644
--- a/tests/unit/specs/alert/ConfigYamlExotel.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlExotel.spec.js
@@ -25,7 +25,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlGelf001.spec.js b/tests/unit/specs/alert/ConfigYamlGelf001.spec.js
index 30bfb326..107ffe40 100644
--- a/tests/unit/specs/alert/ConfigYamlGelf001.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlGelf001.spec.js
@@ -29,7 +29,6 @@ gelf_http_ignore_ssl_errors: true
 gelf_log_level: 0
 gelf_timeout: 10
 gelf_type: "http"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlGelf002.spec.js b/tests/unit/specs/alert/ConfigYamlGelf002.spec.js
index bda59e05..d105ea03 100644
--- a/tests/unit/specs/alert/ConfigYamlGelf002.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlGelf002.spec.js
@@ -29,7 +29,6 @@ gelf_log_level: 0
 gelf_port: 10500
 gelf_timeout: 10
 gelf_type: "tcp"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlGitter.spec.js b/tests/unit/specs/alert/ConfigYamlGitter.spec.js
index fc9a5111..7ab6a1dc 100644
--- a/tests/unit/specs/alert/ConfigYamlGitter.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlGitter.spec.js
@@ -23,7 +23,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 gitter_msg_level: "error"
 gitter_webhook_url: "https://xxxxxxxxxxxxxx/webhook/xxxxxxxx"
 import: "BaseRule.config"
diff --git a/tests/unit/specs/alert/ConfigYamlGitterOpt.spec.js b/tests/unit/specs/alert/ConfigYamlGitterOpt.spec.js
index c1699a2d..ce0e2e75 100644
--- a/tests/unit/specs/alert/ConfigYamlGitterOpt.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlGitterOpt.spec.js
@@ -23,7 +23,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 gitter_msg_level: "info"
 gitter_proxy: "hostname:8080"
 gitter_webhook_url: "https://xxxxxxxxxxxxxx/webhook/xxxxxxxx"
diff --git a/tests/unit/specs/alert/ConfigYamlGoogleChat.spec.js b/tests/unit/specs/alert/ConfigYamlGoogleChat.spec.js
index 9497971a..3ad8ac1a 100644
--- a/tests/unit/specs/alert/ConfigYamlGoogleChat.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlGoogleChat.spec.js
@@ -23,7 +23,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 googlechat_footer_kibanalink: "http://example/cde"
 googlechat_format: "basic"
 googlechat_header_image: "http://example/abc.png"
diff --git a/tests/unit/specs/alert/ConfigYamlGoogleChat002.spec.js b/tests/unit/specs/alert/ConfigYamlGoogleChat002.spec.js
index d8525da2..a8dc0a4f 100644
--- a/tests/unit/specs/alert/ConfigYamlGoogleChat002.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlGoogleChat002.spec.js
@@ -23,7 +23,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 googlechat_footer_kibanalink: "http://example/cde"
 googlechat_format: "card"
 googlechat_header_image: "http://example/abc.png"
diff --git a/tests/unit/specs/alert/ConfigYamlHttpPost.spec.js b/tests/unit/specs/alert/ConfigYamlHttpPost.spec.js
index 185e39c8..4e90b81d 100644
--- a/tests/unit/specs/alert/ConfigYamlHttpPost.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlHttpPost.spec.js
@@ -20,7 +20,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 http_post_timeout: 10
 http_post_url:
   - "http://localhost/webhook"
diff --git a/tests/unit/specs/alert/ConfigYamlHttpPost002.spec.js b/tests/unit/specs/alert/ConfigYamlHttpPost002.spec.js
index c699759b..665f3809 100644
--- a/tests/unit/specs/alert/ConfigYamlHttpPost002.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlHttpPost002.spec.js
@@ -20,7 +20,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 http_post_timeout: 10
 http_post_url:
   - "http://localhost/webhook"
diff --git a/tests/unit/specs/alert/ConfigYamlHttpPost2.spec.js b/tests/unit/specs/alert/ConfigYamlHttpPost2.spec.js
index f52d7172..d59ff309 100644
--- a/tests/unit/specs/alert/ConfigYamlHttpPost2.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlHttpPost2.spec.js
@@ -20,7 +20,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 http_post2_timeout: 10
 http_post2_url:
   - "http://localhost/webhook"
diff --git a/tests/unit/specs/alert/ConfigYamlHttpPost2Opt.spec.js b/tests/unit/specs/alert/ConfigYamlHttpPost2Opt.spec.js
index 1fb54fc6..e8138b14 100644
--- a/tests/unit/specs/alert/ConfigYamlHttpPost2Opt.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlHttpPost2Opt.spec.js
@@ -20,7 +20,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 http_post2_ca_certs: "/etc/certs/cert.pem"
 http_post2_ignore_ssl_errors: true
 http_post2_proxy: "host:8080"
diff --git a/tests/unit/specs/alert/ConfigYamlHttpPostOpt.spec.js b/tests/unit/specs/alert/ConfigYamlHttpPostOpt.spec.js
index 8d1f095e..0f09ee54 100644
--- a/tests/unit/specs/alert/ConfigYamlHttpPostOpt.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlHttpPostOpt.spec.js
@@ -20,7 +20,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 http_post_ca_certs: "/etc/certs/cert.pem"
 http_post_ignore_ssl_errors: true
 http_post_proxy: "host:8080"
diff --git a/tests/unit/specs/alert/ConfigYamlIris.spec.js b/tests/unit/specs/alert/ConfigYamlIris.spec.js
index e306dc71..13507a2d 100644
--- a/tests/unit/specs/alert/ConfigYamlIris.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlIris.spec.js
@@ -23,7 +23,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 iris_alert_severity_id: 1
diff --git a/tests/unit/specs/alert/ConfigYamlIris002.spec.js b/tests/unit/specs/alert/ConfigYamlIris002.spec.js
index 9a1cc0f6..10733d71 100644
--- a/tests/unit/specs/alert/ConfigYamlIris002.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlIris002.spec.js
@@ -23,7 +23,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 iris_alert_note: "a"
diff --git a/tests/unit/specs/alert/ConfigYamlJira.spec.js b/tests/unit/specs/alert/ConfigYamlJira.spec.js
index 933c9727..3c5beca5 100644
--- a/tests/unit/specs/alert/ConfigYamlJira.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlJira.spec.js
@@ -23,7 +23,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlLark.spec.js b/tests/unit/specs/alert/ConfigYamlLark.spec.js
index 3b84cd98..3d40f7a4 100644
--- a/tests/unit/specs/alert/ConfigYamlLark.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlLark.spec.js
@@ -23,7 +23,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlLineNotify.spec.js b/tests/unit/specs/alert/ConfigYamlLineNotify.spec.js
index fd254910..3f852472 100644
--- a/tests/unit/specs/alert/ConfigYamlLineNotify.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlLineNotify.spec.js
@@ -23,7 +23,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlMattermost.spec.js b/tests/unit/specs/alert/ConfigYamlMattermost.spec.js
index 17d0b4fe..e7a79e6d 100644
--- a/tests/unit/specs/alert/ConfigYamlMattermost.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlMattermost.spec.js
@@ -23,17 +23,13 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
 match_enhancements: []
-mattermost_attach_kibana_discover_url: false
 mattermost_channel_override:
   - "#elastalert-debugging"
 mattermost_emoji_override: ":ghost:"
-mattermost_kibana_discover_color: "#ec4b98"
-mattermost_kibana_discover_title: "Discover in Kibana"
 mattermost_msg_color: "danger"
 mattermost_username_override: "elastalert"
 mattermost_webhook_url:
diff --git a/tests/unit/specs/alert/ConfigYamlMsTeams.spec.js b/tests/unit/specs/alert/ConfigYamlMsTeams.spec.js
index f8f5156f..96b05a8e 100644
--- a/tests/unit/specs/alert/ConfigYamlMsTeams.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlMsTeams.spec.js
@@ -23,14 +23,11 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
 match_enhancements: []
 ms_teams_alert_summary: "ElastAlert Message"
-ms_teams_attach_kibana_discover_url: false
-ms_teams_kibana_discover_title: "Discover in Kibana"
 ms_teams_webhook_url:
   - "https://xxxxxxxxxxxxxxxxxxxxxx/xxxx"
 name: "test123"
diff --git a/tests/unit/specs/alert/ConfigYamlOpsgenie.spec.js b/tests/unit/specs/alert/ConfigYamlOpsgenie.spec.js
index f593214e..847181b5 100644
--- a/tests/unit/specs/alert/ConfigYamlOpsgenie.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlOpsgenie.spec.js
@@ -23,7 +23,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlOpsgenie002.spec.js b/tests/unit/specs/alert/ConfigYamlOpsgenie002.spec.js
index 615c0a20..cac9c8e5 100644
--- a/tests/unit/specs/alert/ConfigYamlOpsgenie002.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlOpsgenie002.spec.js
@@ -23,7 +23,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlOpsgenie003.spec.js b/tests/unit/specs/alert/ConfigYamlOpsgenie003.spec.js
index ae6a60b1..93e14acc 100644
--- a/tests/unit/specs/alert/ConfigYamlOpsgenie003.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlOpsgenie003.spec.js
@@ -23,7 +23,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlOpsgenie004.spec.js b/tests/unit/specs/alert/ConfigYamlOpsgenie004.spec.js
index ebd7b1d8..6492ed35 100644
--- a/tests/unit/specs/alert/ConfigYamlOpsgenie004.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlOpsgenie004.spec.js
@@ -23,7 +23,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlOpsgenie005.spec.js b/tests/unit/specs/alert/ConfigYamlOpsgenie005.spec.js
index 40859542..7c8b8309 100644
--- a/tests/unit/specs/alert/ConfigYamlOpsgenie005.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlOpsgenie005.spec.js
@@ -23,7 +23,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlOpsgenie006.spec.js b/tests/unit/specs/alert/ConfigYamlOpsgenie006.spec.js
index 98083f24..0c8eb44e 100644
--- a/tests/unit/specs/alert/ConfigYamlOpsgenie006.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlOpsgenie006.spec.js
@@ -23,7 +23,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlPagerDuty.spec.js b/tests/unit/specs/alert/ConfigYamlPagerDuty.spec.js
index b394342c..1f4a85a9 100644
--- a/tests/unit/specs/alert/ConfigYamlPagerDuty.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlPagerDuty.spec.js
@@ -23,7 +23,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlPagerDuty002.spec.js b/tests/unit/specs/alert/ConfigYamlPagerDuty002.spec.js
index 67074771..3628566d 100644
--- a/tests/unit/specs/alert/ConfigYamlPagerDuty002.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlPagerDuty002.spec.js
@@ -23,7 +23,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlPagerDuty003.spec.js b/tests/unit/specs/alert/ConfigYamlPagerDuty003.spec.js
index e7d4319f..e1c4e7b5 100644
--- a/tests/unit/specs/alert/ConfigYamlPagerDuty003.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlPagerDuty003.spec.js
@@ -23,7 +23,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlPagerDuty004.spec.js b/tests/unit/specs/alert/ConfigYamlPagerDuty004.spec.js
index 7abb397a..66eeef02 100644
--- a/tests/unit/specs/alert/ConfigYamlPagerDuty004.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlPagerDuty004.spec.js
@@ -23,7 +23,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlPagerDuty005.spec.js b/tests/unit/specs/alert/ConfigYamlPagerDuty005.spec.js
index 226f94f3..ce5cfcc2 100644
--- a/tests/unit/specs/alert/ConfigYamlPagerDuty005.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlPagerDuty005.spec.js
@@ -23,7 +23,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlPagerTree.spec.js b/tests/unit/specs/alert/ConfigYamlPagerTree.spec.js
index f70d5414..193ccca6 100644
--- a/tests/unit/specs/alert/ConfigYamlPagerTree.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlPagerTree.spec.js
@@ -23,7 +23,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlRocketChat.spec.js b/tests/unit/specs/alert/ConfigYamlRocketChat.spec.js
index e5035277..233ec8d4 100644
--- a/tests/unit/specs/alert/ConfigYamlRocketChat.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlRocketChat.spec.js
@@ -23,7 +23,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
@@ -32,10 +31,7 @@ name: "test123"
 num_events: 10000
 realert:
   minutes: 5
-rocket_chat_attach_kibana_discover_url: false
 rocket_chat_emoji_override: ":ghost:"
-rocket_chat_kibana_discover_color: "#ec4b98"
-rocket_chat_kibana_discover_title: "Discover in Kibana"
 rocket_chat_msg_color: "danger"
 rocket_chat_timeout: 10
 rocket_chat_username_override: "elastalert2"
diff --git a/tests/unit/specs/alert/ConfigYamlServiceNow.spec.js b/tests/unit/specs/alert/ConfigYamlServiceNow.spec.js
index d60ffc59..48583500 100644
--- a/tests/unit/specs/alert/ConfigYamlServiceNow.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlServiceNow.spec.js
@@ -28,7 +28,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlSes.spec.js b/tests/unit/specs/alert/ConfigYamlSes.spec.js
index ab905fb5..dc283693 100644
--- a/tests/unit/specs/alert/ConfigYamlSes.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlSes.spec.js
@@ -23,7 +23,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlSesProfile.spec.js b/tests/unit/specs/alert/ConfigYamlSesProfile.spec.js
index 7b9b382f..4137c7b0 100644
--- a/tests/unit/specs/alert/ConfigYamlSesProfile.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlSesProfile.spec.js
@@ -23,7 +23,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlSlack.spec.js b/tests/unit/specs/alert/ConfigYamlSlack.spec.js
index e869eb97..506313a7 100644
--- a/tests/unit/specs/alert/ConfigYamlSlack.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlSlack.spec.js
@@ -23,7 +23,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
@@ -32,13 +31,9 @@ name: "test123"
 num_events: 10000
 realert:
   minutes: 5
-slack_attach_jira_ticket_url: false
-slack_attach_kibana_discover_url: false
 slack_channel_override:
   - "#elastalert-debugging"
 slack_emoji_override: ":ghost:"
-slack_kibana_discover_color: "#ec4b98"
-slack_kibana_discover_title: "Discover in Kibana"
 slack_msg_color: "danger"
 slack_parse_override: "none"
 slack_timeout: 10
diff --git a/tests/unit/specs/alert/ConfigYamlSns.spec.js b/tests/unit/specs/alert/ConfigYamlSns.spec.js
index c783fdc3..83a93847 100644
--- a/tests/unit/specs/alert/ConfigYamlSns.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlSns.spec.js
@@ -23,7 +23,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlSnsProfile.spec.js b/tests/unit/specs/alert/ConfigYamlSnsProfile.spec.js
index d5eba75c..b56a8d6b 100644
--- a/tests/unit/specs/alert/ConfigYamlSnsProfile.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlSnsProfile.spec.js
@@ -23,7 +23,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlStomp.spec.js b/tests/unit/specs/alert/ConfigYamlStomp.spec.js
index d582dd30..57bedcc7 100644
--- a/tests/unit/specs/alert/ConfigYamlStomp.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlStomp.spec.js
@@ -23,7 +23,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlStompModRequiredAndOpt.spec.js b/tests/unit/specs/alert/ConfigYamlStompModRequiredAndOpt.spec.js
index 4223fc52..f4d27e5b 100644
--- a/tests/unit/specs/alert/ConfigYamlStompModRequiredAndOpt.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlStompModRequiredAndOpt.spec.js
@@ -23,7 +23,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlTelegram001.spec.js b/tests/unit/specs/alert/ConfigYamlTelegram001.spec.js
index 5224cf70..a999ca7a 100644
--- a/tests/unit/specs/alert/ConfigYamlTelegram001.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlTelegram001.spec.js
@@ -23,7 +23,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlTelegram002.spec.js b/tests/unit/specs/alert/ConfigYamlTelegram002.spec.js
index 268172f7..ab356cd1 100644
--- a/tests/unit/specs/alert/ConfigYamlTelegram002.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlTelegram002.spec.js
@@ -23,7 +23,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlTelegram003.spec.js b/tests/unit/specs/alert/ConfigYamlTelegram003.spec.js
index 08ac170b..f094fea7 100644
--- a/tests/unit/specs/alert/ConfigYamlTelegram003.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlTelegram003.spec.js
@@ -23,7 +23,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlTencentSms.spec.js b/tests/unit/specs/alert/ConfigYamlTencentSms.spec.js
index 98f6567a..be3d4b7e 100644
--- a/tests/unit/specs/alert/ConfigYamlTencentSms.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlTencentSms.spec.js
@@ -23,7 +23,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlTencentSmsOpt.spec.js b/tests/unit/specs/alert/ConfigYamlTencentSmsOpt.spec.js
index 2ef6b6a4..9cd05b80 100644
--- a/tests/unit/specs/alert/ConfigYamlTencentSmsOpt.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlTencentSmsOpt.spec.js
@@ -23,7 +23,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlTheHive.spec.js b/tests/unit/specs/alert/ConfigYamlTheHive.spec.js
index f2a2dd9b..9186fb91 100644
--- a/tests/unit/specs/alert/ConfigYamlTheHive.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlTheHive.spec.js
@@ -23,7 +23,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 hive_alert_config:
   type: "external"
   source: "def"
diff --git a/tests/unit/specs/alert/ConfigYamlTheHiveOpt.spec.js b/tests/unit/specs/alert/ConfigYamlTheHiveOpt.spec.js
index 79d4c009..e8d87a92 100644
--- a/tests/unit/specs/alert/ConfigYamlTheHiveOpt.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlTheHiveOpt.spec.js
@@ -23,7 +23,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 hive_alert_config:
   type: "external"
   source: "def"
diff --git a/tests/unit/specs/alert/ConfigYamlTwilioCopilot.spec.js b/tests/unit/specs/alert/ConfigYamlTwilioCopilot.spec.js
index e6cf6038..6f399098 100644
--- a/tests/unit/specs/alert/ConfigYamlTwilioCopilot.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlTwilioCopilot.spec.js
@@ -20,7 +20,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlTwilioSms.spec.js b/tests/unit/specs/alert/ConfigYamlTwilioSms.spec.js
index b09c88e5..80192fe2 100644
--- a/tests/unit/specs/alert/ConfigYamlTwilioSms.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlTwilioSms.spec.js
@@ -20,7 +20,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlVictorOps.spec.js b/tests/unit/specs/alert/ConfigYamlVictorOps.spec.js
index 0e6ea4f5..2cc36fa8 100644
--- a/tests/unit/specs/alert/ConfigYamlVictorOps.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlVictorOps.spec.js
@@ -23,7 +23,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlVictorOpsOpt.spec.js b/tests/unit/specs/alert/ConfigYamlVictorOpsOpt.spec.js
index ea9445fa..663b8527 100644
--- a/tests/unit/specs/alert/ConfigYamlVictorOpsOpt.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlVictorOpsOpt.spec.js
@@ -23,7 +23,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlZabbix.spec.js b/tests/unit/specs/alert/ConfigYamlZabbix.spec.js
index a863a427..6ed55e54 100644
--- a/tests/unit/specs/alert/ConfigYamlZabbix.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlZabbix.spec.js
@@ -20,7 +20,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false
diff --git a/tests/unit/specs/alert/ConfigYamlZabbixSenderHostPort.spec.js b/tests/unit/specs/alert/ConfigYamlZabbixSenderHostPort.spec.js
index 28ed1e23..76a76a7d 100644
--- a/tests/unit/specs/alert/ConfigYamlZabbixSenderHostPort.spec.js
+++ b/tests/unit/specs/alert/ConfigYamlZabbixSenderHostPort.spec.js
@@ -20,7 +20,6 @@ filter:
   - query:
       query_string:
         query: "@timestamp:*"
-generate_kibana_discover_url: false
 import: "BaseRule.config"
 index: "hannibal-*"
 is_enabled: false