{"remainingRequest":"/home/cmiss/Jenkins/workspace/mapintegratedvuer/node_modules/vue-loader/lib/index.js??vue-loader-options!/home/cmiss/Jenkins/workspace/mapintegratedvuer/node_modules/@abi-software/flatmapvuer/src/components/TreeControls.vue?vue&type=script&lang=js&","dependencies":[{"path":"/home/cmiss/Jenkins/workspace/mapintegratedvuer/node_modules/@abi-software/flatmapvuer/src/components/TreeControls.vue","mtime":499162500000},{"path":"/home/cmiss/Jenkins/workspace/mapintegratedvuer/node_modules/cache-loader/dist/cjs.js","mtime":499162500000},{"path":"/home/cmiss/Jenkins/workspace/mapintegratedvuer/node_modules/thread-loader/dist/cjs.js","mtime":499162500000},{"path":"/home/cmiss/Jenkins/workspace/mapintegratedvuer/node_modules/babel-loader/lib/index.js","mtime":456789000000},{"path":"/home/cmiss/Jenkins/workspace/mapintegratedvuer/node_modules/cache-loader/dist/cjs.js","mtime":499162500000},{"path":"/home/cmiss/Jenkins/workspace/mapintegratedvuer/node_modules/vue-loader/lib/index.js","mtime":499162500000}],"contextDependencies":[],"result":[{"type":"Buffer","data":"base64:DQovKiBlc2xpbnQtZGlzYWJsZSBuby1hbGVydCwgbm8tY29uc29sZSAqLw0KaW1wb3J0IFZ1ZSBmcm9tICJ2dWUiOw0KaW1wb3J0IHsgQ2hlY2tib3gsIENoZWNrYm94R3JvdXAsIENvbG9yUGlja2VyLCBSb3csIFRyZWUgfSBmcm9tICJlbGVtZW50LXVpIjsNCmltcG9ydCBsYW5nIGZyb20gImVsZW1lbnQtdWkvbGliL2xvY2FsZS9sYW5nL2VuIjsNCmltcG9ydCBsb2NhbGUgZnJvbSAiZWxlbWVudC11aS9saWIvbG9jYWxlIjsNCmxvY2FsZS51c2UobGFuZyk7DQpWdWUudXNlKENoZWNrYm94KTsNClZ1ZS51c2UoQ2hlY2tib3hHcm91cCk7DQpWdWUudXNlKENvbG9yUGlja2VyKTsNClZ1ZS51c2UoUm93KTsNClZ1ZS51c2UoVHJlZSk7DQoNCi8qKg0KICogQSB2dWUgY29tcG9uZW50IGZvciB0b2dnbGluZyB2aXNpYmlsaXR5IG9mIHZhcmlvdXMgcmVnaW9ucy4NCiAqLw0KZXhwb3J0IGRlZmF1bHQgew0KICBuYW1lOiAiVHJlZUNvbnRyb2xzIiwNCiAgcHJvcHM6IHsNCiAgICB0cmVlRGF0YTogew0KICAgICAgdHlwZTogQXJyYXksDQogICAgICBkZWZhdWx0OiBmdW5jdGlvbiAoKSB7DQogICAgICAgIHJldHVybiBbXTsNCiAgICAgIH0NCiAgICB9LA0KICAgIGFjdGl2ZTogew0KICAgICAgdHlwZTogU3RyaW5nLA0KICAgICAgZGVmYXVsdDogIiINCiAgICB9LA0KICAgIGhvdmVyOiB7DQogICAgICB0eXBlOiBTdHJpbmcsDQogICAgICBkZWZhdWx0OiAiIg0KICAgIH0NCiAgfSwNCiAgZGF0YTogZnVuY3Rpb24gKCkgew0KICAgIHJldHVybiB7DQogICAgICBkZWZhdWx0RXhwYW5kZWRLZXlzOiBbIkFsbCJdLA0KICAgIH07DQogIH0sDQogIGRlc3Ryb3llZDogZnVuY3Rpb24gKCkgew0KICAgIHRoaXMuc29ydGVkUHJpbWl0aXZlR3JvdXBzID0gdW5kZWZpbmVkOw0KICB9LA0KICBtZXRob2RzOiB7DQogICAgbm9kZUlzQWN0aXZlOiBmdW5jdGlvbihkYXRhKSB7DQogICAgICByZXR1cm4gdGhpcy5hY3RpdmUgPT09IGRhdGEubW9kZWxzOw0KICAgIH0sDQogICAgbm9kZUlzSG92ZXI6IGZ1bmN0aW9uKGRhdGEpIHsNCiAgICAgIHJldHVybiB0aGlzLmhvdmVyID09PSBkYXRhLm1vZGVsczsNCiAgICB9LA0KICAgIGNoYW5nZUFjdGl2ZUJ5Tm9kZTogZnVuY3Rpb24oZGF0YSkgew0KICAgICAgaWYgKGRhdGEubW9kZWxzKSB7DQogICAgICAgIHRoaXMuJGVtaXQoImNoYW5nZS1hY3RpdmUiLCBkYXRhLm1vZGVscyk7DQogICAgICB9DQogICAgfSwNCiAgICBjaGFuZ2VIb3ZlckJ5Tm9kZTogZnVuY3Rpb24oKSB7DQogICAgICAvL2lmIChkYXRhLm1vZGVscykgew0KICAgICAgLy8gIHRoaXMuJGVtaXQoImNoYW5nZS1hY3RpdmUiLCBkYXRhLm1vZGVscyk7DQogICAgICAvL30NCiAgICB9LA0KICAgIGNoZWNrQ2hhbmdlZDogZnVuY3Rpb24gKG5vZGUsIGRhdGEpIHsNCiAgICAgIGNvbnN0IGlzQ2hlY2tlZCA9IGRhdGEuY2hlY2tlZEtleXMuaW5jbHVkZXMobm9kZS5rZXkpOw0KICAgICAgaWYgKG5vZGUua2V5ID09PSAiQWxsIikgew0KICAgICAgICB0aGlzLiRlbWl0KCJjaGVja0FsbCIsIGlzQ2hlY2tlZCk7DQogICAgICB9IGVsc2Ugew0KICAgICAgICB0aGlzLiRlbWl0KCJjaGFuZ2VkIiwge2tleTogbm9kZS5rZXksIHZhbHVlOiBpc0NoZWNrZWR9KTsNCiAgICAgIH0NCiAgICB9LA0KICAgIGdldEJhY2tncm91bmRTdHlsZXM6IGZ1bmN0aW9uKG5vZGUpIHsNCiAgICAgIGlmICgnY29sb3VyJyBpbiBub2RlKSB7DQogICAgICAgIHJldHVybiB7IGJhY2tncm91bmQ6IG5vZGUuY29sb3VyIH07DQogICAgICB9DQogICAgICByZXR1cm4ge307DQogICAgfSwNCiAgfSwNCn07DQo="},{"version":3,"sources":["TreeControls.vue"],"names":[],"mappings":";AAwCA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","file":"TreeControls.vue","sourceRoot":"node_modules/@abi-software/flatmapvuer/src/components","sourcesContent":["<template>\r\n  <div class=\"container\">\r\n    <el-row>\r\n      <el-col :span=\"12\">\r\n        <div class=\"title-text\">\r\n          Systems\r\n        </div>\r\n      </el-col>\r\n    </el-row>\r\n    <div class=\"tree-container\">\r\n      <el-tree\r\n        ref=\"tree\"\r\n        node-key=\"key\"\r\n        show-checkbox\r\n        :check-strictly=\"false\"\r\n        :data=\"treeData\"\r\n        :render-after-expand=\"false\"\r\n        :default-expanded-keys=\"defaultExpandedKeys\"\r\n        @check=\"checkChanged\"\r\n      >\r\n        <span\r\n          slot-scope=\"{ node, data }\"\r\n          class=\"region-tree-node\"\r\n          :class=\"{\r\n            activeItem: nodeIsActive(data),\r\n            hoverItem: nodeIsHover(data),\r\n          }\"\r\n          @click=\"changeActiveByNode(data)\"\r\n          @mouseover=\"changeHoverByNode(data)\"\r\n        >\r\n          <div :style=\"getBackgroundStyles(data)\">\r\n            {{ node.label }}\r\n          </div>\r\n        </span>\r\n      </el-tree>\r\n    </div>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\n/* eslint-disable no-alert, no-console */\r\nimport Vue from \"vue\";\r\nimport { Checkbox, CheckboxGroup, ColorPicker, Row, Tree } from \"element-ui\";\r\nimport lang from \"element-ui/lib/locale/lang/en\";\r\nimport locale from \"element-ui/lib/locale\";\r\nlocale.use(lang);\r\nVue.use(Checkbox);\r\nVue.use(CheckboxGroup);\r\nVue.use(ColorPicker);\r\nVue.use(Row);\r\nVue.use(Tree);\r\n\r\n/**\r\n * A vue component for toggling visibility of various regions.\r\n */\r\nexport default {\r\n  name: \"TreeControls\",\r\n  props: {\r\n    treeData: {\r\n      type: Array,\r\n      default: function () {\r\n        return [];\r\n      }\r\n    },\r\n    active: {\r\n      type: String,\r\n      default: \"\"\r\n    },\r\n    hover: {\r\n      type: String,\r\n      default: \"\"\r\n    }\r\n  },\r\n  data: function () {\r\n    return {\r\n      defaultExpandedKeys: [\"All\"],\r\n    };\r\n  },\r\n  destroyed: function () {\r\n    this.sortedPrimitiveGroups = undefined;\r\n  },\r\n  methods: {\r\n    nodeIsActive: function(data) {\r\n      return this.active === data.models;\r\n    },\r\n    nodeIsHover: function(data) {\r\n      return this.hover === data.models;\r\n    },\r\n    changeActiveByNode: function(data) {\r\n      if (data.models) {\r\n        this.$emit(\"change-active\", data.models);\r\n      }\r\n    },\r\n    changeHoverByNode: function() {\r\n      //if (data.models) {\r\n      //  this.$emit(\"change-active\", data.models);\r\n      //}\r\n    },\r\n    checkChanged: function (node, data) {\r\n      const isChecked = data.checkedKeys.includes(node.key);\r\n      if (node.key === \"All\") {\r\n        this.$emit(\"checkAll\", isChecked);\r\n      } else {\r\n        this.$emit(\"changed\", {key: node.key, value: isChecked});\r\n      }\r\n    },\r\n    getBackgroundStyles: function(node) {\r\n      if ('colour' in node) {\r\n        return { background: node.colour };\r\n      }\r\n      return {};\r\n    },\r\n  },\r\n};\r\n</script>\r\n\r\n<!-- Add \"scoped\" attribute to limit CSS to this component only -->\r\n<style scoped lang=\"scss\">\r\n@import \"~element-ui/packages/theme-chalk/src/checkbox\";\r\n@import \"~element-ui/packages/theme-chalk/src/row\";\r\n@import \"~element-ui/packages/theme-chalk/src/tree\";\r\n\r\n.checkbox-container {\r\n  display: flex;\r\n  cursor: pointer;\r\n}\r\n\r\n.tree-controls {\r\n  position: absolute;\r\n  bottom: 0px;\r\n  transition: all 1s ease;\r\n\r\n  &:focus {\r\n    outline: none;\r\n  }\r\n}\r\n\r\n.container {\r\n  text-align: left;\r\n  overflow: none;\r\n  padding-top: 7px;\r\n  padding-bottom: 16px;\r\n  background: #ffffff;\r\n}\r\n\r\n.title-text {\r\n  width: 59px;\r\n  height: 20px;\r\n  color: rgb(48, 49, 51);\r\n  font-size: 14px;\r\n  font-weight: normal;\r\n  line-height: 20px;\r\n  margin-left: 8px;\r\n}\r\n\r\n.all-checkbox {\r\n  float: right;\r\n}\r\n\r\n.tree-container {\r\n  width: 260px;\r\n  border: 1px solid rgb(144, 147, 153);\r\n  border-radius: 4px;\r\n  background: #ffffff;\r\n  margin-top: 6px;\r\n  scrollbar-width: thin;\r\n\r\n  ::v-deep .el-tree {\r\n    max-height: 240px;\r\n    min-height: 130px;\r\n    overflow: auto;\r\n    &::-webkit-scrollbar {\r\n      width: 4px;\r\n    }\r\n\r\n    &::-webkit-scrollbar-thumb {\r\n      border-radius: 10px;\r\n      box-shadow: inset 0 0 6px #c0c4cc;\r\n    }\r\n  }\r\n\r\n  ::v-deep .el-tree-node__content {\r\n    height: 22px;\r\n  }\r\n}\r\n\r\n::v-deep .el-checkbox__input {\r\n  &.is-indeterminate,\r\n  &.is-checked {\r\n    .el-checkbox__inner {\r\n      background-color: $app-primary-color;\r\n      border-color: $app-primary-color;\r\n    }\r\n  }\r\n}\r\n\r\n::v-deep .el-tree-node__children .el-tree-node__children .el-tree-node__content > label.el-checkbox {\r\n  display: none;\r\n}\r\n\r\n::v-deep .el-checkbox__label {\r\n  padding-left: 5px;\r\n  color: $app-primary-color !important;\r\n  font-size: 12px;\r\n  font-weight: 500;\r\n  letter-spacing: 0px;\r\n  line-height: 14px;\r\n}\r\n\r\n.activeItem {\r\n  background-color: #bbb !important;\r\n}\r\n\r\n.region-tree-node {\r\n  flex: 1;\r\n  color: $app-primary-color !important;\r\n  display: flex;\r\n  font-size: 12px;\r\n  line-height: 14px;\r\n  padding-left: 0px;\r\n  background-color: #fff;\r\n  width: 100%;\r\n\r\n}\r\n\r\n.hoverItem {\r\n  background-color: #eee !important;\r\n}\r\n\r\n</style>\r\n\r\n"]}]}