{"version":3,"sources":["webpack:///./src/components/profileComps/studentprofile/PerformanceChart.vue?1109","webpack:///src/components/profileComps/studentprofile/PerformanceChart.vue","webpack:///./src/components/profileComps/studentprofile/PerformanceChart.vue?5a4f","webpack:///./src/components/profileComps/studentprofile/PerformanceChart.vue","webpack:///./src/components/profileComps/studentprofile/PerformanceChart.vue?2c1d"],"names":["render","_vm","this","_h","$createElement","_c","_self","staticClass","attrs","datacollection","options","class","see_score","_v","_s","getAverageScore","chart_title","staticRenderFns","name","components","DoughnutChart","props","average_score","type","switch_color","watch","data","score_left","base_color","base_hover_color","emptyData","label","backgroundColor","hoverBackgroundColor","borderWidth","mounted","methods","getScoreLeft","switchColor","processAverageColor","fillData","labels","datasets","cutoutPercentage","aspectRatio","legend","display","component"],"mappings":"yHAAA,IAAIA,EAAS,WAAa,IAAIC,EAAIC,KAASC,EAAGF,EAAIG,eAAmBC,EAAGJ,EAAIK,MAAMD,IAAIF,EAAG,OAAOE,EAAG,MAAM,CAACE,YAAY,2CAA2C,CAACF,EAAG,iBAAiB,CAACG,MAAM,CAAC,aAAaP,EAAIQ,eAAe,QAAUR,EAAIS,WAAWL,EAAG,MAAM,CAACE,YAAY,yBAAyB,CAACF,EAAG,MAAM,CAACE,YAAY,gDAAgDI,MAAM,CAAE,aAAcV,EAAIW,YAAa,CAACX,EAAIY,GAAG,IAAIZ,EAAIa,GAAGb,EAAIc,mBAAmB,QAAQV,EAAG,MAAM,CAACE,YAAY,yDAAyD,CAACN,EAAIY,GAAG,IAAIZ,EAAIa,GAAGb,EAAIe,aAAa,UAAU,IAC/jBC,EAAkB,G,wBCwBP,GACfC,wBAEAC,YACAC,sBAGAC,OACAC,qBACAN,aACAO,YACA,sBAEAC,cACAD,aACA,YAGAX,WACAW,6BACA,aAIAE,OACAH,0BAGAI,KA5BA,WA6BA,OACAC,cACAC,qBACAC,2BACApB,kBACAC,WACAoB,WACA,CACAC,sBACAL,aACAM,sCACAC,+BACAC,kBAMAC,QA/CA,WAgDA,iBAGAC,SACArB,gBADA,WAEA,mCACA,oBAGAsB,aANA,WAOA,wCAGAC,YAVA,WAWA,2BAGAC,oBAdA,WAeA,wCACA,+CACA,UACA,iCACA,WAGAC,SAtBA,WAuBA,oBAEA,sCAEA,qBACAC,sCACAC,wBACA,CACA,CACAX,sBACAL,0CACAM,uDACAC,+BACAC,gBAGA,gBAGA,cACAS,oBACAC,cACAC,QACAC,gBC1HwX,I,wBCQpXC,EAAY,eACd,EACA/C,EACAiB,GACA,EACA,KACA,KACA,MAIa,aAAA8B,E,2CCnBf,W","file":"js/PerformanceChart.ede83447.js","sourcesContent":["var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"performance-pie-chart position-relative\"},[_c('doughnut-chart',{attrs:{\"chart-data\":_vm.datacollection,\"options\":_vm.options}}),_c('div',{staticClass:\"average-score-display\"},[_c('div',{staticClass:\"score font-weight-bold color_text text-center\",class:{ 'blur-text': !_vm.see_score }},[_vm._v(\" \"+_vm._s(_vm.getAverageScore())+\"% \")]),_c('div',{staticClass:\"score-meta text-uppercase color_grey_dark text-center\"},[_vm._v(\" \"+_vm._s(_vm.chart_title)+\" \")])])],1)}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\r\n  <div class=\"performance-pie-chart position-relative\">\r\n    <doughnut-chart\r\n      :chart-data=\"datacollection\"\r\n      :options=\"options\"\r\n    ></doughnut-chart>\r\n\r\n    <!-- AVERAGE SCORE DISPLAY -->\r\n    <div class=\"average-score-display\">\r\n      <div\r\n        class=\"score font-weight-bold color_text text-center\"\r\n        :class=\"{ 'blur-text': !see_score }\"\r\n      >\r\n        {{ getAverageScore() }}%\r\n      </div>\r\n      <div class=\"score-meta text-uppercase color_grey_dark text-center\">\r\n        {{ chart_title }}\r\n      </div>\r\n    </div>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nimport DoughnutChart from \"@/scripts/components/DoughnutChart\";\r\n\r\nexport default {\r\n  name: \"PerformanceChart\",\r\n\r\n  components: {\r\n    DoughnutChart,\r\n  },\r\n\r\n  props: {\r\n    average_score: Number,\r\n    chart_title: {\r\n      type: String,\r\n      default: \"Avg. Score\",\r\n    },\r\n    switch_color: {\r\n      type: Boolean,\r\n      default: false,\r\n    },\r\n\r\n    see_score: {\r\n      type: [Number, Boolean, String],\r\n      default: false,\r\n    },\r\n  },\r\n\r\n  watch: {\r\n    average_score: \"fillData\",\r\n  },\r\n\r\n  data() {\r\n    return {\r\n      score_left: \"\",\r\n      base_color: \"#00E29F\",\r\n      base_hover_color: \"#01a775\",\r\n      datacollection: {},\r\n      options: {},\r\n      emptyData: [\r\n        {\r\n          label: \"Average Score\",\r\n          data: [0, 100],\r\n          backgroundColor: [\"#FE747D\", \"#d7ebee\"],\r\n          hoverBackgroundColor: \"#c3e6ec\",\r\n          borderWidth: 0,\r\n        },\r\n      ],\r\n    };\r\n  },\r\n\r\n  mounted() {\r\n    this.fillData();\r\n  },\r\n\r\n  methods: {\r\n    getAverageScore() {\r\n      if (isNaN(this.average_score)) return 0;\r\n      else return this.average_score;\r\n    },\r\n\r\n    getScoreLeft() {\r\n      this.score_left = 100 - this.average_score;\r\n    },\r\n\r\n    switchColor() {\r\n      this.base_color = \"#FAA017\";\r\n    },\r\n\r\n    processAverageColor() {\r\n      if (this.average_score >= 75) return \"#00E29F\";\r\n      else if (this.average_score >= 45 && this.average_score <= 74)\r\n        return \"#FAA017\";\r\n      else if (this.average_score <= 44) return \"#FE747D\";\r\n      else return \"#ccfced\";\r\n    },\r\n\r\n    fillData() {\r\n      this.getScoreLeft();\r\n\r\n      this.switch_color ? this.switchColor() : \"\";\r\n\r\n      this.datacollection = {\r\n        labels: [\"Average Score\", \"Score Lost\"],\r\n        datasets: this.see_score\r\n          ? [\r\n              {\r\n                label: \"Average Score\",\r\n                data: [this.average_score, this.score_left],\r\n                backgroundColor: [this.processAverageColor(), \"#d7ebee\"],\r\n                hoverBackgroundColor: \"#c3e6ec\",\r\n                borderWidth: 0,\r\n              },\r\n            ]\r\n          : this.emptyData,\r\n      };\r\n\r\n      this.options = {\r\n        cutoutPercentage: 75,\r\n        aspectRatio: 1,\r\n        legend: {\r\n          display: false,\r\n        },\r\n      };\r\n    },\r\n  },\r\n};\r\n</script>\r\n\r\n<style lang=\"scss\">\r\n.performance-pie-chart {\r\n  color: #d7ebee;\r\n  @include equal_min_edge(250);\r\n\r\n  @include breakpoint_max(xl) {\r\n    @include equal_min_edge(220);\r\n  }\r\n\r\n  @include breakpoint_max(lg) {\r\n    @include equal_min_edge(170);\r\n  }\r\n\r\n  @include breakpoint_max(md) {\r\n    @include equal_min_edge(200);\r\n    margin-left: auto;\r\n    margin-right: auto;\r\n  }\r\n\r\n  .average-score-display {\r\n    @include transform_center;\r\n  }\r\n\r\n  .score {\r\n    font-size: 28px;\r\n    line-height: 38px;\r\n    margin-bottom: 4px;\r\n\r\n    @include breakpoint_max(lg) {\r\n      font-size: 22px;\r\n    }\r\n  }\r\n\r\n  .score-meta {\r\n    font-size: 12px;\r\n    line-height: 16px;\r\n\r\n    @include breakpoint_max(lg) {\r\n      font-size: 10px;\r\n    }\r\n  }\r\n\r\n  .blur-text {\r\n    filter: blur(10px);\r\n  }\r\n}\r\n</style>\r\n","import mod from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./PerformanceChart.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./PerformanceChart.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./PerformanceChart.vue?vue&type=template&id=fb87240e&\"\nimport script from \"./PerformanceChart.vue?vue&type=script&lang=js&\"\nexport * from \"./PerformanceChart.vue?vue&type=script&lang=js&\"\nimport style0 from \"./PerformanceChart.vue?vue&type=style&index=0&lang=scss&\"\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","export * from \"-!../../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../../../node_modules/css-loader/dist/cjs.js??ref--8-oneOf-1-1!../../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../../../../node_modules/sass-loader/dist/cjs.js??ref--8-oneOf-1-3!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./PerformanceChart.vue?vue&type=style&index=0&lang=scss&\""],"sourceRoot":""}