{"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/ProgressCircle.vue?56fb","webpack:///src/components/ProgressCircle.vue","webpack:///./src/components/ProgressCircle.vue?0f33","webpack:///./src/components/ProgressCircle.vue?8090","webpack:///./src/components/ProgressCircle.vue?2e51","webpack:///./src/components/SubscriptionOverview.vue?8b17","webpack:///src/components/SubscriptionOverview.vue","webpack:///./src/components/SubscriptionOverview.vue?542d","webpack:///./src/components/SubscriptionOverview.vue?7ab9","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/SubscriptionOverview.vue?776c","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__","attrs","id","height","circleSize","width","style","cx","cy","r","radius","stroke-width","strokeWidth","class","noshow","show","cssProps","strokeDashoffset","barFill","percentage","ProgressCirclevue_type_script_lang_js_","maxAmount","activeAmount","totalAmount","showVariableInfo","defualt","textSize","--circumference","circumference","--text-size","Math","PI","toFixed","mounted","round","_this","setTimeout","components","AnimateText","components_ProgressCirclevue_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_ProgressCircle_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_ProgressCircle_vue_vue_type_style_index_0_lang_less___WEBPACK_IMPORTED_MODULE_0___default","n","$t","parseInt","subscription","custom_fields","generation_limit","generationCount","usageAmount","dangerZone","title","integrationCount","integration_limit","slot","userCount","users_limit","templateCount","template_limit","publicationCount","collection_method","po_number","_f","Date","end_date","terms","price","next_renewal_date","plan","_m","on","click","$event","$emit","currency","SubscriptionOverviewvue_type_script_lang_js_","$store","state","templates","filter","t","published","length","users","contentTypes","random","ProgressCircle","UsageCounter","components_SubscriptionOverviewvue_type_script_lang_js_","_t","text-danger","danger","UsageCountervue_type_script_lang_js_","handler","console","immediate","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_SubscriptionOverview_vue_vue_type_style_index_0_lang_less___WEBPACK_IMPORTED_MODULE_0__","_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_SubscriptionOverview_vue_vue_type_style_index_0_lang_less___WEBPACK_IMPORTED_MODULE_0___default","_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__","_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"],"mappings":"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","file":"js/lazy-view-components-SubscriptionOverview.12001f7d.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',{attrs:{\"id\":\"progress-circle\"}},[_c('svg',{attrs:{\"height\":_vm.circleSize,\"width\":_vm.circleSize}},[_c('circle',{style:(_vm.cssProps),attrs:{\"cx\":_vm.circleSize / 2,\"cy\":_vm.circleSize / 2,\"r\":_vm.radius,\"stroke-width\":_vm.strokeWidth}}),_c('circle',{class:{ noshow: _vm.show },style:([_vm.cssProps, {strokeDashoffset:_vm.barFill}]),attrs:{\"cx\":_vm.circleSize / 2,\"cy\":_vm.circleSize / 2,\"r\":_vm.radius,\"stroke-width\":_vm.strokeWidth}})]),_c('h3',{staticClass:\"number\",style:(_vm.cssProps)},[_c('animate-text',{attrs:{\"number\":_vm.percentage,\"animateTime\":50}}),_c('span',{staticClass:\"percentage\"},[_vm._v(\"%\")])],1)])}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n\t<div id=\"progress-circle\" >  \n        <svg :height=\"circleSize\" :width=\"circleSize\">\n            <!-- <g> -->\n                <circle :cx=\"circleSize / 2\" :cy=\"circleSize / 2\" :r=\"radius\" :stroke-width=\"strokeWidth\" :style=\"cssProps\" > </circle>\n                <circle :cx=\"circleSize / 2\" :cy=\"circleSize / 2\" :r=\"radius\" :stroke-width=\"strokeWidth\" :class=\"{ noshow: show }\" :style=\"[cssProps, {strokeDashoffset:barFill}]\"> </circle>\n            <!-- </g> -->\n        </svg>\n        <h3 class=\"number\" :style=\"cssProps\" >   \n            <animate-text :number=\"percentage\" :animateTime=\"50\"/> \n            <span class=\"percentage\">%</span>\n        </h3>\n\t</div>\n</template>\n<script>\n    import AnimateText from '@/components/AnimateText.vue'\n\texport default {\n        props:{\n            maxAmount: Number,\n            activeAmount: Number,\n            totalAmount: Number,\n            showVariableInfo: Boolean,\n            circleSize: {\n                type: Number,\n                defualt: 120\n            },\n            strokeWidth: {\n                type: Number,\n                default: 6\n            },\n            textSize: {\n                type: Number,\n                default: 28\n            }\n        },  \n\tdata(){\n\t\treturn{\n            percentage: this.activeAmount / this.maxAmount * 100,\n            show: true,\n            // circumference: null\n        }\t\t\n    },\n    computed:{\n        cssProps(){\n          return { '--circumference' : (this.circumference), '--text-size' : this.textSize + \"px\"}\n        },\n        circumference(){\n            return (2 * Math.PI * this.radius).toFixed(0)\n        },\n        radius(){\n            return (this.circleSize / 100) * 45\n        },\n        barFill(){\n            if(this.percentage > 100) return this.circumference - (this.circumference * 100) / 100\n            else return this.circumference - (this.circumference * this.percentage) / 100\n        },\n\n   \n    },\n     mounted(){\n        // this.percentage = Math.round(this.percentage * 10) / 10\n        this.percentage = Math.round(this.percentage)\n        // this.circumference =  (2 * Math.PI * this.radius)\n    },\n\n    created(){\n        setTimeout(() => {\n            this.show = false\n        }, 100);\n    },\n        components:{\n            AnimateText\n        }\n    }\n</script>\n\n<style lang=\"less\">\n#progress-circle{\n    position: relative;\n    display: flex;\n    justify-content: center;\n        svg{\n            circle{\n                fill: none;\n                stroke-dasharray: var(--circumference);\n                stroke-dashoffset: var(--circumference);\n                transform: rotate(-90deg);\n                transform-origin: center;\n\n                &:nth-child(1){\n                    stroke-dashoffset: 0;\n                    stroke: rgba(143, 151, 156, 0.192);\n                }\n                &:nth-child(2){\n                    stroke-dashoffset: calc(var(--circumference) - (var(--circumference) * 0 ) /100);\n                    stroke: var(--orange-web);\n                    stroke-linecap: round;\n                    transition: .5s;\n                }\n            }\n        }\n\n       .number{\n            cursor: default;\n            position: absolute;\n            top: 50%;\n            left: 50%;\n            transform: translate(-50%, -50%);\n            font-size: var(--text-size);\n            display: flex;\n        }\n    .noshow{   \n        stroke-dashoffset: calc(var(--circumference) - (var(--circumference) * 0) /100) !important;\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!./ProgressCircle.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!./ProgressCircle.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./ProgressCircle.vue?vue&type=template&id=0bcb84de&\"\nimport script from \"./ProgressCircle.vue?vue&type=script&lang=js&\"\nexport * from \"./ProgressCircle.vue?vue&type=script&lang=js&\"\nimport style0 from \"./ProgressCircle.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!./ProgressCircle.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!./ProgressCircle.vue?vue&type=style&index=0&lang=less&\"","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{attrs:{\"id\":\"current-subscription\"}},[_c('div',{staticClass:\"usage\"},[_c('h3',[_vm._v(_vm._s(_vm.$t('subscription.usage')))]),_c('div',{staticClass:\"content\"},[_c('div',{staticClass:\"generation-count\"},[_c('span',{staticClass:\"title\"},[_vm._v(_vm._s(_vm.$t('subscription.generations')))]),_c('progress-circle',{staticClass:\"generation-counter\",attrs:{\"maxAmount\":parseInt(_vm.subscription.custom_fields.generation_limit),\"activeAmount\":parseInt(_vm.generationCount.toFixed()),\"circleSize\":90,\"strokeWidth\":4,\"textSize\":18}}),_c('usage-counter',{attrs:{\"usageAmount\":parseInt(_vm.generationCount.toFixed()),\"maxAmount\":_vm.subscription.custom_fields.generation_limit,\"dangerZone\":80}})],1),_c('usage-counter',{attrs:{\"title\":_vm.$t('subscription.integrations'),\"usageAmount\":_vm.integrationCount,\"maxAmount\":_vm.subscription.custom_fields.integration_limit,\"dangerZone\":80}},[_c('i',{staticClass:\"fa-light fa-database usage-icon\",attrs:{\"slot\":\"icon\"},slot:\"icon\"})]),_c('usage-counter',{attrs:{\"title\":_vm.$t('subscription.users'),\"usageAmount\":_vm.userCount,\"maxAmount\":_vm.subscription.custom_fields.users_limit,\"dangerZone\":80}},[_c('i',{staticClass:\"fa-light fa-user usage-icon\",attrs:{\"slot\":\"icon\"},slot:\"icon\"})]),_c('usage-counter',{attrs:{\"title\":_vm.$t('subscription.templates'),\"usageAmount\":_vm.templateCount,\"maxAmount\":_vm.subscription.custom_fields.template_limit,\"dangerZone\":80}},[_c('i',{staticClass:\"fa-light fa-file usage-icon\",attrs:{\"slot\":\"icon\"},slot:\"icon\"})]),_c('usage-counter',{attrs:{\"title\":_vm.$t('subscription.publications'),\"usageAmount\":_vm.publicationCount,\"dangerZone\":80}},[_c('i',{staticClass:\"fa-light fa-file-export usage-icon\",attrs:{\"slot\":\"icon\"},slot:\"icon\"})])],1)]),_c('div',{staticClass:\"payment\"},[_c('h3',[_vm._v(_vm._s(_vm.$t('subscription.payment')))]),_c('div',{staticClass:\"content\"},[(_vm.subscription.collection_method == 'payment_card')?_c('div',{staticClass:\"credit-card\"},[_c('h3',[_vm._v(_vm._s(_vm.$t('subscription.card')))]),_c('div',{staticClass:\"card-info\"},[_c('i',{staticClass:\"fa-light fa-credit-card\"}),_c('div',[_c('span',[_vm._v(_vm._s(_vm.subscription.po_number))]),_c('span',{staticClass:\"expiration\"},[_vm._v(_vm._s(_vm.$t('subscription.expires'))+\" \"+_vm._s(_vm._f(\"dateFormat\")(new Date(_vm.subscription.end_date ),'MM/YY')))])])])]):_c('div',{staticClass:\"invoice\"},[_vm._v(\"\\n                Invoice payment\\n            \")]),_c('p',{staticClass:\"next-payment\"},[_vm._v(_vm._s(_vm.$t('subscription.next-payment1'))+\" \"),_c('span',[_vm._v(_vm._s(_vm.subscription.terms.price)+\".- \")]),_vm._v(_vm._s(_vm.$t('subscription.next-payment2'))+\" \"),_c('span',[_vm._v(_vm._s(_vm._f(\"dateFormat\")(new Date( _vm.subscription.next_renewal_date ),'DD/MM/YYYY')))])]),_c('button',{staticClass:\"btn btn-primary\"},[_vm._v(_vm._s(_vm.subscription.collection_method == 'payment_card' ?  _vm.$t('subscription.update-card') : _vm.$t('subscription.add-card')))])])]),_c('div',{staticClass:\"current-plan\"},[_c('h3',[_vm._v(_vm._s(_vm.$t('subscription.current-plan')))]),_c('div',{staticClass:\"content\"},[_c('h3',[_vm._v(_vm._s(_vm.subscription.plan.name))]),_c('p',[_vm._v(\"Description of the plan that is subscribed to. \\n               underneath the user will have a view of what the subscription consists of\")]),_c('div',{staticClass:\"plan-terms\"},[_c('div',{staticClass:\"plan-term\"},[_c('i',{staticClass:\"fa-light fa-sync-alt\"}),_c('p',[_vm._v(_vm._s(_vm.$t('subscription.up-to'))+\" \"),_c('span',[_vm._v(_vm._s(_vm.subscription.custom_fields.generation_limit))]),_vm._v(\" \"+_vm._s(_vm.$t('subscription.generations')))])]),_c('div',{staticClass:\"plan-term\"},[_c('i',{staticClass:\"fa-light fa-database\"}),_c('p',[_vm._v(_vm._s(_vm.$t('subscription.max'))+\" \"),_c('span',[_vm._v(_vm._s(_vm.subscription.custom_fields.integration_limit))]),_vm._v(\" \"+_vm._s(_vm.$t('subscription.integrations'))+\" \")])]),_c('div',{staticClass:\"plan-term\"},[_c('i',{staticClass:\"fa-light fa-file\"}),_c('p',[_vm._v(_vm._s(_vm.$t('subscription.max'))+\" \"),_c('span',[_vm._v(_vm._s(_vm.subscription.custom_fields.template_limit))]),_vm._v(\" \"+_vm._s(_vm.$t('subscription.templates')))])]),_c('div',{staticClass:\"plan-term\"},[_c('i',{staticClass:\"fa-light fa-user\"}),_c('p',[_vm._v(_vm._s(_vm.$t('subscription.up-to'))+\" \"),_c('span',[_vm._v(_vm._s(_vm.subscription.custom_fields.users_limit))]),_vm._v(\" \"+_vm._s(_vm.$t('subscription.users')))])]),_vm._m(0)]),_c('div',{staticClass:\"bottom-section\"},[_c('div',{staticClass:\"actions\"},[_c('button',{staticClass:\"btn btn-primary\",on:{\"click\":function($event){return _vm.$emit('change-subscription')}}},[_vm._v(_vm._s(_vm.$t('subscription.change-plan')))]),_c('button',{staticClass:\"btn btn-secondary\",on:{\"click\":function($event){return _vm.$emit('change-subscription')}}},[_vm._v(_vm._s(_vm.$t('subscription.cancel-plan')))])]),_c('div',{staticClass:\"price\"},[_c('span',[_vm._v(\" \"+_vm._s(_vm.subscription.terms.currency))]),_c('span',[_vm._v(\" \"+_vm._s(_vm.subscription.terms.price)+\".-\")])])])])]),_c('div',{staticClass:\"reciepts\"},[_c('h3',[_vm._v(_vm._s(_vm.$t('subscription.reciepts')))]),_c('div',{staticClass:\"content\"},[_vm._v(\"\\n            list of reciepts\\n        \")])])])}\nvar staticRenderFns = [function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"plan-term\"},[_c('i',{staticClass:\"fa-light fa-headset\"}),_c('p',[_vm._v(\"Live support\")])])}]\n\nexport { render, staticRenderFns }","<template>\n    <div id=\"current-subscription\">\n        <div class=\"usage\">\n            <h3>{{$t('subscription.usage')}}</h3>\n            <div class=\"content\">\n                <div class=\"generation-count\">\n                    <span class=\"title\">{{$t('subscription.generations')}}</span>\n                    <progress-circle \n                        class=\"generation-counter\" \n                        :maxAmount=\"parseInt(subscription.custom_fields.generation_limit)\" \n                        :activeAmount=\"parseInt(generationCount.toFixed())\"\n                        :circleSize=\"90\"\n                        :strokeWidth=\"4\"\n                        :textSize=\"18\"\n                    />\n                    <usage-counter\n                        :usageAmount=\"parseInt(generationCount.toFixed())\"\n                        :maxAmount=\"subscription.custom_fields.generation_limit\"\n                        :dangerZone=\"80\" \n                    >\n                </usage-counter>\n                </div>\n\n                <usage-counter\n                    :title=\"$t('subscription.integrations')\"\n                    :usageAmount=\"integrationCount\"\n                    :maxAmount=\"subscription.custom_fields.integration_limit\"\n                    :dangerZone=\"80\" \n                >\n                    <i slot=\"icon\" class=\"fa-light fa-database usage-icon\"></i>\n                </usage-counter>\n\n                 <usage-counter\n                    :title=\"$t('subscription.users')\"\n                    :usageAmount=\"userCount\"\n                    :maxAmount=\"subscription.custom_fields.users_limit\"\n                    :dangerZone=\"80\" \n                >\n                    <i slot=\"icon\" class=\"fa-light fa-user usage-icon\"></i>\n                </usage-counter>\n\n                 <usage-counter\n                    :title=\"$t('subscription.templates')\"\n                    :usageAmount=\"templateCount\"\n                    :maxAmount=\"subscription.custom_fields.template_limit\"\n                    :dangerZone=\"80\" \n                >\n                    <i slot=\"icon\" class=\"fa-light fa-file usage-icon\"></i>\n                </usage-counter>\n                 <usage-counter\n                    :title=\"$t('subscription.publications')\"\n                    :usageAmount=\"publicationCount\"\n                    :dangerZone=\"80\" \n                >\n                    <i slot=\"icon\" class=\"fa-light fa-file-export usage-icon\"></i>\n                </usage-counter>\n            </div>\n        </div>\n        <div class=\"payment\">\n            <h3>{{$t('subscription.payment')}}</h3>\n            <div class=\"content\">\n                <div class=\"credit-card\" v-if=\"subscription.collection_method == 'payment_card'\">\n                    <h3>{{$t('subscription.card')}}</h3>\n                    <div class=\"card-info\">\n                        <i class=\"fa-light fa-credit-card\"></i>\n                        <div>\n                            <span>{{subscription.po_number}}</span>\n                            <span class=\"expiration\">{{$t('subscription.expires')}} {{new Date(subscription.end_date ) | dateFormat('MM/YY')}}</span>\n                        </div>\n                    </div>\n                </div>\n                \n                <div class=\"invoice\" v-else>\n                    Invoice payment\n                </div>\n                    \n                <p class=\"next-payment\">{{$t('subscription.next-payment1')}} <span>{{subscription.terms.price}}.- </span>{{$t('subscription.next-payment2')}} <span>{{new Date( subscription.next_renewal_date ) | dateFormat('DD/MM/YYYY')}}</span></p>\n                <button class=\"btn btn-primary\">{{subscription.collection_method == 'payment_card' ?  $t('subscription.update-card') : $t('subscription.add-card')}}</button>\n            </div>\n        </div>\n        <div class=\"current-plan\">\n            <h3>{{$t('subscription.current-plan')}}</h3>\n            <div class=\"content\">\n               <h3>{{subscription.plan.name}}</h3>\n               <p>Description of the plan that is subscribed to. \n                   underneath the user will have a view of what the subscription consists of</p>\n                <div class=\"plan-terms\">\n                    <div class=\"plan-term\">\n                        <i class=\"fa-light fa-sync-alt\"></i>\n                        <p>{{$t('subscription.up-to')}} <span>{{subscription.custom_fields.generation_limit}}</span> {{$t('subscription.generations')}}</p>\n                    </div>\n                    <div class=\"plan-term\">\n                        <i class=\"fa-light fa-database\"></i>\n                        <p>{{$t('subscription.max')}} <span>{{subscription.custom_fields.integration_limit}}</span> {{$t('subscription.integrations')}} </p>\n                    </div>\n                    <div class=\"plan-term\">\n                        <i class=\"fa-light fa-file\"></i>\n                      <p>{{$t('subscription.max')}} <span>{{subscription.custom_fields.template_limit}}</span> {{$t('subscription.templates')}}</p>\n                    </div>\n                    <div class=\"plan-term\">\n                        <i class=\"fa-light fa-user\"></i>\n                       <p>{{$t('subscription.up-to')}} <span>{{subscription.custom_fields.users_limit}}</span> {{$t('subscription.users')}}</p>\n                    </div>\n                    <div class=\"plan-term\">\n                        <i class=\"fa-light fa-headset\"></i>\n\n                        <!-- <i class=\"fa-light fa-play-circle\"></i> -->\n                      <!-- <p> <span>{{subscription.custom_fields.workshop_hours}}</span> hours onboarding </p> -->\n                      <p>Live support</p>\n                    </div>\n                </div>\n                \n                <div class=\"bottom-section\">\n                    <div class=\"actions\">\n                        <button class=\"btn btn-primary\" @click=\"$emit('change-subscription')\">{{$t('subscription.change-plan')}}</button>\n                        <button class=\"btn btn-secondary\" @click=\"$emit('change-subscription')\">{{$t('subscription.cancel-plan')}}</button>\n                    </div>\n\n                    <div class=\"price\">\n                        <span> {{subscription.terms.currency}}</span>\n                        <span> {{subscription.terms.price}}.-</span>\n                    </div>\n\n                </div>\n               \n            </div>\n        </div>\n        <div class=\"reciepts\">\n            <h3>{{$t('subscription.reciepts')}}</h3>\n            <div class=\"content\">\n                list of reciepts\n            </div>\n        </div>\n    </div>\n</template>\n\n<script>\nimport ProgressCircle from '@/components/ProgressCircle'\nimport AnimateText from '@/components/AnimateText'\nimport UsageCounter from '@/components/UsageCounter'\nexport default {\nname: 'SubscriptionOverview',\n  data() {\n    return {\n\n    }\n\n  },\n  props:{\n      subscription: Object\n  },\n  methods:{\n\n  },\n \n  computed:{\n      templateCount(){\n          return this.$store.state.templates.filter(t => !t.published).length\n      },\n      publicationCount(){\n          return this.$store.state.templates.filter(t => t.published).length\n      },\n      userCount(){\n          return this.$store.state.users.length\n      },\n      integrationCount(){\n          return this.$store.state.contentTypes.length\n      },\n      generationCount(){\n          return Math.random() * 5000  \n        //   return 5000\n      }\n  },\n  components: {\n   ProgressCircle,\n   AnimateText,\n   UsageCounter\n  }\n\n};\n</script>\n\n<style lang=\"less\">\n#current-subscription{\n    display: grid;\n    grid-template-columns: 2fr 1fr;\n    // grid-auto-rows: 1fr;\n    gap: 20px;\n    > div{\n        > h3{\n            padding: 0 0 20px 20px;\n            margin: 0;\n            font-size: 18px;\n            font-weight: normal;\n        \n        }\n        \n    }\n    .content{\n        height: calc(100% - 41px);\n        padding: 20px;\n        background: #fff;\n        box-shadow: 0px 6px 16px -5px #00000026;\n\n        .usage-icon{\n            width: 20px;\n            font-size: 20px;\n        }\n    }\n    .usage{\n        .content{\n            display: grid;\n            grid-template-columns: repeat(4, auto);\n            grid-auto-rows: auto;\n            gap: 12px;\n            & > div{\n                gap: 12px;\n                align-items: center;\n                // margin: 20px;\n            }\n        }\n\n        .generation-count{\n            grid-row-end:  span 2;\n            display: flex;\n            flex-direction: column;\n        }\n\n        .title{\n            font-size: 14px;\n            font-weight: bold;\n        }\n    }\n\n    .payment{\n        .content{\n            // height: calc(100% - 41px);\n               .next-payment{\n                font-size: 12px;\n                margin: 12px 0;\n                span{\n                    font-weight: bold;\n                }\n            }\n            .credit-card{\n                height: 100%;\n                display: flex;\n                flex-direction: column;\n                justify-content: space-between;\n                h3{\n                    font-size: 14px;\n                    font-weight: bold;\n                }\n                button{\n                    width: max-content;\n                }\n                .card-info{\n                    display: flex;\n                    flex-direction: row;\n                    align-items: center;\n                    gap: 12px;\n                    svg{\n                        font-size: 18px;\n                    }\n                    div{\n                        display: flex;\n                        flex-direction: column;\n\n                        .expiration{\n                            font-size: 10px;\n                            opacity: .7;\n                        }\n                    }\n                }\n            }\n        }\n    \n    }\n\n    .current-plan{\n      .content  h3{\n            font-size: 18px;\n            font-weight: bold;\n        }\n        .plan-terms{\n            display: grid;\n            grid-template-columns: repeat(3, auto);\n            grid-auto-rows: auto;\n                gap: 12px;\n            .plan-term{\n                display: flex;\n                flex-direction: row;\n                align-items: center;\n                gap: 12px;\n                p{\n                    margin: 0;\n                    span{\n                        font-weight: bold;\n                    }\n                }\n            }\n        }\n        .bottom-section{\n            display: flex;\n            flex-direction: row;\n            justify-content: space-between;\n            padding: 20px 0 0 0;\n            \n            button{\n                margin-right: 12px;\n            }\n        }\n        .price{\n            font-size: 18px;\n            font-weight: bold;\n        }\n    }\n}\n\n@media only screen and (max-width: 1100px){\n    #current-subscription{\n        grid-template-columns: 1fr;\n    }\n}\n@media only screen and (max-width: 575px){\n    #current-subscription{\n        .usage{\n            .content{\n                grid-template-columns: 1fr;\n                div{\n                    text-align: center; \n                    justify-content: center;\n\n                }\n            }\n        } \n        .current-plan{\n            .plan-terms{\n                grid-template-columns: 1fr;\n            } \n            .bottom-section{\n                flex-direction: column-reverse;\n            }\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!./SubscriptionOverview.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!./SubscriptionOverview.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./SubscriptionOverview.vue?vue&type=template&id=8678dbbc&\"\nimport script from \"./SubscriptionOverview.vue?vue&type=script&lang=js&\"\nexport * from \"./SubscriptionOverview.vue?vue&type=script&lang=js&\"\nimport style0 from \"./SubscriptionOverview.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","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!./SubscriptionOverview.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!./SubscriptionOverview.vue?vue&type=style&index=0&lang=less&\"","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":""}