{"version":3,"sources":["webpack:///./src/gamification/views/RewardsBankFormView.vue?3b66","webpack:///src/gamification/views/RewardsBankFormView.vue","webpack:///./src/gamification/views/RewardsBankFormView.vue?6c52","webpack:///./src/gamification/views/RewardsBankFormView.vue","webpack:///./src/gamification/components/RewardCard.vue?4198","webpack:///src/gamification/components/RewardCard.vue","webpack:///./src/gamification/components/RewardCard.vue?76d0","webpack:///./src/gamification/components/RewardCard.vue","webpack:///./src/gamification/views/RewardsBankFormView.vue?00e0","webpack:///./src/assets/coin2.png","webpack:///./src/gamification/components/skeletons/RewardSkeleton.vue?d75b","webpack:///./src/gamification/components/skeletons/RewardSkeleton.vue","webpack:///./src/gamification/components/RewardCard.vue?8308","webpack:///./src/assets/empty-rewards.jpg"],"names":["render","_vm","this","_h","$createElement","_c","_self","attrs","staticClass","_v","_l","reward","id","key","class","selected","on","$event","selectReward","createDefaultRewards","_e","staticRenderFns","data","defaultRewards","showSaveButton","sessionStore","loading","components","NavBar","rewardCard","RewardSkeleton","computed","userIsAParent","childId","childSelectedId","userId","rewardsSelected","filter","methods","watch","component","_m","_s","rewardData","coins_required","rewardBank","favoriteButtonStyle","updateStatusFavorite","userIsParent","parentCanEdit","scopedSlots","_u","fn","proxy","openModalUpdateReward","modalDeleteReward","attachment","directives","name","rawName","claimed","coinsBanked","claimReward","toFixed","last_claimed_date","formatLongDateTime","props","type","Object","Boolean","default","Number","getCurrentChild","$emit","module","exports","skeleton","script"],"mappings":"yHAAA,IAAIA,EAAS,WAAa,IAAIC,EAAIC,KAASC,EAAGF,EAAIG,eAAmBC,EAAGJ,EAAIK,MAAMD,IAAIF,EAAG,OAAOE,EAAG,MAAM,CAACA,EAAG,UAAU,CAACE,MAAM,CAAC,MAAQ,mBAAmBF,EAAG,MAAM,CAACG,YAAY,eAAe,CAAEP,EAAW,QAAEI,EAAG,mBAAmBA,EAAG,MAAM,CAACG,YAAY,+EAA+E,CAACH,EAAG,KAAK,CAACG,YAAY,0BAA0B,CAACP,EAAIQ,GAAG,uBAAuBJ,EAAG,MAAM,CAACG,YAAY,mHAAmH,CAAEP,EAAkB,eAAEI,EAAG,MAAM,CAACG,YAAY,gFAAgFP,EAAIS,GAAIT,EAAkB,gBAAE,SAASU,EAAOC,GAAI,OAAOP,EAAG,MAAM,CAACQ,IAAID,EAAGJ,YAAY,sDAAsDM,MAAMH,EAAOI,SAAW,UAAY,GAAGC,GAAG,CAAC,MAAQ,SAASC,GAAQ,OAAOhB,EAAIiB,aAAaP,EAAOC,OAAO,CAACP,EAAG,cAAc,CAACE,MAAM,CAAC,cAAcI,EAAO,eAAc,MAAS,MAAK,GAAGN,EAAG,MAAM,CAACG,YAAY,gEAAgE,CAACH,EAAG,OAAO,CAACG,YAAY,oFAAoF,CAACP,EAAIQ,GAAG,qBAAqBJ,EAAG,IAAI,CAACG,YAAY,uBAAuB,CAACP,EAAIQ,GAAG,qDAAsDR,EAAkB,eAAEI,EAAG,SAAS,CAACG,YAAY,4CAA4CQ,GAAG,CAAC,MAAQf,EAAIkB,uBAAuB,CAAClB,EAAIQ,GAAG,YAAYR,EAAImB,QAAQ,IAAI,IACv8CC,EAAkB,G,0zBCuDtB,OACEC,KADF,WAEI,IAAJ,iCACI,MAAO,CACLC,eAAgB,GAChBC,gBAAgB,EAChBC,aAAN,EACMC,SAAS,IAGbC,WAAY,CACVC,OAAJ,OACIC,WAAJ,OACIC,eAAJ,QAEEC,SAAU,CACRC,cADJ,WAEM,OAAO9B,KAAKuB,aAAaO,eAE3BC,QAJJ,WAKM,OAAO/B,KAAK8B,cAAgB9B,KAAKuB,aAAaS,gBAAkBhC,KAAKuB,aAAaU,QAEpFC,gBAPJ,WAQM,OAAOlC,KAAKqB,eAAec,QAAO,SAAxC,0BAGE,QA1BF,uKA4BA,gBA5BA,SA6BA,iBA7BA,OA6BA,oBA7BA,0DA+BA,oBA/BA,yBAiCA,gBAjCA,oIAoCEC,QAAS,CACP,aADJ,oEACA,GADA,iFAEA,gEACA,6CAHA,yGAMI,qBANJ,6KAOA,uBACA,gBACA,4BACA,qBACA,YACA,gBACA,gCACA,cAdA,kBAiBA,4DAjBA,0DAmBA,kCAnBA,QAqBA,mBACA,eACA,QACA,mBAxBA,kHA6BEC,MAAO,CACL,gBADJ,oEACA,KADA,iFAEA,uDAFA,6GCzH4W,I,wBCQxWC,EAAY,eACd,EACAxC,EACAqB,GACA,EACA,KACA,WACA,MAIa,aAAAmB,E,6FCnBf,IAAIxC,EAAS,WAAa,IAAIC,EAAIC,KAASC,EAAGF,EAAIG,eAAmBC,EAAGJ,EAAIK,MAAMD,IAAIF,EAAG,OAAOE,EAAG,MAAM,CAACA,EAAG,MAAM,CAACG,YAAY,qBAAqB,CAACH,EAAG,MAAM,CAACG,YAAY,sGAAsG,CAACP,EAAIwC,GAAG,GAAGpC,EAAG,OAAO,CAACJ,EAAIQ,GAAG,IAAIR,EAAIyC,GAAGzC,EAAI0C,WAAWC,gBAAgB,SAAW3C,EAAI4C,WAAmN5C,EAAImB,KAA3Mf,EAAG,SAAS,CAACG,YAAY,6DAA6DM,MAAMb,EAAI6C,oBAAoBvC,MAAM,CAAC,KAAO,UAAUS,GAAG,CAAC,MAAQf,EAAI8C,uBAAuB,CAAC9C,EAAIQ,GAAG,YAAsBR,EAAI+C,eAAiB/C,EAAI4C,YAAc5C,EAAIgD,cAAe5C,EAAG,aAAa,CAACG,YAAY,uEAAuED,MAAM,CAAC,WAAW,GAAG,QAAU,OAAO,eAAe,cAAc2C,YAAYjD,EAAIkD,GAAG,CAAC,CAACtC,IAAI,iBAAiBuC,GAAG,WAAW,MAAO,CAAC/C,EAAG,IAAI,CAACG,YAAY,6BAA6B,CAACP,EAAIQ,GAAG,kBAAkB4C,OAAM,IAAO,MAAK,EAAM,aAAa,CAAChD,EAAG,SAAS,CAACG,YAAY,0CAA0CQ,GAAG,CAAC,MAAQ,SAASC,GAAQ,OAAOhB,EAAIqD,sBAAsBrD,EAAI0C,eAAe,CAACtC,EAAG,IAAI,CAACG,YAAY,kBAAkB,CAACP,EAAIQ,GAAG,UAAUJ,EAAG,OAAO,CAACG,YAAY,iDAAiD,CAACP,EAAIQ,GAAG,cAAcJ,EAAG,SAAS,CAACG,YAAY,4CAA4CQ,GAAG,CAAC,MAAQf,EAAIsD,oBAAoB,CAAClD,EAAG,IAAI,CAACG,YAAY,mBAAmB,CAACP,EAAIQ,GAAG,YAAYJ,EAAG,OAAO,CAACG,YAAY,iDAAiD,CAACP,EAAIQ,GAAG,kBAAkBR,EAAImB,KAAKf,EAAG,MAAM,CAACG,YAAY,eAAe,CAACH,EAAG,MAAM,CAACG,YAAY,kBAAkBD,MAAM,CAAC,IAAMN,EAAI0C,WAAWa,WAAavD,EAAI0C,WAAWa,WAAa,EAAQ,cAAoC,GAAGnD,EAAG,MAAM,CAACG,YAAY,wEAAwE,CAACH,EAAG,IAAI,CAACoD,WAAW,CAAC,CAACC,KAAK,YAAYC,QAAQ,gBAAgBnD,YAAY,uDAAuDD,MAAM,CAAC,MAAQN,EAAI0C,WAAWe,OAAO,CAACzD,EAAIQ,GAAG,IAAIR,EAAIyC,GAAGzC,EAAI0C,WAAWe,MAAM,OAASzD,EAAI0C,WAAWiB,SAAY3D,EAAI4C,WAAiyC5C,EAAImB,KAAzxCf,EAAG,MAAM,CAACG,YAAY,kEAAkE,CAAEP,EAAI0C,WAAWC,gBAAkB3C,EAAI4D,YAAaxD,EAAG,MAAM,CAACG,YAAY,0BAA0B,CAACH,EAAG,QAAQ,CAACG,YAAY,cAAc,CAACH,EAAG,OAAO,CAACG,YAAY,gCAAgC,CAACP,EAAIQ,GAAG,IAAIR,EAAIyC,GAAGzC,EAAI0C,WAAWC,gBAAgB,OAAO3C,EAAIQ,GAAG,sBAAwBR,EAAI+C,aAAkJ/C,EAAiB,cAAEI,EAAG,SAAS,CAACG,YAAY,mEAAmEQ,GAAG,CAAC,MAAQf,EAAI6D,cAAc,CAAC7D,EAAIQ,GAAG,sBAAsBR,EAAImB,KAAnTf,EAAG,SAAS,CAACG,YAAY,uDAAuDQ,GAAG,CAAC,MAAQf,EAAI6D,cAAc,CAAC7D,EAAIQ,GAAG,eAAoMJ,EAAG,MAAM,CAACG,YAAY,oCAAoC,CAACH,EAAG,QAAQ,CAACG,YAAY,QAAQ,CAACP,EAAIQ,GAAG,cAAcJ,EAAG,OAAO,CAACG,YAAY,gCAAgC,CAACP,EAAIQ,GAAG,IAAIR,EAAIyC,GAAGzC,EAAI0C,WAAWC,eAAiB3C,EAAI4D,aAAa,aAAa5D,EAAIQ,GAAG,YAAYJ,EAAG,aAAa,CAACG,YAAY,kCAAkCD,MAAM,CAAC,IAAMN,EAAI0C,WAAWC,iBAAiB,CAACvC,EAAG,iBAAiB,CAACG,YAAY,wBAAwBD,MAAM,CAAC,MAAQN,EAAI4D,YAAY,OAAY5D,EAAI4D,YAAc5D,EAAI0C,WAAWC,eAAkB,KAAKmB,QAAQ,GAAM,IAAK,gBAAgB,GAAG,SAAW,OAAO,IAAI,OAAkB9D,EAAI4C,WAAkO5C,EAAImB,KAA1Nf,EAAG,OAAO,CAACG,YAAY,4BAA4B,CAACH,EAAG,IAAI,CAACJ,EAAIQ,GAAG,mBAAmBR,EAAIQ,GAAG,IAAIR,EAAIyC,GAAGzC,EAAI0C,WAAWqB,kBAAoB/D,EAAIgE,mBAAmBhE,EAAI0C,WAAWqB,mBAAqB,SAAS,UACljH3C,EAAkB,CAAC,WAAa,IAAIpB,EAAIC,KAASC,EAAGF,EAAIG,eAAmBC,EAAGJ,EAAIK,MAAMD,IAAIF,EAAG,OAAOE,EAAG,MAAM,CAACG,YAAY,cAAc,CAACH,EAAG,MAAM,CAACG,YAAY,QAAQD,MAAM,CAAC,IAAM,EAAQ,QAAsB,IAAM,U,oCC0H9N,GACEe,KADF,WAEI,IAAJ,iCACI,MAAO,CACLG,aAAN,EACMwC,mBAAN,SAGEC,MAAO,CACLvB,WAAY,CACVwB,KAAMC,QAERpB,aAAc,CACZmB,KAAME,QACNC,SAAN,GAEIT,YAAa,CACXM,KAAMI,OACND,QAAN,GAEIzB,WAAY,CACVsB,KAAME,QACNC,SAAN,IAGEvC,SAAU,CACRe,oBADJ,WACA,MACM,OAAN,yFAEIG,cAJJ,WAKM,OAAO/C,KAAKuB,aAAa+C,gBAAgBvB,gBAG7CX,QAAS,CACPS,qBADJ,WAEM7C,KAAKuE,MAAM,mBAEbnB,sBAJJ,SAIA,GACMpD,KAAKuE,MAAM,wBAAyB,CAA1C,gBAEIlB,kBAPJ,WAQMrD,KAAKuE,MAAM,iBAEbX,YAVJ,WAWM5D,KAAKuE,MAAM,kBCvKkV,I,wBCQ/VjC,EAAY,eACd,EACAxC,EACAqB,GACA,EACA,KACA,WACA,MAIa,OAAAmB,E,6CCnBf,yBAAmmB,EAAG,G,qBCAtmBkC,EAAOC,QAAU,IAA0B,0B,kCCA3C,IAAI3E,EAAS,SAAUG,EAAGF,GAAM,IAAII,EAAGJ,EAAII,GAAG,OAAOA,EAAG,MAAM,CAACG,YAAY,yBAAyB,CAACH,EAAG,UAAU,CAACG,YAAY,kDAAkDD,MAAM,CAAC,KAAO,GAAG,QAAU,YAAY,CAACF,EAAG,aAAa,CAACE,MAAM,CAAC,UAAY,OAAO,OAAS,OAAO,MAAQ,WAAW,GAAGF,EAAG,QAAQ,CAACG,YAAY,yGAAyGP,EAAIS,GAAG,CAAE,EAAG,EAAG,IAAI,SAASkE,GAAU,OAAOvE,EAAG,QAAQ,CAACQ,IAAI+D,EAASpE,YAAY,uDAAuD,CAACH,EAAG,MAAM,CAACG,YAAY,qBAAqB,CAACH,EAAG,aAAa,CAACE,MAAM,CAAC,UAAY,OAAO,OAAS,QAAQ,MAAQ,WAAW,QAAO,IAAI,IACvrBc,EAAkB,G,YCAlBwD,EAAS,GAKTrC,EAAY,eACdqC,EACA7E,EACAqB,GACA,EACA,KACA,KACA,MAIa,OAAAmB,E,2CCjBf,yBAA0lB,EAAG,G,qBCA7lBkC,EAAOC,QAAU,IAA0B","file":"js/chunk-0f949b04.092e2c95.js","sourcesContent":["var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',[_c('nav-bar',{attrs:{\"title\":'Rewards banks'}}),_c('div',{staticClass:\"mobile py-4\"},[(_vm.loading)?_c('reward-skeleton'):_c('div',{staticClass:\"atm-desktop-max-width d-flex flex-wrap gap-4 justify-content-center mx-auto\"},[_c('h3',{staticClass:\"font-weight-bold w-100\"},[_vm._v(\"Bank reward Ideas\")]),_c('div',{staticClass:\"d-flex flex-wrap gap-4 justify-content-center align-items-stretch w-100 atm-desktop-max-width px-4 py-4 mx-auto\"},[(_vm.defaultRewards)?_c('div',{staticClass:\"d-flex gap-4 flex-wrap justify-content-center align-items-stretch w-100 mt-4\"},_vm._l((_vm.defaultRewards),function(reward,id){return _c('div',{key:id,staticClass:\"position-relative rewardCard atm-rounded atm-shadow\",class:reward.selected ? 'bg-gray' : '',on:{\"click\":function($event){return _vm.selectReward(reward.id)}}},[_c('reward-card',{attrs:{\"reward-data\":reward,\"reward-bank\":true}})],1)}),0):_c('div',{staticClass:\"d-flex flex-column justify-content-center align-items-center\"},[_c('span',{staticClass:\"material-icons border-2 full-icon rounded-circle align-middle mt-5 mb-4 border-0\"},[_vm._v(\" card_giftcard \")]),_c('p',{staticClass:\"h4 text-xmuted mx-4\"},[_vm._v(\" There is no banked rewards at the moment. \")])])]),(_vm.showSaveButton)?_c('button',{staticClass:\"atm-button bg-main mt-2 mb-4 w-50 mx-auto\",on:{\"click\":_vm.createDefaultRewards}},[_vm._v(\" Save \")]):_vm._e()])],1)],1)}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n  <div>\n    <nav-bar :title=\"'Rewards banks'\"></nav-bar>\n    <div class=\"mobile py-4\">\n      <reward-skeleton v-if=\"loading\"></reward-skeleton>\n      <div\n        v-else\n        class=\"atm-desktop-max-width d-flex flex-wrap gap-4 justify-content-center mx-auto\"\n      >\n        <h3 class=\"font-weight-bold w-100\">Bank reward Ideas</h3>\n        <div\n          class=\"d-flex flex-wrap gap-4 justify-content-center align-items-stretch w-100 atm-desktop-max-width px-4 py-4 mx-auto\"\n        >\n          <div\n            v-if=\"defaultRewards\"\n            class=\"d-flex gap-4 flex-wrap justify-content-center align-items-stretch w-100 mt-4\"\n          >\n            <div\n              v-for=\"(reward, id) in defaultRewards\"\n              :key=\"id\"\n              class=\"position-relative rewardCard atm-rounded atm-shadow\"\n              :class=\"reward.selected ? 'bg-gray' : ''\"\n              @click=\"selectReward(reward.id)\"\n            >\n              <reward-card :reward-data=\"reward\" :reward-bank=\"true\" />\n            </div>\n          </div>\n          <div v-else class=\"d-flex flex-column justify-content-center align-items-center\">\n            <span\n              class=\"material-icons border-2 full-icon rounded-circle align-middle mt-5 mb-4 border-0\"\n            >\n              card_giftcard\n            </span>\n            <p class=\"h4 text-xmuted mx-4\">\n              There is no banked rewards at the moment.\n            </p>\n          </div>\n        </div>\n        <button\n          v-if=\"showSaveButton\"\n          class=\"atm-button bg-main mt-2 mb-4 w-50 mx-auto\"\n          @click=\"createDefaultRewards\"\n        >\n          Save\n        </button>\n      </div>\n    </div>\n  </div>\n</template>\n<script>\nimport { NavBar } from '@/common/components';\nimport rewardCard from '../components/RewardCard.vue';\nimport RewardSkeleton from '../components/skeletons/RewardSkeleton.vue';\nimport { getDefaultRewards, setCreateReward } from '../services';\nimport { useSessionStore } from '@/common';\n\nexport default {\n  data() {\n    const sessionStore = useSessionStore();\n    return {\n      defaultRewards: [],\n      showSaveButton: false,\n      sessionStore,\n      loading: false,\n    };\n  },\n  components: {\n    NavBar,\n    rewardCard,\n    RewardSkeleton,\n  },\n  computed: {\n    userIsAParent() {\n      return this.sessionStore.userIsAParent;\n    },\n    childId() {\n      return this.userIsAParent ? this.sessionStore.childSelectedId : this.sessionStore.userId;\n    },\n    rewardsSelected() {\n      return this.defaultRewards.filter((reward) => reward.selected);\n    },\n  },\n  async mounted() {\n    try {\n      this.loading = true;\n      this.defaultRewards = await getDefaultRewards();\n    } catch (error) {\n      console.error(error);\n    } finally {\n      this.loading = false;\n    }\n  },\n  methods: {\n    async selectReward(newRewardId) {\n      this.defaultRewards = this.defaultRewards.map((reward) =>\n        reward.id === newRewardId ? { ...reward, selected: !reward.selected } : reward,\n      );\n    },\n    async createDefaultRewards() {\n      const rewardsDefaultSelected = this.rewardsSelected;\n      this.loading = true;\n      const payloadRewardsSelected = rewardsDefaultSelected.map((reward) => ({\n        prepopulated_id: reward.id,\n        name: reward.name,\n        child: this.childId,\n        coins_required: reward.coins_required,\n        re_use: false,\n      }));\n      try {\n        await Promise.all(payloadRewardsSelected.map((reward) => setCreateReward(reward)));\n      } catch (error) {\n        console.error('rewardsForm', error);\n      }\n      this.$router.push({\n        name: 'rewards',\n        params: {\n          markComplete: true,\n        },\n      });\n    },\n  },\n  watch: {\n    async rewardsSelected(newRewardsSelected, oldRewardsSelected) {\n      newRewardsSelected.length ? (this.showSaveButton = true) : (this.showSaveButton = false);\n    },\n  },\n};\n</script>\n\n<style lang=\"scss\" scoped>\n.rewardCard {\n  min-width: 160px;\n  max-width: 260px;\n  flex-grow: 1;\n  transition: 200ms;\n  &:hover {\n    background-color: rgba(224, 224, 224, 0.5);\n    cursor: pointer;\n    transform: scale(1.05);\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!./RewardsBankFormView.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!./RewardsBankFormView.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./RewardsBankFormView.vue?vue&type=template&id=5e04be29&scoped=true&\"\nimport script from \"./RewardsBankFormView.vue?vue&type=script&lang=js&\"\nexport * from \"./RewardsBankFormView.vue?vue&type=script&lang=js&\"\nimport style0 from \"./RewardsBankFormView.vue?vue&type=style&index=0&id=5e04be29&lang=scss&scoped=true&\"\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  \"5e04be29\",\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',[_c('div',{staticClass:\"position-relative\"},[_c('div',{staticClass:\" coinsValue position-absolute d-flex align-items-center bg-light px-2 py-1 rounded-pill atm-shadow\"},[_vm._m(0),_c('span',[_vm._v(\" \"+_vm._s(_vm.rewardData.coins_required)+\" \")])]),(!_vm.rewardBank)?_c('button',{staticClass:\"favouriteButton position-absolute material-icons-round p-0\",class:_vm.favoriteButtonStyle,attrs:{\"type\":\"button\"},on:{\"click\":_vm.updateStatusFavorite}},[_vm._v(\" star \")]):_vm._e(),(_vm.userIsParent && !_vm.rewardBank && _vm.parentCanEdit)?_c('b-dropdown',{staticClass:\"dropdownStyle position-absolute bg-light rounded-pill p-1 atm-shadow\",attrs:{\"no-caret\":\"\",\"variant\":\"none\",\"toggle-class\":\"d-flex p-0\"},scopedSlots:_vm._u([{key:\"button-content\",fn:function(){return [_c('i',{staticClass:\"material-icons text-dark \"},[_vm._v(\"more_horiz\")])]},proxy:true}],null,false,2165089865)},[_c('button',{staticClass:\"dropdownItem text-dark d-flex p-2 w-100\",on:{\"click\":function($event){return _vm.openModalUpdateReward(_vm.rewardData)}}},[_c('i',{staticClass:\"material-icons\"},[_vm._v(\"edit\")]),_c('span',{staticClass:\" font-weight-bold text-capitalize text-center\"},[_vm._v(\" Edit \")])]),_c('button',{staticClass:\"dropdownItem text-danger d-flex p-2 w-100\",on:{\"click\":_vm.modalDeleteReward}},[_c('i',{staticClass:\"material-icons \"},[_vm._v(\"delete\")]),_c('span',{staticClass:\" font-weight-bold text-capitalize text-center\"},[_vm._v(\" Delete \")])])]):_vm._e(),_c('div',{staticClass:\"rewardImage\"},[_c('img',{staticClass:\"atm-rounded-top\",attrs:{\"src\":_vm.rewardData.attachment ? _vm.rewardData.attachment : require(\"@/assets/empty-rewards.jpg\")}})])],1),_c('div',{staticClass:\"d-flex flex-column justify-items-center align-items-center p-3 w-100\"},[_c('p',{directives:[{name:\"b-tooltip\",rawName:\"v-b-tooltip\"}],staticClass:\"reward-name text-blue-dark font-weight-bold h5 w-100\",attrs:{\"title\":_vm.rewardData.name}},[_vm._v(\" \"+_vm._s(_vm.rewardData.name)+\" \")]),(!_vm.rewardData.claimed && !_vm.rewardBank)?_c('div',{staticClass:\"d-flex flex-wrap justify-items-center align-items-center w-100\"},[(_vm.rewardData.coins_required <= _vm.coinsBanked)?_c('div',{staticClass:\"d-flex flex-wrap w-100\"},[_c('small',{staticClass:\"mb-2 w-100\"},[_c('span',{staticClass:\"font-weight-bold text-orange\"},[_vm._v(\" \"+_vm._s(_vm.rewardData.coins_required)+\" \")]),_vm._v(\" coins to claim \")]),(!_vm.userIsParent)?_c('button',{staticClass:\"claimButton atm-button bg-main bottom-0 w-50 mx-auto\",on:{\"click\":_vm.claimReward}},[_vm._v(\" Claim \")]):(_vm.parentCanEdit)?_c('button',{staticClass:\"claimButton atm-button text-center bg-main bottom-0 w-75 mx-auto\",on:{\"click\":_vm.claimReward}},[_vm._v(\" Ready to claim \")]):_vm._e()]):_c('div',{staticClass:\"d-flex flex-grow flex-wrap w-100\"},[_c('small',{staticClass:\"mb-2\"},[_vm._v(\" You need \"),_c('span',{staticClass:\"font-weight-bold text-orange\"},[_vm._v(\" \"+_vm._s(_vm.rewardData.coins_required - _vm.coinsBanked)+\" coins \")]),_vm._v(\" more \")]),_c('b-progress',{staticClass:\"progress-bar rounded-pill w-100\",attrs:{\"max\":_vm.rewardData.coins_required}},[_c('b-progress-bar',{staticClass:\"progress rounded-pill\",attrs:{\"value\":_vm.coinsBanked,\"label\":((((_vm.coinsBanked / _vm.rewardData.coins_required) * 100).toFixed(1)) + \"%\"),\"show-progress\":\"\",\"animated\":\"\"}})],1)],1)]):_vm._e()]),(!_vm.rewardBank)?_c('span',{staticClass:\"labelDate text-blue-dark\"},[_c('b',[_vm._v(\"Last Claimed:\")]),_vm._v(\" \"+_vm._s(_vm.rewardData.last_claimed_date ? _vm.formatLongDateTime(_vm.rewardData.last_claimed_date) : 'Never')+\" \")]):_vm._e()])}\nvar staticRenderFns = [function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"h-100 mr-2\"},[_c('img',{staticClass:\"h-100\",attrs:{\"src\":require(\"@/assets/coin2.png\"),\"alt\":\"\"}})])}]\n\nexport { render, staticRenderFns }","<template>\n  <div>\n    <div class=\"position-relative\">\n      <div\n        class=\" coinsValue position-absolute d-flex align-items-center bg-light px-2 py-1 rounded-pill atm-shadow\"\n      >\n        <div class=\"h-100 mr-2\">\n          <img src=\"@/assets/coin2.png\" alt=\"\" class=\"h-100\" />\n        </div>\n        <span>\n          {{ rewardData.coins_required }}\n        </span>\n      </div>\n      <button\n        v-if=\"!rewardBank\"\n        type=\"button\"\n        class=\"favouriteButton position-absolute material-icons-round p-0\"\n        :class=\"favoriteButtonStyle\"\n        @click=\"updateStatusFavorite\"\n      >\n        star\n      </button>\n      <b-dropdown\n        v-if=\"userIsParent && !rewardBank && parentCanEdit\"\n        no-caret\n        variant=\"none\"\n        class=\"dropdownStyle position-absolute bg-light rounded-pill p-1 atm-shadow\"\n        toggle-class=\"d-flex p-0\"\n      >\n        <template #button-content class=\"text-decoration-none\">\n          <i class=\"material-icons text-dark \">more_horiz</i>\n        </template>\n        <button\n          @click=\"openModalUpdateReward(rewardData)\"\n          class=\"dropdownItem text-dark d-flex p-2 w-100\"\n        >\n          <i class=\"material-icons\">edit</i>\n          <span class=\" font-weight-bold text-capitalize text-center\">\n            Edit\n          </span>\n        </button>\n        <button @click=\"modalDeleteReward\" class=\"dropdownItem text-danger d-flex p-2 w-100\">\n          <i class=\"material-icons \">delete</i>\n          <span class=\" font-weight-bold text-capitalize text-center\">\n            Delete\n          </span>\n        </button>\n      </b-dropdown>\n      <div class=\"rewardImage\">\n        <img\n          :src=\"\n            rewardData.attachment ? rewardData.attachment : require(`@/assets/empty-rewards.jpg`)\n          \"\n          class=\"atm-rounded-top\"\n        />\n      </div>\n    </div>\n    <div class=\"d-flex flex-column justify-items-center align-items-center p-3 w-100\">\n      <p\n        class=\"reward-name text-blue-dark font-weight-bold h5 w-100\"\n        v-b-tooltip\n        :title=\"rewardData.name\"\n      >\n        {{ rewardData.name }}\n      </p>\n      <div\n        v-if=\"!rewardData.claimed && !rewardBank\"\n        class=\"d-flex flex-wrap justify-items-center align-items-center w-100\"\n      >\n        <div v-if=\"rewardData.coins_required <= coinsBanked\" class=\"d-flex flex-wrap w-100\">\n          <small class=\"mb-2 w-100\">\n            <span class=\"font-weight-bold text-orange\">\n              {{ rewardData.coins_required }}\n            </span>\n            coins to claim\n          </small>\n          <button\n            v-if=\"!userIsParent\"\n            class=\"claimButton atm-button bg-main bottom-0 w-50 mx-auto\"\n            @click=\"claimReward\"\n          >\n            Claim\n          </button>\n          <button\n            v-else-if=\"parentCanEdit\"\n            class=\"claimButton atm-button text-center bg-main bottom-0 w-75 mx-auto\"\n            @click=\"claimReward\"\n          >\n            Ready to claim\n          </button>\n        </div>\n        <div v-else class=\"d-flex flex-grow flex-wrap w-100\">\n          <small class=\"mb-2\">\n            You need\n            <span class=\"font-weight-bold text-orange\">\n              {{ rewardData.coins_required - coinsBanked }} coins\n            </span>\n            more\n          </small>\n          <b-progress :max=\"rewardData.coins_required\" class=\"progress-bar rounded-pill w-100\">\n            <b-progress-bar\n              :value=\"coinsBanked\"\n              :label=\"`${((coinsBanked / rewardData.coins_required) * 100).toFixed(1)}%`\"\n              class=\"progress rounded-pill\"\n              show-progress\n              animated\n            ></b-progress-bar>\n          </b-progress>\n        </div>\n      </div>\n    </div>\n    <span v-if=\"!rewardBank\" class=\"labelDate text-blue-dark\">\n      <b>Last Claimed:</b>\n      {{\n        rewardData.last_claimed_date ? formatLongDateTime(rewardData.last_claimed_date) : 'Never'\n      }}\n    </span>\n  </div>\n</template>\n<script>\nimport { useSessionStore } from '@/common';\nimport { formatLongDateTime } from '@/common/utils/Date';\n\nexport default {\n  data() {\n    const sessionStore = useSessionStore();\n    return {\n      sessionStore,\n      formatLongDateTime,\n    };\n  },\n  props: {\n    rewardData: {\n      type: Object,\n    },\n    userIsParent: {\n      type: Boolean,\n      default: false,\n    },\n    coinsBanked: {\n      type: Number,\n      default: 0,\n    },\n    rewardBank: {\n      type: Boolean,\n      default: false,\n    },\n  },\n  computed: {\n    favoriteButtonStyle() {\n      return this.rewardData?.favorite ? 'favouriteColor' : 'text-light';\n    },\n    parentCanEdit() {\n      return this.sessionStore.getCurrentChild.parentCanEdit;\n    },\n  },\n  methods: {\n    updateStatusFavorite() {\n      this.$emit('changeFavorite');\n    },\n    openModalUpdateReward(rewardData) {\n      this.$emit('openModalUpdateReward', { rewardData });\n    },\n    modalDeleteReward() {\n      this.$emit('deleteReward');\n    },\n    claimReward() {\n      this.$emit('claimReward');\n    },\n  },\n};\n</script>\n<style lang=\"scss\" scoped>\n.fit-image {\n  width: 100%;\n  height: 120px;\n  object-fit: cover;\n}\n\n.fit-image-horizontal {\n  width: 100%;\n  height: 100px;\n  object-fit: cover;\n}\n\n.biger-icon {\n  font-size: 5em !important;\n}\n\n.close {\n  right: 10px;\n}\n\n.coinsValue {\n  height: 30px;\n  top: 10px;\n  left: 10px;\n  & > div {\n    position: relative;\n    top: -2px;\n    height: 100%;\n    & > img {\n      object-fit: contain;\n    }\n  }\n}\n\n.favouriteButton {\n  background-color: transparent;\n  font-size: 2rem;\n  top: 10px;\n  right: 10px;\n  border: none;\n  text-shadow: 2px 2px 6px rgb(0 0 0 / 25%);\n}\n\n.favouriteColor {\n  color: #ff7648;\n}\n\n.dropdownStyle {\n  right: 10px;\n  bottom: 10px;\n}\n\n.dropdownItem {\n  background-color: transparent;\n  border: none;\n}\n\n.rewardImage {\n  width: 100%;\n  height: 200px;\n  & > img {\n    box-shadow: 0 5px 14px -10px #888;\n    width: 100%;\n    height: 100%;\n    object-fit: cover;\n  }\n}\n\n.claimButton {\n  height: min-content;\n}\n\n.reward-name {\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n}\n\n.labelDate {\n  font-size: 12px;\n  margin-top: 8px;\n  margin-left: 20px;\n}\n\n.progress-bar {\n  height: 25px;\n  background-color: #e9ecef;\n  & .progress {\n    background-color: #f9c132;\n    color: black;\n    font-weight: 500;\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!./RewardCard.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!./RewardCard.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./RewardCard.vue?vue&type=template&id=1ab2ac9e&scoped=true&\"\nimport script from \"./RewardCard.vue?vue&type=script&lang=js&\"\nexport * from \"./RewardCard.vue?vue&type=script&lang=js&\"\nimport style0 from \"./RewardCard.vue?vue&type=style&index=0&id=1ab2ac9e&lang=scss&scoped=true&\"\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  \"1ab2ac9e\",\n  null\n  \n)\n\nexport default component.exports","import mod from \"-!../../../node_modules/@vue/cli-service/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!./RewardsBankFormView.vue?vue&type=style&index=0&id=5e04be29&lang=scss&scoped=true&\"; export default mod; export * from \"-!../../../node_modules/@vue/cli-service/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!./RewardsBankFormView.vue?vue&type=style&index=0&id=5e04be29&lang=scss&scoped=true&\"","module.exports = __webpack_public_path__ + \"img/coin2.5c2570b1.png\";","var render = function (_h,_vm) {var _c=_vm._c;return _c('div',{staticClass:\"atm-desktop-max-width\"},[_c('b-alert',{staticClass:\"d-flex justify-content-between p-2 mx-2 mx-lg-5\",attrs:{\"show\":\"\",\"variant\":\"primary\"}},[_c('b-skeleton',{attrs:{\"animation\":\"fade\",\"height\":\"30px\",\"width\":\"100%\"}})],1),_c('b-row',{staticClass:\"d-flex gap-4 justify-content-center align-items-stretch w-100 atm-desktop-max-width px-4 py-4 mx-auto\"},_vm._l(([0, 1, 2]),function(skeleton){return _c('b-col',{key:skeleton,staticClass:\"position-relative rewardCard atm-rounded atm-shadow\"},[_c('div',{staticClass:\"position-relative\"},[_c('b-skeleton',{attrs:{\"animation\":\"fade\",\"height\":\"100px\",\"width\":\"100%\"}})],1)])}),1)],1)}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","import { render, staticRenderFns } from \"./RewardSkeleton.vue?vue&type=template&id=330174a8&functional=true&\"\nvar script = {}\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  true,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports","import mod from \"-!../../../node_modules/@vue/cli-service/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!./RewardCard.vue?vue&type=style&index=0&id=1ab2ac9e&lang=scss&scoped=true&\"; export default mod; export * from \"-!../../../node_modules/@vue/cli-service/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!./RewardCard.vue?vue&type=style&index=0&id=1ab2ac9e&lang=scss&scoped=true&\"","module.exports = __webpack_public_path__ + \"img/empty-rewards.e515031f.jpg\";"],"sourceRoot":""}