{"version":3,"sources":["webpack:///./src/components/AnimateText.vue?43c2","webpack:///src/components/AnimateText.vue","webpack:///./src/components/AnimateText.vue?0f17","webpack:///./src/components/AnimateText.vue","webpack:///./src/components/UsageCounter.vue?e556","webpack:///src/components/UsageCounter.vue","webpack:///./src/components/UsageCounter.vue?e93e","webpack:///./src/components/UsageCounter.vue?a1fd","webpack:///./src/components/UsageCounter.vue?4ea8"],"names":["render","_vm","this","_h","$createElement","_c","_self","staticClass","formattedNumber","addZero","_v","_e","_s","unit","staticRenderFns","AnimateTextvue_type_script_lang_js_","name","data","interval","displayNumber","props","type","number","default","animateTime","methods","animateFunction","setInterval","change","clearInterval","bind","computed","toLocaleString","replace","watch","created","components_AnimateTextvue_type_script_lang_js_","component","Object","componentNormalizer","__webpack_exports__","title","_t","maxAmount","class","text-danger","danger","usageAmount","UsageCountervue_type_script_lang_js_","dangerZone","handler","console","immediate","components","AnimateText","components_UsageCountervue_type_script_lang_js_","_node_modules_mini_css_extract_plugin_dist_loader_js_ref_10_oneOf_1_0_node_modules_css_loader_index_js_ref_10_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_10_oneOf_1_2_node_modules_less_loader_dist_cjs_js_ref_10_oneOf_1_3_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_UsageCounter_vue_vue_type_style_index_0_lang_less___WEBPACK_IMPORTED_MODULE_0__","__webpack_require__","_node_modules_mini_css_extract_plugin_dist_loader_js_ref_10_oneOf_1_0_node_modules_css_loader_index_js_ref_10_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_10_oneOf_1_2_node_modules_less_loader_dist_cjs_js_ref_10_oneOf_1_3_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_UsageCounter_vue_vue_type_style_index_0_lang_less___WEBPACK_IMPORTED_MODULE_0___default","n"],"mappings":"sMAAA,IAAAA,EAAA,WAA0B,IAAAC,EAAAC,KAAaC,EAAAF,EAAAG,eAA0BC,EAAAJ,EAAAK,MAAAD,IAAAF,EAAwB,OAAAE,EAAA,OAAiBE,YAAA,mBAA8B,CAAAN,EAAAO,gBAAA,IAAAP,EAAAQ,QAAAJ,EAAA,QAAAJ,EAAAS,GAAA,OAAAT,EAAAU,KAAAN,EAAA,QAAAJ,EAAAS,GAAAT,EAAAW,GAAAX,EAAAO,oBAAAP,EAAA,KAAAI,EAAA,QAAAJ,EAAAS,GAAAT,EAAAW,GAAAX,EAAAY,SAAAZ,EAAAU,QACxIG,EAAA,GCQAC,uBAAA,CACAC,mBACAC,gBACA,OACAC,YACAC,kBAGAC,OACAP,MACAQ,aAEAC,QACAD,YACAE,WAEAC,aACAH,YACAE,YAEAd,iBAEAgB,SACAC,2BAEAxB,KAAAgB,SAAAS,YAAA,WAEA,GAAAzB,KAAAoB,QAAApB,KAAAiB,eAIA,GAAAjB,KAAAiB,eAAAjB,KAAAoB,OAAA,CAEA,IAAAM,GAAA1B,KAAAoB,OAAApB,KAAAiB,eAAA,GACAS,kCACA1B,KAAAiB,cAAAjB,KAAAiB,cAAAS,QAPAC,8BASAC,KAAA5B,WAAAsB,eAIAO,UACAvB,2BAAA,OAAAN,KAAAiB,cAAAa,iBAAAC,QAAA,aAEAC,OAAAZ,kBAAApB,KAAAwB,oBACAS,mBACAjC,KAAAwB,qBCvDqVU,EAAA,cCOrVC,EAAgBC,OAAAC,EAAA,KAAAD,CACdF,EACApC,EACAc,GACF,EACA,KACA,KACA,MAIe0B,EAAA,WAAAH,oDClBf,IAAArC,EAAA,WAA0B,IAAAC,EAAAC,KAAaC,EAAAF,EAAAG,eAA0BC,EAAAJ,EAAAK,MAAAD,IAAAF,EAAwB,OAAAE,EAAA,OAAiBE,YAAA,iBAA4B,CAAAF,EAAA,QAAaE,YAAA,SAAoB,CAAAN,EAAAS,GAAAT,EAAAW,GAAAX,EAAAwC,UAAApC,EAAA,OAAAJ,EAAAyC,GAAA,QAAAzC,EAAA0C,UAAAtC,EAAA,QAAgIE,YAAA,UAAAqC,MAAA,CAA6BC,cAAA5C,EAAA6C,SAA2B,CAAA7C,EAAAS,GAAAT,EAAAW,GAAAX,EAAA8C,aAAA,MAAA9C,EAAAW,GAAAX,EAAA0C,cAAxLtC,EAAA,QAAAJ,EAAAS,GAAAT,EAAAW,GAAAX,EAAA8C,iBAAwL,MAC/VjC,EAAA,2BCiBekC,EAAA,CACfhC,4BACAC,gBACA,UAIAG,OACAqB,aACAM,mBACAJ,iBACAM,YACA5B,YACAE,aAGAE,WAGAS,OACAa,aACAG,mBACAC,8BACAA,mDAGAC,cAEArB,UACAe,kBACA,OAAA5C,KAAA6C,YAAA7C,KAAAyC,UAAA,IAAAzC,KAAA+C,aAGAI,YACAC,2BCpDsVC,EAAA,0BCQtVlB,EAAgBC,OAAAC,EAAA,KAAAD,CACdiB,EACAvD,EACAc,GACF,EACA,KACA,KACA,MAIe0B,EAAA,WAAAH,6CCnBf,IAAAmB,EAAAC,EAAA,QAAAC,EAAAD,EAAAE,EAAAH,GAAkhBE,EAAG","file":"js/lazy-view-components-UsageCounter.5cf6394d.js","sourcesContent":["var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"animated-number\"},[(_vm.formattedNumber < 10 && _vm.addZero)?_c('span',[_vm._v(\"0\")]):_vm._e(),_c('span',[_vm._v(_vm._s(_vm.formattedNumber))]),(_vm.unit)?_c('span',[_vm._v(_vm._s(_vm.unit))]):_vm._e()])}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n<div class=\"animated-number\">\n    <span v-if=\"formattedNumber < 10 && addZero\">0</span>\n    <span>{{formattedNumber}}</span>\n    <span v-if=\"unit\">{{unit}}</span>\n</div>\n</template>\n\n<script>\n    export default {\n    name: 'AnimateText',\n        data () {\n                return {\n                    interval: false,\n                    displayNumber: 0\n                }\n            },\n            props:{\n                unit: {\n                    type: String,\n                    },\n                number: {\n                    type: Number,\n                    default: 0\n                    },\n                animateTime: {\n                    type: Number,\n                    default: 20\n                    },\n                addZero: Boolean\n            },\n            methods:{\n                animateFunction(){\n                    //  if(this.number == Infinity){console.log(\"Infinitetete\"), this.number = 0 }     \n                this.interval = setInterval(function(){\n                    \n                    if(this.number == this.displayNumber){\n                        clearInterval(this.interval);\n                        return;\n                    }\n                    if(this.displayNumber != this.number){\n                        // console.log(\"countup\")\n                    let change = (this.number - this.displayNumber) / 10;\n                    change = change >= 0 ? Math.ceil(change) : Math.floor(change);\n                    this.displayNumber = this.displayNumber + change;\n                    }\n                }.bind(this), this.animateTime);\n            }\n        },\n\n            computed:{\n                formattedNumber(){return this.displayNumber.toLocaleString().replace(/\\./g, ' ')}\n            },\n            watch:{ number: function(){ this.animateFunction() } },\n            created(){\n                this.animateFunction()\n            }\n     \n    }  \n</script>\n\n<style lang=\"less\">\n\n</style>","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!./AnimateText.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!./AnimateText.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./AnimateText.vue?vue&type=template&id=4cdd4a9a&\"\nimport script from \"./AnimateText.vue?vue&type=script&lang=js&\"\nexport * from \"./AnimateText.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 () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"usage-counter\"},[_c('span',{staticClass:\"title\"},[_vm._v(_vm._s(_vm.title))]),_c('div',[_vm._t(\"icon\"),(!_vm.maxAmount)?_c('span',[_vm._v(_vm._s(_vm.usageAmount))]):_c('span',{staticClass:\"counter\",class:{'text-danger': _vm.danger}},[_vm._v(_vm._s(_vm.usageAmount)+\" / \"+_vm._s(_vm.maxAmount))])],2)])}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n    <div class=\"usage-counter\">\n        <span class=\"title\">{{title}}</span>\n        <div>\n            <slot name=\"icon\"></slot>\n            <span v-if=\"!maxAmount\">{{usageAmount}}</span>\n            <span v-else :class=\"{'text-danger': danger}\" class=\"counter\">{{usageAmount}} / {{maxAmount}}</span>\n\n            <!-- <div v-else :class=\"{'text-danger': danger}\">\n                <animate-text style=\"margin-right:2px;\" :number=\"usageAmount\" :animateTime=\"20\"/>\n                <span> / {{maxAmount}}</span>\n            </div> -->\n        </div>\n    </div>\n</template>\n\n<script>\nimport AnimateText from '@/components/AnimateText'\nexport default {\nname: 'SubscriptionOverview',\n  data() {\n    return {\n\n    }\n  },\n  props:{\n      title: String,\n      usageAmount: Number,\n      maxAmount: Number,\n      dangerZone:{\n          type: Number,\n          default: 80\n      }\n  },\n  methods:{\n\n  },\n  watch:{\n      usageAmount: {\n          handler: function(){\n              console.log(this.usageAmount)\n              console.log(this.usageAmount / this.maxAmount * 100)\n              // if usageAmount is more than dangerzone of maxamount\n          }\n      }, immediate: true\n  },\n  computed:{\n    danger(){\n        return (this.usageAmount / this.maxAmount * 100) > this.dangerZone\n    }\n  },\n  components: {\n   AnimateText\n  }\n\n};\n</script>\n\n<style lang=\"less\">\n.usage-counter{\n    .title{\n        font-size: 14px;\n        font-weight: bold;\n    }\n    span{\n        font-weight: bold;\n    }\n    div{\n        margin-top: 8px;\n        display: flex;\n        gap: 8px;\n        // justify-content: flex-start;\n        align-items: flex-end;\n    }\n\n}\n</style>\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!./UsageCounter.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!./UsageCounter.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./UsageCounter.vue?vue&type=template&id=cc408e20&\"\nimport script from \"./UsageCounter.vue?vue&type=script&lang=js&\"\nexport * from \"./UsageCounter.vue?vue&type=script&lang=js&\"\nimport style0 from \"./UsageCounter.vue?vue&type=style&index=0&lang=less&\"\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","import mod from \"-!../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--10-oneOf-1-0!../../node_modules/css-loader/index.js??ref--10-oneOf-1-1!../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../node_modules/postcss-loader/src/index.js??ref--10-oneOf-1-2!../../node_modules/less-loader/dist/cjs.js??ref--10-oneOf-1-3!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./UsageCounter.vue?vue&type=style&index=0&lang=less&\"; export default mod; export * from \"-!../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--10-oneOf-1-0!../../node_modules/css-loader/index.js??ref--10-oneOf-1-1!../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../node_modules/postcss-loader/src/index.js??ref--10-oneOf-1-2!../../node_modules/less-loader/dist/cjs.js??ref--10-oneOf-1-3!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./UsageCounter.vue?vue&type=style&index=0&lang=less&\""],"sourceRoot":""}