{"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/SelectionsGroup.vue?vue&type=script&lang=js&","dependencies":[{"path":"/home/cmiss/Jenkins/workspace/mapintegratedvuer/node_modules/@abi-software/flatmapvuer/src/components/SelectionsGroup.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/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:Ci8qIGVzbGludC1kaXNhYmxlIG5vLWFsZXJ0LCBuby1jb25zb2xlICovCmltcG9ydCBWdWUgZnJvbSAidnVlIjsKaW1wb3J0IHsKICBDaGVja2JveCwKICBDaGVja2JveEdyb3VwLAogIENvbCwKICBSb3cKfSBmcm9tICJlbGVtZW50LXVpIjsKaW1wb3J0IGxhbmcgZnJvbSAiZWxlbWVudC11aS9saWIvbG9jYWxlL2xhbmcvZW4iOwppbXBvcnQgbG9jYWxlIGZyb20gImVsZW1lbnQtdWkvbGliL2xvY2FsZSI7Cgpsb2NhbGUudXNlKGxhbmcpOwpWdWUudXNlKENoZWNrYm94KTsKVnVlLnVzZShDaGVja2JveEdyb3VwKTsKVnVlLnVzZShDb2wpOwpWdWUudXNlKFJvdyk7CgoKZXhwb3J0IGRlZmF1bHQgewogIG5hbWU6ICJTZWxlY3Rpb25zR3JvdXAiLAogIG1ldGhvZHM6IHsKICAgIC8qKgogICAgICogRnVuY3Rpb24gdG8gdG9nZ2xlIHBhdGhzIHRvIGRlZmF1bHQuCiAgICAgKiBBbHNvIGNhbGxlZCB3aGVuIHRoZSBhc3NvY2lhdGVkIGJ1dHRvbiBpcyBwcmVzc2VkLgogICAgICovCiAgICByZXNldDogZnVuY3Rpb24oKSB7CiAgICAgIHRoaXMuY2hlY2tBbGwgPSB0cnVlOwogICAgICB0aGlzLmNoZWNrZWRJdGVtcyA9IFtdOwogICAgICB0aGlzLnNlbGVjdGlvbnMuZm9yRWFjaChpdGVtID0+IHsKICAgICAgICBpZiAoISgnZW5hYmxlZCcgaW4gaXRlbSkgfHwgaXRlbS5lbmFibGVkID09PSB0cnVlKSB7CiAgICAgICAgICB0aGlzLmNoZWNrZWRJdGVtcy5wdXNoKGl0ZW1bdGhpcy5pZGVudGlmaWVyS2V5XSk7CiAgICAgICAgfSBlbHNlIHsKICAgICAgICAgIHRoaXMuY2hlY2tBbGwgPSBmYWxzZTsKICAgICAgICB9CiAgICAgIH0pOwogICAgfSwKICAgIHZpc2liaWxpdHlUb2dnbGU6IGZ1bmN0aW9uKGtleSwgdmFsdWUpIHsKICAgICAgdGhpcy4kZW1pdCgiY2hhbmdlZCIsIHtrZXksIHZhbHVlfSk7CiAgICB9LAogICAgaGFuZGxlQ2hlY2tlZEl0ZW1zQ2hhbmdlOiBmdW5jdGlvbih2YWx1ZSkgewogICAgICBsZXQgY2hlY2tlZENvdW50ID0gdmFsdWUubGVuZ3RoOwogICAgICB0aGlzLmNoZWNrQWxsID0gY2hlY2tlZENvdW50ID09PSB0aGlzLnNlbGVjdGlvbnMubGVuZ3RoOwogICAgfSwKICAgIGhhbmRsZUNoZWNrQWxsQ2hhbmdlOiBmdW5jdGlvbih2YWwpIHsKICAgICAgdGhpcy5jaGVja2VkSXRlbXMgPSB2YWwgPyB0aGlzLnNlbGVjdGlvbnMubWFwKGEgPT4gYVt0aGlzLmlkZW50aWZpZXJLZXldKSA6IFtdOwogICAgICB0aGlzLiRlbWl0KCJjaGVja0FsbCIsCiAgICAgIHsKICAgICAgICBrZXlzOiB0aGlzLnNlbGVjdGlvbnMubWFwKGEgPT4gYVt0aGlzLmlkZW50aWZpZXJLZXldKSwKICAgICAgICB2YWx1ZTogdmFsCiAgICAgIH0pOwogICAgfSwKICAgIGdldEJhY2tncm91bmRTdHlsZXM6IGZ1bmN0aW9uKGl0ZW0pIHsKICAgICAgaWYgKCdjb2xvdXInIGluIGl0ZW0gJiYgdGhpcy5jb2xvdXJTdHlsZSA9PT0gImJhY2tncm91bmQiKSB7CiAgICAgICAgcmV0dXJuIHsgYmFja2dyb3VuZDogaXRlbS5jb2xvdXIgfTsKICAgICAgfQogICAgICByZXR1cm4ge307CiAgICB9LAogICAgZ2V0TGluZVN0eWxlczogZnVuY3Rpb24oaXRlbSkgewogICAgICBpZiAoJ2NvbG91cicgaW4gaXRlbSAmJiB0aGlzLmNvbG91clN0eWxlID09PSAibGluZSIpIHsKICAgICAgICBpZiAoKCdkYXNoZWQnIGluIGl0ZW0pICYmIChpdGVtLmRhc2hlZCA9PT0gdHJ1ZSkpIHsKICAgICAgICAgIGNvbnN0IGJhY2tncm91bmQgPSBgcmVwZWF0aW5nLWxpbmVhci1ncmFkaWVudCg5MGRlZywke2l0ZW0uY29sb3VyfSwke2l0ZW0uY29sb3VyfSA2cHgsdHJhbnNwYXJlbnQgMCx0cmFuc3BhcmVudCA5cHgpYDsKICAgICAgICAgIHJldHVybiB7IGJhY2tncm91bmQgfTsKICAgICAgICB9CiAgICAgICAgZWxzZSB7CiAgICAgICAgICByZXR1cm4geyBiYWNrZ3JvdW5kOiBpdGVtLmNvbG91ciB9OwogICAgICAgIH0KICAgICAgfQogICAgICByZXR1cm4geyBkaXNwbGF5OiAiTm9uZSJ9OwogICAgfQogIH0sCiAgcHJvcHM6IHsKICAgIGNvbG91clN0eWxlOiB7CiAgICAgIHR5cGU6IFN0cmluZywKICAgICAgZGVmYXVsdDogImxpbmUiICAgCiAgICB9LAogICAgaWRlbnRpZmllcktleTogewogICAgICB0eXBlOiBTdHJpbmcsCiAgICAgIGRlZmF1bHQ6ICJpZCIKICAgIH0sCiAgICBsYWJlbEtleTogewogICAgICB0eXBlOiBTdHJpbmcsCiAgICAgIGRlZmF1bHQ6ICJsYWJlbCIKICAgIH0sCiAgICB0aXRsZTogewogICAgICB0eXBlOiBTdHJpbmcsCiAgICAgIGRlZmF1bHQ6ICIiCiAgICB9LAogICAgc2VsZWN0aW9uczogewogICAgICB0eXBlOiBBcnJheSwKICAgICAgZGVmYXVsdDogZnVuY3Rpb24oKSB7CiAgICAgICAgcmV0dXJuIFtdOwogICAgICB9LAogICAgfSwKICB9LAogIGNvbXB1dGVkOiB7CiAgICBpc0luZGV0ZXJtaW5hdGU6IGZ1bmN0aW9uKCkgewogICAgICBjb25zdCBjb3VudCA9IHRoaXMuY2hlY2tlZEl0ZW1zLmxlbmd0aDsKICAgICAgaWYgKChjb3VudCA9PT0gMCkgfHwgdGhpcy5jaGVja0FsbCl7CiAgICAgICAgcmV0dXJuIGZhbHNlOwogICAgICB9CiAgICAgIHJldHVybiB0cnVlOwogICAgfQogIH0sCiAgZGF0YTogZnVuY3Rpb24oKSB7CiAgICByZXR1cm4gewogICAgICBjaGVja2VkSXRlbXM6IFtdLAogICAgICBjaGVja0FsbDogdHJ1ZSwKICAgIH07CiAgfSwKICBtb3VudGVkOiBmdW5jdGlvbigpIHsKICAgIHRoaXMucmVzZXQoKTsKICB9Cn07Cg=="},{"version":3,"sources":["SelectionsGroup.vue"],"names":[],"mappings":";AAiDA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;;AAGA;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;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":"SelectionsGroup.vue","sourceRoot":"node_modules/@abi-software/flatmapvuer/src/components","sourcesContent":["<template>\n  <div class=\"selections-container\">\n    <el-row>\n      <el-col :span=\"12\">\n        <div class=\"checkall-display-text\">{{title}}</div>\n      </el-col>\n      <el-col :span=\"12\">\n        <el-checkbox\n          v-if=\"selections && selections.length > 1\"\n          class=\"all-checkbox\"\n          :indeterminate=\"isIndeterminate\"\n          v-model=\"checkAll\"\n          @change=\"handleCheckAllChange\"\n        >Display all</el-checkbox>\n      </el-col>\n    </el-row>\n    <el-checkbox-group\n      v-model=\"checkedItems\"\n      size=\"small\"\n      class=\"checkbox-group\"\n      @change=\"handleCheckedItemsChange\"\n    >\n      <div class=\"checkbox-group-inner\">\n        <el-row v-for=\"item in selections\" :key=\"item[identifierKey]\" :label=\"item[identifierKey]\">\n          <div class=\"checkbox-container\">\n            <el-checkbox\n              class=\"my-checkbox\"\n              :label=\"item[identifierKey]\"\n              @change=\"visibilityToggle(item[identifierKey], $event)\"\n              :checked=\"!('enabled' in item) || (item.enabled === true)\">\n              <el-row class=\"checkbox-row\">\n                <el-col :span=\"4\">\n                <div class=\"path-visual\" :style=\"getLineStyles(item)\"></div>\n                </el-col>\n                <el-col :span=\"20\">\n                  <div :style=\"getBackgroundStyles(item)\">\n                    {{item[labelKey]}}\n                  </div>\n                </el-col>\n              </el-row>\n            </el-checkbox>\n          </div>\n        </el-row>\n      </div>\n    </el-checkbox-group>\n  </div>\n</template>\n\n<script>\n/* eslint-disable no-alert, no-console */\nimport Vue from \"vue\";\nimport {\n  Checkbox,\n  CheckboxGroup,\n  Col,\n  Row\n} from \"element-ui\";\nimport lang from \"element-ui/lib/locale/lang/en\";\nimport locale from \"element-ui/lib/locale\";\n\nlocale.use(lang);\nVue.use(Checkbox);\nVue.use(CheckboxGroup);\nVue.use(Col);\nVue.use(Row);\n\n\nexport default {\n  name: \"SelectionsGroup\",\n  methods: {\n    /**\n     * Function to toggle paths to default.\n     * Also called when the associated button is pressed.\n     */\n    reset: function() {\n      this.checkAll = true;\n      this.checkedItems = [];\n      this.selections.forEach(item => {\n        if (!('enabled' in item) || item.enabled === true) {\n          this.checkedItems.push(item[this.identifierKey]);\n        } else {\n          this.checkAll = false;\n        }\n      });\n    },\n    visibilityToggle: function(key, value) {\n      this.$emit(\"changed\", {key, value});\n    },\n    handleCheckedItemsChange: function(value) {\n      let checkedCount = value.length;\n      this.checkAll = checkedCount === this.selections.length;\n    },\n    handleCheckAllChange: function(val) {\n      this.checkedItems = val ? this.selections.map(a => a[this.identifierKey]) : [];\n      this.$emit(\"checkAll\",\n      {\n        keys: this.selections.map(a => a[this.identifierKey]),\n        value: val\n      });\n    },\n    getBackgroundStyles: function(item) {\n      if ('colour' in item && this.colourStyle === \"background\") {\n        return { background: item.colour };\n      }\n      return {};\n    },\n    getLineStyles: function(item) {\n      if ('colour' in item && this.colourStyle === \"line\") {\n        if (('dashed' in item) && (item.dashed === true)) {\n          const background = `repeating-linear-gradient(90deg,${item.colour},${item.colour} 6px,transparent 0,transparent 9px)`;\n          return { background };\n        }\n        else {\n          return { background: item.colour };\n        }\n      }\n      return { display: \"None\"};\n    }\n  },\n  props: {\n    colourStyle: {\n      type: String,\n      default: \"line\"   \n    },\n    identifierKey: {\n      type: String,\n      default: \"id\"\n    },\n    labelKey: {\n      type: String,\n      default: \"label\"\n    },\n    title: {\n      type: String,\n      default: \"\"\n    },\n    selections: {\n      type: Array,\n      default: function() {\n        return [];\n      },\n    },\n  },\n  computed: {\n    isIndeterminate: function() {\n      const count = this.checkedItems.length;\n      if ((count === 0) || this.checkAll){\n        return false;\n      }\n      return true;\n    }\n  },\n  data: function() {\n    return {\n      checkedItems: [],\n      checkAll: true,\n    };\n  },\n  mounted: function() {\n    this.reset();\n  }\n};\n</script>\n\n<!-- Add \"scoped\" attribute to limit CSS to this component only -->\n<style scoped lang=\"scss\">\n@import \"~element-ui/packages/theme-chalk/src/checkbox\";\n@import \"~element-ui/packages/theme-chalk/src/checkbox-group\";\n@import \"~element-ui/packages/theme-chalk/src/row\";\n\n.path-visual {\n  margin: 3px 0;\n  height: 3px;\n  width: 25px;\n  margin-right: 5px;\n  display: inline-block;\n}\n\n.selections-container {\n  padding-top: 5px;\n}\n\n.checkall-display-text {\n  width: 59px;\n  height: 20px;\n  color: rgb(48, 49, 51);\n  font-size: 14px;\n  font-weight: normal;\n  line-height: 20px;\n  margin-left: 8px;\n  white-space: nowrap;\n}\n\n.all-checkbox {\n  float: right;\n}\n\n.checkbox-container {\n  display: flex;\n  cursor: pointer;\n}\n\n.checkbox-group {\n  width: 260px;\n  border: 1px solid rgb(144, 147, 153);\n  border-radius: 4px;\n  background: #ffffff;\n}\n\n.my-checkbox {\n  background-color: #fff;\n  width: 100%;\n}\n\n.checkbox-group-inner {\n  padding: 18px;\n}\n\n::v-deep .el-checkbox__label {\n  padding-left: 5px;\n  color: $app-primary-color;\n  font-size: 12px;\n  font-weight: 500;\n  letter-spacing: 0px;\n  line-height: 14px;\n  width: 100%;\n}\n\n::v-deep .el-checkbox__input {\n  &.is-indeterminate,\n  &.is-checked {\n    .el-checkbox__inner {\n      background-color: $app-primary-color;\n      border-color: $app-primary-color;\n    }\n  }\n}\n\n::v-deep .el-checkbox__label {\n  color: $app-primary-color !important;\n}\n\n.checkbox-row {\n  width: 100%;\n  top: 2px;\n}\n\n</style>\n\n"]}]}