{"version":3,"sources":["webpack:///./src/components/Utility/MsgBox.vue?d5b0","webpack:///./src/components/TopUp/CreditCardCoin.vue?3c2d","webpack:///src/components/TopUp/CreditCardCoin.vue","webpack:///./src/components/TopUp/CreditCardCoin.vue?9d60","webpack:///./src/components/TopUp/CreditCardCoin.vue","webpack:///./src/components/Utility/MsgBox.vue?d247","webpack:///src/components/Utility/MsgBox.vue","webpack:///./src/components/Utility/MsgBox.vue?8ca8","webpack:///./src/components/Utility/MsgBox.vue","webpack:///./src/components/TopUp/CreditCardCoin.vue?4637"],"names":["render","_vm","this","_h","$createElement","_c","_self","staticClass","_m","_l","item","key","ProductID","ProductName","on","$event","pickProduct","directives","name","rawName","value","expression","attrs","domProps","_q","pickedID","_v","_s","ThousandPrice","ThousandGold","ThousandVipExp","class","disabledClassHandler","disabledHandler","send","openPopupBox","errorMsg","hideBoxHandler","staticRenderFns","components","ErrorBox","data","resultItem","pickedProduct","productList","computed","methods","toString","trim","result","productID","getSendData","filter","sendData","ProductType","PaymentType","IsActivity","ActivityID","ActType","Amount","Price","submitData","i","length","watch","handler","deep","mounted","getPaymentCoin","component","open","title","cancelBox","msg","props","type","Boolean","required","String","default","$emit","sessionStorage","getItem","removeItem","document","body","style","overflow"],"mappings":"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","file":"js/chunk-758aef99.1699258740020.js","sourcesContent":["import mod 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!./MsgBox.vue?vue&type=style&index=0&id=ad00da36&lang=scss&scoped=true&\"; export default mod; 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!./MsgBox.vue?vue&type=style&index=0&id=ad00da36&lang=scss&scoped=true&\"","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"text-light mt-5\"},[_vm._m(0),_c('div',{staticClass:\"price-items\"},_vm._l((_vm.productList),function(item){return _c('div',{key:item.ProductID + item.ProductName,staticClass:\"price-item d-flex flex-row justify-content-center text-center font-weight-bold py-4 pointer\",on:{\"click\":function($event){return _vm.pickProduct(item.ProductID)}}},[_c('div',{staticClass:\"col-3 custom-control custom-radio custom-control-inline d-flex flex-row justify-content-center\"},[_c('input',{directives:[{name:\"model\",rawName:\"v-model\",value:(_vm.pickedID),expression:\"pickedID\"}],staticClass:\"custom-control-input\",attrs:{\"type\":\"radio\",\"id\":item.ProductID + item.ProductName},domProps:{\"value\":item.ProductID,\"checked\":_vm._q(_vm.pickedID,item.ProductID)},on:{\"change\":function($event){_vm.pickedID=item.ProductID}}}),_c('label',{staticClass:\"custom-control-label red\",attrs:{\"for\":item.ProductID + item.ProductName}})]),_c('div',{staticClass:\"col-3 text-left custom-number d-flex flex-row  align-items-center\"},[_c('div',[_vm._v(_vm._s(item.ThousandPrice))])]),_c('div',{staticClass:\"col-3 star-box text-left custom-number d-flex flex-row  align-items-center\"},[_c('div',[_vm._v(_vm._s(item.ThousandGold))]),_c('div',{staticClass:\"star-icon\"})]),_c('div',{staticClass:\"col-3 point-box text-left custom-number d-flex flex-row  align-items-center\"},[_c('div',[_vm._v(_vm._s(item.ThousandVipExp))]),_c('div',{staticClass:\"point-icon\"})])])}),0),_c('div',{staticClass:\"d-flex flex-row justify-content-center px-0 mt-4 \"},[_c('button',{staticClass:\"btn btn-top-up send-btn btn-style py-2 px-5 mt-1 mb-2 d-flex align-items-center font-weight-bold\",class:_vm.disabledClassHandler(_vm.pickedID),attrs:{\"disabled\":_vm.disabledHandler(_vm.pickedID)},on:{\"click\":_vm.send}},[_vm._v(\"確定送出\")])]),_c('form',{staticClass:\"d-none\",attrs:{\"id\":\"form-coin\",\"action\":\"\",\"method\":\"post\",\"accept-charset\":\"utf-8\"}}),_c('ErrorBox',{attrs:{\"openPopupBox\":_vm.openPopupBox,\"msg\":_vm.errorMsg},on:{\"hideBoxHandler\":_vm.hideBoxHandler}})],1)}\nvar staticRenderFns = [function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"title d-flex flex-row justify-content-center text-center font-weight-bold py-2\"},[_c('div',{staticClass:\"col-3 d-flex flex-row align-items-center justify-content-center custom-title-radio\"},[_c('div',[_vm._v(\"點選\")])]),_c('div',{staticClass:\"col-3 text-left d-flex flex-row align-items-center custom-title\"},[_c('div',[_vm._v(\"價錢\")])]),_c('div',{staticClass:\"col-3 text-left d-flex flex-row align-items-center custom-title\"},[_c('div',[_vm._v(\"金幣\")])]),_c('div',{staticClass:\"col-3 text-left d-flex flex-row align-items-center custom-title\"},[_c('div',[_vm._v(\"VIP\")])])])}]\n\nexport { render, staticRenderFns }","<template>\r\n  <div class=\"text-light mt-5\">\r\n    <div class=\"title d-flex flex-row justify-content-center text-center font-weight-bold py-2\">\r\n      <div class=\"col-3 d-flex flex-row align-items-center justify-content-center custom-title-radio\">\r\n        <div>點選</div>\r\n      </div>\r\n      <div class=\"col-3 text-left d-flex flex-row align-items-center custom-title\">\r\n        <div>價錢</div>\r\n      </div>\r\n      <div class=\"col-3 text-left d-flex flex-row align-items-center custom-title\">\r\n        <div>金幣</div>\r\n      </div>\r\n      <div class=\"col-3 text-left d-flex flex-row align-items-center custom-title\">\r\n        <div>VIP</div>\r\n      </div>\r\n    </div>\r\n    <div class=\"price-items\">\r\n      <div v-for=\"item in productList\" :key=\"item.ProductID + item.ProductName\" class=\"price-item d-flex flex-row justify-content-center text-center font-weight-bold py-4 pointer\" @click=\"pickProduct(item.ProductID)\">\r\n        <div class=\"col-3 custom-control custom-radio custom-control-inline d-flex flex-row justify-content-center\">\r\n          <input type=\"radio\" :id=\"item.ProductID + item.ProductName\"  class=\"custom-control-input\" :value=\"item.ProductID\" v-model=\"pickedID\">\r\n          <label class=\"custom-control-label red\" :for=\"item.ProductID + item.ProductName\"></label>\r\n        </div>\r\n        <div class=\"col-3 text-left custom-number d-flex flex-row  align-items-center\">\r\n          <div>{{item.ThousandPrice}}</div>\r\n        </div>\r\n        <div class=\"col-3 star-box text-left custom-number d-flex flex-row  align-items-center\">\r\n          <div>{{item.ThousandGold}}</div>\r\n          <div class=\"star-icon\"></div>\r\n        </div>\r\n        <div class=\"col-3 point-box text-left custom-number d-flex flex-row  align-items-center\">\r\n          <div>{{item.ThousandVipExp}}</div>\r\n          <div class=\"point-icon\"></div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n    <div class=\"d-flex flex-row justify-content-center px-0 mt-4 \">\r\n      <button class=\"btn btn-top-up send-btn btn-style py-2 px-5 mt-1 mb-2 d-flex align-items-center font-weight-bold\" @click=\"send\"\r\n      :class=\"disabledClassHandler(pickedID)\" :disabled=\"disabledHandler(pickedID)\">確定送出</button>\r\n    </div>\r\n    <form class=\"d-none\" id=\"form-coin\" action=\"\" method=\"post\" accept-charset=\"utf-8\"></form>\r\n    <ErrorBox :openPopupBox=\"openPopupBox\" :msg=\"errorMsg\" @hideBoxHandler=\"hideBoxHandler\"/>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nimport $ from 'jquery'\r\nimport ErrorBox from '@/components/Utility/MsgBox'\r\nexport default {\r\n  name: 'CreditCardCoin',\r\n  components: {\r\n    ErrorBox\r\n  },\r\n  data () {\r\n    return {\r\n      resultItem: {},\r\n      pickedProduct: {},\r\n      pickedID: '',\r\n      productList: [],\r\n      openPopupBox: false,\r\n      errorMsg: ''\r\n    }\r\n  },\r\n  computed: {\r\n\r\n  },\r\n  methods: {\r\n    disabledHandler (pickedID) {\r\n      let result = true\r\n      if (pickedID && pickedID.toString().trim() !== '') {\r\n        result = false\r\n      }\r\n      return result\r\n    },\r\n    disabledClassHandler (pickedID) {\r\n      let result = true\r\n      if (pickedID && pickedID.toString().trim() !== '') {\r\n        result = false\r\n      }\r\n      return {\r\n        'disabled submit-disabled': result\r\n      }\r\n    },\r\n    pickProduct (productID) {\r\n      this.pickedID = productID\r\n    },\r\n    getSendData () {\r\n      const vm = this\r\n      const sendData = {}\r\n      this.pickedProduct = this.productList.filter(item => parseInt(item.ProductID) === parseInt(vm.pickedID))[0]\r\n      sendData.ProductID = this.pickedProduct.ProductID\r\n      sendData.ProductType = 1\r\n      sendData.PaymentType = 3\r\n      sendData.IsActivity = this.resultItem.IsActivity\r\n      sendData.ActivityID = this.resultItem.ActivityID\r\n      this.resultItem.IsActivity ? sendData.ActType = 1 : sendData.ActType = 0\r\n      sendData.Amount = this.pickedProduct.Price\r\n      return sendData\r\n    },\r\n    async send () {\r\n      const sendData = this.getSendData()\r\n      const result = await this.$store.dispatch('api/CREATE_ORDER', sendData)\r\n      if (parseInt(result.ResultCode) === 200) {\r\n        this.submitData(result)\r\n      } else {\r\n        const errData = result\r\n        this.errorMsg = errData.ResultMsg\r\n        this.openPopupBox = !this.openPopupBox\r\n      }\r\n    },\r\n    submitData (result) {\r\n      const data = result.Result.ItemList\r\n      $('#form-coin').empty()\r\n      for (var i = 0; i < data.length; i++) {\r\n        $('#form-coin').append(\"<input name='\" + data[i].Name + \"' id='\" + data[i].Name + \"' value='\" + data[i].Value + \"'>\")\r\n      }\r\n      $('#form-coin').attr('action', result.Result.ServerUrl)\r\n\r\n      $('#form-coin').submit()\r\n    },\r\n    async getPaymentCoin () {\r\n      const queryData = {\r\n        PaymentType: 3, // 3=綠界、4=MyCard\r\n        ProductType: 0// 0=品項、1=產包\r\n      }\r\n      const result = await this.$store.dispatch('api/GET_PAYMENT_ITEM', queryData)\r\n\r\n      if (result.item.ProductList && result.item.ProductList.length > 0) {\r\n        this.resultItem = result.item\r\n        this.productList = result.item.ProductList\r\n      } else {\r\n        this.utility.errorEmptyData('信用卡支付')\r\n      }\r\n    },\r\n    hideBoxHandler () {\r\n      this.openPopupBox = !this.openPopupBox\r\n    }\r\n  },\r\n  watch: {\r\n    pickedID: {\r\n      handler () {\r\n        // console.log(this.pickedID)\r\n      },\r\n      deep: true\r\n    }\r\n  },\r\n  mounted () {\r\n    this.getPaymentCoin()\r\n  }\r\n}\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n@import \"@/assets/helpers/_grid.scss\";\r\n.submit-disabled{\r\n  cursor: not-allowed;\r\n}\r\n.title{\r\n  background-color: #df4b25;\r\n  border: 2px solid #ffffff;\r\n  border-left: 0;\r\n  border-right: 0;\r\n  font-size: 20px;\r\n}\r\n.star-box{\r\n  position: relative;\r\n}\r\n.point-box{\r\n  position: relative;\r\n}\r\n.star-icon{\r\n  width: 100%;\r\n  height: 100%;\r\n  position: absolute;\r\n  top: 50%;\r\n  left: -1.5%;\r\n  transform: translate(-50%, -50%);\r\n  background-image: url(~@/assets/images/ico/money_star.png);\r\n  background-repeat: no-repeat;\r\n  background-size: contain;\r\n  background-position:center center;\r\n   @include phone{\r\n    left: -15%;\r\n   }\r\n}\r\n.point-icon{\r\n  width: 100%;\r\n  height: 100%;\r\n  position: absolute;\r\n  top: 50%;\r\n  left: -1.5%;\r\n  transform: translate(-50%, -50%);\r\n  background-image: url(~@/assets/images/ico/money_p.png);\r\n  background-repeat: no-repeat;\r\n  background-size: contain;\r\n  background-position:center center;\r\n   @include phone{\r\n    left: -15%;\r\n   }\r\n}\r\n.price-item:nth-child(even){\r\n  background-color: #6e0640;\r\n}\r\n\r\n.custom-radio{\r\n  left: 1.25rem !important;\r\n  @include phone{\r\n    margin: 0;\r\n    padding: 0;\r\n  }\r\n}\r\n.custom-number{\r\n  @include phone{\r\n    font-size: 16px;\r\n    margin: 0;\r\n    margin-right: 10px;\r\n    padding: 0;\r\n  }\r\n}\r\n.custom-title{\r\n  @include phone{\r\n    font-size: 16px;\r\n    margin: 0;\r\n    padding: 0;\r\n    max-width: 25% !important;\r\n    padding-right: 30px;\r\n  }\r\n}\r\n.custom-title-radio{\r\n  @include phone{\r\n    font-size: 16px;\r\n    margin: 0;\r\n    padding: 0;\r\n    max-width: 15% !important;\r\n    padding-right: 20px;\r\n  }\r\n  @include underSmallPhone{\r\n    padding-right: 12px;\r\n  }\r\n}\r\n.send-btn{\r\n  color: #000;\r\n  font-size: 22px;\r\n  background-image: linear-gradient(#fec07e 0%, #ffc600 100%);\r\n  border-radius: 10px;\r\n  box-shadow: 0 0 4px 2px rgba(255,180,44,0.52), 0 0 4px 2px rgba(255,180,44,0.52);\r\n  &:active{\r\n    color: #000 !important;\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!./CreditCardCoin.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!./CreditCardCoin.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./CreditCardCoin.vue?vue&type=template&id=5185e1a0&scoped=true&\"\nimport script from \"./CreditCardCoin.vue?vue&type=script&lang=js&\"\nexport * from \"./CreditCardCoin.vue?vue&type=script&lang=js&\"\nimport style0 from \"./CreditCardCoin.vue?vue&type=style&index=0&id=5185e1a0&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  \"5185e1a0\",\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:\"login-lightbox cover-all\",class:{ open: _vm.openPopupBox }},[_c('div',{staticClass:\"login-lightbox-container\"},[_c('div',{staticClass:\"d-flex justify-content-center\"},[_c('div',{staticClass:\"card border-dark card-style\"},[_c('div',{staticClass:\"card-header d-flex justify-content-center align-items-center font-weight-bold text-center\"},[_c('h3',{staticClass:\"font-weight-bold m-0 ml-auto pl-4 text-style\"},[_vm._v(_vm._s(_vm.title))]),_c('div',{staticClass:\"close-btn ml-auto\",on:{\"click\":_vm.cancelBox}},[_vm._v(\"×\")])]),_c('div',{staticClass:\"card-body text-center\"},[_c('div',{staticClass:\"container news-detail text-light\"},[_c('div',{staticClass:\"col-12 py-3\"},[_vm._v(\" \"+_vm._s(_vm.msg)+\" \")])]),_c('button',{staticClass:\"col-9 btn btn-info mt-3 mb-1 login-style\",on:{\"click\":_vm.cancelBox}},[_c('div',{staticClass:\"login-btn-word\"},[_vm._v(\" OK \")])])])])])])])}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\r\n  <div class=\"login-lightbox cover-all\" :class=\"{ open: openPopupBox }\">\r\n    <div class=\"login-lightbox-container\">\r\n      <div class=\"d-flex justify-content-center\">\r\n        <div class=\"card border-dark card-style\">\r\n          <div class=\"card-header d-flex justify-content-center align-items-center font-weight-bold text-center\">\r\n            <h3 class=\"font-weight-bold m-0 ml-auto pl-4 text-style\">{{title}}</h3>\r\n            <div class=\"close-btn ml-auto\" @click=\"cancelBox\">×</div>\r\n          </div>\r\n          <div class=\"card-body text-center\">\r\n            <div class=\"container news-detail text-light\">\r\n              <div class=\"col-12 py-3\">\r\n                {{msg}}\r\n              </div>\r\n            </div>\r\n            <button class=\"col-9 btn btn-info mt-3 mb-1 login-style\" @click=\"cancelBox\">\r\n              <div class=\"login-btn-word\">\r\n                OK\r\n              </div>\r\n            </button>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nimport '@/assets/_loginLightBox.scss'\r\nexport default {\r\n  name: 'MsgBox',\r\n  components: {\r\n\r\n  },\r\n  props: {\r\n    openPopupBox: {\r\n      type: Boolean,\r\n      required: true\r\n    },\r\n    title: {\r\n      type: String,\r\n      default: '錯誤訊息'\r\n    },\r\n    msg: {\r\n      type: String,\r\n      default: ''\r\n    }\r\n  },\r\n  data () {\r\n    return {\r\n\r\n    }\r\n  },\r\n  computed: {\r\n\r\n  },\r\n  methods: {\r\n    cancelBox () {\r\n      this.$emit('hideBoxHandler')\r\n      if (sessionStorage.getItem('AppleResult')) {\r\n        sessionStorage.removeItem('AppleResult')\r\n      }\r\n      if (sessionStorage.getItem('OrderResult')) {\r\n        sessionStorage.removeItem('OrderResult')\r\n      }\r\n    }\r\n  },\r\n  watch: {\r\n    openPopupBox: {\r\n      handler () {\r\n        if (this.openPopupBox) {\r\n          document.body.style.overflow = 'hidden'\r\n        } else {\r\n          document.body.style.overflow = ''\r\n        }\r\n      }\r\n    }\r\n  }\r\n}\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n@import \"@/assets/helpers/_grid.scss\";\r\n.card-style {\r\n  width: 370px;\r\n  border-radius:12px;\r\n  @include underSmallPhone{\r\n    width: 300px;\r\n  }\r\n}\r\n.close-btn{\r\n  height: 40px;\r\n  line-height: 40px;\r\n  cursor: pointer;\r\n  font-size: 40px;\r\n}\r\n.card-header{\r\n  color: #000;\r\n  background-image: linear-gradient(180deg,#c39943 0,#ffefa6 23%,#ebcc67 50%,#ba8d31 87%,#f9df7b);\r\n  border: 3px solid #c39943 !important;\r\n  border-radius:10px 10px 0 0 !important;\r\n  border-bottom: 0px !important;\r\n}\r\n.card-body{\r\n  background-color: #5f0401;\r\n  border: 3px solid #c39943 !important;\r\n  border-top: 0px !important;\r\n  border-radius: 0 0 8px 8px;\r\n}\r\n.cover-all{\r\n  z-index: 1021;\r\n}\r\n.news-detail{\r\n  max-width: 85vw;\r\n  max-height: 75vh;\r\n  overflow-y:auto;\r\n}\r\n.text-style{\r\n  letter-spacing: 2px;\r\n  line-height: 40px;\r\n}\r\n.login-style{\r\n  border: 1px solid #fff;\r\n  border-radius: 10px !important;\r\n  &:hover{\r\n    border: 1px solid #fff;\r\n  }\r\n}\r\n.login-btn-word{\r\n  font-size: 22px;\r\n  height: 30px;\r\n  line-height: 30px;\r\n  font-weight: 500;\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!./MsgBox.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!./MsgBox.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./MsgBox.vue?vue&type=template&id=ad00da36&scoped=true&\"\nimport script from \"./MsgBox.vue?vue&type=script&lang=js&\"\nexport * from \"./MsgBox.vue?vue&type=script&lang=js&\"\nimport style0 from \"./MsgBox.vue?vue&type=style&index=0&id=ad00da36&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  \"ad00da36\",\n  null\n  \n)\n\nexport default component.exports","import mod 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!./CreditCardCoin.vue?vue&type=style&index=0&id=5185e1a0&lang=scss&scoped=true&\"; export default mod; 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!./CreditCardCoin.vue?vue&type=style&index=0&id=5185e1a0&lang=scss&scoped=true&\""],"sourceRoot":""}