{"version":3,"sources":["webpack:///./src/views/wizard/StepLoading.vue?6fb0","webpack:///./src/views/wizard/StepLoading.vue","webpack:///./src/views/wizard/StepLoading.vue?f000"],"names":["percent","text_num","name","data","transitionDuration","mounted","progress","this","$refs","circle_fill","radius","r","baseVal","value","circumference","Math","PI","style","setProperty","setTimeout","strokeDashoffset","activateCounter","methods","interval","counter","increaseInterval","setInterval","window","clearInterval","redirectToAnalysis","$router","push","computed","render","__scopeId"],"mappings":"2IAAA,W,0JCAK,MAAM,8C,GAAkD,MAAM,U,GAAc,MAAM,cAAc,MAAM,MAAM,OAAO,O,EAAM,yBAAwF,UAAhF,MAAM,0CAA0C,GAAG,KAAK,GAAG,KAAK,EAAE,M,YAAsB,MAAM,0CAA0C,GAAG,KAAK,GAAG,KAAK,EAAE,KAAK,IAAI,e,GAAwC,MAAM,W,EAAuB,yBAAc,YAAR,KAAC,G,GAAwB,MAAM,0B,GAAiI,MAAM,uBAAwB,IAAK,G,GAA+D,MAAM,uBAAwB,IAAK,G,GAA8D,MAAM,uBAAwB,IAAK,G,GAAiE,MAAM,uBAAwB,IAAK,G,GAAiE,MAAM,uBAAwB,IAAK,G,mJAAl8B,sEAAwY,MAAxY,EAAwY,CAAhV,yBAAoR,MAApR,EAAoR,E,yBAAhQ,yBAA0P,MAA1P,EAA0P,CAAxM,EAAwF,yBAA0G,SAA1G,EAA0G,eAAY,yBAAsD,MAAtD,EAAsD,CAAlY,0DAAoWA,WAAO,GAAG,MAA0B,yBAAypB,MAAzpB,EAAypB,CAArnB,yBAA+mB,GAA3lB,MAAM,sBAAsB,UAAO,IAAI,2C,CAAve,WAAihB,iBAAkG,CAA3C,GAARC,Y,yBAA/C,yBAAkG,IAAlG,EAA8D,qCAA/kB,uCAA0qB,GAARA,Y,yBAA/C,yBAAiG,IAAjG,EAA8D,oCAAjrB,uCAA2wB,GAARA,Y,yBAA/C,yBAAoG,IAApG,EAA8D,uCAAlxB,uCAA+2B,GAARA,Y,yBAA/C,yBAAoG,IAApG,EAA8D,uCAAt3B,uCAAm9B,GAARA,Y,yBAA/C,yBAA0G,IAA1G,EAA8D,6CAA19B,oD,OA0Be,GACbC,KAAM,cACNC,KAAM,iBAAO,CACXC,mBAAoB,KACpBJ,QAAS,EACTC,SAAU,IAEZI,QAPa,WAQX,IAAMC,EAAWC,KAAKC,MAAMC,YACxBC,EAASJ,EAASK,EAAEC,QAAQC,MAC5BC,EAAgB,EAAIC,KAAKC,GAAKN,EAClCJ,EAASW,MAAMC,YACb,uBADF,UAEKX,KAAKH,mBAFV,OAIAE,EAASW,MAAMC,YAAY,kBAAmBJ,GAC9CK,YAAW,kBAAOb,EAASW,MAAMG,iBAAmB,IAAI,KACxDb,KAAKc,mBAEPC,QAAS,CACPD,gBADO,WACW,WACVE,EAAWhB,KAAKH,mBAAqB,IACvCoB,EAAU,EACVC,EAAmBC,aAAY,WACjB,MAAZF,IACFG,OAAOC,cAAcH,GACrB,EAAKI,sBAES,IAAZL,IAAe,EAAKvB,SAAW,GACnB,KAAZuB,IAAgB,EAAKvB,SAAW,GACpB,KAAZuB,IAAgB,EAAKvB,SAAW,GACpB,KAAZuB,IAAgB,EAAKvB,SAAW,GACpB,KAAZuB,IAAgB,EAAKvB,SAAW,GAEpC,EAAKD,QAAUwB,EACfA,MACCD,IAELM,mBAnBO,WAmBc,WACnBV,YAAW,WACT,EAAKW,QAAQC,KAAK,CAAE7B,KAAM,eACzB,QAGP8B,SAAU,I,UCjEZ,EAAOC,OAASA,EAChB,EAAOC,UAAY,kBAEJ","file":"js/chunk-b7096b0c.d8a9f4b8.js","sourcesContent":["export * from \"-!../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--7-oneOf-1-0!../../../node_modules/css-loader/dist/cjs.js??ref--7-oneOf-1-1!../../../node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist/stylePostLoader.js!../../../node_modules/postcss-loader/src/index.js??ref--7-oneOf-1-2!../../../node_modules/sass-loader/dist/cjs.js??ref--7-oneOf-1-3!../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist/index.js??ref--0-1!./StepLoading.vue?vue&type=style&index=0&id=7de7ab1b&lang=scss&scoped=true\"","<template lang=\"pug\">\n.flex.items-center.justify-center.mt-6.mb-6\n  .circle\n    svg.circle__svg(width=\"160\", height=\"160\")\n      circle.circle__progress.circle__progress--path(cx=\"80\", cy=\"80\", r=\"68\")\n      circle.circle__progress.circle__progress--fill(\n        cx=\"80\",\n        cy=\"80\",\n        r=\"68\",\n        ref=\"circle_fill\"\n      )\n  .counter {{ percent }}\n    span %\n\n.step-description.mb-10\n  XyzTransitionGroup.flex.justify-center(\n    appear,\n    xyz=\"fade right out-left delay-5 out-delay-0\"\n  )\n    p.absolute.text-center(:key=\"1\", v-if=\"text_num == 1\") Procesando datos introducidos...\n    p.absolute.text-center(:key=\"2\", v-if=\"text_num == 2\") Cálculo del perfil dietético...\n    p.absolute.text-center(:key=\"3\", v-if=\"text_num == 3\") Calculando cantidad de calorias...\n    p.absolute.text-center(:key=\"4\", v-if=\"text_num == 4\") Seleccionando recetas adecuadas...\n    p.absolute.text-center(:key=\"5\", v-if=\"text_num == 5\") ¡Tu dieta keto personalizada esta lista!\n</template>\n<script>\nexport default {\n  name: \"StepLoading\",\n  data: () => ({\n    transitionDuration: 12000,\n    percent: 0,\n    text_num: 1,\n  }),\n  mounted() {\n    const progress = this.$refs.circle_fill;\n    let radius = progress.r.baseVal.value;\n    let circumference = 2 * Math.PI * radius;\n    progress.style.setProperty(\n      \"--transitionDuration\",\n      `${this.transitionDuration}ms`\n    );\n    progress.style.setProperty(\"--initialStroke\", circumference);\n    setTimeout(() => (progress.style.strokeDashoffset = 0), 100);\n    this.activateCounter();\n  },\n  methods: {\n    activateCounter() {\n      const interval = this.transitionDuration / 100;\n      let counter = 0;\n      let increaseInterval = setInterval(() => {\n        if (counter === 100) {\n          window.clearInterval(increaseInterval);\n          this.redirectToAnalysis();\n        }\n        if (counter === 1) this.text_num = 1;\n        if (counter === 30) this.text_num = 2;\n        if (counter === 50) this.text_num = 3;\n        if (counter === 70) this.text_num = 4;\n        if (counter === 95) this.text_num = 5;\n\n        this.percent = counter;\n        counter++;\n      }, interval);\n    },\n    redirectToAnalysis() {\n      setTimeout(() => {\n        this.$router.push({ name: \"Analysis\" });\n      }, 1200);\n    },\n  },\n  computed: {},\n};\n</script>\n<style lang=\"scss\" scoped>\n.counter {\n  @apply font-semibold text-5xl absolute pr-3 text-left;\n  span {\n    @apply text-xl absolute;\n  }\n}\n\n.circle {\n  position: relative;\n}\n\n.circle__svg {\n  transform: rotate(-90deg);\n}\n\n.circle__progress {\n  fill: none;\n  stroke-width: 8;\n  stroke-opacity: 0.3;\n  stroke-linecap: round;\n}\n\n.circle__progress {\n  stroke: #71aa00;\n}\n\n.circle__progress--fill {\n  --initialStroke: 0;\n  --transitionDuration: 0;\n  stroke-opacity: 1;\n  stroke-dasharray: var(--initialStroke);\n  stroke-dashoffset: var(--initialStroke);\n  transition: stroke-dashoffset var(--transitionDuration)\n    cubic-bezier(0.22, 0.5, 0.92, 0.57);\n  filter: drop-shadow(0px 0px 6px rgba(77, 124, 15, 0.5));\n}\n\n.descriptions-enter-active,\n.descriptions-leave-active {\n  display: inline-block;\n  transition: all 1s ease;\n}\n.descriptions-enter-from,\n.descriptions-leave-to {\n  opacity: 0;\n  transform: translateX(30px);\n}\n\n.step-description {\n  p {\n    @apply font-medium text-green-700;\n  }\n}\n</style>","import { render } from \"./StepLoading.vue?vue&type=template&id=7de7ab1b&scoped=true&lang=pug\"\nimport script from \"./StepLoading.vue?vue&type=script&lang=js\"\nexport * from \"./StepLoading.vue?vue&type=script&lang=js\"\n\nimport \"./StepLoading.vue?vue&type=style&index=0&id=7de7ab1b&lang=scss&scoped=true\"\nscript.render = render\nscript.__scopeId = \"data-v-7de7ab1b\"\n\nexport default script"],"sourceRoot":""}