{"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=style&index=0&id=398c1c66&prod&scoped=true&lang=scss&","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/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:CkBpbXBvcnQgIn5lbGVtZW50LXVpL3BhY2thZ2VzL3RoZW1lLWNoYWxrL3NyYy9jaGVja2JveCI7CkBpbXBvcnQgIn5lbGVtZW50LXVpL3BhY2thZ2VzL3RoZW1lLWNoYWxrL3NyYy9jaGVja2JveC1ncm91cCI7CkBpbXBvcnQgIn5lbGVtZW50LXVpL3BhY2thZ2VzL3RoZW1lLWNoYWxrL3NyYy9yb3ciOwoKLnBhdGgtdmlzdWFsIHsKICBtYXJnaW46IDNweCAwOwogIGhlaWdodDogM3B4OwogIHdpZHRoOiAyNXB4OwogIG1hcmdpbi1yaWdodDogNXB4OwogIGRpc3BsYXk6IGlubGluZS1ibG9jazsKfQoKLnNlbGVjdGlvbnMtY29udGFpbmVyIHsKICBwYWRkaW5nLXRvcDogNXB4Owp9CgouY2hlY2thbGwtZGlzcGxheS10ZXh0IHsKICB3aWR0aDogNTlweDsKICBoZWlnaHQ6IDIwcHg7CiAgY29sb3I6IHJnYig0OCwgNDksIDUxKTsKICBmb250LXNpemU6IDE0cHg7CiAgZm9udC13ZWlnaHQ6IG5vcm1hbDsKICBsaW5lLWhlaWdodDogMjBweDsKICBtYXJnaW4tbGVmdDogOHB4OwogIHdoaXRlLXNwYWNlOiBub3dyYXA7Cn0KCi5hbGwtY2hlY2tib3ggewogIGZsb2F0OiByaWdodDsKfQoKLmNoZWNrYm94LWNvbnRhaW5lciB7CiAgZGlzcGxheTogZmxleDsKICBjdXJzb3I6IHBvaW50ZXI7Cn0KCi5jaGVja2JveC1ncm91cCB7CiAgd2lkdGg6IDI2MHB4OwogIGJvcmRlcjogMXB4IHNvbGlkIHJnYigxNDQsIDE0NywgMTUzKTsKICBib3JkZXItcmFkaXVzOiA0cHg7CiAgYmFja2dyb3VuZDogI2ZmZmZmZjsKfQoKLm15LWNoZWNrYm94IHsKICBiYWNrZ3JvdW5kLWNvbG9yOiAjZmZmOwogIHdpZHRoOiAxMDAlOwp9CgouY2hlY2tib3gtZ3JvdXAtaW5uZXIgewogIHBhZGRpbmc6IDE4cHg7Cn0KCjo6di1kZWVwIC5lbC1jaGVja2JveF9fbGFiZWwgewogIHBhZGRpbmctbGVmdDogNXB4OwogIGNvbG9yOiAkYXBwLXByaW1hcnktY29sb3I7CiAgZm9udC1zaXplOiAxMnB4OwogIGZvbnQtd2VpZ2h0OiA1MDA7CiAgbGV0dGVyLXNwYWNpbmc6IDBweDsKICBsaW5lLWhlaWdodDogMTRweDsKICB3aWR0aDogMTAwJTsKfQoKOjp2LWRlZXAgLmVsLWNoZWNrYm94X19pbnB1dCB7CiAgJi5pcy1pbmRldGVybWluYXRlLAogICYuaXMtY2hlY2tlZCB7CiAgICAuZWwtY2hlY2tib3hfX2lubmVyIHsKICAgICAgYmFja2dyb3VuZC1jb2xvcjogJGFwcC1wcmltYXJ5LWNvbG9yOwogICAgICBib3JkZXItY29sb3I6ICRhcHAtcHJpbWFyeS1jb2xvcjsKICAgIH0KICB9Cn0KCjo6di1kZWVwIC5lbC1jaGVja2JveF9fbGFiZWwgewogIGNvbG9yOiAkYXBwLXByaW1hcnktY29sb3IgIWltcG9ydGFudDsKfQoKLmNoZWNrYm94LXJvdyB7CiAgd2lkdGg6IDEwMCU7CiAgdG9wOiAycHg7Cn0KCg=="},{"version":3,"sources":["SelectionsGroup.vue"],"names":[],"mappings":";AAsKA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;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"]}]}