{"version":3,"sources":["webpack:///./src/components/Mobile/Chargeability/SMU.vue","webpack:///src/components/Mobile/Chargeability/SMU.vue","webpack:///./src/components/Mobile/Chargeability/SMU.vue?0e58","webpack:///./src/components/Mobile/Chargeability/SMU.vue?b0e7"],"names":["render","_vm","this","_c","_self","staticClass","staticStyle","_v","legendColors","_l","pill","k","key","style","getOpacity","on","$event","toggleSlSelectedItems","_s","name","_e","loadSMU","attrs","smuFiltered","length","el","index","selectSMU","id_sl","color","_f","ytd","ytd_1","mtd","mtd_1","staticRenderFns","data","sortBy","value","direction","sortOptions","$optionsFilterPipeline","sortOrder","loading","activeOption","smu","smuElements","methods","slSelectedItems","includes","item","actions","setLoading","val","load","_this","axios","get","params","then","response","$emit","smuSelected","computed","state","globalParams","slLegendColors","_this2","arr","filter","_","orderBy","watch","mounted","component"],"mappings":"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","file":"js/chunk-2d0b9f4c.9ad9343e.js","sourcesContent":["var render = function render(){var _vm=this,_c=_vm._self._c;return _c('swiper-slide',{staticClass:\"h-full w-full overflow-auto no-scrollbar\",staticStyle:{\"width\":\"90%\"}},[_c('div',{staticClass:\"h-full w-full absolute rounded-lg module p-2 flex flex-col z-30\",staticStyle:{\"transition\":\"all 5s\"}},[_c('div',{staticClass:\"h-10 flex flex-row justify-start items-center px-1\"},[_c('span',{staticClass:\"text-font-gray font-semibold mr-auto\"},[_vm._v(\"SMU\")])]),_c('div',{staticClass:\"h-auto w-full mb-1\"},[(_vm.legendColors)?_c('div',{staticClass:\"h-full w-full flex flex-wrap overflow-x-auto no-scrollbar\"},_vm._l((_vm.legendColors),function(pill,k){return _c('div',{key:k,staticClass:\"flex-none\"},[_c('div',{staticClass:\"p-1 m-2px text-3xs flex flex-col justify-center items-center px-1 rounded-md mr-1\",style:(_vm.getOpacity(pill, k)),on:{\"click\":function($event){return _vm.toggleSlSelectedItems(k)}}},[_c('span',{staticClass:\"text-center\"},[_vm._v(_vm._s(pill.name))])])])}),0):_vm._e()]),(!_vm.loadSMU)?_c('div',{staticClass:\"flex flex-1 min-h-0 overflow-auto no-scrollbar flex-col pb-6\"},[(_vm.smuFiltered.length == 0)?_c('div',{staticClass:\"h-full flex flex-col justify-center items-center\"},[_c('span',{staticClass:\"text-xs text-font-gray\"},[_vm._v(\"No SL Selected\")])]):_vm._e(),_vm._l((_vm.smuFiltered),function(el,index){return _c('div',{key:index,staticClass:\"h-32 box flex flex-row mb-2\",on:{\"click\":function($event){return _vm.selectSMU(el)}}},[_c('div',{staticClass:\"h-full w-1 mr-1\"},[(_vm.legendColors[el.id_sl])?_c('div',{staticClass:\"h-full w-1 rounded-full mr-2\",style:('background-color:' + _vm.legendColors[el.id_sl].color + ';')}):_vm._e()]),_c('div',{staticClass:\"h-full flex-1 flex flex-col\"},[_c('div',{staticClass:\"h-6 flex flex-row justify-start items-center p-1\"},[_c('span',{staticClass:\"text-xs font-semibold text-white\"},[_vm._v(_vm._s(el.name))])]),_c('div',{staticClass:\"h-6 flex flex-row justify-center items-center\"},[_c('div',{staticClass:\"h-1 w-1 rounded-full bg-green mr-1\"}),_c('span',{staticClass:\"text-3xs mr-2 text-font-gray\"},[_vm._v(\"Current Chargeability\")]),_c('span',{staticClass:\"text-3xs mr-2 font-semibold\"},[_vm._v(_vm._s(_vm._f(\"numberFormat\")(el.ytd,2))+\"%\")]),_c('div',{staticClass:\"h-1 w-1 rounded-full bg-purple mr-1\"}),_c('span',{staticClass:\"text-3xs mr-2 text-font-gray\"},[_vm._v(\"Y-1 Chargeability\")]),_c('span',{staticClass:\"text-3xs font-semibold\"},[_vm._v(_vm._s(_vm._f(\"numberFormat\")(el.ytd_1,2))+\"%\")])]),_c('div',{staticClass:\"flex-1 min-h-0 pt-1\"},[_c('chart-col-compare-small',{attrs:{\"chartId\":\"chart\",\"marginchart\":true,\"data\":[el.mtd, el.mtd_1],\"names\":['Current Chargeability', 'Y-1 Chargeability']}})],1)])])})],2):_c('div',{staticClass:\"h-full relative\"},[_c('loader',{attrs:{\"loading\":_vm.loadSMU}})],1)])])\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\r\n  <swiper-slide\r\n    class=\"h-full w-full overflow-auto no-scrollbar\"\r\n    style=\"width: 90%\"\r\n  >\r\n    <div\r\n      class=\"h-full w-full absolute rounded-lg module p-2 flex flex-col z-30\"\r\n      style=\"transition: all 5s\"\r\n    >\r\n      <div class=\"h-10 flex flex-row justify-start items-center px-1\">\r\n        <span class=\"text-font-gray font-semibold mr-auto\">SMU</span>\r\n        <!-- <i class=\"mdi mdi-filter-variant text-font-gray mr-1\"></i>\r\n                <multiselect class=\"w-32\" :multiple=\"false\" v-model=\"sortBy\" label=\"name\"\r\n                             placeholder=\"Select option\" :options=\"sortOptions\" /> -->\r\n      </div>\r\n\r\n      <div class=\"h-auto w-full mb-1\">\r\n        <div\r\n          class=\"h-full w-full flex flex-wrap overflow-x-auto no-scrollbar\"\r\n          v-if=\"legendColors\"\r\n        >\r\n          <div class=\"flex-none\" v-for=\"(pill, k) in legendColors\" :key=\"k\">\r\n            <div\r\n              @click=\"toggleSlSelectedItems(k)\"\r\n              class=\"p-1 m-2px text-3xs flex flex-col justify-center items-center px-1 rounded-md mr-1\"\r\n              :style=\"getOpacity(pill, k)\"\r\n            >\r\n              <span class=\"text-center\">{{ pill.name }}</span>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n\r\n      <div\r\n        v-if=\"!loadSMU\"\r\n        class=\"flex flex-1 min-h-0 overflow-auto no-scrollbar flex-col pb-6\"\r\n      >\r\n        <div\r\n          v-if=\"smuFiltered.length == 0\"\r\n          class=\"h-full flex flex-col justify-center items-center\"\r\n        >\r\n          <span class=\"text-xs text-font-gray\">No SL Selected</span>\r\n        </div>\r\n\r\n        <div\r\n          v-for=\"(el, index) in smuFiltered\"\r\n          :key=\"index\"\r\n          class=\"h-32 box flex flex-row mb-2\"\r\n          @click=\"selectSMU(el)\"\r\n        >\r\n          <div class=\"h-full w-1 mr-1\">\r\n            <div\r\n              v-if=\"legendColors[el.id_sl]\"\r\n              class=\"h-full w-1 rounded-full mr-2\"\r\n              :style=\"'background-color:' + legendColors[el.id_sl].color + ';'\"\r\n            ></div>\r\n          </div>\r\n\r\n          <div class=\"h-full flex-1 flex flex-col\">\r\n            <div class=\"h-6 flex flex-row justify-start items-center p-1\">\r\n              <span class=\"text-xs font-semibold text-white\">{{\r\n                el.name\r\n              }}</span>\r\n            </div>\r\n\r\n            <div class=\"h-6 flex flex-row justify-center items-center\">\r\n              <div class=\"h-1 w-1 rounded-full bg-green mr-1\"></div>\r\n\r\n              <span class=\"text-3xs mr-2 text-font-gray\"\r\n                >Current Chargeability</span\r\n              >\r\n\r\n              <span class=\"text-3xs mr-2 font-semibold\"\r\n                >{{ el.ytd | numberFormat(2) }}%</span\r\n              >\r\n\r\n              <div class=\"h-1 w-1 rounded-full bg-purple mr-1\"></div>\r\n\r\n              <span class=\"text-3xs mr-2 text-font-gray\"\r\n                >Y-1 Chargeability</span\r\n              >\r\n\r\n              <span class=\"text-3xs font-semibold\"\r\n                >{{ el.ytd_1 | numberFormat(2) }}%</span\r\n              >\r\n            </div>\r\n\r\n            <div class=\"flex-1 min-h-0 pt-1\">\r\n              <chart-col-compare-small\r\n                chartId=\"chart\"\r\n                :marginchart=\"true\"\r\n                :data=\"[el.mtd, el.mtd_1]\"\r\n                :names=\"['Current Chargeability', 'Y-1 Chargeability']\"\r\n              />\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n\r\n      <div v-else class=\"h-full relative\">\r\n        <loader :loading=\"loadSMU\" />\r\n      </div>\r\n    </div>\r\n  </swiper-slide>\r\n</template>\r\n\r\n<script>\r\nimport { state, actions } from \"@/store\";\r\n\r\nexport default {\r\n  name: \"SMU\",\r\n  data() {\r\n    return {\r\n      sortBy: { name: \"Name\", value: \"name\", direction: \"asc\" },\r\n      sortOptions: this.$optionsFilterPipeline,\r\n      sortOrder: { name: \"ASC\", value: \"asc\" },\r\n      loading: false,\r\n      activeOption: [],\r\n      smu: false,\r\n      smuElements: false,\r\n      loadSMU: false,\r\n    };\r\n  },\r\n  methods: {\r\n    getOpacity(pill, k) {\r\n      if (this.slSelectedItems.includes(k)) {\r\n        return (\r\n          \"color:\" + pill.color + \"; background-color:\" + pill.color + \"15;\"\r\n        );\r\n      } else {\r\n        return \"display:none\";\r\n      }\r\n    },\r\n    toggleSlSelectedItems(item) {\r\n      actions.toggleSlSelectedItems(item);\r\n    },\r\n    setLoading(val) {\r\n      this.loading = val;\r\n    },\r\n    load() {\r\n      this.loadSMU = true;\r\n      this.axios\r\n        .get(\"chargeability/competencyytd\", { params: this.params })\r\n        .then((response) => {\r\n          this.loadSMU = false;\r\n          this.smuElements = response.data.data;\r\n          this.$emit(\"loadSmus\", response.data.data);\r\n        });\r\n    },\r\n    selectSMU(smu) {\r\n      this.smuSelected = smu;\r\n    },\r\n  },\r\n  computed: {\r\n    params() {\r\n      return state.globalParams;\r\n    },\r\n    legendColors() {\r\n      return state.slLegendColors;\r\n    },\r\n    slSelectedItems() {\r\n      return state.slSelectedItems;\r\n    },\r\n    smuFiltered() {\r\n      let arr = [];\r\n      if (this.smuElements) {\r\n        arr = this.smuElements.filter((item) => {\r\n          return this.slSelectedItems.includes(item.id_sl);\r\n        });\r\n      }\r\n      return _.orderBy(arr, [this.sortBy.value], [this.sortBy.direction]);\r\n    },\r\n  },\r\n  watch: {\r\n    params() {\r\n      this.load();\r\n    },\r\n  },\r\n  mounted() {\r\n    if (this.params) this.load();\r\n  },\r\n};\r\n</script>\r\n","import mod from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./SMU.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./SMU.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./SMU.vue?vue&type=template&id=7f6c64be&\"\nimport script from \"./SMU.vue?vue&type=script&lang=js&\"\nexport * from \"./SMU.vue?vue&type=script&lang=js&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports"],"sourceRoot":""}