{"version":3,"sources":["webpack:///./src/views/Helexium/ReportesConApex/ReporteGraficos.vue","webpack:///./src/views/Helexium/ReportesConApex/container-charts.vue","webpack:///src/views/Helexium/ReportesConApex/container-charts.vue","webpack:///./src/views/Helexium/ReportesConApex/container-charts.vue?f945","webpack:///./src/views/Helexium/ReportesConApex/container-charts.vue?3160","webpack:///./src/views/Helexium/ReportesConApex/charts/polar-area.vue","webpack:///src/views/Helexium/ReportesConApex/charts/polar-area.vue","webpack:///./src/views/Helexium/ReportesConApex/charts/polar-area.vue?f0b8","webpack:///./src/views/Helexium/ReportesConApex/charts/polar-area.vue?c050","webpack:///./src/views/Helexium/ReportesConApex/charts/distributed-columns.vue","webpack:///src/views/Helexium/ReportesConApex/charts/distributed-columns.vue","webpack:///./src/views/Helexium/ReportesConApex/charts/distributed-columns.vue?84bb","webpack:///./src/views/Helexium/ReportesConApex/charts/distributed-columns.vue?1004","webpack:///./src/views/Helexium/ReportesConApex/charts/distributed-columns-cargos.vue","webpack:///src/views/Helexium/ReportesConApex/charts/distributed-columns-cargos.vue","webpack:///./src/views/Helexium/ReportesConApex/charts/distributed-columns-cargos.vue?942a","webpack:///./src/views/Helexium/ReportesConApex/charts/distributed-columns-cargos.vue?16c0","webpack:///./src/views/Helexium/ReportesConApex/charts/irregular-timeseries.vue","webpack:///src/views/Helexium/ReportesConApex/charts/irregular-timeseries.vue","webpack:///./src/views/Helexium/ReportesConApex/charts/irregular-timeseries.vue?c383","webpack:///./src/views/Helexium/ReportesConApex/charts/irregular-timeseries.vue?3d6d","webpack:///src/views/Helexium/ReportesConApex/ReporteGraficos.vue","webpack:///./src/views/Helexium/ReportesConApex/ReporteGraficos.vue?e989","webpack:///./src/views/Helexium/ReportesConApex/ReporteGraficos.vue?48d6"],"names":["render","_vm","this","_c","_self","staticClass","staticRenderFns","attrs","scopedSlots","_u","key","fn","_v","proxy","class","layout","on","$event","handleLayout","staticStyle","_t","methods","$store","dispatch","computed","mapState","component","sucursales","length","style","height","width","_m","data","chart","$isLoading","setupChart","destroy","sucursalesMap","reduce","acc","item","sucursal","sucursalid","options","type","events","dataPointSelection","event","chartContext","config","selectedLabel","w","labels","dataPointIndex","selectedSucursalId","previousSucursalId","map","series","promediovaloracion","title","text","align","offsetX","color","fontSize","yaxis","min","max","tickAmount","responsive","breakpoint","legend","position","ApexCharts","document","querySelector","departamentos","watch","handler","updateChart","deep","colors","departamentosMap","departamento","departamentoid","foreColor","xaxis","categories","selectedDepartamentoId","previousDepartamentoId","plotOptions","bar","columnWidth","distributed","dataLabels","enabled","show","horizontal","updateOptions","beforeDestroy","cargos","click","e","cargo","tiposCargos","name","stacked","zoom","markers","size","fill","gradient","shadeIntensity","inverseColors","opacityFrom","opacityTo","stops","tipocargo","tooltip","shared","horizontalAlign","components","containerCharts","polarArea","distributedColumns","irregularTimeseries","distributedColumnsCargos"],"mappings":"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","file":"js/chunk-2d216f95.2cea25b5ed807bad599f.js","sourcesContent":["var render = function render(){var _vm=this,_c=_vm._self._c;return _c('card',[_c('div',{staticClass:\"custom-container\"},[_c('container-charts',[_c('polar-area'),_c('distributed-columns'),_c('irregular-timeseries'),_c('distributed-columns-cargos')],1)],1)])\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","var render = function render(){var _vm=this,_c=_vm._self._c;return _c('card',{staticClass:\"shadow-none\",attrs:{\"id\":\"graficos\"},scopedSlots:_vm._u([{key:\"headerTitle\",fn:function(){return [_c('span',{staticClass:\"card-title my-2 h4\"},[_c('b',[_vm._v(\"Graficos de Resultados\")])])]},proxy:true}])},[_c('div',{staticClass:\"d-flex justify-content-end\"},[_c('span',{staticClass:\"p-2\"},[_c('i',{class:`ri-layout-grid-line h3 pointer ${\n          _vm.layout === 1 ? 'text-danger' : ''\n        }`,on:{\"click\":function($event){return _vm.handleLayout()}}}),_c('i',{class:`ri-layout-row-line h3 pointer ${\n          _vm.layout === 2 ? 'text-danger' : ''\n        }`,on:{\"click\":function($event){return _vm.handleLayout()}}})])]),_c('div',{staticClass:\"row pt-4 mx-3 justify-content-center\",staticStyle:{\"gap\":\"0.3rem\"}},[_vm._t(\"default\")],2)])\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\r\n  <card class=\"shadow-none\" id=\"graficos\">\r\n    <template v-slot:headerTitle>\r\n      <span class=\"card-title my-2 h4\"><b>Graficos de Resultados</b></span>\r\n    </template>\r\n    <div class=\"d-flex justify-content-end\">\r\n      <span class=\"p-2\">\r\n        <i\r\n          :class=\"`ri-layout-grid-line h3 pointer ${\r\n            layout === 1 ? 'text-danger' : ''\r\n          }`\"\r\n          @click=\"handleLayout()\"\r\n        ></i>\r\n        <i\r\n          :class=\"`ri-layout-row-line h3 pointer ${\r\n            layout === 2 ? 'text-danger' : ''\r\n          }`\"\r\n          @click=\"handleLayout()\"\r\n        ></i>\r\n      </span>\r\n    </div>\r\n    <div class=\"row pt-4 mx-3 justify-content-center\" style=\"gap: 0.3rem\">\r\n      <slot />\r\n    </div>\r\n  </card>\r\n</template>\r\n\r\n<script>\r\nimport { mapState } from \"vuex\";\r\n\r\nexport default {\r\n  methods: {\r\n    handleLayout() {\r\n      this.$store.dispatch(\"reportesApex/changeLayout\");\r\n    },\r\n  },\r\n  computed: {\r\n    ...mapState(\"reportesApex\", [\"layout\"]),\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/@vue/cli-plugin-babel/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!./container-charts.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/@vue/cli-plugin-babel/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!./container-charts.vue?vue&type=script&lang=js\"","import { render, staticRenderFns } from \"./container-charts.vue?vue&type=template&id=b5bc9586\"\nimport script from \"./container-charts.vue?vue&type=script&lang=js\"\nexport * from \"./container-charts.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","var render = function render(){var _vm=this,_c=_vm._self._c;return _c('div',{class:`col-12 ${_vm.layout === 1 ? 'col-lg-4' : ''} bg-dark p-1 rounded `},[(_vm.sucursales.length > 0)?_c('div',{style:({\n      height: _vm.layout === 2 ? '500px' : '300px',\n      width: '100%',\n    }),attrs:{\"id\":\"polar-area\"}}):[_vm._m(0)]],2)\n}\nvar staticRenderFns = [function (){var _vm=this,_c=_vm._self._c;return _c('p',{staticClass:\"d-flex flex-column align-items-center justify-content-center\",staticStyle:{\"min-height\":\"300px\"}},[_c('i',{staticClass:\"fas fa-spinner fa-spin mb-2\",staticStyle:{\"font-size\":\"1.5rem\"}}),_vm._v(\" Cargando gráfico... \")])\n}]\n\nexport { render, staticRenderFns }","<template>\r\n  <div :class=\"`col-12 ${layout === 1 ? 'col-lg-4' : ''} bg-dark p-1 rounded `\">\r\n    <div\r\n      v-if=\"sucursales.length > 0\"\r\n      id=\"polar-area\"\r\n      :style=\"{\r\n        height: layout === 2 ? '500px' : '300px',\r\n        width: '100%',\r\n      }\"\r\n    ></div>\r\n    <template v-else>\r\n      <p\r\n        class=\"d-flex flex-column align-items-center justify-content-center\"\r\n        style=\"min-height: 300px\"\r\n      >\r\n        <i class=\"fas fa-spinner fa-spin mb-2\" style=\"font-size: 1.5rem\"></i>\r\n        Cargando gráfico...\r\n      </p>\r\n    </template>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nimport ApexCharts from \"apexcharts\";\r\nimport { mapState } from \"vuex\";\r\n\r\nexport default {\r\n  data() {\r\n    return {\r\n      chart: null,\r\n    };\r\n  },\r\n  async mounted() {\r\n    this.$isLoading(true);\r\n\r\n    await this.$store.dispatch(\"reportesApex/getSucursales\");\r\n    this.setupChart();\r\n    this.$isLoading(false);\r\n  },\r\n  computed: {\r\n    ...mapState(\"reportesApex\", [\"sucursales\", \"layout\"]),\r\n  },\r\n  methods: {\r\n    setupChart() {\r\n      if (this.chart) {\r\n        this.chart.destroy();\r\n      }\r\n      // const data = [\r\n      //   { sucursal: \"Sucursal A\", promedioValoracion: 43.5 },\r\n      //   { sucursal: \"Sucursal B\", promedioValoracion: 32.8 },\r\n      //   { sucursal: \"Sucursal C\", promedioValoracion: 41.2 },\r\n      //   { sucursal: \"Sucursal D\", promedioValoracion: 58.0 },\r\n      //   { sucursal: \"Sucursal E\", promedioValoracion: 89.1 },\r\n      // ];\r\n      const sucursalesMap = this.sucursales.reduce((acc, item) => {\r\n        acc[item.sucursal] = item.sucursalid;\r\n        return acc;\r\n      }, {});\r\n      const options = {\r\n        chart: {\r\n          type: \"polarArea\",\r\n          height: \"100%\",\r\n          // foreColor: \"#FFFFFF\",\r\n          events: {\r\n            dataPointSelection: async (event, chartContext, config) => {\r\n              const selectedLabel =\r\n                config.w.config.labels[config.dataPointIndex];\r\n              const selectedSucursalId = sucursalesMap[selectedLabel];\r\n\r\n              if (selectedSucursalId !== this.previousSucursalId) {\r\n                // console.log(\"SucursalId:\", selectedSucursalId);\r\n                await this.$store.dispatch(\r\n                  \"reportesApex/getDepartamentos\",\r\n                  selectedSucursalId\r\n                );\r\n                this.previousSucursalId = selectedSucursalId;\r\n              } else {\r\n                await this.$store.dispatch(\"reportesApex/getDepartamentos\");\r\n              }\r\n            },\r\n          },\r\n        },\r\n        labels: this.sucursales.map((item) => item.sucursal),\r\n        series: this.sucursales.map((item) => item.promediovaloracion),\r\n        title: {\r\n          text: \"Resultados por empresa\",\r\n          align: \"left\",\r\n          offsetX: 14,\r\n          style: {\r\n            color: \"#FFFFFF\",\r\n            fontSize: \"16px\",\r\n          },\r\n        },\r\n        yaxis: {\r\n          min: 0,\r\n          max: 100,\r\n          tickAmount: 5,\r\n        },\r\n        responsive: [\r\n          {\r\n            breakpoint: 480,\r\n            options: {\r\n              chart: {\r\n                width: 200,\r\n              },\r\n              legend: {\r\n                position: \"bottom\",\r\n              },\r\n            },\r\n          },\r\n        ],\r\n      };\r\n\r\n      this.chart = new ApexCharts(\r\n        document.querySelector(\"#polar-area\"),\r\n        options\r\n      );\r\n      this.chart.render();\r\n    },\r\n  },\r\n};\r\n</script>\r\n\r\n<style scoped></style>\r\n","import mod from \"-!../../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../../node_modules/thread-loader/dist/cjs.js!../../../../../node_modules/@vue/cli-plugin-babel/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!./polar-area.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/@vue/cli-plugin-babel/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!./polar-area.vue?vue&type=script&lang=js\"","import { render, staticRenderFns } from \"./polar-area.vue?vue&type=template&id=46d3685c&scoped=true\"\nimport script from \"./polar-area.vue?vue&type=script&lang=js\"\nexport * from \"./polar-area.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  \"46d3685c\",\n  null\n  \n)\n\nexport default component.exports","var render = function render(){var _vm=this,_c=_vm._self._c;return _c('div',{class:`col-12 ${_vm.layout === 1 ? 'col-lg-7' : ''} bg-dark p-1 rounded `},[(_vm.departamentos.length > 0)?_c('div',{style:({\n      height: _vm.layout === 2 ? '500px' : '300px',\n      width: '100%',\n    }),attrs:{\"id\":\"distributed-columns\"}}):[_vm._m(0)]],2)\n}\nvar staticRenderFns = [function (){var _vm=this,_c=_vm._self._c;return _c('p',{staticClass:\"d-flex flex-column align-items-center justify-content-center\",staticStyle:{\"min-height\":\"300px\"}},[_c('i',{staticClass:\"fas fa-spinner fa-spin mb-2\",staticStyle:{\"font-size\":\"1.5rem\"}}),_vm._v(\" Cargando gráfico... \")])\n}]\n\nexport { render, staticRenderFns }","<template>\r\n  <div :class=\"`col-12 ${layout === 1 ? 'col-lg-7' : ''} bg-dark p-1 rounded `\">\r\n    <div\r\n      v-if=\"departamentos.length > 0\"\r\n      id=\"distributed-columns\"\r\n      :style=\"{\r\n        height: layout === 2 ? '500px' : '300px',\r\n        width: '100%',\r\n      }\"\r\n    ></div>\r\n    <template v-else>\r\n      <p\r\n        class=\"d-flex flex-column align-items-center justify-content-center\"\r\n        style=\"min-height: 300px\"\r\n      >\r\n        <i class=\"fas fa-spinner fa-spin mb-2\" style=\"font-size: 1.5rem\"></i>\r\n        Cargando gráfico...\r\n      </p>\r\n    </template>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nimport ApexCharts from \"apexcharts\";\r\nimport { mapState } from \"vuex\";\r\n\r\nexport default {\r\n  data() {\r\n    return {\r\n      chart: null,\r\n    };\r\n  },\r\n  async mounted() {\r\n    this.$isLoading(true);\r\n    await this.$store.dispatch(\"reportesApex/getDepartamentos\");\r\n    this.setupChart();\r\n    this.$isLoading(false);\r\n  },\r\n  computed: {\r\n    ...mapState(\"reportesApex\", [\"departamentos\", \"layout\"]),\r\n  },\r\n  watch: {\r\n    departamentos: {\r\n      handler() {\r\n        this.updateChart();\r\n      },\r\n      deep: true,\r\n    },\r\n  },\r\n  methods: {\r\n    setupChart() {\r\n      if (this.chart) {\r\n        this.chart.destroy();\r\n      }\r\n      const colors = [\r\n        \"#26A0FC\",\r\n        \"#26E7A6\",\r\n        \"#FEBC3B\",\r\n        \"#FF6178\",\r\n        \"#8B75D7\",\r\n        \"#69808A\",\r\n        \"#46B3A9\",\r\n        \"#D830EB\",\r\n      ];\r\n\r\n      const departamentosMap = this.departamentos.reduce((acc, item) => {\r\n        acc[item.departamento] = item.departamentoid;\r\n        return acc;\r\n      }, {});\r\n\r\n      const options = {\r\n        series: [\r\n          {\r\n            data: this.departamentos.map((item) => item.promediovaloracion),\r\n          },\r\n        ],\r\n        chart: {\r\n          height: \"100%\",\r\n          type: \"bar\",\r\n          foreColor: \"#FFFFFF\",\r\n          events: {\r\n            dataPointSelection: async (event, chartContext, config) => {\r\n              const selectedLabel =\r\n                config.w.config.xaxis.categories[config.dataPointIndex];\r\n              const selectedDepartamentoId = departamentosMap[selectedLabel];\r\n              if (selectedDepartamentoId !== this.previousDepartamentoId) {\r\n                // console.log(\"DepartamentoId:\", selectedDepartamentoId);\r\n                await this.$store.dispatch(\r\n                  \"reportesApex/getTiposCargos\",\r\n                  selectedDepartamentoId\r\n                );\r\n                await this.$store.dispatch(\r\n                  \"reportesApex/getCargos\",\r\n                  selectedDepartamentoId\r\n                );\r\n                this.previousDepartamentoId = selectedDepartamentoId;\r\n              } else {\r\n                await this.$store.dispatch(\"reportesApex/getTiposCargos\");\r\n                await this.$store.dispatch(\"reportesApex/getCargos\");\r\n              }\r\n            },\r\n          },\r\n        },\r\n        colors: colors,\r\n        title: {\r\n          text: \"Resultados por departamento\",\r\n          align: \"left\",\r\n          offsetX: 14,\r\n          style: {\r\n            color: \"#FFFFFF\",\r\n            fontSize: \"16px\",\r\n          },\r\n        },\r\n        plotOptions: {\r\n          bar: {\r\n            columnWidth: \"45%\",\r\n            distributed: true,\r\n          },\r\n        },\r\n        dataLabels: {\r\n          enabled: false,\r\n        },\r\n        legend: {\r\n          show: false,\r\n        },\r\n        xaxis: {\r\n          categories: this.departamentos.map((item) => item.departamento),\r\n          labels: {\r\n            style: {\r\n              colors: colors,\r\n              fontSize: \"8px\",\r\n            },\r\n          },\r\n        },\r\n        yaxis: {\r\n          min: 0,\r\n          max: 100,\r\n          tickAmount: 5,\r\n          labels: {\r\n            style: {\r\n              colors: [\"#FFFFFF\"],\r\n            },\r\n          },\r\n        },\r\n        responsive: [\r\n          {\r\n            breakpoint: 700,\r\n            options: {\r\n              plotOptions: {\r\n                bar: {\r\n                  horizontal: true,\r\n                },\r\n              },\r\n              chart: {\r\n                width: \"100%\",\r\n              },\r\n              legend: {\r\n                position: \"bottom\",\r\n              },\r\n            },\r\n          },\r\n        ],\r\n      };\r\n\r\n      this.chart = new ApexCharts(\r\n        document.querySelector(\"#distributed-columns\"),\r\n        options\r\n      );\r\n      this.chart.render();\r\n    },\r\n    updateChart() {\r\n      if (this.chart) {\r\n        this.chart.updateOptions({\r\n          series: [\r\n            {\r\n              data: this.departamentos.map((item) => item.promediovaloracion),\r\n            },\r\n          ],\r\n          xaxis: {\r\n            categories: this.departamentos.map((item) => item.departamento),\r\n          },\r\n        });\r\n      } else {\r\n        this.setupChart();\r\n      }\r\n    },\r\n  },\r\n  beforeDestroy() {\r\n    if (this.chart) {\r\n      this.chart.destroy();\r\n    }\r\n  },\r\n};\r\n</script>\r\n\r\n<style scoped></style>\r\n","import mod from \"-!../../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../../node_modules/thread-loader/dist/cjs.js!../../../../../node_modules/@vue/cli-plugin-babel/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!./distributed-columns.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/@vue/cli-plugin-babel/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!./distributed-columns.vue?vue&type=script&lang=js\"","import { render, staticRenderFns } from \"./distributed-columns.vue?vue&type=template&id=573f92eb&scoped=true\"\nimport script from \"./distributed-columns.vue?vue&type=script&lang=js\"\nexport * from \"./distributed-columns.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  \"573f92eb\",\n  null\n  \n)\n\nexport default component.exports","var render = function render(){var _vm=this,_c=_vm._self._c;return _c('div',{class:`col-12 ${_vm.layout === 1 ? 'col-lg-7' : ''} bg-dark p-1 rounded`},[(_vm.cargos.length > 0)?_c('div',{style:({\n      height: _vm.layout === 2 ? '500px' : '300px',\n      width: '100%',\n    }),attrs:{\"id\":\"distributed-columns-cargos\"}}):[_vm._m(0)]],2)\n}\nvar staticRenderFns = [function (){var _vm=this,_c=_vm._self._c;return _c('p',{staticClass:\"d-flex flex-column align-items-center justify-content-center\",staticStyle:{\"min-height\":\"300px\"}},[_c('i',{staticClass:\"fas fa-spinner fa-spin mb-2\",staticStyle:{\"font-size\":\"1.5rem\"}}),_vm._v(\" Cargando gráfico... \")])\n}]\n\nexport { render, staticRenderFns }","<template>\r\n  <div :class=\"`col-12 ${layout === 1 ? 'col-lg-7' : ''} bg-dark p-1 rounded`\">\r\n    <div\r\n      v-if=\"cargos.length > 0\"\r\n      id=\"distributed-columns-cargos\"\r\n      :style=\"{\r\n        height: layout === 2 ? '500px' : '300px',\r\n        width: '100%',\r\n      }\"\r\n    ></div>\r\n    <template v-else>\r\n      <p\r\n        class=\"d-flex flex-column align-items-center justify-content-center\"\r\n        style=\"min-height: 300px\"\r\n      >\r\n        <i class=\"fas fa-spinner fa-spin mb-2\" style=\"font-size: 1.5rem\"></i>\r\n        Cargando gráfico...\r\n      </p>\r\n    </template>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nimport ApexCharts from \"apexcharts\";\r\nimport { mapState } from \"vuex\";\r\n\r\nexport default {\r\n  data() {\r\n    return {\r\n      chart: null,\r\n    };\r\n  },\r\n  async mounted() {\r\n    this.$isLoading(true);\r\n    await this.$store.dispatch(\"reportesApex/getCargos\");\r\n    this.setupChart();\r\n    this.$isLoading(false);\r\n  },\r\n  computed: {\r\n    ...mapState(\"reportesApex\", [\"cargos\", \"layout\"]),\r\n  },\r\n  watch: {\r\n    cargos: {\r\n      handler() {\r\n        this.updateChart();\r\n      },\r\n      deep: true,\r\n    },\r\n  },\r\n  methods: {\r\n    setupChart() {\r\n      if (this.chart) {\r\n        this.chart.destroy();\r\n      }\r\n      // const data = [\r\n      //   { departamento: \"Departamento A\", promedioValoracion: 43.5 },\r\n      //   { departamento: \"Departamento B\", promedioValoracion: 32.8 },\r\n      //   { departamento: \"Departamento C\", promedioValoracion: 41.2 },\r\n      //   { departamento: \"Departamento D\", promedioValoracion: 58.0 },\r\n      //   { departamento: \"Departamento E\", promedioValoracion: 89.1 },\r\n      // ];\r\n      const colors = [\r\n        \"#26A0FC\",\r\n        \"#26E7A6\",\r\n        \"#FEBC3B\",\r\n        \"#FF6178\",\r\n        \"#8B75D7\",\r\n        \"#69808A\",\r\n        \"#46B3A9\",\r\n        \"#D830EB\",\r\n      ];\r\n\r\n      const options = {\r\n        series: [\r\n          {\r\n            data: this.cargos.map((item) => item.promediovaloracion),\r\n          },\r\n        ],\r\n        chart: {\r\n          height: \"100%\",\r\n          type: \"bar\",\r\n          foreColor: \"#FFFFFF\",\r\n          events: {\r\n            click: function (chart, w, e) {\r\n              console.log(chart, w, e);\r\n            },\r\n          },\r\n        },\r\n        colors: colors,\r\n        title: {\r\n          text: \"Resultados por cargos\",\r\n          align: \"left\",\r\n          offsetX: 14,\r\n          style: {\r\n            color: \"#FFFFFF\",\r\n            fontSize: \"16px\",\r\n          },\r\n        },\r\n        plotOptions: {\r\n          bar: {\r\n            columnWidth: \"45%\",\r\n            distributed: true,\r\n          },\r\n        },\r\n        dataLabels: {\r\n          enabled: false,\r\n        },\r\n        legend: {\r\n          show: false,\r\n        },\r\n        xaxis: {\r\n          categories: this.cargos.map((item) => item.cargo),\r\n          labels: {\r\n            style: {\r\n              colors: colors,\r\n              fontSize: \"8px\",\r\n            },\r\n          },\r\n        },\r\n        yaxis: {\r\n          min: 0,\r\n          max: 100,\r\n          tickAmount: 5,\r\n          labels: {\r\n            style: {\r\n              colors: [\"\"],\r\n            },\r\n          },\r\n        },\r\n        responsive: [\r\n          {\r\n            breakpoint: 700,\r\n            options: {\r\n              plotOptions: {\r\n                bar: {\r\n                  horizontal: true,\r\n                },\r\n              },\r\n              chart: {\r\n                width: \"100%\",\r\n              },\r\n              legend: {\r\n                position: \"bottom\",\r\n              },\r\n            },\r\n          },\r\n        ],\r\n      };\r\n\r\n      this.chart = new ApexCharts(\r\n        document.querySelector(\"#distributed-columns-cargos\"),\r\n        options\r\n      );\r\n      this.chart.render();\r\n    },\r\n    updateChart() {\r\n      if (this.chart) {\r\n        this.chart.updateOptions({\r\n          series: [\r\n            {\r\n              data: this.cargos.map((item) => item.promediovaloracion),\r\n            },\r\n          ],\r\n          xaxis: {\r\n            categories: this.cargos.map((item) => item.cargo),\r\n          },\r\n        });\r\n      } else {\r\n        this.setupChart();\r\n      }\r\n    },\r\n    beforeDestroy() {\r\n      if (this.chart) {\r\n        this.chart.destroy();\r\n      }\r\n    },\r\n  },\r\n};\r\n</script>\r\n\r\n<style scoped></style>\r\n","import mod from \"-!../../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../../node_modules/thread-loader/dist/cjs.js!../../../../../node_modules/@vue/cli-plugin-babel/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!./distributed-columns-cargos.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/@vue/cli-plugin-babel/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!./distributed-columns-cargos.vue?vue&type=script&lang=js\"","import { render, staticRenderFns } from \"./distributed-columns-cargos.vue?vue&type=template&id=58c9d03b&scoped=true\"\nimport script from \"./distributed-columns-cargos.vue?vue&type=script&lang=js\"\nexport * from \"./distributed-columns-cargos.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  \"58c9d03b\",\n  null\n  \n)\n\nexport default component.exports","var render = function render(){var _vm=this,_c=_vm._self._c;return _c('div',{class:`col-12 ${_vm.layout === 1 ? 'col-lg-4' : ''} bg-dark p-1 rounded`},[(_vm.tiposCargos.length > 0)?_c('div',{style:({\n      height: _vm.layout === 2 ? '500px' : '300px',\n      width: '100%',\n    }),attrs:{\"id\":\"irregular-timeseries\"}}):[_vm._m(0)]],2)\n}\nvar staticRenderFns = [function (){var _vm=this,_c=_vm._self._c;return _c('p',{staticClass:\"d-flex flex-column align-items-center justify-content-center\",staticStyle:{\"min-height\":\"300px\"}},[_c('i',{staticClass:\"fas fa-spinner fa-spin mb-2\",staticStyle:{\"font-size\":\"1.5rem\"}}),_vm._v(\" Cargando gráfico... \")])\n}]\n\nexport { render, staticRenderFns }","<template>\r\n  <div :class=\"`col-12 ${layout === 1 ? 'col-lg-4' : ''} bg-dark p-1 rounded`\">\r\n    <div\r\n      v-if=\"tiposCargos.length > 0\"\r\n      id=\"irregular-timeseries\"\r\n      :style=\"{\r\n        height: layout === 2 ? '500px' : '300px',\r\n        width: '100%',\r\n      }\"\r\n    ></div>\r\n    <template v-else>\r\n      <p\r\n        class=\"d-flex flex-column align-items-center justify-content-center\"\r\n        style=\"min-height: 300px\"\r\n      >\r\n        <i class=\"fas fa-spinner fa-spin mb-2\" style=\"font-size: 1.5rem\"></i>\r\n        Cargando gráfico...\r\n      </p>\r\n    </template>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nimport ApexCharts from \"apexcharts\";\r\nimport { mapState } from \"vuex\";\r\n\r\nexport default {\r\n  data() {\r\n    return {\r\n      chart: null,\r\n    };\r\n  },\r\n  async mounted() {\r\n    this.$isLoading(true);\r\n\r\n    await this.$store.dispatch(\"reportesApex/getTiposCargos\");\r\n    this.setupChart();\r\n    this.$isLoading(false);\r\n  },\r\n  computed: {\r\n    ...mapState(\"reportesApex\", [\"tiposCargos\", \"layout\"]),\r\n  },\r\n  watch: {\r\n    tiposCargos: {\r\n      handler() {\r\n        this.updateChart();\r\n      },\r\n      deep: true,\r\n    },\r\n  },\r\n  methods: {\r\n    setupChart() {\r\n      if (this.chart) {\r\n        this.chart.destroy();\r\n      }\r\n      // Datos ficticios para los niveles de cargo\r\n      // const data = [\r\n      //   { nivel: \"Nivel A\", promedio: 43.5 },\r\n      //   { nivel: \"Nivel B\", promedio: 32.8 },\r\n      //   { nivel: \"Nivel C\", promedio: 41.2 },\r\n      //   { nivel: \"Nivel D\", promedio: 58.0 },\r\n      //   { nivel: \"Nivel E\", promedio: 89.1 },\r\n      // ];\r\n\r\n      const options = {\r\n        series: [\r\n          {\r\n            name: \"Promedio\",\r\n            data: this.tiposCargos.map((item) => item.promediovaloracion),\r\n          },\r\n        ],\r\n        chart: {\r\n          type: \"area\",\r\n          stacked: false,\r\n          height: \"100%\",\r\n          zoom: {\r\n            enabled: false,\r\n          },\r\n        },\r\n        dataLabels: {\r\n          enabled: false,\r\n        },\r\n        markers: {\r\n          size: 0,\r\n        },\r\n        fill: {\r\n          type: \"gradient\",\r\n          gradient: {\r\n            shadeIntensity: 1,\r\n            inverseColors: false,\r\n            opacityFrom: 0.45,\r\n            opacityTo: 0.05,\r\n            stops: [20, 100, 100, 100],\r\n          },\r\n        },\r\n        xaxis: {\r\n          categories: this.tiposCargos.map((item) => item.tipocargo),\r\n          labels: {\r\n            style: {\r\n              colors: \"#FFFFFF\",\r\n              fontSize: \"8px\",\r\n            },\r\n          },\r\n        },\r\n        yaxis: {\r\n          min: 0,\r\n          max: 100,\r\n          tickAmount: 5,\r\n          labels: {\r\n            style: {\r\n              colors: \"#FFFFFF\",\r\n            },\r\n          },\r\n        },\r\n        title: {\r\n          text: \"Resultados por nivel de cargo\",\r\n          align: \"left\",\r\n          offsetX: 14,\r\n          style: {\r\n            color: \"#FFFFFF\",\r\n            fontSize: \"16px\",\r\n          },\r\n        },\r\n        tooltip: {\r\n          shared: true,\r\n        },\r\n        legend: {\r\n          position: \"top\",\r\n          horizontalAlign: \"right\",\r\n          offsetX: -10,\r\n        },\r\n        responsive: [\r\n          {\r\n            breakpoint: 700,\r\n            options: {\r\n              chart: {\r\n                width: \"100%\",\r\n                height: 300,\r\n              },\r\n              xaxis: {\r\n                labels: {\r\n                  style: {\r\n                    fontSize: \"10px\",\r\n                  },\r\n                },\r\n              },\r\n            },\r\n          },\r\n        ],\r\n      };\r\n\r\n      this.chart = new ApexCharts(\r\n        document.querySelector(\"#irregular-timeseries\"),\r\n        options\r\n      );\r\n      this.chart.render();\r\n    },\r\n    updateChart() {\r\n      if (this.chart) {\r\n        this.chart.updateOptions({\r\n          series: [\r\n            {\r\n              data: this.tiposCargos.map((item) => item.promediovaloracion),\r\n            },\r\n          ],\r\n          xaxis: {\r\n            categories: this.tiposCargos.map((item) => item.tipocargo),\r\n          },\r\n        });\r\n      } else {\r\n        this.setupChart();\r\n      }\r\n    },\r\n    beforeDestroy() {\r\n      if (this.chart) {\r\n        this.chart.destroy();\r\n      }\r\n    },\r\n  },\r\n};\r\n</script>\r\n\r\n<style scoped></style>\r\n","import mod from \"-!../../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../../node_modules/thread-loader/dist/cjs.js!../../../../../node_modules/@vue/cli-plugin-babel/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!./irregular-timeseries.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/@vue/cli-plugin-babel/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!./irregular-timeseries.vue?vue&type=script&lang=js\"","import { render, staticRenderFns } from \"./irregular-timeseries.vue?vue&type=template&id=79b3c7a3&scoped=true\"\nimport script from \"./irregular-timeseries.vue?vue&type=script&lang=js\"\nexport * from \"./irregular-timeseries.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  \"79b3c7a3\",\n  null\n  \n)\n\nexport default component.exports","<template>\r\n  <card>\r\n    <div class=\"custom-container\">\r\n      <!-- aqui se mostrara los graficos -->\r\n      <container-charts>\r\n        <polar-area />\r\n        <distributed-columns />\r\n        <irregular-timeseries />\r\n        <distributed-columns-cargos />\r\n      </container-charts>\r\n    </div>\r\n  </card>\r\n</template>\r\n\r\n<script>\r\nimport containerCharts from \"./container-charts.vue\";\r\nimport polarArea from \"./charts/polar-area.vue\";\r\nimport distributedColumns from \"./charts/distributed-columns.vue\";\r\nimport distributedColumnsCargos from \"./charts/distributed-columns-cargos.vue\";\r\nimport irregularTimeseries from \"./charts/irregular-timeseries.vue\";\r\n\r\nexport default {\r\n  components: {\r\n    containerCharts,\r\n    polarArea,\r\n    distributedColumns,\r\n    irregularTimeseries,\r\n    distributedColumnsCargos,\r\n  },\r\n  name: \"ReporteGraficos\",\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/@vue/cli-plugin-babel/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!./ReporteGraficos.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/@vue/cli-plugin-babel/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!./ReporteGraficos.vue?vue&type=script&lang=js\"","import { render, staticRenderFns } from \"./ReporteGraficos.vue?vue&type=template&id=5adc2f56\"\nimport script from \"./ReporteGraficos.vue?vue&type=script&lang=js\"\nexport * from \"./ReporteGraficos.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":""}