{"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=style&index=0&id=413b54c8&scoped=true&lang=scss&","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/css-loader/dist/cjs.js","mtime":499162500000},{"path":"/home/cmiss/Jenkins/workspace/mapintegratedvuer/node_modules/vue-loader/lib/loaders/stylePostLoader.js","mtime":499162500000},{"path":"/home/cmiss/Jenkins/workspace/mapintegratedvuer/node_modules/postcss-loader/src/index.js","mtime":499162500000},{"path":"/home/cmiss/Jenkins/workspace/mapintegratedvuer/node_modules/sass-loader/dist/cjs.js","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/vue-loader/lib/index.js","mtime":499162500000}],"contextDependencies":[],"result":[{"type":"Buffer","data":"base64:DQpAaW1wb3J0ICJ+ZWxlbWVudC11aS9wYWNrYWdlcy90aGVtZS1jaGFsay9zcmMvY2hlY2tib3giOw0KQGltcG9ydCAifmVsZW1lbnQtdWkvcGFja2FnZXMvdGhlbWUtY2hhbGsvc3JjL3JvdyI7DQpAaW1wb3J0ICJ+ZWxlbWVudC11aS9wYWNrYWdlcy90aGVtZS1jaGFsay9zcmMvdHJlZSI7DQoNCi5jaGVja2JveC1jb250YWluZXIgew0KICBkaXNwbGF5OiBmbGV4Ow0KICBjdXJzb3I6IHBvaW50ZXI7DQp9DQoNCi50cmVlLWNvbnRyb2xzIHsNCiAgcG9zaXRpb246IGFic29sdXRlOw0KICBib3R0b206IDBweDsNCiAgdHJhbnNpdGlvbjogYWxsIDFzIGVhc2U7DQoNCiAgJjpmb2N1cyB7DQogICAgb3V0bGluZTogbm9uZTsNCiAgfQ0KfQ0KDQouY29udGFpbmVyIHsNCiAgdGV4dC1hbGlnbjogbGVmdDsNCiAgb3ZlcmZsb3c6IG5vbmU7DQogIHBhZGRpbmctdG9wOiA3cHg7DQogIHBhZGRpbmctYm90dG9tOiAxNnB4Ow0KICBiYWNrZ3JvdW5kOiAjZmZmZmZmOw0KfQ0KDQoudGl0bGUtdGV4dCB7DQogIHdpZHRoOiA1OXB4Ow0KICBoZWlnaHQ6IDIwcHg7DQogIGNvbG9yOiByZ2IoNDgsIDQ5LCA1MSk7DQogIGZvbnQtc2l6ZTogMTRweDsNCiAgZm9udC13ZWlnaHQ6IG5vcm1hbDsNCiAgbGluZS1oZWlnaHQ6IDIwcHg7DQogIG1hcmdpbi1sZWZ0OiA4cHg7DQp9DQoNCi5hbGwtY2hlY2tib3ggew0KICBmbG9hdDogcmlnaHQ7DQp9DQoNCi50cmVlLWNvbnRhaW5lciB7DQogIHdpZHRoOiAyNjBweDsNCiAgYm9yZGVyOiAxcHggc29saWQgcmdiKDE0NCwgMTQ3LCAxNTMpOw0KICBib3JkZXItcmFkaXVzOiA0cHg7DQogIGJhY2tncm91bmQ6ICNmZmZmZmY7DQogIG1hcmdpbi10b3A6IDZweDsNCiAgc2Nyb2xsYmFyLXdpZHRoOiB0aGluOw0KDQogIDo6di1kZWVwIC5lbC10cmVlIHsNCiAgICBtYXgtaGVpZ2h0OiAyNDBweDsNCiAgICBtaW4taGVpZ2h0OiAxMzBweDsNCiAgICBvdmVyZmxvdzogYXV0bzsNCiAgICAmOjotd2Via2l0LXNjcm9sbGJhciB7DQogICAgICB3aWR0aDogNHB4Ow0KICAgIH0NCg0KICAgICY6Oi13ZWJraXQtc2Nyb2xsYmFyLXRodW1iIHsNCiAgICAgIGJvcmRlci1yYWRpdXM6IDEwcHg7DQogICAgICBib3gtc2hhZG93OiBpbnNldCAwIDAgNnB4ICNjMGM0Y2M7DQogICAgfQ0KICB9DQoNCiAgOjp2LWRlZXAgLmVsLXRyZWUtbm9kZV9fY29udGVudCB7DQogICAgaGVpZ2h0OiAyMnB4Ow0KICB9DQp9DQoNCjo6di1kZWVwIC5lbC1jaGVja2JveF9faW5wdXQgew0KICAmLmlzLWluZGV0ZXJtaW5hdGUsDQogICYuaXMtY2hlY2tlZCB7DQogICAgLmVsLWNoZWNrYm94X19pbm5lciB7DQogICAgICBiYWNrZ3JvdW5kLWNvbG9yOiAkYXBwLXByaW1hcnktY29sb3I7DQogICAgICBib3JkZXItY29sb3I6ICRhcHAtcHJpbWFyeS1jb2xvcjsNCiAgICB9DQogIH0NCn0NCg0KOjp2LWRlZXAgLmVsLXRyZWUtbm9kZV9fY2hpbGRyZW4gLmVsLXRyZWUtbm9kZV9fY2hpbGRyZW4gLmVsLXRyZWUtbm9kZV9fY29udGVudCA+IGxhYmVsLmVsLWNoZWNrYm94IHsNCiAgZGlzcGxheTogbm9uZTsNCn0NCg0KOjp2LWRlZXAgLmVsLWNoZWNrYm94X19sYWJlbCB7DQogIHBhZGRpbmctbGVmdDogNXB4Ow0KICBjb2xvcjogJGFwcC1wcmltYXJ5LWNvbG9yICFpbXBvcnRhbnQ7DQogIGZvbnQtc2l6ZTogMTJweDsNCiAgZm9udC13ZWlnaHQ6IDUwMDsNCiAgbGV0dGVyLXNwYWNpbmc6IDBweDsNCiAgbGluZS1oZWlnaHQ6IDE0cHg7DQp9DQoNCi5hY3RpdmVJdGVtIHsNCiAgYmFja2dyb3VuZC1jb2xvcjogI2JiYiAhaW1wb3J0YW50Ow0KfQ0KDQoucmVnaW9uLXRyZWUtbm9kZSB7DQogIGZsZXg6IDE7DQogIGNvbG9yOiAkYXBwLXByaW1hcnktY29sb3IgIWltcG9ydGFudDsNCiAgZGlzcGxheTogZmxleDsNCiAgZm9udC1zaXplOiAxMnB4Ow0KICBsaW5lLWhlaWdodDogMTRweDsNCiAgcGFkZGluZy1sZWZ0OiAwcHg7DQogIGJhY2tncm91bmQtY29sb3I6ICNmZmY7DQogIHdpZHRoOiAxMDAlOw0KDQp9DQoNCi5ob3Zlckl0ZW0gew0KICBiYWNrZ3JvdW5kLWNvbG9yOiAjZWVlICFpbXBvcnRhbnQ7DQp9DQoNCg=="},{"version":3,"sources":["TreeControls.vue"],"names":[],"mappings":";AAsHA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AAEA;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"]}]}